@godxjp/ui 31.31.8 → 32.0.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 (727) hide show
  1. package/README.md +102 -121
  2. package/agent/START-HERE.md +10 -10
  3. package/agent/components/Accordion.json +2 -2
  4. package/agent/components/AccountChip.json +1 -1
  5. package/agent/components/Actions.json +1 -1
  6. package/agent/components/Activity.json +2 -2
  7. package/agent/components/Affix.json +1 -1
  8. package/agent/components/Alert.json +22 -6
  9. package/agent/components/AlertDialog.json +8 -1
  10. package/agent/components/Anchor.json +4 -3
  11. package/agent/components/AppLauncher.json +2 -2
  12. package/agent/components/AppProvider.json +19 -11
  13. package/agent/components/AppSettingPicker.json +18 -2
  14. package/agent/components/AppShell.json +4 -5
  15. package/agent/components/AreaChart.json +0 -1
  16. package/agent/components/AspectRatio.json +2 -2
  17. package/agent/components/Attachments.json +3 -3
  18. package/agent/components/AuthAccountSummary.json +1 -1
  19. package/agent/components/AuthDivider.json +1 -1
  20. package/agent/components/AuthExpiryProvider.json +0 -1
  21. package/agent/components/AuthFooter.json +2 -2
  22. package/agent/components/AuthIdentity.json +3 -3
  23. package/agent/components/AuthStack.json +1 -1
  24. package/agent/components/Avatar.json +2 -12
  25. package/agent/components/Badge.json +1 -1
  26. package/agent/components/BarChart.json +0 -1
  27. package/agent/components/BranchScopePicker.json +1 -1
  28. package/agent/components/Breadcrumb.json +1 -1
  29. package/agent/components/Button.json +3 -3
  30. package/agent/components/Calendar.json +1 -1
  31. package/agent/components/Card.json +2 -2
  32. package/agent/components/CardBar.json +0 -1
  33. package/agent/components/CardContent.json +0 -1
  34. package/agent/components/Carousel.json +4 -3
  35. package/agent/components/Cascader.json +1 -1
  36. package/agent/components/CenteredShell.json +78 -17
  37. package/agent/components/ChatBubble.json +3 -3
  38. package/agent/components/ChatBubbleList.json +3 -3
  39. package/agent/components/ChatComposer.json +3 -3
  40. package/agent/components/ChatSuggestion.json +3 -3
  41. package/agent/components/Checkbox.json +1 -1
  42. package/agent/components/CheckboxGroup.json +0 -1
  43. package/agent/components/CodeBlock.json +1 -1
  44. package/agent/components/Collapsible.json +4 -4
  45. package/agent/components/ColorPicker.json +1 -1
  46. package/agent/components/Command.json +5 -5
  47. package/agent/components/CommandPalette.json +1 -1
  48. package/agent/components/CompactBarTrend.json +1 -1
  49. package/agent/components/Conversations.json +3 -3
  50. package/agent/components/CredentialReveal.json +1 -1
  51. package/agent/components/DataState.json +2 -2
  52. package/agent/components/DataTable.json +1 -1
  53. package/agent/components/DatePicker.json +1 -1
  54. package/agent/components/Descriptions.json +1 -1
  55. package/agent/components/Dialog.json +2 -2
  56. package/agent/components/DraggablePanel.json +5 -4
  57. package/agent/components/DropdownMenu.json +1 -1
  58. package/agent/components/EmojiPicker.json +3 -2
  59. package/agent/components/EmptyState.json +1 -1
  60. package/agent/components/ErrorSurface.json +3 -3
  61. package/agent/components/FeatureList.json +1 -1
  62. package/agent/components/Field.json +0 -1
  63. package/agent/components/Flex.json +34 -4
  64. package/agent/components/FloatButton.json +6 -5
  65. package/agent/components/Form.json +1 -1
  66. package/agent/components/FormErrors.json +0 -1
  67. package/agent/components/FormField.json +6 -6
  68. package/agent/components/FormFieldArray.json +0 -1
  69. package/agent/components/FormFieldControl.json +0 -1
  70. package/agent/components/FormRoot.json +1 -1
  71. package/agent/components/Heading.json +3 -0
  72. package/agent/components/Icon.json +1 -1
  73. package/agent/components/Image.json +7 -4
  74. package/agent/components/InfiniteQueryState.json +1 -1
  75. package/agent/components/Input.json +1 -1
  76. package/agent/components/InputOTP.json +2 -2
  77. package/agent/components/Label.json +3 -3
  78. package/agent/components/LegalDocumentShell.json +5 -4
  79. package/agent/components/Legend.json +1 -1
  80. package/agent/components/LineChart.json +0 -1
  81. package/agent/components/Link.json +0 -1
  82. package/agent/components/ListRow.json +1 -1
  83. package/agent/components/Logo.json +5 -4
  84. package/agent/components/Marquee.json +4 -3
  85. package/agent/components/Masonry.json +4 -3
  86. package/agent/components/MasterDetail.json +1 -1
  87. package/agent/components/MegaMenu.json +4 -3
  88. package/agent/components/MobileShell.json +4 -4
  89. package/agent/components/NavList.json +1 -1
  90. package/agent/components/NumberInput.json +1 -1
  91. package/agent/components/OrgChart.json +4 -3
  92. package/agent/components/OrgSwitcher.json +1 -1
  93. package/agent/components/OverlayPortalProvider.json +0 -1
  94. package/agent/components/PageContainer.json +3 -3
  95. package/agent/components/PageCover.json +3 -2
  96. package/agent/components/Pagination.json +1 -1
  97. package/agent/components/PasswordInput.json +1 -1
  98. package/agent/components/PasswordStrength.json +1 -1
  99. package/agent/components/PermissionMatrix.json +1 -1
  100. package/agent/components/PieChart.json +0 -1
  101. package/agent/components/Popover.json +31 -6
  102. package/agent/components/PrefetchLink.json +1 -1
  103. package/agent/components/Progress.json +1 -1
  104. package/agent/components/Prose.json +1 -1
  105. package/agent/components/QrCode.json +1 -1
  106. package/agent/components/Radio.json +0 -1
  107. package/agent/components/RadioGroup.json +2 -2
  108. package/agent/components/RangeTimeline.json +2 -1
  109. package/agent/components/Rating.json +1 -1
  110. package/agent/components/RecordPicker.json +1 -1
  111. package/agent/components/ResizablePanel.json +1 -1
  112. package/agent/components/ResponsiveGrid.json +2 -2
  113. package/agent/components/Reveal.json +3 -3
  114. package/agent/components/ScrollArea.json +2 -2
  115. package/agent/components/SearchInput.json +1 -1
  116. package/agent/components/Segmented.json +1 -1
  117. package/agent/components/Select.json +7 -5
  118. package/agent/components/Separator.json +1 -1
  119. package/agent/components/ServiceCatalogCta.json +0 -1
  120. package/agent/components/ServiceLauncherCard.json +1 -1
  121. package/agent/components/ServiceRolePanel.json +1 -1
  122. package/agent/components/Sheet.json +5 -5
  123. package/agent/components/Sidebar.json +1 -1
  124. package/agent/components/Skeleton.json +26 -12
  125. package/agent/components/Slider.json +2 -2
  126. package/agent/components/SortableList.json +3 -2
  127. package/agent/components/SplitPane.json +1 -1
  128. package/agent/components/StatCard.json +1 -1
  129. package/agent/components/Steps.json +1 -1
  130. package/agent/components/Swatch.json +1 -1
  131. package/agent/components/Switch.json +1 -1
  132. package/agent/components/Table.json +1 -1
  133. package/agent/components/Tabs.json +3 -3
  134. package/agent/components/Text.json +5 -1
  135. package/agent/components/TextDiff.json +5 -4
  136. package/agent/components/Textarea.json +1 -1
  137. package/agent/components/ThemeScope.json +1 -1
  138. package/agent/components/ThoughtChain.json +3 -3
  139. package/agent/components/TimePicker.json +1 -1
  140. package/agent/components/Timeline.json +1 -1
  141. package/agent/components/TimelineGrid.json +5 -4
  142. package/agent/components/Toaster.json +0 -1
  143. package/agent/components/Toggle.json +3 -3
  144. package/agent/components/ToggleGroup.json +1 -1
  145. package/agent/components/Toolbar.json +10 -3
  146. package/agent/components/Tooltip.json +9 -9
  147. package/agent/components/Topbar.json +1 -1
  148. package/agent/components/TopbarItem.json +1 -1
  149. package/agent/components/Transfer.json +2 -2
  150. package/agent/components/Tree.json +1 -1
  151. package/agent/components/TreeSelect.json +1 -1
  152. package/agent/components/TwoFactorSetup.json +1 -1
  153. package/agent/components/Upload.json +1 -1
  154. package/agent/components/UploadCropDialog.json +1 -1
  155. package/agent/components/Welcome.json +3 -3
  156. package/agent/components/formatDate.json +2 -2
  157. package/agent/components/inertiaUpload.json +0 -1
  158. package/agent/components/useZodForm.json +0 -1
  159. package/agent/components-index.json +80 -154
  160. package/agent/components.json +541 -1737
  161. package/agent/index.json +10 -10
  162. package/agent/llms.txt +9 -9
  163. package/agent/patterns/account-recovery-settings.json +1 -1
  164. package/agent/patterns/auth-recovery-panels.json +2 -2
  165. package/agent/patterns/error-pages.json +1 -1
  166. package/agent/patterns/pricing-plans.json +17 -0
  167. package/agent/patterns-index.json +17 -1
  168. package/agent/patterns.json +21 -4
  169. package/agent/rules.json +30 -65
  170. package/agent/tokens.json +27 -57
  171. package/agent/vocabulary.json +3 -3
  172. package/dist/app/app-provider.d.ts +5 -3
  173. package/dist/app/app-provider.js +47 -12
  174. package/dist/app/date-format-labels.d.ts +3 -1
  175. package/dist/app/date-format-labels.js +2 -4
  176. package/dist/app/date-formats.d.ts +21 -2
  177. package/dist/app/date-formats.js +51 -2
  178. package/dist/app/index.d.ts +3 -1
  179. package/dist/app/index.js +5 -0
  180. package/dist/app/locales.d.ts +58 -3
  181. package/dist/app/locales.js +134 -8
  182. package/dist/app/preset.d.ts +25 -0
  183. package/dist/app/preset.js +10 -0
  184. package/dist/app/request-headers.d.ts +3 -3
  185. package/dist/app/request-headers.js +19 -10
  186. package/dist/app/settings-scope.d.ts +54 -0
  187. package/dist/app/settings-scope.js +46 -0
  188. package/dist/app/tenant-theme.js +8 -3
  189. package/dist/app/time-format-labels.d.ts +4 -1
  190. package/dist/app/time-format-labels.js +7 -1
  191. package/dist/app/types.d.ts +10 -2
  192. package/dist/app/use-formatting.d.ts +1 -1
  193. package/dist/components/admin/index.d.ts +1 -1
  194. package/dist/components/admin/index.js +1 -1
  195. package/dist/components/data-display/accordion.d.ts +51 -1
  196. package/dist/components/data-display/accordion.js +247 -1
  197. package/dist/components/data-display/avatar.d.ts +16 -1
  198. package/dist/components/data-display/avatar.js +109 -1
  199. package/dist/components/data-display/credential-reveal.d.ts +9 -2
  200. package/dist/components/data-display/credential-reveal.js +156 -1
  201. package/dist/components/data-display/image.js +5 -3
  202. package/dist/components/data-display/index.d.ts +0 -21
  203. package/dist/components/data-display/index.js +1 -43
  204. package/dist/components/data-display/popover.d.ts +15 -3
  205. package/dist/components/data-display/popover.js +168 -2
  206. package/dist/components/data-entry/branch-scope-picker.d.ts +1 -1
  207. package/dist/components/data-entry/index.d.ts +5 -12
  208. package/dist/components/data-entry/index.js +11 -12
  209. package/dist/components/data-entry/input-otp.d.ts +48 -2
  210. package/dist/components/data-entry/input-otp.js +94 -1
  211. package/dist/components/data-entry/number-input.d.ts +1 -1
  212. package/dist/components/data-entry/password-input.d.ts +38 -2
  213. package/dist/components/data-entry/password-input.js +56 -1
  214. package/dist/components/data-entry/rating.d.ts +38 -2
  215. package/dist/components/data-entry/rating.js +127 -1
  216. package/dist/components/data-entry/segmented.d.ts +94 -2
  217. package/dist/components/data-entry/segmented.js +104 -1
  218. package/dist/components/{ui/tag-input.d.ts → data-entry/select-tags-inline.d.ts} +7 -4
  219. package/dist/components/{ui/tag-input.js → data-entry/select-tags-inline.js} +4 -4
  220. package/dist/components/data-entry/select.js +4 -0
  221. package/dist/components/data-entry/toggle-group.d.ts +108 -2
  222. package/dist/components/data-entry/toggle-group.js +189 -1
  223. package/dist/components/data-entry/toggle.d.ts +86 -2
  224. package/dist/components/data-entry/toggle.js +153 -2
  225. package/dist/components/feedback/alert.d.ts +5 -3
  226. package/dist/components/feedback/alert.js +14 -2
  227. package/dist/components/feedback/index.d.ts +2 -6
  228. package/dist/components/feedback/index.js +1 -13
  229. package/dist/components/feedback/skeleton.d.ts +4 -17
  230. package/dist/components/feedback/skeleton.js +3 -40
  231. package/dist/components/general/index.d.ts +2 -4
  232. package/dist/components/general/index.js +1 -6
  233. package/dist/components/general/typography.d.ts +4 -58
  234. package/dist/components/general/typography.js +7 -141
  235. package/dist/components/layout/aspect-ratio.d.ts +24 -1
  236. package/dist/components/layout/aspect-ratio.js +18 -1
  237. package/dist/components/layout/auth-divider.js +1 -1
  238. package/dist/components/layout/auth-identity.js +6 -2
  239. package/dist/components/layout/centered-shell.d.ts +13 -8
  240. package/dist/components/layout/centered-shell.js +43 -1
  241. package/dist/components/layout/flex.d.ts +1 -1
  242. package/dist/components/layout/flex.js +73 -1
  243. package/dist/components/layout/index.d.ts +1 -13
  244. package/dist/components/layout/index.js +0 -12
  245. package/dist/components/layout/separator.d.ts +25 -2
  246. package/dist/components/layout/separator.js +71 -1
  247. package/dist/components/navigation/{app-setting-toggle.d.ts → app-setting-cycle.d.ts} +3 -4
  248. package/dist/components/navigation/{app-setting-toggle.js → app-setting-cycle.js} +3 -3
  249. package/dist/components/navigation/app-setting-picker.d.ts +6 -2
  250. package/dist/components/navigation/app-setting-picker.js +20 -2
  251. package/dist/components/navigation/index.d.ts +3 -11
  252. package/dist/components/navigation/index.js +1 -9
  253. package/dist/components/navigation/tabs.js +1 -1
  254. package/dist/components/ui/carousel.d.ts +1 -1
  255. package/dist/components/ui/carousel.js +1 -1
  256. package/dist/components/ui/index.d.ts +11 -5
  257. package/dist/components/ui/index.js +5 -5
  258. package/dist/contracts/measurement.json +2 -2
  259. package/dist/email/brand-mark.d.ts +3 -2
  260. package/dist/email/brand-mark.js +1 -1
  261. package/dist/email/tokens.generated.d.ts +6 -6
  262. package/dist/email/tokens.generated.js +6 -6
  263. package/dist/i18n/locale-tags.d.ts +25 -0
  264. package/dist/i18n/locale-tags.js +59 -0
  265. package/dist/i18n/translate.d.ts +20 -3
  266. package/dist/i18n/translate.js +25 -14
  267. package/dist/i18n/use-translation.d.ts +3 -3
  268. package/dist/i18n/use-translation.js +4 -2
  269. package/dist/{components/navigation → lab}/anchor.d.ts +2 -2
  270. package/dist/{components/navigation → lab}/anchor.js +5 -5
  271. package/dist/{components/data-display → lab}/carousel.js +2 -2
  272. package/dist/{components/layout → lab}/draggable-panel.d.ts +8 -8
  273. package/dist/{components/layout → lab}/draggable-panel.js +2 -2
  274. package/dist/{components/data-entry → lab}/emoji-picker.d.ts +2 -2
  275. package/dist/{components/data-entry → lab}/emoji-picker.js +6 -6
  276. package/dist/{components/general → lab}/float-button.d.ts +8 -8
  277. package/dist/{components/general → lab}/float-button.js +7 -7
  278. package/dist/lab/index.d.ts +39 -0
  279. package/dist/lab/index.js +48 -0
  280. package/dist/{components/layout → lab}/legal-document-shell.d.ts +2 -2
  281. package/dist/{components/layout → lab}/legal-document-shell.js +4 -4
  282. package/dist/{components/data-display → lab}/marquee.d.ts +5 -5
  283. package/dist/{components/data-display → lab}/marquee.js +5 -5
  284. package/dist/{components/layout → lab}/masonry.d.ts +2 -2
  285. package/dist/{components/layout → lab}/masonry.js +3 -3
  286. package/dist/{components/navigation → lab}/mega-menu.d.ts +4 -4
  287. package/dist/{components/navigation → lab}/mega-menu.js +2 -2
  288. package/dist/{components/data-display → lab}/org-chart.d.ts +2 -2
  289. package/dist/{components/data-display → lab}/org-chart.js +4 -4
  290. package/dist/{components/layout → lab}/page-cover.d.ts +2 -2
  291. package/dist/{components/layout → lab}/page-cover.js +2 -2
  292. package/dist/{components/data-display → lab}/range-timeline.d.ts +1 -1
  293. package/dist/{components/data-display → lab}/range-timeline.js +6 -6
  294. package/dist/{components/data-entry → lab}/sortable-list.d.ts +2 -2
  295. package/dist/{components/data-entry → lab}/sortable-list.js +3 -3
  296. package/dist/{components/data-display → lab}/text-diff.d.ts +3 -3
  297. package/dist/{components/data-display → lab}/text-diff.js +4 -4
  298. package/dist/{components/data-display → lab}/timeline-grid.d.ts +2 -2
  299. package/dist/{components/data-display → lab}/timeline-grid.js +1 -1
  300. package/dist/lib/control-styles.js +1 -1
  301. package/dist/lib/datetime/format.js +20 -6
  302. package/dist/lib/datetime/sync.d.ts +6 -2
  303. package/dist/lib/datetime/sync.js +14 -18
  304. package/dist/lib/platform.d.ts +1 -1
  305. package/dist/props/components/app.prop.d.ts +28 -13
  306. package/dist/props/components/data-display.prop.d.ts +19 -29
  307. package/dist/props/components/feedback.prop.d.ts +15 -44
  308. package/dist/props/components/general.prop.d.ts +2 -64
  309. package/dist/props/components/index.d.ts +9 -1
  310. package/dist/props/components/layout.prop.d.ts +41 -57
  311. package/dist/props/registry.d.ts +48 -101
  312. package/dist/props/registry.js +45 -129
  313. package/dist/props/vocabulary/index.d.ts +1 -1
  314. package/dist/props/vocabulary/interaction.prop.d.ts +3 -12
  315. package/dist/styles/alert-layout.css +0 -29
  316. package/dist/styles/data-display-layout.css +14 -22
  317. package/dist/styles/fonts/OFL.txt +93 -0
  318. package/dist/styles/form-layout.css +4 -0
  319. package/dist/styles/index.css +0 -2
  320. package/dist/styles/layers.json +44 -179
  321. package/dist/styles/text-layout.css +0 -15
  322. package/dist/styles.css +2 -0
  323. package/dist/themes/godx.css +43 -0
  324. package/dist/themes/godx.d.ts +13 -0
  325. package/dist/themes/godx.js +12 -0
  326. package/dist/tokens/components/feedback.css +0 -6
  327. package/dist/tokens/derived.css +23 -22
  328. package/dist/tokens/foundation.css +4 -6
  329. package/docs/COMPOSITION-VS-COMPONENT.md +58 -33
  330. package/docs/CONSUMER-RULES.md +1 -1
  331. package/docs/CUSTOMER-THEMING.md +17 -53
  332. package/docs/migrations/v32.md +98 -0
  333. package/package.json +58 -19
  334. package/scripts/_agent-setup.mjs +54 -3
  335. package/scripts/brand-accent.generated.mjs +15 -2
  336. package/scripts/cli.mjs +36 -11
  337. package/scripts/codemod.mjs +522 -0
  338. package/scripts/consumer-rule.md +21 -43
  339. package/scripts/postinstall.mjs +10 -47
  340. package/scripts/prune-css.mjs +1 -1
  341. package/scripts/ui-audit.mjs +5 -2
  342. package/dist/components/data-display/chat-bubble.d.ts +0 -30
  343. package/dist/components/data-display/chat-bubble.js +0 -229
  344. package/dist/components/data-display/hover-card.d.ts +0 -1
  345. package/dist/components/data-display/hover-card.js +0 -7
  346. package/dist/components/data-display/thought-chain.d.ts +0 -42
  347. package/dist/components/data-display/thought-chain.js +0 -177
  348. package/dist/components/data-display/thumbnail.d.ts +0 -37
  349. package/dist/components/data-display/thumbnail.js +0 -20
  350. package/dist/components/data-display/welcome.d.ts +0 -26
  351. package/dist/components/data-display/welcome.js +0 -37
  352. package/dist/components/data-entry/attachments.d.ts +0 -19
  353. package/dist/components/data-entry/attachments.js +0 -366
  354. package/dist/components/data-entry/chat-composer.d.ts +0 -51
  355. package/dist/components/data-entry/chat-composer.js +0 -200
  356. package/dist/components/data-entry/chat-suggestion.d.ts +0 -28
  357. package/dist/components/data-entry/chat-suggestion.js +0 -309
  358. package/dist/components/data-entry/tag-input.d.ts +0 -2
  359. package/dist/components/data-entry/tag-input.js +0 -5
  360. package/dist/components/feedback/banner.d.ts +0 -21
  361. package/dist/components/feedback/banner.js +0 -19
  362. package/dist/components/feedback/callout.d.ts +0 -23
  363. package/dist/components/feedback/callout.js +0 -42
  364. package/dist/components/layout/auth-shell.d.ts +0 -10
  365. package/dist/components/layout/auth-shell.js +0 -42
  366. package/dist/components/layout/space-compact.d.ts +0 -65
  367. package/dist/components/layout/space-compact.js +0 -52
  368. package/dist/components/navigation/conversations.d.ts +0 -39
  369. package/dist/components/navigation/conversations.js +0 -371
  370. package/dist/components/ui/accordion.d.ts +0 -51
  371. package/dist/components/ui/accordion.js +0 -254
  372. package/dist/components/ui/aspect-ratio.d.ts +0 -24
  373. package/dist/components/ui/aspect-ratio.js +0 -21
  374. package/dist/components/ui/avatar.d.ts +0 -16
  375. package/dist/components/ui/avatar.js +0 -115
  376. package/dist/components/ui/credential-reveal.d.ts +0 -9
  377. package/dist/components/ui/credential-reveal.js +0 -160
  378. package/dist/components/ui/hover-card.d.ts +0 -47
  379. package/dist/components/ui/hover-card.js +0 -205
  380. package/dist/components/ui/input-otp.d.ts +0 -48
  381. package/dist/components/ui/input-otp.js +0 -101
  382. package/dist/components/ui/password-input.d.ts +0 -38
  383. package/dist/components/ui/password-input.js +0 -60
  384. package/dist/components/ui/rating.d.ts +0 -38
  385. package/dist/components/ui/rating.js +0 -131
  386. package/dist/components/ui/segmented.d.ts +0 -94
  387. package/dist/components/ui/segmented.js +0 -108
  388. package/dist/components/ui/separator.d.ts +0 -25
  389. package/dist/components/ui/separator.js +0 -74
  390. package/dist/components/ui/toggle-group.d.ts +0 -108
  391. package/dist/components/ui/toggle-group.js +0 -194
  392. package/dist/components/ui/toggle.d.ts +0 -86
  393. package/dist/components/ui/toggle.js +0 -156
  394. package/docs/CANONICAL-CONTRACTS.md +0 -206
  395. package/docs/COMPONENTS.md +0 -163
  396. package/docs/DATETIME.md +0 -78
  397. package/docs/DEVELOPMENT.md +0 -269
  398. package/docs/FRAME-A11Y-CI.md +0 -287
  399. package/docs/FRAME-COVERAGE-LEDGER.md +0 -123
  400. package/docs/FRAME-COVERAGE-REPORT.md +0 -228
  401. package/docs/FRAME-COVERAGE-STANDARD.md +0 -65
  402. package/docs/FRAME-COVERAGE.md +0 -29
  403. package/docs/MEASUREMENT-CONTRACT.md +0 -109
  404. package/docs/PROPS-REGISTRY.md +0 -61
  405. package/docs/PROPS-VOCABULARY.md +0 -100
  406. package/docs/REGISTRY.md +0 -70
  407. package/docs/TESTING.md +0 -107
  408. package/docs/THEME-API-COVERAGE.md +0 -538
  409. package/docs/WHAT-BELONGS-HERE.md +0 -179
  410. package/docs/asset-modules.d.ts +0 -53
  411. package/docs/assets/cover-terrain.svg +0 -6
  412. package/docs/assets/portrait-amber.svg +0 -5
  413. package/docs/assets/portrait-clay.svg +0 -5
  414. package/docs/assets/portrait-indigo.svg +0 -5
  415. package/docs/assets/portrait-iris.svg +0 -5
  416. package/docs/assets/portrait-moss.svg +0 -5
  417. package/docs/assets/portrait-plum.svg +0 -5
  418. package/docs/assets/portrait-slate.svg +0 -5
  419. package/docs/assets/service-mark-rose.svg +0 -6
  420. package/docs/assets/service-mark-teal.svg +0 -5
  421. package/docs/assets/shot-landscape.svg +0 -12
  422. package/docs/assets/shot-portrait.svg +0 -10
  423. package/docs/assets/tcgm/card-1.svg +0 -1
  424. package/docs/assets/tcgm/card-2.svg +0 -1
  425. package/docs/assets/tcgm/card-3.svg +0 -1
  426. package/docs/assets/tcgm/card-4.svg +0 -1
  427. package/docs/assets/tcgm/card-5.svg +0 -1
  428. package/docs/assets/tcgm/card-6.svg +0 -1
  429. package/docs/assets/tcgm/hero-prism.svg +0 -1
  430. package/docs/assets/tcgm/scene-1.svg +0 -1
  431. package/docs/assets/tcgm/scene-2.svg +0 -1
  432. package/docs/assets/tcgm/scene-3.svg +0 -1
  433. package/docs/assets/tcgm/scene-4.svg +0 -1
  434. package/docs/assets/tcgm/scene-5.svg +0 -1
  435. package/docs/assets/tcgm/tcgm-lockup-color.svg +0 -1
  436. package/docs/assets/tcgm/tcgm-symbol-color.svg +0 -1
  437. package/docs/charts/cjk-category-axis.tsx +0 -81
  438. package/docs/charts/compact-bar-trend.tsx +0 -327
  439. package/docs/charts/size-tiers.tsx +0 -192
  440. package/docs/data-display/accordion.tsx +0 -99
  441. package/docs/data-display/avatar.tsx +0 -502
  442. package/docs/data-display/badge.tsx +0 -335
  443. package/docs/data-display/card/examples/detail-panel.tsx +0 -106
  444. package/docs/data-display/card/examples/tab-list.tsx +0 -97
  445. package/docs/data-display/card/index.md +0 -3
  446. package/docs/data-display/card/index.tsx +0 -390
  447. package/docs/data-display/carousel.tsx +0 -160
  448. package/docs/data-display/charts.tsx +0 -278
  449. package/docs/data-display/chat-bubble.tsx +0 -397
  450. package/docs/data-display/code-block.tsx +0 -188
  451. package/docs/data-display/collapsible.tsx +0 -162
  452. package/docs/data-display/credential-reveal.tsx +0 -148
  453. package/docs/data-display/data-table/examples/antd-parity.tsx +0 -257
  454. package/docs/data-display/data-table/examples/approval-queue.tsx +0 -212
  455. package/docs/data-display/data-table/examples/grid-features.tsx +0 -158
  456. package/docs/data-display/data-table/examples/list-page.tsx +0 -175
  457. package/docs/data-display/data-table/examples/selectable-inbox.tsx +0 -113
  458. package/docs/data-display/data-table/examples/server-paged.tsx +0 -179
  459. package/docs/data-display/data-table/examples/striped-list.tsx +0 -173
  460. package/docs/data-display/data-table/index.md +0 -9
  461. package/docs/data-display/data-table/index.tsx +0 -407
  462. package/docs/data-display/descriptions.tsx +0 -263
  463. package/docs/data-display/empty-state.tsx +0 -164
  464. package/docs/data-display/feature-list.tsx +0 -159
  465. package/docs/data-display/hover-card.tsx +0 -181
  466. package/docs/data-display/image.tsx +0 -170
  467. package/docs/data-display/legend.tsx +0 -158
  468. package/docs/data-display/list-row.tsx +0 -441
  469. package/docs/data-display/markdown.tsx +0 -86
  470. package/docs/data-display/marquee.tsx +0 -254
  471. package/docs/data-display/org-chart.tsx +0 -165
  472. package/docs/data-display/permission-matrix.tsx +0 -188
  473. package/docs/data-display/popover-touch.tsx +0 -27
  474. package/docs/data-display/popover.tsx +0 -331
  475. package/docs/data-display/progress.tsx +0 -162
  476. package/docs/data-display/prose.tsx +0 -169
  477. package/docs/data-display/qr-code.tsx +0 -68
  478. package/docs/data-display/scroll-area.tsx +0 -420
  479. package/docs/data-display/service-launcher-card.tsx +0 -445
  480. package/docs/data-display/stat-card.tsx +0 -354
  481. package/docs/data-display/swatch.tsx +0 -107
  482. package/docs/data-display/table.tsx +0 -362
  483. package/docs/data-display/text-diff.tsx +0 -89
  484. package/docs/data-display/thought-chain.tsx +0 -176
  485. package/docs/data-display/thumbnail.tsx +0 -128
  486. package/docs/data-display/timeline-grid.tsx +0 -119
  487. package/docs/data-display/timeline.tsx +0 -671
  488. package/docs/data-display/touch-actions.tsx +0 -36
  489. package/docs/data-display/tree.tsx +0 -724
  490. package/docs/data-display/welcome.tsx +0 -115
  491. package/docs/data-entry/attachments.tsx +0 -160
  492. package/docs/data-entry/block-editor.tsx +0 -105
  493. package/docs/data-entry/branch-scope-picker.tsx +0 -128
  494. package/docs/data-entry/calendar.tsx +0 -226
  495. package/docs/data-entry/cascader.tsx +0 -380
  496. package/docs/data-entry/chat-composer.tsx +0 -619
  497. package/docs/data-entry/chat-suggestion.tsx +0 -301
  498. package/docs/data-entry/checkbox.tsx +0 -256
  499. package/docs/data-entry/color-picker.tsx +0 -189
  500. package/docs/data-entry/command-palette.tsx +0 -179
  501. package/docs/data-entry/command.tsx +0 -341
  502. package/docs/data-entry/country-picker-recipe.tsx +0 -175
  503. package/docs/data-entry/date-picker.tsx +0 -452
  504. package/docs/data-entry/emoji-picker.tsx +0 -35
  505. package/docs/data-entry/form/examples/employee-settings.tsx +0 -267
  506. package/docs/data-entry/form/examples/invoice-form.tsx +0 -387
  507. package/docs/data-entry/form-dynamic-fields.tsx +0 -199
  508. package/docs/data-entry/form-field/examples/a11y-contract.tsx +0 -242
  509. package/docs/data-entry/form-field/examples/create-form.tsx +0 -107
  510. package/docs/data-entry/form-field/index.md +0 -8
  511. package/docs/data-entry/form-field/index.tsx +0 -337
  512. package/docs/data-entry/form-inertia.tsx +0 -80
  513. package/docs/data-entry/form-root.tsx +0 -112
  514. package/docs/data-entry/form.tsx +0 -1498
  515. package/docs/data-entry/input-otp.tsx +0 -258
  516. package/docs/data-entry/input.tsx +0 -796
  517. package/docs/data-entry/label.tsx +0 -102
  518. package/docs/data-entry/markdown-editor.tsx +0 -69
  519. package/docs/data-entry/number-input.tsx +0 -279
  520. package/docs/data-entry/password-input.tsx +0 -102
  521. package/docs/data-entry/password-strength.tsx +0 -99
  522. package/docs/data-entry/radio-group.tsx +0 -316
  523. package/docs/data-entry/rating.tsx +0 -91
  524. package/docs/data-entry/record-picker.tsx +0 -209
  525. package/docs/data-entry/search-input.tsx +0 -121
  526. package/docs/data-entry/segmented-in-filter-row.tsx +0 -60
  527. package/docs/data-entry/segmented.tsx +0 -300
  528. package/docs/data-entry/select-async-contracts.tsx +0 -108
  529. package/docs/data-entry/select-matrix.tsx +0 -209
  530. package/docs/data-entry/select.tsx +0 -547
  531. package/docs/data-entry/slider.tsx +0 -212
  532. package/docs/data-entry/sortable-list.tsx +0 -76
  533. package/docs/data-entry/switch.tsx +0 -314
  534. package/docs/data-entry/tag-input.tsx +0 -145
  535. package/docs/data-entry/textarea.tsx +0 -249
  536. package/docs/data-entry/time-picker.tsx +0 -187
  537. package/docs/data-entry/time-range-picker.tsx +0 -55
  538. package/docs/data-entry/toggle-count.tsx +0 -348
  539. package/docs/data-entry/toggle-group.tsx +0 -438
  540. package/docs/data-entry/toggle.tsx +0 -217
  541. package/docs/data-entry/transfer.tsx +0 -115
  542. package/docs/data-entry/tree-select.tsx +0 -204
  543. package/docs/data-entry/upload-crop-dialog.tsx +0 -109
  544. package/docs/data-entry/upload.tsx +0 -310
  545. package/docs/feedback/alert-dialog.tsx +0 -270
  546. package/docs/feedback/alert.tsx +0 -248
  547. package/docs/feedback/auth-expiry.tsx +0 -104
  548. package/docs/feedback/banner.tsx +0 -183
  549. package/docs/feedback/callout.tsx +0 -220
  550. package/docs/feedback/danger-confirm.tsx +0 -91
  551. package/docs/feedback/dialog-touch.tsx +0 -24
  552. package/docs/feedback/dialog.tsx +0 -373
  553. package/docs/feedback/sheet.tsx +0 -510
  554. package/docs/feedback/skeleton.tsx +0 -168
  555. package/docs/feedback/toast.tsx +0 -135
  556. package/docs/feedback/tooltip.tsx +0 -171
  557. package/docs/feedback/two-factor-setup.tsx +0 -68
  558. package/docs/foundation/_email-specimen.ts +0 -274
  559. package/docs/foundation/_theme-editor-scope.ts +0 -222
  560. package/docs/foundation/colors.tsx +0 -207
  561. package/docs/foundation/density.tsx +0 -242
  562. package/docs/foundation/email-tokens.tsx +0 -323
  563. package/docs/foundation/radius-shadow.tsx +0 -154
  564. package/docs/foundation/spacing.tsx +0 -216
  565. package/docs/foundation/theme-editor.tsx +0 -654
  566. package/docs/foundation/typography.tsx +0 -147
  567. package/docs/general/actions.tsx +0 -175
  568. package/docs/general/activity.tsx +0 -289
  569. package/docs/general/button/examples/destructive-confirm.tsx +0 -90
  570. package/docs/general/button/examples/form-actions.tsx +0 -87
  571. package/docs/general/button/examples/toolbar.tsx +0 -160
  572. package/docs/general/button/index.md +0 -16
  573. package/docs/general/button/index.tsx +0 -236
  574. package/docs/general/float-button.tsx +0 -133
  575. package/docs/general/icon.tsx +0 -217
  576. package/docs/general/logo.tsx +0 -194
  577. package/docs/general/reveal.tsx +0 -309
  578. package/docs/general/typography.tsx +0 -542
  579. package/docs/i18n/messages/en.json +0 -1715
  580. package/docs/i18n/messages/ja.json +0 -1708
  581. package/docs/i18n/messages/vi.json +0 -1708
  582. package/docs/layout/account-chip.tsx +0 -72
  583. package/docs/layout/admin-collection.tsx +0 -122
  584. package/docs/layout/affix.tsx +0 -209
  585. package/docs/layout/app-launcher.tsx +0 -211
  586. package/docs/layout/app-shell-arrangements.tsx +0 -225
  587. package/docs/layout/app-shell-narrow-bar.tsx +0 -205
  588. package/docs/layout/app-shell-states.tsx +0 -171
  589. package/docs/layout/app-shell.tsx +0 -395
  590. package/docs/layout/aspect-ratio.tsx +0 -135
  591. package/docs/layout/auth-account-summary.tsx +0 -103
  592. package/docs/layout/auth-divider.tsx +0 -28
  593. package/docs/layout/auth-footer.tsx +0 -37
  594. package/docs/layout/auth-identity.tsx +0 -70
  595. package/docs/layout/auth-recovery/examples/mfa-challenge.md +0 -41
  596. package/docs/layout/auth-recovery/examples/mfa-challenge.tsx +0 -254
  597. package/docs/layout/auth-recovery/examples/mobile-390.md +0 -25
  598. package/docs/layout/auth-recovery/examples/mobile-390.tsx +0 -82
  599. package/docs/layout/auth-recovery/examples/password-recovery.md +0 -24
  600. package/docs/layout/auth-recovery/examples/password-recovery.tsx +0 -197
  601. package/docs/layout/auth-recovery/examples/wrapping-ja-en-vi.md +0 -27
  602. package/docs/layout/auth-recovery/examples/wrapping-ja-en-vi.tsx +0 -156
  603. package/docs/layout/auth-recovery/index.md +0 -140
  604. package/docs/layout/auth-recovery/index.tsx +0 -96
  605. package/docs/layout/auth-shell-context.tsx +0 -103
  606. package/docs/layout/auth-shell-device.tsx +0 -112
  607. package/docs/layout/auth-shell-registration.tsx +0 -338
  608. package/docs/layout/auth-shell-variants.tsx +0 -143
  609. package/docs/layout/auth-shell.tsx +0 -59
  610. package/docs/layout/auth-stack.tsx +0 -40
  611. package/docs/layout/centered-shell.tsx +0 -102
  612. package/docs/layout/draggable-panel.tsx +0 -127
  613. package/docs/layout/error-surface/examples/application-403.tsx +0 -84
  614. package/docs/layout/error-surface/examples/application-404.tsx +0 -77
  615. package/docs/layout/error-surface/examples/system-500.tsx +0 -47
  616. package/docs/layout/error-surface/examples/system-503.tsx +0 -48
  617. package/docs/layout/error-surface/index.md +0 -153
  618. package/docs/layout/error-surface/index.tsx +0 -239
  619. package/docs/layout/flex.tsx +0 -444
  620. package/docs/layout/legal-document-shell/_data.ts +0 -110
  621. package/docs/layout/legal-document-shell/examples/desktop-1440.md +0 -12
  622. package/docs/layout/legal-document-shell/examples/desktop-1440.tsx +0 -83
  623. package/docs/layout/legal-document-shell/examples/mobile-390.md +0 -22
  624. package/docs/layout/legal-document-shell/examples/mobile-390.tsx +0 -70
  625. package/docs/layout/legal-document-shell/examples/tablet-1024.md +0 -3
  626. package/docs/layout/legal-document-shell/examples/tablet-1024.tsx +0 -84
  627. package/docs/layout/legal-document-shell/examples/wrapping-ja-en-vi.md +0 -18
  628. package/docs/layout/legal-document-shell/examples/wrapping-ja-en-vi.tsx +0 -61
  629. package/docs/layout/legal-document-shell/index.md +0 -51
  630. package/docs/layout/legal-document-shell/index.tsx +0 -101
  631. package/docs/layout/masonry.tsx +0 -291
  632. package/docs/layout/master-detail.tsx +0 -390
  633. package/docs/layout/mobile-shell.tsx +0 -106
  634. package/docs/layout/nav-list.tsx +0 -584
  635. package/docs/layout/org-switcher.tsx +0 -131
  636. package/docs/layout/page-container.tsx +0 -1020
  637. package/docs/layout/page-cover.tsx +0 -56
  638. package/docs/layout/resizable-panel.tsx +0 -419
  639. package/docs/layout/responsive-grid.tsx +0 -403
  640. package/docs/layout/separator.tsx +0 -327
  641. package/docs/layout/service-role-panel.tsx +0 -144
  642. package/docs/layout/sidebar.tsx +0 -689
  643. package/docs/layout/space-compact.tsx +0 -202
  644. package/docs/layout/split-pane.tsx +0 -532
  645. package/docs/layout/topbar-item.tsx +0 -233
  646. package/docs/layout/topbar.tsx +0 -360
  647. package/docs/navigation/anchor.tsx +0 -295
  648. package/docs/navigation/app-setting-picker.tsx +0 -178
  649. package/docs/navigation/app-setting-toggle.tsx +0 -111
  650. package/docs/navigation/breadcrumb.tsx +0 -207
  651. package/docs/navigation/card-tabs.tsx +0 -344
  652. package/docs/navigation/conversations.tsx +0 -176
  653. package/docs/navigation/dropdown-menu.tsx +0 -345
  654. package/docs/navigation/filter-bar.tsx +0 -247
  655. package/docs/navigation/mega-menu-panel.tsx +0 -86
  656. package/docs/navigation/mega-menu.tsx +0 -254
  657. package/docs/navigation/pagination.tsx +0 -293
  658. package/docs/navigation/steps.tsx +0 -315
  659. package/docs/navigation/tabs-rtl.tsx +0 -28
  660. package/docs/navigation/tabs.tsx +0 -755
  661. package/docs/navigation/toolbar.tsx +0 -347
  662. package/docs/providers/app-provider.tsx +0 -191
  663. package/docs/providers/format-date.tsx +0 -230
  664. package/docs/providers/theme-scope.tsx +0 -186
  665. package/docs/query/button-refetch.tsx +0 -161
  666. package/docs/query/data-state.tsx +0 -262
  667. package/docs/query/infinite-query-state.tsx +0 -97
  668. package/docs/query/mutation-feedback.tsx +0 -128
  669. package/docs/query/touch-actions.tsx +0 -68
  670. package/docs/react-router/prefetch-link.tsx +0 -262
  671. package/docs/roadmap/ai-chat-components.md +0 -206
  672. package/docs/roadmap/antd-parity.md +0 -155
  673. package/docs/roadmap/badge-tag-chip-count.md +0 -172
  674. package/docs/roadmap/list-masonry.md +0 -159
  675. package/docs/roadmap/parity-audit-data-display-feedback.md +0 -567
  676. package/docs/roadmap/parity-audit-data-entry.md +0 -368
  677. package/docs/roadmap/parity-audit-layout-navigation-general.md +0 -459
  678. package/docs/roadmap/parity-backlog.md +0 -77
  679. package/docs/roadmap/tree-components.md +0 -151
  680. package/docs/roadmap/website-components.md +0 -813
  681. package/docs/showcase/acme-portal.tsx +0 -461
  682. package/docs/showcase/acme-website.tsx +0 -499
  683. package/docs/showcase/caimono-price-comparison.tsx +0 -919
  684. package/docs/showcase/case1-warehouse-dashboard.tsx +0 -358
  685. package/docs/showcase/case2-employee-me.tsx +0 -438
  686. package/docs/showcase/case3-approval-workflow.tsx +0 -531
  687. package/docs/showcase/case4-login.tsx +0 -312
  688. package/docs/showcase/case5-shift-calendar.tsx +0 -702
  689. package/docs/showcase/case6-agency-handy.tsx +0 -1120
  690. package/docs/showcase/futurelastic-web.tsx +0 -441
  691. package/docs/showcase/marketing-page.tsx +0 -895
  692. package/docs/showcase/org-switcher.tsx +0 -320
  693. package/docs/showcase/permission-matrix.tsx +0 -354
  694. package/docs/showcase/public-landing.tsx +0 -210
  695. package/docs/showcase/settings-account-sections.tsx +0 -559
  696. package/docs/showcase/settings-security-mfa.tsx +0 -145
  697. package/docs/showcase/table-approval-queue.tsx +0 -199
  698. package/docs/showcase/table-bulk-actions.tsx +0 -468
  699. package/docs/showcase/table-compact-kintone.tsx +0 -438
  700. package/docs/showcase/table-conditional-format.tsx +0 -367
  701. package/docs/showcase/table-crud-list.tsx +0 -544
  702. package/docs/showcase/table-density.tsx +0 -349
  703. package/docs/showcase/table-expandable-rows.tsx +0 -496
  704. package/docs/showcase/table-filter-chips.tsx +0 -468
  705. package/docs/showcase/table-footer-totals.tsx +0 -328
  706. package/docs/showcase/table-grouped-subtotals.tsx +0 -398
  707. package/docs/showcase/table-master-detail.tsx +0 -482
  708. package/docs/showcase/table-pagination.tsx +0 -409
  709. package/docs/showcase/table-states.tsx +0 -371
  710. package/docs/showcase/table-sticky-columns.tsx +0 -377
  711. package/docs/showcase/table-tree-rows.tsx +0 -451
  712. package/docs/showcase/table-view-tabs.tsx +0 -488
  713. package/docs/showcase/tcgm-website.tsx +0 -1047
  714. package/docs/showcase/tenant-brand-color.tsx +0 -338
  715. package/docs/showcase/theme-customization.tsx +0 -1292
  716. package/docs/showcase/theme-lab.tsx +0 -2125
  717. package/docs/themes/flat.css +0 -466
  718. package/docs/themes/glassmorphism.css +0 -960
  719. package/docs/themes/index.ts +0 -219
  720. package/docs/themes/neubrutalism.css +0 -481
  721. /package/dist/components/navigation/{filter-bar.d.ts → toolbar.d.ts} +0 -0
  722. /package/dist/components/navigation/{filter-bar.js → toolbar.js} +0 -0
  723. /package/dist/{components/data-display → lab}/carousel.d.ts +0 -0
  724. /package/dist/{components/data-entry → lab}/emoji-data.d.ts +0 -0
  725. /package/dist/{components/data-entry → lab}/emoji-data.js +0 -0
  726. /package/dist/{components/data-display → lab}/marquee-reveal.d.ts +0 -0
  727. /package/dist/{components/data-display → lab}/marquee-reveal.js +0 -0
@@ -1,179 +0,0 @@
1
- # Cái gì đáng đưa vào @godxjp/ui
2
-
3
- Một design system hỏng theo hai hướng ngược nhau, và cả hai đều hỏng thật:
4
-
5
- - **Quá hẹp** — thiếu prop, nên consumer buộc phải lách bằng class hoặc mã màu
6
- gõ tay. Đây là hướng đang hỏng: một lượt kiểm trên godx-chat (08/09/2026) ra
7
- **51 lỗi, 42 trong đó đến từ ĐÚNG MỘT prop còn thiếu** (đệm trên primitive bố
8
- cục).
9
- - **Quá rộng** — nhận mọi yêu cầu, thành một đống prop không ai nhớ, và mỗi
10
- prop là một mảnh DOM nội bộ bị đóng băng thành API công khai.
11
-
12
- Tài liệu này là bộ lọc giữa hai hướng đó. Nó cố tình viết thành câu hỏi **trả
13
- lời được bằng có/không**, không phải nguyên tắc để cảm nhận.
14
-
15
- ---
16
-
17
- ## Ba câu hỏi — phải ĐỦ CẢ BA
18
-
19
- ### 1. Có phải consumer KHÔNG CÓ nước đi hợp lệ nào không?
20
-
21
- Không phải "bất tiện". Là **bất khả**: mọi prop và token đang có đều không nói
22
- được điều cần nói, và mọi đường còn lại đều bị `ui-audit` chặn.
23
-
24
- - ✅ Thiết kế cần 12px giữa hai phần tử trên một HÀNG. Thang bậc tên đọc trục
25
- dọc nên `md` = 16px; làm tròn thì lệch bố cục; viết `gap: 12px` thì
26
- `no-arbitrary-spacing` chặn. **Không có nước đi.** → gh#401, đã vá.
27
- - ❌ "Viết `<Flex gap={3}>` dài hơn `gap-3`." Có nước đi, chỉ là dài hơn.
28
-
29
- Cách kiểm: viết ra đoạn mã bạn _muốn_ viết, chạy `ui-audit` lên nó. Nếu nó
30
- xanh, bạn đã có nước đi.
31
-
32
- ### 2. Nó thuộc về HÌNH DẠNG của component, hay thuộc về NỘI DUNG của một màn?
33
-
34
- Design system sở hữu hình dạng. Màn hình sở hữu nội dung.
35
-
36
- - ✅ `Flex` không có đệm. Mọi hàng/cột trong mọi ứng dụng đều có thể cần đệm.
37
- - ✅ `TableHead` không có trục căn lề. Mọi bảng có cột số đều cần.
38
- - ❌ "Bảng quản trị thành viên cần cột vai trò rộng 8rem." Đó là màn hình ấy.
39
- - ❌ "Dashboard cần bốn thẻ chỉ số xếp ngang." Đó là bố cục của một trang.
40
-
41
- Câu hỏi phụ khi phân vân: **consumer thứ hai có gặp không?** Nếu câu trả lời là
42
- "chắc là không" thì gần như luôn là nội dung, không phải hình dạng.
43
-
44
- ### 3. Diễn đạt được thành một TRỤC CÓ TÊN không?
45
-
46
- Một prop phải gọi được **ý định**, không chỉ mở một lỗ.
47
-
48
- - ✅ `pad={{ blockStart: 3 }}` — trục logic, bậc thang, đọc ra nghĩa.
49
- - ❌ `styles={{ body: {...}, header: {...} }}` — không phải một trục; nó là một
50
- lỗ tự do, và nó đóng băng tên khe DOM nội bộ thành API công khai. Xem mục
51
- "Không đáng" bên dưới.
52
-
53
- ---
54
-
55
- ## Bốn dấu hiệu MẠNH — một cái là đủ để ưu tiên làm ngay
56
-
57
- Ba câu trên quyết định _có thuộc về đây không_. Bốn dấu hiệu này quyết định
58
- _làm trước hay sau_.
59
-
60
- ### a. Nó chặn một yêu cầu TIẾP CẬN
61
-
62
- Không thương lượng, làm trước.
63
- Ví dụ đã gặp: vòng tiêu điểm của Input là 1px (hạ xuống có chủ ý), không
64
- đạt WCAG 2.4.11 vốn đòi vùng chỉ báo tương đương đường 2px. Và `FormRoot` không
65
- có móc `onInvalid`, nên không đưa được tiêu điểm về trường lỗi đầu tiên — WCAG
66
- 3.3.1 / 2.4.3.
67
-
68
- ### b. Nó hỏng IM LẶNG
69
-
70
- Không lỗi biên dịch, không test đỏ, không cảnh báo — chỉ sai.
71
- Ví dụ đã gặp: `AppShell` nhận cả `logo` lẫn `topbar` nhưng `resolvedTopbar` trả
72
- thẳng `topbar`, nên `logo` **không bao giờ được vẽ**. godx-chat truyền cả hai
73
- suốt nhiều tháng và không ai phát hiện.
74
-
75
- Lớp lỗi này đắt gấp nhiều lần lớp lỗi ồn ào, vì nó không có ai báo.
76
-
77
- ### c. Đếm được
78
-
79
- Một khoảng trống đẻ ra N lỗi audit là một khoảng trống có số đo, không phải một
80
- ý kiến. 42 lỗi từ một prop thiếu là một ưu tiên; một lỗi từ một prop thiếu thì
81
- chưa chắc.
82
-
83
- ### d. Nó BẤT ĐỐI XỨNG với thứ đã có
84
-
85
- Nếu trục dọc có `xl` mà trục ngang không có, khoảng trống ấy gần như luôn là
86
- **quên**, không phải quyết định. Sửa cho cân là rẻ và không tranh cãi.
87
-
88
- ---
89
-
90
- ## Cái KHÔNG đáng vào — và vì sao
91
-
92
- **Bố cục của một màn hình cụ thể.** Nó thuộc về màn hình đó. Nếu ba màn cùng
93
- cần, lúc ấy nó đã thành hình dạng và quay lại câu hỏi 2.
94
-
95
- **Một giá trị dùng đúng một lần.** Đừng đẻ prop cho nó — dùng cửa thoát
96
- (`gapRaw`, `padRaw`). Cửa thoát để lại `data-*-raw` trên DOM nên đếm được; khi
97
- số đếm ấy lớn lên, ĐÓ mới là lúc nó thành một trục đáng có tên.
98
-
99
- **Lỗ kiểu dáng tự do** (`styles={{ slot }}`, `classNames={{ slot }}`). Nó đóng
100
- băng cấu trúc DOM nội bộ thành API công khai, và audit **không đếm được** nó
101
- (một object style dựng ở đâu cũng được rồi spread vào). Nó cũng ngược hẳn với
102
- `style: 0/289` — lập trường nhất quán hiện nay là cho prop ý định, không cho lỗ
103
- kiểu dáng.
104
-
105
- **Gu thẩm mỹ.** "Dùng nhiều khoảng trắng", "hai màu nhấn là đủ", "tránh lưới
106
- bento". Không kiểm chứng được, không cổng nào canh, và khi nó tới tay agent
107
- TRƯỚC luật cứng thì kết quả là mã đẹp mà sai hợp đồng.
108
-
109
- **Thứ chỉ tiết kiệm vài dòng ở call site.** Nếu đường hiện tại đã hợp lệ và
110
- đọc được, việc rút ngắn nó không phải việc của design system.
111
-
112
- ---
113
-
114
- ## Thêm rồi thì NỢ gì
115
-
116
- Một prop mới chưa xong khi nó biên dịch được. Ba việc bắt buộc, và cả ba đều đã
117
- có cổng CI:
118
-
119
- 1. **Vào catalog.** Chạy `node scripts/gen-component-api-manifest.mjs`.
120
- `check:component-api-manifest` canh việc này. **Không vào catalog thì agent
121
- không biết nó tồn tại** — và đó không phải giả thuyết: `pad`/`padRaw` được
122
- thêm vào gói nhưng catalog phát hành chưa có, nên một agent tra MCP đúng quy
123
- trình vẫn kết luận "Flex chỉ có gap" và bỏ cuộc trước 21 lỗi mà nó có thể
124
- sửa.
125
-
126
- 2. **Có bằng chứng phủ từng nhánh giá trị.** `component-case-evidence.json` +
127
- `check:frame-coverage-ledger`. Bằng chứng phải trỏ vào test THẬT SỰ chạy qua
128
- nhánh ấy, không phải một tệp cho có.
129
-
130
- 3. **Có ví dụ BIÊN DỊCH ĐƯỢC.** Hậu quả đo được khi không kiểm: pattern
131
- `confirm-destructive` truyền cho `Dialog` một prop `mode` không tồn tại,
132
- hướng dẫn DataTable dùng `variant="success"` (chính thứ luật
133
- `status-tone-not-variant` cấm), và ví dụ `Input` gọi một prop
134
- `onValueChange` không có thật. Agent chép chúng và viết ra mã hỏng.
135
-
136
- Ba chỗ ấy đã sửa, và `check:doc-prop-existence` nay bắt được lớp lỗi đó.
137
- Lưu ý khi viết tài liệu: cổng ấy đọc mọi đoạn JSX trong `docs/**` như mã
138
- THẬT, nên **trích dẫn một API sai để làm ví dụ cũng bị bắt**. Mô tả bằng lời
139
- như đoạn trên, đừng dán một thẻ JSX hoàn chỉnh vào.
140
-
141
- ---
142
-
143
- ## Một lợi ích ẩn của việc rời Radix, đo được
144
-
145
- `check:doc-prop-existence` canh chiều "mọi prop dùng trong ví dụ đều phải tồn
146
- tại" — chính lớp lỗi khiến agent chép ví dụ rồi viết ra mã hỏng (prop `mode`
147
- trên `Dialog`, prop `onValueChange` trên `Input`). Nhưng nó **bỏ qua mọi
148
- component bọc primitive bên thứ ba**, vì với chúng manifest chỉ là cận dưới:
149
- prop thật nằm trong types của Radix, generator không mở ra được.
150
-
151
- Số đo (08/09/2026):
152
-
153
- | | component KHÔNG kiểm được |
154
- | --------------------------------------------- | ------------------------- |
155
- | `main` | **139 / 289** |
156
- | `feat/v20-react-aria` (6 primitive đã chuyển) | **126 / 289** |
157
-
158
- Mỗi primitive rời Radix là `declaredIn` chuyển từ `node_modules` vào `src/`, và
159
- component đó **bước vào vùng kiểm được**. Sáu primitive đầu đã gỡ rào cho 13
160
- component.
161
-
162
- Nên đợt đổi nền không chỉ là thay thư viện. Nó là cách duy nhất làm cho 126
163
- component còn lại có thể được canh — và trong số đó có `Dialog`, `Input`,
164
- `Badge`, tức đúng những component mà ví dụ sai đã lọt qua.
165
-
166
- ## Khi câu trả lời là "không thuộc về đây"
167
-
168
- Nói ra ở chỗ gặp nó, bằng mã:
169
-
170
- ```tsx
171
- /*
172
- * KHÔNG thuộc về design system: bề rộng này là số đo của riêng màn hình
173
- * quản trị thành viên, không phải một trục của Table. Nếu màn thứ hai cần
174
- * cùng thứ, lúc đó mở issue.
175
- */
176
- ```
177
-
178
- Một dòng như thế đáng giá hơn một issue mở rồi bỏ đấy — nó nói cho người sau
179
- biết ai đã cân nhắc, và cân nhắc ra sao.
@@ -1,53 +0,0 @@
1
- /**
2
- * Static-asset imports for the docs pages.
3
- *
4
- * `tsconfig.json` pins `"types": ["node"]`, so `vite/client` — which normally declares these — is
5
- * never loaded, and `tsconfig.docs.json` inherits that. Without this file `import cover from
6
- * "../assets/cover-terrain.svg"` is a TS2307 even though Vite resolves it perfectly at build time,
7
- * which is exactly how it passed locally and failed `typecheck:docs` in CI.
8
- *
9
- * Narrowed to the formats actually committed under `docs/assets`, and kept in step with
10
- * ASSET_EXTENSIONS in `scripts/check-example-imports.mjs`, which decides the same question for the
11
- * import guard.
12
- */
13
- declare module "*.svg" {
14
- const src: string;
15
- export default src;
16
- }
17
-
18
- declare module "*.png" {
19
- const src: string;
20
- export default src;
21
- }
22
-
23
- declare module "*.jpg" {
24
- const src: string;
25
- export default src;
26
- }
27
-
28
- declare module "*.jpeg" {
29
- const src: string;
30
- export default src;
31
- }
32
-
33
- declare module "*.webp" {
34
- const src: string;
35
- export default src;
36
- }
37
-
38
- declare module "*.avif" {
39
- const src: string;
40
- export default src;
41
- }
42
-
43
- declare module "*.gif" {
44
- const src: string;
45
- export default src;
46
- }
47
-
48
- /**
49
- * A docs-owned theme stylesheet, imported for its side effect (e.g. `docs/themes/*.css`) —
50
- * exactly like `preview/src/*.css`. There is nothing to type; the import exists only so the
51
- * bundler includes the file.
52
- */
53
- declare module "*.css";
@@ -1,6 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="480" height="270" viewBox="0 0 480 270" role="img">
2
- <rect width="480" height="270" fill="hsl(208 38% 66%)"/>
3
- <circle cx="355" cy="81" r="38" fill="hsl(208 38% 84%)"/>
4
- <path d="M0 270 L163 113 L288 270 Z" fill="hsl(208 38% 50%)"/>
5
- <path d="M192 270 L346 151 L480 270 Z" fill="hsl(208 38% 58%)"/>
6
- </svg>
@@ -1,5 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 96 96" role="img">
2
- <rect width="96" height="96" fill="hsl(41 42% 62%)"/>
3
- <circle cx="48" cy="40.32" r="19.200000000000003" fill="hsl(41 42% 82%)"/>
4
- <path d="M21.12 96 a26.880000000000003 32.64 0 0 1 53.760000000000005 0 z" fill="hsl(41 42% 82%)"/>
5
- </svg>
@@ -1,5 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 96 96" role="img">
2
- <rect width="96" height="96" fill="hsl(12 42% 62%)"/>
3
- <circle cx="48" cy="40.32" r="19.200000000000003" fill="hsl(12 42% 82%)"/>
4
- <path d="M21.12 96 a26.880000000000003 32.64 0 0 1 53.760000000000005 0 z" fill="hsl(12 42% 82%)"/>
5
- </svg>
@@ -1,5 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 96 96" role="img">
2
- <rect width="96" height="96" fill="hsl(224 42% 62%)"/>
3
- <circle cx="48" cy="40.32" r="19.200000000000003" fill="hsl(224 42% 82%)"/>
4
- <path d="M21.12 96 a26.880000000000003 32.64 0 0 1 53.760000000000005 0 z" fill="hsl(224 42% 82%)"/>
5
- </svg>
@@ -1,5 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 96 96" role="img">
2
- <rect width="96" height="96" fill="hsl(264 42% 62%)"/>
3
- <circle cx="48" cy="40.32" r="19.200000000000003" fill="hsl(264 42% 82%)"/>
4
- <path d="M21.12 96 a26.880000000000003 32.64 0 0 1 53.760000000000005 0 z" fill="hsl(264 42% 82%)"/>
5
- </svg>
@@ -1,5 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 96 96" role="img">
2
- <rect width="96" height="96" fill="hsl(152 42% 62%)"/>
3
- <circle cx="48" cy="40.32" r="19.200000000000003" fill="hsl(152 42% 82%)"/>
4
- <path d="M21.12 96 a26.880000000000003 32.64 0 0 1 53.760000000000005 0 z" fill="hsl(152 42% 82%)"/>
5
- </svg>
@@ -1,5 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 96 96" role="img">
2
- <rect width="96" height="96" fill="hsl(340 42% 62%)"/>
3
- <circle cx="48" cy="40.32" r="19.200000000000003" fill="hsl(340 42% 82%)"/>
4
- <path d="M21.12 96 a26.880000000000003 32.64 0 0 1 53.760000000000005 0 z" fill="hsl(340 42% 82%)"/>
5
- </svg>
@@ -1,5 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" viewBox="0 0 96 96" role="img">
2
- <rect width="96" height="96" fill="hsl(212 42% 62%)"/>
3
- <circle cx="48" cy="40.32" r="19.200000000000003" fill="hsl(212 42% 82%)"/>
4
- <path d="M21.12 96 a26.880000000000003 32.64 0 0 1 53.760000000000005 0 z" fill="hsl(212 42% 82%)"/>
5
- </svg>
@@ -1,6 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="240" height="96" viewBox="0 0 240 96" role="img">
2
- <rect width="240" height="96" rx="12" fill="hsl(348 32% 42%)"/>
3
- <rect x="24" y="30" width="36" height="36" rx="8" fill="hsl(348 32% 88%)"/>
4
- <rect x="76" y="36" width="140" height="10" rx="5" fill="hsl(348 32% 88%)"/>
5
- <rect x="76" y="54" width="96" height="10" rx="5" fill="hsl(348 32% 74%)"/>
6
- </svg>
@@ -1,5 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128" role="img">
2
- <rect width="128" height="128" rx="28" fill="hsl(178 38% 34%)"/>
3
- <path d="M40 78 L64 34 L88 78 Z" fill="hsl(178 38% 88%)"/>
4
- <circle cx="64" cy="90" r="9" fill="hsl(178 38% 88%)"/>
5
- </svg>
@@ -1,12 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="960" height="540" viewBox="0 0 960 540" role="img">
2
- <rect width="960" height="540" fill="hsl(210 20% 97%)"/>
3
- <rect width="960" height="56" fill="hsl(152 34% 38%)"/>
4
- <rect x="24" y="22" width="140" height="12" rx="6" fill="hsl(152 34% 80%)"/>
5
- <rect y="56" width="216" height="484" fill="hsl(210 16% 92%)"/>
6
- <rect x="24" y="92" width="160" height="10" rx="5" fill="hsl(210 12% 76%)"/>
7
- <rect x="24" y="124" width="160" height="10" rx="5" fill="hsl(210 12% 82%)"/>
8
- <rect x="24" y="156" width="160" height="10" rx="5" fill="hsl(210 12% 82%)"/>
9
- <rect x="248" y="92" width="320" height="160" rx="12" fill="hsl(210 16% 88%)"/>
10
- <rect x="592" y="92" width="320" height="160" rx="12" fill="hsl(210 16% 88%)"/>
11
- <rect x="248" y="284" width="664" height="212" rx="12" fill="hsl(210 16% 90%)"/>
12
- </svg>
@@ -1,10 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="360" height="640" viewBox="0 0 360 640" role="img">
2
- <rect width="360" height="640" fill="hsl(210 20% 97%)"/>
3
- <rect width="360" height="72" fill="hsl(204 60% 46%)"/>
4
- <rect x="20" y="30" width="120" height="12" rx="6" fill="hsl(204 60% 82%)"/>
5
- <rect x="20" y="104" width="320" height="120" rx="10" fill="hsl(210 16% 88%)"/>
6
- <rect x="20" y="248" width="320" height="64" rx="10" fill="hsl(210 16% 90%)"/>
7
- <rect x="20" y="336" width="320" height="64" rx="10" fill="hsl(210 16% 90%)"/>
8
- <rect x="20" y="424" width="320" height="64" rx="10" fill="hsl(210 16% 90%)"/>
9
- <rect x="20" y="540" width="320" height="44" rx="10" fill="hsl(204 60% 46%)"/>
10
- </svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Fictional TCG-M demo card; no real game affiliation</title><defs><linearGradient id="s0" x2="0" y2="1"><stop stop-color="#DFF3FF"/><stop offset="1" stop-color="#BDCAFB"/></linearGradient><linearGradient id="r0" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" rx="38" fill="#FFFFFF"/><g transform="translate(22 22) scale(.93)"><rect width="630" height="880" fill="url(#s0)"/><circle cx="410" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#486F95" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#486F95"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#0F4C5C"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r0)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></g><rect x="36" y="672" width="558" height="170" rx="20" fill="#FFFFFF" fill-opacity=".94"/><text x="60" y="718" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="22" letter-spacing="4">TCG-M / SAMPLE</text><text x="60" y="775" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="36" font-weight="700">PRISM WORLD 01</text><text x="60" y="815" fill="#526A73" font-family="Arial,sans-serif" font-size="20">FICTIONAL DESIGN ASSET</text></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Fictional TCG-M demo card; no real game affiliation</title><defs><linearGradient id="s1" x2="0" y2="1"><stop stop-color="#FFF2E7"/><stop offset="1" stop-color="#FFCED1"/></linearGradient><linearGradient id="r1" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" rx="38" fill="#FFFFFF"/><g transform="translate(22 22) scale(.93)"><rect width="630" height="880" fill="url(#s1)"/><circle cx="391" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#AA7BA9" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#AA7BA9"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#625582"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r1)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></g><rect x="36" y="672" width="558" height="170" rx="20" fill="#FFFFFF" fill-opacity=".94"/><text x="60" y="718" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="22" letter-spacing="4">TCG-M / SAMPLE</text><text x="60" y="775" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="36" font-weight="700">PRISM WORLD 02</text><text x="60" y="815" fill="#526A73" font-family="Arial,sans-serif" font-size="20">FICTIONAL DESIGN ASSET</text></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Fictional TCG-M demo card; no real game affiliation</title><defs><linearGradient id="s2" x2="0" y2="1"><stop stop-color="#E5F6F0"/><stop offset="1" stop-color="#BDE7E5"/></linearGradient><linearGradient id="r2" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" rx="38" fill="#FFFFFF"/><g transform="translate(22 22) scale(.93)"><rect width="630" height="880" fill="url(#s2)"/><circle cx="372" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#65AAA7" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#65AAA7"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#326B71"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r2)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></g><rect x="36" y="672" width="558" height="170" rx="20" fill="#FFFFFF" fill-opacity=".94"/><text x="60" y="718" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="22" letter-spacing="4">TCG-M / SAMPLE</text><text x="60" y="775" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="36" font-weight="700">PRISM WORLD 03</text><text x="60" y="815" fill="#526A73" font-family="Arial,sans-serif" font-size="20">FICTIONAL DESIGN ASSET</text></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Fictional TCG-M demo card; no real game affiliation</title><defs><linearGradient id="s3" x2="0" y2="1"><stop stop-color="#F2EAFF"/><stop offset="1" stop-color="#DCC4FD"/></linearGradient><linearGradient id="r3" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" rx="38" fill="#FFFFFF"/><g transform="translate(22 22) scale(.93)"><rect width="630" height="880" fill="url(#s3)"/><circle cx="353" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#9784C7" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#9784C7"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#57578D"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r3)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></g><rect x="36" y="672" width="558" height="170" rx="20" fill="#FFFFFF" fill-opacity=".94"/><text x="60" y="718" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="22" letter-spacing="4">TCG-M / SAMPLE</text><text x="60" y="775" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="36" font-weight="700">PRISM WORLD 04</text><text x="60" y="815" fill="#526A73" font-family="Arial,sans-serif" font-size="20">FICTIONAL DESIGN ASSET</text></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Fictional TCG-M demo card; no real game affiliation</title><defs><linearGradient id="s4" x2="0" y2="1"><stop stop-color="#FFF3CF"/><stop offset="1" stop-color="#F4D7BE"/></linearGradient><linearGradient id="r4" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" rx="38" fill="#FFFFFF"/><g transform="translate(22 22) scale(.93)"><rect width="630" height="880" fill="url(#s4)"/><circle cx="334" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#B89599" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#B89599"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#6E6883"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r4)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></g><rect x="36" y="672" width="558" height="170" rx="20" fill="#FFFFFF" fill-opacity=".94"/><text x="60" y="718" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="22" letter-spacing="4">TCG-M / SAMPLE</text><text x="60" y="775" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="36" font-weight="700">PRISM WORLD 05</text><text x="60" y="815" fill="#526A73" font-family="Arial,sans-serif" font-size="20">FICTIONAL DESIGN ASSET</text></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Fictional TCG-M demo card; no real game affiliation</title><defs><linearGradient id="s5" x2="0" y2="1"><stop stop-color="#E2EAFB"/><stop offset="1" stop-color="#B9D7ED"/></linearGradient><linearGradient id="r5" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" rx="38" fill="#FFFFFF"/><g transform="translate(22 22) scale(.93)"><rect width="630" height="880" fill="url(#s5)"/><circle cx="315" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#597FAE" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#597FAE"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#214D75"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r5)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></g><rect x="36" y="672" width="558" height="170" rx="20" fill="#FFFFFF" fill-opacity=".94"/><text x="60" y="718" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="22" letter-spacing="4">TCG-M / SAMPLE</text><text x="60" y="775" fill="#0F4C5C" font-family="Arial,sans-serif" font-size="36" font-weight="700">PRISM WORLD 06</text><text x="60" y="815" fill="#526A73" font-family="Arial,sans-serif" font-size="20">FICTIONAL DESIGN ASSET</text></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="1200" height="760" viewBox="0 0 1200 760" role="img"><title>Layered Prism original decorative atmosphere</title><defs></defs><rect width="1200" height="760" fill="#F8FAFC"/><ellipse cx="900" cy="170" rx="560" ry="420" fill="#EAF7FF"/><ellipse cx="500" cy="790" rx="660" ry="380" fill="#F2EEFF"/><ellipse cx="1080" cy="650" rx="360" ry="310" fill="#FFF0EF"/><g transform="translate(390 150) rotate(-19 102.5 147.5)"><rect x="-8" y="-8" width="221" height="311" rx="20" fill="white"/><svg width="205" height="295" viewBox="0 0 630 880"><defs><linearGradient id="s1" x2="0" y2="1"><stop stop-color="#FFF2E7"/><stop offset="1" stop-color="#FFCED1"/></linearGradient><linearGradient id="r1" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" fill="url(#s1)"/><circle cx="391" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#AA7BA9" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#AA7BA9"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#625582"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r1)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></svg></g><g transform="translate(640 110) rotate(11 132.5 190.0)"><rect x="-8" y="-8" width="281" height="396" rx="20" fill="white"/><svg width="265" height="380" viewBox="0 0 630 880"><defs><linearGradient id="s3" x2="0" y2="1"><stop stop-color="#F2EAFF"/><stop offset="1" stop-color="#DCC4FD"/></linearGradient><linearGradient id="r3" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" fill="url(#s3)"/><circle cx="353" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#9784C7" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#9784C7"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#57578D"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r3)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></svg></g><g transform="translate(850 325) rotate(24 102.5 147.5)"><rect x="-8" y="-8" width="221" height="311" rx="20" fill="white"/><svg width="205" height="295" viewBox="0 0 630 880"><defs><linearGradient id="s2" x2="0" y2="1"><stop stop-color="#E5F6F0"/><stop offset="1" stop-color="#BDE7E5"/></linearGradient><linearGradient id="r2" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" fill="url(#s2)"/><circle cx="372" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#65AAA7" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#65AAA7"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#326B71"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r2)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></svg></g><g stroke="#0F4C5C" stroke-opacity=".12" fill="none"><ellipse cx="740" cy="410" rx="420" ry="190" transform="rotate(-18 740 410)"/></g><path fill="#A78BFA" d="M350 416Q352 438 374 440Q352 442 350 464Q348 442 326 440Q348 438 350 416Z"/><path fill="#FF7B7B" d="M950 113Q952 138 977 140Q952 142 950 167Q948 142 923 140Q948 138 950 113Z"/><path fill="#38B6FF" d="M540 52Q542 68 558 70Q542 72 540 88Q538 72 522 70Q538 68 540 52Z"/></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Original abstract landscape 1; not an actual game card</title><defs><linearGradient id="s0" x2="0" y2="1"><stop stop-color="#DFF3FF"/><stop offset="1" stop-color="#BDCAFB"/></linearGradient><linearGradient id="r0" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" fill="url(#s0)"/><circle cx="410" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#486F95" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#486F95"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#0F4C5C"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r0)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Original abstract landscape 2; not an actual game card</title><defs><linearGradient id="s1" x2="0" y2="1"><stop stop-color="#FFF2E7"/><stop offset="1" stop-color="#FFCED1"/></linearGradient><linearGradient id="r1" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" fill="url(#s1)"/><circle cx="391" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#AA7BA9" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#AA7BA9"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#625582"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r1)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Original abstract landscape 3; not an actual game card</title><defs><linearGradient id="s2" x2="0" y2="1"><stop stop-color="#E5F6F0"/><stop offset="1" stop-color="#BDE7E5"/></linearGradient><linearGradient id="r2" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" fill="url(#s2)"/><circle cx="372" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#65AAA7" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#65AAA7"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#326B71"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r2)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Original abstract landscape 4; not an actual game card</title><defs><linearGradient id="s3" x2="0" y2="1"><stop stop-color="#F2EAFF"/><stop offset="1" stop-color="#DCC4FD"/></linearGradient><linearGradient id="r3" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" fill="url(#s3)"/><circle cx="353" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#9784C7" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#9784C7"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#57578D"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r3)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="630" height="880" viewBox="0 0 630 880" role="img"><title>Original abstract landscape 5; not an actual game card</title><defs><linearGradient id="s4" x2="0" y2="1"><stop stop-color="#FFF3CF"/><stop offset="1" stop-color="#F4D7BE"/></linearGradient><linearGradient id="r4" x2="0" y2="1"><stop stop-color="white" stop-opacity=".85"/><stop offset="1" stop-color="white" stop-opacity="0"/></linearGradient></defs><rect width="630" height="880" fill="url(#s4)"/><circle cx="334" cy="215" r="115" fill="white" opacity=".65"/><path d="M0 450 138 218 318 472 470 310 630 482V880H0Z" fill="#B89599" opacity=".35"/><path d="M0 609 164 357 343 580 475 398 630 548V880H0Z" fill="#B89599"/><path d="M0 712 190 516 346 720 466 560 630 690V880H0Z" fill="#6E6883"/><path d="M254 880Q474 696 322 658T286 528Q383 610 383 645T360 715Q347 783 405 880Z" fill="url(#r4)"/><path d="M106 119h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M323 101h10m-5 -5v10" stroke="white" stroke-width="3"/><path d="M528 285h8m-4 -4v8" stroke="white" stroke-width="3"/><path d="M209 282h6m-3 -3v6" stroke="white" stroke-width="3"/><path d="M551 93h6m-3 -3v6" stroke="white" stroke-width="3"/></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="510" height="150" viewBox="0 0 510 150" role="img"><title>TCG-M horizontal lockup / color</title><defs><linearGradient id="back" x1="0" y1="0" x2=".2" y2="1"><stop stop-color="#FF7B7B"/><stop offset="1" stop-color="#A78BFA"/></linearGradient><linearGradient id="rim" x1="0" y1="0" x2=".3" y2="1"><stop stop-color="#FFC66E"/><stop offset=".5" stop-color="#FF7B7B"/><stop offset="1" stop-color="#A78BFA"/></linearGradient><linearGradient id="left" x1="0" y1="0" x2="1" y2="1"><stop stop-color="#16819A"/><stop offset="1" stop-color="#0F4C5C"/></linearGradient><linearGradient id="right" x1="0" y1="0" x2="1" y2="1"><stop stop-color="#136E88"/><stop offset="1" stop-color="#0F4C5C"/></linearGradient><linearGradient id="spark" x1="0" y1="0" x2="0" y2="1"><stop stop-color="#A78BFA"/><stop offset=".5" stop-color="#FF7B7B"/><stop offset="1" stop-color="#FFC66E"/></linearGradient></defs><g transform="translate(0 0) scale(.55)"><path d="M31 67 Q22 64 25 78 L54 202 Q58 216 64 222 L45 69Z" fill="url(#back)"/><path d="M66 225 L55 68 Q54 53 66 49 L161 16 Q172 12 173 25 L173 31 L72 66Z" fill="url(#rim)"/><path d="M78 72 L181 36 Q192 32 192 45 L192 139 L151 174Z" fill="#38B6FF"/><path d="M204 53 L215 57 Q222 60 222 70 L222 109 L203 126Z" fill="url(#right)"/><path d="M76 87 L143 146 Q153 155 153 168 L153 188 Q153 197 145 191 L116 168 L116 219 L77 233 Q69 236 70 226Z" fill="url(#left)"/><path d="M167 167 Q168 155 177 146 L231 101 Q240 95 241 107 L241 203 L204 218 L204 168 L175 191 Q167 197 167 186Z" fill="url(#right)"/><path d="M161 167 C163 194 169 202 188 209 C169 214 164 221 161 244 C157 220 151 215 134 209 C152 204 157 195 161 167Z" fill="url(#spark)"/></g><g transform="translate(164 44) scale(.92)" fill="#0F4C5C"><path d="M0 0H63V15H40V73H23V15H0Z"/><path d="M138 5L132 22C124 17 119 15 112 15C95 15 86 24 86 37C86 51 96 59 111 59C120 59 126 56 133 51L140 66C131 72 121 76 110 76C84 76 67 60 67 37C67 15 84-2 111-2C122-2 131 0 138 5Z"/><path d="M215 7L206 21C198 16 192 14 183 14C169 14 159 23 159 37C159 50 169 60 183 60C189 60 194 59 199 56V46H181V32H216V65C208 72 195 76 182 76C158 76 142 60 142 37C142 14 159-2 183-2C196-2 207 1 215 7Z"/><path d="M228 31H258V45H228Z"/><path d="M271 0H288L311 32L334 0H351V73H334V28L311 60L288 28V73H271Z"/></g></svg>
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="264" height="264" viewBox="0 0 264 264" role="img"><title>TCG-M Layered Prism symbol / color</title><defs><linearGradient id="back" x1="0" y1="0" x2=".2" y2="1"><stop stop-color="#FF7B7B"/><stop offset="1" stop-color="#A78BFA"/></linearGradient><linearGradient id="rim" x1="0" y1="0" x2=".3" y2="1"><stop stop-color="#FFC66E"/><stop offset=".5" stop-color="#FF7B7B"/><stop offset="1" stop-color="#A78BFA"/></linearGradient><linearGradient id="left" x1="0" y1="0" x2="1" y2="1"><stop stop-color="#16819A"/><stop offset="1" stop-color="#0F4C5C"/></linearGradient><linearGradient id="right" x1="0" y1="0" x2="1" y2="1"><stop stop-color="#136E88"/><stop offset="1" stop-color="#0F4C5C"/></linearGradient><linearGradient id="spark" x1="0" y1="0" x2="0" y2="1"><stop stop-color="#A78BFA"/><stop offset=".5" stop-color="#FF7B7B"/><stop offset="1" stop-color="#FFC66E"/></linearGradient></defs><path d="M31 67 Q22 64 25 78 L54 202 Q58 216 64 222 L45 69Z" fill="url(#back)"/><path d="M66 225 L55 68 Q54 53 66 49 L161 16 Q172 12 173 25 L173 31 L72 66Z" fill="url(#rim)"/><path d="M78 72 L181 36 Q192 32 192 45 L192 139 L151 174Z" fill="#38B6FF"/><path d="M204 53 L215 57 Q222 60 222 70 L222 109 L203 126Z" fill="url(#right)"/><path d="M76 87 L143 146 Q153 155 153 168 L153 188 Q153 197 145 191 L116 168 L116 219 L77 233 Q69 236 70 226Z" fill="url(#left)"/><path d="M167 167 Q168 155 177 146 L231 101 Q240 95 241 107 L241 203 L204 218 L204 168 L175 191 Q167 197 167 186Z" fill="url(#right)"/><path d="M161 167 C163 194 169 202 188 209 C169 214 164 221 161 244 C157 220 151 215 134 209 C152 204 157 195 161 167Z" fill="url(#spark)"/></svg>
@@ -1,81 +0,0 @@
1
- import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@godxjp/ui/data-display";
2
- import { Flex, PageContainer } from "@godxjp/ui/layout";
3
- import { BarChart } from "@godxjp/ui/charts";
4
-
5
- /**
6
- * 横棒グラフの分類軸と、カードの見出しとの重複 — gh#409 · 1 と 2。
7
- *
8
- * 監理団体の実習実施者(受入企業)名は「株式会社」を含む 8〜10 文字の全角で、幅は 100〜125px に
9
- * なります。分類軸の幅を固定にすると、名前の**先頭**、つまり識別に必要な部分から切り落とされます。
10
- * BarChart は実際に描画される字形で各目盛りを実測し、いちばん広い目盛りに合わせて軸を確保します。
11
- * 上限はトークン `--chart-category-axis-max-fraction` が持ち、これを超える名前だけが**末尾**で
12
- * 省略され、全文は目盛りの `<title>` と図の代替テキストに残ります。
13
- *
14
- * 下段のカードは `showCaption={false}`。`CardTitle` が見出しを担うので、キャプションは
15
- * `sr-only` として DOM に残り、`role="img"` の名前は失われません。
16
- */
17
-
18
- /** 実習実施者ごとの受入人数。企業名は 8〜10 文字の全角で、固定幅の軸では先頭が消えていました。 */
19
- const acceptances = [
20
- { company: "株式会社山田製作所", trainees: 42 },
21
- { company: "佐藤食品株式会社", trainees: 35 },
22
- { company: "株式会社中村建設", trainees: 28 },
23
- { company: "東海精密工業株式会社", trainees: 24 },
24
- { company: "みどり農産株式会社", trainees: 18 },
25
- { company: "大和金属加工株式会社", trainees: 12 },
26
- ];
27
-
28
- export default function Demo() {
29
- return (
30
- <PageContainer
31
- title="CJK category axis"
32
- subtitle="横棒グラフの分類軸を実測で確保し、見出しの重複をなくす"
33
- >
34
- <Flex direction="col" gap="lg">
35
- <Card>
36
- <CardHeader>
37
- <CardTitle level={2}>横棒 BarChart · 分類軸は目盛りの実測で決まる</CardTitle>
38
- <CardDescription>
39
- いちばん広い目盛りに合わせて軸幅を確保します。キャプションは既定どおり表示。
40
- </CardDescription>
41
- </CardHeader>
42
- <CardContent>
43
- <BarChart
44
- id="cjk-axis-chart"
45
- label="実習実施者別 受入人数"
46
- data={acceptances}
47
- categoryKey="company"
48
- series={[{ dataKey: "trainees", label: "受入人数" }]}
49
- showLegend={false}
50
- size="md"
51
- horizontal
52
- />
53
- </CardContent>
54
- </Card>
55
-
56
- <Card>
57
- <CardHeader>
58
- <CardTitle level={2}>実習実施者別 受入人数</CardTitle>
59
- <CardDescription>
60
- `showCaption={"{false}"}` — 見出しは CardTitle が担い、キャプションは sr-only
61
- として残るのでアクセシブルな名前は保たれます。
62
- </CardDescription>
63
- </CardHeader>
64
- <CardContent>
65
- <BarChart
66
- id="cjk-axis-chart-no-caption"
67
- label="実習実施者別 受入人数"
68
- data={acceptances}
69
- categoryKey="company"
70
- series={[{ dataKey: "trainees", label: "受入人数" }]}
71
- showLegend={false}
72
- showCaption={false}
73
- size="md"
74
- horizontal
75
- />
76
- </CardContent>
77
- </Card>
78
- </Flex>
79
- </PageContainer>
80
- );
81
- }