diff --git a/d2exporter/export.go b/d2exporter/export.go index 73a6e37bd..1eb2e6445 100644 --- a/d2exporter/export.go +++ b/d2exporter/export.go @@ -40,6 +40,11 @@ func applyTheme(shape *d2target.Shape, obj *d2graph.Object, theme *d2themes.Them if obj.Attributes.Shape.Value == d2target.ShapeText { shape.Color = theme.Colors.Neutrals.N1 } + if obj.Attributes.Shape.Value == d2target.ShapeSQLTable || obj.Attributes.Shape.Value == d2target.ShapeClass { + shape.PrimaryAccentColor = theme.Colors.B2 + shape.SecondaryAccentColor = theme.Colors.AA2 + shape.NeutralAccentColor = theme.Colors.Neutrals.N2 + } } func applyStyles(shape *d2target.Shape, obj *d2graph.Object) { diff --git a/d2graph/d2graph.go b/d2graph/d2graph.go index f0ad6e1f7..9f7d6fd3a 100644 --- a/d2graph/d2graph.go +++ b/d2graph/d2graph.go @@ -392,17 +392,23 @@ func (obj *Object) GetFill(theme *d2themes.Theme) string { return theme.Colors.Neutrals.N5 } + if strings.EqualFold(shape, d2target.ShapeSQLTable) || strings.EqualFold(shape, d2target.ShapeClass) { + return theme.Colors.Neutrals.N1 + } + return theme.Colors.Neutrals.N7 } func (obj *Object) GetStroke(theme *d2themes.Theme, dashGapSize interface{}) string { shape := obj.Attributes.Shape.Value if strings.EqualFold(shape, d2target.ShapeCode) || - strings.EqualFold(shape, d2target.ShapeClass) || - strings.EqualFold(shape, d2target.ShapeSQLTable) || strings.EqualFold(shape, d2target.ShapeText) { return theme.Colors.Neutrals.N1 } + if strings.EqualFold(shape, d2target.ShapeClass) || + strings.EqualFold(shape, d2target.ShapeSQLTable) { + return theme.Colors.Neutrals.N7 + } if dashGapSize != 0.0 { return theme.Colors.B2 } diff --git a/d2renderers/d2sketch/sketch.go b/d2renderers/d2sketch/sketch.go index ea3eb941c..afb71c87f 100644 --- a/d2renderers/d2sketch/sketch.go +++ b/d2renderers/d2sketch/sketch.go @@ -66,8 +66,13 @@ func DefineFillPattern() string { func shapeStyle(shape d2target.Shape) string { out := "" - out += fmt.Sprintf(`fill:%s;`, shape.Fill) - out += fmt.Sprintf(`stroke:%s;`, shape.Stroke) + if shape.Type == d2target.ShapeSQLTable || shape.Type == d2target.ShapeClass { + out += fmt.Sprintf(`fill:%s;`, shape.Stroke) + out += fmt.Sprintf(`stroke:%s;`, shape.Fill) + } else { + out += fmt.Sprintf(`fill:%s;`, shape.Fill) + out += fmt.Sprintf(`stroke:%s;`, shape.Stroke) + } out += fmt.Sprintf(`opacity:%f;`, shape.Opacity) out += fmt.Sprintf(`stroke-width:%d;`, shape.StrokeWidth) if shape.StrokeDash != 0 { @@ -226,10 +231,9 @@ func Table(r *Runner, shape d2target.Shape) (string, error) { return "", err } for _, p := range paths { - // TODO header fill output += fmt.Sprintf( ``, - shape.Pos.X, shape.Pos.Y, p, "#0a0f25", + shape.Pos.X, shape.Pos.Y, p, shape.Fill, ) } @@ -241,7 +245,6 @@ func Table(r *Runner, shape d2target.Shape) (string, error) { float64(shape.LabelHeight), ) - // TODO header font color output += fmt.Sprintf(`%s`, "text", tl.X, @@ -249,7 +252,7 @@ func Table(r *Runner, shape d2target.Shape) (string, error) { fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", 4+shape.FontSize, - "white", + shape.Stroke, ), svg.EscapeText(shape.Label), ) @@ -276,31 +279,23 @@ func Table(r *Runner, shape d2target.Shape) (string, error) { float64(shape.FontSize), ) - // TODO theme based - primaryColor := "rgb(13, 50, 178)" - accentColor := "rgb(74, 111, 243)" - neutralColor := "rgb(103, 108, 126)" - output += strings.Join([]string{ fmt.Sprintf(`%s`, nameTL.X, nameTL.Y+float64(shape.FontSize)*3/4, - fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", float64(shape.FontSize), primaryColor), + fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", float64(shape.FontSize), shape.PrimaryAccentColor), svg.EscapeText(f.Name.Label), ), - - // TODO light font fmt.Sprintf(`%s`, nameTL.X+float64(longestNameWidth)+2*d2target.NamePadding, nameTL.Y+float64(shape.FontSize)*3/4, - fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", float64(shape.FontSize), neutralColor), + fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", float64(shape.FontSize), shape.NeutralAccentColor), svg.EscapeText(f.Type.Label), ), - fmt.Sprintf(`%s`, constraintTR.X, constraintTR.Y+float64(shape.FontSize)*3/4, - fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s;letter-spacing:2px;", "end", float64(shape.FontSize), accentColor), + fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s;letter-spacing:2px;", "end", float64(shape.FontSize), shape.SecondaryAccentColor), f.ConstraintAbbr(), ), }, "\n") @@ -316,8 +311,8 @@ func Table(r *Runner, shape d2target.Shape) (string, error) { } for _, p := range paths { output += fmt.Sprintf( - ``, - p, "#0a0f25", + ``, + p, shape.Fill, ) } } @@ -365,10 +360,9 @@ func Class(r *Runner, shape d2target.Shape) (string, error) { return "", err } for _, p := range paths { - // TODO header fill output += fmt.Sprintf( ``, - shape.Pos.X, shape.Pos.Y, p, "#0a0f25", + shape.Pos.X, shape.Pos.Y, p, shape.Fill, ) } @@ -385,7 +379,6 @@ func Class(r *Runner, shape d2target.Shape) (string, error) { float64(shape.LabelHeight), ) - // TODO header font color output += fmt.Sprintf(`%s`, "text", tl.X+float64(shape.LabelWidth)/2, @@ -393,7 +386,7 @@ func Class(r *Runner, shape d2target.Shape) (string, error) { fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "middle", 4+shape.FontSize, - "white", + shape.Stroke, ), svg.EscapeText(shape.Label), ) @@ -402,7 +395,7 @@ func Class(r *Runner, shape d2target.Shape) (string, error) { rowBox := geo.NewBox(box.TopLeft.Copy(), box.Width, rowHeight) rowBox.TopLeft.Y += headerBox.Height for _, f := range shape.Fields { - output += classRow(rowBox, f.VisibilityToken(), f.Name, f.Type, float64(shape.FontSize)) + output += classRow(shape, rowBox, f.VisibilityToken(), f.Name, f.Type, float64(shape.FontSize)) rowBox.TopLeft.Y += rowHeight } @@ -416,19 +409,19 @@ func Class(r *Runner, shape d2target.Shape) (string, error) { for _, p := range paths { output += fmt.Sprintf( ``, - p, "#0a0f25", + p, shape.Fill, ) } for _, m := range shape.Methods { - output += classRow(rowBox, m.VisibilityToken(), m.Name, m.Return, float64(shape.FontSize)) + output += classRow(shape, rowBox, m.VisibilityToken(), m.Name, m.Return, float64(shape.FontSize)) rowBox.TopLeft.Y += rowHeight } return output, nil } -func classRow(box *geo.Box, prefix, nameText, typeText string, fontSize float64) string { +func classRow(shape d2target.Shape, box *geo.Box, prefix, nameText, typeText string, fontSize float64) string { output := "" prefixTL := label.InsideMiddleLeft.GetPointOnBox( box, @@ -443,28 +436,25 @@ func classRow(box *geo.Box, prefix, nameText, typeText string, fontSize float64) fontSize, ) - // TODO theme based - accentColor := "rgb(13, 50, 178)" - output += strings.Join([]string{ fmt.Sprintf(`%s`, prefixTL.X, prefixTL.Y+fontSize*3/4, - fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", fontSize, accentColor), + fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", fontSize, shape.PrimaryAccentColor), prefix, ), fmt.Sprintf(`%s`, prefixTL.X+d2target.PrefixWidth, prefixTL.Y+fontSize*3/4, - fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", fontSize, "black"), + fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s", "start", fontSize, shape.Fill), svg.EscapeText(nameText), ), fmt.Sprintf(`%s`, typeTR.X, typeTR.Y+fontSize*3/4, - fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s;", "end", fontSize, accentColor), + fmt.Sprintf("text-anchor:%s;font-size:%vpx;fill:%s;", "end", fontSize, shape.SecondaryAccentColor), svg.EscapeText(typeText), ), }, "\n") diff --git a/d2renderers/d2sketch/sketch_test.go b/d2renderers/d2sketch/sketch_test.go index 87a2e17a2..e033bedfe 100644 --- a/d2renderers/d2sketch/sketch_test.go +++ b/d2renderers/d2sketch/sketch_test.go @@ -255,7 +255,7 @@ shipments: { shape: sql_table id: int order_id: int - tracking_number: string + tracking_number: string {constraint: primary_key} status: string } diff --git a/d2renderers/d2sketch/testdata/class/sketch.exp.svg b/d2renderers/d2sketch/testdata/class/sketch.exp.svg index ed2b21d25..827658e48 100644 --- a/d2renderers/d2sketch/testdata/class/sketch.exp.svg +++ b/d2renderers/d2sketch/testdata/class/sketch.exp.svg @@ -30,19 +30,19 @@ width="553" height="584" viewBox="-100 -100 553 584">sql_table_overflowshort -loooooooooooooooooooong -loooooooooooooooooooong -short -sql_table_constrained_overflowshort -loooooooooooooooooooong -UNQloooooooooooooooooooong -short -FK +sql_table_overflowshort +loooooooooooooooooooong +loooooooooooooooooooong +short +sql_table_constrained_overflowshort +loooooooooooooooooooong +UNQloooooooooooooooooooong +short +FK sql_table_overflowshort -loooooooooooooooooooong -loooooooooooooooooooong -short -sql_table_constrained_overflowshort -loooooooooooooooooooong -UNQloooooooooooooooooooong -short -FK +sql_table_overflowshort +loooooooooooooooooooong +loooooooooooooooooooong +short +sql_table_constrained_overflowshort +loooooooooooooooooooong +UNQloooooooooooooooooooong +short +FK BatchManager- -num -int- -timeout -int- -pid -+ -getStatus() -Enum+ -getJobs() -Job[]+ -setTimeout(seconds int) -void +BatchManager- +num +int- +timeout +int- +pid ++ +getStatus() +Enum+ +getJobs() +Job[]+ +setTimeout(seconds int) +void BatchManager- -num -int- -timeout -int- -pid -+ -getStatus() -Enum+ -getJobs() -Job[]+ -setTimeout(seconds int) -void +BatchManager- +num +int- +timeout +int- +pid ++ +getStatus() +Enum+ +getJobs() +Job[]+ +setTimeout(seconds int) +void a labelblabelsa class+ -public() bool -void- -private() int -voidcloudyyyy:= 5 +a labelblabelsa class+ +public() bool +void- +private() int +voidcloudyyyy:= 5 := a + 7 -fmt.Printf("%d", b)cyldiadocssix cornersa random iconoverpackdocs pagetoohard o saysinglepersona queuea squarea step at a timedatausersid -int -name -varchar - result := callThisFunction(obj, 5) midthis sideother side +fmt.Printf("%d", b)cyldiadocssix cornersa random iconoverpackdocs pagetoohard o saysinglepersona queuea squarea step at a timedatausersid +int +name +varchar + result := callThisFunction(obj, 5) midthis sideother side diff --git a/e2etests/testdata/stable/sequence_diagram_all_shapes/elk/board.exp.json b/e2etests/testdata/stable/sequence_diagram_all_shapes/elk/board.exp.json index 61504c34e..4b77fb8ae 100644 --- a/e2etests/testdata/stable/sequence_diagram_all_shapes/elk/board.exp.json +++ b/e2etests/testdata/stable/sequence_diagram_all_shapes/elk/board.exp.json @@ -96,7 +96,7 @@ "strokeWidth": 2, "borderRadius": 0, "fill": "#EDF0FD", - "stroke": "#0A0F25", + "stroke": "#FFFFFF", "shadow": false, "3d": false, "multiple": false, @@ -131,7 +131,10 @@ "labelHeight": 36, "labelPosition": "INSIDE_MIDDLE_CENTER", "zIndex": 0, - "level": 1 + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" }, { "id": "d", @@ -798,7 +801,7 @@ "strokeWidth": 2, "borderRadius": 0, "fill": "#EDF0FD", - "stroke": "#0A0F25", + "stroke": "#FFFFFF", "shadow": false, "3d": false, "multiple": false, @@ -879,7 +882,10 @@ "labelHeight": 36, "labelPosition": "INSIDE_MIDDLE_CENTER", "zIndex": 0, - "level": 1 + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" } ], "connections": [ diff --git a/e2etests/testdata/stable/sequence_diagram_all_shapes/elk/sketch.exp.svg b/e2etests/testdata/stable/sequence_diagram_all_shapes/elk/sketch.exp.svg index c23490a3e..c059492d0 100644 --- a/e2etests/testdata/stable/sequence_diagram_all_shapes/elk/sketch.exp.svg +++ b/e2etests/testdata/stable/sequence_diagram_all_shapes/elk/sketch.exp.svg @@ -18,17 +18,17 @@ width="5120" height="2984" viewBox="-76 -26 5120 2984">a labelblabelsa class+ -public() bool -void- -private() int -voidcloudyyyy:= 5 +a labelblabelsa class+ +public() bool +void- +private() int +voidcloudyyyy:= 5 := a + 7 -fmt.Printf("%d", b)cyldiadocssix cornersa random iconoverpackdocs pagetoohard o saysinglepersona queuea squarea step at a timedatausersid -int -name -varchar - result := callThisFunction(obj, 5) midthis sideother side +fmt.Printf("%d", b)cyldiadocssix cornersa random iconoverpackdocs pagetoohard o saysinglepersona queuea squarea step at a timedatausersid +int +name +varchar + result := callThisFunction(obj, 5) midthis sideother side diff --git a/e2etests/testdata/stable/sql_tables/dagre/board.exp.json b/e2etests/testdata/stable/sql_tables/dagre/board.exp.json index a3b85c40e..0fd37e978 100644 --- a/e2etests/testdata/stable/sql_tables/dagre/board.exp.json +++ b/e2etests/testdata/stable/sql_tables/dagre/board.exp.json @@ -9,14 +9,14 @@ "x": 0, "y": 0 }, - "width": 208, + "width": 268, "height": 216, "opacity": 1, "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, - "fill": "#FFFFFF", - "stroke": "#0A0F25", + "fill": "#0A0F25", + "stroke": "#FFFFFF", "shadow": false, "3d": false, "multiple": false, @@ -165,7 +165,7 @@ "labelWidth": 77, "labelHeight": 26 }, - "constraint": "", + "constraint": "primary_key", "reference": "" } ], @@ -180,13 +180,16 @@ "labelWidth": 61, "labelHeight": 36, "zIndex": 0, - "level": 1 + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" }, { "id": "products", "type": "sql_table", "pos": { - "x": 268, + "x": 328, "y": 18 }, "width": 164, @@ -195,8 +198,8 @@ "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, - "fill": "#FFFFFF", - "stroke": "#0A0F25", + "fill": "#0A0F25", + "stroke": "#FFFFFF", "shadow": false, "3d": false, "multiple": false, @@ -332,13 +335,16 @@ "labelWidth": 99, "labelHeight": 36, "zIndex": 0, - "level": 1 + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" }, { "id": "orders", "type": "sql_table", "pos": { - "x": 268, + "x": 328, "y": 316 }, "width": 164, @@ -347,8 +353,8 @@ "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, - "fill": "#FFFFFF", - "stroke": "#0A0F25", + "fill": "#0A0F25", + "stroke": "#FFFFFF", "shadow": false, "3d": false, "multiple": false, @@ -456,13 +462,16 @@ "labelWidth": 74, "labelHeight": 36, "zIndex": 0, - "level": 1 + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" }, { "id": "shipments", "type": "sql_table", "pos": { - "x": 492, + "x": 552, "y": 18 }, "width": 244, @@ -471,8 +480,8 @@ "strokeDash": 0, "strokeWidth": 2, "borderRadius": 0, - "fill": "#FFFFFF", - "stroke": "#0A0F25", + "fill": "#0A0F25", + "stroke": "#FFFFFF", "shadow": false, "3d": false, "multiple": false, @@ -608,7 +617,10 @@ "labelWidth": 116, "labelHeight": 36, "zIndex": 0, - "level": 1 + "level": 1, + "primaryAccentColor": "#0D32B2", + "secondaryAccentColor": "#4A6FF3", + "neutralAccentColor": "#676C7E" } ], "connections": [ @@ -638,20 +650,20 @@ "labelPercentage": 0, "route": [ { - "x": 104, + "x": 134, "y": 216 }, { - "x": 104, + "x": 134, "y": 256 }, { - "x": 136.8, - "y": 282.2 + "x": 172.8, + "y": 283.2 }, { - "x": 268, - "y": 347 + "x": 328, + "y": 352 } ], "isCurve": true, @@ -686,19 +698,19 @@ "labelPercentage": 0, "route": [ { - "x": 350, + "x": 410, "y": 198 }, { - "x": 350, + "x": 410, "y": 252.4 }, { - "x": 350, + "x": 410, "y": 276 }, { - "x": 350, + "x": 410, "y": 316 } ], @@ -734,19 +746,19 @@ "labelPercentage": 0, "route": [ { - "x": 614, + "x": 674, "y": 198 }, { - "x": 614, + "x": 674, "y": 252.4 }, { - "x": 577.6, + "x": 637.6, "y": 282.8 }, { - "x": 432, + "x": 492, "y": 350 } ], diff --git a/e2etests/testdata/stable/sql_tables/dagre/sketch.exp.svg b/e2etests/testdata/stable/sql_tables/dagre/sketch.exp.svg index d6087ea8a..8b78b0f66 100644 --- a/e2etests/testdata/stable/sql_tables/dagre/sketch.exp.svg +++ b/e2etests/testdata/stable/sql_tables/dagre/sketch.exp.svg @@ -2,7 +2,7 @@ usersid +int +name +string +email +string +password +string +last_login +datetime +PKproductsid +int +price +decimal +sku +string +name +string +ordersid +int +user_id +int +product_id +int +shipmentsid +int +order_id +int +tracking_number +string +status +string + + usersid -int -name -string -email -string -password -string -last_login -datetime -productsid -int -price -decimal -sku -string -name -string -ordersid -int -user_id -int -product_id -int -shipmentsid -int -order_id -int -tracking_number -string -status -string - - +usersid +int +name +string +email +string +password +string +last_login +datetime +PKproductsid +int +price +decimal +sku +string +name +string +ordersid +int +user_id +int +product_id +int +shipmentsid +int +order_id +int +tracking_number +string +status +string + +