feat: release design system engine, studio and component contracts

2026-10-19 13:09:03 +05:30
1 parent ff1065fb27
commit 3943b946d6
@@ -0,0 +1,13 @@
+page AgentPage {
+ seo { title = "Account settings" }
+ view {
+ <main class="wrn-agent-page"><h1>Account settings</h1>
+<PageHeader title={"Your profile"} />
+<Input id={"account-name"} label={"Your name"} placeholder={"Enter your name"} />
+<Input id={"account-email"} label={"Email"} type={"email"} placeholder={"you@example.com"} />
+<Alert title={"Design preview"} description={"This page uses your selected design system."} />
+<Button label={"Save profile"} variant={"default"} />
+ </main>
+ }
+ style { .wrn-agent-page { display: grid; padding: var(--wrn-space-panel); gap: var(--wrn-space-panel); color: var(--wrn-color-text); background: var(--wrn-color-bg); font-family: var(--wrn-font-sans); } }
+}
@@ -0,0 +1 @@
+{}
@@ -0,0 +1,112 @@
+{
+  "system": "angular",
+  "diagnostics": [],
+  "components": 104,
+  "recipes": [
+    "Accordion",
+    "AdvancedSelect",
+    "AnnouncementBar",
+    "AuthForm",
+    "AuthSplitLayout",
+    "AvatarGroup",
+    "BackToTop",
+    "Blockquote",
+    "Breadcrumb",
+    "ButtonGroup",
+    "CTASection",
+    "Carousel",
+    "Chart",
+    "ChatBubble",
+    "Clipboard",
+    "Collapse",
+    "ColorPicker",
+    "Columns",
+    "ComboBox",
+    "Confetti",
+    "CustomScrollbar",
+    "DataMap",
+    "DataTable",
+    "DatePicker",
+    "DeviceFrame",
+    "Divider",
+    "DragAndDrop",
+    "Drawer",
+    "DrawflowCanvas",
+    "Dropdown",
+    "FeatureCard",
+    "FeatureGrid",
+    "FeatureIconCard",
+    "FileInput",
+    "FileUploadProgress",
+    "FlowCanvas",
+    "Footer",
+    "Grid",
+    "Hero",
+    "HeroActions",
+    "Image",
+    "InputGroup",
+    "InputNumber",
+    "Kbd",
+    "LayoutSplitter",
+    "LegendIndicator",
+    "Link",
+    "List",
+    "ListGroup",
+    "Map",
+    "MarketingSectionHeader",
+    "Marquee",
+    "MegaMenu",
+    "MetricCard",
+    "MetricGrid",
+    "Navbar",
+    "Pagination",
+    "PinInput",
+    "Popover",
+    "PortalDashboard",
+    "PreferenceSwitcher",
+    "PublicPageShell",
+    "RangeSlider",
+    "Rating",
+    "Scrollspy",
+    "SearchBox",
+    "Section",
+    "SectionHeader",
+    "Sidebar",
+    "SplitHero",
+    "StatsBar",
+    "Stepper",
+    "StrongPassword",
+    "StyledIcon",
+    "Tabs",
+    "TextLink",
+    "TimePicker",
+    "Timeline",
+    "Toaster",
+    "ToggleCount",
+    "TogglePassword",
+    "TreeView",
+    "Typography",
+    "WysiwygEditor",
+    "Avatar",
+    "Badge",
+    "Progress",
+    "Skeleton",
+    "Spinner",
+    "Tooltip",
+    "Button",
+    "Input",
+    "Textarea",
+    "Select",
+    "Checkbox",
+    "Radio",
+    "Switch",
+    "Card",
+    "Alert",
+    "Modal",
+    "ContextMenu",
+    "Nav",
+    "PageHeader",
+    "Container"
+  ],
+  "limitations": "Only declared parts are styled. Native, provider and content-owned regions retain their documented boundaries."
+}
@@ -0,0 +1,13 @@
+page AgentPage {
+ seo { title = "Contact support" }
+ view {
+ <main class="wrn-agent-page"><h1>Contact support</h1>
+<PageHeader title={"How can we help?"} />
+<Input id={"support-name"} label={"Your name"} placeholder={"Enter your name"} />
+<Input id={"support-email"} label={"Email"} type={"email"} placeholder={"you@example.com"} />
+<Alert title={"Design preview"} description={"This page uses your selected design system."} />
+<Button label={"Send request"} variant={"default"} />
+ </main>
+ }
+ style { .wrn-agent-page { display: grid; padding: var(--wrn-space-panel); gap: var(--wrn-space-panel); color: var(--wrn-color-text); background: var(--wrn-color-bg); font-family: var(--wrn-font-sans); } }
+}
@@ -0,0 +1,130 @@
+{
+  "color.background": {
+    "$type": "color",
+    "$value": "#E8E0C0"
+  },
+  "color.bg": {
+    "$type": "color",
+    "$value": "#E8E0C0"
+  },
+  "color.border": {
+    "$type": "color",
+    "$value": "#535146"
+  },
+  "color.border-strong": {
+    "$type": "color",
+    "$value": "#535146"
+  },
+  "color.foreground": {
+    "$type": "color",
+    "$value": "#232320"
+  },
+  "color.primary": {
+    "$type": "color",
+    "$value": "#8F2448"
+  },
+  "color.primary-active": {
+    "$type": "color",
+    "$value": "#59172D"
+  },
+  "color.primary-contrast": {
+    "$type": "color",
+    "$value": "#FFFFFF"
+  },
+  "color.primary-hover": {
+    "$type": "color",
+    "$value": "#701C39"
+  },
+  "color.primary-muted": {
+    "$type": "color",
+    "$value": "#E8E0C0"
+  },
+  "color.primary-soft": {
+    "$type": "color",
+    "$value": "#E8E0C0"
+  },
+  "color.primary-text": {
+    "$type": "color",
+    "$value": "#701C39"
+  },
+  "color.surface": {
+    "$type": "color",
+    "$value": "#EDE4CF"
+  },
+  "color.surface-2": {
+    "$type": "color",
+    "$value": "#E8E0C0"
+  },
+  "color.surface-muted": {
+    "$type": "color",
+    "$value": "#E8E0C0"
+  },
+  "color.surface-raised": {
+    "$type": "color",
+    "$value": "#EDE4CF"
+  },
+  "color.surface-soft": {
+    "$type": "color",
+    "$value": "#E8E0C0"
+  },
+  "color.text": {
+    "$type": "color",
+    "$value": "#232320"
+  },
+  "color.text-muted": {
+    "$type": "color",
+    "$value": "#535146"
+  },
+  "color.text-subtle": {
+    "$type": "color",
+    "$value": "#535146"
+  },
+  "control.height": {
+    "$type": "dimension",
+    "$value": "2.5rem"
+  },
+  "elevation.panel": {
+    "$type": "shadow",
+    "$value": "3px 3px 0 #535146"
+  },
+  "scheme": {
+    "$type": "colorScheme",
+    "$value": "light"
+  },
+  "shape.base": {
+    "$type": "dimension",
+    "$value": "0"
+  },
+  "shape.control": {
+    "$type": "dimension",
+    "$value": "0"
+  },
+  "shape.dialog": {
+    "$type": "dimension",
+    "$value": "0"
+  },
+  "shape.panel": {
+    "$type": "dimension",
+    "$value": "0"
+  },
+  "space.control": {
+    "$type": "dimension",
+    "$value": "0.75rem"
+  },
+  "space.page": {
+    "$type": "dimension",
+    "$value": "1rem"
+  },
+  "space.panel": {
+    "$type": "dimension",
+    "$value": "1rem"
+  },
+  "type.body": {
+    "$type": "fontFamily",
+    "$value": "Arial, sans-serif"
+  },
+  "type.heading": {
+    "$type": "fontFamily",
+    "$value": "\"Times New Roman\", serif"
+  }
+}
@@ -0,0 +1,96 @@
+{
+  "passed": true,
+  "pages": 6,
+  "previews": 12,
+  "evaluations": [
+    {
+      "system": "square",
+      "page": "account.wrn",
+      "compiled": true,
+      "conformance": {
+        "ok": true,
+        "diagnostics": []
+      },
+      "modes": [
+        "light",
+        "dark"
+      ],
+      "preview": "Trusted shipped SSR components; static CSP-protected HTML."
+    },
+    {
+      "system": "square",
+      "page": "support.wrn",
+      "compiled": true,
+      "conformance": {
+        "ok": true,
+        "diagnostics": []
+      },
+      "modes": [
+        "light",
+        "dark"
+      ],
+      "preview": "Trusted shipped SSR components; static CSP-protected HTML."
+    },
+    {
+      "system": "soft",
+      "page": "account.wrn",
+      "compiled": true,
+      "conformance": {
+        "ok": true,
+        "diagnostics": []
+      },
+      "modes": [
+        "light",
+        "dark"
+      ],
+      "preview": "Trusted shipped SSR components; static CSP-protected HTML."
+    },
+    {
+      "system": "soft",
+      "page": "support.wrn",
+      "compiled": true,
+      "conformance": {
+        "ok": true,
+        "diagnostics": []
+      },
+      "modes": [
+        "light",
+        "dark"
+      ],
+      "preview": "Trusted shipped SSR components; static CSP-protected HTML."
+    },
+    {
+      "system": "angular",
+      "page": "account.wrn",
+      "compiled": true,
+      "conformance": {
+        "ok": true,
+        "diagnostics": []
+      },
+      "modes": [
+        "light",
+        "dark"
+      ],
+      "preview": "Trusted shipped SSR components; static CSP-protected HTML."
+    },
+    {
+      "system": "angular",
+      "page": "support.wrn",
+      "compiled": true,
+      "conformance": {
+        "ok": true,
+        "diagnostics": []
+      },
+      "modes": [
+        "light",
+        "dark"
+      ],
+      "preview": "Trusted shipped SSR components; static CSP-protected HTML."
+    }
+  ],
+  "limits": [
+    "No LLM call. This exercises the agent tool protocol deterministically.",
+    "Static checks and SSR previews do not certify all accessibility, dynamic behavior or visual quality.",
+    "Generated pages and design artifacts require explicit application integration."
+  ]
+}
@@ -0,0 +1,13 @@
+page AgentPage {
+ seo { title = "Account settings" }
+ view {
+ <main class="wrn-agent-page"><h1>Account settings</h1>
+<PageHeader title={"Your profile"} />
+<Input id={"account-name"} label={"Your name"} placeholder={"Enter your name"} />
+<Input id={"account-email"} label={"Email"} type={"email"} placeholder={"you@example.com"} />
+<Alert title={"Design preview"} description={"This page uses your selected design system."} />
+<Button label={"Save profile"} variant={"default"} />
+ </main>
+ }
+ style { .wrn-agent-page { display: grid; padding: var(--wrn-space-panel); gap: var(--wrn-space-panel); color: var(--wrn-color-text); background: var(--wrn-color-bg); font-family: var(--wrn-font-sans); } }
+}
@@ -0,0 +1 @@
+{}
@@ -0,0 +1,112 @@
+{
+  "system": "soft",
+  "diagnostics": [],
+  "components": 104,
+  "recipes": [
+    "Accordion",
+    "AdvancedSelect",
+    "AnnouncementBar",
+    "AuthForm",
+    "AuthSplitLayout",
+    "AvatarGroup",
+    "BackToTop",
+    "Blockquote",
+    "Breadcrumb",
+    "ButtonGroup",
+    "CTASection",
+    "Carousel",
+    "Chart",
+    "ChatBubble",
+    "Clipboard",
+    "Collapse",
+    "ColorPicker",
+    "Columns",
+    "ComboBox",
+    "Confetti",
+    "CustomScrollbar",
+    "DataMap",
+    "DataTable",
+    "DatePicker",
+    "DeviceFrame",
+    "Divider",
+    "DragAndDrop",
+    "Drawer",
+    "DrawflowCanvas",
+    "Dropdown",
+    "FeatureCard",
+    "FeatureGrid",
+    "FeatureIconCard",
+    "FileInput",
+    "FileUploadProgress",
+    "FlowCanvas",
+    "Footer",
+    "Grid",
+    "Hero",
+    "HeroActions",
+    "Image",
+    "InputGroup",
+    "InputNumber",
+    "Kbd",
+    "LayoutSplitter",
+    "LegendIndicator",
+    "Link",
+    "List",
+    "ListGroup",
+    "Map",
+    "MarketingSectionHeader",
+    "Marquee",
+    "MegaMenu",
+    "MetricCard",
+    "MetricGrid",
+    "Navbar",
+    "Pagination",
+    "PinInput",
+    "Popover",
+    "PortalDashboard",
+    "PreferenceSwitcher",
+    "PublicPageShell",
+    "RangeSlider",
+    "Rating",
+    "Scrollspy",
+    "SearchBox",
+    "Section",
+    "SectionHeader",
+    "Sidebar",
+    "SplitHero",
+    "StatsBar",
+    "Stepper",
+    "StrongPassword",
+    "StyledIcon",
+    "Tabs",
+    "TextLink",
+    "TimePicker",
+    "Timeline",
+    "Toaster",
+    "ToggleCount",
+    "TogglePassword",
+    "TreeView",
+    "Typography",
+    "WysiwygEditor",
+    "Avatar",
+    "Badge",
+    "Progress",
+    "Skeleton",
+    "Spinner",
+    "Tooltip",
+    "Button",
+    "Input",
+    "Textarea",
+    "Select",
+    "Checkbox",
+    "Radio",
+    "Switch",
+    "Card",
+    "Alert",
+    "Modal",
+    "ContextMenu",
+    "Nav",
+    "PageHeader",
+    "Container"
+  ],
+  "limitations": "Only declared parts are styled. Native, provider and content-owned regions retain their documented boundaries."
+}
@@ -0,0 +1,13 @@
+page AgentPage {
+ seo { title = "Contact support" }
+ view {
+ <main class="wrn-agent-page"><h1>Contact support</h1>
+<PageHeader title={"How can we help?"} />
+<Input id={"support-name"} label={"Your name"} placeholder={"Enter your name"} />
+<Input id={"support-email"} label={"Email"} type={"email"} placeholder={"you@example.com"} />
+<Alert title={"Design preview"} description={"This page uses your selected design system."} />
+<Button label={"Send request"} variant={"default"} />
+ </main>
+ }
+ style { .wrn-agent-page { display: grid; padding: var(--wrn-space-panel); gap: var(--wrn-space-panel); color: var(--wrn-color-text); background: var(--wrn-color-bg); font-family: var(--wrn-font-sans); } }
+}
@@ -0,0 +1,130 @@
+{
+  "color.background": {
+    "$type": "color",
+    "$value": "#E8DCC7"
+  },
+  "color.bg": {
+    "$type": "color",
+    "$value": "#E8DCC7"
+  },
+  "color.border": {
+    "$type": "color",
+    "$value": "#606C38"
+  },
+  "color.border-strong": {
+    "$type": "color",
+    "$value": "#606C38"
+  },
+  "color.foreground": {
+    "$type": "color",
+    "$value": "#292D24"
+  },
+  "color.primary": {
+    "$type": "color",
+    "$value": "#606C38"
+  },
+  "color.primary-active": {
+    "$type": "color",
+    "$value": "#3D4424"
+  },
+  "color.primary-contrast": {
+    "$type": "color",
+    "$value": "#FFFFFF"
+  },
+  "color.primary-hover": {
+    "$type": "color",
+    "$value": "#4B542C"
+  },
+  "color.primary-muted": {
+    "$type": "color",
+    "$value": "#D4B895"
+  },
+  "color.primary-soft": {
+    "$type": "color",
+    "$value": "#D4B895"
+  },
+  "color.primary-text": {
+    "$type": "color",
+    "$value": "#3D4424"
+  },
+  "color.surface": {
+    "$type": "color",
+    "$value": "#D4B895"
+  },
+  "color.surface-2": {
+    "$type": "color",
+    "$value": "#E8DCC7"
+  },
+  "color.surface-muted": {
+    "$type": "color",
+    "$value": "#E8DCC7"
+  },
+  "color.surface-raised": {
+    "$type": "color",
+    "$value": "#D4B895"
+  },
+  "color.surface-soft": {
+    "$type": "color",
+    "$value": "#E8DCC7"
+  },
+  "color.text": {
+    "$type": "color",
+    "$value": "#292D24"
+  },
+  "color.text-muted": {
+    "$type": "color",
+    "$value": "#4B5141"
+  },
+  "color.text-subtle": {
+    "$type": "color",
+    "$value": "#4B5141"
+  },
+  "control.height": {
+    "$type": "dimension",
+    "$value": "2.75rem"
+  },
+  "elevation.panel": {
+    "$type": "shadow",
+    "$value": "none"
+  },
+  "scheme": {
+    "$type": "colorScheme",
+    "$value": "light"
+  },
+  "shape.base": {
+    "$type": "dimension",
+    "$value": "24px"
+  },
+  "shape.control": {
+    "$type": "dimension",
+    "$value": "16px"
+  },
+  "shape.dialog": {
+    "$type": "dimension",
+    "$value": "32px"
+  },
+  "shape.panel": {
+    "$type": "dimension",
+    "$value": "24px"
+  },
+  "space.control": {
+    "$type": "dimension",
+    "$value": "1.25rem"
+  },
+  "space.page": {
+    "$type": "dimension",
+    "$value": "1.5rem"
+  },
+  "space.panel": {
+    "$type": "dimension",
+    "$value": "1.5rem"
+  },
+  "type.body": {
+    "$type": "fontFamily",
+    "$value": "Georgia, serif"
+  },
+  "type.heading": {
+    "$type": "fontFamily",
+    "$value": "Georgia, serif"
+  }
+}
@@ -0,0 +1,13 @@
+page AgentPage {
+ seo { title = "Account settings" }
+ view {
+ <main class="wrn-agent-page"><h1>Account settings</h1>
+<PageHeader title={"Your profile"} />
+<Input id={"account-name"} label={"Your name"} placeholder={"Enter your name"} />
+<Input id={"account-email"} label={"Email"} type={"email"} placeholder={"you@example.com"} />
+<Alert title={"Design preview"} description={"This page uses your selected design system."} />
+<Button label={"Save profile"} variant={"default"} />
+ </main>
+ }
+ style { .wrn-agent-page { display: grid; padding: var(--wrn-space-panel); gap: var(--wrn-space-panel); color: var(--wrn-color-text); background: var(--wrn-color-bg); font-family: var(--wrn-font-sans); } }
+}
@@ -0,0 +1 @@
+{}
@@ -0,0 +1,112 @@
+{
+  "system": "square",
+  "diagnostics": [],
+  "components": 104,
+  "recipes": [
+    "Accordion",
+    "AdvancedSelect",
+    "AnnouncementBar",
+    "AuthForm",
+    "AuthSplitLayout",
+    "AvatarGroup",
+    "BackToTop",
+    "Blockquote",
+    "Breadcrumb",
+    "ButtonGroup",
+    "CTASection",
+    "Carousel",
+    "Chart",
+    "ChatBubble",
+    "Clipboard",
+    "Collapse",
+    "ColorPicker",
+    "Columns",
+    "ComboBox",
+    "Confetti",
+    "CustomScrollbar",
+    "DataMap",
+    "DataTable",
+    "DatePicker",
+    "DeviceFrame",
+    "Divider",
+    "DragAndDrop",
+    "Drawer",
+    "DrawflowCanvas",
+    "Dropdown",
+    "FeatureCard",
+    "FeatureGrid",
+    "FeatureIconCard",
+    "FileInput",
+    "FileUploadProgress",
+    "FlowCanvas",
+    "Footer",
+    "Grid",
+    "Hero",
+    "HeroActions",
+    "Image",
+    "InputGroup",
+    "InputNumber",
+    "Kbd",
+    "LayoutSplitter",
+    "LegendIndicator",
+    "Link",
+    "List",
+    "ListGroup",
+    "Map",
+    "MarketingSectionHeader",
+    "Marquee",
+    "MegaMenu",
+    "MetricCard",
+    "MetricGrid",
+    "Navbar",
+    "Pagination",
+    "PinInput",
+    "Popover",
+    "PortalDashboard",
+    "PreferenceSwitcher",
+    "PublicPageShell",
+    "RangeSlider",
+    "Rating",
+    "Scrollspy",
+    "SearchBox",
+    "Section",
+    "SectionHeader",
+    "Sidebar",
+    "SplitHero",
+    "StatsBar",
+    "Stepper",
+    "StrongPassword",
+    "StyledIcon",
+    "Tabs",
+    "TextLink",
+    "TimePicker",
+    "Timeline",
+    "Toaster",
+    "ToggleCount",
+    "TogglePassword",
+    "TreeView",
+    "Typography",
+    "WysiwygEditor",
+    "Avatar",
+    "Badge",
+    "Progress",
+    "Skeleton",
+    "Spinner",
+    "Tooltip",
+    "Button",
+    "Input",
+    "Textarea",
+    "Select",
+    "Checkbox",
+    "Radio",
+    "Switch",
+    "Card",
+    "Alert",
+    "Modal",
+    "ContextMenu",
+    "Nav",
+    "PageHeader",
+    "Container"
+  ],
+  "limitations": "Only declared parts are styled. Native, provider and content-owned regions retain their documented boundaries."
+}
@@ -0,0 +1,13 @@
+page AgentPage {
+ seo { title = "Contact support" }
+ view {
+ <main class="wrn-agent-page"><h1>Contact support</h1>
+<PageHeader title={"How can we help?"} />
+<Input id={"support-name"} label={"Your name"} placeholder={"Enter your name"} />
+<Input id={"support-email"} label={"Email"} type={"email"} placeholder={"you@example.com"} />
+<Alert title={"Design preview"} description={"This page uses your selected design system."} />
+<Button label={"Send request"} variant={"default"} />
+ </main>
+ }
+ style { .wrn-agent-page { display: grid; padding: var(--wrn-space-panel); gap: var(--wrn-space-panel); color: var(--wrn-color-text); background: var(--wrn-color-bg); font-family: var(--wrn-font-sans); } }
+}
@@ -0,0 +1,130 @@
+{
+  "color.background": {
+    "$type": "color",
+    "$value": "#0B0C0A"
+  },
+  "color.bg": {
+    "$type": "color",
+    "$value": "#0B0C0A"
+  },
+  "color.border": {
+    "$type": "color",
+    "$value": "#696C63"
+  },
+  "color.border-strong": {
+    "$type": "color",
+    "$value": "#696C63"
+  },
+  "color.foreground": {
+    "$type": "color",
+    "$value": "#F7F7F8"
+  },
+  "color.primary": {
+    "$type": "color",
+    "$value": "#FFB800"
+  },
+  "color.primary-active": {
+    "$type": "color",
+    "$value": "#FFE099"
+  },
+  "color.primary-contrast": {
+    "$type": "color",
+    "$value": "#000000"
+  },
+  "color.primary-hover": {
+    "$type": "color",
+    "$value": "#FFD15C"
+  },
+  "color.primary-muted": {
+    "$type": "color",
+    "$value": "#0B0C0A"
+  },
+  "color.primary-soft": {
+    "$type": "color",
+    "$value": "#0B0C0A"
+  },
+  "color.primary-text": {
+    "$type": "color",
+    "$value": "#FFB800"
+  },
+  "color.surface": {
+    "$type": "color",
+    "$value": "#000000"
+  },
+  "color.surface-2": {
+    "$type": "color",
+    "$value": "#0B0C0A"
+  },
+  "color.surface-muted": {
+    "$type": "color",
+    "$value": "#0B0C0A"
+  },
+  "color.surface-raised": {
+    "$type": "color",
+    "$value": "#000000"
+  },
+  "color.surface-soft": {
+    "$type": "color",
+    "$value": "#0B0C0A"
+  },
+  "color.text": {
+    "$type": "color",
+    "$value": "#F7F7F8"
+  },
+  "color.text-muted": {
+    "$type": "color",
+    "$value": "#BEC0B9"
+  },
+  "color.text-subtle": {
+    "$type": "color",
+    "$value": "#BEC0B9"
+  },
+  "control.height": {
+    "$type": "dimension",
+    "$value": "2.5rem"
+  },
+  "elevation.panel": {
+    "$type": "shadow",
+    "$value": "none"
+  },
+  "scheme": {
+    "$type": "colorScheme",
+    "$value": "dark"
+  },
+  "shape.base": {
+    "$type": "dimension",
+    "$value": "0"
+  },
+  "shape.control": {
+    "$type": "dimension",
+    "$value": "0"
+  },
+  "shape.dialog": {
+    "$type": "dimension",
+    "$value": "0"
+  },
+  "shape.panel": {
+    "$type": "dimension",
+    "$value": "0"
+  },
+  "space.control": {
+    "$type": "dimension",
+    "$value": "0.75rem"
+  },
+  "space.page": {
+    "$type": "dimension",
+    "$value": "1rem"
+  },
+  "space.panel": {
+    "$type": "dimension",
+    "$value": "1rem"
+  },
+  "type.body": {
+    "$type": "fontFamily",
+    "$value": "\"IBM Plex Mono\", \"Courier New\", monospace"
+  },
+  "type.heading": {
+    "$type": "fontFamily",
+    "$value": "\"IBM Plex Mono\", \"Courier New\", monospace"
+  }
+}