diff --git a/ci/release/changelogs/next.md b/ci/release/changelogs/next.md index 685665e2f..9705e0993 100644 --- a/ci/release/changelogs/next.md +++ b/ci/release/changelogs/next.md @@ -8,6 +8,7 @@ - Arrowhead labels are now supported. [#182](https://github.com/terrastruct/d2/pull/182) - `stroke-dash` on shapes is now supported. [#188](https://github.com/terrastruct/d2/issues/188) - `font-color` is now supported on shapes and connections. [#215](https://github.com/terrastruct/d2/pull/215) +- `font-size` is now supported on shapes and connections. [#250](https://github.com/terrastruct/d2/pull/250) - Querying shapes and connections by ID is now supported in renders. [#218](https://github.com/terrastruct/d2/pull/218) - [install.sh](./install.sh) now accepts `-d` as an alias for `--dry-run`. [#266](https://github.com/terrastruct/d2/pull/266) diff --git a/d2graph/d2graph.go b/d2graph/d2graph.go index c8f50330b..5e3f5e566 100644 --- a/d2graph/d2graph.go +++ b/d2graph/d2graph.go @@ -417,6 +417,9 @@ func (obj *Object) Text() *d2target.MText { if obj.IsContainer() { fontSize = obj.Level().LabelSize() } + if obj.Attributes.Style.FontSize != nil { + fontSize, _ = strconv.Atoi(obj.Attributes.Style.FontSize.Value) + } // Class and Table objects have Label set to header if obj.Class != nil || obj.SQLTable != nil { fontSize = d2fonts.FONT_SIZE_XL @@ -666,9 +669,13 @@ func (e *Edge) ArrowString() string { } func (e *Edge) Text() *d2target.MText { + fontSize := d2fonts.FONT_SIZE_M + if e.Attributes.Style.FontSize != nil { + fontSize, _ = strconv.Atoi(e.Attributes.Style.FontSize.Value) + } return &d2target.MText{ Text: e.Attributes.Label.Value, - FontSize: d2fonts.FONT_SIZE_M, + FontSize: fontSize, IsBold: false, IsItalic: true, diff --git a/d2renderers/textmeasure/markdown.go b/d2renderers/textmeasure/markdown.go index 056af2f77..e625e9597 100644 --- a/d2renderers/textmeasure/markdown.go +++ b/d2renderers/textmeasure/markdown.go @@ -4,7 +4,6 @@ import ( "bytes" "math" "strings" - "unicode/utf8" "github.com/PuerkitoBio/goquery" "github.com/yuin/goldmark" @@ -212,20 +211,17 @@ func (ruler *Ruler) measureNode(depth int, n *html.Node, font d2fonts.Font) bloc if strings.TrimSpace(n.Data) == "" { return blockAttrs{} } - spaceWidths := 0. - - // consecutive leading/trailing spaces end up rendered as a single space - spaceRune, _ := utf8.DecodeRuneInString(" ") - // measure will not include leading or trailing whitespace, so we have to add in the space width - spaceWidth := ruler.atlases[font].glyph(spaceRune).advance - str := n.Data isCode := parentElementType == "pre" || parentElementType == "code" + spaceWidths := 0. if !isCode { + spaceWidth := ruler.spaceWidth(font) + // MeasurePrecise will not include leading or trailing whitespace, so we account for it here str = strings.ReplaceAll(str, "\n", " ") str = strings.ReplaceAll(str, "\t", " ") if strings.HasPrefix(str, " ") { + // consecutive leading/trailing spaces end up rendered as a single space str = strings.TrimPrefix(str, " ") if hasPrev(n) { spaceWidths += spaceWidth diff --git a/d2renderers/textmeasure/textmeasure.go b/d2renderers/textmeasure/textmeasure.go index 4a96c0c3a..5eb309ae4 100644 --- a/d2renderers/textmeasure/textmeasure.go +++ b/d2renderers/textmeasure/textmeasure.go @@ -76,6 +76,8 @@ type Ruler struct { atlases map[d2fonts.Font]*atlas + ttfs map[d2fonts.Font]*truetype.Font + buf []byte prevR rune bounds *rect @@ -97,49 +99,52 @@ type Ruler struct { // }) // txt := text.New(orig, text.NewAtlas(face, text.ASCII)) func NewRuler() (*Ruler, error) { - lineHeights := make(map[d2fonts.Font]float64) - tabWidths := make(map[d2fonts.Font]float64) - atlases := make(map[d2fonts.Font]*atlas) + origin := geo.NewPoint(0, 0) + r := &Ruler{ + Orig: origin, + Dot: origin.Copy(), + LineHeightFactor: 1., + lineHeights: make(map[d2fonts.Font]float64), + tabWidths: make(map[d2fonts.Font]float64), + atlases: make(map[d2fonts.Font]*atlas), + ttfs: make(map[d2fonts.Font]*truetype.Font), + } for _, fontFamily := range d2fonts.FontFamilies { - for _, fontSize := range d2fonts.FontSizes { - for _, fontStyle := range d2fonts.FontStyles { - font := d2fonts.Font{ - Family: fontFamily, - Style: fontStyle, - } - if _, ok := d2fonts.FontFaces[font]; !ok { - continue - } + for _, fontStyle := range d2fonts.FontStyles { + font := d2fonts.Font{ + Family: fontFamily, + Style: fontStyle, + } + // Note: FontFaces lookup is size-agnostic + if _, ok := d2fonts.FontFaces[font]; !ok { + continue + } + if _, loaded := r.ttfs[font]; !loaded { ttf, err := truetype.Parse(d2fonts.FontFaces[font]) if err != nil { return nil, err } - // Added after, since FontFaces lookup is size-agnostic - font.Size = fontSize - face := truetype.NewFace(ttf, &truetype.Options{ - Size: float64(fontSize), - }) - atlas := NewAtlas(face, ASCII) - atlases[font] = atlas - lineHeights[font] = atlas.lineHeight - tabWidths[font] = atlas.glyph(' ').advance * TAB_SIZE + r.ttfs[font] = ttf } } } - origin := geo.NewPoint(0, 0) - txt := &Ruler{ - Orig: origin, - Dot: origin.Copy(), - LineHeightFactor: 1., - lineHeights: lineHeights, - tabWidths: tabWidths, - atlases: atlases, - } - txt.clear() + r.clear() - return txt, nil + return r, nil +} + +func (r *Ruler) addFontSize(font d2fonts.Font) { + sizeless := font + sizeless.Size = 0 + face := truetype.NewFace(r.ttfs[sizeless], &truetype.Options{ + Size: float64(font.Size), + }) + atlas := NewAtlas(face, ASCII) + r.atlases[font] = atlas + r.lineHeights[font] = atlas.lineHeight + r.tabWidths[font] = atlas.glyph(' ').advance * TAB_SIZE } func (t *Ruler) Measure(font d2fonts.Font, s string) (width, height int) { @@ -148,6 +153,9 @@ func (t *Ruler) Measure(font d2fonts.Font, s string) (width, height int) { } func (t *Ruler) MeasurePrecise(font d2fonts.Font, s string) (width, height float64) { + if _, ok := t.atlases[font]; !ok { + t.addFontSize(font) + } t.clear() t.buf = append(t.buf, s...) t.drawBuf(font) @@ -216,3 +224,11 @@ func (txt *Ruler) drawBuf(font d2fonts.Font) { } } } + +func (ruler *Ruler) spaceWidth(font d2fonts.Font) float64 { + if _, has := ruler.atlases[font]; !has { + ruler.addFontSize(font) + } + spaceRune, _ := utf8.DecodeRuneInString(" ") + return ruler.atlases[font].glyph(spaceRune).advance +} diff --git a/e2etests/stable_test.go b/e2etests/stable_test.go index 02b66f0a3..f75a8d6e3 100644 --- a/e2etests/stable_test.go +++ b/e2etests/stable_test.go @@ -1014,6 +1014,34 @@ cube: { stroke-width: 7 } } +`, + }, + { + name: "font_sizes", + script: ` +size XS.style.font-size: 13 +size S.style.font-size: 14 +size M.style.font-size: 16 +size L.style.font-size: 20 +size XL.style.font-size: 24 +size XXL.style.font-size: 28 +size XXXL.style.font-size: 32 + +custom 8.style.font-size: 8 +custom 12.style.font-size: 12 +custom 18.style.font-size: 18 +custom 21.style.font-size: 21 +custom 64.style.font-size: 64 + +custom 8 -> size XS: custom 10 { + style.font-size: 10 +} +size S -> size M: custom 15 { + style.font-size: 15 +} +size XXXL -> custom 64: custom 48 { + style.font-size: 48 +} `, }, } diff --git a/e2etests/testdata/stable/font_sizes/dagre/board.exp.json b/e2etests/testdata/stable/font_sizes/dagre/board.exp.json new file mode 100644 index 000000000..7203ab80f --- /dev/null +++ b/e2etests/testdata/stable/font_sizes/dagre/board.exp.json @@ -0,0 +1,604 @@ +{ + "name": "", + "shapes": [ + { + "id": "size XS", + "type": "", + "pos": { + "x": 1293, + "y": 278 + }, + "width": 145, + "height": 122, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size XS", + "fontSize": 13, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 45, + "labelHeight": 22, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size S", + "type": "", + "pos": { + "x": 4, + "y": 12 + }, + "width": 140, + "height": 123, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size S", + "fontSize": 14, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 40, + "labelHeight": 23, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size M", + "type": "", + "pos": { + "x": 0, + "y": 276 + }, + "width": 147, + "height": 126, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size M", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 47, + "labelHeight": 26, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size L", + "type": "", + "pos": { + "x": 204, + "y": 8 + }, + "width": 153, + "height": 131, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size L", + "fontSize": 20, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 53, + "labelHeight": 31, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size XL", + "type": "", + "pos": { + "x": 417, + "y": 5 + }, + "width": 177, + "height": 136, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size XL", + "fontSize": 24, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 77, + "labelHeight": 36, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size XXL", + "type": "", + "pos": { + "x": 654, + "y": 3 + }, + "width": 204, + "height": 141, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size XXL", + "fontSize": 28, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 104, + "labelHeight": 41, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size XXXL", + "type": "", + "pos": { + "x": 918, + "y": 0 + }, + "width": 237, + "height": 146, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size XXXL", + "fontSize": 32, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 137, + "labelHeight": 46, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 8", + "type": "", + "pos": { + "x": 1297, + "y": 15 + }, + "width": 137, + "height": 116, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 8", + "fontSize": 8, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 37, + "labelHeight": 16, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 12", + "type": "", + "pos": { + "x": 1494, + "y": 13 + }, + "width": 160, + "height": 121, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 12", + "fontSize": 12, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 60, + "labelHeight": 21, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 18", + "type": "", + "pos": { + "x": 1714, + "y": 9 + }, + "width": 186, + "height": 128, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 18", + "fontSize": 18, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 86, + "labelHeight": 28, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 21", + "type": "", + "pos": { + "x": 1960, + "y": 7 + }, + "width": 200, + "height": 132, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 21", + "fontSize": 21, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 100, + "labelHeight": 32, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 64", + "type": "", + "pos": { + "x": 840, + "y": 246 + }, + "width": 393, + "height": 186, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 64", + "fontSize": 64, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 293, + "labelHeight": 86, + "labelPosition": "INSIDE_MIDDLE_CENTER" + } + ], + "connections": [ + { + "id": "(custom 8 -> size XS)[0]", + "src": "custom 8", + "srcArrow": "none", + "srcLabel": "", + "dst": "size XS", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "custom 10", + "fontSize": 10, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 42, + "labelHeight": 13, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 1365, + "y": 131 + }, + { + "x": 1365, + "y": 183 + }, + { + "x": 1365, + "y": 212.4 + }, + { + "x": 1365, + "y": 278 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(size S -> size M)[0]", + "src": "size S", + "srcArrow": "none", + "srcLabel": "", + "dst": "size M", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "custom 15", + "fontSize": 15, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 64, + "labelHeight": 19, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 73.5, + "y": 135.5 + }, + { + "x": 73.5, + "y": 183.9 + }, + { + "x": 73.5, + "y": 212 + }, + { + "x": 73.5, + "y": 276 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(size XXXL -> custom 64)[0]", + "src": "size XXXL", + "srcArrow": "none", + "srcLabel": "", + "dst": "custom 64", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "custom 48", + "fontSize": 48, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 199, + "labelHeight": 61, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 1036, + "y": 146 + }, + { + "x": 1036, + "y": 186 + }, + { + "x": 1036, + "y": 206 + }, + { + "x": 1036, + "y": 246 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null + } + ] +} diff --git a/e2etests/testdata/stable/font_sizes/dagre/sketch.exp.svg b/e2etests/testdata/stable/font_sizes/dagre/sketch.exp.svg new file mode 100644 index 000000000..29d19e482 --- /dev/null +++ b/e2etests/testdata/stable/font_sizes/dagre/sketch.exp.svg @@ -0,0 +1,40 @@ + +size XSsize Ssize Msize Lsize XLsize XXLsize XXXLcustom 8custom 12custom 18custom 21custom 64 + + +custom 10 + + +custom 15 + + +custom 48 \ No newline at end of file diff --git a/e2etests/testdata/stable/font_sizes/elk/board.exp.json b/e2etests/testdata/stable/font_sizes/elk/board.exp.json new file mode 100644 index 000000000..1774abec5 --- /dev/null +++ b/e2etests/testdata/stable/font_sizes/elk/board.exp.json @@ -0,0 +1,577 @@ +{ + "name": "", + "shapes": [ + { + "id": "size XS", + "type": "", + "pos": { + "x": 1465, + "y": 419 + }, + "width": 145, + "height": 122, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size XS", + "fontSize": 13, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 45, + "labelHeight": 22, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size S", + "type": "", + "pos": { + "x": 1634, + "y": 35 + }, + "width": 140, + "height": 123, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size S", + "fontSize": 14, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 40, + "labelHeight": 23, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size M", + "type": "", + "pos": { + "x": 1630, + "y": 419 + }, + "width": 147, + "height": 126, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size M", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 47, + "labelHeight": 26, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size L", + "type": "", + "pos": { + "x": 1116, + "y": 20 + }, + "width": 153, + "height": 131, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size L", + "fontSize": 20, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 53, + "labelHeight": 31, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size XL", + "type": "", + "pos": { + "x": 12, + "y": 17 + }, + "width": 177, + "height": 136, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size XL", + "fontSize": 24, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 77, + "labelHeight": 36, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size XXL", + "type": "", + "pos": { + "x": 429, + "y": 15 + }, + "width": 204, + "height": 141, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size XXL", + "fontSize": 28, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 104, + "labelHeight": 41, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "size XXXL", + "type": "", + "pos": { + "x": 653, + "y": 12 + }, + "width": 237, + "height": 146, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "size XXXL", + "fontSize": 32, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 137, + "labelHeight": 46, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 8", + "type": "", + "pos": { + "x": 1469, + "y": 42 + }, + "width": 137, + "height": 116, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 8", + "fontSize": 8, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 37, + "labelHeight": 16, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 12", + "type": "", + "pos": { + "x": 1289, + "y": 25 + }, + "width": 160, + "height": 121, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 12", + "fontSize": 12, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 60, + "labelHeight": 21, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 18", + "type": "", + "pos": { + "x": 910, + "y": 21 + }, + "width": 186, + "height": 128, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 18", + "fontSize": 18, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 86, + "labelHeight": 28, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 21", + "type": "", + "pos": { + "x": 209, + "y": 19 + }, + "width": 200, + "height": 132, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 21", + "fontSize": 21, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 100, + "labelHeight": 32, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "custom 64", + "type": "", + "pos": { + "x": 575, + "y": 419 + }, + "width": 393, + "height": 186, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "custom 64", + "fontSize": 64, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 293, + "labelHeight": 86, + "labelPosition": "INSIDE_MIDDLE_CENTER" + } + ], + "connections": [ + { + "id": "(custom 8 -> size XS)[0]", + "src": "custom 8", + "srcArrow": "none", + "srcLabel": "", + "dst": "size XS", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "custom 10", + "fontSize": 10, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 42, + "labelHeight": 13, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 1537.5, + "y": 158 + }, + { + "x": 1537.5, + "y": 419 + } + ], + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(size S -> size M)[0]", + "src": "size S", + "srcArrow": "none", + "srcLabel": "", + "dst": "size M", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "custom 15", + "fontSize": 15, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 64, + "labelHeight": 19, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 1703.5, + "y": 158 + }, + { + "x": 1703.5, + "y": 419 + } + ], + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(size XXXL -> custom 64)[0]", + "src": "size XXXL", + "srcArrow": "none", + "srcLabel": "", + "dst": "custom 64", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "custom 48", + "fontSize": 48, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 199, + "labelHeight": 61, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 771.5, + "y": 158 + }, + { + "x": 771.5, + "y": 419 + } + ], + "animated": false, + "tooltip": "", + "icon": null + } + ] +} diff --git a/e2etests/testdata/stable/font_sizes/elk/sketch.exp.svg b/e2etests/testdata/stable/font_sizes/elk/sketch.exp.svg new file mode 100644 index 000000000..4b03d1152 --- /dev/null +++ b/e2etests/testdata/stable/font_sizes/elk/sketch.exp.svg @@ -0,0 +1,40 @@ + +size XSsize Ssize Msize Lsize XLsize XXLsize XXXLcustom 8custom 12custom 18custom 21custom 64 + + +custom 10 + + +custom 15 + + +custom 48 \ No newline at end of file diff --git a/e2etests/testdata/todo/font_sizes_containers_large/dagre/board.exp.json b/e2etests/testdata/todo/font_sizes_containers_large/dagre/board.exp.json new file mode 100644 index 000000000..ee21cb13b --- /dev/null +++ b/e2etests/testdata/todo/font_sizes_containers_large/dagre/board.exp.json @@ -0,0 +1,196 @@ +{ + "name": "", + "shapes": [ + { + "id": "ninety nine", + "type": "", + "pos": { + "x": 0, + "y": 0 + }, + "width": 464, + "height": 516, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#E3E9FD", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "ninety nine", + "fontSize": 99, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 457, + "labelHeight": 130, + "labelPosition": "INSIDE_TOP_CENTER" + }, + { + "id": "ninety nine.sixty four", + "type": "", + "pos": { + "x": 40, + "y": 50 + }, + "width": 384, + "height": 416, + "level": 2, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#EDF0FD", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "sixty four", + "fontSize": 64, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 251, + "labelHeight": 86, + "labelPosition": "INSIDE_TOP_CENTER" + }, + { + "id": "ninety nine.sixty four.thirty two", + "type": "", + "pos": { + "x": 80, + "y": 100 + }, + "width": 304, + "height": 316, + "level": 3, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "thirty two", + "fontSize": 32, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 135, + "labelHeight": 46, + "labelPosition": "INSIDE_TOP_CENTER" + }, + { + "id": "ninety nine.sixty four.thirty two.sixteen", + "type": "", + "pos": { + "x": 120, + "y": 150 + }, + "width": 224, + "height": 216, + "level": 4, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#FFFFFF", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "sixteen", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 53, + "labelHeight": 26, + "labelPosition": "INSIDE_TOP_CENTER" + }, + { + "id": "ninety nine.sixty four.thirty two.sixteen.eight", + "type": "", + "pos": { + "x": 170, + "y": 200 + }, + "width": 124, + "height": 116, + "level": 5, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#FFFFFF", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "eight", + "fontSize": 8, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 24, + "labelHeight": 16, + "labelPosition": "INSIDE_MIDDLE_CENTER" + } + ], + "connections": [] +} diff --git a/e2etests/testdata/todo/font_sizes_containers_large/dagre/sketch.exp.svg b/e2etests/testdata/todo/font_sizes_containers_large/dagre/sketch.exp.svg new file mode 100644 index 000000000..4b27ffa33 --- /dev/null +++ b/e2etests/testdata/todo/font_sizes_containers_large/dagre/sketch.exp.svg @@ -0,0 +1,24 @@ + +ninety ninesixty fourthirty twosixteeneight \ No newline at end of file diff --git a/e2etests/testdata/todo/font_sizes_containers_large/elk/board.exp.json b/e2etests/testdata/todo/font_sizes_containers_large/elk/board.exp.json new file mode 100644 index 000000000..fedf207ad --- /dev/null +++ b/e2etests/testdata/todo/font_sizes_containers_large/elk/board.exp.json @@ -0,0 +1,196 @@ +{ + "name": "", + "shapes": [ + { + "id": "ninety nine", + "type": "", + "pos": { + "x": 12, + "y": 12 + }, + "width": 724, + "height": 716, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#E3E9FD", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "ninety nine", + "fontSize": 99, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 457, + "labelHeight": 130, + "labelPosition": "INSIDE_TOP_CENTER" + }, + { + "id": "ninety nine.sixty four", + "type": "", + "pos": { + "x": 87, + "y": 87 + }, + "width": 574, + "height": 566, + "level": 2, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#EDF0FD", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "sixty four", + "fontSize": 64, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 251, + "labelHeight": 86, + "labelPosition": "INSIDE_TOP_CENTER" + }, + { + "id": "ninety nine.sixty four.thirty two", + "type": "", + "pos": { + "x": 162, + "y": 162 + }, + "width": 424, + "height": 416, + "level": 3, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "thirty two", + "fontSize": 32, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 135, + "labelHeight": 46, + "labelPosition": "INSIDE_TOP_CENTER" + }, + { + "id": "ninety nine.sixty four.thirty two.sixteen", + "type": "", + "pos": { + "x": 237, + "y": 237 + }, + "width": 274, + "height": 266, + "level": 4, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#FFFFFF", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "sixteen", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 53, + "labelHeight": 26, + "labelPosition": "INSIDE_TOP_CENTER" + }, + { + "id": "ninety nine.sixty four.thirty two.sixteen.eight", + "type": "", + "pos": { + "x": 312, + "y": 312 + }, + "width": 124, + "height": 116, + "level": 5, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#FFFFFF", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "eight", + "fontSize": 8, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 24, + "labelHeight": 16, + "labelPosition": "INSIDE_MIDDLE_CENTER" + } + ], + "connections": [] +} diff --git a/e2etests/testdata/todo/font_sizes_containers_large/elk/sketch.exp.svg b/e2etests/testdata/todo/font_sizes_containers_large/elk/sketch.exp.svg new file mode 100644 index 000000000..39dd19532 --- /dev/null +++ b/e2etests/testdata/todo/font_sizes_containers_large/elk/sketch.exp.svg @@ -0,0 +1,24 @@ + +ninety ninesixty fourthirty twosixteeneight \ No newline at end of file diff --git a/e2etests/testdata/todo/font_sizes_large/dagre/board.exp.json b/e2etests/testdata/todo/font_sizes_large/dagre/board.exp.json new file mode 100644 index 000000000..f39dc61a3 --- /dev/null +++ b/e2etests/testdata/todo/font_sizes_large/dagre/board.exp.json @@ -0,0 +1,385 @@ +{ + "name": "", + "shapes": [ + { + "id": "eight", + "type": "", + "pos": { + "x": 233, + "y": 0 + }, + "width": 124, + "height": 116, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "eight", + "fontSize": 8, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 24, + "labelHeight": 16, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "sixteen", + "type": "", + "pos": { + "x": 216, + "y": 216 + }, + "width": 157, + "height": 126, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "sixteen", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 57, + "labelHeight": 26, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "thirty two", + "type": "", + "pos": { + "x": 171, + "y": 442 + }, + "width": 247, + "height": 146, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "thirty two", + "fontSize": 32, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 147, + "labelHeight": 46, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "sixty four", + "type": "", + "pos": { + "x": 108, + "y": 688 + }, + "width": 374, + "height": 186, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "sixty four", + "fontSize": 64, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 274, + "labelHeight": 86, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "ninety nine", + "type": "", + "pos": { + "x": 0, + "y": 974 + }, + "width": 589, + "height": 230, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "ninety nine", + "fontSize": 99, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 489, + "labelHeight": 130, + "labelPosition": "INSIDE_MIDDLE_CENTER" + } + ], + "connections": [ + { + "id": "(eight -> sixteen)[0]", + "src": "eight", + "srcArrow": "none", + "srcLabel": "", + "dst": "sixteen", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "twelve", + "fontSize": 12, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 33, + "labelHeight": 16, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 294.5, + "y": 116 + }, + { + "x": 294.5, + "y": 156 + }, + { + "x": 294.5, + "y": 176 + }, + { + "x": 294.5, + "y": 216 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(sixteen -> thirty two)[0]", + "src": "sixteen", + "srcArrow": "none", + "srcLabel": "", + "dst": "thirty two", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "twenty four", + "fontSize": 24, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 114, + "labelHeight": 31, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 294.5, + "y": 342 + }, + { + "x": 294.5, + "y": 382 + }, + { + "x": 294.5, + "y": 402 + }, + { + "x": 294.5, + "y": 442 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(thirty two -> sixty four)[0]", + "src": "thirty two", + "srcArrow": "none", + "srcLabel": "", + "dst": "sixty four", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "forty eight", + "fontSize": 48, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 202, + "labelHeight": 61, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 294.5, + "y": 588 + }, + { + "x": 294.5, + "y": 628 + }, + { + "x": 294.5, + "y": 648 + }, + { + "x": 294.5, + "y": 688 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(sixty four -> ninety nine)[0]", + "src": "sixty four", + "srcArrow": "none", + "srcLabel": "", + "dst": "ninety nine", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "eighty one", + "fontSize": 81, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 341, + "labelHeight": 102, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 294.5, + "y": 874 + }, + { + "x": 294.5, + "y": 914 + }, + { + "x": 294.5, + "y": 934 + }, + { + "x": 294.5, + "y": 974 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null + } + ] +} diff --git a/e2etests/testdata/todo/font_sizes_large/dagre/sketch.exp.svg b/e2etests/testdata/todo/font_sizes_large/dagre/sketch.exp.svg new file mode 100644 index 000000000..34988351e --- /dev/null +++ b/e2etests/testdata/todo/font_sizes_large/dagre/sketch.exp.svg @@ -0,0 +1,43 @@ + +eightsixteenthirty twosixty fourninety nine + + +twelve + + +twenty four + + +forty eight + + +eighty one \ No newline at end of file diff --git a/e2etests/testdata/todo/font_sizes_large/elk/board.exp.json b/e2etests/testdata/todo/font_sizes_large/elk/board.exp.json new file mode 100644 index 000000000..56c5b5401 --- /dev/null +++ b/e2etests/testdata/todo/font_sizes_large/elk/board.exp.json @@ -0,0 +1,349 @@ +{ + "name": "", + "shapes": [ + { + "id": "eight", + "type": "", + "pos": { + "x": 293, + "y": 12 + }, + "width": 124, + "height": 116, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "eight", + "fontSize": 8, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 24, + "labelHeight": 16, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "sixteen", + "type": "", + "pos": { + "x": 277, + "y": 344 + }, + "width": 157, + "height": 126, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "sixteen", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 57, + "labelHeight": 26, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "thirty two", + "type": "", + "pos": { + "x": 232, + "y": 701 + }, + "width": 247, + "height": 146, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "thirty two", + "fontSize": 32, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 147, + "labelHeight": 46, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "sixty four", + "type": "", + "pos": { + "x": 168, + "y": 1108 + }, + "width": 374, + "height": 186, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "sixty four", + "fontSize": 64, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 274, + "labelHeight": 86, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "ninety nine", + "type": "", + "pos": { + "x": 61, + "y": 1596 + }, + "width": 589, + "height": 230, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "ninety nine", + "fontSize": 99, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 489, + "labelHeight": 130, + "labelPosition": "INSIDE_MIDDLE_CENTER" + } + ], + "connections": [ + { + "id": "(eight -> sixteen)[0]", + "src": "eight", + "srcArrow": "none", + "srcLabel": "", + "dst": "sixteen", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "twelve", + "fontSize": 12, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 33, + "labelHeight": 16, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 355, + "y": 128 + }, + { + "x": 355, + "y": 344 + } + ], + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(sixteen -> thirty two)[0]", + "src": "sixteen", + "srcArrow": "none", + "srcLabel": "", + "dst": "thirty two", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "twenty four", + "fontSize": 24, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 114, + "labelHeight": 31, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 355, + "y": 470 + }, + { + "x": 355, + "y": 701 + } + ], + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(thirty two -> sixty four)[0]", + "src": "thirty two", + "srcArrow": "none", + "srcLabel": "", + "dst": "sixty four", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "forty eight", + "fontSize": 48, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 202, + "labelHeight": 61, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 355, + "y": 847 + }, + { + "x": 355, + "y": 1108 + } + ], + "animated": false, + "tooltip": "", + "icon": null + }, + { + "id": "(sixty four -> ninety nine)[0]", + "src": "sixty four", + "srcArrow": "none", + "srcLabel": "", + "dst": "ninety nine", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "eighty one", + "fontSize": 81, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 341, + "labelHeight": 102, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 355, + "y": 1294 + }, + { + "x": 355, + "y": 1596 + } + ], + "animated": false, + "tooltip": "", + "icon": null + } + ] +} diff --git a/e2etests/testdata/todo/font_sizes_large/elk/sketch.exp.svg b/e2etests/testdata/todo/font_sizes_large/elk/sketch.exp.svg new file mode 100644 index 000000000..7dcdaf0d5 --- /dev/null +++ b/e2etests/testdata/todo/font_sizes_large/elk/sketch.exp.svg @@ -0,0 +1,43 @@ + +eightsixteenthirty twosixty fourninety nine + + +twelve + + +twenty four + + +forty eight + + +eighty one \ No newline at end of file diff --git a/e2etests/testdata/todo/tall_edge_label/dagre/board.exp.json b/e2etests/testdata/todo/tall_edge_label/dagre/board.exp.json new file mode 100644 index 000000000..2de602438 --- /dev/null +++ b/e2etests/testdata/todo/tall_edge_label/dagre/board.exp.json @@ -0,0 +1,130 @@ +{ + "name": "", + "shapes": [ + { + "id": "a", + "type": "", + "pos": { + "x": 0, + "y": 0 + }, + "width": 113, + "height": 126, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "a", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 13, + "labelHeight": 26, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "b", + "type": "", + "pos": { + "x": 0, + "y": 226 + }, + "width": 113, + "height": 126, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "b", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 13, + "labelHeight": 26, + "labelPosition": "INSIDE_MIDDLE_CENTER" + } + ], + "connections": [ + { + "id": "(a -> b)[0]", + "src": "a", + "srcArrow": "none", + "srcLabel": "", + "dst": "b", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "There\nonce\nwas\na\nvery\ntall\nedge\nlabel", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 38, + "labelHeight": 133, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 56.5, + "y": 126 + }, + { + "x": 56.5, + "y": 166 + }, + { + "x": 56.5, + "y": 186 + }, + { + "x": 56.5, + "y": 226 + } + ], + "isCurve": true, + "animated": false, + "tooltip": "", + "icon": null + } + ] +} diff --git a/e2etests/testdata/todo/tall_edge_label/dagre/sketch.exp.svg b/e2etests/testdata/todo/tall_edge_label/dagre/sketch.exp.svg new file mode 100644 index 000000000..986f6e3a5 --- /dev/null +++ b/e2etests/testdata/todo/tall_edge_label/dagre/sketch.exp.svg @@ -0,0 +1,34 @@ + +ab + + +Thereoncewasaverytalledgelabel \ No newline at end of file diff --git a/e2etests/testdata/todo/tall_edge_label/elk/board.exp.json b/e2etests/testdata/todo/tall_edge_label/elk/board.exp.json new file mode 100644 index 000000000..7b6dc1dad --- /dev/null +++ b/e2etests/testdata/todo/tall_edge_label/elk/board.exp.json @@ -0,0 +1,121 @@ +{ + "name": "", + "shapes": [ + { + "id": "a", + "type": "", + "pos": { + "x": 12, + "y": 12 + }, + "width": 113, + "height": 126, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "a", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 13, + "labelHeight": 26, + "labelPosition": "INSIDE_MIDDLE_CENTER" + }, + { + "id": "b", + "type": "", + "pos": { + "x": 12, + "y": 471 + }, + "width": 113, + "height": 126, + "level": 1, + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "borderRadius": 0, + "fill": "#F7F8FE", + "stroke": "#0D32B2", + "shadow": false, + "3d": false, + "multiple": false, + "tooltip": "", + "link": "", + "icon": null, + "iconPosition": "", + "fields": null, + "methods": null, + "columns": null, + "label": "b", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#0A0F25", + "italic": false, + "bold": true, + "underline": false, + "labelWidth": 13, + "labelHeight": 26, + "labelPosition": "INSIDE_MIDDLE_CENTER" + } + ], + "connections": [ + { + "id": "(a -> b)[0]", + "src": "a", + "srcArrow": "none", + "srcLabel": "", + "dst": "b", + "dstArrow": "triangle", + "dstLabel": "", + "opacity": 1, + "strokeDash": 0, + "strokeWidth": 2, + "stroke": "#0D32B2", + "label": "There\nonce\nwas\na\nvery\ntall\nedge\nlabel", + "fontSize": 16, + "fontFamily": "DEFAULT", + "language": "", + "color": "#676C7E", + "italic": true, + "bold": false, + "underline": false, + "labelWidth": 38, + "labelHeight": 133, + "labelPosition": "INSIDE_MIDDLE_CENTER", + "labelPercentage": 0, + "route": [ + { + "x": 68.5, + "y": 138 + }, + { + "x": 68.5, + "y": 471 + } + ], + "animated": false, + "tooltip": "", + "icon": null + } + ] +} diff --git a/e2etests/testdata/todo/tall_edge_label/elk/sketch.exp.svg b/e2etests/testdata/todo/tall_edge_label/elk/sketch.exp.svg new file mode 100644 index 000000000..fd896fed3 --- /dev/null +++ b/e2etests/testdata/todo/tall_edge_label/elk/sketch.exp.svg @@ -0,0 +1,34 @@ + +ab + + +Thereoncewasaverytalledgelabel \ No newline at end of file diff --git a/e2etests/todo_test.go b/e2etests/todo_test.go index 4ec848e48..a0cecce13 100644 --- a/e2etests/todo_test.go +++ b/e2etests/todo_test.go @@ -13,6 +13,58 @@ func testTodo(t *testing.T) { script: ` container.first -> container.second: 1->2 container -> container.second: c->2 +`, + }, + { + // issue https://github.com/terrastruct/d2/issues/263 + name: "tall_edge_label", + script: ` +a -> b: There\nonce\nwas\na\nvery\ntall\nedge\nlabel +`, + }, + { + // issue https://github.com/terrastruct/d2/issues/263 + name: "font_sizes_large", + script: ` +eight.style.font-size: 8 +sixteen.style.font-size: 16 +thirty two.style.font-size: 32 +sixty four.style.font-size: 64 +ninety nine.style.font-size: 99 + +eight -> sixteen : twelve { + style.font-size: 12 +} +sixteen -> thirty two : twenty four { + style.font-size: 24 +} +thirty two -> sixty four: forty eight { + style.font-size: 48 +} +sixty four -> ninety nine: eighty one { + style.font-size: 81 +} +`, + }, + { + // issue https://github.com/terrastruct/d2/issues/19 + name: "font_sizes_containers_large", + script: ` +ninety nine: { + style.font-size: 99 + sixty four: { + style.font-size: 64 + thirty two:{ + style.font-size: 32 + sixteen: { + style.font-size: 16 + eight: { + style.font-size: 8 + } + } + } + } +} `, }, }