@motion-proto/live-tokens 0.74.0 → 0.75.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 (170) hide show
  1. package/.claude/skills/live-tokens-check-compliance/SKILL.md +33 -38
  2. package/.claude/skills/live-tokens-create-component/SKILL copy.md +196 -0
  3. package/.claude/skills/live-tokens-create-component/SKILL.md +198 -146
  4. package/.claude/skills/live-tokens-create-component/references/contract-tests.md +95 -52
  5. package/.claude/skills/live-tokens-create-component/references/intrinsics.md +2 -2
  6. package/.claude/skills/live-tokens-create-component/references/linked-siblings.md +2 -2
  7. package/.claude/skills/live-tokens-create-component/references/sketch-mode.md +12 -12
  8. package/.claude/skills/live-tokens-create-component/references/token-naming.md +2 -1
  9. package/.claude/skills/live-tokens-create-page/SKILL.md +187 -0
  10. package/.claude/skills/live-tokens-create-page/references/interaction-sources.md +66 -0
  11. package/.claude/skills/live-tokens-create-page/references/layout-sources.md +87 -0
  12. package/.claude/skills/live-tokens-create-theme/SKILL.md +52 -48
  13. package/.claude/skills/live-tokens-create-theme/references/design-directions.md +1 -1
  14. package/.claude/skills/live-tokens-fix-findings/SKILL.md +69 -60
  15. package/.claude/skills/live-tokens-pick-component/SKILL.md +64 -79
  16. package/.claude/skills/live-tokens-set-colors/SKILL.md +47 -38
  17. package/.claude/skills/live-tokens-set-geometry/SKILL.md +58 -35
  18. package/.claude/skills/live-tokens-set-geometry/references/geometry-anchors.md +5 -3
  19. package/.claude/skills/live-tokens-set-type/SKILL.md +30 -30
  20. package/CHANGELOG.md +103 -0
  21. package/README.md +3 -3
  22. package/bin/check-component.mjs +91 -19
  23. package/bin/check-page.mjs +102 -21
  24. package/bin/cli.mjs +78 -58
  25. package/bin/contractRunner.mjs +945 -0
  26. package/bin/create.mjs +1 -1
  27. package/bin/lib/catalogue.mjs +37 -30
  28. package/bin/lib/findings.mjs +46 -15
  29. package/bin/lib/report.mjs +3 -3
  30. package/bin/lib/tokenVocabulary.mjs +4 -4
  31. package/bin/migrate-routes.mjs +5 -5
  32. package/bin/migrate.mjs +4 -4
  33. package/bin/save-theme.mjs +8 -9
  34. package/bin/set-colors.mjs +9 -11
  35. package/bin/set-geometry.mjs +7 -7
  36. package/bin/set-type.mjs +5 -7
  37. package/dist-plugin/{chunk-W6Y4BWFB.js → chunk-6WGFOJXO.js} +22 -0
  38. package/dist-plugin/{chunk-7VRTBGJT.js → chunk-PDNL4NC5.js} +9 -2
  39. package/dist-plugin/{chunk-V3YF6CGT.js → chunk-SWXRVZKT.js} +43 -1
  40. package/dist-plugin/{dataPaths-BhWzd5cL.d.cts → dataPaths-BpIK_Obx.d.cts} +1 -0
  41. package/dist-plugin/{dataPaths-BhWzd5cL.d.ts → dataPaths-BpIK_Obx.d.ts} +1 -0
  42. package/dist-plugin/index.cjs +310 -147
  43. package/dist-plugin/index.d.cts +1 -1
  44. package/dist-plugin/index.d.ts +1 -1
  45. package/dist-plugin/index.js +218 -122
  46. package/dist-plugin/migrateData/index.cjs +66 -2
  47. package/dist-plugin/migrateData/index.d.cts +1 -1
  48. package/dist-plugin/migrateData/index.d.ts +1 -1
  49. package/dist-plugin/migrateData/index.js +3 -3
  50. package/dist-plugin/setColors/index.cjs +61 -4
  51. package/dist-plugin/setColors/index.d.cts +1 -1
  52. package/dist-plugin/setColors/index.d.ts +1 -1
  53. package/dist-plugin/setColors/index.js +5 -5
  54. package/dist-plugin/setGeometry/index.cjs +107 -44
  55. package/dist-plugin/setGeometry/index.d.cts +5 -5
  56. package/dist-plugin/setGeometry/index.d.ts +5 -5
  57. package/dist-plugin/setGeometry/index.js +51 -45
  58. package/dist-plugin/setType/index.cjs +15 -0
  59. package/dist-plugin/setType/index.d.cts +1 -1
  60. package/dist-plugin/setType/index.d.ts +1 -1
  61. package/dist-plugin/setType/index.js +1 -1
  62. package/dist-plugin/tokensCssMigrations/index.d.cts +1 -1
  63. package/dist-plugin/tokensCssMigrations/index.d.ts +1 -1
  64. package/dist-plugin/tokensCssMigrations/index.js +1 -1
  65. package/package.json +35 -8
  66. package/src/app/site.css +19 -9
  67. package/src/editor/bootstrap.ts +2 -0
  68. package/src/editor/component-editor/CollapsibleSectionEditor.svelte +4 -4
  69. package/src/editor/component-editor/DialogEditor.svelte +4 -4
  70. package/src/editor/component-editor/MenuSelectEditor.svelte +4 -1
  71. package/src/editor/component-editor/SegmentedControlEditor.svelte +6 -1
  72. package/src/editor/component-editor/TabBarEditor.svelte +1 -1
  73. package/src/editor/component-editor/TableEditor.svelte +2 -2
  74. package/src/editor/component-editor/scaffolding/TokenLayout.svelte +6 -3
  75. package/src/editor/component-editor/scaffolding/VariantGroup.svelte +41 -20
  76. package/src/editor/core/components/adjustAliases.ts +59 -45
  77. package/src/editor/core/components/aliasKinds.ts +9 -5
  78. package/src/editor/core/preview/themePreview.ts +9 -2
  79. package/src/editor/core/sketch/sketchLayer.ts +22 -0
  80. package/src/editor/core/store/editorStore.ts +10 -1
  81. package/src/editor/core/themes/buildColors.ts +3 -3
  82. package/src/editor/core/themes/liveStateStream.ts +26 -0
  83. package/src/editor/core/themes/migrations/2026-09-07-stroke-role-renames.ts +52 -0
  84. package/src/editor/core/themes/migrations/index.ts +2 -0
  85. package/src/editor/core/themes/themeDocumentSync.ts +22 -11
  86. package/src/editor/core/themes/themeService.ts +9 -2
  87. package/src/editor/pages/ComponentEditorPage.svelte +17 -1
  88. package/src/editor/pages/liveTokensEditorHandle.ts +23 -0
  89. package/src/editor/skill-atlas/SkillAtlas.svelte +75 -573
  90. package/src/editor/skill-atlas/TreeCanvas.svelte +263 -0
  91. package/src/editor/skill-atlas/TreeNodeCard.svelte +136 -53
  92. package/src/editor/skill-atlas/edges.ts +31 -0
  93. package/src/editor/skill-atlas/skillSources.generated.ts +20 -19
  94. package/src/editor/skill-atlas/skillTrees.ts +19 -3840
  95. package/src/editor/skill-atlas/trees/check-compliance.ts +183 -0
  96. package/src/editor/skill-atlas/trees/create-component.ts +275 -0
  97. package/src/editor/skill-atlas/trees/create-page.ts +320 -0
  98. package/src/editor/skill-atlas/trees/create-theme.ts +255 -0
  99. package/src/editor/skill-atlas/trees/fix-findings.ts +469 -0
  100. package/src/editor/skill-atlas/trees/pick-component.ts +300 -0
  101. package/src/editor/skill-atlas/trees/set-colors.ts +148 -0
  102. package/src/editor/skill-atlas/trees/set-geometry.ts +136 -0
  103. package/src/editor/skill-atlas/trees/set-type.ts +142 -0
  104. package/src/editor/skill-atlas/types.ts +3 -4
  105. package/src/editor/skill-atlas/wireLayout.ts +287 -0
  106. package/src/live-tokens/data/themes/autumn.json +15 -15
  107. package/src/live-tokens/data/themes/halloween.json +15 -15
  108. package/src/live-tokens/data/themes/midnight-study.json +15 -15
  109. package/src/live-tokens/data/themes/ocean.json +15 -15
  110. package/src/live-tokens/data/themes/royal-velvet.json +15 -15
  111. package/src/live-tokens/data/themes/sketchy.json +15 -15
  112. package/src/live-tokens/data/themes/spring-meadow.json +15 -15
  113. package/src/live-tokens/data/themes/sunset.json +15 -15
  114. package/src/system/components/Badge.svelte +7 -0
  115. package/src/system/components/Button.svelte +7 -0
  116. package/src/system/components/Callout.svelte +10 -6
  117. package/src/system/components/Card.svelte +23 -4
  118. package/src/system/components/CodeSnippet.svelte +4 -3
  119. package/src/system/components/CollapsibleSection.svelte +23 -8
  120. package/src/system/components/CornerBadge.svelte +6 -0
  121. package/src/system/components/Dialog.svelte +13 -6
  122. package/src/system/components/IconButton.svelte +9 -0
  123. package/src/system/components/Image.svelte +8 -0
  124. package/src/system/components/ImageLightbox.svelte +6 -0
  125. package/src/system/components/InlineEditActions.svelte +7 -0
  126. package/src/system/components/Input.svelte +7 -0
  127. package/src/system/components/MenuSelect.svelte +7 -0
  128. package/src/system/components/Notification.svelte +7 -0
  129. package/src/system/components/Panel.svelte +6 -0
  130. package/src/system/components/ProgressBar.svelte +5 -0
  131. package/src/system/components/RadioButton.svelte +11 -5
  132. package/src/system/components/SectionDivider.svelte +8 -0
  133. package/src/system/components/SegmentedControl.svelte +6 -0
  134. package/src/system/components/SideNavigation.svelte +6 -0
  135. package/src/system/components/Slider.svelte +7 -4
  136. package/src/system/components/TabBar.svelte +15 -9
  137. package/src/system/components/Table.svelte +8 -3
  138. package/src/system/components/Toggle.svelte +4 -4
  139. package/src/system/components/Tooltip.svelte +6 -0
  140. package/src/testing-js/chunk-AO7EZHYV.js +776 -0
  141. package/src/testing-js/chunk-AO7EZHYV.js.map +1 -0
  142. package/src/testing-js/chunk-FAFOAWYL.js +39 -0
  143. package/src/testing-js/chunk-FAFOAWYL.js.map +1 -0
  144. package/src/testing-js/chunk-L73N4NSO.js +23 -0
  145. package/src/testing-js/chunk-L73N4NSO.js.map +1 -0
  146. package/src/testing-js/chunk-LXR3MN6N.js +3063 -0
  147. package/src/testing-js/chunk-LXR3MN6N.js.map +1 -0
  148. package/src/testing-js/chunk-ZMSX6CXR.js +53 -0
  149. package/src/testing-js/chunk-ZMSX6CXR.js.map +1 -0
  150. package/src/testing-js/component-alias.contract.js +81 -0
  151. package/src/testing-js/component-alias.contract.js.map +1 -0
  152. package/src/testing-js/component-editor.contract.js +62 -0
  153. package/src/testing-js/component-editor.contract.js.map +1 -0
  154. package/src/testing-js/component-render.contract.js +568 -0
  155. package/src/testing-js/component-render.contract.js.map +1 -0
  156. package/src/testing-js/index.d.ts +293 -0
  157. package/src/testing-js/index.js +222 -0
  158. package/src/testing-js/index.js.map +1 -0
  159. package/src/testing-js/registry.contract.js +39 -0
  160. package/src/testing-js/registry.contract.js.map +1 -0
  161. package/src/testing-js/vitest-BE6uGF31.d.ts +73 -0
  162. package/src/testing-js/vitest.d.ts +3 -0
  163. package/src/testing-js/vitest.js +13 -0
  164. package/src/testing-js/vitest.js.map +1 -0
  165. package/template/README.md +13 -0
  166. package/template/_gitignore +2 -0
  167. package/template/package.json +2 -1
  168. package/template/src/pages/Home.svelte +4 -18
  169. package/.claude/skills/live-tokens-build-page/SKILL.md +0 -103
  170. package/.claude/skills/live-tokens-build-page/references/layout-sources.md +0 -48
@@ -880,6 +880,47 @@ var colorsAndTypeMigration_2026_09_03_dropLegacyComponentKeys = {
880
880
  }
881
881
  };
882
882
 
883
+ // src/editor/core/themes/migrations/2026-09-07-stroke-role-renames.ts
884
+ var RENAMES2 = {
885
+ tabbar: Object.fromEntries(
886
+ ["default", "hover", "active", "disabled"].map((s) => [
887
+ `--tabbar-${s}-indicator-border-width`,
888
+ `--tabbar-${s}-indicator-width`
889
+ ])
890
+ ),
891
+ collapsiblesection: Object.fromEntries(
892
+ ["default", "hover"].flatMap((s) => [
893
+ [`--collapsiblesection-divider-${s}-border`, `--collapsiblesection-divider-${s}-hairline-color`],
894
+ [`--collapsiblesection-divider-${s}-border-width`, `--collapsiblesection-divider-${s}-hairline-thickness`]
895
+ ])
896
+ ),
897
+ dialog: Object.fromEntries(
898
+ ["header", "footer"].flatMap((part) => [
899
+ [`--dialog-${part}-border`, `--dialog-${part}-divider`],
900
+ [`--dialog-${part}-border-width`, `--dialog-${part}-divider-width`]
901
+ ])
902
+ ),
903
+ table: {
904
+ "--table-default-header-border": "--table-default-header-divider",
905
+ "--table-default-header-border-width": "--table-default-header-divider-width"
906
+ }
907
+ };
908
+ var componentMigration_2026_09_07_strokeRoleRenames = {
909
+ id: "2026-09-07-stroke-role-renames",
910
+ fromVersion: 26,
911
+ toVersion: 27,
912
+ appliesTo: "component-config",
913
+ apply(rawVars, meta) {
914
+ const renames = meta.component ? RENAMES2[meta.component] : void 0;
915
+ if (!renames) return { ...rawVars };
916
+ const out = {};
917
+ for (const [key, value] of Object.entries(rawVars)) {
918
+ out[renames[key] ?? key] = value;
919
+ }
920
+ return out;
921
+ }
922
+ };
923
+
883
924
  // src/editor/core/themes/migrations/index.ts
884
925
  var MIGRATIONS = [
885
926
  colorsAndTypeMigration_2026_04_24_legacyKeysAndBgToCanvas,
@@ -915,7 +956,8 @@ var MIGRATIONS = [
915
956
  componentMigration_2026_09_01_tabbarActiveTint,
916
957
  componentMigration_2026_09_01_gateSuffixEnabled,
917
958
  componentMigration_2026_09_02_sectiondividerDropTitleOutline,
918
- colorsAndTypeMigration_2026_09_03_dropLegacyComponentKeys
959
+ colorsAndTypeMigration_2026_09_03_dropLegacyComponentKeys,
960
+ componentMigration_2026_09_07_strokeRoleRenames
919
961
  ];
920
962
  function countFor(kind) {
921
963
  return MIGRATIONS.filter((m) => m.appliesTo === kind).length;
@@ -44,6 +44,7 @@ declare function readLiveTokensConfig(): LiveTokensFileConfig;
44
44
  * Resolve the four data directories for a single plugin/preprocessor.
45
45
  *
46
46
  * Per-folder resolution order (most specific wins):
47
+ * 0. `LIVE_TOKENS_TEST_DATA_DIR`, which redirects all four folders at once
47
48
  * 1. explicit opts (e.g. `opts.colorsAndTypeDir`)
48
49
  * 2. `live-tokens.config.json` field (e.g. `fileConfig.colorsAndTypeDir`)
49
50
  * 3. `<dataDir>/<sub>` where dataDir comes from opts > config file > the
@@ -44,6 +44,7 @@ declare function readLiveTokensConfig(): LiveTokensFileConfig;
44
44
  * Resolve the four data directories for a single plugin/preprocessor.
45
45
  *
46
46
  * Per-folder resolution order (most specific wins):
47
+ * 0. `LIVE_TOKENS_TEST_DATA_DIR`, which redirects all four folders at once
47
48
  * 1. explicit opts (e.g. `opts.colorsAndTypeDir`)
48
49
  * 2. `live-tokens.config.json` field (e.g. `fileConfig.colorsAndTypeDir`)
49
50
  * 3. `<dataDir>/<sub>` where dataDir comes from opts > config file > the