@vadimcomanescu/nadicode-design-system 2.0.7 → 2.0.8

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 (231) hide show
  1. package/.agents/skills/seed/SKILL.md +17 -8
  2. package/.agents/skills/seed/contract.md +5 -5
  3. package/.agents/skills/seed/intent-map.md +3 -3
  4. package/.agents/skills/seed/recipes/agents-chat.md +44 -20
  5. package/.agents/skills/seed/references/blocks.md +5 -2
  6. package/.agents/skills/seed/references/components.md +22 -2
  7. package/.agents/skills/seed/references/dashboard-patterns.md +12 -12
  8. package/.agents/skills/seed/references/nextjs.md +20 -80
  9. package/.agents/skills/seed/references/tokens.md +57 -248
  10. package/README.md +43 -215
  11. package/contracts/block-props-schemas.json +2186 -0
  12. package/contracts/component-props-schemas.json +8322 -0
  13. package/contracts/consumer-contract.json +178 -0
  14. package/contracts/consumer-intent-map.json +707 -0
  15. package/contracts/message-catalog-contract.json +820 -0
  16. package/contracts/page-kit-props-schemas.json +1894 -0
  17. package/contracts/public-surface-registry.json +6162 -0
  18. package/contracts/public-surface-registry.schema.json +227 -0
  19. package/contracts/release-governance-baseline.json +850 -0
  20. package/contracts/spec-manifest.json +46 -0
  21. package/dist/catalog.json +284 -81
  22. package/dist/chunk-4IGBBIYW.js +47 -0
  23. package/dist/chunk-4WPZ6T7V.js +186 -0
  24. package/dist/{chunk-OHOOQUVJ.js → chunk-C7WHMSF3.js} +2 -1
  25. package/dist/{chunk-4K3PATUT.js → chunk-EEL4RAPC.js} +13 -1
  26. package/dist/{chunk-ILIHQ2KZ.js → chunk-EK43W2Y6.js} +16 -10
  27. package/dist/{chunk-IDKZEPWK.js → chunk-FV2G6SAF.js} +6 -5
  28. package/dist/chunk-HWHJ6IRQ.js +78 -0
  29. package/dist/{chunk-AUSYEAIJ.js → chunk-I66XWYSS.js} +32 -8
  30. package/dist/chunk-JDJY4ABS.js +60 -0
  31. package/dist/{chunk-GV4PKHG4.js → chunk-KWILREVQ.js} +2 -2
  32. package/dist/{chunk-WI37ZYIF.js → chunk-M4XKO45H.js} +13 -1
  33. package/dist/{chunk-6N6CSJVE.js → chunk-OJ7OO3QB.js} +2 -2
  34. package/dist/{chunk-ZHTQF2KI.js → chunk-OSNTB6RY.js} +29 -22
  35. package/dist/{chunk-GMMPLZLC.js → chunk-PDSQC6VE.js} +1 -1
  36. package/dist/chunk-QQOWC53X.js +98 -0
  37. package/dist/chunk-VJ5VD4UT.js +91 -0
  38. package/dist/{chunk-TUKZKU72.js → chunk-ZKLB5N3Q.js} +1 -1
  39. package/dist/components/blocks/AgentConversationBlock.d.ts +6 -1
  40. package/dist/components/blocks/AgentConversationBlock.js +44 -42
  41. package/dist/components/blocks/AgentRunOverviewBlock.js +1 -1
  42. package/dist/components/blocks/AgentWorkbenchBlock.d.ts +5 -1
  43. package/dist/components/blocks/AgentWorkbenchBlock.js +47 -46
  44. package/dist/components/blocks/AuthLayout.js +2 -2
  45. package/dist/components/blocks/BannerBlock.js +38 -38
  46. package/dist/components/blocks/CallToActionBlock.js +2 -2
  47. package/dist/components/blocks/ChangelogBlock.js +39 -39
  48. package/dist/components/blocks/ChartBlock.js +38 -38
  49. package/dist/components/blocks/ChartCollectionBlock.js +1 -1
  50. package/dist/components/blocks/ChatLayout.d.ts +4 -1
  51. package/dist/components/blocks/ChatLayout.js +39 -39
  52. package/dist/components/blocks/CodeBlock.js +2 -2
  53. package/dist/components/blocks/ContactBlock.js +2 -2
  54. package/dist/components/blocks/CreateBlock.js +39 -39
  55. package/dist/components/blocks/DataGridBlock.js +40 -40
  56. package/dist/components/blocks/DirectoryBlock.js +43 -43
  57. package/dist/components/blocks/FAQBlock.js +38 -38
  58. package/dist/components/blocks/FeatureBlock.js +38 -38
  59. package/dist/components/blocks/GalleryBlock.js +38 -38
  60. package/dist/components/blocks/HeaderBlock.js +38 -38
  61. package/dist/components/blocks/HeroBlock.js +41 -41
  62. package/dist/components/blocks/HeroSectionBlock.js +55 -59
  63. package/dist/components/blocks/IntegrationsBlock.js +40 -40
  64. package/dist/components/blocks/InteractiveAreaChartBlock.js +38 -38
  65. package/dist/components/blocks/KanbanDemoBlock.js +3 -3
  66. package/dist/components/blocks/LoginBlock.js +2 -2
  67. package/dist/components/blocks/LogoCloud.js +2 -13
  68. package/dist/components/blocks/NavUser.js +42 -42
  69. package/dist/components/blocks/NotFoundBlock.js +41 -41
  70. package/dist/components/blocks/OnboardingBlock.js +38 -38
  71. package/dist/components/blocks/PricingBlock.js +4 -4
  72. package/dist/components/blocks/ProcessFlowBlock.js +2 -2
  73. package/dist/components/blocks/SettingsLayout.js +42 -42
  74. package/dist/components/blocks/SignUpBlock.js +1 -1
  75. package/dist/components/blocks/SocialProofBlock.js +4 -3
  76. package/dist/components/blocks/StatsBlock.js +38 -38
  77. package/dist/components/blocks/StatsMarketingBlock.js +2 -2
  78. package/dist/components/blocks/TestimonialsBlock.js +2 -1
  79. package/dist/components/blocks/TwoFactorChallengeBlock.js +38 -38
  80. package/dist/components/blocks/TwoFactorSetupBlock.js +41 -41
  81. package/dist/components/blocks/VoiceAgentCard.d.ts +3 -1
  82. package/dist/components/blocks/VoiceAgentCard.js +7 -76
  83. package/dist/components/blocks/WizardBlock.js +39 -39
  84. package/dist/components/blocks/user/InviteUserModal.js +38 -38
  85. package/dist/components/logos/index.js +2 -2
  86. package/dist/components/page-kits/AgentsChatPageKit.js +59 -58
  87. package/dist/components/page-kits/AnalyticsPageKit.js +44 -44
  88. package/dist/components/page-kits/BlogContentPageKit.js +43 -43
  89. package/dist/components/page-kits/CheckoutPageKit.js +41 -41
  90. package/dist/components/page-kits/CompanySuitePageKit.js +47 -47
  91. package/dist/components/page-kits/CrudFormPageKit.js +44 -44
  92. package/dist/components/page-kits/CrudListDetailPageKit.js +44 -44
  93. package/dist/components/page-kits/DashboardPageKit.js +44 -44
  94. package/dist/components/page-kits/KanbanBoardPageKit.js +47 -47
  95. package/dist/components/page-kits/LandingPageKit.js +50 -49
  96. package/dist/components/page-kits/LoginPageKit.js +2 -2
  97. package/dist/components/page-kits/MarketingShellPageKit.js +40 -40
  98. package/dist/components/page-kits/NavigationShellPageKit.js +42 -42
  99. package/dist/components/page-kits/OnboardingPageKit.js +44 -44
  100. package/dist/components/page-kits/PricingPageKit.js +46 -46
  101. package/dist/components/page-kits/ProfileSettingsPageKit.js +2 -2
  102. package/dist/components/page-kits/ServiceSuitePageKit.js +47 -46
  103. package/dist/components/page-kits/SignupPageKit.js +2 -2
  104. package/dist/components/page-kits/SuccessPageKit.js +38 -38
  105. package/dist/components/page-kits/TeamSettingsPageKit.js +45 -45
  106. package/dist/components/page-kits/TwoFactorPageKit.js +41 -41
  107. package/dist/components/page-kits/VerifyEmailPageKit.js +38 -38
  108. package/dist/components/page-kits/VoiceAgentsPageKit.js +80 -76
  109. package/dist/components/ui/Accordion.js +38 -38
  110. package/dist/components/ui/AgentMessageBubble.d.ts +20 -4
  111. package/dist/components/ui/AgentMessageBubble.js +39 -39
  112. package/dist/components/ui/AgentStatus.d.ts +1 -1
  113. package/dist/components/ui/AgentStatus.js +5 -10
  114. package/dist/components/ui/AgentTerminal.d.ts +4 -1
  115. package/dist/components/ui/AgentTerminal.js +3 -1
  116. package/dist/components/ui/AgentTimeline.d.ts +2 -2
  117. package/dist/components/ui/AgentTimeline.js +15 -6
  118. package/dist/components/ui/AnimatedDialog.js +38 -38
  119. package/dist/components/ui/AnimatedSheet.js +38 -38
  120. package/dist/components/ui/ApprovalCard.js +1 -1
  121. package/dist/components/ui/Breadcrumb.js +38 -38
  122. package/dist/components/ui/Calendar.js +38 -38
  123. package/dist/components/ui/Carousel.js +38 -38
  124. package/dist/components/ui/ChatActions.d.ts +14 -0
  125. package/dist/components/ui/ChatActions.js +52 -0
  126. package/dist/components/ui/ChatBranch.d.ts +18 -0
  127. package/dist/components/ui/ChatBranch.js +84 -0
  128. package/dist/components/ui/ChatChainOfThought.d.ts +25 -0
  129. package/dist/components/ui/ChatChainOfThought.js +99 -0
  130. package/dist/components/ui/ChatConfirmation.d.ts +37 -0
  131. package/dist/components/ui/ChatConfirmation.js +115 -0
  132. package/dist/components/ui/ChatGreeting.d.ts +18 -0
  133. package/dist/components/ui/ChatGreeting.js +80 -0
  134. package/dist/components/ui/ChatMessage.d.ts +40 -0
  135. package/dist/components/ui/ChatMessage.js +96 -0
  136. package/dist/components/ui/ChatPlan.d.ts +29 -0
  137. package/dist/components/ui/ChatPlan.js +86 -0
  138. package/dist/components/ui/ChatPromptInput.d.ts +32 -0
  139. package/dist/components/ui/ChatPromptInput.js +193 -0
  140. package/dist/components/ui/ChatPromptInputAttachments.d.ts +9 -0
  141. package/dist/components/ui/ChatPromptInputAttachments.js +145 -0
  142. package/dist/components/ui/ChatQueue.d.ts +32 -0
  143. package/dist/components/ui/ChatQueue.js +93 -0
  144. package/dist/components/ui/ChatReasoning.d.ts +20 -0
  145. package/dist/components/ui/ChatReasoning.js +91 -0
  146. package/dist/components/ui/ChatResponse.d.ts +14 -0
  147. package/dist/components/ui/ChatResponse.js +25 -0
  148. package/dist/components/ui/ChatShimmer.d.ts +23 -0
  149. package/dist/components/ui/ChatShimmer.js +6 -0
  150. package/dist/components/ui/ChatSources.d.ts +30 -0
  151. package/dist/components/ui/ChatSources.js +113 -0
  152. package/dist/components/ui/ChatSuggestion.d.ts +13 -0
  153. package/dist/components/ui/ChatSuggestion.js +41 -0
  154. package/dist/components/ui/ChatThinkingMessage.d.ts +12 -0
  155. package/dist/components/ui/ChatThinkingMessage.js +55 -0
  156. package/dist/components/ui/ChatToolCall.d.ts +41 -0
  157. package/dist/components/ui/ChatToolCall.js +192 -0
  158. package/dist/components/ui/CheckStatus.d.ts +1 -1
  159. package/dist/components/ui/Checkbox.js +38 -38
  160. package/dist/components/ui/CheckoutForm.js +38 -38
  161. package/dist/components/ui/CheckoutFormDemo.js +38 -38
  162. package/dist/components/ui/Combobox.js +38 -38
  163. package/dist/components/ui/Command.js +38 -38
  164. package/dist/components/ui/ContextMenu.js +38 -38
  165. package/dist/components/ui/Conversation.d.ts +21 -0
  166. package/dist/components/ui/Conversation.js +196 -0
  167. package/dist/components/ui/ConversationThread.d.ts +8 -2
  168. package/dist/components/ui/ConversationThread.js +34 -16
  169. package/dist/components/ui/DataTable.js +40 -40
  170. package/dist/components/ui/DatePicker.js +38 -38
  171. package/dist/components/ui/DateRangePicker.js +38 -38
  172. package/dist/components/ui/Dialog.js +38 -38
  173. package/dist/components/ui/DropdownMenu.js +39 -39
  174. package/dist/components/ui/FileUpload.js +38 -38
  175. package/dist/components/ui/InputOTP.js +38 -38
  176. package/dist/components/ui/KanbanBoard.js +2 -2
  177. package/dist/components/ui/LanguageSwitcher.js +38 -38
  178. package/dist/components/ui/Menubar.js +38 -38
  179. package/dist/components/ui/NavigationMenu.js +38 -38
  180. package/dist/components/ui/NotificationCenter.js +38 -38
  181. package/dist/components/ui/Pagination.js +38 -38
  182. package/dist/components/ui/RadioGroup.js +38 -38
  183. package/dist/components/ui/Resizable.js +38 -38
  184. package/dist/components/ui/SearchCommand.js +38 -38
  185. package/dist/components/ui/Select.js +38 -38
  186. package/dist/components/ui/SettingsModal.js +38 -38
  187. package/dist/components/ui/Sheet.js +38 -38
  188. package/dist/components/ui/Sidebar.js +41 -41
  189. package/dist/components/ui/StyleToggle.js +1 -1
  190. package/dist/components/ui/TagInput.js +38 -38
  191. package/dist/components/ui/ThemeToggle.js +39 -39
  192. package/dist/components/ui/ThinkingIndicator.d.ts +3 -1
  193. package/dist/components/ui/ThinkingIndicator.js +2 -1
  194. package/dist/components/ui/Toast.js +38 -38
  195. package/dist/components/ui/Toaster.js +38 -38
  196. package/dist/components/ui/ToolCallCard.d.ts +1 -1
  197. package/dist/components/ui/ToolCallCard.js +5 -1
  198. package/dist/components/ui/TreeView.js +38 -38
  199. package/dist/components/ui/charts/index.js +1 -1
  200. package/dist/components/ui/icons/index.js +38 -38
  201. package/dist/components/ui/text-effects/index.js +2 -2
  202. package/dist/hooks/use-scroll-to-bottom.d.ts +13 -0
  203. package/dist/hooks/use-scroll-to-bottom.js +2 -0
  204. package/dist/index.js +43 -43
  205. package/dist/internal/local-image-assets.d.ts +12 -0
  206. package/dist/messages/en.js +1 -1
  207. package/dist/messages/it.js +1 -1
  208. package/dist/test/PublicSeedTestProvider.js +2 -2
  209. package/dist/test/simulate-ime-composition.d.ts +54 -0
  210. package/dist/test/simulate-ime-composition.js +55 -0
  211. package/eslint-rules/nadicode/config.js +2 -0
  212. package/eslint-rules/nadicode/index.js +4 -0
  213. package/eslint-rules/nadicode/rules/no-deprecated-ds-import.js +77 -0
  214. package/eslint-rules/nadicode/rules/no-forbidden-page-kit-import.js +99 -0
  215. package/eslint-rules/nadicode/rules/no-unregistered-glass.js +2 -0
  216. package/package.json +103 -6
  217. package/scripts/ds-check.mjs +94 -73
  218. package/dist/chunk-MLUSJTS2.js +0 -107
  219. package/dist/chunk-TZXZFSD2.js +0 -33
  220. package/dist/{chunk-MX5FUFQR.js → chunk-7A2RXKGH.js} +2 -2
  221. package/dist/{chunk-5DKCZWC6.js → chunk-CQEUNASC.js} +1 -1
  222. package/dist/{chunk-RMLS2QUC.js → chunk-HZERHGBT.js} +1 -1
  223. package/dist/{chunk-WAVU744B.js → chunk-IXQGKJU4.js} +3 -3
  224. package/dist/{chunk-4HRVRW2X.js → chunk-J2DCQDXO.js} +2 -2
  225. package/dist/{chunk-6MFAZU4B.js → chunk-RGE5OQMZ.js} +1 -1
  226. package/dist/{chunk-PJNHVPHF.js → chunk-TYP2MR3Q.js} +1 -1
  227. package/dist/{chunk-TS2JSPQR.js → chunk-U4GYSYGN.js} +1 -1
  228. package/dist/{chunk-EJNF6JLL.js → chunk-VEO56RH4.js} +1 -1
  229. package/dist/{chunk-AURJQZC4.js → chunk-VNNAL4A6.js} +1 -1
  230. package/dist/{chunk-5PORR6LE.js → chunk-XTASI4IY.js} +1 -1
  231. package/dist/{chunk-E4L6LR6P.js → chunk-Z233ZQZE.js} +1 -1
@@ -1,279 +1,88 @@
1
1
  # Tokens Reference
2
2
 
3
- ## Architecture
3
+ This file is a usage guide, not the raw source of token values.
4
4
 
5
- ```
6
- tokens.config.js --> index.css --> tailwind.config.js
7
- (master JS) (CSS vars) (Tailwind theme)
8
- ```
9
-
10
- 1. **`src/lib/tokens.config.js`** -- Pure JS, exports `colorScales`, `colorTokens`, `tokens`
11
- 2. **`src/index.css`** -- Maps tokens to CSS custom properties on `:root` (light) and `:root.dark`
12
- 3. **`tailwind.config.js`** -- Imports tokens, extends Tailwind with CSS variable references
13
- 4. **`src/tokens.ts`** -- Re-exports with TypeScript types for component code
14
-
15
- In consumer apps, the package ships the baseline tokens stylesheet as `@vadimcomanescu/nadicode-design-system/tokens.css`. Consumers import `@vadimcomanescu/nadicode-design-system/tokens.css` plus `seed-palette.css` in their `globals.css`.
16
-
17
- Normal brand customization does **not** happen in the package token pipeline. Consumers should edit `seed-palette.css` instead of changing `tokens.config.js` or the package tokens stylesheet.
18
-
19
- **CSS Variable Format:** Space-separated RGB values (NOT hex).
20
- ```css
21
- /* CORRECT */ --color-background: 15 17 20;
22
- /* WRONG */ --color-background: #0F1114;
23
- ```
24
- This enables Tailwind opacity modifiers: `bg-background/50` -> `rgb(15 17 20 / 0.5)`
25
-
26
- ---
27
-
28
- ## 12-Step Radix Color Scales
29
-
30
- Steps usage: 1-2 backgrounds, 3-5 component bg/hover/active, 6-8 borders/separators, 9-10 solid fills, 11-12 high-contrast text.
31
-
32
- ### Gray
5
+ ## Source Of Truth
33
6
 
34
- | Step | Dark | Light |
35
- |------|------|-------|
36
- | 1 | `#0F1114` | `#FBFCFD` |
37
- | 2 | `#151719` | `#F5F7F9` |
38
- | 3 | `#1C1F23` | `#EDF0F3` |
39
- | 4 | `#232730` | `#E4E8EC` |
40
- | 5 | `#2B2F37` | `#D9DFE5` |
41
- | 6 | `#33383F` | `#CDD4DC` |
42
- | 7 | `#3E4550` | `#B5BECA` |
43
- | 8 | `#505A68` | `#97A3B2` |
44
- | 9 | `#6B7A8A` | `#6B7A8A` |
45
- | 10 | `#8494A7` | `#566878` |
46
- | 11 | `#A0AEBB` | `#3E4F60` |
47
- | 12 | `#E1E7ED` | `#1A2230` |
7
+ - authored source: `src/lib/tokens.config.js`
8
+ - generated repo CSS: `src/index.css`
9
+ - shipped consumer CSS: `@vadimcomanescu/nadicode-design-system/tokens.css`
48
10
 
49
- ### Gray Alpha
11
+ When maintaining the DS, edit `src/lib/tokens.config.js` and regenerate through `npm run build:lib`. Do not hand-edit generated CSS.
50
12
 
51
- | Step | Dark | Light |
52
- |------|------|-------|
53
- | 1 | `rgba(200,220,240, 0.02)` | `rgba(0,30,60, 0.02)` |
54
- | 2 | `rgba(200,220,240, 0.04)` | `rgba(0,30,60, 0.04)` |
55
- | 3 | `rgba(200,220,240, 0.06)` | `rgba(0,30,60, 0.07)` |
56
- | 4 | `rgba(200,220,240, 0.09)` | `rgba(0,30,60, 0.11)` |
57
- | 5 | `rgba(200,220,240, 0.12)` | `rgba(0,30,60, 0.15)` |
58
- | 6 | `rgba(200,220,240, 0.16)` | `rgba(0,30,60, 0.20)` |
59
- | 7 | `rgba(200,220,240, 0.22)` | `rgba(0,30,60, 0.29)` |
60
- | 8 | `rgba(200,220,240, 0.32)` | `rgba(0,30,60, 0.41)` |
61
- | 9 | `rgba(200,220,240, 0.45)` | `rgba(0,30,60, 0.58)` |
62
- | 10 | `rgba(200,220,240, 0.58)` | `rgba(0,30,60, 0.66)` |
63
- | 11 | `rgba(200,220,240, 0.72)` | `rgba(0,30,60, 0.76)` |
64
- | 12 | `rgba(200,220,240, 0.93)` | `rgba(0,30,60, 0.90)` |
13
+ In consumer apps, normal branding work happens in `seed-palette.css`, not in the package token pipeline.
65
14
 
66
- ### Teal (Accent)
15
+ ## CSS Variable Format
67
16
 
68
- | Step | Dark | Light |
69
- |------|------|-------|
70
- | 1 | `#0B1615` | `#F0FDFC` |
71
- | 2 | `#0F1F1E` | `#E3FAF8` |
72
- | 3 | `#122B29` | `#C8F3EF` |
73
- | 4 | `#163834` | `#A8E9E2` |
74
- | 5 | `#1B4542` | `#85DBD4` |
75
- | 6 | `#21554F` | `#5DC9C0` |
76
- | 7 | `#2A6D66` | `#35B2A8` |
77
- | 8 | `#35917F` | `#22958D` |
78
- | 9 | `#38BDB8` | `#1A8F88` |
79
- | 10 | `#4ECEC8` | `#147A73` |
80
- | 11 | `#7EDCD6` | `#0F6660` |
81
- | 12 | `#C2F0ED` | `#08403D` |
17
+ Use space-separated RGB values, not hex:
82
18
 
83
- ### Red (Destructive)
84
-
85
- | Step | Dark | Light |
86
- |------|------|-------|
87
- | 1 | `#191113` | `#FFF5F5` |
88
- | 2 | `#201316` | `#FFE8E8` |
89
- | 3 | `#3B1219` | `#FECDD4` |
90
- | 4 | `#50141D` | `#FDAFB7` |
91
- | 5 | `#661823` | `#FA8F9A` |
92
- | 6 | `#7E1F2D` | `#F16C78` |
93
- | 7 | `#9E2B3A` | `#E34D5B` |
94
- | 8 | `#C73A4B` | `#CE3644` |
95
- | 9 | `#E5484D` | `#CE2C3B` |
96
- | 10 | `#EB5E5E` | `#B82535` |
97
- | 11 | `#F39090` | `#9C1E2E` |
98
- | 12 | `#FAD1D4` | `#5C111A` |
99
-
100
- ### Green (Success)
101
-
102
- | Step | Dark | Light |
103
- |------|------|-------|
104
- | 1 | `#0D1512` | `#F2FDF6` |
105
- | 2 | `#111C17` | `#E3FAEC` |
106
- | 3 | `#13291F` | `#C2F2D6` |
107
- | 4 | `#163727` | `#9DE8BC` |
108
- | 5 | `#1A4530` | `#76D9A0` |
109
- | 6 | `#1F563A` | `#4EC785` |
110
- | 7 | `#266E48` | `#30B26B` |
111
- | 8 | `#2F8E5A` | `#1D9B55` |
112
- | 9 | `#3DD68C` | `#1B9450` |
113
- | 10 | `#5CE4A0` | `#147C42` |
114
- | 11 | `#8CEDB8` | `#0F6636` |
115
- | 12 | `#C8F5DD` | `#08401F` |
116
-
117
- ### Amber (Warning)
118
-
119
- | Step | Dark | Light |
120
- |------|------|-------|
121
- | 1 | `#16120B` | `#FEFCF0` |
122
- | 2 | `#1D1710` | `#FDF8E0` |
123
- | 3 | `#2C2011` | `#FCEFC0` |
124
- | 4 | `#3D2B10` | `#FAE39A` |
125
- | 5 | `#4F370F` | `#F5D46E` |
126
- | 6 | `#63440E` | `#E8C044` |
127
- | 7 | `#7E5711` | `#D4A825` |
128
- | 8 | `#A87318` | `#B88E15` |
129
- | 9 | `#F5C742` | `#D09E10` |
130
- | 10 | `#FFDB5C` | `#B08510` |
131
- | 11 | `#FFE588` | `#866510` |
132
- | 12 | `#FFF3CC` | `#4A380A` |
133
-
134
- ### Blue (Info)
135
-
136
- | Step | Dark | Light |
137
- |------|------|-------|
138
- | 1 | `#0F1520` | `#F3F8FE` |
139
- | 2 | `#131B2E` | `#E6F0FD` |
140
- | 3 | `#15243B` | `#C8DFFB` |
141
- | 4 | `#192E4C` | `#A6CBF7` |
142
- | 5 | `#1D3A5E` | `#80B4F3` |
143
- | 6 | `#224973` | `#5999EC` |
144
- | 7 | `#2A5E92` | `#377FE2` |
145
- | 8 | `#347AB8` | `#2068D0` |
146
- | 9 | `#3E96F4` | `#2E78E5` |
147
- | 10 | `#5EAAF7` | `#2362C7` |
148
- | 11 | `#8EC3FA` | `#1B4FA5` |
149
- | 12 | `#CEE1FC` | `#0F3060` |
150
-
151
- ### Violet
152
-
153
- | Step | Dark | Light |
154
- |------|------|-------|
155
- | 1 | `#14111F` | `#F9F6FE` |
156
- | 2 | `#1B1528` | `#F1EBFD` |
157
- | 3 | `#241C38` | `#E3D4FC` |
158
- | 4 | `#2E224A` | `#D2B9FA` |
159
- | 5 | `#38295E` | `#BF9CF7` |
160
- | 6 | `#443375` | `#A87CF2` |
161
- | 7 | `#553F94` | `#9060EA` |
162
- | 8 | `#6B54B5` | `#7A4ADD` |
163
- | 9 | `#8B5CF6` | `#7C3AED` |
164
- | 10 | `#9E77F8` | `#6A2ED2` |
165
- | 11 | `#BAA0FA` | `#5624B3` |
166
- | 12 | `#E2D5FD` | `#351468` |
167
-
168
- ---
19
+ ```css
20
+ /* correct */
21
+ --color-background: 247 247 248;
169
22
 
170
- ## Semantic Token Map
23
+ /* wrong */
24
+ --color-background: #f7f7f8;
25
+ ```
171
26
 
172
- | CSS Variable | Tailwind Class | Dark | Light |
173
- |---|---|---|---|
174
- | `--color-background` | `bg-background` | gray.1 | gray.1 |
175
- | `--color-surface` | `bg-surface` | gray.2 | gray.2 |
176
- | `--color-surface-hover` | `bg-surface-hover` | gray.3 | gray.3 |
177
- | `--color-surface-active` | `bg-surface-active` | gray.4 | gray.4 |
178
- | `--color-surface-raised` | `bg-surface-raised` | gray.5 | gray.2 |
179
- | `--color-border` | `border-border` | gray.6 | gray.6 |
180
- | `--color-border-hover` | `border-border-hover` | gray.7 | gray.7 |
181
- | `--color-border-subtle` | `border-border-subtle` | grayA.3 | grayA.3 |
182
- | `--color-primary` | `bg-primary` | gray.12 | gray.12 |
183
- | `--color-primary-foreground` | `text-primary-foreground` | gray.1 | gray.1 |
184
- | `--color-secondary` | `bg-secondary` | gray.4 | gray.3 |
185
- | `--color-accent` | `bg-accent` | teal.9 | teal.9 |
186
- | `--color-destructive` | `bg-destructive` | red.9 | red.9 |
187
- | `--color-success` | `bg-success` | green.9 | green.9 |
188
- | `--color-warning` | `bg-warning` | amber.9 | amber.9 |
189
- | `--color-info` | `bg-info` | blue.9 | blue.9 |
190
- | `--color-muted` | `bg-muted` | gray.4 | gray.3 |
191
- | `--color-muted-foreground` | `text-muted-foreground` | gray.11 | gray.11 |
192
- | `--color-overlay` | `bg-overlay` | `#000` | `#000` |
193
- | `--color-text-primary` | `text-text-primary` | gray.12 | gray.12 |
194
- | `--color-text-secondary` | `text-text-secondary` | gray.11 | gray.11 |
195
- | `--color-text-tertiary` | `text-text-tertiary` | gray.10 | gray.9 |
196
- | `--color-focus-ring` | `ring-accent` | teal.9 | teal.9 |
197
- | `--color-link` | `text-link` | teal.10 | teal.11 |
198
- | `--color-input` | `bg-input` | gray.4 | gray.3 |
199
- | `--color-disabled` | `bg-disabled` | gray.7 | gray.6 |
27
+ This preserves Tailwind opacity modifiers such as `bg-background/50`.
200
28
 
201
- ### Chart Variables (space-separated RGB)
29
+ ## Allowed Semantic Utilities
202
30
 
203
- | Var | Dark | Light | Hue |
204
- |-----|------|-------|-----|
205
- | `--chart-1` | `56 189 184` | `26 143 136` | Teal |
206
- | `--chart-2` | `62 150 244` | `46 120 229` | Blue |
207
- | `--chart-3` | `245 199 66` | `208 158 16` | Amber |
208
- | `--chart-4` | `61 214 140` | `27 148 80` | Green |
209
- | `--chart-5` | `139 92 246` | `124 58 237` | Violet |
210
- | `--chart-6` | `229 72 77` | `206 44 59` | Red |
31
+ ### Backgrounds
211
32
 
212
- ---
33
+ - `bg-background`
34
+ - `bg-surface`
35
+ - `bg-surface-hover`
36
+ - `bg-surface-active`
37
+ - `bg-surface-raised`
38
+ - `bg-muted`
39
+ - `bg-overlay/80`
213
40
 
214
- ## Non-Color Tokens
41
+ ### Text
215
42
 
216
- ### Typography
43
+ - `text-text-primary`
44
+ - `text-text-secondary`
45
+ - `text-text-tertiary`
46
+ - `text-link`
217
47
 
218
- | Token | Value |
219
- |-------|-------|
220
- | `font-sans` | `Satoshi, sans-serif` |
221
- | `text-xs` | 12px |
222
- | `text-sm` | 14px |
223
- | `text-base` | 16px |
224
- | `text-lg` | 20px |
225
- | `text-xl` | 24px |
226
- | `text-2xl` | 32px |
227
- | `text-3xl` | 48px |
228
- | `text-4xl` | 64px |
48
+ Do not use `text-foreground` or `text-muted-foreground`.
229
49
 
230
- ### Border Radius
50
+ ### Borders And Focus
231
51
 
232
- | Token | Value |
233
- |-------|-------|
234
- | `rounded-sm` | 4px |
235
- | `rounded-md` | 8px |
236
- | `rounded-lg` | 16px |
237
- | `rounded-full` | 9999px |
52
+ - `border-border`
53
+ - `border-border-hover`
54
+ - `border-border-subtle`
55
+ - `ring-focus-ring` for default focus indication
56
+ - `ring-accent` for selected or emphasized states
238
57
 
239
- ### Shadows
58
+ Do not use `border-error`.
240
59
 
241
- | Token | Value |
242
- |-------|-------|
243
- | `shadow-glow` | `0 0 20px -5px rgba(255,255,255,0.1)` |
244
- | `shadow-glow-accent` | `0 0 20px -5px rgba(56,189,184,0.15)` |
60
+ ### Status
245
61
 
246
- ### Spacing
62
+ - `bg-destructive`, `text-destructive`
63
+ - `bg-success`, `text-success`
64
+ - `bg-warning`, `text-warning`
65
+ - `bg-info`, `text-info`
247
66
 
248
- Base unit: 4px. Custom: `spacing-4.5` = `1.125rem`.
67
+ ### Interactive
249
68
 
250
- ---
69
+ - `bg-primary`
70
+ - `bg-secondary`
71
+ - `bg-accent`
72
+ - `text-accent`
251
73
 
252
- ## Bloom Style Palette
74
+ ### Charts
253
75
 
254
- `:root.bloom` overrides the light theme with a warm, organic palette. Bloom is light-only (forces `resolvedTheme` to `'light'`).
76
+ - `chart-1` through `chart-8`
255
77
 
256
- ### Key Bloom Token Overrides
78
+ Use the exported chart tokens, not hardcoded hex values.
257
79
 
258
- | Token | Bloom | Arctic Light | Change |
259
- |-------|-------|-------------|--------|
260
- | `--color-background` | `254 253 251` (warm cream) | `251 252 253` (cool white) | Warmer base |
261
- | `--color-surface` | `251 249 246` | `245 247 249` | Cream tint |
262
- | `--color-accent` | `232 87 58` (coral) | `26 143 136` (teal) | Different hue |
263
- | `--color-border` | `217 209 199` (warm) | `205 212 220` (cool) | Brown vs blue-gray |
264
- | `--color-destructive` | `232 86 109` (rose) | `206 44 59` (red) | Softer |
265
- | `--color-success` | `61 214 160` (mint) | `27 148 80` (green) | Brighter |
266
- | `--color-warning` | `245 166 35` (peach) | `208 158 16` (amber) | Warmer |
267
- | `--color-overlay` | `45 35 24` (warm brown) | `0 0 0` (black) | Brown tint |
268
- | `--color-focus-ring` | `139 92 246` (violet) | `26 143 136` (teal) | Violet accent |
269
- | `--color-link` | `99 56 196` (violet) | `15 102 96` (teal) | Violet links |
270
- | `--color-info` | `90 180 245` (sky blue) | `46 120 229` (blue) | Sky blue |
80
+ ## Theme Notes
271
81
 
272
- ### Bloom Glass
82
+ - Arctic is the baseline jade and teal style across light and dark themes.
83
+ - Bloom is the warm light-only style variant.
84
+ - `--color-focus-ring` currently tracks the jade focus color in Arctic and the bloom-specific focus token in Bloom.
273
85
 
274
- Bloom glass uses warm cream tints instead of cool white:
275
- - `glass-panel`: cream gradient with brown shadows (`rgba(45, 35, 24, 0.06)`)
276
- - `glass-floating`: warm hover rotation (`rotate(0.3deg)`)
277
- - `glass-overlay`: cream-tinted with brown shadows
86
+ ## Consumer Override Rule
278
87
 
279
- See `src/index.css` for the full Bloom glass overrides.
88
+ Consumers may override palette tokens in `seed-palette.css`. They should not change the package token catalog or copy package CSS into the app.
package/README.md CHANGED
@@ -1,243 +1,71 @@
1
1
  # Seed Design System
2
2
 
3
- A premium, opinionated design system for AI-integrated web applications, with dual-axis theming (light/dark/bloom), glassmorphism effects, and a full agent skill for AI-assisted development.
3
+ A package-backed design system for AI-integrated Next.js apps. The repo contains the published package, `@vadimcomanescu/nadicode-design-system`, and the in-repo showcase app used to exercise it.
4
4
 
5
5
  ## Quick Start
6
6
 
7
7
  ```bash
8
8
  npm install
9
- npm run dev # http://localhost:5001
9
+ npm run dev
10
10
  ```
11
11
 
12
- The dev server runs a showcase app (`src/app/(showcase)/`) that exercises all components, blocks, charts, icons, and patterns.
12
+ The dev server runs on `http://localhost:5001` and serves the showcase routes under `src/app/(showcase)/`.
13
13
 
14
- ## Using in Next.js Projects
14
+ ## Using Seed In Apps
15
15
 
16
- Seed is consumed through installable package artifacts, not live repo-path links.
16
+ Consumer apps install Seed through an exact released package version. For unpublished local work, stage a tarball under `.nadicode/packages/` and install that committed relative artifact instead. Do not point apps at a live DS repo directory.
17
17
 
18
- | Situation | Command | Consumer guidance |
19
- |-----------|---------|-------------------|
20
- | Existing Next.js app | Install an exact released `@vadimcomanescu/nadicode-design-system` version | Read the synced Seed skill in the consumer app: `.agents/skills/seed/SKILL.md` |
21
- | Greenfield SaaS app | Use the scaffold repo for the app shell, then install the exact released `@vadimcomanescu/nadicode-design-system` version it pins | Read the synced Seed skill in the generated app: `.agents/skills/seed/SKILL.md` |
18
+ Canonical consumer docs:
22
19
 
23
- DS-repo authoring notes and ownership rules still live under `docs/nadicode/`, but consumer apps keep only the synced Seed skill, not the `docs/nadicode/` tree.
20
+ - [docs/nadicode/SCAFFOLDING_PROCESS.md](docs/nadicode/SCAFFOLDING_PROCESS.md), normative runtime and ownership contract
21
+ - [docs/nadicode/ADOPTION_PLAYBOOK.md](docs/nadicode/ADOPTION_PLAYBOOK.md), step-by-step install and wiring flow
22
+ - [.agents/skills/seed/SKILL.md](.agents/skills/seed/SKILL.md), synced agent-facing usage guide
23
+ - [.agents/skills/seed/contract.md](.agents/skills/seed/contract.md), synced binary consumer rules
24
24
 
25
- ### Package-backed consumer contract
25
+ ## Canonical Sources
26
26
 
27
- 1. `package.json` depends on `@vadimcomanescu/nadicode-design-system` through an exact released version such as `2.0.0`.
28
- 2. Consumer apps must not depend on `@vadimcomanescu/nadicode-design-system` through a live repo directory such as `file:/absolute/path/to/nadicode-design-system`.
29
- 3. `globals.css` imports `@vadimcomanescu/nadicode-design-system/tokens.css` before `seed-palette.css`.
30
- 4. `tailwind.config.*` uses `@vadimcomanescu/nadicode-design-system/tailwind`.
31
- 5. `eslint.config.*` imports `@vadimcomanescu/nadicode-design-system/eslint-config` and `@vadimcomanescu/nadicode-design-system/eslint-plugin`.
32
- 6. `providers.tsx` imports `ThemeProvider` from `@vadimcomanescu/nadicode-design-system/theme-provider`.
33
- 7. `@vadimcomanescu/nadicode-design-system/test` exports the package-owned `SeedTestProvider` wrapper for consumer tests, while repo-local tests can still use `@/test/SeedTestProvider`.
34
- 8. `scripts/ds-check.mjs` delegates to `@vadimcomanescu/nadicode-design-system/ds-check`.
35
- 9. `npm run ds:update` reinstalls from the `@vadimcomanescu/nadicode-design-system` spec already declared in `package.json` and syncs only the Seed usage skill.
36
- 10. The app stays package-backed, with DS runtime imported from `@vadimcomanescu/nadicode-design-system`.
37
- 11. DS scaffolding/distribution docs are not copied into the consumer app.
27
+ The repo treats structured truth and prose differently.
38
28
 
39
- ### Package-backed i18n contract
29
+ - Operational truth lives in `package.json` scripts and `.husky/*`.
30
+ - The shipped machine entrypoint for agents and scaffold apps lives in `contracts/consumer-contract.json` and is exported as `@vadimcomanescu/nadicode-design-system/consumer-contract`.
31
+ - Public package surface lives in `package.json` exports, `contracts/public-surface-registry.json`, and `bin/shipped-files.json`.
32
+ - Consumer ownership and package-backed runtime rules live in [docs/nadicode/SCAFFOLDING_PROCESS.md](docs/nadicode/SCAFFOLDING_PROCESS.md).
33
+ - Release steps live in [docs/releasing-package.md](docs/releasing-package.md).
34
+ - Component metadata lives in `dist/catalog.json`, generated from source.
40
35
 
41
- 1. The app owns `src/i18n/request.ts`, locale routing, and `NextIntlClientProvider`.
42
- 2. DS catalogs come from `@vadimcomanescu/nadicode-design-system/messages/<locale>`.
43
- 3. App translations live in `messages/<locale>.json`.
44
- 4. `src/i18n/request.ts` merges the two sources with `mergeSeedMessages()`.
45
- 5. Generated apps do not copy DS catalogs into the app.
36
+ Use prose docs for guidance and rationale. Use scripts, manifests, and generated artifacts for anything that must stay machine-accurate.
46
37
 
47
- ### Minimal wiring
38
+ ## Maintainer Workflow
48
39
 
49
- ```css
50
- /* src/app/globals.css */
51
- @import "@vadimcomanescu/nadicode-design-system/tokens.css";
52
- @import "../seed-palette.css";
53
- ```
54
-
55
- ```tsx
56
- // src/app/providers.tsx
57
- "use client"
58
-
59
- import { ThemeProvider } from "@vadimcomanescu/nadicode-design-system/theme-provider"
60
-
61
- export function Providers({ children }: { children: React.ReactNode }) {
62
- return <ThemeProvider>{children}</ThemeProvider>
63
- }
64
- ```
65
-
66
- ```js
67
- // tailwind.config.js
68
- import seedPreset from "@vadimcomanescu/nadicode-design-system/tailwind"
69
-
70
- export default seedPreset()
71
- ```
72
-
73
- ```js
74
- // eslint.config.mjs
75
- import seedConfig from "@vadimcomanescu/nadicode-design-system/eslint-config"
76
- import { nadicodePlugin } from "@vadimcomanescu/nadicode-design-system/eslint-plugin"
77
-
78
- export default [
79
- ...seedConfig,
80
- {
81
- plugins: {
82
- nadicode: nadicodePlugin,
83
- },
84
- },
85
- ]
86
- ```
87
-
88
- ```js
89
- // scripts/ds-check.mjs
90
- #!/usr/bin/env node
91
- import "@vadimcomanescu/nadicode-design-system/ds-check"
92
- ```
93
-
94
- ### Distribution rule
95
-
96
- Seed must install into consumer `node_modules` as real package files. The canonical consumer contract is an exact released package version such as `@vadimcomanescu/nadicode-design-system@2.0.0`.
97
-
98
- For unpublished local work before a release exists, stage the tarball artifact into the consumer app and install from a committed relative path such as `file:.nadicode/packages/vadimcomanescu-nadicode-design-system-<version>.tgz`:
99
-
100
- ```bash
101
- DS_REPO="/absolute/path/to/nadicode-design-system"
102
- mkdir -p .nadicode/packages
103
- npm --prefix "$DS_REPO" run pack:artifact -- "$PWD/.nadicode/packages"
104
- NADICODE_TARBALL="$(ls .nadicode/packages/vadimcomanescu-nadicode-design-system-*.tgz | head -n1)"
105
- npm install "@vadimcomanescu/nadicode-design-system@file:${NADICODE_TARBALL}"
106
- ```
107
-
108
- Consumer apps must also satisfy Nadicode's peer dependencies, especially `next`, `react`, `react-dom`, `next-intl`, and `tailwindcss`.
109
-
110
- `npm run ds:update` in the consumer app must reinstall from the existing `@vadimcomanescu/nadicode-design-system` dependency spec in `package.json`. If the app is pinned to a local tarball, refresh that tarball first, then run `npm run ds:update`.
111
-
112
- ### Verification
113
-
114
- ```bash
115
- npm run ds:check
116
- npm run lint
117
- npx tsc --noEmit
118
- npm run build
119
- ```
120
-
121
- ## Maintainer Release Workflow
122
-
123
- Private releases are done locally from this repo, not through GitHub CI.
124
-
125
- Before publishing, make sure the npm account that owns the `@vadimcomanescu` scope is authenticated locally:
126
-
127
- ```bash
128
- npm whoami --registry=https://registry.npmjs.org/
129
- ```
130
-
131
- If that fails, run `npm login` first. Publishing still requires either account 2FA or a granular access token that can publish under the scope.
40
+ Start with:
132
41
 
133
- 1. Bump the package version:
134
-
135
- ```bash
136
- npm version patch --no-git-tag-version
137
- ```
138
-
139
- Use `minor` or `major` instead of `patch` when appropriate.
140
-
141
- For the common cases, you can also run one of the release helpers:
142
-
143
- ```bash
144
- npm run release:patch
145
- npm run release:minor
146
- npm run release:major
147
- ```
148
-
149
- 2. Run the full package release command:
150
-
151
- ```bash
152
- npm run publish:package
153
- ```
154
-
155
- That command does three things locally:
156
-
157
- - `npm run release:check`
158
- - `npm publish --access=public --registry=https://registry.npmjs.org/`
159
- - `npm run release:verify`
160
-
161
- Those checks are also wired into the npm publish lifecycle in this repo, so a plain `npm publish` still runs the same local release gate and post-publish verification.
162
-
163
- 3. If you need to verify the published version again later:
164
-
165
- ```bash
166
- npm run release:verify
167
- ```
168
-
169
- 4. If the scaffold needs unpublished DS changes before the next release, stage a fallback artifact under `.nadicode/packages/` with `npm run pack:artifact -- /absolute/path/to/consumer/.nadicode/packages`.
170
-
171
- Canonical DS-repo onboarding docs:
172
-
173
- - `docs/nadicode/ADOPTION_PLAYBOOK.md`
174
- - `docs/nadicode/SCAFFOLDING_PROCESS.md`
175
- - `docs/agents/recipes.md`
176
- - `AGENTS.md`
177
- - `docs/releasing-package.md`
178
-
179
- ## Project Structure
180
-
181
- ```
182
- src/
183
- app/
184
- (showcase)/ # Component showcase (dev server UI)
185
- components/
186
- ui/ # UI primitives and effect components
187
- ui/icons/ # Animated icons (motion/react)
188
- ui/charts/ # Chart primitives (recharts)
189
- ui/stepper/ # Multi-step stepper
190
- ui/text-effects/ # Streaming text, gradient text, etc.
191
- blocks/ # Composed blocks (Hero, Pricing, Auth, etc.)
192
- layout/ # Grid system
193
- logos/ # Brand SVG logos
194
- animate-ui/ # Animation primitives (fade, slide, zoom, etc.)
195
- hooks/ # use-toast, use-mobile, use-token, etc.
196
- lib/
197
- tokens.config.js # Master token definitions
198
- ThemeProvider.tsx # Dual-axis theme context (theme + style)
199
- utils.ts # cn() class merge helper
200
- motion.ts # Motion spring/transition presets
201
- index.css # CSS tokens, glass effects, keyframes
202
- bin/
203
- dev-server.sh # Local Next.js dev server wrapper
204
- lighthouse.sh # Local Lighthouse runner
205
- .agents/
206
- skills/ # Bundled agent skills
207
- ```
42
+ - [AGENTS.md](AGENTS.md)
43
+ - [docs/conventions.md](docs/conventions.md)
44
+ - [docs/workflow.md](docs/workflow.md)
45
+ - [docs/releasing-package.md](docs/releasing-package.md)
208
46
 
209
47
  ## Commands
210
48
 
211
- ```bash
212
- npm run dev # Start dev server (port 5001)
213
- npm run build # Build
214
- npm run test # Run tests (Vitest)
215
- npm run lint # Lint source
216
- npm run typecheck # Type-check (tsc --noEmit)
217
- npm run test:all # typecheck + lint + tests
218
- npm run pack:artifact # Build and pack a consumer-installable .tgz artifact
219
- npm run ds:validate # Repo validation gate (build round-trip still tracked in scaffolding backlog)
220
- npm run ds:check # Nadicode contract enforcement
221
- npm run docs:check # Validate docs and agent references
222
- npm run docs:inventory # List all components
223
- npm run docs:api # Generate API docs
224
- npm run ds:task-pack # Build task pack from scope-definition.json
225
- npm run test:visual # Playwright visual regression tests
226
- ```
49
+ | Command | Purpose |
50
+ |---------|---------|
51
+ | `npm run dev` | Start the showcase dev server |
52
+ | `npm run typecheck` | Generate Next types and run `tsc --noEmit` |
53
+ | `npm run lint` | Run ESLint across source, scripts, and custom rules |
54
+ | `npm run test` | Run Vitest |
55
+ | `npm run build` | Build the showcase app |
56
+ | `npm run build:lib` | Build package artifacts, generated CSS, types, and catalog |
57
+ | `npm run contracts:generate` | Regenerate the full shipped contract surface from source |
58
+ | `npm run contracts:check` | Verify the shipped contract surface is in sync |
59
+ | `npm run ds:check` | Run package/scaffold contract checks |
60
+ | `npm run docs:check` | Run docs/reference drift checks |
61
+ | `npm run release:check` | Full release gate |
62
+ | `npm run test:visual` | Playwright visual regression suite |
227
63
 
228
64
  ## Theming
229
65
 
230
- Dual-axis: `theme` (light / dark / system) + `style` (arctic / bloom).
231
-
232
- - **Arctic**: Cool teal accent, deep blacks in dark mode
233
- - **Bloom**: Warm coral accent, cream tones, light-only
234
-
235
- Tokens flow: `tokens.config.js` -> `index.css` (CSS vars) -> `tailwind.config.js` (Tailwind classes)
66
+ Seed uses dual-axis theming:
236
67
 
237
- ## Key Conventions
68
+ - `theme`: `light`, `dark`, `system`
69
+ - `style`: `arctic`, `bloom`
238
70
 
239
- - Components use the **Radix + CVA + ref-as-prop** pattern (React 19, no forwardRef)
240
- - Icons: always import from `@/components/ui/icons/`, never from `lucide-react` directly
241
- - Colors: always use semantic tokens (`bg-background`, `text-text-primary`), never hardcoded
242
- - Glass effects: `glass-panel` (structural), `glass-floating` (elevated), `glass-overlay` (transient)
243
- - Class merging: always use `cn()` from `@/lib/utils`
71
+ Arctic is the jade/teal baseline. Bloom is the warm light-only variant. Token values and generated CSS are authored in `src/lib/tokens.config.js` and emitted through the build pipeline, not maintained by hand in docs.