banhaten 0.3.0 → 0.5.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.
- package/CHANGELOG.md +139 -73
- package/CONTRIBUTING.md +46 -44
- package/README.md +192 -190
- package/SECURITY.md +15 -15
- package/banhaten.config.example.json +11 -11
- package/docs/design-spacing.md +13 -0
- package/docs/design-system/README.md +22 -20
- package/docs/design-system/adoption-quality-remediation.md +87 -87
- package/docs/design-system/agent-usage.md +13 -13
- package/docs/design-system/appearance-presets.md +189 -189
- package/docs/design-system/appearances/default.md +94 -94
- package/docs/design-system/appearances/rounded.md +95 -95
- package/docs/design-system/appearances/sharp.md +95 -95
- package/docs/design-system/component-docs-pattern.md +81 -81
- package/docs/design-system/component-implementation-ownership-audit.md +245 -244
- package/docs/design-system/component-quality-audit-2026-08-20.md +225 -223
- package/docs/design-system/component-showcase-consistency-report.md +219 -219
- package/docs/design-system/component-token-consistency-audit.md +173 -173
- package/docs/design-system/components/README.md +90 -76
- package/docs/design-system/components/accordion.md +53 -53
- package/docs/design-system/components/activity-feed.md +94 -94
- package/docs/design-system/components/activity-heatmap.md +57 -57
- package/docs/design-system/components/agent-input.md +85 -0
- package/docs/design-system/components/alert-dialog.md +72 -72
- package/docs/design-system/components/alert.md +98 -98
- package/docs/design-system/components/approval-card.md +134 -0
- package/docs/design-system/components/aspect-ratio.md +45 -45
- package/docs/design-system/components/attribute.md +89 -89
- package/docs/design-system/components/autocomplete.md +75 -75
- package/docs/design-system/components/avatar.md +54 -54
- package/docs/design-system/components/badge.md +54 -54
- package/docs/design-system/components/banner.md +87 -87
- package/docs/design-system/components/breadcrumbs.md +177 -176
- package/docs/design-system/components/button-group.md +98 -98
- package/docs/design-system/components/button.md +83 -80
- package/docs/design-system/components/card.md +88 -88
- package/docs/design-system/components/carousel.md +46 -46
- package/docs/design-system/components/catalog-components.md +47 -47
- package/docs/design-system/components/chart.md +95 -24
- package/docs/design-system/components/checkbox.md +54 -54
- package/docs/design-system/components/collapsible.md +67 -53
- package/docs/design-system/components/command.md +62 -62
- package/docs/design-system/components/context-menu.md +46 -46
- package/docs/design-system/components/date-picker.md +81 -79
- package/docs/design-system/components/divider.md +102 -102
- package/docs/design-system/components/empty-state.md +56 -56
- package/docs/design-system/components/field.md +70 -70
- package/docs/design-system/components/file-upload.md +187 -187
- package/docs/design-system/components/hover-card.md +48 -48
- package/docs/design-system/components/icons.md +48 -48
- package/docs/design-system/components/inline-citations.md +93 -0
- package/docs/design-system/components/input-group.md +58 -58
- package/docs/design-system/components/input-otp.md +56 -56
- package/docs/design-system/components/input.md +117 -61
- package/docs/design-system/components/item.md +59 -57
- package/docs/design-system/components/kbd.md +54 -49
- package/docs/design-system/components/label.md +49 -49
- package/docs/design-system/components/menu.md +71 -61
- package/docs/design-system/components/menubar.md +47 -47
- package/docs/design-system/components/modal.md +105 -105
- package/docs/design-system/components/native-select.md +54 -54
- package/docs/design-system/components/navigation-menu.md +50 -50
- package/docs/design-system/components/onboarding-step-list-item.md +82 -82
- package/docs/design-system/components/page-header.md +93 -86
- package/docs/design-system/components/pagination.md +57 -57
- package/docs/design-system/components/popover.md +60 -60
- package/docs/design-system/components/progress-slider.md +50 -50
- package/docs/design-system/components/progress.md +76 -76
- package/docs/design-system/components/radio-card.md +51 -51
- package/docs/design-system/components/radio-group.md +57 -57
- package/docs/design-system/components/resizable.md +44 -44
- package/docs/design-system/components/rolling-count.md +61 -0
- package/docs/design-system/components/scroll-area.md +51 -51
- package/docs/design-system/components/segmented-control.md +54 -54
- package/docs/design-system/components/select.md +68 -62
- package/docs/design-system/components/sheet.md +67 -67
- package/docs/design-system/components/shimmer-text.md +67 -0
- package/docs/design-system/components/sidebar.md +127 -76
- package/docs/design-system/components/skeleton.md +75 -75
- package/docs/design-system/components/slideout.md +65 -65
- package/docs/design-system/components/slider.md +63 -63
- package/docs/design-system/components/social-button.md +50 -50
- package/docs/design-system/components/spinner.md +62 -62
- package/docs/design-system/components/steps.md +65 -65
- package/docs/design-system/components/streaming-text.md +82 -0
- package/docs/design-system/components/table.md +419 -414
- package/docs/design-system/components/tabs.md +59 -55
- package/docs/design-system/components/tag.md +80 -80
- package/docs/design-system/components/task-list.md +95 -0
- package/docs/design-system/components/textarea.md +50 -50
- package/docs/design-system/components/thinking-reasoning.md +72 -0
- package/docs/design-system/components/thinking-state.md +67 -0
- package/docs/design-system/components/timeline.md +83 -83
- package/docs/design-system/components/toast.md +58 -58
- package/docs/design-system/components/toggle.md +81 -81
- package/docs/design-system/components/toolbar.md +92 -87
- package/docs/design-system/components/tooltip.md +94 -92
- package/docs/design-system/components/typography.md +18 -18
- package/docs/design-system/density-and-elevation.md +65 -61
- package/docs/design-system/design-system-test-missing-items.md +368 -368
- package/docs/design-system/direction-and-localization.md +23 -23
- package/docs/design-system/form-recipes.md +73 -73
- package/docs/design-system/gap-promotion-policy.md +21 -21
- package/docs/design-system/icons.md +74 -69
- package/docs/design-system/installation.md +70 -68
- package/docs/design-system/launch-comparison-shadcn.md +98 -98
- package/docs/design-system/registry-and-cli.md +64 -64
- package/docs/design-system/release-policy.md +30 -30
- package/docs/design-system/roadmap.md +14 -14
- package/docs/design-system/support-matrix.md +23 -23
- package/docs/design-system/tabs.md +54 -53
- package/docs/design-system/template-gap-audit.md +32 -0
- package/docs/design-system/templates.md +59 -0
- package/docs/design-system/token-governance.md +72 -60
- package/package.json +98 -98
- package/registry/component-contract.json +40 -40
- package/registry/components/accordion.tsx +155 -155
- package/registry/components/agent-input-parts.tsx +552 -0
- package/registry/components/agent-input-state.ts +156 -0
- package/registry/components/agent-input.css +307 -0
- package/registry/components/agent-input.tsx +382 -0
- package/registry/components/alert-dialog.tsx +297 -297
- package/registry/components/alert.tsx +293 -293
- package/registry/components/approval-card.css +409 -0
- package/registry/components/approval-card.tsx +401 -0
- package/registry/components/approval-frame.tsx +108 -0
- package/registry/components/approval-questions.tsx +559 -0
- package/registry/components/aspect-ratio.tsx +30 -30
- package/registry/components/attribute.tsx +454 -448
- package/registry/components/autocomplete.tsx +598 -651
- package/registry/components/avatar.tsx +385 -381
- package/registry/components/badge.tsx +629 -629
- package/registry/components/button-group.tsx +565 -565
- package/registry/components/button.tsx +127 -123
- package/registry/components/card.tsx +638 -638
- package/registry/components/carousel.tsx +296 -296
- package/registry/components/chart-block-data.ts +177 -0
- package/registry/components/chart-block.css +171 -0
- package/registry/components/chart-block.tsx +260 -0
- package/registry/components/chart-interactions.ts +123 -0
- package/registry/components/chart-options.cartesian.ts +162 -0
- package/registry/components/chart-options.paint.ts +99 -0
- package/registry/components/chart-options.parts.ts +72 -0
- package/registry/components/chart-options.radial.ts +109 -0
- package/registry/components/chart-options.ts +44 -0
- package/registry/components/chart-options.types.ts +67 -0
- package/registry/components/chart.tsx +203 -203
- package/registry/components/checkbox.tsx +247 -247
- package/registry/components/collapsible.tsx +109 -69
- package/registry/components/command.tsx +208 -208
- package/registry/components/context-menu.tsx +236 -236
- package/registry/components/data-chart.tsx +40 -0
- package/registry/components/date-picker.tsx +1289 -1277
- package/registry/components/echart-theme.ts +246 -0
- package/registry/components/echart.css +49 -0
- package/registry/components/echart.tsx +178 -0
- package/registry/components/expanded/ActivityFeed.tsx +227 -227
- package/registry/components/expanded/ActivityHeatmap.tsx +64 -64
- package/registry/components/expanded/Banner.tsx +179 -179
- package/registry/components/expanded/Breadcrumbs.tsx +131 -131
- package/registry/components/expanded/CatalogComponentsShowcase.tsx +205 -205
- package/registry/components/expanded/CatalogDivider.tsx +49 -49
- package/registry/components/expanded/EmptyState.tsx +155 -155
- package/registry/components/expanded/FileUpload.tsx +543 -543
- package/registry/components/expanded/OnboardingStepListItem.tsx +60 -59
- package/registry/components/expanded/PageHeader.tsx +179 -166
- package/registry/components/expanded/Slideout.tsx +108 -108
- package/registry/components/expanded/Steps.tsx +402 -402
- package/registry/components/expanded/Table.tsx +1092 -1071
- package/registry/components/expanded/Timeline.tsx +203 -203
- package/registry/components/expanded/activityFeed.css +248 -248
- package/registry/components/expanded/activityHeatmap.css +66 -66
- package/registry/components/expanded/banner.css +260 -255
- package/registry/components/expanded/breadcrumbs.css +140 -140
- package/registry/components/expanded/catalogComponentsShowcase.css +87 -87
- package/registry/components/expanded/divider.css +75 -75
- package/registry/components/expanded/emptyState.css +111 -111
- package/registry/components/expanded/fileUpload.css +457 -457
- package/registry/components/expanded/onboardingStepListItem.css +135 -126
- package/registry/components/expanded/pageHeader.css +248 -290
- package/registry/components/expanded/slideout.css +276 -276
- package/registry/components/expanded/steps.css +356 -356
- package/registry/components/expanded/table.css +606 -603
- package/registry/components/expanded/timeline.css +286 -286
- package/registry/components/field.tsx +283 -283
- package/registry/components/hover-card.tsx +48 -48
- package/registry/components/inline-citations.css +126 -0
- package/registry/components/inline-citations.tsx +292 -0
- package/registry/components/input-content.ts +107 -107
- package/registry/components/input-group.tsx +130 -130
- package/registry/components/input-otp.tsx +584 -584
- package/registry/components/input.tsx +990 -972
- package/registry/components/item.tsx +189 -189
- package/registry/components/kbd.tsx +246 -151
- package/registry/components/label.tsx +78 -78
- package/registry/components/menu.tsx +978 -986
- package/registry/components/menubar.tsx +226 -226
- package/registry/components/modal.tsx +872 -872
- package/registry/components/native-select.tsx +205 -205
- package/registry/components/navigation-menu.tsx +171 -171
- package/registry/components/pagination.css +36 -36
- package/registry/components/pagination.tsx +560 -555
- package/registry/components/popover.tsx +338 -338
- package/registry/components/progress-slider.tsx +216 -216
- package/registry/components/radio-card.tsx +676 -677
- package/registry/components/radio-group.tsx +570 -570
- package/registry/components/resizable.tsx +108 -108
- package/registry/components/rolling-count.css +37 -0
- package/registry/components/rolling-count.tsx +110 -0
- package/registry/components/scroll-area.tsx +91 -91
- package/registry/components/segmented-control.tsx +87 -87
- package/registry/components/select-content.tsx +218 -218
- package/registry/components/select.tsx +937 -932
- package/registry/components/sheet.tsx +305 -305
- package/registry/components/shimmer-text.css +69 -0
- package/registry/components/shimmer-text.tsx +43 -0
- package/registry/components/sidebar.tsx +1433 -358
- package/registry/components/skeleton.css +54 -54
- package/registry/components/skeleton.tsx +482 -482
- package/registry/components/slider.tsx +380 -380
- package/registry/components/social-button.tsx +387 -387
- package/registry/components/spinner.tsx +78 -78
- package/registry/components/streaming-text.css +45 -0
- package/registry/components/streaming-text.tsx +165 -0
- package/registry/components/table-elements.tsx +128 -128
- package/registry/components/tabs.css +222 -218
- package/registry/components/tabs.tsx +241 -241
- package/registry/components/tag.tsx +423 -423
- package/registry/components/task-list.css +328 -0
- package/registry/components/task-list.tsx +429 -0
- package/registry/components/textarea.tsx +610 -610
- package/registry/components/thinking-reasoning.css +178 -0
- package/registry/components/thinking-reasoning.tsx +253 -0
- package/registry/components/thinking-state.css +8 -0
- package/registry/components/thinking-state.tsx +46 -0
- package/registry/components/toast.tsx +136 -136
- package/registry/components/toggle.tsx +256 -256
- package/registry/components/toolbar.tsx +539 -539
- package/registry/components/tooltip.tsx +433 -431
- package/registry/examples/agent-input-demo.tsx +90 -0
- package/registry/examples/alert-demo.tsx +34 -34
- package/registry/examples/alert-dialog-demo.tsx +42 -42
- package/registry/examples/approval-card-demo.tsx +83 -0
- package/registry/examples/aspect-ratio-demo.tsx +11 -11
- package/registry/examples/attribute-demo.tsx +65 -65
- package/registry/examples/autocomplete-demo.tsx +109 -109
- package/registry/examples/avatar-demo.tsx +132 -132
- package/registry/examples/badge-demo.tsx +69 -69
- package/registry/examples/button-demo.tsx +86 -83
- package/registry/examples/button-group-demo.tsx +63 -63
- package/registry/examples/card-demo.tsx +86 -86
- package/registry/examples/carousel-demo.tsx +43 -43
- package/registry/examples/chart-block-demo.tsx +5 -0
- package/registry/examples/chart-demo.tsx +18 -33
- package/registry/examples/checkbox-demo.tsx +62 -62
- package/registry/examples/collapsible-demo.tsx +16 -16
- package/registry/examples/collection-filter-bar-demo.tsx +135 -135
- package/registry/examples/command-demo.tsx +42 -42
- package/registry/examples/command-palette-demo.tsx +235 -236
- package/registry/examples/context-menu-demo.tsx +29 -29
- package/registry/examples/control-density-contract-demo.tsx +65 -61
- package/registry/examples/date-picker-demo.tsx +127 -127
- package/registry/examples/divider-demo.tsx +17 -17
- package/registry/examples/expanded/activity-heatmap-demo.tsx +29 -29
- package/registry/examples/expanded/banner-demo.tsx +48 -48
- package/registry/examples/expanded/breadcrumbs-demo.tsx +59 -59
- package/registry/examples/expanded/empty-state-demo.tsx +39 -39
- package/registry/examples/expanded/file-upload-demo.tsx +60 -60
- package/registry/examples/expanded/onboarding-step-demo.tsx +11 -11
- package/registry/examples/expanded/slideout-demo.tsx +15 -15
- package/registry/examples/expanded/steps-demo.tsx +29 -29
- package/registry/examples/expanded/tabs-demo.tsx +13 -13
- package/registry/examples/expanded/timeline-demo.tsx +18 -18
- package/registry/examples/field-demo.tsx +51 -51
- package/registry/examples/hover-card-demo.tsx +23 -23
- package/registry/examples/inline-citations-demo.tsx +31 -0
- package/registry/examples/input-actions-demo.tsx +36 -0
- package/registry/examples/input-demo.tsx +87 -87
- package/registry/examples/input-group-demo.tsx +16 -16
- package/registry/examples/input-otp-demo.tsx +72 -72
- package/registry/examples/item-demo.tsx +46 -46
- package/registry/examples/kbd-demo.tsx +12 -11
- package/registry/examples/label-demo.tsx +20 -20
- package/registry/examples/menu-demo.tsx +122 -122
- package/registry/examples/menubar-demo.tsx +34 -34
- package/registry/examples/modal-demo.tsx +74 -74
- package/registry/examples/native-select-demo.tsx +16 -16
- package/registry/examples/navigation-menu-demo.tsx +29 -29
- package/registry/examples/pagination-demo.tsx +20 -20
- package/registry/examples/popover-demo.tsx +547 -546
- package/registry/examples/progress-demo.tsx +37 -37
- package/registry/examples/progress-slider-demo.tsx +29 -29
- package/registry/examples/radio-card-demo.tsx +51 -51
- package/registry/examples/radio-group-demo.tsx +62 -62
- package/registry/examples/resizable-demo.tsx +22 -22
- package/registry/examples/results-toolbar-demo.tsx +44 -44
- package/registry/examples/rolling-count-demo.tsx +39 -0
- package/registry/examples/scroll-area-demo.tsx +15 -15
- package/registry/examples/segmented-control-demo.tsx +39 -39
- package/registry/examples/select-demo.tsx +87 -87
- package/registry/examples/sheet-demo.tsx +47 -47
- package/registry/examples/shimmer-text-demo.tsx +20 -0
- package/registry/examples/sidebar-demo.tsx +101 -57
- package/registry/examples/slider-demo.tsx +31 -31
- package/registry/examples/social-button-demo.tsx +61 -61
- package/registry/examples/spinner-demo.tsx +59 -59
- package/registry/examples/streaming-text-demo.tsx +28 -0
- package/registry/examples/tabs-demo.tsx +13 -13
- package/registry/examples/tag-demo.tsx +29 -29
- package/registry/examples/task-list-demo.tsx +74 -0
- package/registry/examples/textarea-demo.tsx +79 -79
- package/registry/examples/thinking-reasoning-demo.tsx +74 -0
- package/registry/examples/thinking-state-demo.tsx +13 -0
- package/registry/examples/toast-demo.tsx +35 -35
- package/registry/examples/toggle-demo.tsx +59 -59
- package/registry/examples/tooltip-demo.tsx +115 -115
- package/registry/guidance/USAGE.md +27 -27
- package/registry/guidance/charts.LICENSE.txt +24 -0
- package/registry/hooks/use-controllable-state.ts +33 -0
- package/registry/hooks/use-direction.ts +207 -207
- package/registry/hooks/use-listbox-navigation.ts +73 -0
- package/registry/hooks/use-motion-end.ts +55 -0
- package/registry/hooks/use-reduced-motion.ts +28 -0
- package/registry/index.json +1634 -184
- package/registry/styles/globals.css +1462 -1570
- package/registry.json +364 -10
- package/schema/config.schema.json +51 -51
- package/schema/registry.schema.json +194 -190
- package/schema/tokens.schema.json +167 -163
- package/src/cli/command-line.js +194 -194
- package/src/cli/config-editors.js +9 -9
- package/src/cli/doctor.js +399 -399
- package/src/cli/file-transaction.js +302 -295
- package/src/cli/global-css.js +153 -153
- package/src/cli/index.js +1002 -1009
- package/src/cli/install-plan.js +592 -592
- package/src/cli/install-receipt.js +171 -171
- package/src/cli/jsonc.js +203 -203
- package/src/cli/package-install-state.js +254 -254
- package/src/cli/package-manager.js +238 -238
- package/src/cli/package-plan.js +185 -185
- package/src/cli/package-version.js +97 -97
- package/src/cli/registry-query.js +207 -207
- package/src/cli/reporting.js +55 -55
- package/src/cli/schema-validation.js +19 -19
- package/src/cli/source-scanner.js +686 -686
- package/src/cli/vite-config.js +478 -478
- package/tokens/banhaten.tokens.json +458 -224
|
@@ -1,98 +1,98 @@
|
|
|
1
|
-
# Launch Comparison: Banhaten and shadcn/ui
|
|
2
|
-
|
|
3
|
-
Benchmark references reviewed against the official shadcn/ui CLI, registry, theming, and RTL documentation on 2026-07-10; Banhaten implementation status refreshed on 2026-08-20. shadcn/ui is the distribution and documentation benchmark—not Banhaten’s visual source.
|
|
4
|
-
|
|
5
|
-
## Outcome
|
|
6
|
-
|
|
7
|
-
Banhaten is a launch candidate with a distinct product contract: Arabic and English-first typography, inherited RTL by default, seven brand themes, three radius modes, stable primitives separated from larger Patterns, and a hard rule that distributable components consume canonical Banhaten tokens.
|
|
8
|
-
|
|
9
|
-
The former color-contrast exception is closed. The reviewed semantic-role corrections preserve the Banhaten palette while selecting valid foreground/background roles across themes and states. The Color Contrast page now evaluates 910 theme/mode scenarios and reports **910 passes and 0 failures**, with every pair, score, threshold, state, and swatch retained as inspectable evidence.
|
|
10
|
-
|
|
11
|
-
## Benchmark Summary
|
|
12
|
-
|
|
13
|
-
| Area | shadcn/ui benchmark | Banhaten launch answer | Status |
|
|
14
|
-
| --- | --- | --- | --- |
|
|
15
|
-
| Distribution | Source registry and CLI installation | Canonical Banhaten registry plus generated shadcn-compatible `registry.json` | Verified |
|
|
16
|
-
| Component ownership | Copied source is consumer-owned | Receipt-backed generated ownership; local drift blocks updates unless explicitly forced | Stronger safety |
|
|
17
|
-
| Registry dependencies | Dependency closure and typed registry items | Dependency graph, schema validation, mirror checks, and isolated compilation of all 68 items | Verified |
|
|
18
|
-
| CLI | `init`, `add`, `view`, `docs`, migrations, presets | `init`, `add`, real `diff`, safe `update`, `list`, `search`, full `docs`, and `view` | Launch scope verified |
|
|
19
|
-
| Framework setup | Multiple framework templates | Vite auto-configuration and framework-neutral/Next-style source installation | Verified |
|
|
20
|
-
| Package managers | npm, pnpm, Yarn, Bun | Detection and install hints tested for all four | Verified |
|
|
21
|
-
| Theming | CSS variables, dark mode, presets | Live semantic aliases, light/dark, seven brand themes, three radius modes | Verified |
|
|
22
|
-
| Token contract | Optional CSS-variable path | CSS variables are mandatory; raw component colors, sizes, opacity, duration, z-index, shadow, and generic internal aliases fail CI | Banhaten-specific |
|
|
23
|
-
| RTL | First-class RTL and install-time transformations | Authored logical layout, inherited direction hook/provider, Arabic font, explicit message catalogs, and RTL keyboard tests | Banhaten-specific |
|
|
24
|
-
| Documentation | Live preview/code, component examples, API and CLI docs | Live registry previews, exact example source, extracted TypeScript props, token contract, accessibility contract, RTL, files, navigation/token search, and copy actions | Verified |
|
|
25
|
-
| Components vs blocks | Components and larger blocks | Stable Components and broader Patterns; experiments and visual QA isolated under Lab | Verified |
|
|
26
|
-
| Accessibility | Primitive semantics and per-component guidance | Native/Radix semantics, focus handling, dialog traps, tabs contract, reduced motion, forced colors, 910/910 contrast, strict route Axe, and Chromium/Firefox/WebKit tests | Verified |
|
|
27
|
-
| Release governance | Changelog and frequent CLI/schema evolution | Changelog, security, contributing, support matrix, stability tiers, deprecation, release gate, and roadmap | Verified |
|
|
28
|
-
|
|
29
|
-
## Full Finding Register
|
|
30
|
-
|
|
31
|
-
### Components and behavior
|
|
32
|
-
|
|
33
|
-
- Removed sample titles, images, actions, close controls, dates, time rows, and no-op callbacks from production defaults. Examples now own demonstration content.
|
|
34
|
-
- Added Item and controlled/uncontrolled Toggle Group APIs, including single/multiple selection and RTL-aware keyboard movement.
|
|
35
|
-
- Repaired Command Bar search/clear/submit behavior, Table disabled/action behavior, File Upload progress semantics, Spinner reduced-motion behavior, and Date Picker presets/month-year interaction.
|
|
36
|
-
- Standardized direction resolution for Alert, Pagination, Input OTP, Carousel, and Toast through explicit props, `DirectionProvider`, nearest `[dir]`, then document direction.
|
|
37
|
-
- Corrected Arabic Pagination copy and kept product strings explicit rather than silently localizing demo text.
|
|
38
|
-
- Added focused behavior tests; the component suite currently runs 205 tests.
|
|
39
|
-
|
|
40
|
-
### Colors and tokens
|
|
41
|
-
|
|
42
|
-
- Repaired semantic foreground/background role selection across component states while preserving the canonical palette; all 910 generated contrast combinations now pass.
|
|
43
|
-
- Split system, typography, effects, component variables, dark effects, and
|
|
44
|
-
scoped aliases into owned `tokens/source/` fragments that compile to
|
|
45
|
-
`tokens/banhaten.tokens.json`.
|
|
46
|
-
- Generated live `var(...)` alias graphs rather than flattened semantic values and verified custom-property closure.
|
|
47
|
-
- Added named categorical chart semantics, spinner/skeleton/motion tokens, exact icon stroke tokens, Item tokens, default border/transition wiring, reduced motion, and forced-color focus rules.
|
|
48
|
-
- Generated exact component token metadata from source. All 68 registry components have non-empty, current token contracts.
|
|
49
|
-
- Deduplicated theme CSS against the default cascade and kept generated CSS at 156,729 bytes after the accessibility and component-token additions.
|
|
50
|
-
- Documented the no-global-density decision and the semantic elevation hierarchy.
|
|
51
|
-
|
|
52
|
-
### Usage and composition
|
|
53
|
-
|
|
54
|
-
- Added installation, direction/localization, form recipes, density/elevation, support, roadmap, and release-policy guides.
|
|
55
|
-
- Separated stable Components from broader Patterns and isolated Component Matrix, Theme Test, Theme Lab, and screenshot review under Lab/Visual QA.
|
|
56
|
-
- Added explicit TypeScript prop source, token contract, accessibility contract, composition notes, RTL behavior, and registry file links to shared component documentation.
|
|
57
|
-
- Added searchable/copyable token pages with computed values and `var(--token)` usage syntax.
|
|
58
|
-
|
|
59
|
-
### Installation and registry
|
|
60
|
-
|
|
61
|
-
- Added Inter and IBM Plex Sans Arabic weights 400–700 automatically and composed them through font-family tokens.
|
|
62
|
-
- Removed dead `style` and `tsx` config fields; config now contains only settings the CLI honors.
|
|
63
|
-
- Added real unified diff output and SHA-256 ownership receipts for base files, components, and the generated token block.
|
|
64
|
-
- Prevented `add` and `update` from overwriting local edits without `--force`; transactions roll back on failure.
|
|
65
|
-
- Kept CSS outside the marked Banhaten token block intact and protected edits inside the generated block.
|
|
66
|
-
- Tested Vite, non-Vite/Next-style projects, dependency conflicts, JSONC aliases, unsupported Vite config rollback, npm, pnpm, Yarn, and Bun.
|
|
67
|
-
- Generated a current shadcn-compatible registry and compiled every registry component in isolation.
|
|
68
|
-
- Removed design-source ZIP archives from the published package while keeping the canonical JSON contract and required registry assets.
|
|
69
|
-
|
|
70
|
-
### Documentation and presentation
|
|
71
|
-
|
|
72
|
-
- Removed launch-blocking `noindex`, added description/social metadata, dynamic page titles, skip link, release status/version, and responsive searchable navigation.
|
|
73
|
-
- Reframed the overview around quick start, token rules, safe updates, and the now-enforced contrast contract.
|
|
74
|
-
- Added focus trap, Escape, initial focus, and focus return to Customize and Component Matrix dialogs.
|
|
75
|
-
- Completed Preview/Code tab IDs, `aria-controls`, `aria-labelledby`, roving focus, and keyboard navigation.
|
|
76
|
-
- Renamed ambiguous “Copy Page” to “Copy page link” and added clipboard fallback.
|
|
77
|
-
- Changed the CLI `docs` command from a path hint to the complete packaged component documentation plus metadata.
|
|
78
|
-
|
|
79
|
-
### Verification and release
|
|
80
|
-
|
|
81
|
-
- Browser checks cover Chromium, Firefox, and WebKit; visual baselines stay on Chromium for deterministic snapshots.
|
|
82
|
-
- Automated checks cover LTR/RTL behavior, portals, focus return, docs navigation, mobile navigation, token copy/search, live theme overrides, the 910/910 contrast totals, reduced motion, forced colors, and strict route-wide Axe findings without a color-rule exception.
|
|
83
|
-
- Bundle budgets, schema validation, token generation, token-only styling, registry mirrors, documentation coverage, CLI integration, isolated installs, package audit, and tarball contents are release gates.
|
|
84
|
-
|
|
85
|
-
## Deliberate Differences, Not Missing Copies
|
|
86
|
-
|
|
87
|
-
Banhaten does not copy shadcn’s preset marketplace, `create` templates, registry namespaces, programmatic registry API, or migration catalog for launch. Those are distribution-platform capabilities, not component-quality requirements. They belong on the roadmap only when Banhaten has a concrete consumer need and maintenance owner.
|
|
88
|
-
|
|
89
|
-
Banhaten also does not support opting out of CSS variables: the canonical token graph is the mechanism that keeps themes, Arabic typography, accessibility modes, and every component aligned. That constraint is intentional and is the core of Banhaten’s visual independence.
|
|
90
|
-
|
|
91
|
-
## Reference Benchmark
|
|
92
|
-
|
|
93
|
-
- [shadcn/ui CLI](https://ui.shadcn.com/docs/cli)
|
|
94
|
-
- [shadcn/ui registry schema](https://ui.shadcn.com/docs/registry/registry-json)
|
|
95
|
-
- [shadcn/ui registry API](https://ui.shadcn.com/docs/registry/api-reference)
|
|
96
|
-
- [shadcn/ui theming](https://ui.shadcn.com/docs/theming)
|
|
97
|
-
- [shadcn/ui RTL](https://ui.shadcn.com/docs/rtl)
|
|
98
|
-
- [shadcn/ui changelog](https://ui.shadcn.com/docs/changelog)
|
|
1
|
+
# Launch Comparison: Banhaten and shadcn/ui
|
|
2
|
+
|
|
3
|
+
Benchmark references reviewed against the official shadcn/ui CLI, registry, theming, and RTL documentation on 2026-07-10; Banhaten implementation status refreshed on 2026-08-20. shadcn/ui is the distribution and documentation benchmark—not Banhaten’s visual source.
|
|
4
|
+
|
|
5
|
+
## Outcome
|
|
6
|
+
|
|
7
|
+
Banhaten is a launch candidate with a distinct product contract: Arabic and English-first typography, inherited RTL by default, seven brand themes, three radius modes, stable primitives separated from larger Patterns, and a hard rule that distributable components consume canonical Banhaten tokens.
|
|
8
|
+
|
|
9
|
+
The former color-contrast exception is closed. The reviewed semantic-role corrections preserve the Banhaten palette while selecting valid foreground/background roles across themes and states. The Color Contrast page now evaluates 910 theme/mode scenarios and reports **910 passes and 0 failures**, with every pair, score, threshold, state, and swatch retained as inspectable evidence.
|
|
10
|
+
|
|
11
|
+
## Benchmark Summary
|
|
12
|
+
|
|
13
|
+
| Area | shadcn/ui benchmark | Banhaten launch answer | Status |
|
|
14
|
+
| --- | --- | --- | --- |
|
|
15
|
+
| Distribution | Source registry and CLI installation | Canonical Banhaten registry plus generated shadcn-compatible `registry.json` | Verified |
|
|
16
|
+
| Component ownership | Copied source is consumer-owned | Receipt-backed generated ownership; local drift blocks updates unless explicitly forced | Stronger safety |
|
|
17
|
+
| Registry dependencies | Dependency closure and typed registry items | Dependency graph, schema validation, mirror checks, and isolated compilation of all 68 items | Verified |
|
|
18
|
+
| CLI | `init`, `add`, `view`, `docs`, migrations, presets | `init`, `add`, real `diff`, safe `update`, `list`, `search`, full `docs`, and `view` | Launch scope verified |
|
|
19
|
+
| Framework setup | Multiple framework templates | Vite auto-configuration and framework-neutral/Next-style source installation | Verified |
|
|
20
|
+
| Package managers | npm, pnpm, Yarn, Bun | Detection and install hints tested for all four | Verified |
|
|
21
|
+
| Theming | CSS variables, dark mode, presets | Live semantic aliases, light/dark, seven brand themes, three radius modes | Verified |
|
|
22
|
+
| Token contract | Optional CSS-variable path | CSS variables are mandatory; raw component colors, sizes, opacity, duration, z-index, shadow, and generic internal aliases fail CI | Banhaten-specific |
|
|
23
|
+
| RTL | First-class RTL and install-time transformations | Authored logical layout, inherited direction hook/provider, Arabic font, explicit message catalogs, and RTL keyboard tests | Banhaten-specific |
|
|
24
|
+
| Documentation | Live preview/code, component examples, API and CLI docs | Live registry previews, exact example source, extracted TypeScript props, token contract, accessibility contract, RTL, files, navigation/token search, and copy actions | Verified |
|
|
25
|
+
| Components vs blocks | Components and larger blocks | Stable Components and broader Patterns; experiments and visual QA isolated under Lab | Verified |
|
|
26
|
+
| Accessibility | Primitive semantics and per-component guidance | Native/Radix semantics, focus handling, dialog traps, tabs contract, reduced motion, forced colors, 910/910 contrast, strict route Axe, and Chromium/Firefox/WebKit tests | Verified |
|
|
27
|
+
| Release governance | Changelog and frequent CLI/schema evolution | Changelog, security, contributing, support matrix, stability tiers, deprecation, release gate, and roadmap | Verified |
|
|
28
|
+
|
|
29
|
+
## Full Finding Register
|
|
30
|
+
|
|
31
|
+
### Components and behavior
|
|
32
|
+
|
|
33
|
+
- Removed sample titles, images, actions, close controls, dates, time rows, and no-op callbacks from production defaults. Examples now own demonstration content.
|
|
34
|
+
- Added Item and controlled/uncontrolled Toggle Group APIs, including single/multiple selection and RTL-aware keyboard movement.
|
|
35
|
+
- Repaired Command Bar search/clear/submit behavior, Table disabled/action behavior, File Upload progress semantics, Spinner reduced-motion behavior, and Date Picker presets/month-year interaction.
|
|
36
|
+
- Standardized direction resolution for Alert, Pagination, Input OTP, Carousel, and Toast through explicit props, `DirectionProvider`, nearest `[dir]`, then document direction.
|
|
37
|
+
- Corrected Arabic Pagination copy and kept product strings explicit rather than silently localizing demo text.
|
|
38
|
+
- Added focused behavior tests; the component suite currently runs 205 tests.
|
|
39
|
+
|
|
40
|
+
### Colors and tokens
|
|
41
|
+
|
|
42
|
+
- Repaired semantic foreground/background role selection across component states while preserving the canonical palette; all 910 generated contrast combinations now pass.
|
|
43
|
+
- Split system, typography, effects, component variables, dark effects, and
|
|
44
|
+
scoped aliases into owned `tokens/source/` fragments that compile to
|
|
45
|
+
`tokens/banhaten.tokens.json`.
|
|
46
|
+
- Generated live `var(...)` alias graphs rather than flattened semantic values and verified custom-property closure.
|
|
47
|
+
- Added named categorical chart semantics, spinner/skeleton/motion tokens, exact icon stroke tokens, Item tokens, default border/transition wiring, reduced motion, and forced-color focus rules.
|
|
48
|
+
- Generated exact component token metadata from source. All 68 registry components have non-empty, current token contracts.
|
|
49
|
+
- Deduplicated theme CSS against the default cascade and kept generated CSS at 156,729 bytes after the accessibility and component-token additions.
|
|
50
|
+
- Documented the no-global-density decision and the semantic elevation hierarchy.
|
|
51
|
+
|
|
52
|
+
### Usage and composition
|
|
53
|
+
|
|
54
|
+
- Added installation, direction/localization, form recipes, density/elevation, support, roadmap, and release-policy guides.
|
|
55
|
+
- Separated stable Components from broader Patterns and isolated Component Matrix, Theme Test, Theme Lab, and screenshot review under Lab/Visual QA.
|
|
56
|
+
- Added explicit TypeScript prop source, token contract, accessibility contract, composition notes, RTL behavior, and registry file links to shared component documentation.
|
|
57
|
+
- Added searchable/copyable token pages with computed values and `var(--token)` usage syntax.
|
|
58
|
+
|
|
59
|
+
### Installation and registry
|
|
60
|
+
|
|
61
|
+
- Added Inter and IBM Plex Sans Arabic weights 400–700 automatically and composed them through font-family tokens.
|
|
62
|
+
- Removed dead `style` and `tsx` config fields; config now contains only settings the CLI honors.
|
|
63
|
+
- Added real unified diff output and SHA-256 ownership receipts for base files, components, and the generated token block.
|
|
64
|
+
- Prevented `add` and `update` from overwriting local edits without `--force`; transactions roll back on failure.
|
|
65
|
+
- Kept CSS outside the marked Banhaten token block intact and protected edits inside the generated block.
|
|
66
|
+
- Tested Vite, non-Vite/Next-style projects, dependency conflicts, JSONC aliases, unsupported Vite config rollback, npm, pnpm, Yarn, and Bun.
|
|
67
|
+
- Generated a current shadcn-compatible registry and compiled every registry component in isolation.
|
|
68
|
+
- Removed design-source ZIP archives from the published package while keeping the canonical JSON contract and required registry assets.
|
|
69
|
+
|
|
70
|
+
### Documentation and presentation
|
|
71
|
+
|
|
72
|
+
- Removed launch-blocking `noindex`, added description/social metadata, dynamic page titles, skip link, release status/version, and responsive searchable navigation.
|
|
73
|
+
- Reframed the overview around quick start, token rules, safe updates, and the now-enforced contrast contract.
|
|
74
|
+
- Added focus trap, Escape, initial focus, and focus return to Customize and Component Matrix dialogs.
|
|
75
|
+
- Completed Preview/Code tab IDs, `aria-controls`, `aria-labelledby`, roving focus, and keyboard navigation.
|
|
76
|
+
- Renamed ambiguous “Copy Page” to “Copy page link” and added clipboard fallback.
|
|
77
|
+
- Changed the CLI `docs` command from a path hint to the complete packaged component documentation plus metadata.
|
|
78
|
+
|
|
79
|
+
### Verification and release
|
|
80
|
+
|
|
81
|
+
- Browser checks cover Chromium, Firefox, and WebKit; visual baselines stay on Chromium for deterministic snapshots.
|
|
82
|
+
- Automated checks cover LTR/RTL behavior, portals, focus return, docs navigation, mobile navigation, token copy/search, live theme overrides, the 910/910 contrast totals, reduced motion, forced colors, and strict route-wide Axe findings without a color-rule exception.
|
|
83
|
+
- Bundle budgets, schema validation, token generation, token-only styling, registry mirrors, documentation coverage, CLI integration, isolated installs, package audit, and tarball contents are release gates.
|
|
84
|
+
|
|
85
|
+
## Deliberate Differences, Not Missing Copies
|
|
86
|
+
|
|
87
|
+
Banhaten does not copy shadcn’s preset marketplace, `create` templates, registry namespaces, programmatic registry API, or migration catalog for launch. Those are distribution-platform capabilities, not component-quality requirements. They belong on the roadmap only when Banhaten has a concrete consumer need and maintenance owner.
|
|
88
|
+
|
|
89
|
+
Banhaten also does not support opting out of CSS variables: the canonical token graph is the mechanism that keeps themes, Arabic typography, accessibility modes, and every component aligned. That constraint is intentional and is the core of Banhaten’s visual independence.
|
|
90
|
+
|
|
91
|
+
## Reference Benchmark
|
|
92
|
+
|
|
93
|
+
- [shadcn/ui CLI](https://ui.shadcn.com/docs/cli)
|
|
94
|
+
- [shadcn/ui registry schema](https://ui.shadcn.com/docs/registry/registry-json)
|
|
95
|
+
- [shadcn/ui registry API](https://ui.shadcn.com/docs/registry/api-reference)
|
|
96
|
+
- [shadcn/ui theming](https://ui.shadcn.com/docs/theming)
|
|
97
|
+
- [shadcn/ui RTL](https://ui.shadcn.com/docs/rtl)
|
|
98
|
+
- [shadcn/ui changelog](https://ui.shadcn.com/docs/changelog)
|
|
@@ -1,64 +1,64 @@
|
|
|
1
|
-
# Registry And CLI
|
|
2
|
-
|
|
3
|
-
Banhaten maintains one authored registry catalog and publishes two compiled
|
|
4
|
-
registry shapes.
|
|
5
|
-
|
|
6
|
-
| Artifact | Purpose |
|
|
7
|
-
| --- | --- |
|
|
8
|
-
| `registry/catalog/` | Authored base and component-owned contracts plus the intentional publication order. |
|
|
9
|
-
| `registry/index.json` | Compiled artifact consumed by the Banhaten CLI. Includes exhaustive module-aware runtime exports, non-exhaustive composition parts, files, examples, dependencies, RTL behavior, and design-system capabilities. |
|
|
10
|
-
| `registry.json` | Generated shadcn-compatible export for tools that expect `https://ui.shadcn.com/schema/registry.json`. |
|
|
11
|
-
|
|
12
|
-
Edit `registry/catalog/components/<id>.json` for a component or
|
|
13
|
-
`registry/catalog/base.json` for shared installation metadata, then run
|
|
14
|
-
`npm run registry:export` to compile `registry/index.json` and `registry.json`.
|
|
15
|
-
|
|
16
|
-
`npm run package:check` verifies the actual npm tarball rather than the
|
|
17
|
-
worktree: it extracts the archive, derives every required registry source and
|
|
18
|
-
example from the packed index, checks byte-for-byte closure, then runs the
|
|
19
|
-
packed CLI and installs the full component catalog into a clean project.
|
|
20
|
-
|
|
21
|
-
Each component groups its exhaustive runtime value API under
|
|
22
|
-
`supportedExports`, keyed by the exact registry source module that owns the
|
|
23
|
-
installed import path. The release gate resolves those modules with TypeScript
|
|
24
|
-
and rejects missing, stale, moved, type-only, or newly unlisted runtime values.
|
|
25
|
-
Run `npm run registry:exports` only after reviewing an intentional runtime API
|
|
26
|
-
change. The separate `parts` list is ordered component anatomy for examples and
|
|
27
|
-
composition; it is deliberately non-exhaustive and every part must resolve to a
|
|
28
|
-
supported runtime export.
|
|
29
|
-
|
|
30
|
-
## Generated Files
|
|
31
|
-
|
|
32
|
-
Installed files are generated source with receipt-backed ownership hashes. `banhaten add` and `banhaten update` replace a stale file automatically only when its current hash still matches the version Banhaten installed. A locally modified file stops the transaction and remains untouched unless the caller reviews `banhaten diff` and explicitly passes `--force`.
|
|
33
|
-
|
|
34
|
-
The token stylesheet is generated-owned too. `init`, `add`, and `update` refresh the marked Banhaten token block while preserving CSS outside the block. Local edits inside the marked block receive the same drift protection; place product overrides after the block.
|
|
35
|
-
|
|
36
|
-
## CLI Commands
|
|
37
|
-
|
|
38
|
-
```bash
|
|
39
|
-
npx banhaten init
|
|
40
|
-
npx banhaten add button input select
|
|
41
|
-
npx banhaten diff
|
|
42
|
-
npx banhaten update button --force
|
|
43
|
-
npx banhaten list --json
|
|
44
|
-
npx banhaten search input
|
|
45
|
-
npx banhaten docs button
|
|
46
|
-
npx banhaten view button
|
|
47
|
-
npx banhaten doctor
|
|
48
|
-
```
|
|
49
|
-
|
|
50
|
-
`doctor` is read-only. It reports installed-version drift, missing or modified
|
|
51
|
-
managed files, missing agent guidance, deprecated ambiguous props, local raw
|
|
52
|
-
control geometry, and native date/select controls that bypass the registry.
|
|
53
|
-
|
|
54
|
-
The CLI resolves one unambiguous package-manager root before printing dependency install hints. Dependency requirements use `semver` containment rather than range overlap: already-narrow consumer ranges are preserved, broader ranges are narrowed only when the complete Banhaten range fits inside them, and partial/disjoint or non-semver declarations stop atomically. A narrowed manifest always produces an install hint; an unchanged manifest suppresses that action only when bounded installed packages and a supported npm lock agree. Other lock formats remain conservative and are reconciled by their selected package manager.
|
|
55
|
-
|
|
56
|
-
## Schema Files
|
|
57
|
-
|
|
58
|
-
Schema files live in `schema/`. The CLI copies them into `.banhaten/schema/` so generated `banhaten.config.json` can use a local `$schema` path instead of a fragile external domain:
|
|
59
|
-
|
|
60
|
-
- `schema/config.schema.json`
|
|
61
|
-
- `schema/registry.schema.json`
|
|
62
|
-
- `schema/tokens.schema.json`
|
|
63
|
-
|
|
64
|
-
Do not point package metadata or generated config at `banhaten.dev` unless that domain is live and serving the schema files.
|
|
1
|
+
# Registry And CLI
|
|
2
|
+
|
|
3
|
+
Banhaten maintains one authored registry catalog and publishes two compiled
|
|
4
|
+
registry shapes.
|
|
5
|
+
|
|
6
|
+
| Artifact | Purpose |
|
|
7
|
+
| --- | --- |
|
|
8
|
+
| `registry/catalog/` | Authored base and component-owned contracts plus the intentional publication order. |
|
|
9
|
+
| `registry/index.json` | Compiled artifact consumed by the Banhaten CLI. Includes exhaustive module-aware runtime exports, non-exhaustive composition parts, files, examples, dependencies, RTL behavior, and design-system capabilities. |
|
|
10
|
+
| `registry.json` | Generated shadcn-compatible export for tools that expect `https://ui.shadcn.com/schema/registry.json`. |
|
|
11
|
+
|
|
12
|
+
Edit `registry/catalog/components/<id>.json` for a component or
|
|
13
|
+
`registry/catalog/base.json` for shared installation metadata, then run
|
|
14
|
+
`npm run registry:export` to compile `registry/index.json` and `registry.json`.
|
|
15
|
+
|
|
16
|
+
`npm run package:check` verifies the actual npm tarball rather than the
|
|
17
|
+
worktree: it extracts the archive, derives every required registry source and
|
|
18
|
+
example from the packed index, checks byte-for-byte closure, then runs the
|
|
19
|
+
packed CLI and installs the full component catalog into a clean project.
|
|
20
|
+
|
|
21
|
+
Each component groups its exhaustive runtime value API under
|
|
22
|
+
`supportedExports`, keyed by the exact registry source module that owns the
|
|
23
|
+
installed import path. The release gate resolves those modules with TypeScript
|
|
24
|
+
and rejects missing, stale, moved, type-only, or newly unlisted runtime values.
|
|
25
|
+
Run `npm run registry:exports` only after reviewing an intentional runtime API
|
|
26
|
+
change. The separate `parts` list is ordered component anatomy for examples and
|
|
27
|
+
composition; it is deliberately non-exhaustive and every part must resolve to a
|
|
28
|
+
supported runtime export.
|
|
29
|
+
|
|
30
|
+
## Generated Files
|
|
31
|
+
|
|
32
|
+
Installed files are generated source with receipt-backed ownership hashes. `banhaten add` and `banhaten update` replace a stale file automatically only when its current hash still matches the version Banhaten installed. A locally modified file stops the transaction and remains untouched unless the caller reviews `banhaten diff` and explicitly passes `--force`.
|
|
33
|
+
|
|
34
|
+
The token stylesheet is generated-owned too. `init`, `add`, and `update` refresh the marked Banhaten token block while preserving CSS outside the block. Local edits inside the marked block receive the same drift protection; place product overrides after the block.
|
|
35
|
+
|
|
36
|
+
## CLI Commands
|
|
37
|
+
|
|
38
|
+
```bash
|
|
39
|
+
npx banhaten init
|
|
40
|
+
npx banhaten add button input select
|
|
41
|
+
npx banhaten diff
|
|
42
|
+
npx banhaten update button --force
|
|
43
|
+
npx banhaten list --json
|
|
44
|
+
npx banhaten search input
|
|
45
|
+
npx banhaten docs button
|
|
46
|
+
npx banhaten view button
|
|
47
|
+
npx banhaten doctor
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
`doctor` is read-only. It reports installed-version drift, missing or modified
|
|
51
|
+
managed files, missing agent guidance, deprecated ambiguous props, local raw
|
|
52
|
+
control geometry, and native date/select controls that bypass the registry.
|
|
53
|
+
|
|
54
|
+
The CLI resolves one unambiguous package-manager root before printing dependency install hints. Dependency requirements use `semver` containment rather than range overlap: already-narrow consumer ranges are preserved, broader ranges are narrowed only when the complete Banhaten range fits inside them, and partial/disjoint or non-semver declarations stop atomically. A narrowed manifest always produces an install hint; an unchanged manifest suppresses that action only when bounded installed packages and a supported npm lock agree. Other lock formats remain conservative and are reconciled by their selected package manager.
|
|
55
|
+
|
|
56
|
+
## Schema Files
|
|
57
|
+
|
|
58
|
+
Schema files live in `schema/`. The CLI copies them into `.banhaten/schema/` so generated `banhaten.config.json` can use a local `$schema` path instead of a fragile external domain:
|
|
59
|
+
|
|
60
|
+
- `schema/config.schema.json`
|
|
61
|
+
- `schema/registry.schema.json`
|
|
62
|
+
- `schema/tokens.schema.json`
|
|
63
|
+
|
|
64
|
+
Do not point package metadata or generated config at `banhaten.dev` unless that domain is live and serving the schema files.
|
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
# Release Policy
|
|
2
|
-
|
|
3
|
-
## Stability tiers
|
|
4
|
-
|
|
5
|
-
| Tier | Promise | Documentation location |
|
|
6
|
-
| --- | --- | --- |
|
|
7
|
-
| Stable component | Supported public API, token contract, accessibility behavior, and migration notes | Components |
|
|
8
|
-
| Pattern | Supported composition with a broader layout and product-integration contract | Patterns |
|
|
9
|
-
| Lab | Evaluation or visual-QA surface; not a supported consumer API | Lab / Visual QA lab |
|
|
10
|
-
|
|
11
|
-
## Versioning
|
|
12
|
-
|
|
13
|
-
Banhaten uses semantic versioning. Before 1.0, a minor release may contain a breaking API change, but every breaking change still requires a changelog entry and migration instructions. Patch releases must remain backward compatible.
|
|
14
|
-
|
|
15
|
-
Deprecations remain documented for at least one minor release before removal. Deprecated exports keep working during that window and include a replacement path.
|
|
16
|
-
|
|
17
|
-
## Release gate
|
|
18
|
-
|
|
19
|
-
A release candidate must pass:
|
|
20
|
-
|
|
21
|
-
1. Canonical schema and token generation checks.
|
|
22
|
-
2. The component token checker with no raw-value or unresolved-variable violations.
|
|
23
|
-
3. CLI integration tests and isolated compilation for every registry component.
|
|
24
|
-
4. LTR and RTL interaction tests, accessibility checks, production build, and bundle budgets.
|
|
25
|
-
5. Documentation coverage for install, usage, examples, API, tokens, direction, accessibility, and migration impact.
|
|
26
|
-
6. Color Contrast report regeneration. Contrast failures are documented; color values change only through an explicit design decision.
|
|
27
|
-
|
|
28
|
-
## Ownership
|
|
29
|
-
|
|
30
|
-
Every release has one maintainer responsible for the registry artifact, one design reviewer for token and visual changes, and one accessibility reviewer for interaction or semantic changes. A release is not complete until the changelog and package contents are verified from a packed tarball.
|
|
1
|
+
# Release Policy
|
|
2
|
+
|
|
3
|
+
## Stability tiers
|
|
4
|
+
|
|
5
|
+
| Tier | Promise | Documentation location |
|
|
6
|
+
| --- | --- | --- |
|
|
7
|
+
| Stable component | Supported public API, token contract, accessibility behavior, and migration notes | Components |
|
|
8
|
+
| Pattern | Supported composition with a broader layout and product-integration contract | Patterns |
|
|
9
|
+
| Lab | Evaluation or visual-QA surface; not a supported consumer API | Lab / Visual QA lab |
|
|
10
|
+
|
|
11
|
+
## Versioning
|
|
12
|
+
|
|
13
|
+
Banhaten uses semantic versioning. Before 1.0, a minor release may contain a breaking API change, but every breaking change still requires a changelog entry and migration instructions. Patch releases must remain backward compatible.
|
|
14
|
+
|
|
15
|
+
Deprecations remain documented for at least one minor release before removal. Deprecated exports keep working during that window and include a replacement path.
|
|
16
|
+
|
|
17
|
+
## Release gate
|
|
18
|
+
|
|
19
|
+
A release candidate must pass:
|
|
20
|
+
|
|
21
|
+
1. Canonical schema and token generation checks.
|
|
22
|
+
2. The component token checker with no raw-value or unresolved-variable violations.
|
|
23
|
+
3. CLI integration tests and isolated compilation for every registry component.
|
|
24
|
+
4. LTR and RTL interaction tests, accessibility checks, production build, and bundle budgets.
|
|
25
|
+
5. Documentation coverage for install, usage, examples, API, tokens, direction, accessibility, and migration impact.
|
|
26
|
+
6. Color Contrast report regeneration. Contrast failures are documented; color values change only through an explicit design decision.
|
|
27
|
+
|
|
28
|
+
## Ownership
|
|
29
|
+
|
|
30
|
+
Every release has one maintainer responsible for the registry artifact, one design reviewer for token and visual changes, and one accessibility reviewer for interaction or semantic changes. A release is not complete until the changelog and package contents are verified from a packed tarball.
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
# Roadmap
|
|
2
|
-
|
|
3
|
-
The roadmap separates launch requirements from product-specific expansion. Items below are not stable APIs until they move into Components or Patterns with registry source, tokens, docs, and tests.
|
|
4
|
-
|
|
5
|
-
| Candidate | Current direction | Gate before promotion |
|
|
6
|
-
| --- | --- | --- |
|
|
7
|
-
| Drawer naming/API | Evaluate whether Sheet and Slideout already cover the use cases | Distinct semantics and migration value |
|
|
8
|
-
| Attachment/file item | Compose Item, File Upload, Progress, and actions first | Repeated product demand and a stable data model |
|
|
9
|
-
| Hijri calendar | Keep calendar formatting in the product layer for launch | Calendar-system adapter, locale rules, keyboard QA, and date-library decision |
|
|
10
|
-
| Compact density mode | Use supported component sizes | Named token mode, target-size guardrails, and full matrix QA |
|
|
11
|
-
| Additional Arabic fonts | IBM Plex Sans Arabic is the installed default | Licensing, loading cost, fallback metrics, and typography review |
|
|
12
|
-
| Framework adapters | Source installation remains framework-neutral | Maintained SSR/CSP tests and clear ownership |
|
|
13
|
-
|
|
14
|
-
Feature requests should describe the user problem, why existing primitives do not compose cleanly, accessibility requirements, direction/localization impact, and the proposed token contract.
|
|
1
|
+
# Roadmap
|
|
2
|
+
|
|
3
|
+
The roadmap separates launch requirements from product-specific expansion. Items below are not stable APIs until they move into Components or Patterns with registry source, tokens, docs, and tests.
|
|
4
|
+
|
|
5
|
+
| Candidate | Current direction | Gate before promotion |
|
|
6
|
+
| --- | --- | --- |
|
|
7
|
+
| Drawer naming/API | Evaluate whether Sheet and Slideout already cover the use cases | Distinct semantics and migration value |
|
|
8
|
+
| Attachment/file item | Compose Item, File Upload, Progress, and actions first | Repeated product demand and a stable data model |
|
|
9
|
+
| Hijri calendar | Keep calendar formatting in the product layer for launch | Calendar-system adapter, locale rules, keyboard QA, and date-library decision |
|
|
10
|
+
| Compact density mode | Use supported component sizes | Named token mode, target-size guardrails, and full matrix QA |
|
|
11
|
+
| Additional Arabic fonts | IBM Plex Sans Arabic is the installed default | Licensing, loading cost, fallback metrics, and typography review |
|
|
12
|
+
| Framework adapters | Source installation remains framework-neutral | Maintained SSR/CSP tests and clear ownership |
|
|
13
|
+
|
|
14
|
+
Feature requests should describe the user problem, why existing primitives do not compose cleanly, accessibility requirements, direction/localization impact, and the proposed token contract.
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
# Support Matrix
|
|
2
|
-
|
|
3
|
-
| Area | Launch baseline |
|
|
4
|
-
| --- | --- |
|
|
5
|
-
| React | 18.2.x and 19.x; packed registry sources compile against both compatibility floors in CI |
|
|
6
|
-
| React DOM | 18.2.x and 19.x; kept on the same major as React |
|
|
7
|
-
| Tailwind CSS | 4.x |
|
|
8
|
-
| Node | Published CLI and registry: 18.18 or newer, with packed-artifact CI on 18.18.0, 20, and 22; the private playground build toolchain runs on Node 22 |
|
|
9
|
-
| TypeScript | Bundler-style module resolution; copied source is TypeScript/TSX |
|
|
10
|
-
| Browsers | Current stable Chrome/Edge, Firefox, and Safari; previous major versions are best-effort until they are included in automated release testing |
|
|
11
|
-
| Direction | Inherited LTR and RTL; explicit component overrides where documented |
|
|
12
|
-
| Fonts | Inter for Latin and IBM Plex Sans Arabic for Arabic, installed by the CLI |
|
|
13
|
-
| Package managers | npm, pnpm, Yarn, and Bun install hints |
|
|
14
|
-
| Tooling | Vite configured automatically when detected; framework-neutral source installation otherwise |
|
|
15
|
-
|
|
16
|
-
Internet Explorer and browsers without modern CSS custom properties, logical properties, or ES2022 support are not supported. Consumer applications remain responsible for their framework’s SSR, CSP, and browser-transpilation configuration.
|
|
17
|
-
|
|
18
|
-
Release verification builds and extracts the real npm tarball, derives its
|
|
19
|
-
required registry file and example closure from the packed index, executes the
|
|
20
|
-
packed CLI from outside the repository, and installs every registry component
|
|
21
|
-
into a clean fixture. React compatibility jobs then compile that packed source
|
|
22
|
-
against exact React 18.2 and React 19 floors instead of relying only on the
|
|
23
|
-
playground lockfile.
|
|
1
|
+
# Support Matrix
|
|
2
|
+
|
|
3
|
+
| Area | Launch baseline |
|
|
4
|
+
| --- | --- |
|
|
5
|
+
| React | 18.2.x and 19.x; packed registry sources compile against both compatibility floors in CI |
|
|
6
|
+
| React DOM | 18.2.x and 19.x; kept on the same major as React |
|
|
7
|
+
| Tailwind CSS | 4.x |
|
|
8
|
+
| Node | Published CLI and registry: 18.18 or newer, with packed-artifact CI on 18.18.0, 20, and 22; the private playground build toolchain runs on Node 22 |
|
|
9
|
+
| TypeScript | Bundler-style module resolution; copied source is TypeScript/TSX |
|
|
10
|
+
| Browsers | Current stable Chrome/Edge, Firefox, and Safari; previous major versions are best-effort until they are included in automated release testing |
|
|
11
|
+
| Direction | Inherited LTR and RTL; explicit component overrides where documented |
|
|
12
|
+
| Fonts | Inter for Latin and IBM Plex Sans Arabic for Arabic, installed by the CLI |
|
|
13
|
+
| Package managers | npm, pnpm, Yarn, and Bun install hints |
|
|
14
|
+
| Tooling | Vite configured automatically when detected; framework-neutral source installation otherwise |
|
|
15
|
+
|
|
16
|
+
Internet Explorer and browsers without modern CSS custom properties, logical properties, or ES2022 support are not supported. Consumer applications remain responsible for their framework’s SSR, CSP, and browser-transpilation configuration.
|
|
17
|
+
|
|
18
|
+
Release verification builds and extracts the real npm tarball, derives its
|
|
19
|
+
required registry file and example closure from the packed index, executes the
|
|
20
|
+
packed CLI from outside the repository, and installs every registry component
|
|
21
|
+
into a clean fixture. React compatibility jobs then compile that packed source
|
|
22
|
+
against exact React 18.2 and React 19 floors instead of relying only on the
|
|
23
|
+
playground lockfile.
|
|
@@ -1,53 +1,54 @@
|
|
|
1
|
-
# Tabs
|
|
2
|
-
|
|
3
|
-
Tabs switch between peer views while keeping the user in the same context.
|
|
4
|
-
|
|
5
|
-
The implementation follows the Figma component at `Design system 3.0 Copy / Tabs` (`225:9832`). It supports every variant in the matrix: `underline`, `segment`, and `rounded`; `md`, `sm`, and `xs`; full-width and hug-content layouts; LTR and RTL.
|
|
6
|
-
|
|
7
|
-
## API
|
|
8
|
-
|
|
9
|
-
```tsx
|
|
10
|
-
<Tabs
|
|
11
|
-
variant="underline"
|
|
12
|
-
size="md"
|
|
13
|
-
fullWidth={false}
|
|
14
|
-
dir="ltr"
|
|
15
|
-
items={["Tab item", "Tab item", "Tab item", "Tab item", "Tab item"]}
|
|
16
|
-
/>
|
|
17
|
-
```
|
|
18
|
-
|
|
19
|
-
| Prop | Values | Default |
|
|
20
|
-
| --- | --- | --- |
|
|
21
|
-
| `variant` | `underline`, `segment`, `rounded` | `underline` |
|
|
22
|
-
| `size` | `md`, `sm`, `xs` | `md` |
|
|
23
|
-
| `fullWidth` | `boolean` | `false` |
|
|
24
|
-
| `dir` | `ltr`, `rtl` | `ltr` |
|
|
25
|
-
| `items` | `string[]` | five `Tab item` labels |
|
|
26
|
-
| `activeIndex` | `number` | uncontrolled |
|
|
27
|
-
| `defaultActiveIndex` | `number` | `0` |
|
|
28
|
-
| `onActiveIndexChange` | `(index: number) => void` | none |
|
|
29
|
-
|
|
30
|
-
## Token Contract
|
|
31
|
-
|
|
32
|
-
The component consumes Banhaten semantic tokens and component aliases. Do not hard-code Figma fallback literals in component source; promote any Figma value into its owned `tokens/source/` fragment as a `--bh-*` token or alias first.
|
|
33
|
-
|
|
34
|
-
- Backgrounds: `--bh-bg-neutral-subtle`, `--bh-bg-default`
|
|
35
|
-
- Borders: `--bh-border-default`
|
|
36
|
-
- Content: `--bh-content-brand-default`, `--bh-content-default`, `--bh-content-subtle`
|
|
37
|
-
- Shape: `--bh-radius-md-6`, `--bh-radius-lg-8`, `--bh-radius-full`
|
|
38
|
-
|
|
39
|
-
## Pixel Rules
|
|
40
|
-
|
|
41
|
-
- Text is Inter `15px / 24px`.
|
|
42
|
-
- Active labels use weight `500`; inactive labels use weight `400`.
|
|
43
|
-
- Segment and rounded containers use `2px` padding and `2px` item gaps.
|
|
44
|
-
- Underline containers use a `1px` default bottom border and `16px` item gaps.
|
|
45
|
-
- Active underline tabs use a `2px` `#245ded` bottom border.
|
|
46
|
-
- Segment selected tabs use a pill radius; rounded selected tabs use `6px`.
|
|
47
|
-
- Selected segment and rounded tabs use white fill plus `0 1px 1px rgba(15, 17, 20, 0.06)`.
|
|
48
|
-
- `md` segment and rounded tabs are `40px` tall inside a `44px` container.
|
|
49
|
-
- `sm` segment and rounded tabs are `36px` tall inside a `40px` container.
|
|
50
|
-
- `xs` segment and rounded tabs are `32px` tall inside a `36px` container.
|
|
51
|
-
- `md` underline rows are `56px`; `sm` and `xs` underline rows are `48px`.
|
|
52
|
-
- Full-width tabs stretch equally
|
|
53
|
-
-
|
|
1
|
+
# Tabs
|
|
2
|
+
|
|
3
|
+
Tabs switch between peer views while keeping the user in the same context.
|
|
4
|
+
|
|
5
|
+
The implementation follows the Figma component at `Design system 3.0 Copy / Tabs` (`225:9832`). It supports every variant in the matrix: `underline`, `segment`, and `rounded`; `md`, `sm`, and `xs`; full-width and hug-content layouts; LTR and RTL.
|
|
6
|
+
|
|
7
|
+
## API
|
|
8
|
+
|
|
9
|
+
```tsx
|
|
10
|
+
<Tabs
|
|
11
|
+
variant="underline"
|
|
12
|
+
size="md"
|
|
13
|
+
fullWidth={false}
|
|
14
|
+
dir="ltr"
|
|
15
|
+
items={["Tab item", "Tab item", "Tab item", "Tab item", "Tab item"]}
|
|
16
|
+
/>
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
| Prop | Values | Default |
|
|
20
|
+
| --- | --- | --- |
|
|
21
|
+
| `variant` | `underline`, `segment`, `rounded` | `underline` |
|
|
22
|
+
| `size` | `md`, `sm`, `xs` | `md` |
|
|
23
|
+
| `fullWidth` | `boolean` | `false` |
|
|
24
|
+
| `dir` | `ltr`, `rtl` | `ltr` |
|
|
25
|
+
| `items` | `string[]` | five `Tab item` labels |
|
|
26
|
+
| `activeIndex` | `number` | uncontrolled |
|
|
27
|
+
| `defaultActiveIndex` | `number` | `0` |
|
|
28
|
+
| `onActiveIndexChange` | `(index: number) => void` | none |
|
|
29
|
+
|
|
30
|
+
## Token Contract
|
|
31
|
+
|
|
32
|
+
The component consumes Banhaten semantic tokens and component aliases. Do not hard-code Figma fallback literals in component source; promote any Figma value into its owned `tokens/source/` fragment as a `--bh-*` token or alias first.
|
|
33
|
+
|
|
34
|
+
- Backgrounds: `--bh-bg-neutral-subtle`, `--bh-bg-default`
|
|
35
|
+
- Borders: `--bh-border-default`
|
|
36
|
+
- Content: `--bh-content-brand-default`, `--bh-content-default`, `--bh-content-subtle`
|
|
37
|
+
- Shape: `--bh-radius-md-6`, `--bh-radius-lg-8`, `--bh-radius-full`
|
|
38
|
+
|
|
39
|
+
## Pixel Rules
|
|
40
|
+
|
|
41
|
+
- Text is Inter `15px / 24px`.
|
|
42
|
+
- Active labels use weight `500`; inactive labels use weight `400`.
|
|
43
|
+
- Segment and rounded containers use `2px` padding and `2px` item gaps.
|
|
44
|
+
- Underline containers use a `1px` default bottom border and `16px` item gaps.
|
|
45
|
+
- Active underline tabs use a `2px` `#245ded` bottom border.
|
|
46
|
+
- Segment selected tabs use a pill radius; rounded selected tabs use `6px`.
|
|
47
|
+
- Selected segment and rounded tabs use white fill plus `0 1px 1px rgba(15, 17, 20, 0.06)`.
|
|
48
|
+
- `md` segment and rounded tabs are `40px` tall inside a `44px` container.
|
|
49
|
+
- `sm` segment and rounded tabs are `36px` tall inside a `40px` container.
|
|
50
|
+
- `xs` segment and rounded tabs are `32px` tall inside a `36px` container.
|
|
51
|
+
- `md` underline rows are `56px`; `sm` and `xs` underline rows are `48px`.
|
|
52
|
+
- Full-width tabs stretch equally while every label fits. Intrinsic label width is the minimum; narrower rows scroll horizontally instead of shrinking triggers beneath their copy.
|
|
53
|
+
- Hug-content tabs keep their intrinsic widths and use the same local horizontal overflow behavior under pressure.
|
|
54
|
+
- RTL uses `dir="rtl"` on the tablist so the active first item appears on the right edge.
|