diff --git a/ci/release/changelogs/next.md b/ci/release/changelogs/next.md
index cddda9036..a8a1cb5ec 100644
--- a/ci/release/changelogs/next.md
+++ b/ci/release/changelogs/next.md
@@ -1,7 +1,7 @@
#### Features ๐
- Export diagrams to `.pptx` (PowerPoint)[#1139](https://github.com/terrastruct/d2/pull/1139)
-- Customize gap size in grid diagrams with `grid-gap`, `grid-gap-rows`, or `grid-gap-columns` [#1178](https://github.com/terrastruct/d2/issues/1178)
+- Customize gap size in grid diagrams with `grid-gap`, `vertical-gap`, or `horizontal-gap` [#1178](https://github.com/terrastruct/d2/issues/1178)
#### Improvements ๐งน
diff --git a/d2compiler/compile.go b/d2compiler/compile.go
index 867b8a756..fc3b1bfec 100644
--- a/d2compiler/compile.go
+++ b/d2compiler/compile.go
@@ -433,32 +433,32 @@ func (c *compiler) compileReserved(attrs *d2graph.Attributes, f *d2ir.Field) {
attrs.GridGap = &d2graph.Scalar{}
attrs.GridGap.Value = scalar.ScalarString()
attrs.GridGap.MapKey = f.LastPrimaryKey()
- case "grid-gap-rows":
+ case "vertical-gap":
v, err := strconv.Atoi(scalar.ScalarString())
if err != nil {
- c.errorf(scalar, "non-integer grid-gap-rows %#v: %s", scalar.ScalarString(), err)
+ c.errorf(scalar, "non-integer vertical-gap %#v: %s", scalar.ScalarString(), err)
return
}
if v < 0 {
- c.errorf(scalar, "grid-gap-rows must be a non-negative integer: %#v", scalar.ScalarString())
+ c.errorf(scalar, "vertical-gap must be a non-negative integer: %#v", scalar.ScalarString())
return
}
- attrs.GridGapRows = &d2graph.Scalar{}
- attrs.GridGapRows.Value = scalar.ScalarString()
- attrs.GridGapRows.MapKey = f.LastPrimaryKey()
- case "grid-gap-columns":
+ attrs.VerticalGap = &d2graph.Scalar{}
+ attrs.VerticalGap.Value = scalar.ScalarString()
+ attrs.VerticalGap.MapKey = f.LastPrimaryKey()
+ case "horizontal-gap":
v, err := strconv.Atoi(scalar.ScalarString())
if err != nil {
- c.errorf(scalar, "non-integer grid-gap-columns %#v: %s", scalar.ScalarString(), err)
+ c.errorf(scalar, "non-integer horizontal-gap %#v: %s", scalar.ScalarString(), err)
return
}
if v < 0 {
- c.errorf(scalar, "grid-gap-columns must be a non-negative integer: %#v", scalar.ScalarString())
+ c.errorf(scalar, "horizontal-gap must be a non-negative integer: %#v", scalar.ScalarString())
return
}
- attrs.GridGapColumns = &d2graph.Scalar{}
- attrs.GridGapColumns.Value = scalar.ScalarString()
- attrs.GridGapColumns.MapKey = f.LastPrimaryKey()
+ attrs.HorizontalGap = &d2graph.Scalar{}
+ attrs.HorizontalGap.Value = scalar.ScalarString()
+ attrs.HorizontalGap.MapKey = f.LastPrimaryKey()
case "class":
attrs.Classes = append(attrs.Classes, scalar.ScalarString())
case "classes":
@@ -796,7 +796,7 @@ func (c *compiler) validateKey(obj *d2graph.Object, f *d2ir.Field) {
if !in && arrowheadIn {
c.errorf(f.LastPrimaryKey(), fmt.Sprintf(`invalid shape, can only set "%s" for arrowheads`, obj.Attributes.Shape.Value))
}
- case "grid-rows", "grid-columns", "grid-gap", "grid-gap-rows", "grid-gap-columns":
+ case "grid-rows", "grid-columns", "grid-gap", "vertical-gap", "horizontal-gap":
for _, child := range obj.ChildrenArray {
if child.IsContainer() {
c.errorf(f.LastPrimaryKey(),
diff --git a/d2compiler/compile_test.go b/d2compiler/compile_test.go
index ceb751603..c5750ff88 100644
--- a/d2compiler/compile_test.go
+++ b/d2compiler/compile_test.go
@@ -2304,12 +2304,12 @@ obj {
{
name: "grid_gap_negative",
text: `hey: {
- grid-gap-columns: -200
- grid-gap-rows: -30
+ horizontal-gap: -200
+ vertical-gap: -30
}
`,
- expErr: `d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2:2:20: grid-gap-columns must be a non-negative integer: "-200"
-d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2:3:17: grid-gap-rows must be a non-negative integer: "-30"`,
+ expErr: `d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2:2:18: horizontal-gap must be a non-negative integer: "-200"
+d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2:3:16: vertical-gap must be a non-negative integer: "-30"`,
},
{
name: "grid_edge",
diff --git a/d2graph/d2graph.go b/d2graph/d2graph.go
index 261e1af5f..d8ebc011e 100644
--- a/d2graph/d2graph.go
+++ b/d2graph/d2graph.go
@@ -136,11 +136,11 @@ type Attributes struct {
Direction Scalar `json:"direction"`
Constraint Scalar `json:"constraint"`
- GridRows *Scalar `json:"gridRows,omitempty"`
- GridColumns *Scalar `json:"gridColumns,omitempty"`
- GridGap *Scalar `json:"gridGap,omitempty"`
- GridGapRows *Scalar `json:"gridGapRows,omitempty"`
- GridGapColumns *Scalar `json:"gridGapColumns,omitempty"`
+ GridRows *Scalar `json:"gridRows,omitempty"`
+ GridColumns *Scalar `json:"gridColumns,omitempty"`
+ GridGap *Scalar `json:"gridGap,omitempty"`
+ VerticalGap *Scalar `json:"verticalGap,omitempty"`
+ HorizontalGap *Scalar `json:"horizontalGap,omitempty"`
// These names are attached to the rendered elements in SVG
// so that users can target them however they like outside of D2
@@ -1591,26 +1591,26 @@ var ReservedKeywords2 map[string]struct{}
// Non Style/Holder keywords.
var SimpleReservedKeywords = map[string]struct{}{
- "label": {},
- "desc": {},
- "shape": {},
- "icon": {},
- "constraint": {},
- "tooltip": {},
- "link": {},
- "near": {},
- "width": {},
- "height": {},
- "direction": {},
- "top": {},
- "left": {},
- "grid-rows": {},
- "grid-columns": {},
- "grid-gap": {},
- "grid-gap-rows": {},
- "grid-gap-columns": {},
- "class": {},
- "classes": {},
+ "label": {},
+ "desc": {},
+ "shape": {},
+ "icon": {},
+ "constraint": {},
+ "tooltip": {},
+ "link": {},
+ "near": {},
+ "width": {},
+ "height": {},
+ "direction": {},
+ "top": {},
+ "left": {},
+ "grid-rows": {},
+ "grid-columns": {},
+ "grid-gap": {},
+ "vertical-gap": {},
+ "horizontal-gap": {},
+ "class": {},
+ "classes": {},
}
// ReservedKeywordHolders are reserved keywords that are meaningless on its own and exist solely to hold a set of reserved keywords
diff --git a/d2layouts/d2grid/grid_diagram.go b/d2layouts/d2grid/grid_diagram.go
index 852a324c4..462f54b69 100644
--- a/d2layouts/d2grid/grid_diagram.go
+++ b/d2layouts/d2grid/grid_diagram.go
@@ -20,16 +20,16 @@ type gridDiagram struct {
width float64
height float64
- gapRows int
- gapColumns int
+ verticalGap int
+ horizontalGap int
}
func newGridDiagram(root *d2graph.Object) *gridDiagram {
gd := gridDiagram{
- root: root,
- objects: root.ChildrenArray,
- gapRows: DEFAULT_GAP,
- gapColumns: DEFAULT_GAP,
+ root: root,
+ objects: root.ChildrenArray,
+ verticalGap: DEFAULT_GAP,
+ horizontalGap: DEFAULT_GAP,
}
if root.Attributes.GridRows != nil {
@@ -77,14 +77,14 @@ func newGridDiagram(root *d2graph.Object) *gridDiagram {
// grid gap sets both, but can be overridden
if root.Attributes.GridGap != nil {
- gd.gapRows, _ = strconv.Atoi(root.Attributes.GridGap.Value)
- gd.gapColumns = gd.gapRows
+ gd.verticalGap, _ = strconv.Atoi(root.Attributes.GridGap.Value)
+ gd.horizontalGap = gd.verticalGap
}
- if root.Attributes.GridGapRows != nil {
- gd.gapRows, _ = strconv.Atoi(root.Attributes.GridGapRows.Value)
+ if root.Attributes.VerticalGap != nil {
+ gd.verticalGap, _ = strconv.Atoi(root.Attributes.VerticalGap.Value)
}
- if root.Attributes.GridGapColumns != nil {
- gd.gapColumns, _ = strconv.Atoi(root.Attributes.GridGapColumns.Value)
+ if root.Attributes.HorizontalGap != nil {
+ gd.horizontalGap, _ = strconv.Atoi(root.Attributes.HorizontalGap.Value)
}
return &gd
diff --git a/d2layouts/d2grid/layout.go b/d2layouts/d2grid/layout.go
index 242e50c05..6650bd2c7 100644
--- a/d2layouts/d2grid/layout.go
+++ b/d2layouts/d2grid/layout.go
@@ -177,8 +177,8 @@ func (gd *gridDiagram) layoutEvenly(g *d2graph.Graph, obj *d2graph.Object) {
colWidths = append(colWidths, columnWidth)
}
- horizontalGap := float64(gd.gapColumns)
- verticalGap := float64(gd.gapRows)
+ horizontalGap := float64(gd.horizontalGap)
+ verticalGap := float64(gd.verticalGap)
cursor := geo.NewPoint(0, 0)
if gd.rowDirected {
@@ -242,8 +242,8 @@ func (gd *gridDiagram) layoutDynamic(g *d2graph.Graph, obj *d2graph.Object) {
// . โ โ โ โ โค โ โ โ โ โ โ
// . โโโโโโโโโโโโโโโโ โโโโโ โโโโโโโโโโโโ โโโโโโโโโโโ โโโโโโโโโโโโโโโโโโโ
- horizontalGap := float64(gd.gapColumns)
- verticalGap := float64(gd.gapRows)
+ horizontalGap := float64(gd.horizontalGap)
+ verticalGap := float64(gd.verticalGap)
// we want to split up the total width across the N rows or columns as evenly as possible
var totalWidth, totalHeight float64
@@ -484,7 +484,7 @@ func (gd *gridDiagram) getBestLayout(targetSize float64, columns bool) [][]*d2gr
// of these divisions, find the layout with rows closest to the targetSize
for _, division := range divisions {
layout := genLayout(gd.objects, division)
- dist := getDistToTarget(layout, targetSize, float64(gd.gapColumns), float64(gd.gapRows), columns)
+ dist := getDistToTarget(layout, targetSize, float64(gd.horizontalGap), float64(gd.verticalGap), columns)
if dist < bestDist {
bestLayout = layout
bestDist = dist
diff --git a/d2oracle/edit.go b/d2oracle/edit.go
index 7849aefea..2e3408114 100644
--- a/d2oracle/edit.go
+++ b/d2oracle/edit.go
@@ -329,14 +329,14 @@ func _set(g *d2graph.Graph, key string, tag, value *string) error {
attrs.GridGap.MapKey.SetScalar(mk.Value.ScalarBox())
return nil
}
- case "grid-gap-rows":
- if attrs.GridGapRows != nil && attrs.GridGapRows.MapKey != nil {
- attrs.GridGapRows.MapKey.SetScalar(mk.Value.ScalarBox())
+ case "vertical-gap":
+ if attrs.VerticalGap != nil && attrs.VerticalGap.MapKey != nil {
+ attrs.VerticalGap.MapKey.SetScalar(mk.Value.ScalarBox())
return nil
}
- case "grid-gap-columns":
- if attrs.GridGapColumns != nil && attrs.GridGapColumns.MapKey != nil {
- attrs.GridGapColumns.MapKey.SetScalar(mk.Value.ScalarBox())
+ case "horizontal-gap":
+ if attrs.HorizontalGap != nil && attrs.HorizontalGap.MapKey != nil {
+ attrs.HorizontalGap.MapKey.SetScalar(mk.Value.ScalarBox())
return nil
}
case "source-arrowhead", "target-arrowhead":
diff --git a/e2etests/testdata/files/grid_gap.d2 b/e2etests/testdata/files/grid_gap.d2
index f8520902a..da62991c2 100644
--- a/e2etests/testdata/files/grid_gap.d2
+++ b/e2etests/testdata/files/grid_gap.d2
@@ -1,8 +1,8 @@
-gap-rows 30 gap-columns 100: {
+vertical-gap 30 horizontal-gap 100: {
grid-rows: 3
grid-columns: 3
- grid-gap-rows: 30
- grid-gap-columns: 100
+ vertical-gap: 30
+ horizontal-gap: 100
a
b
@@ -15,11 +15,11 @@ gap-rows 30 gap-columns 100: {
i
}
-gap-rows 100 gap-columns 30: {
+vertical-gap 100 horizontal-gap 30: {
grid-rows: 3
grid-columns: 3
- grid-gap-rows: 100
- grid-gap-columns: 30
+ vertical-gap: 100
+ horizontal-gap: 30
a
b
@@ -48,11 +48,11 @@ gap 0: {
i
}
-gap 10 gap-rows 100: {
+gap 10 vertical-gap 100: {
grid-rows: 3
grid-columns: 3
grid-gap: 10
- grid-gap-rows: 100
+ vertical-gap: 100
a
b
diff --git a/e2etests/testdata/stable/grid_gap/dagre/board.exp.json b/e2etests/testdata/stable/grid_gap/dagre/board.exp.json
index 702505891..3b198f9f0 100644
--- a/e2etests/testdata/stable/grid_gap/dagre/board.exp.json
+++ b/e2etests/testdata/stable/grid_gap/dagre/board.exp.json
@@ -4,7 +4,7 @@
"fontFamily": "SourceSansPro",
"shapes": [
{
- "id": "gap-rows 30 gap-columns 100",
+ "id": "vertical-gap 30 horizontal-gap 100",
"type": "rectangle",
"pos": {
"x": 0,
@@ -30,7 +30,7 @@
"fields": null,
"methods": null,
"columns": null,
- "label": "gap-rows 30 gap-columns 100",
+ "label": "vertical-gap 30 horizontal-gap 100",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
@@ -38,14 +38,14 @@
"italic": false,
"bold": false,
"underline": false,
- "labelWidth": 347,
+ "labelWidth": 398,
"labelHeight": 36,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
- "id": "gap-rows 30 gap-columns 100.a",
+ "id": "vertical-gap 30 horizontal-gap 100.a",
"type": "rectangle",
"pos": {
"x": 60,
@@ -86,7 +86,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.b",
+ "id": "vertical-gap 30 horizontal-gap 100.b",
"type": "rectangle",
"pos": {
"x": 214,
@@ -127,7 +127,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.c",
+ "id": "vertical-gap 30 horizontal-gap 100.c",
"type": "rectangle",
"pos": {
"x": 367,
@@ -168,7 +168,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.d",
+ "id": "vertical-gap 30 horizontal-gap 100.d",
"type": "rectangle",
"pos": {
"x": 60,
@@ -209,7 +209,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.e",
+ "id": "vertical-gap 30 horizontal-gap 100.e",
"type": "rectangle",
"pos": {
"x": 214,
@@ -250,7 +250,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.f",
+ "id": "vertical-gap 30 horizontal-gap 100.f",
"type": "rectangle",
"pos": {
"x": 367,
@@ -291,7 +291,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.g",
+ "id": "vertical-gap 30 horizontal-gap 100.g",
"type": "rectangle",
"pos": {
"x": 60,
@@ -332,7 +332,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.h",
+ "id": "vertical-gap 30 horizontal-gap 100.h",
"type": "rectangle",
"pos": {
"x": 214,
@@ -373,7 +373,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.i",
+ "id": "vertical-gap 30 horizontal-gap 100.i",
"type": "rectangle",
"pos": {
"x": 367,
@@ -414,13 +414,13 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30",
+ "id": "vertical-gap 100 horizontal-gap 30",
"type": "rectangle",
"pos": {
"x": 540,
"y": 0
},
- "width": 357,
+ "width": 408,
"height": 518,
"opacity": 1,
"strokeDash": 0,
@@ -440,7 +440,7 @@
"fields": null,
"methods": null,
"columns": null,
- "label": "gap-rows 100 gap-columns 30",
+ "label": "vertical-gap 100 horizontal-gap 30",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
@@ -448,17 +448,17 @@
"italic": false,
"bold": false,
"underline": false,
- "labelWidth": 347,
+ "labelWidth": 398,
"labelHeight": 36,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
- "id": "gap-rows 100 gap-columns 30.a",
+ "id": "vertical-gap 100 horizontal-gap 30.a",
"type": "rectangle",
"pos": {
- "x": 608,
+ "x": 634,
"y": 60
},
"width": 54,
@@ -496,10 +496,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.b",
+ "id": "vertical-gap 100 horizontal-gap 30.b",
"type": "rectangle",
"pos": {
- "x": 692,
+ "x": 718,
"y": 60
},
"width": 53,
@@ -537,10 +537,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.c",
+ "id": "vertical-gap 100 horizontal-gap 30.c",
"type": "rectangle",
"pos": {
- "x": 775,
+ "x": 801,
"y": 60
},
"width": 53,
@@ -578,10 +578,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.d",
+ "id": "vertical-gap 100 horizontal-gap 30.d",
"type": "rectangle",
"pos": {
- "x": 608,
+ "x": 634,
"y": 226
},
"width": 54,
@@ -619,10 +619,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.e",
+ "id": "vertical-gap 100 horizontal-gap 30.e",
"type": "rectangle",
"pos": {
- "x": 692,
+ "x": 718,
"y": 226
},
"width": 53,
@@ -660,10 +660,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.f",
+ "id": "vertical-gap 100 horizontal-gap 30.f",
"type": "rectangle",
"pos": {
- "x": 775,
+ "x": 801,
"y": 226
},
"width": 53,
@@ -701,10 +701,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.g",
+ "id": "vertical-gap 100 horizontal-gap 30.g",
"type": "rectangle",
"pos": {
- "x": 608,
+ "x": 634,
"y": 392
},
"width": 54,
@@ -742,10 +742,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.h",
+ "id": "vertical-gap 100 horizontal-gap 30.h",
"type": "rectangle",
"pos": {
- "x": 692,
+ "x": 718,
"y": 392
},
"width": 53,
@@ -783,10 +783,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.i",
+ "id": "vertical-gap 100 horizontal-gap 30.i",
"type": "rectangle",
"pos": {
- "x": 775,
+ "x": 801,
"y": 392
},
"width": 53,
@@ -827,7 +827,7 @@
"id": "gap 0",
"type": "rectangle",
"pos": {
- "x": 957,
+ "x": 1008,
"y": 100
},
"width": 280,
@@ -868,7 +868,7 @@
"id": "gap 0.a",
"type": "rectangle",
"pos": {
- "x": 1017,
+ "x": 1068,
"y": 160
},
"width": 54,
@@ -909,7 +909,7 @@
"id": "gap 0.b",
"type": "rectangle",
"pos": {
- "x": 1071,
+ "x": 1122,
"y": 160
},
"width": 53,
@@ -950,7 +950,7 @@
"id": "gap 0.c",
"type": "rectangle",
"pos": {
- "x": 1124,
+ "x": 1175,
"y": 160
},
"width": 53,
@@ -991,7 +991,7 @@
"id": "gap 0.d",
"type": "rectangle",
"pos": {
- "x": 1017,
+ "x": 1068,
"y": 226
},
"width": 54,
@@ -1032,7 +1032,7 @@
"id": "gap 0.e",
"type": "rectangle",
"pos": {
- "x": 1071,
+ "x": 1122,
"y": 226
},
"width": 53,
@@ -1073,7 +1073,7 @@
"id": "gap 0.f",
"type": "rectangle",
"pos": {
- "x": 1124,
+ "x": 1175,
"y": 226
},
"width": 53,
@@ -1114,7 +1114,7 @@
"id": "gap 0.g",
"type": "rectangle",
"pos": {
- "x": 1017,
+ "x": 1068,
"y": 292
},
"width": 54,
@@ -1155,7 +1155,7 @@
"id": "gap 0.h",
"type": "rectangle",
"pos": {
- "x": 1071,
+ "x": 1122,
"y": 292
},
"width": 53,
@@ -1196,7 +1196,7 @@
"id": "gap 0.i",
"type": "rectangle",
"pos": {
- "x": 1124,
+ "x": 1175,
"y": 292
},
"width": 53,
@@ -1234,10 +1234,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100",
+ "id": "gap 10 vertical-gap 100",
"type": "rectangle",
"pos": {
- "x": 1297,
+ "x": 1348,
"y": 0
},
"width": 300,
@@ -1260,7 +1260,7 @@
"fields": null,
"methods": null,
"columns": null,
- "label": "gap 10 gap-rows 100",
+ "label": "gap 10 vertical-gap 100",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
@@ -1268,17 +1268,17 @@
"italic": false,
"bold": false,
"underline": false,
- "labelWidth": 238,
+ "labelWidth": 268,
"labelHeight": 36,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
- "id": "gap 10 gap-rows 100.a",
+ "id": "gap 10 vertical-gap 100.a",
"type": "rectangle",
"pos": {
- "x": 1357,
+ "x": 1408,
"y": 60
},
"width": 54,
@@ -1316,10 +1316,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.b",
+ "id": "gap 10 vertical-gap 100.b",
"type": "rectangle",
"pos": {
- "x": 1421,
+ "x": 1472,
"y": 60
},
"width": 53,
@@ -1357,10 +1357,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.c",
+ "id": "gap 10 vertical-gap 100.c",
"type": "rectangle",
"pos": {
- "x": 1484,
+ "x": 1535,
"y": 60
},
"width": 53,
@@ -1398,10 +1398,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.d",
+ "id": "gap 10 vertical-gap 100.d",
"type": "rectangle",
"pos": {
- "x": 1357,
+ "x": 1408,
"y": 226
},
"width": 54,
@@ -1439,10 +1439,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.e",
+ "id": "gap 10 vertical-gap 100.e",
"type": "rectangle",
"pos": {
- "x": 1421,
+ "x": 1472,
"y": 226
},
"width": 53,
@@ -1480,10 +1480,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.f",
+ "id": "gap 10 vertical-gap 100.f",
"type": "rectangle",
"pos": {
- "x": 1484,
+ "x": 1535,
"y": 226
},
"width": 53,
@@ -1521,10 +1521,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.g",
+ "id": "gap 10 vertical-gap 100.g",
"type": "rectangle",
"pos": {
- "x": 1357,
+ "x": 1408,
"y": 392
},
"width": 54,
@@ -1562,10 +1562,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.h",
+ "id": "gap 10 vertical-gap 100.h",
"type": "rectangle",
"pos": {
- "x": 1421,
+ "x": 1472,
"y": 392
},
"width": 53,
@@ -1603,10 +1603,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.i",
+ "id": "gap 10 vertical-gap 100.i",
"type": "rectangle",
"pos": {
- "x": 1484,
+ "x": 1535,
"y": 392
},
"width": 53,
diff --git a/e2etests/testdata/stable/grid_gap/dagre/sketch.exp.svg b/e2etests/testdata/stable/grid_gap/dagre/sketch.exp.svg
index baf862336..f70772277 100644
--- a/e2etests/testdata/stable/grid_gap/dagre/sketch.exp.svg
+++ b/e2etests/testdata/stable/grid_gap/dagre/sketch.exp.svg
@@ -1,17 +1,17 @@
-
\ No newline at end of file
diff --git a/e2etests/testdata/stable/grid_gap/elk/board.exp.json b/e2etests/testdata/stable/grid_gap/elk/board.exp.json
index aee05b201..97349cc99 100644
--- a/e2etests/testdata/stable/grid_gap/elk/board.exp.json
+++ b/e2etests/testdata/stable/grid_gap/elk/board.exp.json
@@ -4,7 +4,7 @@
"fontFamily": "SourceSansPro",
"shapes": [
{
- "id": "gap-rows 30 gap-columns 100",
+ "id": "vertical-gap 30 horizontal-gap 100",
"type": "rectangle",
"pos": {
"x": 12,
@@ -30,7 +30,7 @@
"fields": null,
"methods": null,
"columns": null,
- "label": "gap-rows 30 gap-columns 100",
+ "label": "vertical-gap 30 horizontal-gap 100",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
@@ -38,14 +38,14 @@
"italic": false,
"bold": false,
"underline": false,
- "labelWidth": 347,
+ "labelWidth": 398,
"labelHeight": 36,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
- "id": "gap-rows 30 gap-columns 100.a",
+ "id": "vertical-gap 30 horizontal-gap 100.a",
"type": "rectangle",
"pos": {
"x": 72,
@@ -86,7 +86,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.b",
+ "id": "vertical-gap 30 horizontal-gap 100.b",
"type": "rectangle",
"pos": {
"x": 226,
@@ -127,7 +127,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.c",
+ "id": "vertical-gap 30 horizontal-gap 100.c",
"type": "rectangle",
"pos": {
"x": 379,
@@ -168,7 +168,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.d",
+ "id": "vertical-gap 30 horizontal-gap 100.d",
"type": "rectangle",
"pos": {
"x": 72,
@@ -209,7 +209,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.e",
+ "id": "vertical-gap 30 horizontal-gap 100.e",
"type": "rectangle",
"pos": {
"x": 226,
@@ -250,7 +250,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.f",
+ "id": "vertical-gap 30 horizontal-gap 100.f",
"type": "rectangle",
"pos": {
"x": 379,
@@ -291,7 +291,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.g",
+ "id": "vertical-gap 30 horizontal-gap 100.g",
"type": "rectangle",
"pos": {
"x": 72,
@@ -332,7 +332,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.h",
+ "id": "vertical-gap 30 horizontal-gap 100.h",
"type": "rectangle",
"pos": {
"x": 226,
@@ -373,7 +373,7 @@
"level": 2
},
{
- "id": "gap-rows 30 gap-columns 100.i",
+ "id": "vertical-gap 30 horizontal-gap 100.i",
"type": "rectangle",
"pos": {
"x": 379,
@@ -414,13 +414,13 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30",
+ "id": "vertical-gap 100 horizontal-gap 30",
"type": "rectangle",
"pos": {
"x": 512,
"y": 12
},
- "width": 357,
+ "width": 408,
"height": 518,
"opacity": 1,
"strokeDash": 0,
@@ -440,7 +440,7 @@
"fields": null,
"methods": null,
"columns": null,
- "label": "gap-rows 100 gap-columns 30",
+ "label": "vertical-gap 100 horizontal-gap 30",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
@@ -448,17 +448,17 @@
"italic": false,
"bold": false,
"underline": false,
- "labelWidth": 347,
+ "labelWidth": 398,
"labelHeight": 36,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
- "id": "gap-rows 100 gap-columns 30.a",
+ "id": "vertical-gap 100 horizontal-gap 30.a",
"type": "rectangle",
"pos": {
- "x": 580,
+ "x": 606,
"y": 72
},
"width": 54,
@@ -496,10 +496,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.b",
+ "id": "vertical-gap 100 horizontal-gap 30.b",
"type": "rectangle",
"pos": {
- "x": 664,
+ "x": 690,
"y": 72
},
"width": 53,
@@ -537,10 +537,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.c",
+ "id": "vertical-gap 100 horizontal-gap 30.c",
"type": "rectangle",
"pos": {
- "x": 747,
+ "x": 773,
"y": 72
},
"width": 53,
@@ -578,10 +578,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.d",
+ "id": "vertical-gap 100 horizontal-gap 30.d",
"type": "rectangle",
"pos": {
- "x": 580,
+ "x": 606,
"y": 238
},
"width": 54,
@@ -619,10 +619,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.e",
+ "id": "vertical-gap 100 horizontal-gap 30.e",
"type": "rectangle",
"pos": {
- "x": 664,
+ "x": 690,
"y": 238
},
"width": 53,
@@ -660,10 +660,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.f",
+ "id": "vertical-gap 100 horizontal-gap 30.f",
"type": "rectangle",
"pos": {
- "x": 747,
+ "x": 773,
"y": 238
},
"width": 53,
@@ -701,10 +701,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.g",
+ "id": "vertical-gap 100 horizontal-gap 30.g",
"type": "rectangle",
"pos": {
- "x": 580,
+ "x": 606,
"y": 404
},
"width": 54,
@@ -742,10 +742,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.h",
+ "id": "vertical-gap 100 horizontal-gap 30.h",
"type": "rectangle",
"pos": {
- "x": 664,
+ "x": 690,
"y": 404
},
"width": 53,
@@ -783,10 +783,10 @@
"level": 2
},
{
- "id": "gap-rows 100 gap-columns 30.i",
+ "id": "vertical-gap 100 horizontal-gap 30.i",
"type": "rectangle",
"pos": {
- "x": 747,
+ "x": 773,
"y": 404
},
"width": 53,
@@ -827,7 +827,7 @@
"id": "gap 0",
"type": "rectangle",
"pos": {
- "x": 889,
+ "x": 940,
"y": 112
},
"width": 280,
@@ -868,7 +868,7 @@
"id": "gap 0.a",
"type": "rectangle",
"pos": {
- "x": 949,
+ "x": 1000,
"y": 172
},
"width": 54,
@@ -909,7 +909,7 @@
"id": "gap 0.b",
"type": "rectangle",
"pos": {
- "x": 1003,
+ "x": 1054,
"y": 172
},
"width": 53,
@@ -950,7 +950,7 @@
"id": "gap 0.c",
"type": "rectangle",
"pos": {
- "x": 1056,
+ "x": 1107,
"y": 172
},
"width": 53,
@@ -991,7 +991,7 @@
"id": "gap 0.d",
"type": "rectangle",
"pos": {
- "x": 949,
+ "x": 1000,
"y": 238
},
"width": 54,
@@ -1032,7 +1032,7 @@
"id": "gap 0.e",
"type": "rectangle",
"pos": {
- "x": 1003,
+ "x": 1054,
"y": 238
},
"width": 53,
@@ -1073,7 +1073,7 @@
"id": "gap 0.f",
"type": "rectangle",
"pos": {
- "x": 1056,
+ "x": 1107,
"y": 238
},
"width": 53,
@@ -1114,7 +1114,7 @@
"id": "gap 0.g",
"type": "rectangle",
"pos": {
- "x": 949,
+ "x": 1000,
"y": 304
},
"width": 54,
@@ -1155,7 +1155,7 @@
"id": "gap 0.h",
"type": "rectangle",
"pos": {
- "x": 1003,
+ "x": 1054,
"y": 304
},
"width": 53,
@@ -1196,7 +1196,7 @@
"id": "gap 0.i",
"type": "rectangle",
"pos": {
- "x": 1056,
+ "x": 1107,
"y": 304
},
"width": 53,
@@ -1234,10 +1234,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100",
+ "id": "gap 10 vertical-gap 100",
"type": "rectangle",
"pos": {
- "x": 1189,
+ "x": 1240,
"y": 12
},
"width": 300,
@@ -1260,7 +1260,7 @@
"fields": null,
"methods": null,
"columns": null,
- "label": "gap 10 gap-rows 100",
+ "label": "gap 10 vertical-gap 100",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
@@ -1268,17 +1268,17 @@
"italic": false,
"bold": false,
"underline": false,
- "labelWidth": 238,
+ "labelWidth": 268,
"labelHeight": 36,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
- "id": "gap 10 gap-rows 100.a",
+ "id": "gap 10 vertical-gap 100.a",
"type": "rectangle",
"pos": {
- "x": 1249,
+ "x": 1300,
"y": 72
},
"width": 54,
@@ -1316,10 +1316,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.b",
+ "id": "gap 10 vertical-gap 100.b",
"type": "rectangle",
"pos": {
- "x": 1313,
+ "x": 1364,
"y": 72
},
"width": 53,
@@ -1357,10 +1357,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.c",
+ "id": "gap 10 vertical-gap 100.c",
"type": "rectangle",
"pos": {
- "x": 1376,
+ "x": 1427,
"y": 72
},
"width": 53,
@@ -1398,10 +1398,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.d",
+ "id": "gap 10 vertical-gap 100.d",
"type": "rectangle",
"pos": {
- "x": 1249,
+ "x": 1300,
"y": 238
},
"width": 54,
@@ -1439,10 +1439,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.e",
+ "id": "gap 10 vertical-gap 100.e",
"type": "rectangle",
"pos": {
- "x": 1313,
+ "x": 1364,
"y": 238
},
"width": 53,
@@ -1480,10 +1480,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.f",
+ "id": "gap 10 vertical-gap 100.f",
"type": "rectangle",
"pos": {
- "x": 1376,
+ "x": 1427,
"y": 238
},
"width": 53,
@@ -1521,10 +1521,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.g",
+ "id": "gap 10 vertical-gap 100.g",
"type": "rectangle",
"pos": {
- "x": 1249,
+ "x": 1300,
"y": 404
},
"width": 54,
@@ -1562,10 +1562,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.h",
+ "id": "gap 10 vertical-gap 100.h",
"type": "rectangle",
"pos": {
- "x": 1313,
+ "x": 1364,
"y": 404
},
"width": 53,
@@ -1603,10 +1603,10 @@
"level": 2
},
{
- "id": "gap 10 gap-rows 100.i",
+ "id": "gap 10 vertical-gap 100.i",
"type": "rectangle",
"pos": {
- "x": 1376,
+ "x": 1427,
"y": 404
},
"width": 53,
diff --git a/e2etests/testdata/stable/grid_gap/elk/sketch.exp.svg b/e2etests/testdata/stable/grid_gap/elk/sketch.exp.svg
index 5706fc96e..34b1ea88a 100644
--- a/e2etests/testdata/stable/grid_gap/elk/sketch.exp.svg
+++ b/e2etests/testdata/stable/grid_gap/elk/sketch.exp.svg
@@ -1,17 +1,17 @@
-gap-rows 30 gap-columns 100gap-rows 100 gap-columns 30gap 0gap 10 gap-rows 100abcdefghiabcdefghiabcdefghiabcdefghi
-
+ .d2-3196763014 .fill-N1{fill:#0A0F25;}
+ .d2-3196763014 .fill-N2{fill:#676C7E;}
+ .d2-3196763014 .fill-N3{fill:#9499AB;}
+ .d2-3196763014 .fill-N4{fill:#CFD2DD;}
+ .d2-3196763014 .fill-N5{fill:#DEE1EB;}
+ .d2-3196763014 .fill-N6{fill:#EEF1F8;}
+ .d2-3196763014 .fill-N7{fill:#FFFFFF;}
+ .d2-3196763014 .fill-B1{fill:#0D32B2;}
+ .d2-3196763014 .fill-B2{fill:#0D32B2;}
+ .d2-3196763014 .fill-B3{fill:#E3E9FD;}
+ .d2-3196763014 .fill-B4{fill:#E3E9FD;}
+ .d2-3196763014 .fill-B5{fill:#EDF0FD;}
+ .d2-3196763014 .fill-B6{fill:#F7F8FE;}
+ .d2-3196763014 .fill-AA2{fill:#4A6FF3;}
+ .d2-3196763014 .fill-AA4{fill:#EDF0FD;}
+ .d2-3196763014 .fill-AA5{fill:#F7F8FE;}
+ .d2-3196763014 .fill-AB4{fill:#EDF0FD;}
+ .d2-3196763014 .fill-AB5{fill:#F7F8FE;}
+ .d2-3196763014 .stroke-N1{stroke:#0A0F25;}
+ .d2-3196763014 .stroke-N2{stroke:#676C7E;}
+ .d2-3196763014 .stroke-N3{stroke:#9499AB;}
+ .d2-3196763014 .stroke-N4{stroke:#CFD2DD;}
+ .d2-3196763014 .stroke-N5{stroke:#DEE1EB;}
+ .d2-3196763014 .stroke-N6{stroke:#EEF1F8;}
+ .d2-3196763014 .stroke-N7{stroke:#FFFFFF;}
+ .d2-3196763014 .stroke-B1{stroke:#0D32B2;}
+ .d2-3196763014 .stroke-B2{stroke:#0D32B2;}
+ .d2-3196763014 .stroke-B3{stroke:#E3E9FD;}
+ .d2-3196763014 .stroke-B4{stroke:#E3E9FD;}
+ .d2-3196763014 .stroke-B5{stroke:#EDF0FD;}
+ .d2-3196763014 .stroke-B6{stroke:#F7F8FE;}
+ .d2-3196763014 .stroke-AA2{stroke:#4A6FF3;}
+ .d2-3196763014 .stroke-AA4{stroke:#EDF0FD;}
+ .d2-3196763014 .stroke-AA5{stroke:#F7F8FE;}
+ .d2-3196763014 .stroke-AB4{stroke:#EDF0FD;}
+ .d2-3196763014 .stroke-AB5{stroke:#F7F8FE;}
+ .d2-3196763014 .background-color-N1{background-color:#0A0F25;}
+ .d2-3196763014 .background-color-N2{background-color:#676C7E;}
+ .d2-3196763014 .background-color-N3{background-color:#9499AB;}
+ .d2-3196763014 .background-color-N4{background-color:#CFD2DD;}
+ .d2-3196763014 .background-color-N5{background-color:#DEE1EB;}
+ .d2-3196763014 .background-color-N6{background-color:#EEF1F8;}
+ .d2-3196763014 .background-color-N7{background-color:#FFFFFF;}
+ .d2-3196763014 .background-color-B1{background-color:#0D32B2;}
+ .d2-3196763014 .background-color-B2{background-color:#0D32B2;}
+ .d2-3196763014 .background-color-B3{background-color:#E3E9FD;}
+ .d2-3196763014 .background-color-B4{background-color:#E3E9FD;}
+ .d2-3196763014 .background-color-B5{background-color:#EDF0FD;}
+ .d2-3196763014 .background-color-B6{background-color:#F7F8FE;}
+ .d2-3196763014 .background-color-AA2{background-color:#4A6FF3;}
+ .d2-3196763014 .background-color-AA4{background-color:#EDF0FD;}
+ .d2-3196763014 .background-color-AA5{background-color:#F7F8FE;}
+ .d2-3196763014 .background-color-AB4{background-color:#EDF0FD;}
+ .d2-3196763014 .background-color-AB5{background-color:#F7F8FE;}
+ .d2-3196763014 .color-N1{color:#0A0F25;}
+ .d2-3196763014 .color-N2{color:#676C7E;}
+ .d2-3196763014 .color-N3{color:#9499AB;}
+ .d2-3196763014 .color-N4{color:#CFD2DD;}
+ .d2-3196763014 .color-N5{color:#DEE1EB;}
+ .d2-3196763014 .color-N6{color:#EEF1F8;}
+ .d2-3196763014 .color-N7{color:#FFFFFF;}
+ .d2-3196763014 .color-B1{color:#0D32B2;}
+ .d2-3196763014 .color-B2{color:#0D32B2;}
+ .d2-3196763014 .color-B3{color:#E3E9FD;}
+ .d2-3196763014 .color-B4{color:#E3E9FD;}
+ .d2-3196763014 .color-B5{color:#EDF0FD;}
+ .d2-3196763014 .color-B6{color:#F7F8FE;}
+ .d2-3196763014 .color-AA2{color:#4A6FF3;}
+ .d2-3196763014 .color-AA4{color:#EDF0FD;}
+ .d2-3196763014 .color-AA5{color:#F7F8FE;}
+ .d2-3196763014 .color-AB4{color:#EDF0FD;}
+ .d2-3196763014 .color-AB5{color:#F7F8FE;}.appendix text.text{fill:#0A0F25}.md{--color-fg-default:#0A0F25;--color-fg-muted:#676C7E;--color-fg-subtle:#9499AB;--color-canvas-default:#FFFFFF;--color-canvas-subtle:#EEF1F8;--color-border-default:#0D32B2;--color-border-muted:#0D32B2;--color-neutral-muted:#EEF1F8;--color-accent-fg:#0D32B2;--color-accent-emphasis:#0D32B2;--color-attention-subtle:#676C7E;--color-danger-fg:red;}.sketch-overlay-B1{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-B2{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-B3{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-B6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-AA4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AA5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB4{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-AB5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N1{fill:url(#streaks-darker);mix-blend-mode:lighten}.sketch-overlay-N2{fill:url(#streaks-dark);mix-blend-mode:overlay}.sketch-overlay-N3{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N4{fill:url(#streaks-normal);mix-blend-mode:color-burn}.sketch-overlay-N5{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N6{fill:url(#streaks-bright);mix-blend-mode:darken}.sketch-overlay-N7{fill:url(#streaks-bright);mix-blend-mode:darken}.light-code{display: block}.dark-code{display: none}]]>vertical-gap 30 horizontal-gap 100vertical-gap 100 horizontal-gap 30gap 0gap 10 vertical-gap 100abcdefghiabcdefghiabcdefghiabcdefghi
+
\ No newline at end of file
diff --git a/testdata/d2compiler/TestCompile/grid_gap_negative.exp.json b/testdata/d2compiler/TestCompile/grid_gap_negative.exp.json
index a37b783c0..70f2a05d4 100644
--- a/testdata/d2compiler/TestCompile/grid_gap_negative.exp.json
+++ b/testdata/d2compiler/TestCompile/grid_gap_negative.exp.json
@@ -4,12 +4,12 @@
"ioerr": null,
"errs": [
{
- "range": "d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2,1:19:26-1:23:30",
- "errmsg": "d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2:2:20: grid-gap-columns must be a non-negative integer: \"-200\""
+ "range": "d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2,1:17:24-1:21:28",
+ "errmsg": "d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2:2:18: horizontal-gap must be a non-negative integer: \"-200\""
},
{
- "range": "d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2,2:16:47-2:19:50",
- "errmsg": "d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2:3:17: grid-gap-rows must be a non-negative integer: \"-30\""
+ "range": "d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2,2:15:44-2:18:47",
+ "errmsg": "d2/testdata/d2compiler/TestCompile/grid_gap_negative.d2:3:16: vertical-gap must be a non-negative integer: \"-30\""
}
]
}