@charcuterie/ui 1.0.1 → 2.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 (134) hide show
  1. package/dist/ColorSchemeSwitcher/ColorSchemeSwitcher.d.ts +35 -0
  2. package/dist/ColorSchemeSwitcher/ColorSchemeSwitcher.d.ts.map +1 -0
  3. package/dist/ColorSchemeSwitcher/ColorSchemeSwitcher.js +33 -0
  4. package/dist/ColorSchemeSwitcher/ColorSchemeSwitcher.js.map +1 -0
  5. package/dist/ColorSchemeToggle/ColorSchemeToggle.d.ts +54 -0
  6. package/dist/ColorSchemeToggle/ColorSchemeToggle.d.ts.map +1 -0
  7. package/dist/ColorSchemeToggle/ColorSchemeToggle.js +30 -0
  8. package/dist/ColorSchemeToggle/ColorSchemeToggle.js.map +1 -0
  9. package/dist/Combobox/Combobox.d.ts +54 -0
  10. package/dist/Combobox/Combobox.d.ts.map +1 -0
  11. package/dist/Combobox/Combobox.js +216 -0
  12. package/dist/Combobox/Combobox.js.map +1 -0
  13. package/dist/Combobox/ComboboxOption.d.ts +36 -0
  14. package/dist/Combobox/ComboboxOption.d.ts.map +1 -0
  15. package/dist/Combobox/ComboboxOption.js +32 -0
  16. package/dist/Combobox/ComboboxOption.js.map +1 -0
  17. package/dist/Dialog/Dialog.d.ts +47 -0
  18. package/dist/Dialog/Dialog.d.ts.map +1 -0
  19. package/dist/Dialog/Dialog.js +52 -0
  20. package/dist/Dialog/Dialog.js.map +1 -0
  21. package/dist/Lightbox/Lightbox.d.ts +57 -0
  22. package/dist/Lightbox/Lightbox.d.ts.map +1 -0
  23. package/dist/Lightbox/Lightbox.js +50 -0
  24. package/dist/Lightbox/Lightbox.js.map +1 -0
  25. package/dist/Listbox/Listbox.d.ts +56 -0
  26. package/dist/Listbox/Listbox.d.ts.map +1 -0
  27. package/dist/Listbox/Listbox.js +151 -0
  28. package/dist/Listbox/Listbox.js.map +1 -0
  29. package/dist/Listbox/ListboxOption.d.ts +36 -0
  30. package/dist/Listbox/ListboxOption.d.ts.map +1 -0
  31. package/dist/Listbox/ListboxOption.js +42 -0
  32. package/dist/Listbox/ListboxOption.js.map +1 -0
  33. package/dist/Menu/Menu.d.ts.map +1 -1
  34. package/dist/Menu/Menu.js +47 -97
  35. package/dist/Menu/Menu.js.map +1 -1
  36. package/dist/Modal/Modal.d.ts +11 -59
  37. package/dist/Modal/Modal.d.ts.map +1 -1
  38. package/dist/Modal/Modal.js +28 -101
  39. package/dist/Modal/Modal.js.map +1 -1
  40. package/dist/Overlay/OverlayPanel.d.ts +50 -0
  41. package/dist/Overlay/OverlayPanel.d.ts.map +1 -0
  42. package/dist/Overlay/OverlayPanel.js +72 -0
  43. package/dist/Overlay/OverlayPanel.js.map +1 -0
  44. package/dist/Overlay/OverlayStack.d.ts +47 -0
  45. package/dist/Overlay/OverlayStack.d.ts.map +1 -0
  46. package/dist/Overlay/OverlayStack.js +46 -0
  47. package/dist/Overlay/OverlayStack.js.map +1 -0
  48. package/dist/Overlay/SharedBackdrop.d.ts +24 -0
  49. package/dist/Overlay/SharedBackdrop.d.ts.map +1 -0
  50. package/dist/Overlay/SharedBackdrop.js +28 -0
  51. package/dist/Overlay/SharedBackdrop.js.map +1 -0
  52. package/dist/Overlay/lockScrollBehind.d.ts.map +1 -0
  53. package/dist/Overlay/lockScrollBehind.js.map +1 -0
  54. package/dist/Overlay/overlayPanelClass.d.ts +17 -0
  55. package/dist/Overlay/overlayPanelClass.d.ts.map +1 -0
  56. package/dist/Overlay/overlayPanelClass.js +17 -0
  57. package/dist/Overlay/overlayPanelClass.js.map +1 -0
  58. package/dist/Overlay/useAnchoredOverlay.d.ts +97 -0
  59. package/dist/Overlay/useAnchoredOverlay.d.ts.map +1 -0
  60. package/dist/Overlay/useAnchoredOverlay.js +81 -0
  61. package/dist/Overlay/useAnchoredOverlay.js.map +1 -0
  62. package/dist/Popover/Popover.d.ts +16 -24
  63. package/dist/Popover/Popover.d.ts.map +1 -1
  64. package/dist/Popover/Popover.js +32 -68
  65. package/dist/Popover/Popover.js.map +1 -1
  66. package/dist/Tooltip/Tooltip.d.ts.map +1 -1
  67. package/dist/Tooltip/Tooltip.js +25 -25
  68. package/dist/Tooltip/Tooltip.js.map +1 -1
  69. package/dist/index.d.ts +13 -1
  70. package/dist/index.d.ts.map +1 -1
  71. package/dist/index.js +6 -0
  72. package/dist/index.js.map +1 -1
  73. package/dist/mountStory.testHelpers.d.ts +1 -0
  74. package/dist/mountStory.testHelpers.d.ts.map +1 -1
  75. package/dist/mountStory.testHelpers.js +21 -1
  76. package/dist/mountStory.testHelpers.js.map +1 -1
  77. package/package.json +5 -4
  78. package/src/ColorSchemeSwitcher/ColorSchemeSwitcher.mdx +70 -0
  79. package/src/ColorSchemeSwitcher/ColorSchemeSwitcher.stories.tsx +118 -0
  80. package/src/ColorSchemeSwitcher/ColorSchemeSwitcher.test.tsx +53 -0
  81. package/src/ColorSchemeSwitcher/ColorSchemeSwitcher.tsx +90 -0
  82. package/src/ColorSchemeToggle/ColorSchemeToggle.mdx +48 -0
  83. package/src/ColorSchemeToggle/ColorSchemeToggle.stories.tsx +161 -0
  84. package/src/ColorSchemeToggle/ColorSchemeToggle.test.tsx +80 -0
  85. package/src/ColorSchemeToggle/ColorSchemeToggle.tsx +107 -0
  86. package/src/Combobox/Combobox.mdx +71 -0
  87. package/src/Combobox/Combobox.stories.tsx +245 -0
  88. package/src/Combobox/Combobox.test.tsx +289 -0
  89. package/src/Combobox/Combobox.tsx +513 -0
  90. package/src/Combobox/ComboboxOption.tsx +88 -0
  91. package/src/Dialog/Dialog.mdx +87 -0
  92. package/src/Dialog/Dialog.stories.tsx +347 -0
  93. package/src/Dialog/Dialog.test.tsx +312 -0
  94. package/src/Dialog/Dialog.tsx +127 -0
  95. package/src/Field/Field.test.tsx +6 -4
  96. package/src/Lightbox/Lightbox.mdx +63 -0
  97. package/src/Lightbox/Lightbox.stories.tsx +133 -0
  98. package/src/Lightbox/Lightbox.test.tsx +124 -0
  99. package/src/Lightbox/Lightbox.tsx +143 -0
  100. package/src/Listbox/Listbox.mdx +68 -0
  101. package/src/Listbox/Listbox.stories.tsx +205 -0
  102. package/src/Listbox/Listbox.test.tsx +198 -0
  103. package/src/Listbox/Listbox.tsx +295 -0
  104. package/src/Listbox/ListboxOption.tsx +104 -0
  105. package/src/Menu/Menu.mdx +11 -13
  106. package/src/Menu/Menu.test.tsx +47 -38
  107. package/src/Menu/Menu.tsx +81 -142
  108. package/src/Modal/Modal.mdx +29 -82
  109. package/src/Modal/Modal.stories.tsx +55 -188
  110. package/src/Modal/Modal.test.tsx +44 -177
  111. package/src/Modal/Modal.tsx +54 -204
  112. package/src/Overlay/OverlayPanel.tsx +195 -0
  113. package/src/Overlay/OverlayStack.test.tsx +235 -0
  114. package/src/Overlay/OverlayStack.tsx +132 -0
  115. package/src/Overlay/SharedBackdrop.tsx +40 -0
  116. package/src/Overlay/overlayPanelClass.ts +17 -0
  117. package/src/Overlay/useAnchoredOverlay.ts +197 -0
  118. package/src/Popover/Popover.mdx +17 -20
  119. package/src/Popover/Popover.stories.tsx +33 -0
  120. package/src/Popover/Popover.test.tsx +68 -32
  121. package/src/Popover/Popover.tsx +56 -95
  122. package/src/Tooltip/Tooltip.mdx +12 -9
  123. package/src/Tooltip/Tooltip.test.tsx +17 -19
  124. package/src/Tooltip/Tooltip.tsx +35 -32
  125. package/src/icons.storyHelpers.tsx +22 -0
  126. package/src/index.ts +22 -4
  127. package/src/mountStory.testHelpers.ts +25 -1
  128. package/src/sourceRules.test.ts +26 -1
  129. package/src/storyControls.test.ts +25 -12
  130. package/dist/Modal/lockScrollBehind.d.ts.map +0 -1
  131. package/dist/Modal/lockScrollBehind.js.map +0 -1
  132. /package/dist/{Modal → Overlay}/lockScrollBehind.d.ts +0 -0
  133. /package/dist/{Modal → Overlay}/lockScrollBehind.js +0 -0
  134. /package/src/{Modal → Overlay}/lockScrollBehind.ts +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/Tooltip/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,cAAc,EACd,aAAa,GACd,MAAM,oBAAoB,CAAA;AAE3B,OAAO,EACL,UAAU,EACV,IAAI,EACJ,MAAM,EACN,KAAK,EACL,UAAU,EACV,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,eAAe,EACf,OAAO,GACR,MAAM,oBAAoB,CAAA;AAI3B,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAwB/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,KAAK,GAAG,GAAG,EACX,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,GAAG,iBAAiB,EACP,EAAa,EAAE;IAC5B,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,aAAa,EAAE,CAAA;IAEnD,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,GAAG,WAAW,CAAC;QACpD,iEAAiE;QACjE,oBAAoB;QACpB,IAAI,EAAE,SAAS;QACf,YAAY,EAAE,YAAY;QAC1B,SAAS;QACT,UAAU,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,KAAK,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC;QACtD,QAAQ,EAAE,OAAO;QACjB,oBAAoB,EAAE,UAAU;KACjC,CAAC,CAAA;IAEF,MAAM,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,GAC3C,eAAe,CAAC;QACd,QAAQ,CAAC,OAAO,EAAE;YAChB,sDAAsD;YACtD,2DAA2D;YAC3D,uBAAuB;YACvB,IAAI,EAAE,KAAK;YACX,MAAM,EAAE,KAAK;SACd,CAAC;QACF,uDAAuD;QACvD,2DAA2D;QAC3D,iCAAiC;QACjC,QAAQ,CAAC,OAAO,CAAC;QACjB,UAAU,CAAC,OAAO,EAAE,EAAE,cAAc,EAAE,KAAK,EAAE,CAAC;QAC9C,OAAO,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;KACtC,CAAC,CAAA;IAEJ,MAAM,aAAa,GAAG,cAAc,CAClC,QAAQ;IACR,iDAAiD;IACjD,kEAAkE;IAClE,2DAA2D;IAC3D,6DAA6D;IAC7D,oCAAoC;IACpC,cAAc,CAAC,iBAAiB,EAAE;QAChC,GAAG,iBAAiB,EAAE;QACtB,GAAG,EAAE,IAAI,CAAC,YAAY;KACvB,CAAC,CACH,CAAA;IAED,OAAO,CACL,8BACG,aAAa,EAEb,SAAS,CAAC,CAAC,CAAC,CACX,iBACM,gBAAgB,EAAE,EACtB,SAAS,EAAE,WAAW;gBACpB,sDAAsD;gBACtD,oDAAoD;gBACpD,sDAAsD;gBACtD,0DAA0D;gBAC1D,oDAAoD;gBACpD,yDAAyD;gBACzD,uDAAuD;gBACvD,eAAe;gBACf,yHAAyH,EACzH,SAAS,CACV;gBACD,uDAAuD;gBACvD,0DAA0D;gBAC1D,wDAAwD;gBACxD,yDAAyD;gBACzD,4CAA4C;gBAC5C,yDAAyD;gBACzD,0DAA0D;gBAC1D,GAAG,EAAE,IAAI,CAAC,WAAW;gBACrB,yDAAyD;gBACzD,oDAAoD;gBACpD,0DAA0D;gBAC1D,2DAA2D;gBAC3D,+BAA+B;gBAC/B,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,cAAc,YAEpB,KAAK,GACF,CACP,CAAC,CAAC,CAAC,IAAI,IACP,CACJ,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/Tooltip/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,cAAc,EACd,aAAa,GACd,MAAM,oBAAoB,CAAA;AAE3B,OAAO,EACL,UAAU,EACV,cAAc,EACd,IAAI,EACJ,MAAM,EACN,KAAK,EACL,UAAU,EACV,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,eAAe,EACf,OAAO,GACR,MAAM,oBAAoB,CAAA;AAI3B,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAwB/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,KAAK,GAAG,GAAG,EACX,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,GAAG,iBAAiB,EACP,EAAa,EAAE;IAC5B,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,aAAa,EAAE,CAAA;IAEnD,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,GAAG,WAAW,CAAC;QACpD,iEAAiE;QACjE,oBAAoB;QACpB,IAAI,EAAE,SAAS;QACf,YAAY,EAAE,YAAY;QAC1B,SAAS;QACT,UAAU,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,KAAK,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC;QACtD,QAAQ,EAAE,OAAO;QACjB,oBAAoB,EAAE,UAAU;KACjC,CAAC,CAAA;IAEF,MAAM,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,GAC3C,eAAe,CAAC;QACd,QAAQ,CAAC,OAAO,EAAE;YAChB,sDAAsD;YACtD,2DAA2D;YAC3D,uBAAuB;YACvB,IAAI,EAAE,KAAK;YACX,MAAM,EAAE,KAAK;SACd,CAAC;QACF,uDAAuD;QACvD,2DAA2D;QAC3D,iCAAiC;QACjC,QAAQ,CAAC,OAAO,CAAC;QACjB,UAAU,CAAC,OAAO,EAAE,EAAE,cAAc,EAAE,KAAK,EAAE,CAAC;QAC9C,OAAO,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;KACtC,CAAC,CAAA;IAEJ,MAAM,aAAa,GAAG,cAAc,CAClC,QAAQ;IACR,iDAAiD;IACjD,kEAAkE;IAClE,2DAA2D;IAC3D,6DAA6D;IAC7D,oCAAoC;IACpC,cAAc,CAAC,iBAAiB,EAAE;QAChC,GAAG,iBAAiB,EAAE;QACtB,GAAG,EAAE,IAAI,CAAC,YAAY;KACvB,CAAC,CACH,CAAA;IAED,OAAO,CACL,8BACG,aAAa,EAEb,SAAS,CAAC,CAAC,CAAC,CACX,KAAC,cAAc,cACb,iBACM,gBAAgB,EAAE,EACtB,SAAS,EAAE,WAAW;oBACpB,sDAAsD;oBACtD,oDAAoD;oBACpD,sDAAsD;oBACtD,0DAA0D;oBAC1D,oDAAoD;oBACpD,yDAAyD;oBACzD,uDAAuD;oBACvD,eAAe;oBACf,mIAAmI,EACnI,SAAS,CACV;oBACD,yDAAyD;oBACzD,yDAAyD;oBACzD,yDAAyD;oBACzD,0DAA0D;oBAC1D,2DAA2D;oBAC3D,yDAAyD;oBACzD,iBAAiB;oBACjB,GAAG,EAAE,IAAI,CAAC,WAAW;oBACrB,yDAAyD;oBACzD,oDAAoD;oBACpD,0DAA0D;oBAC1D,2DAA2D;oBAC3D,+BAA+B;oBAC/B,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,cAAc,YAEpB,KAAK,GACF,GACS,CAClB,CAAC,CAAC,CAAC,IAAI,IACP,CACJ,CAAA;AACH,CAAC,CAAA"}
package/dist/index.d.ts CHANGED
@@ -40,8 +40,16 @@ export type { ButtonProps } from "./Button/Button.tsx";
40
40
  export { Button } from "./Button/Button.tsx";
41
41
  export type { CardPadding, CardProps, CardSurface, } from "./Card/Card.tsx";
42
42
  export { Card } from "./Card/Card.tsx";
43
+ export type { ColorSchemeSwitcherProps } from "./ColorSchemeSwitcher/ColorSchemeSwitcher.tsx";
44
+ export { ColorSchemeSwitcher } from "./ColorSchemeSwitcher/ColorSchemeSwitcher.tsx";
45
+ export type { ColorSchemeIcons, ColorSchemeToggleProps, } from "./ColorSchemeToggle/ColorSchemeToggle.tsx";
46
+ export { ColorSchemeToggle } from "./ColorSchemeToggle/ColorSchemeToggle.tsx";
47
+ export type { ComboboxProps } from "./Combobox/Combobox.tsx";
48
+ export { Combobox } from "./Combobox/Combobox.tsx";
43
49
  export type { BadgeSize } from "./controlStyles.ts";
44
50
  export { BADGE_SIZE_CLASS, CONTROL_SIZE_CLASS, DOT_SIZE_CLASS, ICON_CONTROL_SIZE_CLASS, MIN_TOUCH_TARGET_CLASS, SPINNER_SIZE_CLASS, } from "./controlStyles.ts";
51
+ export type { DialogProps, DialogSize, } from "./Dialog/Dialog.tsx";
52
+ export { Dialog } from "./Dialog/Dialog.tsx";
45
53
  export type { EmptyStateProps, EmptyStateSize, } from "./EmptyState/EmptyState.tsx";
46
54
  export { EmptyState } from "./EmptyState/EmptyState.tsx";
47
55
  export type { FieldProps } from "./Field/Field.tsx";
@@ -54,6 +62,10 @@ export type { IconButtonProps } from "./IconButton/IconButton.tsx";
54
62
  export { IconButton } from "./IconButton/IconButton.tsx";
55
63
  export type { IntentAppearance } from "./intentStyles.ts";
56
64
  export { DISABLED_CLASS, FOCUS_RING_CLASS, INTENT_APPEARANCE_CLASS, INTENT_CONTENT_CLASS, INTENT_HOVER_CLASS, INTENT_SOLID_FILL_CLASS, } from "./intentStyles.ts";
65
+ export type { LightboxProps } from "./Lightbox/Lightbox.tsx";
66
+ export { Lightbox } from "./Lightbox/Lightbox.tsx";
67
+ export type { ListboxItem, ListboxProps, } from "./Listbox/Listbox.tsx";
68
+ export { Listbox } from "./Listbox/Listbox.tsx";
57
69
  export type { LiveStatusIndicatorProps, LiveStatusIndicatorSize, } from "./LiveStatusIndicator/LiveStatusIndicator.tsx";
58
70
  export { LiveStatusIndicator } from "./LiveStatusIndicator/LiveStatusIndicator.tsx";
59
71
  export type { LogLine, LogViewerProps, } from "./LogViewer/LogViewer.tsx";
@@ -64,7 +76,7 @@ export type { MediaStatus } from "./MediaTile/mediaStatus.ts";
64
76
  export { mediaTransitions } from "./MediaTile/mediaStatus.ts";
65
77
  export type { MenuItem, MenuProps, } from "./Menu/Menu.tsx";
66
78
  export { Menu } from "./Menu/Menu.tsx";
67
- export type { ModalProps, ModalSize, } from "./Modal/Modal.tsx";
79
+ export type { ModalProps } from "./Modal/Modal.tsx";
68
80
  export { Modal } from "./Modal/Modal.tsx";
69
81
  export type { PopoverProps } from "./Popover/Popover.tsx";
70
82
  export { Popover } from "./Popover/Popover.tsx";
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
package/dist/index.js CHANGED
@@ -35,13 +35,19 @@ export { Alert } from "./Alert/Alert.js";
35
35
  export { Badge } from "./Badge/Badge.js";
36
36
  export { Button } from "./Button/Button.js";
37
37
  export { Card } from "./Card/Card.js";
38
+ export { ColorSchemeSwitcher } from "./ColorSchemeSwitcher/ColorSchemeSwitcher.js";
39
+ export { ColorSchemeToggle } from "./ColorSchemeToggle/ColorSchemeToggle.js";
40
+ export { Combobox } from "./Combobox/Combobox.js";
38
41
  export { BADGE_SIZE_CLASS, CONTROL_SIZE_CLASS, DOT_SIZE_CLASS, ICON_CONTROL_SIZE_CLASS, MIN_TOUCH_TARGET_CLASS, SPINNER_SIZE_CLASS, } from "./controlStyles.js";
42
+ export { Dialog } from "./Dialog/Dialog.js";
39
43
  export { EmptyState } from "./EmptyState/EmptyState.js";
40
44
  export { Field } from "./Field/Field.js";
41
45
  export { FieldGroup } from "./Field/FieldGroup.js";
42
46
  export { FileDropZone } from "./FileDropZone/FileDropZone.js";
43
47
  export { IconButton } from "./IconButton/IconButton.js";
44
48
  export { DISABLED_CLASS, FOCUS_RING_CLASS, INTENT_APPEARANCE_CLASS, INTENT_CONTENT_CLASS, INTENT_HOVER_CLASS, INTENT_SOLID_FILL_CLASS, } from "./intentStyles.js";
49
+ export { Lightbox } from "./Lightbox/Lightbox.js";
50
+ export { Listbox } from "./Listbox/Listbox.js";
45
51
  export { LiveStatusIndicator } from "./LiveStatusIndicator/LiveStatusIndicator.js";
46
52
  export { LogViewer } from "./LogViewer/LogViewer.js";
47
53
  export { MediaTile } from "./MediaTile/MediaTile.js";
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAOH,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA2B,CAAA;AAKrD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAmB,CAAA;AAEzC,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAmB,CAAA;AAEzC,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAqB,CAAA;AAM5C,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAiB,CAAA;AAEtC,OAAO,EACL,gBAAgB,EAChB,kBAAkB,EAClB,cAAc,EACd,uBAAuB,EACvB,sBAAsB,EACtB,kBAAkB,GACnB,MAAM,oBAAoB,CAAA;AAK3B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA6B,CAAA;AAExD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAmB,CAAA;AAEzC,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAwB,CAAA;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAiC,CAAA;AAE9D,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA6B,CAAA;AAExD,OAAO,EACL,cAAc,EACd,gBAAgB,EAChB,uBAAuB,EACvB,oBAAoB,EACpB,kBAAkB,EAClB,uBAAuB,GACxB,MAAM,mBAAmB,CAAA;AAK1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,8CAA+C,CAAA;AAKnF,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA2B,CAAA;AAKrD,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA2B,CAAA;AAErD,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAK7D,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAiB,CAAA;AAKtC,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAmB,CAAA;AAEzC,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAuB,CAAA;AAK/C,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA+B,CAAA;AAE3D,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,GAChB,MAAM,gCAAgC,CAAA;AAKvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAyC,CAAA;AAO1E,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAqB,CAAA;AAK5C,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAyB,CAAA;AAKlD,OAAO,EAAE,mBAAmB,EAAE,MAAM,8CAA+C,CAAA;AAEnF,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAuB,CAAA;AAE/C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EACL,cAAc,EACd,aAAa,EACb,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,mBAAmB,CAAA;AAO1B,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAiB,CAAA;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAmB,CAAA;AAKzC,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAyB,CAAA;AAErD,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAE5D,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAuB,CAAA;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAE9C,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAqC,CAAA"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
@@ -12,6 +12,7 @@ type MountableStory = {
12
12
  }) => Promise<void>;
13
13
  };
14
14
  export declare const mountStory: (story: MountableStory) => Promise<{
15
+ body: Canvas;
15
16
  canvas: Canvas;
16
17
  canvasElement: HTMLElement;
17
18
  }>;
@@ -1 +1 @@
1
- {"version":3,"file":"mountStory.testHelpers.d.ts","sourceRoot":"","sources":["../src/mountStory.testHelpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAEvC,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAA;AAEvC;;;;;GAKG;AACH,KAAK,cAAc,GAAG;IACpB,GAAG,EAAE,CAAC,OAAO,EAAE;QACb,aAAa,EAAE,WAAW,CAAA;KAC3B,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;CACpB,CAAA;AAqCD,eAAO,MAAM,UAAU,GACrB,OAAO,cAAc,KACpB,OAAO,CAAC;IACT,MAAM,EAAE,MAAM,CAAA;IACd,aAAa,EAAE,WAAW,CAAA;CAC3B,CAcA,CAAA"}
1
+ {"version":3,"file":"mountStory.testHelpers.d.ts","sourceRoot":"","sources":["../src/mountStory.testHelpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAEvC,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAA;AAEvC;;;;;GAKG;AACH,KAAK,cAAc,GAAG;IACpB,GAAG,EAAE,CAAC,OAAO,EAAE;QACb,aAAa,EAAE,WAAW,CAAA;KAC3B,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;CACpB,CAAA;AAkDD,eAAO,MAAM,UAAU,GACrB,OAAO,cAAc,KACpB,OAAO,CAAC;IACT,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,aAAa,EAAE,WAAW,CAAA;CAC3B,CAwBA,CAAA"}
@@ -31,16 +31,36 @@ import { within } from "storybook/test";
31
31
  * The stale tree is removed rather than unmounted because portable
32
32
  * stories expose no unmount. Detaching is enough: it takes the node
33
33
  * out of the layout, which is the entire problem.
34
+ *
35
+ * ### Portalled panels leave the canvas
36
+ *
37
+ * Once the overlays portal to `document.body`, their panels are no
38
+ * longer inside `canvasElement`, and floating-ui's portal roots
39
+ * (`[data-floating-ui-portal]`) are body children a portable story
40
+ * never unmounts. A previous test's panel therefore lingers next to
41
+ * the live one, and `expectAgentDrivable(body, …)` fails with "2
42
+ * elements match" — the portal analogue of the fixed-position
43
+ * `ToastRegion` bug above. So the same cleanup that detaches stale
44
+ * canvases also removes stale portal roots, and `mountStory` now hands
45
+ * back `body` (scoped to `document.body`) for querying the panels the
46
+ * triggers still open from inside `canvas`.
34
47
  */
35
48
  const mountedCanvases = [];
36
49
  export const mountStory = async (story) => {
37
50
  for (const previous of mountedCanvases.splice(0)) {
38
51
  previous.remove();
39
52
  }
53
+ for (const portalRoot of document.querySelectorAll("[data-floating-ui-portal]")) {
54
+ portalRoot.remove();
55
+ }
40
56
  const canvasElement = document.createElement("div");
41
57
  document.body.append(canvasElement);
42
58
  mountedCanvases.push(canvasElement);
43
59
  await story.run({ canvasElement });
44
- return { canvas: within(canvasElement), canvasElement };
60
+ return {
61
+ body: within(document.body),
62
+ canvas: within(canvasElement),
63
+ canvasElement,
64
+ };
45
65
  };
46
66
  //# sourceMappingURL=mountStory.testHelpers.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"mountStory.testHelpers.js","sourceRoot":"","sources":["../src/mountStory.testHelpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAgBvC;;;;;;;;;;GAUG;AACH;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,eAAe,GAAkB,EAAE,CAAA;AAEzC,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,EAC7B,KAAqB,EAIpB,EAAE;IACH,KAAK,MAAM,QAAQ,IAAI,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;QACjD,QAAQ,CAAC,MAAM,EAAE,CAAA;IACnB,CAAC;IAED,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;IAEnD,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,CAAA;IAEnC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;IAEnC,MAAM,KAAK,CAAC,GAAG,CAAC,EAAE,aAAa,EAAE,CAAC,CAAA;IAElC,OAAO,EAAE,MAAM,EAAE,MAAM,CAAC,aAAa,CAAC,EAAE,aAAa,EAAE,CAAA;AACzD,CAAC,CAAA"}
1
+ {"version":3,"file":"mountStory.testHelpers.js","sourceRoot":"","sources":["../src/mountStory.testHelpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAgBvC;;;;;;;;;;GAUG;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,eAAe,GAAkB,EAAE,CAAA;AAEzC,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,EAC7B,KAAqB,EAKpB,EAAE;IACH,KAAK,MAAM,QAAQ,IAAI,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;QACjD,QAAQ,CAAC,MAAM,EAAE,CAAA;IACnB,CAAC;IAED,KAAK,MAAM,UAAU,IAAI,QAAQ,CAAC,gBAAgB,CAChD,2BAA2B,CAC5B,EAAE,CAAC;QACF,UAAU,CAAC,MAAM,EAAE,CAAA;IACrB,CAAC;IAED,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;IAEnD,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,CAAA;IAEnC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;IAEnC,MAAM,KAAK,CAAC,GAAG,CAAC,EAAE,aAAa,EAAE,CAAC,CAAA;IAElC,OAAO;QACL,IAAI,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC;QAC3B,MAAM,EAAE,MAAM,CAAC,aAAa,CAAC;QAC7B,aAAa;KACd,CAAA;AACH,CAAC,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@charcuterie/ui",
3
- "version": "1.0.1",
3
+ "version": "2.0.0",
4
4
  "description": "The Charcuterie components. Tokens for look, @charcuterie/logic for state, ARIA that agents can actually drive.",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -43,9 +43,10 @@
43
43
  "typecheck": "tsc --noEmit"
44
44
  },
45
45
  "dependencies": {
46
- "@charcuterie/logic": "1.0.1",
47
- "@charcuterie/tokens": "1.0.0",
48
- "@floating-ui/react": "^0.27.20"
46
+ "@charcuterie/logic": "1.1.0",
47
+ "@charcuterie/tokens": "1.1.0",
48
+ "@floating-ui/react": "^0.27.20",
49
+ "@tanstack/react-virtual": "^3.13.12"
49
50
  },
50
51
  "peerDependencies": {
51
52
  "react": ">=19",
@@ -0,0 +1,70 @@
1
+ import { Canvas, Controls, Meta } from "@storybook/addon-docs/blocks";
2
+
3
+ import * as ColorSchemeSwitcherStories from "./ColorSchemeSwitcher.stories";
4
+
5
+ <Meta of={ColorSchemeSwitcherStories} />
6
+
7
+ # ColorSchemeSwitcher
8
+
9
+ The connected switcher — **Layer 3, and the only layer that touches the browser.** It wires
10
+ the [`useColorScheme`](/) hook to the three defaults from `@charcuterie/logic/browser`
11
+ (`matchMedia` + `localStorage` + `data-scheme` on `<html>`) and renders the presentational
12
+ [`ColorSchemeToggle`](?path=/docs/components-colorschemetoggle--docs). Drop it in and the app
13
+ follows the OS, remembers the user's choice, and re-themes with zero React re-render.
14
+
15
+ <Canvas of={ColorSchemeSwitcherStories.Default} />
16
+
17
+ ## Props
18
+
19
+ <Controls />
20
+
21
+ ## Every seam is overridable — that is the point
22
+
23
+ `resolver`, `persistence`, and `apply` all default to the browser implementations but can be
24
+ replaced. Isolating the browser dependency to this one component is what lets a **non-browser
25
+ host** reuse the entire stack unchanged.
26
+
27
+ ### Electron (`nativeTheme`) — copy-paste
28
+
29
+ The image-viewer is Electron, which owns the OS appearance through `nativeTheme`. Pass it as
30
+ the resolver and nothing else changes:
31
+
32
+ ```tsx
33
+ import { ColorSchemeSwitcher } from "@charcuterie/ui";
34
+ import type { ColorSchemeResolver } from "@charcuterie/logic";
35
+ import { nativeTheme } from "electron";
36
+ import { Monitor, Moon, Sun } from "lucide-react";
37
+
38
+ const nativeThemeResolver: ColorSchemeResolver = {
39
+ get: () => (nativeTheme.shouldUseDarkColors ? "dark" : "light"),
40
+ subscribe: (listener) => {
41
+ nativeTheme.on("updated", listener);
42
+ return () => nativeTheme.off("updated", listener);
43
+ },
44
+ };
45
+
46
+ <ColorSchemeSwitcher
47
+ resolver={nativeThemeResolver}
48
+ icons={{ light: <Sun />, dark: <Moon />, system: <Monitor /> }}
49
+ />;
50
+ ```
51
+
52
+ `persistence` and `apply` keep their browser defaults in an Electron **renderer** (it has
53
+ `localStorage` and a `document`). Only the resolver needs replacing, because only the OS
54
+ answer comes from outside the DOM.
55
+
56
+ ### React-Native — the shape
57
+
58
+ RN has no `data-scheme` and no `matchMedia`. Replace **all three** seams: a resolver over
59
+ `Appearance.getColorScheme()` / `Appearance.addChangeListener`, a persistence over
60
+ `AsyncStorage`, and an `apply` that sets a theme **context value** instead of a DOM
61
+ attribute. `ColorSchemeToggle` renders as-is; only the seams differ.
62
+
63
+ ## First paint
64
+
65
+ Following the OS/persisted choice means `<html data-scheme>` must be set **before first
66
+ paint**, or the page flashes the wrong theme for a frame. `@charcuterie/tokens` ships the
67
+ inline snippet — `buildFirstPaintScript(variant, { storageKey })`, emitted to
68
+ `dist/first-paint-script.html`. Paste it into `<head>` before any stylesheet, and keep its
69
+ `storageKey` equal to the one `localStoragePersistence(key)` uses — the shared default is
70
+ `DEFAULT_COLOR_SCHEME_STORAGE_KEY` (`"charcuterie-scheme"`), exported from both packages.
@@ -0,0 +1,118 @@
1
+ import type {
2
+ ColorSchemePersistence,
3
+ ColorSchemeResolver,
4
+ ResolvedColorScheme,
5
+ } from "@charcuterie/logic"
6
+ import type { Meta, StoryObj } from "@storybook/react"
7
+ import { useRef, useState } from "react"
8
+ import type { ColorSchemeIcons } from "../ColorSchemeToggle/ColorSchemeToggle.tsx"
9
+ import {
10
+ MonitorIcon,
11
+ MoonIcon,
12
+ SunIcon,
13
+ } from "../icons.storyHelpers.tsx"
14
+ import { ColorSchemeSwitcher } from "./ColorSchemeSwitcher.tsx"
15
+
16
+ const ICONS: ColorSchemeIcons = {
17
+ dark: <MoonIcon />,
18
+ light: <SunIcon />,
19
+ system: <MonitorIcon />,
20
+ }
21
+
22
+ /**
23
+ * A controllable stand-in for `matchMedia` — the same shape Electron
24
+ * `nativeTheme` and RN `Appearance` satisfy. The stories inject it
25
+ * instead of the real one so the board never reads the CI machine's
26
+ * OS setting and never writes `localStorage`.
27
+ */
28
+ const makeFakeResolver = (
29
+ initial: ResolvedColorScheme,
30
+ ): ColorSchemeResolver => ({
31
+ get: () => initial,
32
+ subscribe: () => () => {},
33
+ })
34
+
35
+ const inMemoryPersistence = (): ColorSchemePersistence => {
36
+ let value:
37
+ | Parameters<ColorSchemePersistence["write"]>[0]
38
+ | null = null
39
+
40
+ return {
41
+ read: () => value,
42
+ write: (mode) => {
43
+ value = mode
44
+ },
45
+ }
46
+ }
47
+
48
+ /**
49
+ * Drives a **scoped** demo: the switcher writes `data-scheme` onto
50
+ * this panel rather than `<html>`, so the surrounding Storybook
51
+ * chrome is untouched and the effect is contained and visible. In a
52
+ * real app the default `apply` targets `<html>`.
53
+ */
54
+ const ScopedSwitcherDemo = () => {
55
+ const panelRef = useRef<HTMLDivElement>(null)
56
+
57
+ const [seams] = useState(() => ({
58
+ persistence: inMemoryPersistence(),
59
+ resolver: makeFakeResolver("dark"),
60
+ }))
61
+
62
+ return (
63
+ <div
64
+ className="inline-flex items-center gap-3 rounded-lg border border-border-subtle bg-surface-base p-3 text-content-primary"
65
+ data-scheme="dark"
66
+ ref={panelRef}
67
+ >
68
+ <ColorSchemeSwitcher
69
+ apply={(resolvedScheme) => {
70
+ panelRef.current?.setAttribute(
71
+ "data-scheme",
72
+ resolvedScheme,
73
+ )
74
+ }}
75
+ icons={ICONS}
76
+ persistence={seams.persistence}
77
+ resolver={seams.resolver}
78
+ />
79
+
80
+ <span className="text-sm text-content-secondary">
81
+ This panel follows the switcher.
82
+ </span>
83
+ </div>
84
+ )
85
+ }
86
+
87
+ const meta = {
88
+ title: "Components/ColorSchemeSwitcher",
89
+ component: ColorSchemeSwitcher,
90
+ parameters: { layout: "padded" },
91
+ // The three injected seams are functions/objects, not values a
92
+ // Controls panel can render — `react-docgen` sees them as opaque
93
+ // names from `@charcuterie/logic`. Disabled explicitly rather than
94
+ // left to fall through to the object control.
95
+ argTypes: {
96
+ apply: { control: false },
97
+ persistence: { control: false },
98
+ resolver: { control: false },
99
+ },
100
+ args: {
101
+ icons: ICONS,
102
+ },
103
+ } satisfies Meta<typeof ColorSchemeSwitcher>
104
+
105
+ export default meta
106
+
107
+ type Story = StoryObj<typeof meta>
108
+
109
+ /**
110
+ * Connected: the switcher builds its own state through
111
+ * `useColorScheme` and applies the resolved scheme. Here the OS
112
+ * resolver and persistence are injected fakes and the applier is
113
+ * scoped to the demo panel, which is exactly how a non-browser host
114
+ * (Electron `nativeTheme`) wires it — by replacing those seams.
115
+ */
116
+ export const Default: Story = {
117
+ render: () => <ScopedSwitcherDemo />,
118
+ }
@@ -0,0 +1,53 @@
1
+ import { composeStories } from "@storybook/react"
2
+ import { expect, userEvent, within } from "storybook/test"
3
+ import { test } from "vitest"
4
+
5
+ import { expectNoAxeViolations } from "../expectNoAxeViolations.testHelpers.ts"
6
+ import { mountStory } from "../mountStory.testHelpers.ts"
7
+ import { expectAgentDrivable } from "../testing/index.ts"
8
+ import * as stories from "./ColorSchemeSwitcher.stories.tsx"
9
+
10
+ const { Default } = composeStories(stories)
11
+
12
+ /**
13
+ * The connected switcher is agent-drivable and cycles like the
14
+ * toggle — the extra thing proven here is that the resolved scheme
15
+ * reaches the applier: the demo panel's `data-scheme` tracks it.
16
+ */
17
+ test("it renders a named, drivable button", async () => {
18
+ const { canvas } = await mountStory(Default)
19
+
20
+ expectAgentDrivable(canvas, {
21
+ name: /colour scheme/i,
22
+ role: "button",
23
+ })
24
+ })
25
+
26
+ test("system resolves through the injected resolver to the panel", async () => {
27
+ const { canvasElement } = await mountStory(Default)
28
+
29
+ const panel = canvasElement.querySelector("[data-scheme]")
30
+
31
+ // The injected resolver answers "dark", mode starts on system.
32
+ expect(panel?.getAttribute("data-scheme")).toBe("dark")
33
+ })
34
+
35
+ test("cycling to a concrete mode re-applies the scheme", async () => {
36
+ const { canvasElement } = await mountStory(Default)
37
+
38
+ const canvas = within(canvasElement)
39
+
40
+ const button = expectAgentDrivable(canvas, {
41
+ name: /colour scheme/i,
42
+ role: "button",
43
+ })
44
+
45
+ const panel = canvasElement.querySelector("[data-scheme]")
46
+
47
+ // system → light: resolved scheme is now light regardless of OS.
48
+ await userEvent.click(button)
49
+
50
+ expect(panel?.getAttribute("data-scheme")).toBe("light")
51
+
52
+ await expectNoAxeViolations(canvasElement)
53
+ })
@@ -0,0 +1,90 @@
1
+ import type {
2
+ ColorSchemeApplier,
3
+ ColorSchemePersistence,
4
+ ColorSchemeResolver,
5
+ } from "@charcuterie/logic"
6
+ import { useColorScheme } from "@charcuterie/logic"
7
+ import {
8
+ dataSchemeApplier,
9
+ localStoragePersistence,
10
+ matchMediaResolver,
11
+ } from "@charcuterie/logic/browser"
12
+ import type { ReactNode } from "react"
13
+ import { useState } from "react"
14
+
15
+ import type {
16
+ ColorSchemeIcons,
17
+ ColorSchemeToggleProps,
18
+ } from "../ColorSchemeToggle/ColorSchemeToggle.tsx"
19
+ import { ColorSchemeToggle } from "../ColorSchemeToggle/ColorSchemeToggle.tsx"
20
+
21
+ export type ColorSchemeSwitcherProps = Pick<
22
+ ColorSchemeToggleProps,
23
+ | "appearance"
24
+ | "className"
25
+ | "isDisabled"
26
+ | "label"
27
+ | "order"
28
+ | "size"
29
+ > & {
30
+ /** Override where the resolved scheme is written. Default `<html>`. */
31
+ apply?: ColorSchemeApplier
32
+ icons: ColorSchemeIcons
33
+ /** Override persistence. Default `localStorage` under `storageKey`. */
34
+ persistence?: ColorSchemePersistence
35
+ /**
36
+ * Override the OS resolver. Default `matchMedia`. This is the seam
37
+ * the image-viewer passes Electron `nativeTheme` into, and a
38
+ * future React-Native app passes `Appearance` — the whole reason
39
+ * the browser dependency is isolated to this one layer.
40
+ */
41
+ resolver?: ColorSchemeResolver
42
+ storageKey?: string
43
+ }
44
+
45
+ /**
46
+ * The connected colour-scheme switcher — Layer 3, and the only
47
+ * layer that touches the browser.
48
+ *
49
+ * It is a thin wrapper: it wires `useColorScheme` to the three
50
+ * browser defaults from `@charcuterie/logic/browser`
51
+ * (`matchMedia` + `localStorage` + `data-scheme` on `<html>`), and
52
+ * renders the presentational `ColorSchemeToggle`. Every seam is
53
+ * overridable, so a non-browser host swaps `resolver`/`persistence`/
54
+ * `apply` and the same component drives Electron or React-Native.
55
+ *
56
+ * The seams are built once (lazy `useState`) so the `matchMedia`
57
+ * query and the core survive re-renders and StrictMode's double
58
+ * mount.
59
+ */
60
+ export const ColorSchemeSwitcher = ({
61
+ apply,
62
+ icons,
63
+ order,
64
+ persistence,
65
+ resolver,
66
+ storageKey,
67
+ ...toggleProps
68
+ }: ColorSchemeSwitcherProps): ReactNode => {
69
+ const [seams] = useState(() => ({
70
+ apply: apply ?? dataSchemeApplier(),
71
+ persistence:
72
+ persistence ?? localStoragePersistence(storageKey),
73
+ resolver: resolver ?? matchMediaResolver(),
74
+ }))
75
+
76
+ const { cycle, mode } = useColorScheme({
77
+ ...seams,
78
+ order,
79
+ })
80
+
81
+ return (
82
+ <ColorSchemeToggle
83
+ {...toggleProps}
84
+ icons={icons}
85
+ mode={mode}
86
+ onCycle={cycle}
87
+ order={order}
88
+ />
89
+ )
90
+ }
@@ -0,0 +1,48 @@
1
+ import { Canvas, Controls, Meta } from "@storybook/addon-docs/blocks";
2
+
3
+ import * as ColorSchemeToggleStories from "./ColorSchemeToggle.stories";
4
+
5
+ <Meta of={ColorSchemeToggleStories} />
6
+
7
+ # ColorSchemeToggle
8
+
9
+ The cycling colour-scheme button — **light → dark → system → light**. Layer 2 of three:
10
+ presentational and **controlled**, with no `matchMedia`, `localStorage`, or `document` in
11
+ sight. It renders the current `mode` and reports the next one through `onCycle`; it stores
12
+ nothing.
13
+
14
+ That split is deliberate. The browser dependency lives one layer up in
15
+ [`ColorSchemeSwitcher`](?path=/docs/components-colorschemeswitcher--docs), so this component
16
+ runs unchanged in any runtime — a plain React app wires `onCycle` to `useState`, an Electron
17
+ or React-Native host wires it to `useColorScheme` with its own resolver.
18
+
19
+ <Canvas of={ColorSchemeToggleStories.Default} />
20
+
21
+ ## Props
22
+
23
+ <Controls />
24
+
25
+ ## `mode` vs scheme
26
+
27
+ `mode` is the three-way user preference — `"light" | "dark" | "system"`. It is **not** a
28
+ `data-scheme` value: `data-scheme` only ever holds `"light"` or `"dark"`. Resolving
29
+ `system` to a concrete scheme is the connected layer's job, not this one's.
30
+
31
+ ## Icons are yours
32
+
33
+ The library ships **no icons**
34
+ ([decision](?path=/docs/foundations-decisions--docs)) — `icons` is a `ReactNode` per mode,
35
+ and an app passes lucide `Sun` / `Moon` / `Monitor` (the fleet recommendation). The glyph is
36
+ `aria-hidden`; the button's name comes from `label`, which states the current mode so the
37
+ control is agent-drivable and a screen reader that lands on it hears "Colour scheme: system"
38
+ rather than a nameless button.
39
+
40
+ <Canvas of={ColorSchemeToggleStories.AllModes} />
41
+
42
+ ## Cycling is the only form, for now
43
+
44
+ A segmented, all-three-visible `ColorSchemePicker` was considered and deferred (owner chose
45
+ cycling-only, 2026-08-03). `icons` and `order` are shaped so that form can be added later
46
+ without changing this API.
47
+
48
+ <Canvas of={ColorSchemeToggleStories.Sizes} />