@sableui/react 0.2.0 → 0.3.1

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 (98) hide show
  1. package/AGENTS.md +3 -1
  2. package/CHANGELOG.md +84 -0
  3. package/CONTRIBUTING.md +8 -0
  4. package/README.md +1 -0
  5. package/bin/sable-lint.mjs +0 -0
  6. package/bin/sable.mjs +68 -26
  7. package/dist/blocks/index.d.ts +396 -0
  8. package/dist/blocks/index.js +1997 -0
  9. package/dist/chunk-6LCIBMMG.js +4908 -0
  10. package/dist/{chunk-AOWBYEQ6.js → chunk-CKNM7KSB.js} +1598 -6464
  11. package/dist/{chunk-PAOZBZME.js → chunk-NGBDP3BM.js} +1 -1
  12. package/dist/{chunk-5Z5KLOAU.js → chunk-TH563WLW.js} +14 -1
  13. package/dist/chunk-WCFLQVK5.js +5097 -0
  14. package/dist/icon/index.js +2 -2
  15. package/dist/icon-sets/reicon.js +1 -1
  16. package/dist/index.d.ts +471 -34
  17. package/dist/index.js +588 -2589
  18. package/dist/ios/index.d.ts +8 -1
  19. package/dist/ios/index.js +6 -5
  20. package/dist/ios/preview.d.ts +11 -1
  21. package/dist/ios/preview.js +13 -8
  22. package/dist/ios/styles.css +14 -0
  23. package/dist/{meta-6dUzgC6M.d.ts → meta-CcE_SeFu.d.ts} +37 -1
  24. package/dist/patterns/index.d.ts +1 -1
  25. package/dist/patterns/index.js +29 -30
  26. package/dist/presets/index.js +10 -1
  27. package/dist/themes/base/base.css +23 -0
  28. package/dist/themes/index.js +2 -2
  29. package/llms/blocks/api-keys-block.md +79 -0
  30. package/llms/blocks/chat-thread-block.md +51 -0
  31. package/llms/blocks/command-palette-block.md +48 -0
  32. package/llms/blocks/cta-band-block.md +62 -0
  33. package/llms/blocks/danger-zone-block.md +69 -0
  34. package/llms/blocks/device-comparison-block.md +91 -0
  35. package/llms/blocks/event-card-block.md +84 -0
  36. package/llms/blocks/faq-block.md +72 -0
  37. package/llms/blocks/feature-grid-block.md +75 -0
  38. package/llms/blocks/feedback-form-block.md +66 -0
  39. package/llms/blocks/goal-progress-block.md +54 -0
  40. package/llms/blocks/hero-block.md +65 -0
  41. package/llms/blocks/invite-team-block.md +61 -0
  42. package/llms/blocks/invoice-history-block.md +84 -0
  43. package/llms/blocks/kpi-sparkline-block.md +57 -0
  44. package/llms/blocks/media-player-block.md +100 -0
  45. package/llms/blocks/newsletter-block.md +64 -0
  46. package/llms/blocks/not-found-block.md +56 -0
  47. package/llms/blocks/notification-list-block.md +63 -0
  48. package/llms/blocks/notification-settings-block.md +54 -0
  49. package/llms/blocks/order-tracking-block.md +62 -0
  50. package/llms/blocks/pricing-card-block.md +82 -0
  51. package/llms/blocks/pricing-table-block.md +129 -0
  52. package/llms/blocks/product-card-block.md +69 -0
  53. package/llms/blocks/profile-card-block.md +103 -0
  54. package/llms/blocks/profile-form-block.md +114 -0
  55. package/llms/blocks/revenue-breakdown-block.md +70 -0
  56. package/llms/blocks/sign-in-block.md +64 -0
  57. package/llms/blocks/sign-up-block.md +78 -0
  58. package/llms/blocks/site-footer-block.md +96 -0
  59. package/llms/blocks/stat-row-block.md +59 -0
  60. package/llms/blocks/steps-block.md +73 -0
  61. package/llms/blocks/task-list-block.md +81 -0
  62. package/llms/blocks/team-members-block.md +91 -0
  63. package/llms/blocks/testimonial-block.md +78 -0
  64. package/llms/blocks/traffic-sources-block.md +63 -0
  65. package/llms/blocks/traffic-trend-block.md +95 -0
  66. package/llms/blocks/upload-list-block.md +66 -0
  67. package/llms/blocks/verify-code-block.md +59 -0
  68. package/llms/blocks/wallet-block.md +84 -0
  69. package/llms/components/area-chart.md +112 -0
  70. package/llms/components/bar-chart.md +131 -0
  71. package/llms/components/button.md +1 -1
  72. package/llms/components/card.md +2 -2
  73. package/llms/components/context-menu.md +1 -1
  74. package/llms/components/date-tile.md +79 -0
  75. package/llms/components/entity.md +4 -2
  76. package/llms/components/line-chart.md +101 -0
  77. package/llms/components/menu.md +1 -1
  78. package/llms/components/{dots-menu.md → overflow-menu.md} +9 -9
  79. package/llms/components/pie-chart.md +103 -0
  80. package/llms/components/radar-chart.md +106 -0
  81. package/llms/components/radial-chart.md +102 -0
  82. package/llms/components/segmented-bar.md +102 -0
  83. package/llms/components/settings-menu.md +2 -2
  84. package/llms/components/sparkline.md +80 -0
  85. package/llms/components/table.md +1 -1
  86. package/llms/patterns/auth-page.md +2 -2
  87. package/llms/patterns/dashboard-page.md +6 -7
  88. package/llms/patterns/feed-page.md +7 -7
  89. package/llms/patterns/list-detail-page.md +7 -15
  90. package/llms/patterns/settings-page.md +10 -21
  91. package/llms/tasks/building-an-ios-prototype.md +4 -1
  92. package/llms/tasks/choosing-a-component.md +2 -2
  93. package/llms-full.txt +4296 -277
  94. package/llms.txt +55 -3
  95. package/package.json +5 -1
  96. package/registry.json +6383 -3741
  97. package/targets/ios.json +90 -9
  98. package/dist/{chunk-L6Y46C62.js → chunk-MXJX3NZI.js} +1 -1
package/targets/ios.json CHANGED
@@ -93,6 +93,15 @@
93
93
  ],
94
94
  "guidance": "NativeApp is the app frame (status bar, safe areas, home indicator); each screen is an IosPage; each tab keeps one NavigationStack. Screen content is Sable."
95
95
  },
96
+ "AreaChart": {
97
+ "source": "AreaChart",
98
+ "strategy": "preserve",
99
+ "importFrom": "@sableui/react",
100
+ "components": [
101
+ "AreaChart"
102
+ ],
103
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
104
+ },
96
105
  "Attachment": {
97
106
  "source": "Attachment",
98
107
  "strategy": "preserve",
@@ -129,6 +138,15 @@
129
138
  ],
130
139
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
131
140
  },
141
+ "BarChart": {
142
+ "source": "BarChart",
143
+ "strategy": "preserve",
144
+ "importFrom": "@sableui/react",
145
+ "components": [
146
+ "BarChart"
147
+ ],
148
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
149
+ },
132
150
  "BottomNav": {
133
151
  "source": "BottomNav",
134
152
  "strategy": "replace",
@@ -337,30 +355,30 @@
337
355
  ],
338
356
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
339
357
  },
340
- "DestructiveActionModal": {
341
- "source": "DestructiveActionModal",
358
+ "DateTile": {
359
+ "source": "DateTile",
342
360
  "strategy": "preserve",
343
361
  "importFrom": "@sableui/react",
344
362
  "components": [
345
- "DestructiveActionModal"
363
+ "DateTile"
346
364
  ],
347
365
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
348
366
  },
349
- "Dialog": {
350
- "source": "Dialog",
367
+ "DestructiveActionModal": {
368
+ "source": "DestructiveActionModal",
351
369
  "strategy": "preserve",
352
370
  "importFrom": "@sableui/react",
353
371
  "components": [
354
- "Dialog"
372
+ "DestructiveActionModal"
355
373
  ],
356
374
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
357
375
  },
358
- "DotsMenu": {
359
- "source": "DotsMenu",
376
+ "Dialog": {
377
+ "source": "Dialog",
360
378
  "strategy": "preserve",
361
379
  "importFrom": "@sableui/react",
362
380
  "components": [
363
- "DotsMenu"
381
+ "Dialog"
364
382
  ],
365
383
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
366
384
  },
@@ -464,6 +482,15 @@
464
482
  ],
465
483
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
466
484
  },
485
+ "LineChart": {
486
+ "source": "LineChart",
487
+ "strategy": "preserve",
488
+ "importFrom": "@sableui/react",
489
+ "components": [
490
+ "LineChart"
491
+ ],
492
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
493
+ },
467
494
  "Marker": {
468
495
  "source": "Marker",
469
496
  "strategy": "preserve",
@@ -563,6 +590,15 @@
563
590
  ],
564
591
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
565
592
  },
593
+ "OverflowMenu": {
594
+ "source": "OverflowMenu",
595
+ "strategy": "preserve",
596
+ "importFrom": "@sableui/react",
597
+ "components": [
598
+ "OverflowMenu"
599
+ ],
600
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
601
+ },
566
602
  "PageHeader": {
567
603
  "source": "PageHeader",
568
604
  "strategy": "contextual",
@@ -629,6 +665,15 @@
629
665
  "components": [],
630
666
  "guidance": "Frame a prototype with PhoneFrame from @sableui/react/ios/preview on a host page. Never draw device or browser chrome inside the app."
631
667
  },
668
+ "PieChart": {
669
+ "source": "PieChart",
670
+ "strategy": "preserve",
671
+ "importFrom": "@sableui/react",
672
+ "components": [
673
+ "PieChart"
674
+ ],
675
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
676
+ },
632
677
  "Pill": {
633
678
  "source": "Pill",
634
679
  "strategy": "preserve",
@@ -656,6 +701,24 @@
656
701
  ],
657
702
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
658
703
  },
704
+ "RadarChart": {
705
+ "source": "RadarChart",
706
+ "strategy": "preserve",
707
+ "importFrom": "@sableui/react",
708
+ "components": [
709
+ "RadarChart"
710
+ ],
711
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
712
+ },
713
+ "RadialChart": {
714
+ "source": "RadialChart",
715
+ "strategy": "preserve",
716
+ "importFrom": "@sableui/react",
717
+ "components": [
718
+ "RadialChart"
719
+ ],
720
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
721
+ },
659
722
  "Radio": {
660
723
  "source": "Radio",
661
724
  "strategy": "preserve",
@@ -708,6 +771,15 @@
708
771
  ],
709
772
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
710
773
  },
774
+ "SegmentedBar": {
775
+ "source": "SegmentedBar",
776
+ "strategy": "preserve",
777
+ "importFrom": "@sableui/react",
778
+ "components": [
779
+ "SegmentedBar"
780
+ ],
781
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
782
+ },
711
783
  "Select": {
712
784
  "source": "Select",
713
785
  "strategy": "preserve",
@@ -793,6 +865,15 @@
793
865
  ],
794
866
  "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
795
867
  },
868
+ "Sparkline": {
869
+ "source": "Sparkline",
870
+ "strategy": "preserve",
871
+ "importFrom": "@sableui/react",
872
+ "components": [
873
+ "Sparkline"
874
+ ],
875
+ "guidance": "Use the Sable component as it is, in the preset. Adapt layout and touch targets to the phone; do not swap in a native lookalike or restyle it."
876
+ },
796
877
  "Spinner": {
797
878
  "source": "Spinner",
798
879
  "strategy": "preserve",
@@ -1,10 +1,10 @@
1
+ import { prismTheme } from './chunk-7MG4SHYX.js';
1
2
  import { verdantTheme } from './chunk-KO3NAEBF.js';
2
3
  import { emberTheme } from './chunk-L4IEIQQA.js';
3
4
  import { baseTheme } from './chunk-EP55KSYA.js';
4
5
  import { poppyTheme } from './chunk-ADLLDWLW.js';
5
6
  import { meridianTheme } from './chunk-K7RUHUGC.js';
6
7
  import { atelierTheme } from './chunk-YXBOYWBN.js';
7
- import { prismTheme } from './chunk-7MG4SHYX.js';
8
8
  import { createContext, useMemo, useState, useEffect, useCallback, useContext } from 'react';
9
9
  import { jsx } from 'react/jsx-runtime';
10
10