luciano/d2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

d2ir: fix icon substitutions

Browse source
This commit is contained in:
Alexander Wang 2024-11-10 18:55:20 -07:00
parent 95a0b9423c
commit ef35bfb1fe
No known key found for this signature in database
GPG key ID: BE3937D0D52D8927
4 changed files with 128 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ci/release/changelogs/next.md
View file

@ -5,3 +5,5 @@
- Composition: links pointing to own board are purged [#2203](https://github.com/terrastruct/d2/pull/2203)
#### Bugfixes ⛑️
- Imports: fixes using substitutions in `icon` values [#2207](https://github.com/terrastruct/d2/pull/2207)

4
d2ir/compile.go
View file

@ -984,6 +984,10 @@ func (c *compiler) extendLinks(m *Map, importF *Field, importDir string) {
}
if f.Name == "icon" && f.Primary() != nil {
val := f.Primary().Value.ScalarString()
// It's likely a substitution
if val == "" {
continue
}
u, err := url.Parse(html.UnescapeString(val))
isRemoteImg := err == nil && strings.HasPrefix(u.Scheme, "http")
if isRemoteImg {

27
e2etests-cli/main_test.go
View file

@ -821,6 +821,33 @@ a.b.c.d
assert.Testdata(t, ".svg", svg)
},
},
{
name: "chain_icon_import",
run: func(t *testing.T, ctx context.Context, dir string, env *xos.Env) {
writeFile(t, dir, "hello-world.d2", `...@y
hello.class: Ecs`)
writeFile(t, dir, "y.d2", `
...@x
classes: {
Ecs: {
shape: "circle"
icon: ${icons.ecs}
}
}
`)
writeFile(t, dir, "x.d2", `
vars: {
icons: {
ecs: "https://icons.terrastruct.com/aws%2FCompute%2FAmazon-Elastic-Container-Service.svg"
}
}
`)
err := runTestMain(t, ctx, dir, env, filepath.Join(dir, "hello-world.d2"))
assert.Success(t, err)
svg := readFile(t, dir, "hello-world.svg")
assert.Testdata(t, ".svg", svg)
},
},
{
name: "board_import",
run: func(t *testing.T, ctx context.Context, dir string, env *xos.Env) {

95
e2etests-cli/testdata/TestCLI_E2E/chain_icon_import.exp.svg vendored Normal file
View file

@ -0,0 +1,95 @@
<?xml version="1.0" encoding="utf-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" d2Version="v0.6.8-HEAD" preserveAspectRatio="xMinYMin meet" viewBox="0 0 336 336"><svg id="d2-svg" class="d2-3221982998" width="336" height="336" viewBox="-101 -101 336 336"><rect x="-101.000000" y="-101.000000" width="336.000000" height="336.000000" rx="0.000000" fill="#FFFFFF" class=" fill-N7" stroke-width="0" /><style type="text/css"><![CDATA[
.d2-3221982998 .text-bold {
font-family: "d2-3221982998-font-bold";
}
@font-face {
font-family: d2-3221982998-font-bold;
src: url("data:application/font-woff;base64,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");
}]]></style><style type="text/css"><![CDATA[.shape {
shape-rendering: geometricPrecision;
stroke-linejoin: round;
}
.connection {
stroke-linecap: round;
stroke-linejoin: round;
}
.blend {
mix-blend-mode: multiply;
opacity: 0.5;
}
.d2-3221982998 .fill-N1{fill:#0A0F25;}
.d2-3221982998 .fill-N2{fill:#676C7E;}
.d2-3221982998 .fill-N3{fill:#9499AB;}
.d2-3221982998 .fill-N4{fill:#CFD2DD;}
.d2-3221982998 .fill-N5{fill:#DEE1EB;}
.d2-3221982998 .fill-N6{fill:#EEF1F8;}
.d2-3221982998 .fill-N7{fill:#FFFFFF;}
.d2-3221982998 .fill-B1{fill:#0D32B2;}
.d2-3221982998 .fill-B2{fill:#0D32B2;}
.d2-3221982998 .fill-B3{fill:#E3E9FD;}
.d2-3221982998 .fill-B4{fill:#E3E9FD;}
.d2-3221982998 .fill-B5{fill:#EDF0FD;}
.d2-3221982998 .fill-B6{fill:#F7F8FE;}
.d2-3221982998 .fill-AA2{fill:#4A6FF3;}
.d2-3221982998 .fill-AA4{fill:#EDF0FD;}
.d2-3221982998 .fill-AA5{fill:#F7F8FE;}
.d2-3221982998 .fill-AB4{fill:#EDF0FD;}
.d2-3221982998 .fill-AB5{fill:#F7F8FE;}
.d2-3221982998 .stroke-N1{stroke:#0A0F25;}
.d2-3221982998 .stroke-N2{stroke:#676C7E;}
.d2-3221982998 .stroke-N3{stroke:#9499AB;}
.d2-3221982998 .stroke-N4{stroke:#CFD2DD;}
.d2-3221982998 .stroke-N5{stroke:#DEE1EB;}
.d2-3221982998 .stroke-N6{stroke:#EEF1F8;}
.d2-3221982998 .stroke-N7{stroke:#FFFFFF;}
.d2-3221982998 .stroke-B1{stroke:#0D32B2;}
.d2-3221982998 .stroke-B2{stroke:#0D32B2;}
.d2-3221982998 .stroke-B3{stroke:#E3E9FD;}
.d2-3221982998 .stroke-B4{stroke:#E3E9FD;}
.d2-3221982998 .stroke-B5{stroke:#EDF0FD;}
.d2-3221982998 .stroke-B6{stroke:#F7F8FE;}
.d2-3221982998 .stroke-AA2{stroke:#4A6FF3;}
.d2-3221982998 .stroke-AA4{stroke:#EDF0FD;}
.d2-3221982998 .stroke-AA5{stroke:#F7F8FE;}
.d2-3221982998 .stroke-AB4{stroke:#EDF0FD;}
.d2-3221982998 .stroke-AB5{stroke:#F7F8FE;}
.d2-3221982998 .background-color-N1{background-color:#0A0F25;}
.d2-3221982998 .background-color-N2{background-color:#676C7E;}
.d2-3221982998 .background-color-N3{background-color:#9499AB;}
.d2-3221982998 .background-color-N4{background-color:#CFD2DD;}
.d2-3221982998 .background-color-N5{background-color:#DEE1EB;}
.d2-3221982998 .background-color-N6{background-color:#EEF1F8;}
.d2-3221982998 .background-color-N7{background-color:#FFFFFF;}
.d2-3221982998 .background-color-B1{background-color:#0D32B2;}
.d2-3221982998 .background-color-B2{background-color:#0D32B2;}
.d2-3221982998 .background-color-B3{background-color:#E3E9FD;}
.d2-3221982998 .background-color-B4{background-color:#E3E9FD;}
.d2-3221982998 .background-color-B5{background-color:#EDF0FD;}
.d2-3221982998 .background-color-B6{background-color:#F7F8FE;}
.d2-3221982998 .background-color-AA2{background-color:#4A6FF3;}
.d2-3221982998 .background-color-AA4{background-color:#EDF0FD;}
.d2-3221982998 .background-color-AA5{background-color:#F7F8FE;}
.d2-3221982998 .background-color-AB4{background-color:#EDF0FD;}
.d2-3221982998 .background-color-AB5{background-color:#F7F8FE;}
.d2-3221982998 .color-N1{color:#0A0F25;}
.d2-3221982998 .color-N2{color:#676C7E;}
.d2-3221982998 .color-N3{color:#9499AB;}
.d2-3221982998 .color-N4{color:#CFD2DD;}
.d2-3221982998 .color-N5{color:#DEE1EB;}
.d2-3221982998 .color-N6{color:#EEF1F8;}
.d2-3221982998 .color-N7{color:#FFFFFF;}
.d2-3221982998 .color-B1{color:#0D32B2;}
.d2-3221982998 .color-B2{color:#0D32B2;}
.d2-3221982998 .color-B3{color:#E3E9FD;}
.d2-3221982998 .color-B4{color:#E3E9FD;}
.d2-3221982998 .color-B5{color:#EDF0FD;}
.d2-3221982998 .color-B6{color:#F7F8FE;}
.d2-3221982998 .color-AA2{color:#4A6FF3;}
.d2-3221982998 .color-AA4{color:#EDF0FD;}
.d2-3221982998 .color-AA5{color:#F7F8FE;}
.d2-3221982998 .color-AB4{color:#EDF0FD;}
.d2-3221982998 .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}]]></style><g id="hello" class="Ecs"><g class="shape" ><ellipse rx="67.000000" ry="67.000000" cx="67.000000" cy="67.000000" stroke="#0D32B2" fill="#F7F8FE" class="shape stroke-B1 fill-B6" style="stroke-width:2;" /></g><image href="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNzUgNzUiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDp1cmwoI09yYW5nZUdyYWRpZW50KTt9LmNscy0ye2ZpbGw6I2ZmZjt9PC9zdHlsZT48bGluZWFyR3JhZGllbnQgaWQ9Ik9yYW5nZUdyYWRpZW50IiB4MT0iMTU4LjA1IiB5MT0iLTExMy40MyIgeDI9IjE1OC4wNSIgeTI9IjM2LjU3IiBncmFkaWVudFRyYW5zZm9ybT0idHJhbnNsYXRlKDE3Ni40MyAxMjIuMDgpIHJvdGF0ZSgtMTM1KSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2M4NTExYiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2Y5MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjx0aXRsZT5BbWF6b24tRWxhc3RpYy1Db250YWluZXItU2VydmljZTwvdGl0bGU+PGcgaWQ9IlJlZmVyZW5jZSI+PHJlY3QgaWQ9Ik9yYW5nZV9HcmFkaWVudCIgZGF0YS1uYW1lPSJPcmFuZ2UgR3JhZGllbnQiIGNsYXNzPSJjbHMtMSIgd2lkdGg9Ijc1IiBoZWlnaHQ9Ijc1Ii8+PGcgaWQ9Ikljb25fVGVzdCIgZGF0YS1uYW1lPSJJY29uIFRlc3QiPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTM3LjI5LDY0LjQ0YTEsMSwwLDAsMS0uNTMtLjE0TDE0LDUxLjE4YTEuMDYsMS4wNiwwLDAsMS0uNTMtLjkyVjIzLjY4YTEuMDYsMS4wNiwwLDAsMSwuNTMtLjkyTDM0LjkzLDEwLjdhMSwxLDAsMCwxLDEuNTcuOVYyMy4xMUExLjA1LDEuMDUsMCwwLDEsMzYsMjRsLTEwLjQ3LDZWNDMuOTRsMTEuNzksNi44MSwxMC4zMS02YTEsMSwwLDAsMSwxLDBsOS45Miw1LjdhMS4wNiwxLjA2LDAsMCwxLC41My45MiwxLDEsMCwwLDEtLjUzLjkxbC0yMC43NSwxMkExLDEsMCwwLDEsMzcuMjksNjQuNDRaTTE1LjUsNDkuNTQsMzcuODMsNjIuNDMsNTcsNTEuMzVsLTgtNC42MUwzOC4zNyw1Mi44OGExLjExLDEuMTEsMCwwLDEtMS4wOSwwTDI0LDQ1LjIyYTEuMDUsMS4wNSwwLDAsMS0uNTMtLjkxVjI5LjQ2YTEsMSwwLDAsMSwuNTMtLjkxbDEwLjQ3LTZWMTMuMzdsLTE5LDExWiIvPjxwYXRoIGNsYXNzPSJjbHMtMiIgZD0iTTYwLjQ0LDQ5YTEuMTMsMS4xMywwLDAsMS0uNTMtLjE0TDUwLDQzLjEzYTEsMSwwLDAsMS0uNTMtLjkxVjMwLjExTDM5LDI0LjA3YTEuMDUsMS4wNSwwLDAsMS0uNTMtLjkxVjExLjY1YTEsMSwwLDAsMSwuNTItLjksMSwxLDAsMCwxLDEsMEw2MSwyMi44MmExLjA1LDEuMDUsMCwwLDEsLjUzLjkxVjQ3LjlhMS4wNiwxLjA2LDAsMCwxLS41My45MkExLjEsMS4xLDAsMCwxLDYwLjQ0LDQ5Wk01MS41LDQxLjU1bDgsNC42VjI0LjRsLTE5LTExdjkuMTNMNTEsMjguNjFhMSwxLDAsMCwxLC41My45MVoiLz48L2c+PC9nPjwvc3ZnPg==" x="43.500000" y="43.500000" width="47" height="47" /><text x="67.000000" y="41.000000" fill="#0A0F25" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">hello</text></g><mask id="d2-3221982998" maskUnits="userSpaceOnUse" x="-101" y="-101" width="336" height="336">
<rect x="-101" y="-101" width="336" height="336" fill="white"></rect>
<rect x="49.500000" y="25.000000" width="35" height="21" fill="rgba(0,0,0,0.75)"></rect>
</mask></svg></svg>
Side by side

After

Width:  |  Height:  |  Size: 11 KiB