npm - @motion-proto/live-tokens - Versions diffs - 0.74.0 → 0.76.0 - Mend

@motion-proto/live-tokens 0.74.0 → 0.76.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (171) hide show

package/.claude/skills/live-tokens-check-compliance/SKILL.md +33 -38
package/.claude/skills/live-tokens-create-component/SKILL copy.md +196 -0
package/.claude/skills/live-tokens-create-component/SKILL.md +198 -146
package/.claude/skills/live-tokens-create-component/references/contract-tests.md +95 -52
package/.claude/skills/live-tokens-create-component/references/intrinsics.md +2 -2
package/.claude/skills/live-tokens-create-component/references/linked-siblings.md +2 -2
package/.claude/skills/live-tokens-create-component/references/sketch-mode.md +12 -12
package/.claude/skills/live-tokens-create-component/references/token-naming.md +2 -1
package/.claude/skills/live-tokens-create-page/SKILL.md +187 -0
package/.claude/skills/live-tokens-create-page/references/interaction-sources.md +66 -0
package/.claude/skills/live-tokens-create-page/references/layout-sources.md +87 -0
package/.claude/skills/live-tokens-create-theme/SKILL.md +52 -48
package/.claude/skills/live-tokens-create-theme/references/design-directions.md +1 -1
package/.claude/skills/live-tokens-fix-findings/SKILL.md +69 -60
package/.claude/skills/live-tokens-pick-component/SKILL.md +64 -79
package/.claude/skills/live-tokens-set-colors/SKILL.md +47 -38
package/.claude/skills/live-tokens-set-geometry/SKILL.md +58 -35
package/.claude/skills/live-tokens-set-geometry/references/geometry-anchors.md +5 -3
package/.claude/skills/live-tokens-set-type/SKILL.md +30 -30
package/CHANGELOG.md +138 -0
package/README.md +17 -7
package/bin/check-component.mjs +91 -19
package/bin/check-page.mjs +102 -21
package/bin/cli.mjs +87 -113
package/bin/contractRunner.mjs +945 -0
package/bin/create.mjs +1 -1
package/bin/lib/catalogue.mjs +37 -30
package/bin/lib/findings.mjs +46 -15
package/bin/lib/report.mjs +3 -3
package/bin/lib/tokenVocabulary.mjs +4 -4
package/bin/migrate-routes.mjs +5 -5
package/bin/migrate.mjs +4 -4
package/bin/save-theme.mjs +8 -9
package/bin/set-colors.mjs +9 -11
package/bin/set-geometry.mjs +7 -7
package/bin/set-type.mjs +5 -7
package/bin/setup-claude.mjs +110 -0
package/dist-plugin/{chunk-W6Y4BWFB.js → chunk-6WGFOJXO.js} +22 -0
package/dist-plugin/{chunk-7VRTBGJT.js → chunk-PDNL4NC5.js} +9 -2
package/dist-plugin/{chunk-V3YF6CGT.js → chunk-SWXRVZKT.js} +43 -1
package/dist-plugin/{dataPaths-BhWzd5cL.d.cts → dataPaths-BpIK_Obx.d.cts} +1 -0
package/dist-plugin/{dataPaths-BhWzd5cL.d.ts → dataPaths-BpIK_Obx.d.ts} +1 -0
package/dist-plugin/index.cjs +310 -147
package/dist-plugin/index.d.cts +1 -1
package/dist-plugin/index.d.ts +1 -1
package/dist-plugin/index.js +218 -122
package/dist-plugin/migrateData/index.cjs +66 -2
package/dist-plugin/migrateData/index.d.cts +1 -1
package/dist-plugin/migrateData/index.d.ts +1 -1
package/dist-plugin/migrateData/index.js +3 -3
package/dist-plugin/setColors/index.cjs +61 -4
package/dist-plugin/setColors/index.d.cts +1 -1
package/dist-plugin/setColors/index.d.ts +1 -1
package/dist-plugin/setColors/index.js +5 -5
package/dist-plugin/setGeometry/index.cjs +107 -44
package/dist-plugin/setGeometry/index.d.cts +5 -5
package/dist-plugin/setGeometry/index.d.ts +5 -5
package/dist-plugin/setGeometry/index.js +51 -45
package/dist-plugin/setType/index.cjs +15 -0
package/dist-plugin/setType/index.d.cts +1 -1
package/dist-plugin/setType/index.d.ts +1 -1
package/dist-plugin/setType/index.js +1 -1
package/dist-plugin/tokensCssMigrations/index.d.cts +1 -1
package/dist-plugin/tokensCssMigrations/index.d.ts +1 -1
package/dist-plugin/tokensCssMigrations/index.js +1 -1
package/package.json +35 -8
package/src/app/site.css +19 -9
package/src/editor/bootstrap.ts +2 -0
package/src/editor/component-editor/CollapsibleSectionEditor.svelte +4 -4
package/src/editor/component-editor/DialogEditor.svelte +4 -4
package/src/editor/component-editor/MenuSelectEditor.svelte +4 -1
package/src/editor/component-editor/SegmentedControlEditor.svelte +6 -1
package/src/editor/component-editor/TabBarEditor.svelte +1 -1
package/src/editor/component-editor/TableEditor.svelte +2 -2
package/src/editor/component-editor/scaffolding/TokenLayout.svelte +6 -3
package/src/editor/component-editor/scaffolding/VariantGroup.svelte +41 -20
package/src/editor/core/components/adjustAliases.ts +59 -45
package/src/editor/core/components/aliasKinds.ts +9 -5
package/src/editor/core/preview/themePreview.ts +9 -2
package/src/editor/core/sketch/sketchLayer.ts +22 -0
package/src/editor/core/store/editorStore.ts +10 -1
package/src/editor/core/themes/buildColors.ts +3 -3
package/src/editor/core/themes/liveStateStream.ts +26 -0
package/src/editor/core/themes/migrations/2026-09-07-stroke-role-renames.ts +52 -0
package/src/editor/core/themes/migrations/index.ts +2 -0
package/src/editor/core/themes/themeDocumentSync.ts +22 -11
package/src/editor/core/themes/themeService.ts +9 -2
package/src/editor/pages/ComponentEditorPage.svelte +17 -1
package/src/editor/pages/liveTokensEditorHandle.ts +23 -0
package/src/editor/skill-atlas/SkillAtlas.svelte +75 -573
package/src/editor/skill-atlas/TreeCanvas.svelte +263 -0
package/src/editor/skill-atlas/TreeNodeCard.svelte +136 -53
package/src/editor/skill-atlas/edges.ts +31 -0
package/src/editor/skill-atlas/skillSources.generated.ts +20 -19
package/src/editor/skill-atlas/skillTrees.ts +19 -3840
package/src/editor/skill-atlas/trees/check-compliance.ts +183 -0
package/src/editor/skill-atlas/trees/create-component.ts +275 -0
package/src/editor/skill-atlas/trees/create-page.ts +320 -0
package/src/editor/skill-atlas/trees/create-theme.ts +255 -0
package/src/editor/skill-atlas/trees/fix-findings.ts +469 -0
package/src/editor/skill-atlas/trees/pick-component.ts +300 -0
package/src/editor/skill-atlas/trees/set-colors.ts +148 -0
package/src/editor/skill-atlas/trees/set-geometry.ts +136 -0
package/src/editor/skill-atlas/trees/set-type.ts +142 -0
package/src/editor/skill-atlas/types.ts +3 -4
package/src/editor/skill-atlas/wireLayout.ts +287 -0
package/src/live-tokens/data/themes/autumn.json +15 -15
package/src/live-tokens/data/themes/halloween.json +15 -15
package/src/live-tokens/data/themes/midnight-study.json +15 -15
package/src/live-tokens/data/themes/ocean.json +15 -15
package/src/live-tokens/data/themes/royal-velvet.json +15 -15
package/src/live-tokens/data/themes/sketchy.json +15 -15
package/src/live-tokens/data/themes/spring-meadow.json +15 -15
package/src/live-tokens/data/themes/sunset.json +15 -15
package/src/system/components/Badge.svelte +7 -0
package/src/system/components/Button.svelte +7 -0
package/src/system/components/Callout.svelte +10 -6
package/src/system/components/Card.svelte +23 -4
package/src/system/components/CodeSnippet.svelte +4 -3
package/src/system/components/CollapsibleSection.svelte +23 -8
package/src/system/components/CornerBadge.svelte +6 -0
package/src/system/components/Dialog.svelte +13 -6
package/src/system/components/IconButton.svelte +9 -0
package/src/system/components/Image.svelte +8 -0
package/src/system/components/ImageLightbox.svelte +6 -0
package/src/system/components/InlineEditActions.svelte +7 -0
package/src/system/components/Input.svelte +7 -0
package/src/system/components/MenuSelect.svelte +7 -0
package/src/system/components/Notification.svelte +7 -0
package/src/system/components/Panel.svelte +6 -0
package/src/system/components/ProgressBar.svelte +5 -0
package/src/system/components/RadioButton.svelte +11 -5
package/src/system/components/SectionDivider.svelte +8 -0
package/src/system/components/SegmentedControl.svelte +6 -0
package/src/system/components/SideNavigation.svelte +6 -0
package/src/system/components/Slider.svelte +7 -4
package/src/system/components/TabBar.svelte +15 -9
package/src/system/components/Table.svelte +8 -3
package/src/system/components/Toggle.svelte +4 -4
package/src/system/components/Tooltip.svelte +6 -0
package/src/testing-js/chunk-AO7EZHYV.js +776 -0
package/src/testing-js/chunk-AO7EZHYV.js.map +1 -0
package/src/testing-js/chunk-FAFOAWYL.js +39 -0
package/src/testing-js/chunk-FAFOAWYL.js.map +1 -0
package/src/testing-js/chunk-L73N4NSO.js +23 -0
package/src/testing-js/chunk-L73N4NSO.js.map +1 -0
package/src/testing-js/chunk-LXR3MN6N.js +3063 -0
package/src/testing-js/chunk-LXR3MN6N.js.map +1 -0
package/src/testing-js/chunk-ZMSX6CXR.js +53 -0
package/src/testing-js/chunk-ZMSX6CXR.js.map +1 -0
package/src/testing-js/component-alias.contract.js +81 -0
package/src/testing-js/component-alias.contract.js.map +1 -0
package/src/testing-js/component-editor.contract.js +62 -0
package/src/testing-js/component-editor.contract.js.map +1 -0
package/src/testing-js/component-render.contract.js +568 -0
package/src/testing-js/component-render.contract.js.map +1 -0
package/src/testing-js/index.d.ts +293 -0
package/src/testing-js/index.js +222 -0
package/src/testing-js/index.js.map +1 -0
package/src/testing-js/registry.contract.js +39 -0
package/src/testing-js/registry.contract.js.map +1 -0
package/src/testing-js/vitest-BE6uGF31.d.ts +73 -0
package/src/testing-js/vitest.d.ts +3 -0
package/src/testing-js/vitest.js +13 -0
package/src/testing-js/vitest.js.map +1 -0
package/template/README.md +13 -0
package/template/_gitignore +6 -0
package/template/package.json +3 -1
package/template/src/pages/Home.svelte +4 -18
package/.claude/skills/live-tokens-build-page/SKILL.md +0 -103
package/.claude/skills/live-tokens-build-page/references/layout-sources.md +0 -48

package/src/live-tokens/data/themes/midnight-study.json CHANGED Viewed

@@ -2952,8 +2952,8 @@
         "--collapsiblesection-chromeless-hover-icon-size": "--icon-size-xs",
         "--collapsiblesection-chromeless-expanded-padding": "--space-4",
         "--collapsiblesection-divider-default-surface": "--color-transparent",
-        "--collapsiblesection-divider-default-border": "--border-brand",
-        "--collapsiblesection-divider-default-border-width": "--border-width-1",
+        "--collapsiblesection-divider-default-hairline-color": "--border-brand",
+        "--collapsiblesection-divider-default-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-default-padding": "--space-4",
         "--collapsiblesection-divider-default-label": "--text-primary",
         "--collapsiblesection-divider-default-label-font-family": "--font-sans",
@@ -2963,8 +2963,8 @@
         "--collapsiblesection-divider-default-icon": "--text-primary",
         "--collapsiblesection-divider-default-icon-size": "--icon-size-xs",
         "--collapsiblesection-divider-hover-surface": "--color-transparent",
-        "--collapsiblesection-divider-hover-border": "--border-neutral",
-        "--collapsiblesection-divider-hover-border-width": "--border-width-1",
+        "--collapsiblesection-divider-hover-hairline-color": "--border-neutral",
+        "--collapsiblesection-divider-hover-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-hover-padding": "--space-4",
         "--collapsiblesection-divider-hover-label": "--text-primary",
         "--collapsiblesection-divider-hover-label-font-family": "--font-sans",
@@ -3061,8 +3061,8 @@
         "--dialog-shadow": "--shadow-2xl",
         "--dialog-blur": "--blur-none",
         "--dialog-header-surface": "--surface-neutral-lower",
-        "--dialog-header-border": "--border-neutral-subtle",
-        "--dialog-header-border-width": "--border-width-1",
+        "--dialog-header-divider": "--border-neutral-subtle",
+        "--dialog-header-divider-width": "--border-width-1",
         "--dialog-header-padding": "--space-4",
         "--dialog-title": "--text-primary",
         "--dialog-title-font-family": "--font-sans",
@@ -3077,8 +3077,8 @@
         "--dialog-body-font-size": "--font-size-md",
         "--dialog-body-font-weight": "--font-weight-normal",
         "--dialog-body-line-height": "--line-height-normal",
-        "--dialog-footer-border": "--border-neutral-subtle",
-        "--dialog-footer-border-width": "--border-width-1",
+        "--dialog-footer-divider": "--border-neutral-subtle",
+        "--dialog-footer-divider-width": "--border-width-1",
         "--dialog-footer-padding": "--space-10"
       }
     },
@@ -3866,7 +3866,7 @@
         "--tabbar-default-tab-border-width": "--border-width-0",
         "--tabbar-default-tab-top-radius": "--radius-none",
         "--tabbar-default-tab-bottom-radius": "--radius-none",
-        "--tabbar-default-indicator-border-width": "--border-width-2",
+        "--tabbar-default-indicator-width": "--border-width-2",
         "--tabbar-hover-text": "--text-secondary",
         "--tabbar-hover-surface": "--surface-neutral-lower",
         "--tabbar-hover-text-font-family": "--font-sans",
@@ -3880,7 +3880,7 @@
         "--tabbar-hover-tab-border-width": "--border-width-0",
         "--tabbar-hover-tab-top-radius": "--radius-none",
         "--tabbar-hover-tab-bottom-radius": "--radius-none",
-        "--tabbar-hover-indicator-border-width": "--border-width-2",
+        "--tabbar-hover-indicator-width": "--border-width-2",
         "--tabbar-active-text": "--text-primary",
         "--tabbar-active-border": "--color-brand-500",
         "--tabbar-active-surface": "--tint-low",
@@ -3894,7 +3894,7 @@
         "--tabbar-active-tab-border-width": "--border-width-0",
         "--tabbar-active-tab-top-radius": "--radius-none",
         "--tabbar-active-tab-bottom-radius": "--radius-none",
-        "--tabbar-active-indicator-border-width": "--border-width-2",
+        "--tabbar-active-indicator-width": "--border-width-2",
         "--tabbar-disabled-text": "--text-disabled",
         "--tabbar-disabled-text-font-family": "--font-sans",
         "--tabbar-disabled-text-font-size": "--font-size-md",
@@ -3908,7 +3908,7 @@
         "--tabbar-disabled-tab-border-width": "--border-width-0",
         "--tabbar-disabled-tab-top-radius": "--radius-none",
         "--tabbar-disabled-tab-bottom-radius": "--radius-none",
-        "--tabbar-disabled-indicator-border-width": "--border-width-2"
+        "--tabbar-disabled-indicator-width": "--border-width-2"
       }
     },
     "table": {
@@ -3929,8 +3929,8 @@
         "--table-default-header-font-weight": "--font-weight-semibold",
         "--table-default-header-line-height": "--line-height-none",
         "--table-default-header-padding": "--space-8",
-        "--table-default-header-border": "--border-neutral",
-        "--table-default-header-border-width": "--border-width-1",
+        "--table-default-header-divider": "--border-neutral",
+        "--table-default-header-divider-width": "--border-width-1",
         "--table-default-cell-text": "--text-secondary",
         "--table-default-cell-font-family": "--font-sans",
         "--table-default-cell-font-size": "--font-size-md",
@@ -4052,5 +4052,5 @@
       }
     }
   },
-  "componentSchemaVersion": 26
+  "componentSchemaVersion": 27
 }

package/src/live-tokens/data/themes/ocean.json CHANGED Viewed

@@ -2894,8 +2894,8 @@
         "--collapsiblesection-chromeless-hover-icon-size": "--icon-size-xs",
         "--collapsiblesection-chromeless-expanded-padding": "--space-6",
         "--collapsiblesection-divider-default-surface": "--color-transparent",
-        "--collapsiblesection-divider-default-border": "--border-brand",
-        "--collapsiblesection-divider-default-border-width": "--border-width-1",
+        "--collapsiblesection-divider-default-hairline-color": "--border-brand",
+        "--collapsiblesection-divider-default-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-default-padding": "--space-6",
         "--collapsiblesection-divider-default-label": "--text-primary",
         "--collapsiblesection-divider-default-label-font-family": "--font-sans",
@@ -2905,8 +2905,8 @@
         "--collapsiblesection-divider-default-icon": "--text-primary",
         "--collapsiblesection-divider-default-icon-size": "--icon-size-xs",
         "--collapsiblesection-divider-hover-surface": "--color-transparent",
-        "--collapsiblesection-divider-hover-border": "--border-neutral",
-        "--collapsiblesection-divider-hover-border-width": "--border-width-1",
+        "--collapsiblesection-divider-hover-hairline-color": "--border-neutral",
+        "--collapsiblesection-divider-hover-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-hover-padding": "--space-6",
         "--collapsiblesection-divider-hover-label": "--text-primary",
         "--collapsiblesection-divider-hover-label-font-family": "--font-sans",
@@ -3003,8 +3003,8 @@
         "--dialog-shadow": "--shadow-2xl",
         "--dialog-blur": "--blur-none",
         "--dialog-header-surface": "--surface-neutral-lower",
-        "--dialog-header-border": "--border-neutral-subtle",
-        "--dialog-header-border-width": "--border-width-1",
+        "--dialog-header-divider": "--border-neutral-subtle",
+        "--dialog-header-divider-width": "--border-width-1",
         "--dialog-header-padding": "--space-10",
         "--dialog-title": "--text-primary",
         "--dialog-title-font-family": "--font-sans",
@@ -3019,8 +3019,8 @@
         "--dialog-body-font-size": "--font-size-md",
         "--dialog-body-font-weight": "--font-weight-normal",
         "--dialog-body-line-height": "--line-height-normal",
-        "--dialog-footer-border": "--border-neutral-subtle",
-        "--dialog-footer-border-width": "--border-width-1",
+        "--dialog-footer-divider": "--border-neutral-subtle",
+        "--dialog-footer-divider-width": "--border-width-1",
         "--dialog-footer-padding": "--space-20"
       }
     },
@@ -3807,7 +3807,7 @@
         "--tabbar-default-tab-border-width": "--border-width-0",
         "--tabbar-default-tab-top-radius": "--radius-md",
         "--tabbar-default-tab-bottom-radius": "--radius-md",
-        "--tabbar-default-indicator-border-width": "--border-width-2",
+        "--tabbar-default-indicator-width": "--border-width-2",
         "--tabbar-hover-text": "--text-secondary",
         "--tabbar-hover-surface": "--surface-neutral-lower",
         "--tabbar-hover-text-font-family": "--font-sans",
@@ -3821,7 +3821,7 @@
         "--tabbar-hover-tab-border-width": "--border-width-0",
         "--tabbar-hover-tab-top-radius": "--radius-md",
         "--tabbar-hover-tab-bottom-radius": "--radius-md",
-        "--tabbar-hover-indicator-border-width": "--border-width-2",
+        "--tabbar-hover-indicator-width": "--border-width-2",
         "--tabbar-active-text": "--text-primary",
         "--tabbar-active-border": "--color-brand-500",
         "--tabbar-active-surface": "--tint-low",
@@ -3835,7 +3835,7 @@
         "--tabbar-active-tab-border-width": "--border-width-0",
         "--tabbar-active-tab-top-radius": "--radius-md",
         "--tabbar-active-tab-bottom-radius": "--radius-md",
-        "--tabbar-active-indicator-border-width": "--border-width-2",
+        "--tabbar-active-indicator-width": "--border-width-2",
         "--tabbar-disabled-text": "--text-disabled",
         "--tabbar-disabled-text-font-family": "--font-sans",
         "--tabbar-disabled-text-font-size": "--font-size-md",
@@ -3849,7 +3849,7 @@
         "--tabbar-disabled-tab-border-width": "--border-width-0",
         "--tabbar-disabled-tab-top-radius": "--radius-md",
         "--tabbar-disabled-tab-bottom-radius": "--radius-md",
-        "--tabbar-disabled-indicator-border-width": "--border-width-2"
+        "--tabbar-disabled-indicator-width": "--border-width-2"
       }
     },
     "table": {
@@ -3870,8 +3870,8 @@
         "--table-default-header-font-weight": "--font-weight-semibold",
         "--table-default-header-line-height": "--line-height-none",
         "--table-default-header-padding": "--space-16",
-        "--table-default-header-border": "--border-neutral",
-        "--table-default-header-border-width": "--border-width-1",
+        "--table-default-header-divider": "--border-neutral",
+        "--table-default-header-divider-width": "--border-width-1",
         "--table-default-cell-text": "--text-secondary",
         "--table-default-cell-font-family": "--font-sans",
         "--table-default-cell-font-size": "--font-size-md",
@@ -3993,5 +3993,5 @@
       }
     }
   },
-  "componentSchemaVersion": 26
+  "componentSchemaVersion": 27
 }

package/src/live-tokens/data/themes/royal-velvet.json CHANGED Viewed

@@ -2925,8 +2925,8 @@
         "--collapsiblesection-chromeless-hover-icon-size": "--icon-size-xs",
         "--collapsiblesection-chromeless-expanded-padding": "--space-8",
         "--collapsiblesection-divider-default-surface": "--color-transparent",
-        "--collapsiblesection-divider-default-border": "--border-brand",
-        "--collapsiblesection-divider-default-border-width": "--border-width-2",
+        "--collapsiblesection-divider-default-hairline-color": "--border-brand",
+        "--collapsiblesection-divider-default-hairline-thickness": "--border-width-2",
         "--collapsiblesection-divider-default-padding": "--space-8",
         "--collapsiblesection-divider-default-label": "--text-primary",
         "--collapsiblesection-divider-default-label-font-family": "--font-sans",
@@ -2936,8 +2936,8 @@
         "--collapsiblesection-divider-default-icon": "--text-primary",
         "--collapsiblesection-divider-default-icon-size": "--icon-size-xs",
         "--collapsiblesection-divider-hover-surface": "--color-transparent",
-        "--collapsiblesection-divider-hover-border": "--border-neutral",
-        "--collapsiblesection-divider-hover-border-width": "--border-width-2",
+        "--collapsiblesection-divider-hover-hairline-color": "--border-neutral",
+        "--collapsiblesection-divider-hover-hairline-thickness": "--border-width-2",
         "--collapsiblesection-divider-hover-padding": "--space-8",
         "--collapsiblesection-divider-hover-label": "--text-primary",
         "--collapsiblesection-divider-hover-label-font-family": "--font-sans",
@@ -3034,8 +3034,8 @@
         "--dialog-shadow": "--shadow-2xl",
         "--dialog-blur": "--blur-none",
         "--dialog-header-surface": "--surface-neutral-lower",
-        "--dialog-header-border": "--border-neutral-subtle",
-        "--dialog-header-border-width": "--border-width-2",
+        "--dialog-header-divider": "--border-neutral-subtle",
+        "--dialog-header-divider-width": "--border-width-2",
         "--dialog-header-padding": "--space-12",
         "--dialog-title": "--text-primary",
         "--dialog-title-font-family": "--font-sans",
@@ -3050,8 +3050,8 @@
         "--dialog-body-font-size": "--font-size-md",
         "--dialog-body-font-weight": "--font-weight-normal",
         "--dialog-body-line-height": "--line-height-normal",
-        "--dialog-footer-border": "--border-neutral-subtle",
-        "--dialog-footer-border-width": "--border-width-2",
+        "--dialog-footer-divider": "--border-neutral-subtle",
+        "--dialog-footer-divider-width": "--border-width-2",
         "--dialog-footer-padding": "--space-24"
       }
     },
@@ -3838,7 +3838,7 @@
         "--tabbar-default-tab-border-width": "--border-width-1",
         "--tabbar-default-tab-top-radius": "--radius-none",
         "--tabbar-default-tab-bottom-radius": "--radius-none",
-        "--tabbar-default-indicator-border-width": "--border-width-3",
+        "--tabbar-default-indicator-width": "--border-width-3",
         "--tabbar-hover-text": "--text-secondary",
         "--tabbar-hover-surface": "--surface-neutral-lower",
         "--tabbar-hover-text-font-family": "--font-sans",
@@ -3852,7 +3852,7 @@
         "--tabbar-hover-tab-border-width": "--border-width-1",
         "--tabbar-hover-tab-top-radius": "--radius-none",
         "--tabbar-hover-tab-bottom-radius": "--radius-none",
-        "--tabbar-hover-indicator-border-width": "--border-width-3",
+        "--tabbar-hover-indicator-width": "--border-width-3",
         "--tabbar-active-text": "--text-primary",
         "--tabbar-active-border": "--color-brand-500",
         "--tabbar-active-surface": "--tint-low",
@@ -3866,7 +3866,7 @@
         "--tabbar-active-tab-border-width": "--border-width-1",
         "--tabbar-active-tab-top-radius": "--radius-none",
         "--tabbar-active-tab-bottom-radius": "--radius-none",
-        "--tabbar-active-indicator-border-width": "--border-width-3",
+        "--tabbar-active-indicator-width": "--border-width-3",
         "--tabbar-disabled-text": "--text-disabled",
         "--tabbar-disabled-text-font-family": "--font-sans",
         "--tabbar-disabled-text-font-size": "--font-size-md",
@@ -3880,7 +3880,7 @@
         "--tabbar-disabled-tab-border-width": "--border-width-1",
         "--tabbar-disabled-tab-top-radius": "--radius-none",
         "--tabbar-disabled-tab-bottom-radius": "--radius-none",
-        "--tabbar-disabled-indicator-border-width": "--border-width-3"
+        "--tabbar-disabled-indicator-width": "--border-width-3"
       }
     },
     "table": {
@@ -3901,8 +3901,8 @@
         "--table-default-header-font-weight": "--font-weight-semibold",
         "--table-default-header-line-height": "--line-height-none",
         "--table-default-header-padding": "--space-20",
-        "--table-default-header-border": "--border-neutral",
-        "--table-default-header-border-width": "--border-width-2",
+        "--table-default-header-divider": "--border-neutral",
+        "--table-default-header-divider-width": "--border-width-2",
         "--table-default-cell-text": "--text-secondary",
         "--table-default-cell-font-family": "--font-sans",
         "--table-default-cell-font-size": "--font-size-md",
@@ -4024,5 +4024,5 @@
       }
     }
   },
-  "componentSchemaVersion": 26
+  "componentSchemaVersion": 27
 }

package/src/live-tokens/data/themes/sketchy.json CHANGED Viewed

@@ -2908,8 +2908,8 @@
         "--collapsiblesection-chromeless-hover-icon-size": "--icon-size-xs",
         "--collapsiblesection-chromeless-expanded-padding": "--space-6",
         "--collapsiblesection-divider-default-surface": "--color-transparent",
-        "--collapsiblesection-divider-default-border": "--border-brand",
-        "--collapsiblesection-divider-default-border-width": "--border-width-1",
+        "--collapsiblesection-divider-default-hairline-color": "--border-brand",
+        "--collapsiblesection-divider-default-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-default-padding": "--space-6",
         "--collapsiblesection-divider-default-label": "--text-primary",
         "--collapsiblesection-divider-default-label-font-family": "--font-sans",
@@ -2919,8 +2919,8 @@
         "--collapsiblesection-divider-default-icon": "--text-primary",
         "--collapsiblesection-divider-default-icon-size": "--icon-size-xs",
         "--collapsiblesection-divider-hover-surface": "--color-transparent",
-        "--collapsiblesection-divider-hover-border": "--border-neutral",
-        "--collapsiblesection-divider-hover-border-width": "--border-width-1",
+        "--collapsiblesection-divider-hover-hairline-color": "--border-neutral",
+        "--collapsiblesection-divider-hover-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-hover-padding": "--space-6",
         "--collapsiblesection-divider-hover-label": "--text-primary",
         "--collapsiblesection-divider-hover-label-font-family": "--font-sans",
@@ -3017,8 +3017,8 @@
         "--dialog-shadow": "--shadow-2xl",
         "--dialog-blur": "--blur-none",
         "--dialog-header-surface": "--surface-neutral-lower",
-        "--dialog-header-border": "--border-neutral-subtle",
-        "--dialog-header-border-width": "--border-width-1",
+        "--dialog-header-divider": "--border-neutral-subtle",
+        "--dialog-header-divider-width": "--border-width-1",
         "--dialog-header-padding": "--space-10",
         "--dialog-title": "--text-primary",
         "--dialog-title-font-family": "--font-sans",
@@ -3033,8 +3033,8 @@
         "--dialog-body-font-size": "--font-size-md",
         "--dialog-body-font-weight": "--font-weight-normal",
         "--dialog-body-line-height": "--line-height-normal",
-        "--dialog-footer-border": "--border-neutral-subtle",
-        "--dialog-footer-border-width": "--border-width-1",
+        "--dialog-footer-divider": "--border-neutral-subtle",
+        "--dialog-footer-divider-width": "--border-width-1",
         "--dialog-footer-padding": "--space-20"
       }
     },
@@ -3821,7 +3821,7 @@
         "--tabbar-default-tab-border-width": "--border-width-1",
         "--tabbar-default-tab-top-radius": "--radius-none",
         "--tabbar-default-tab-bottom-radius": "--radius-none",
-        "--tabbar-default-indicator-border-width": "--border-width-2",
+        "--tabbar-default-indicator-width": "--border-width-2",
         "--tabbar-hover-text": "--text-secondary",
         "--tabbar-hover-surface": "--surface-neutral-lower",
         "--tabbar-hover-text-font-family": "--font-sans",
@@ -3835,7 +3835,7 @@
         "--tabbar-hover-tab-border-width": "--border-width-1",
         "--tabbar-hover-tab-top-radius": "--radius-none",
         "--tabbar-hover-tab-bottom-radius": "--radius-none",
-        "--tabbar-hover-indicator-border-width": "--border-width-2",
+        "--tabbar-hover-indicator-width": "--border-width-2",
         "--tabbar-active-text": "--text-primary",
         "--tabbar-active-border": "--color-brand-500",
         "--tabbar-active-surface": "--tint-low",
@@ -3849,7 +3849,7 @@
         "--tabbar-active-tab-border-width": "--border-width-1",
         "--tabbar-active-tab-top-radius": "--radius-none",
         "--tabbar-active-tab-bottom-radius": "--radius-none",
-        "--tabbar-active-indicator-border-width": "--border-width-2",
+        "--tabbar-active-indicator-width": "--border-width-2",
         "--tabbar-disabled-text": "--text-disabled",
         "--tabbar-disabled-text-font-family": "--font-sans",
         "--tabbar-disabled-text-font-size": "--font-size-md",
@@ -3863,7 +3863,7 @@
         "--tabbar-disabled-tab-border-width": "--border-width-1",
         "--tabbar-disabled-tab-top-radius": "--radius-none",
         "--tabbar-disabled-tab-bottom-radius": "--radius-none",
-        "--tabbar-disabled-indicator-border-width": "--border-width-2"
+        "--tabbar-disabled-indicator-width": "--border-width-2"
       }
     },
     "table": {
@@ -3884,8 +3884,8 @@
         "--table-default-header-font-weight": "--font-weight-semibold",
         "--table-default-header-line-height": "--line-height-none",
         "--table-default-header-padding": "--space-16",
-        "--table-default-header-border": "--border-neutral",
-        "--table-default-header-border-width": "--border-width-1",
+        "--table-default-header-divider": "--border-neutral",
+        "--table-default-header-divider-width": "--border-width-1",
         "--table-default-cell-text": "--text-secondary",
         "--table-default-cell-font-family": "--font-sans",
         "--table-default-cell-font-size": "--font-size-md",
@@ -4007,5 +4007,5 @@
       }
     }
   },
-  "componentSchemaVersion": 26
+  "componentSchemaVersion": 27
 }

package/src/live-tokens/data/themes/spring-meadow.json CHANGED Viewed

@@ -2881,8 +2881,8 @@
         "--collapsiblesection-chromeless-hover-icon-size": "--icon-size-xs",
         "--collapsiblesection-chromeless-expanded-padding": "--space-8",
         "--collapsiblesection-divider-default-surface": "--color-transparent",
-        "--collapsiblesection-divider-default-border": "--border-brand",
-        "--collapsiblesection-divider-default-border-width": "--border-width-1",
+        "--collapsiblesection-divider-default-hairline-color": "--border-brand",
+        "--collapsiblesection-divider-default-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-default-padding": "--space-8",
         "--collapsiblesection-divider-default-label": "--text-primary",
         "--collapsiblesection-divider-default-label-font-family": "--font-sans",
@@ -2892,8 +2892,8 @@
         "--collapsiblesection-divider-default-icon": "--text-primary",
         "--collapsiblesection-divider-default-icon-size": "--icon-size-xs",
         "--collapsiblesection-divider-hover-surface": "--color-transparent",
-        "--collapsiblesection-divider-hover-border": "--border-neutral",
-        "--collapsiblesection-divider-hover-border-width": "--border-width-1",
+        "--collapsiblesection-divider-hover-hairline-color": "--border-neutral",
+        "--collapsiblesection-divider-hover-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-hover-padding": "--space-8",
         "--collapsiblesection-divider-hover-label": "--text-primary",
         "--collapsiblesection-divider-hover-label-font-family": "--font-sans",
@@ -2990,8 +2990,8 @@
         "--dialog-shadow": "--shadow-2xl",
         "--dialog-blur": "--blur-none",
         "--dialog-header-surface": "--surface-neutral-lower",
-        "--dialog-header-border": "--border-neutral-subtle",
-        "--dialog-header-border-width": "--border-width-1",
+        "--dialog-header-divider": "--border-neutral-subtle",
+        "--dialog-header-divider-width": "--border-width-1",
         "--dialog-header-padding": "--space-12",
         "--dialog-title": "--text-primary",
         "--dialog-title-font-family": "--font-sans",
@@ -3006,8 +3006,8 @@
         "--dialog-body-font-size": "--font-size-md",
         "--dialog-body-font-weight": "--font-weight-normal",
         "--dialog-body-line-height": "--line-height-normal",
-        "--dialog-footer-border": "--border-neutral-subtle",
-        "--dialog-footer-border-width": "--border-width-1",
+        "--dialog-footer-divider": "--border-neutral-subtle",
+        "--dialog-footer-divider-width": "--border-width-1",
         "--dialog-footer-padding": "--space-24"
       }
     },
@@ -3794,7 +3794,7 @@
         "--tabbar-default-tab-border-width": "--border-width-0",
         "--tabbar-default-tab-top-radius": "--radius-sm",
         "--tabbar-default-tab-bottom-radius": "--radius-sm",
-        "--tabbar-default-indicator-border-width": "--border-width-2",
+        "--tabbar-default-indicator-width": "--border-width-2",
         "--tabbar-hover-text": "--text-secondary",
         "--tabbar-hover-surface": "--surface-neutral-lower",
         "--tabbar-hover-text-font-family": "--font-sans",
@@ -3808,7 +3808,7 @@
         "--tabbar-hover-tab-border-width": "--border-width-0",
         "--tabbar-hover-tab-top-radius": "--radius-sm",
         "--tabbar-hover-tab-bottom-radius": "--radius-sm",
-        "--tabbar-hover-indicator-border-width": "--border-width-2",
+        "--tabbar-hover-indicator-width": "--border-width-2",
         "--tabbar-active-text": "--text-primary",
         "--tabbar-active-border": "--color-brand-500",
         "--tabbar-active-surface": "--tint-low",
@@ -3822,7 +3822,7 @@
         "--tabbar-active-tab-border-width": "--border-width-0",
         "--tabbar-active-tab-top-radius": "--radius-sm",
         "--tabbar-active-tab-bottom-radius": "--radius-sm",
-        "--tabbar-active-indicator-border-width": "--border-width-2",
+        "--tabbar-active-indicator-width": "--border-width-2",
         "--tabbar-disabled-text": "--text-disabled",
         "--tabbar-disabled-text-font-family": "--font-sans",
         "--tabbar-disabled-text-font-size": "--font-size-md",
@@ -3836,7 +3836,7 @@
         "--tabbar-disabled-tab-border-width": "--border-width-0",
         "--tabbar-disabled-tab-top-radius": "--radius-sm",
         "--tabbar-disabled-tab-bottom-radius": "--radius-sm",
-        "--tabbar-disabled-indicator-border-width": "--border-width-2"
+        "--tabbar-disabled-indicator-width": "--border-width-2"
       }
     },
     "table": {
@@ -3857,8 +3857,8 @@
         "--table-default-header-font-weight": "--font-weight-semibold",
         "--table-default-header-line-height": "--line-height-none",
         "--table-default-header-padding": "--space-20",
-        "--table-default-header-border": "--border-neutral",
-        "--table-default-header-border-width": "--border-width-1",
+        "--table-default-header-divider": "--border-neutral",
+        "--table-default-header-divider-width": "--border-width-1",
         "--table-default-cell-text": "--text-secondary",
         "--table-default-cell-font-family": "--font-sans",
         "--table-default-cell-font-size": "--font-size-md",
@@ -3980,5 +3980,5 @@
       }
     }
   },
-  "componentSchemaVersion": 26
+  "componentSchemaVersion": 27
 }

package/src/live-tokens/data/themes/sunset.json CHANGED Viewed

@@ -2933,8 +2933,8 @@
         "--collapsiblesection-chromeless-hover-icon-size": "--icon-size-xs",
         "--collapsiblesection-chromeless-expanded-padding": "--space-6",
         "--collapsiblesection-divider-default-surface": "--color-transparent",
-        "--collapsiblesection-divider-default-border": "--border-brand",
-        "--collapsiblesection-divider-default-border-width": "--border-width-1",
+        "--collapsiblesection-divider-default-hairline-color": "--border-brand",
+        "--collapsiblesection-divider-default-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-default-padding": "--space-6",
         "--collapsiblesection-divider-default-label": "--text-primary",
         "--collapsiblesection-divider-default-label-font-family": "--font-sans",
@@ -2944,8 +2944,8 @@
         "--collapsiblesection-divider-default-icon": "--text-primary",
         "--collapsiblesection-divider-default-icon-size": "--icon-size-xs",
         "--collapsiblesection-divider-hover-surface": "--color-transparent",
-        "--collapsiblesection-divider-hover-border": "--border-neutral",
-        "--collapsiblesection-divider-hover-border-width": "--border-width-1",
+        "--collapsiblesection-divider-hover-hairline-color": "--border-neutral",
+        "--collapsiblesection-divider-hover-hairline-thickness": "--border-width-1",
         "--collapsiblesection-divider-hover-padding": "--space-6",
         "--collapsiblesection-divider-hover-label": "--text-primary",
         "--collapsiblesection-divider-hover-label-font-family": "--font-sans",
@@ -3042,8 +3042,8 @@
         "--dialog-shadow": "--shadow-2xl",
         "--dialog-blur": "--blur-none",
         "--dialog-header-surface": "--surface-neutral-lower",
-        "--dialog-header-border": "--border-neutral-subtle",
-        "--dialog-header-border-width": "--border-width-1",
+        "--dialog-header-divider": "--border-neutral-subtle",
+        "--dialog-header-divider-width": "--border-width-1",
         "--dialog-header-padding": "--space-10",
         "--dialog-title": "--text-primary",
         "--dialog-title-font-family": "--font-sans",
@@ -3058,8 +3058,8 @@
         "--dialog-body-font-size": "--font-size-md",
         "--dialog-body-font-weight": "--font-weight-normal",
         "--dialog-body-line-height": "--line-height-normal",
-        "--dialog-footer-border": "--border-neutral-subtle",
-        "--dialog-footer-border-width": "--border-width-1",
+        "--dialog-footer-divider": "--border-neutral-subtle",
+        "--dialog-footer-divider-width": "--border-width-1",
         "--dialog-footer-padding": "--space-20"
       }
     },
@@ -3846,7 +3846,7 @@
         "--tabbar-default-tab-border-width": "--border-width-0",
         "--tabbar-default-tab-top-radius": "--radius-sm",
         "--tabbar-default-tab-bottom-radius": "--radius-sm",
-        "--tabbar-default-indicator-border-width": "--border-width-2",
+        "--tabbar-default-indicator-width": "--border-width-2",
         "--tabbar-hover-text": "--text-secondary",
         "--tabbar-hover-surface": "--surface-neutral-lower",
         "--tabbar-hover-text-font-family": "--font-sans",
@@ -3860,7 +3860,7 @@
         "--tabbar-hover-tab-border-width": "--border-width-0",
         "--tabbar-hover-tab-top-radius": "--radius-sm",
         "--tabbar-hover-tab-bottom-radius": "--radius-sm",
-        "--tabbar-hover-indicator-border-width": "--border-width-2",
+        "--tabbar-hover-indicator-width": "--border-width-2",
         "--tabbar-active-text": "--text-primary",
         "--tabbar-active-border": "--color-brand-500",
         "--tabbar-active-surface": "--tint-low",
@@ -3874,7 +3874,7 @@
         "--tabbar-active-tab-border-width": "--border-width-0",
         "--tabbar-active-tab-top-radius": "--radius-sm",
         "--tabbar-active-tab-bottom-radius": "--radius-sm",
-        "--tabbar-active-indicator-border-width": "--border-width-2",
+        "--tabbar-active-indicator-width": "--border-width-2",
         "--tabbar-disabled-text": "--text-disabled",
         "--tabbar-disabled-text-font-family": "--font-sans",
         "--tabbar-disabled-text-font-size": "--font-size-md",
@@ -3888,7 +3888,7 @@
         "--tabbar-disabled-tab-border-width": "--border-width-0",
         "--tabbar-disabled-tab-top-radius": "--radius-sm",
         "--tabbar-disabled-tab-bottom-radius": "--radius-sm",
-        "--tabbar-disabled-indicator-border-width": "--border-width-2"
+        "--tabbar-disabled-indicator-width": "--border-width-2"
       }
     },
     "table": {
@@ -3909,8 +3909,8 @@
         "--table-default-header-font-weight": "--font-weight-semibold",
         "--table-default-header-line-height": "--line-height-none",
         "--table-default-header-padding": "--space-16",
-        "--table-default-header-border": "--border-neutral",
-        "--table-default-header-border-width": "--border-width-1",
+        "--table-default-header-divider": "--border-neutral",
+        "--table-default-header-divider-width": "--border-width-1",
         "--table-default-cell-text": "--text-secondary",
         "--table-default-cell-font-family": "--font-sans",
         "--table-default-cell-font-size": "--font-size-md",
@@ -4032,5 +4032,5 @@
       }
     }
   },
-  "componentSchemaVersion": 26
+  "componentSchemaVersion": 27
 }

package/src/system/components/Badge.svelte CHANGED Viewed

@@ -1,3 +1,10 @@
+<!--
+  Badge.svelte. A short standing label on an element.
+  Use for: status the reader takes at a glance, such as "Beta", "New", or a
+  version.
+  Not for: a marker that sits on a parent's corner (CornerBadge); feedback
+  after an action (Notification).
+-->
 <script module lang="ts">
   export const badgeVariants = [
     'primary',

package/src/system/components/Button.svelte CHANGED Viewed

@@ -1,3 +1,10 @@
+<!--
+  Button.svelte. A labelled action.
+  Use for: an action that needs a word to be unambiguous.
+  Not for: an icon-only action (IconButton); a link to another page.
+  Emphasis: one primary per page; secondary for the rest; outline for a
+  tertiary action; danger for a destructive one.
+-->
 <script lang="ts">
    import { createEventDispatcher } from 'svelte';