@atom-learning/components 9.0.0 → 10.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 (197) hide show
  1. package/dist/components/alert-dialog/AlertDialog.context.js +9 -6
  2. package/dist/components/alert-dialog/AlertDialog.context.js.map +1 -1
  3. package/dist/components/alert-dialog/alert-context/reducer.js +1 -5
  4. package/dist/components/alert-dialog/alert-context/reducer.js.map +1 -1
  5. package/dist/components/alert-dialog/alert-context/types.d.ts +1 -2
  6. package/dist/components/avatar/Avatar.js +5 -6
  7. package/dist/components/avatar/Avatar.js.map +1 -1
  8. package/dist/components/avatar/AvatarIcon.js +2 -2
  9. package/dist/components/avatar/AvatarIcon.js.map +1 -1
  10. package/dist/components/avatar/AvatarInitial.js +2 -2
  11. package/dist/components/avatar/AvatarInitial.js.map +1 -1
  12. package/dist/components/badge/Badge.context.js +12 -13
  13. package/dist/components/badge/Badge.context.js.map +1 -1
  14. package/dist/components/badge/Badge.js +4 -3
  15. package/dist/components/badge/Badge.js.map +1 -1
  16. package/dist/components/badge/BadgeText.js +3 -3
  17. package/dist/components/badge/BadgeText.js.map +1 -1
  18. package/dist/components/banner/Banner.context.js +13 -14
  19. package/dist/components/banner/Banner.context.js.map +1 -1
  20. package/dist/components/banner/banner-regular/BannerRegularActions.js +2 -8
  21. package/dist/components/banner/banner-regular/BannerRegularActions.js.map +1 -1
  22. package/dist/components/banner/banner-regular/BannerRegularButton.js +2 -2
  23. package/dist/components/banner/banner-regular/BannerRegularButton.js.map +1 -1
  24. package/dist/components/banner/banner-regular/BannerRegularDismiss.js +1 -1
  25. package/dist/components/banner/banner-regular/BannerRegularDismiss.js.map +1 -1
  26. package/dist/components/banner/banner-slim/BannerSlimButton.js +2 -2
  27. package/dist/components/banner/banner-slim/BannerSlimButton.js.map +1 -1
  28. package/dist/components/banner/banner-slim/BannerSlimContainer.js +4 -13
  29. package/dist/components/banner/banner-slim/BannerSlimContainer.js.map +1 -1
  30. package/dist/components/calendar/Calendar.d.ts +1 -1
  31. package/dist/components/calendar/Calendar.js +4 -2
  32. package/dist/components/calendar/Calendar.js.map +1 -1
  33. package/dist/components/carousel/Carousel.js +2 -2
  34. package/dist/components/carousel/Carousel.js.map +1 -1
  35. package/dist/components/carousel/CarouselSlide.js +1 -1
  36. package/dist/components/carousel/CarouselSlide.js.map +1 -1
  37. package/dist/components/carousel/CarouselSlider.js +1 -1
  38. package/dist/components/carousel/CarouselSlider.js.map +1 -1
  39. package/dist/components/checkbox/Checkbox.js +2 -2
  40. package/dist/components/checkbox/Checkbox.js.map +1 -1
  41. package/dist/components/checkbox-field/CheckboxField.js +7 -3
  42. package/dist/components/checkbox-field/CheckboxField.js.map +1 -1
  43. package/dist/components/checkbox-group/CheckboxGroupAllItem.js +2 -2
  44. package/dist/components/checkbox-group/CheckboxGroupAllItem.js.map +1 -1
  45. package/dist/components/checkbox-group/CheckboxGroupChecked.context.js +13 -14
  46. package/dist/components/checkbox-group/CheckboxGroupChecked.context.js.map +1 -1
  47. package/dist/components/checkbox-group/CheckboxGroupItem.js +2 -2
  48. package/dist/components/checkbox-group/CheckboxGroupItem.js.map +1 -1
  49. package/dist/components/checkbox-group/CheckboxGroupMounted.context.js +6 -7
  50. package/dist/components/checkbox-group/CheckboxGroupMounted.context.js.map +1 -1
  51. package/dist/components/chip/Chip.js +4 -5
  52. package/dist/components/chip/Chip.js.map +1 -1
  53. package/dist/components/create-password-field/CreatePasswordField.js +1 -1
  54. package/dist/components/create-password-field/CreatePasswordField.js.map +1 -1
  55. package/dist/components/data-table/DataTable.context.js +43 -26
  56. package/dist/components/data-table/DataTable.context.js.map +1 -1
  57. package/dist/components/data-table/DataTable.types.d.ts +1 -0
  58. package/dist/components/data-table/DataTable.types.js.map +1 -1
  59. package/dist/components/data-table/DataTableBulkActionsFloating.js +2 -6
  60. package/dist/components/data-table/DataTableBulkActionsFloating.js.map +1 -1
  61. package/dist/components/data-table/DataTableGlobalFilter.js +16 -8
  62. package/dist/components/data-table/DataTableGlobalFilter.js.map +1 -1
  63. package/dist/components/data-table/DataTableHead.js +5 -14
  64. package/dist/components/data-table/DataTableHead.js.map +1 -1
  65. package/dist/components/data-table/DataTableRowSelectionCheckbox.js +1 -0
  66. package/dist/components/data-table/DataTableRowSelectionCheckbox.js.map +1 -1
  67. package/dist/components/data-table/DataTableSelectAllRowsCheckbox.js +2 -1
  68. package/dist/components/data-table/DataTableSelectAllRowsCheckbox.js.map +1 -1
  69. package/dist/components/data-table/DataTableTable.js +8 -6
  70. package/dist/components/data-table/DataTableTable.js.map +1 -1
  71. package/dist/components/data-table/drag-and-drop/DragAndDropTable.js +1 -1
  72. package/dist/components/data-table/drag-and-drop/DragAndDropTable.js.map +1 -1
  73. package/dist/components/data-table/pagination/Pagination.js +3 -2
  74. package/dist/components/data-table/pagination/Pagination.js.map +1 -1
  75. package/dist/components/data-table/usePagination.d.ts +1 -0
  76. package/dist/components/data-table/usePagination.js +7 -2
  77. package/dist/components/data-table/usePagination.js.map +1 -1
  78. package/dist/components/date-input/DateInput.js +4 -3
  79. package/dist/components/date-input/DateInput.js.map +1 -1
  80. package/dist/components/dismissible/DismissibleRoot.js +15 -16
  81. package/dist/components/dismissible/DismissibleRoot.js.map +1 -1
  82. package/dist/components/dismissible/DismissibleTrigger.js +1 -1
  83. package/dist/components/dismissible/DismissibleTrigger.js.map +1 -1
  84. package/dist/components/dismissible-group/DismissibleGroupItem.js +1 -1
  85. package/dist/components/dismissible-group/DismissibleGroupItem.js.map +1 -1
  86. package/dist/components/dismissible-group/DismissibleGroupRoot.js +5 -6
  87. package/dist/components/dismissible-group/DismissibleGroupRoot.js.map +1 -1
  88. package/dist/components/drawer/Drawer.context.js +2 -3
  89. package/dist/components/drawer/Drawer.context.js.map +1 -1
  90. package/dist/components/drawer/DrawerContent.js +1 -1
  91. package/dist/components/drawer/DrawerContent.js.map +1 -1
  92. package/dist/components/empty-state/EmptyState.context.js +2 -3
  93. package/dist/components/empty-state/EmptyState.context.js.map +1 -1
  94. package/dist/components/empty-state/EmptyStateBody.js +1 -1
  95. package/dist/components/empty-state/EmptyStateBody.js.map +1 -1
  96. package/dist/components/empty-state/EmptyStateImage.js +1 -1
  97. package/dist/components/empty-state/EmptyStateImage.js.map +1 -1
  98. package/dist/components/empty-state/EmptyStateTitle.js +1 -1
  99. package/dist/components/empty-state/EmptyStateTitle.js.map +1 -1
  100. package/dist/components/file-drop/FileDrop.js +3 -3
  101. package/dist/components/file-drop/FileDrop.js.map +1 -1
  102. package/dist/components/file-drop/useFileDrop.js +1 -1
  103. package/dist/components/file-drop/useFileDrop.js.map +1 -1
  104. package/dist/components/form/Form.js +7 -6
  105. package/dist/components/form/Form.js.map +1 -1
  106. package/dist/components/form/useFormCustomContext.js +1 -1
  107. package/dist/components/form/useFormCustomContext.js.map +1 -1
  108. package/dist/components/input/Input.js +2 -2
  109. package/dist/components/input/Input.js.map +1 -1
  110. package/dist/components/keyboard-shortcut/KeyboardShortcut.js +10 -7
  111. package/dist/components/keyboard-shortcut/KeyboardShortcut.js.map +1 -1
  112. package/dist/components/markdown-content/MarkdownContent.d.ts +1 -1
  113. package/dist/components/markdown-content/MarkdownContent.js +4 -4
  114. package/dist/components/markdown-content/MarkdownContent.js.map +1 -1
  115. package/dist/components/navigation/NavigationMenu.context.js +1 -1
  116. package/dist/components/navigation/NavigationMenu.context.js.map +1 -1
  117. package/dist/components/navigation/NavigationMenu.js +8 -7
  118. package/dist/components/navigation/NavigationMenu.js.map +1 -1
  119. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordion.d.ts +2 -2
  120. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordion.js +3 -3
  121. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordion.js.map +1 -1
  122. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionContent.js +1 -1
  123. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionContent.js.map +1 -1
  124. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.js +1 -1
  125. package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.js.map +1 -1
  126. package/dist/components/number-input/NumberInput.js +15 -16
  127. package/dist/components/number-input/NumberInput.js.map +1 -1
  128. package/dist/components/number-input-field/NumberInputField.js +7 -3
  129. package/dist/components/number-input-field/NumberInputField.js.map +1 -1
  130. package/dist/components/pagination/Pagination.context.js +29 -22
  131. package/dist/components/pagination/Pagination.context.js.map +1 -1
  132. package/dist/components/pagination/usePagination.js +1 -1
  133. package/dist/components/pagination/usePagination.js.map +1 -1
  134. package/dist/components/password-input/PasswordInput.js +1 -2
  135. package/dist/components/password-input/PasswordInput.js.map +1 -1
  136. package/dist/components/radio-button-field/RadioButtonField.js +7 -3
  137. package/dist/components/radio-button-field/RadioButtonField.js.map +1 -1
  138. package/dist/components/search-input/SearchInput.js +7 -11
  139. package/dist/components/search-input/SearchInput.js.map +1 -1
  140. package/dist/components/section-message/SectionMessage.context.js +15 -16
  141. package/dist/components/section-message/SectionMessage.context.js.map +1 -1
  142. package/dist/components/segmented-control/SegmentedControlBadge.js +1 -1
  143. package/dist/components/segmented-control/SegmentedControlBadge.js.map +1 -1
  144. package/dist/components/segmented-control/SegmentedControlDescription.js +1 -1
  145. package/dist/components/segmented-control/SegmentedControlDescription.js.map +1 -1
  146. package/dist/components/segmented-control/SegmentedControlHeading.js +1 -1
  147. package/dist/components/segmented-control/SegmentedControlHeading.js.map +1 -1
  148. package/dist/components/segmented-control/SegmentedControlIcon.js +1 -1
  149. package/dist/components/segmented-control/SegmentedControlIcon.js.map +1 -1
  150. package/dist/components/segmented-control/SegmentedControlItem.js +1 -1
  151. package/dist/components/segmented-control/SegmentedControlItem.js.map +1 -1
  152. package/dist/components/segmented-control/SegmentedControlItemList.js +20 -14
  153. package/dist/components/segmented-control/SegmentedControlItemList.js.map +1 -1
  154. package/dist/components/segmented-control/SegmentedControlRoot.js +14 -18
  155. package/dist/components/segmented-control/SegmentedControlRoot.js.map +1 -1
  156. package/dist/components/select-menu/SelectMenu.context.js +1 -1
  157. package/dist/components/select-menu/SelectMenu.context.js.map +1 -1
  158. package/dist/components/select-menu/SelectMenu.js +18 -12
  159. package/dist/components/select-menu/SelectMenu.js.map +1 -1
  160. package/dist/components/side-bar/SideBar.context.js +1 -1
  161. package/dist/components/side-bar/SideBar.context.js.map +1 -1
  162. package/dist/components/side-bar/SideBar.js +2 -2
  163. package/dist/components/side-bar/SideBar.js.map +1 -1
  164. package/dist/components/slider-field/SliderField.js +8 -3
  165. package/dist/components/slider-field/SliderField.js.map +1 -1
  166. package/dist/components/sortable/SortableRoot.js +5 -3
  167. package/dist/components/sortable/SortableRoot.js.map +1 -1
  168. package/dist/components/stepper/Stepper.context.js +38 -30
  169. package/dist/components/stepper/Stepper.context.js.map +1 -1
  170. package/dist/components/toast/Toast.context.js +1 -1
  171. package/dist/components/toast/Toast.context.js.map +1 -1
  172. package/dist/components/toast/ToastProvider.js +1 -1
  173. package/dist/components/toast/ToastProvider.js.map +1 -1
  174. package/dist/components/tree/TreeCollapsible.d.ts +2 -2
  175. package/dist/components/tree/TreeCollapsible.js +3 -3
  176. package/dist/components/tree/TreeCollapsible.js.map +1 -1
  177. package/dist/components/tree/TreeCollapsibleContent.js +1 -1
  178. package/dist/components/tree/TreeCollapsibleContent.js.map +1 -1
  179. package/dist/components/tree/TreeCollapsibleTrigger.js +1 -1
  180. package/dist/components/tree/TreeCollapsibleTrigger.js.map +1 -1
  181. package/dist/docgen.json +1 -1
  182. package/dist/index.cjs.js +520 -462
  183. package/dist/index.cjs.js.map +1 -1
  184. package/dist/styled.js +5 -1
  185. package/dist/styled.js.map +1 -1
  186. package/dist/utilities/hooks/useCallbackRef.d.ts +3 -3
  187. package/dist/utilities/hooks/useCallbackRef.js +4 -1
  188. package/dist/utilities/hooks/useCallbackRef.js.map +1 -1
  189. package/dist/utilities/hooks/useResizeObserver.js +13 -3
  190. package/dist/utilities/hooks/useResizeObserver.js.map +1 -1
  191. package/dist/utilities/hooks/useScrollPosition.js +22 -17
  192. package/dist/utilities/hooks/useScrollPosition.js.map +1 -1
  193. package/dist/utilities/hooks/useWindowScrollPosition.js +19 -15
  194. package/dist/utilities/hooks/useWindowScrollPosition.js.map +1 -1
  195. package/dist/utilities/uri/index.js +1 -6
  196. package/dist/utilities/uri/index.js.map +1 -1
  197. package/package.json +29 -31
@@ -9,27 +9,26 @@ var DismissibleRootContext = React$1.createContext({
9
9
  });
10
10
  var DismissibleRootProvider = ({ dismissed: controlledIsDismissed, children, disabled, onDismiss = () => null }) => {
11
11
  const [isDismissed, setIsDismissed] = React$1.useState(false);
12
- const value = React$1.useMemo(() => {
13
- const isControlled = typeof controlledIsDismissed === "boolean";
14
- return {
12
+ return /* @__PURE__ */ jsx(DismissibleRootContext, {
13
+ value: React$1.useMemo(() => {
14
+ const isControlled = typeof controlledIsDismissed === "boolean";
15
+ return {
16
+ disabled,
17
+ isDismissed: isControlled ? controlledIsDismissed : isDismissed,
18
+ setIsDismissed: isControlled ? () => null : setIsDismissed,
19
+ onDismiss
20
+ };
21
+ }, [
15
22
  disabled,
16
- isDismissed: isControlled ? controlledIsDismissed : isDismissed,
17
- setIsDismissed: isControlled ? () => null : setIsDismissed,
18
- onDismiss
19
- };
20
- }, [
21
- disabled,
22
- isDismissed,
23
- onDismiss,
24
- controlledIsDismissed
25
- ]);
26
- return /* @__PURE__ */ jsx(DismissibleRootContext.Provider, {
27
- value,
23
+ isDismissed,
24
+ onDismiss,
25
+ controlledIsDismissed
26
+ ]),
28
27
  children
29
28
  });
30
29
  };
31
30
  var DismissibleRootInternal = ({ asChild = false, ...rest }) => {
32
- const { isDismissed, disabled } = React$1.useContext(DismissibleRootContext);
31
+ const { isDismissed, disabled } = React$1.use(DismissibleRootContext);
33
32
  if (isDismissed) return null;
34
33
  const props = {
35
34
  ...disabled && { [`data-disabled`]: "" },
@@ -1 +1 @@
1
- {"version":3,"file":"DismissibleRoot.js","names":[],"sources":["../../../src/components/dismissible/DismissibleRoot.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nexport interface DismissibleRootContextValue {\n disabled?: boolean\n isDismissed: boolean\n setIsDismissed: (boolean) => void\n onDismiss: () => void\n}\n\nexport const DismissibleRootContext =\n React.createContext<DismissibleRootContextValue>({\n isDismissed: false,\n setIsDismissed: () => undefined,\n onDismiss: () => undefined\n })\n\nexport interface DismissibleRootProps {\n disabled?: boolean\n dismissed?: boolean\n onDismiss?: () => void\n}\n\nexport const DismissibleRootProvider = ({\n dismissed: controlledIsDismissed,\n children,\n disabled,\n onDismiss = () => null\n}: React.PropsWithChildren<DismissibleRootProps>) => {\n const [isDismissed, setIsDismissed] = React.useState(false)\n\n const value = React.useMemo<DismissibleRootContextValue>(() => {\n const isControlled = typeof controlledIsDismissed === 'boolean'\n return {\n disabled,\n isDismissed: isControlled\n ? (controlledIsDismissed as boolean)\n : isDismissed,\n setIsDismissed: isControlled ? () => null : setIsDismissed,\n onDismiss\n }\n }, [disabled, isDismissed, onDismiss, controlledIsDismissed])\n\n return (\n <DismissibleRootContext.Provider value={value}>\n {children}\n </DismissibleRootContext.Provider>\n )\n}\n\nexport interface DismissibleRootInternalProps {\n asChild?: boolean\n}\n\nconst DismissibleRootInternal = ({\n asChild = false,\n ...rest\n}: React.PropsWithChildren<DismissibleRootInternalProps>) => {\n const rootContext = React.useContext(DismissibleRootContext)\n\n const { isDismissed, disabled } = rootContext\n\n if (isDismissed) return null\n\n const props = { ...(disabled && { [`data-disabled`]: '' }), ...rest }\n const Component = asChild ? Slot : 'div'\n return <Component {...props} />\n}\n\nexport const DismissibleRoot = ({\n disabled = false,\n dismissed,\n onDismiss,\n ...rest\n}: React.PropsWithChildren<\n DismissibleRootInternalProps & DismissibleRootProps\n>) => (\n <DismissibleRootProvider\n dismissed={dismissed}\n disabled={disabled}\n onDismiss={onDismiss}\n >\n <DismissibleRootInternal {...rest} />\n </DismissibleRootProvider>\n)\n\nDismissibleRoot.displayName = 'Dismissible'\n"],"mappings":";;;;AAUA,IAAa,yBACX,QAAM,cAA2C;CAC/C,aAAa;CACb,sBAAsB,KAAA;CACtB,iBAAiB,KAAA;AACnB,CAAC;AAQH,IAAa,2BAA2B,EACtC,WAAW,uBACX,UACA,UACA,kBAAkB,WACiC;CACnD,MAAM,CAAC,aAAa,kBAAkB,QAAM,SAAS,KAAK;CAE1D,MAAM,QAAQ,QAAM,cAA2C;EAC7D,MAAM,eAAe,OAAO,0BAA0B;EACtD,OAAO;GACL;GACA,aAAa,eACR,wBACD;GACJ,gBAAgB,qBAAqB,OAAO;GAC5C;EACF;CACF,GAAG;EAAC;EAAU;EAAa;EAAW;CAAqB,CAAC;CAE5D,OACE,oBAAC,uBAAuB,UAAxB;EAAwC;EACrC;CAC8B,CAAA;AAErC;AAMA,IAAM,2BAA2B,EAC/B,UAAU,OACV,GAAG,WACwD;CAG3D,MAAM,EAAE,aAAa,aAFD,QAAM,WAAW,sBAEH;CAElC,IAAI,aAAa,OAAO;CAExB,MAAM,QAAQ;EAAE,GAAI,YAAY,GAAG,kBAAkB,GAAG;EAAI,GAAG;CAAK;CAEpE,OAAO,oBADW,UAAU,OAAO,OAC5B,EAAW,GAAI,MAAQ,CAAA;AAChC;AAEA,IAAa,mBAAmB,EAC9B,WAAW,OACX,WACA,WACA,GAAG,WAIH,oBAAC,yBAAD;CACa;CACD;CACC;WAEX,oBAAC,yBAAD,EAAyB,GAAI,KAAO,CAAA;AACb,CAAA;AAG3B,gBAAgB,cAAc"}
1
+ {"version":3,"file":"DismissibleRoot.js","names":[],"sources":["../../../src/components/dismissible/DismissibleRoot.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nexport interface DismissibleRootContextValue {\n disabled?: boolean\n isDismissed: boolean\n setIsDismissed: (boolean) => void\n onDismiss: () => void\n}\n\nexport const DismissibleRootContext =\n React.createContext<DismissibleRootContextValue>({\n isDismissed: false,\n setIsDismissed: () => undefined,\n onDismiss: () => undefined\n })\n\nexport interface DismissibleRootProps {\n disabled?: boolean\n dismissed?: boolean\n onDismiss?: () => void\n}\n\nexport const DismissibleRootProvider = ({\n dismissed: controlledIsDismissed,\n children,\n disabled,\n onDismiss = () => null\n}: React.PropsWithChildren<DismissibleRootProps>) => {\n const [isDismissed, setIsDismissed] = React.useState(false)\n\n const value = React.useMemo<DismissibleRootContextValue>(() => {\n const isControlled = typeof controlledIsDismissed === 'boolean'\n return {\n disabled,\n isDismissed: isControlled\n ? (controlledIsDismissed as boolean)\n : isDismissed,\n setIsDismissed: isControlled ? () => null : setIsDismissed,\n onDismiss\n }\n }, [disabled, isDismissed, onDismiss, controlledIsDismissed])\n\n return (\n <DismissibleRootContext value={value}>{children}</DismissibleRootContext>\n )\n}\n\nexport interface DismissibleRootInternalProps {\n asChild?: boolean\n}\n\nconst DismissibleRootInternal = ({\n asChild = false,\n ...rest\n}: React.PropsWithChildren<DismissibleRootInternalProps>) => {\n const rootContext = React.use(DismissibleRootContext)\n\n const { isDismissed, disabled } = rootContext\n\n if (isDismissed) return null\n\n const props = { ...(disabled && { [`data-disabled`]: '' }), ...rest }\n const Component = asChild ? Slot : 'div'\n return <Component {...props} />\n}\n\nexport const DismissibleRoot = ({\n disabled = false,\n dismissed,\n onDismiss,\n ...rest\n}: React.PropsWithChildren<\n DismissibleRootInternalProps & DismissibleRootProps\n>) => (\n <DismissibleRootProvider\n dismissed={dismissed}\n disabled={disabled}\n onDismiss={onDismiss}\n >\n <DismissibleRootInternal {...rest} />\n </DismissibleRootProvider>\n)\n\nDismissibleRoot.displayName = 'Dismissible'\n"],"mappings":";;;;AAUA,IAAa,yBACX,QAAM,cAA2C;CAC/C,aAAa;CACb,sBAAsB,KAAA;CACtB,iBAAiB,KAAA;AACnB,CAAC;AAQH,IAAa,2BAA2B,EACtC,WAAW,uBACX,UACA,UACA,kBAAkB,WACiC;CACnD,MAAM,CAAC,aAAa,kBAAkB,QAAM,SAAS,KAAK;CAc1D,OACE,oBAAC,wBAAD;EAA+B,OAbnB,QAAM,cAA2C;GAC7D,MAAM,eAAe,OAAO,0BAA0B;GACtD,OAAO;IACL;IACA,aAAa,eACR,wBACD;IACJ,gBAAgB,qBAAqB,OAAO;IAC5C;GACF;EACF,GAAG;GAAC;GAAU;GAAa;GAAW;EAAqB,CAG1B;EAAQ;CAAiC,CAAA;AAE5E;AAMA,IAAM,2BAA2B,EAC/B,UAAU,OACV,GAAG,WACwD;CAG3D,MAAM,EAAE,aAAa,aAFD,QAAM,IAAI,sBAEI;CAElC,IAAI,aAAa,OAAO;CAExB,MAAM,QAAQ;EAAE,GAAI,YAAY,GAAG,kBAAkB,GAAG;EAAI,GAAG;CAAK;CAEpE,OAAO,oBADW,UAAU,OAAO,OAC5B,EAAW,GAAI,MAAQ,CAAA;AAChC;AAEA,IAAa,mBAAmB,EAC9B,WAAW,OACX,WACA,WACA,GAAG,WAIH,oBAAC,yBAAD;CACa;CACD;CACC;WAEX,oBAAC,yBAAD,EAAyB,GAAI,KAAO,CAAA;AACb,CAAA;AAG3B,gBAAgB,cAAc"}
@@ -9,7 +9,7 @@ var DefaultTrigger = (props) => /* @__PURE__ */ jsx("button", {
9
9
  children: "Dismiss"
10
10
  });
11
11
  var DismissibleTrigger = ({ asChild = false, ...rest }) => {
12
- const context = React$1.useContext(DismissibleRootContext);
12
+ const context = React$1.use(DismissibleRootContext);
13
13
  if (context === void 0) throw new Error("Dismissible.Trigger can only be used within a Dismissible.Item");
14
14
  const { setIsDismissed, disabled, onDismiss } = context;
15
15
  const handleDismiss = () => {
@@ -1 +1 @@
1
- {"version":3,"file":"DismissibleTrigger.js","names":[],"sources":["../../../src/components/dismissible/DismissibleTrigger.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { DismissibleRootContext } from './DismissibleRoot'\n\nexport interface DismissibleTriggerProps {\n asChild?: boolean\n}\n\nconst DefaultTrigger = (props) => (\n <button type=\"button\" {...props}>\n Dismiss\n </button>\n)\n\nexport const DismissibleTrigger = ({\n asChild = false,\n ...rest\n}: React.PropsWithChildren<DismissibleTriggerProps>) => {\n const context = React.useContext(DismissibleRootContext)\n if (context === undefined) {\n throw new Error(\n 'Dismissible.Trigger can only be used within a Dismissible.Item'\n )\n }\n\n const { setIsDismissed, disabled, onDismiss } = context\n\n const handleDismiss = () => {\n setIsDismissed(true)\n onDismiss?.()\n }\n\n const props = {\n disabled: disabled,\n onClick: handleDismiss,\n ...rest\n }\n\n const Component = asChild ? Slot : DefaultTrigger\n return <Component {...props} />\n}\n"],"mappings":";;;;;AASA,IAAM,kBAAkB,UACtB,oBAAC,UAAD;CAAQ,MAAK;CAAS,GAAI;WAAO;AAEzB,CAAA;AAGV,IAAa,sBAAsB,EACjC,UAAU,OACV,GAAG,WACmD;CACtD,MAAM,UAAU,QAAM,WAAW,sBAAsB;CACvD,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MACR,gEACF;CAGF,MAAM,EAAE,gBAAgB,UAAU,cAAc;CAEhD,MAAM,sBAAsB;EAC1B,eAAe,IAAI;EACnB,YAAY;CACd;CAEA,MAAM,QAAQ;EACF;EACV,SAAS;EACT,GAAG;CACL;CAGA,OAAO,oBADW,UAAU,OAAO,gBAC5B,EAAW,GAAI,MAAQ,CAAA;AAChC"}
1
+ {"version":3,"file":"DismissibleTrigger.js","names":[],"sources":["../../../src/components/dismissible/DismissibleTrigger.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { DismissibleRootContext } from './DismissibleRoot'\n\nexport interface DismissibleTriggerProps {\n asChild?: boolean\n}\n\nconst DefaultTrigger = (props) => (\n <button type=\"button\" {...props}>\n Dismiss\n </button>\n)\n\nexport const DismissibleTrigger = ({\n asChild = false,\n ...rest\n}: React.PropsWithChildren<DismissibleTriggerProps>) => {\n const context = React.use(DismissibleRootContext)\n if (context === undefined) {\n throw new Error(\n 'Dismissible.Trigger can only be used within a Dismissible.Item'\n )\n }\n\n const { setIsDismissed, disabled, onDismiss } = context\n\n const handleDismiss = () => {\n setIsDismissed(true)\n onDismiss?.()\n }\n\n const props = {\n disabled: disabled,\n onClick: handleDismiss,\n ...rest\n }\n\n const Component = asChild ? Slot : DefaultTrigger\n return <Component {...props} />\n}\n"],"mappings":";;;;;AASA,IAAM,kBAAkB,UACtB,oBAAC,UAAD;CAAQ,MAAK;CAAS,GAAI;WAAO;AAEzB,CAAA;AAGV,IAAa,sBAAsB,EACjC,UAAU,OACV,GAAG,WACmD;CACtD,MAAM,UAAU,QAAM,IAAI,sBAAsB;CAChD,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MACR,gEACF;CAGF,MAAM,EAAE,gBAAgB,UAAU,cAAc;CAEhD,MAAM,sBAAsB;EAC1B,eAAe,IAAI;EACnB,YAAY;CACd;CAEA,MAAM,QAAQ;EACF;EACV,SAAS;EACT,GAAG;CACL;CAGA,OAAO,oBADW,UAAU,OAAO,gBAC5B,EAAW,GAAI,MAAQ,CAAA;AAChC"}
@@ -4,7 +4,7 @@ import * as React$1 from "react";
4
4
  import { jsx } from "react/jsx-runtime";
5
5
  //#region src/components/dismissible-group/DismissibleGroupItem.tsx
6
6
  var DismissibleGroupItem = ({ children, value, disabled: itemDisabled = false, ...rest }) => {
7
- const groupContext = React$1.useContext(DismissibleGroupContext);
7
+ const groupContext = React$1.use(DismissibleGroupContext);
8
8
  if (groupContext === void 0) throw new Error("DismissibleGroup.Item can only be used within a DismissibleGroup");
9
9
  const { onDismiss, disabled: groupDisabled } = groupContext;
10
10
  return /* @__PURE__ */ jsx(Dismissible, {
@@ -1 +1 @@
1
- {"version":3,"file":"DismissibleGroupItem.js","names":[],"sources":["../../../src/components/dismissible-group/DismissibleGroupItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dismissible } from '../dismissible'\nimport { DismissibleGroupContext } from './DismissibleGroupRoot'\n\nexport type DismissibleGroupItemProps = React.ComponentProps<\n typeof Dismissible\n> & {\n value: string | number\n disabled?: boolean\n}\n\nexport const DismissibleGroupItem = ({\n children,\n value,\n disabled: itemDisabled = false,\n ...rest\n}: React.PropsWithChildren<DismissibleGroupItemProps>) => {\n const groupContext = React.useContext(DismissibleGroupContext)\n if (groupContext === undefined) {\n throw new Error(\n 'DismissibleGroup.Item can only be used within a DismissibleGroup'\n )\n }\n const { onDismiss, disabled: groupDisabled } = groupContext\n return (\n <Dismissible\n disabled={groupDisabled || itemDisabled}\n {...rest}\n onDismiss={() => onDismiss(value)}\n >\n {children}\n </Dismissible>\n )\n}\n"],"mappings":";;;;;AAYA,IAAa,wBAAwB,EACnC,UACA,OACA,UAAU,eAAe,OACzB,GAAG,WACqD;CACxD,MAAM,eAAe,QAAM,WAAW,uBAAuB;CAC7D,IAAI,iBAAiB,KAAA,GACnB,MAAM,IAAI,MACR,kEACF;CAEF,MAAM,EAAE,WAAW,UAAU,kBAAkB;CAC/C,OACE,oBAAC,aAAD;EACE,UAAU,iBAAiB;EAC3B,GAAI;EACJ,iBAAiB,UAAU,KAAK;EAE/B;CACU,CAAA;AAEjB"}
1
+ {"version":3,"file":"DismissibleGroupItem.js","names":[],"sources":["../../../src/components/dismissible-group/DismissibleGroupItem.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Dismissible } from '../dismissible'\nimport { DismissibleGroupContext } from './DismissibleGroupRoot'\n\nexport type DismissibleGroupItemProps = React.ComponentProps<\n typeof Dismissible\n> & {\n value: string | number\n disabled?: boolean\n}\n\nexport const DismissibleGroupItem = ({\n children,\n value,\n disabled: itemDisabled = false,\n ...rest\n}: React.PropsWithChildren<DismissibleGroupItemProps>) => {\n const groupContext = React.use(DismissibleGroupContext)\n if (groupContext === undefined) {\n throw new Error(\n 'DismissibleGroup.Item can only be used within a DismissibleGroup'\n )\n }\n const { onDismiss, disabled: groupDisabled } = groupContext\n return (\n <Dismissible\n disabled={groupDisabled || itemDisabled}\n {...rest}\n onDismiss={() => onDismiss(value)}\n >\n {children}\n </Dismissible>\n )\n}\n"],"mappings":";;;;;AAYA,IAAa,wBAAwB,EACnC,UACA,OACA,UAAU,eAAe,OACzB,GAAG,WACqD;CACxD,MAAM,eAAe,QAAM,IAAI,uBAAuB;CACtD,IAAI,iBAAiB,KAAA,GACnB,MAAM,IAAI,MACR,kEACF;CAEF,MAAM,EAAE,WAAW,UAAU,kBAAkB;CAC/C,OACE,oBAAC,aAAD;EACE,UAAU,iBAAiB;EAC3B,GAAI;EACJ,iBAAiB,UAAU,KAAK;EAE/B;CACU,CAAA;AAEjB"}
@@ -3,12 +3,11 @@ import { jsx } from "react/jsx-runtime";
3
3
  //#region src/components/dismissible-group/DismissibleGroupRoot.tsx
4
4
  var DismissibleGroupContext = React$1.createContext({ onDismiss: () => null });
5
5
  var DismissibleGroupProvider = ({ children, disabled, onDismiss }) => {
6
- const value = React$1.useMemo(() => ({
7
- disabled,
8
- onDismiss
9
- }), [disabled, onDismiss]);
10
- return /* @__PURE__ */ jsx(DismissibleGroupContext.Provider, {
11
- value,
6
+ return /* @__PURE__ */ jsx(DismissibleGroupContext, {
7
+ value: React$1.useMemo(() => ({
8
+ disabled,
9
+ onDismiss
10
+ }), [disabled, onDismiss]),
12
11
  children
13
12
  });
14
13
  };
@@ -1 +1 @@
1
- {"version":3,"file":"DismissibleGroupRoot.js","names":[],"sources":["../../../src/components/dismissible-group/DismissibleGroupRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport interface DismissibleGroupContextValue {\n disabled?: boolean\n onDismiss: (value: string | number) => void\n}\nexport const DismissibleGroupContext =\n React.createContext<DismissibleGroupContextValue>({\n onDismiss: () => null\n })\n\nexport interface DismissibleGroupProps {\n disabled?: boolean\n onDismiss: (value: string | number) => void\n}\n\nexport const DismissibleGroupProvider = ({\n children,\n disabled,\n onDismiss\n}: React.PropsWithChildren<DismissibleGroupProps>) => {\n const value = React.useMemo<DismissibleGroupContextValue>(\n () => ({ disabled, onDismiss }),\n [disabled, onDismiss]\n )\n return (\n <DismissibleGroupContext.Provider value={value}>\n {children}\n </DismissibleGroupContext.Provider>\n )\n}\n\nexport interface DismissibleGroupRootProps extends DismissibleGroupProps {\n as?: React.ElementType\n ref?: React.Ref<HTMLDivElement>\n}\n\nexport const DismissibleGroupRoot = ({\n as: Component = 'div',\n disabled,\n onDismiss,\n ...rest\n}: React.PropsWithChildren<DismissibleGroupRootProps>) => (\n <DismissibleGroupProvider disabled={disabled} onDismiss={onDismiss}>\n <Component {...rest} />\n </DismissibleGroupProvider>\n)\n\nDismissibleGroupRoot.displayName = 'DismissibleGroup'\n"],"mappings":";;;AAMA,IAAa,0BACX,QAAM,cAA4C,EAChD,iBAAiB,KACnB,CAAC;AAOH,IAAa,4BAA4B,EACvC,UACA,UACA,gBACoD;CACpD,MAAM,QAAQ,QAAM,eACX;EAAE;EAAU;CAAU,IAC7B,CAAC,UAAU,SAAS,CACtB;CACA,OACE,oBAAC,wBAAwB,UAAzB;EAAyC;EACtC;CAC+B,CAAA;AAEtC;AAOA,IAAa,wBAAwB,EACnC,IAAI,YAAY,OAChB,UACA,WACA,GAAG,WAEH,oBAAC,0BAAD;CAAoC;CAAqB;WACvD,oBAAC,WAAD,EAAW,GAAI,KAAO,CAAA;AACE,CAAA;AAG5B,qBAAqB,cAAc"}
1
+ {"version":3,"file":"DismissibleGroupRoot.js","names":[],"sources":["../../../src/components/dismissible-group/DismissibleGroupRoot.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport interface DismissibleGroupContextValue {\n disabled?: boolean\n onDismiss: (value: string | number) => void\n}\nexport const DismissibleGroupContext =\n React.createContext<DismissibleGroupContextValue>({\n onDismiss: () => null\n })\n\nexport interface DismissibleGroupProps {\n disabled?: boolean\n onDismiss: (value: string | number) => void\n}\n\nexport const DismissibleGroupProvider = ({\n children,\n disabled,\n onDismiss\n}: React.PropsWithChildren<DismissibleGroupProps>) => {\n const value = React.useMemo<DismissibleGroupContextValue>(\n () => ({ disabled, onDismiss }),\n [disabled, onDismiss]\n )\n return (\n <DismissibleGroupContext value={value}>{children}</DismissibleGroupContext>\n )\n}\n\nexport interface DismissibleGroupRootProps extends DismissibleGroupProps {\n as?: React.ElementType\n ref?: React.Ref<HTMLDivElement>\n}\n\nexport const DismissibleGroupRoot = ({\n as: Component = 'div',\n disabled,\n onDismiss,\n ...rest\n}: React.PropsWithChildren<DismissibleGroupRootProps>) => (\n <DismissibleGroupProvider disabled={disabled} onDismiss={onDismiss}>\n <Component {...rest} />\n </DismissibleGroupProvider>\n)\n\nDismissibleGroupRoot.displayName = 'DismissibleGroup'\n"],"mappings":";;;AAMA,IAAa,0BACX,QAAM,cAA4C,EAChD,iBAAiB,KACnB,CAAC;AAOH,IAAa,4BAA4B,EACvC,UACA,UACA,gBACoD;CAKpD,OACE,oBAAC,yBAAD;EAAgC,OALpB,QAAM,eACX;GAAE;GAAU;EAAU,IAC7B,CAAC,UAAU,SAAS,CAGY;EAAQ;CAAkC,CAAA;AAE9E;AAOA,IAAa,wBAAwB,EACnC,IAAI,YAAY,OAChB,UACA,WACA,GAAG,WAEH,oBAAC,0BAAD;CAAoC;CAAqB;WACvD,oBAAC,WAAD,EAAW,GAAI,KAAO,CAAA;AACE,CAAA;AAG5B,qBAAqB,cAAc"}
@@ -3,9 +3,8 @@ import { jsx } from "react/jsx-runtime";
3
3
  //#region src/components/drawer/Drawer.context.tsx
4
4
  var DrawerContext = React$1.createContext({ position: "left" });
5
5
  var DrawerProvider = ({ position = "left", ...rest }) => {
6
- const value = React$1.useMemo(() => ({ position }), [position]);
7
- return /* @__PURE__ */ jsx(DrawerContext.Provider, {
8
- value,
6
+ return /* @__PURE__ */ jsx(DrawerContext, {
7
+ value: React$1.useMemo(() => ({ position }), [position]),
9
8
  ...rest
10
9
  });
11
10
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Drawer.context.js","names":[],"sources":["../../../src/components/drawer/Drawer.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { StyledContent } from './DrawerContent'\n\ntype DrawerProviderProps = {\n position?: React.ComponentProps<typeof StyledContent>['position']\n}\n\ntype DrawerContext = DrawerProviderProps\n\nexport const DrawerContext = React.createContext<DrawerContext>({\n position: 'left'\n})\n\nexport const DrawerProvider = ({\n position = 'left',\n ...rest\n}: React.PropsWithChildren<DrawerProviderProps>) => {\n const value = React.useMemo<DrawerContext>(() => ({ position }), [position])\n return <DrawerContext.Provider value={value} {...rest} />\n}\n"],"mappings":";;;AAUA,IAAa,gBAAgB,QAAM,cAA6B,EAC9D,UAAU,OACZ,CAAC;AAED,IAAa,kBAAkB,EAC7B,WAAW,QACX,GAAG,WAC+C;CAClD,MAAM,QAAQ,QAAM,eAA8B,EAAE,SAAS,IAAI,CAAC,QAAQ,CAAC;CAC3E,OAAO,oBAAC,cAAc,UAAf;EAA+B;EAAO,GAAI;CAAO,CAAA;AAC1D"}
1
+ {"version":3,"file":"Drawer.context.js","names":[],"sources":["../../../src/components/drawer/Drawer.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { StyledContent } from './DrawerContent'\n\ntype DrawerProviderProps = {\n position?: React.ComponentProps<typeof StyledContent>['position']\n}\n\ntype DrawerContext = DrawerProviderProps\n\nexport const DrawerContext = React.createContext<DrawerContext>({\n position: 'left'\n})\n\nexport const DrawerProvider = ({\n position = 'left',\n ...rest\n}: React.PropsWithChildren<DrawerProviderProps>) => {\n const value = React.useMemo<DrawerContext>(() => ({ position }), [position])\n return <DrawerContext value={value} {...rest} />\n}\n"],"mappings":";;;AAUA,IAAa,gBAAgB,QAAM,cAA6B,EAC9D,UAAU,OACZ,CAAC;AAED,IAAa,kBAAkB,EAC7B,WAAW,QACX,GAAG,WAC+C;CAElD,OAAO,oBAAC,eAAD;EAAsB,OADf,QAAM,eAA8B,EAAE,SAAS,IAAI,CAAC,QAAQ,CAC7C;EAAO,GAAI;CAAO,CAAA;AACjD"}
@@ -60,7 +60,7 @@ var StyledContent = styled(Content, {
60
60
  }
61
61
  });
62
62
  var DrawerContent = ({ children, ...rest }) => {
63
- const { position } = React$1.useContext(DrawerContext);
63
+ const { position } = React$1.use(DrawerContext);
64
64
  return /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(DrawerOverlay, {}), /* @__PURE__ */ jsx(ColorScheme, {
65
65
  base: "grey1",
66
66
  accent: "primary1",
@@ -1 +1 @@
1
- {"version":3,"file":"DrawerContent.js","names":[],"sources":["../../../src/components/drawer/DrawerContent.tsx"],"sourcesContent":["import { Content, Portal } from '@radix-ui/react-dialog'\nimport * as React from 'react'\n\nimport { ColorScheme } from '../../experiments/color-scheme/ColorScheme'\nimport { styled } from '../../styled'\nimport { DrawerContext } from './Drawer.context'\nimport { DrawerOverlay } from './DrawerOverlay'\n\nexport const StyledContent = styled(Content, {\n base: [\n 'bg-(--base-1)',\n 'shadow-lg',\n 'fixed',\n 'z-1147483646',\n 'motion-safe:data-[state=open]:animate-slide-direction-in',\n 'motion-safe:data-[state=closed]:animate-slide-direction-out'\n ],\n variants: {\n position: {\n top: [\n '[--slide-direction-out-y:-100%]',\n 'top-0',\n 'left-0',\n 'w-full',\n 'max-h-17/20'\n ],\n right: [\n '[--slide-direction-out-x:100%]',\n 'right-0',\n 'top-0',\n 'h-full',\n 'w-(--drawer-content-width,100%)',\n 'max-w-full'\n ],\n bottom: [\n '[--slide-direction-out-y:100%]',\n 'bottom-0',\n 'left-0',\n 'w-full',\n 'max-h-17/20'\n ],\n left: [\n '[--slide-direction-out-x:-100%]',\n 'left-0',\n 'top-0',\n 'h-full',\n 'w-(--drawer-content-width,100%)',\n 'max-w-full'\n ]\n },\n size: {\n xs: ['[--drawer-content-width:240px]'],\n sm: ['[--drawer-content-width:256px]'],\n md: ['[--drawer-content-width:288px]'],\n lg: ['[--drawer-content-width:304px]'],\n xl: ['[--drawer-content-width:320px]'],\n '2xl': ['[--drawer-content-width:720px]'],\n '3xl': ['[--drawer-content-width:1000px]']\n }\n }\n})\n\nexport const DrawerContent = ({\n children,\n ...rest\n}: React.ComponentProps<typeof StyledContent>) => {\n const { position } = React.useContext(DrawerContext)\n\n return (\n <Portal>\n <DrawerOverlay />\n <ColorScheme base=\"grey1\" accent=\"primary1\" asChild>\n <StyledContent size=\"lg\" position={position} {...rest} asChild>\n <div className=\"flex flex-col\">{children}</div>\n </StyledContent>\n </ColorScheme>\n </Portal>\n )\n}\n"],"mappings":";;;;;;;;AAQA,IAAa,gBAAgB,OAAO,SAAS;CAC3C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,UAAU;GACR,KAAK;IACH;IACA;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;GACF;EACF;EACA,MAAM;GACJ,IAAI,CAAC,gCAAgC;GACrC,IAAI,CAAC,gCAAgC;GACrC,IAAI,CAAC,gCAAgC;GACrC,IAAI,CAAC,gCAAgC;GACrC,IAAI,CAAC,gCAAgC;GACrC,OAAO,CAAC,gCAAgC;GACxC,OAAO,CAAC,iCAAiC;EAC3C;CACF;AACF,CAAC;AAED,IAAa,iBAAiB,EAC5B,UACA,GAAG,WAC6C;CAChD,MAAM,EAAE,aAAa,QAAM,WAAW,aAAa;CAEnD,OACE,qBAAC,QAAD,EAAA,UAAA,CACE,oBAAC,eAAD,CAAgB,CAAA,GAChB,oBAAC,aAAD;EAAa,MAAK;EAAQ,QAAO;EAAW,SAAA;YAC1C,oBAAC,eAAD;GAAe,MAAK;GAAe;GAAU,GAAI;GAAM,SAAA;aACrD,oBAAC,OAAD;IAAK,WAAU;IAAiB;GAAc,CAAA;EACjC,CAAA;CACJ,CAAA,CACP,EAAA,CAAA;AAEZ"}
1
+ {"version":3,"file":"DrawerContent.js","names":[],"sources":["../../../src/components/drawer/DrawerContent.tsx"],"sourcesContent":["import { Content, Portal } from '@radix-ui/react-dialog'\nimport * as React from 'react'\n\nimport { ColorScheme } from '../../experiments/color-scheme/ColorScheme'\nimport { styled } from '../../styled'\nimport { DrawerContext } from './Drawer.context'\nimport { DrawerOverlay } from './DrawerOverlay'\n\nexport const StyledContent = styled(Content, {\n base: [\n 'bg-(--base-1)',\n 'shadow-lg',\n 'fixed',\n 'z-1147483646',\n 'motion-safe:data-[state=open]:animate-slide-direction-in',\n 'motion-safe:data-[state=closed]:animate-slide-direction-out'\n ],\n variants: {\n position: {\n top: [\n '[--slide-direction-out-y:-100%]',\n 'top-0',\n 'left-0',\n 'w-full',\n 'max-h-17/20'\n ],\n right: [\n '[--slide-direction-out-x:100%]',\n 'right-0',\n 'top-0',\n 'h-full',\n 'w-(--drawer-content-width,100%)',\n 'max-w-full'\n ],\n bottom: [\n '[--slide-direction-out-y:100%]',\n 'bottom-0',\n 'left-0',\n 'w-full',\n 'max-h-17/20'\n ],\n left: [\n '[--slide-direction-out-x:-100%]',\n 'left-0',\n 'top-0',\n 'h-full',\n 'w-(--drawer-content-width,100%)',\n 'max-w-full'\n ]\n },\n size: {\n xs: ['[--drawer-content-width:240px]'],\n sm: ['[--drawer-content-width:256px]'],\n md: ['[--drawer-content-width:288px]'],\n lg: ['[--drawer-content-width:304px]'],\n xl: ['[--drawer-content-width:320px]'],\n '2xl': ['[--drawer-content-width:720px]'],\n '3xl': ['[--drawer-content-width:1000px]']\n }\n }\n})\n\nexport const DrawerContent = ({\n children,\n ...rest\n}: React.ComponentProps<typeof StyledContent>) => {\n const { position } = React.use(DrawerContext)\n\n return (\n <Portal>\n <DrawerOverlay />\n <ColorScheme base=\"grey1\" accent=\"primary1\" asChild>\n <StyledContent size=\"lg\" position={position} {...rest} asChild>\n <div className=\"flex flex-col\">{children}</div>\n </StyledContent>\n </ColorScheme>\n </Portal>\n )\n}\n"],"mappings":";;;;;;;;AAQA,IAAa,gBAAgB,OAAO,SAAS;CAC3C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,UAAU;GACR,KAAK;IACH;IACA;IACA;IACA;IACA;GACF;GACA,OAAO;IACL;IACA;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;GACF;GACA,MAAM;IACJ;IACA;IACA;IACA;IACA;IACA;GACF;EACF;EACA,MAAM;GACJ,IAAI,CAAC,gCAAgC;GACrC,IAAI,CAAC,gCAAgC;GACrC,IAAI,CAAC,gCAAgC;GACrC,IAAI,CAAC,gCAAgC;GACrC,IAAI,CAAC,gCAAgC;GACrC,OAAO,CAAC,gCAAgC;GACxC,OAAO,CAAC,iCAAiC;EAC3C;CACF;AACF,CAAC;AAED,IAAa,iBAAiB,EAC5B,UACA,GAAG,WAC6C;CAChD,MAAM,EAAE,aAAa,QAAM,IAAI,aAAa;CAE5C,OACE,qBAAC,QAAD,EAAA,UAAA,CACE,oBAAC,eAAD,CAAgB,CAAA,GAChB,oBAAC,aAAD;EAAa,MAAK;EAAQ,QAAO;EAAW,SAAA;YAC1C,oBAAC,eAAD;GAAe,MAAK;GAAe;GAAU,GAAI;GAAM,SAAA;aACrD,oBAAC,OAAD;IAAK,WAAU;IAAiB;GAAc,CAAA;EACjC,CAAA;CACJ,CAAA,CACP,EAAA,CAAA;AAEZ"}
@@ -3,9 +3,8 @@ import { jsx } from "react/jsx-runtime";
3
3
  //#region src/components/empty-state/EmptyState.context.tsx
4
4
  var EmptyStateContext = React$1.createContext({});
5
5
  var EmptyStateProvider = ({ size, children }) => {
6
- const value = React$1.useMemo(() => ({ size }), [size]);
7
- return /* @__PURE__ */ jsx(EmptyStateContext.Provider, {
8
- value,
6
+ return /* @__PURE__ */ jsx(EmptyStateContext, {
7
+ value: React$1.useMemo(() => ({ size }), [size]),
9
8
  children
10
9
  });
11
10
  };
@@ -1 +1 @@
1
- {"version":3,"file":"EmptyState.context.js","names":[],"sources":["../../../src/components/empty-state/EmptyState.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { EmptyStateProps } from './EmptyState'\n\ntype EmptyStateProviderProps = {\n size?: EmptyStateProps['size']\n}\n\ntype EmptyStateContextValue = EmptyStateProviderProps\n\nexport const EmptyStateContext = React.createContext<EmptyStateContextValue>({})\n\nexport const EmptyStateProvider = ({\n size,\n children\n}: React.PropsWithChildren<EmptyStateProviderProps>) => {\n const value = React.useMemo<EmptyStateContextValue>(() => ({ size }), [size])\n return (\n <EmptyStateContext.Provider value={value}>\n {children}\n </EmptyStateContext.Provider>\n )\n}\n"],"mappings":";;;AAUA,IAAa,oBAAoB,QAAM,cAAsC,CAAC,CAAC;AAE/E,IAAa,sBAAsB,EACjC,MACA,eACsD;CACtD,MAAM,QAAQ,QAAM,eAAuC,EAAE,KAAK,IAAI,CAAC,IAAI,CAAC;CAC5E,OACE,oBAAC,kBAAkB,UAAnB;EAAmC;EAChC;CACyB,CAAA;AAEhC"}
1
+ {"version":3,"file":"EmptyState.context.js","names":[],"sources":["../../../src/components/empty-state/EmptyState.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { EmptyStateProps } from './EmptyState'\n\ntype EmptyStateProviderProps = {\n size?: EmptyStateProps['size']\n}\n\ntype EmptyStateContextValue = EmptyStateProviderProps\n\nexport const EmptyStateContext = React.createContext<EmptyStateContextValue>({})\n\nexport const EmptyStateProvider = ({\n size,\n children\n}: React.PropsWithChildren<EmptyStateProviderProps>) => {\n const value = React.useMemo<EmptyStateContextValue>(() => ({ size }), [size])\n return <EmptyStateContext value={value}>{children}</EmptyStateContext>\n}\n"],"mappings":";;;AAUA,IAAa,oBAAoB,QAAM,cAAsC,CAAC,CAAC;AAE/E,IAAa,sBAAsB,EACjC,MACA,eACsD;CAEtD,OAAO,oBAAC,mBAAD;EAA0B,OADnB,QAAM,eAAuC,EAAE,KAAK,IAAI,CAAC,IAAI,CAC1C;EAAQ;CAA4B,CAAA;AACvE"}
@@ -15,7 +15,7 @@ var StyledEmptyStateBody = styled(Text, {
15
15
  } }
16
16
  }, { enableResponsiveVariants: true });
17
17
  var EmptyStateBody = (props) => {
18
- const { size } = React$1.useContext(EmptyStateContext);
18
+ const { size } = React$1.use(EmptyStateContext);
19
19
  return /* @__PURE__ */ jsx(StyledEmptyStateBody, {
20
20
  ...props,
21
21
  size
@@ -1 +1 @@
1
- {"version":3,"file":"EmptyStateBody.js","names":[],"sources":["../../../src/components/empty-state/EmptyStateBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Text } from '../text/Text'\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateBody = styled(\n Text,\n {\n base: ['text-grey-800', 'font-normal'],\n variants: {\n size: {\n xs: ['mb-4', 'text-sm'],\n sm: ['mb-4', 'text-sm'],\n md: ['mb-4', 'text-sm'],\n lg: ['mb-6', 'text-md'],\n xl: ['mb-6', 'text-md']\n }\n }\n },\n { enableResponsiveVariants: true }\n)\n\ntype EmptyStateBodyProps = React.ComponentProps<typeof StyledEmptyStateBody>\n\nexport const EmptyStateBody = (props: EmptyStateBodyProps) => {\n const { size } = React.useContext(EmptyStateContext)\n return <StyledEmptyStateBody {...props} size={size} />\n}\n"],"mappings":";;;;;;AAMA,IAAM,uBAAuB,OAC3B,MACA;CACE,MAAM,CAAC,iBAAiB,aAAa;CACrC,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;CACxB,EACF;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAIA,IAAa,kBAAkB,UAA+B;CAC5D,MAAM,EAAE,SAAS,QAAM,WAAW,iBAAiB;CACnD,OAAO,oBAAC,sBAAD;EAAsB,GAAI;EAAa;CAAO,CAAA;AACvD"}
1
+ {"version":3,"file":"EmptyStateBody.js","names":[],"sources":["../../../src/components/empty-state/EmptyStateBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Text } from '../text/Text'\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateBody = styled(\n Text,\n {\n base: ['text-grey-800', 'font-normal'],\n variants: {\n size: {\n xs: ['mb-4', 'text-sm'],\n sm: ['mb-4', 'text-sm'],\n md: ['mb-4', 'text-sm'],\n lg: ['mb-6', 'text-md'],\n xl: ['mb-6', 'text-md']\n }\n }\n },\n { enableResponsiveVariants: true }\n)\n\ntype EmptyStateBodyProps = React.ComponentProps<typeof StyledEmptyStateBody>\n\nexport const EmptyStateBody = (props: EmptyStateBodyProps) => {\n const { size } = React.use(EmptyStateContext)\n return <StyledEmptyStateBody {...props} size={size} />\n}\n"],"mappings":";;;;;;AAMA,IAAM,uBAAuB,OAC3B,MACA;CACE,MAAM,CAAC,iBAAiB,aAAa;CACrC,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;CACxB,EACF;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAIA,IAAa,kBAAkB,UAA+B;CAC5D,MAAM,EAAE,SAAS,QAAM,IAAI,iBAAiB;CAC5C,OAAO,oBAAC,sBAAD;EAAsB,GAAI;EAAa;CAAO,CAAA;AACvD"}
@@ -35,7 +35,7 @@ var StyledEmptyStateImage = styled(Image, {
35
35
  } }
36
36
  }, { enableResponsiveVariants: true });
37
37
  var EmptyStateImage = (props) => {
38
- const { size } = React$1.useContext(EmptyStateContext);
38
+ const { size } = React$1.use(EmptyStateContext);
39
39
  return /* @__PURE__ */ jsx(StyledEmptyStateImage, {
40
40
  size,
41
41
  ...props
@@ -1 +1 @@
1
- {"version":3,"file":"EmptyStateImage.js","names":[],"sources":["../../../src/components/empty-state/EmptyStateImage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Image } from '../image/Image'\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateImage = styled(\n Image,\n {\n base: [],\n variants: {\n size: {\n xs: ['max-h-8', 'max-w-14', 'mb-4'],\n sm: ['max-h-12', 'max-w-21', 'mb-4'],\n md: ['max-h-18', 'max-w-[126px]', 'mb-4'],\n lg: ['max-h-[142px]', 'max-w-[190px]', 'mb-6'],\n xl: ['max-h-[213px]', 'max-w-[285px]', 'mb-6']\n }\n }\n },\n { enableResponsiveVariants: true }\n)\n\ntype EmptyStateImageProps = React.ComponentProps<typeof StyledEmptyStateImage>\n\nexport const EmptyStateImage = (props: EmptyStateImageProps) => {\n const { size } = React.useContext(EmptyStateContext)\n return <StyledEmptyStateImage size={size} {...props} />\n}\n"],"mappings":";;;;;;AAMA,IAAM,wBAAwB,OAC5B,OACA;CACE,MAAM,CAAC;CACP,UAAU,EACR,MAAM;EACJ,IAAI;GAAC;GAAW;GAAY;EAAM;EAClC,IAAI;GAAC;GAAY;GAAY;EAAM;EACnC,IAAI;GAAC;GAAY;GAAiB;EAAM;EACxC,IAAI;GAAC;GAAiB;GAAiB;EAAM;EAC7C,IAAI;GAAC;GAAiB;GAAiB;EAAM;CAC/C,EACF;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAIA,IAAa,mBAAmB,UAAgC;CAC9D,MAAM,EAAE,SAAS,QAAM,WAAW,iBAAiB;CACnD,OAAO,oBAAC,uBAAD;EAA6B;EAAM,GAAI;CAAQ,CAAA;AACxD"}
1
+ {"version":3,"file":"EmptyStateImage.js","names":[],"sources":["../../../src/components/empty-state/EmptyStateImage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Image } from '../image/Image'\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateImage = styled(\n Image,\n {\n base: [],\n variants: {\n size: {\n xs: ['max-h-8', 'max-w-14', 'mb-4'],\n sm: ['max-h-12', 'max-w-21', 'mb-4'],\n md: ['max-h-18', 'max-w-[126px]', 'mb-4'],\n lg: ['max-h-[142px]', 'max-w-[190px]', 'mb-6'],\n xl: ['max-h-[213px]', 'max-w-[285px]', 'mb-6']\n }\n }\n },\n { enableResponsiveVariants: true }\n)\n\ntype EmptyStateImageProps = React.ComponentProps<typeof StyledEmptyStateImage>\n\nexport const EmptyStateImage = (props: EmptyStateImageProps) => {\n const { size } = React.use(EmptyStateContext)\n return <StyledEmptyStateImage size={size} {...props} />\n}\n"],"mappings":";;;;;;AAMA,IAAM,wBAAwB,OAC5B,OACA;CACE,MAAM,CAAC;CACP,UAAU,EACR,MAAM;EACJ,IAAI;GAAC;GAAW;GAAY;EAAM;EAClC,IAAI;GAAC;GAAY;GAAY;EAAM;EACnC,IAAI;GAAC;GAAY;GAAiB;EAAM;EACxC,IAAI;GAAC;GAAiB;GAAiB;EAAM;EAC7C,IAAI;GAAC;GAAiB;GAAiB;EAAM;CAC/C,EACF;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAIA,IAAa,mBAAmB,UAAgC;CAC9D,MAAM,EAAE,SAAS,QAAM,IAAI,iBAAiB;CAC5C,OAAO,oBAAC,uBAAD;EAA6B;EAAM,GAAI;CAAQ,CAAA;AACxD"}
@@ -19,7 +19,7 @@ var StyledEmptyStateTitle = styled("h2", {
19
19
  } }
20
20
  }, { enableResponsiveVariants: true });
21
21
  var EmptyStateTitle = (props) => {
22
- const { size } = React$1.useContext(EmptyStateContext);
22
+ const { size } = React$1.use(EmptyStateContext);
23
23
  return /* @__PURE__ */ jsx(StyledEmptyStateTitle, {
24
24
  size,
25
25
  ...props
@@ -1 +1 @@
1
- {"version":3,"file":"EmptyStateTitle.js","names":[],"sources":["../../../src/components/empty-state/EmptyStateTitle.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport type { Override } from '../../utilities/types'\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateTitle = styled(\n 'h2',\n {\n base: ['text-grey-800', 'font-body', 'font-semibold', 'm-0'],\n variants: {\n size: {\n xs: ['mb-3', 'text-md'],\n sm: ['mb-3', 'text-md'],\n md: ['mb-3', 'text-md'],\n lg: ['mb-4', 'text-lg'],\n xl: ['mb-4', 'text-lg']\n }\n }\n },\n { enableResponsiveVariants: true }\n)\n\n// Override, not intersection: ComponentProps yields `as?: never`, and\n// intersecting that with ElementType silently collapses `as` to undefined\ntype EmptyStateTitleProps = Override<\n React.ComponentProps<typeof StyledEmptyStateTitle>,\n {\n as?: React.ComponentType | React.ElementType\n }\n>\n\nexport const EmptyStateTitle = (props: EmptyStateTitleProps) => {\n const { size } = React.useContext(EmptyStateContext)\n return <StyledEmptyStateTitle size={size} {...props} />\n}\n"],"mappings":";;;;;AAMA,IAAM,wBAAwB,OAC5B,MACA;CACE,MAAM;EAAC;EAAiB;EAAa;EAAiB;CAAK;CAC3D,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;CACxB,EACF;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAWA,IAAa,mBAAmB,UAAgC;CAC9D,MAAM,EAAE,SAAS,QAAM,WAAW,iBAAiB;CACnD,OAAO,oBAAC,uBAAD;EAA6B;EAAM,GAAI;CAAQ,CAAA;AACxD"}
1
+ {"version":3,"file":"EmptyStateTitle.js","names":[],"sources":["../../../src/components/empty-state/EmptyStateTitle.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport type { Override } from '../../utilities/types'\nimport { EmptyStateContext } from './EmptyState.context'\n\nconst StyledEmptyStateTitle = styled(\n 'h2',\n {\n base: ['text-grey-800', 'font-body', 'font-semibold', 'm-0'],\n variants: {\n size: {\n xs: ['mb-3', 'text-md'],\n sm: ['mb-3', 'text-md'],\n md: ['mb-3', 'text-md'],\n lg: ['mb-4', 'text-lg'],\n xl: ['mb-4', 'text-lg']\n }\n }\n },\n { enableResponsiveVariants: true }\n)\n\n// Override, not intersection: ComponentProps yields `as?: never`, and\n// intersecting that with ElementType silently collapses `as` to undefined\ntype EmptyStateTitleProps = Override<\n React.ComponentProps<typeof StyledEmptyStateTitle>,\n {\n as?: React.ComponentType | React.ElementType\n }\n>\n\nexport const EmptyStateTitle = (props: EmptyStateTitleProps) => {\n const { size } = React.use(EmptyStateContext)\n return <StyledEmptyStateTitle size={size} {...props} />\n}\n"],"mappings":";;;;;AAMA,IAAM,wBAAwB,OAC5B,MACA;CACE,MAAM;EAAC;EAAiB;EAAa;EAAiB;CAAK;CAC3D,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;EACtB,IAAI,CAAC,QAAQ,SAAS;CACxB,EACF;AACF,GACA,EAAE,0BAA0B,KAAK,CACnC;AAWA,IAAa,mBAAmB,UAAgC;CAC9D,MAAM,EAAE,SAAS,QAAM,IAAI,iBAAiB;CAC5C,OAAO,oBAAC,uBAAD;EAA6B;EAAM,GAAI;CAAQ,CAAA;AACxD"}
@@ -36,11 +36,11 @@ var FileDrop = ({ children, accept, multiple, onDrop, ...rest }) => {
36
36
  const handleKeyDown = (event) => {
37
37
  if (["Space", "Enter"].includes(event.key)) fileUploadInputRef.current?.click();
38
38
  };
39
- const value = {
39
+ const value = React$1.useMemo(() => ({
40
40
  isDragging,
41
41
  files
42
- };
43
- return /* @__PURE__ */ jsx(FileDropContext.Provider, {
42
+ }), [isDragging, files]);
43
+ return /* @__PURE__ */ jsx(FileDropContext, {
44
44
  value,
45
45
  children: /* @__PURE__ */ jsxs(StyledContainer, {
46
46
  onDragOver: handleDragOver,
@@ -1 +1 @@
1
- {"version":3,"file":"FileDrop.js","names":[],"sources":["../../../src/components/file-drop/FileDrop.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { FileDropContext } from './FileDrop.context'\nimport { type FileDropContextValue } from './types'\n\ninterface FileDropProps extends Omit<\n React.ComponentProps<'div'>,\n 'onDrop' | 'ref' | 'children'\n> {\n onDrop: (files: File[]) => void\n children?:\n | React.ReactNode\n | ((value: FileDropContextValue) => React.ReactNode)\n accept?: React.InputHTMLAttributes<HTMLInputElement>['accept']\n multiple?: React.InputHTMLAttributes<HTMLInputElement>['multiple']\n}\n\nconst StyledContainer = styled('div', {\n base: [\n 'flex',\n 'flex-col',\n 'gap-6',\n 'items-center',\n 'border',\n 'border-dashed',\n 'border-grey-500',\n 'px-12',\n 'py-8',\n 'rounded-md',\n 'cursor-pointer',\n '**:pointer-events-none'\n ]\n})\n\nexport const FileDrop = ({\n children,\n accept,\n multiple,\n onDrop,\n ...rest\n}: FileDropProps) => {\n const [isDragging, setIsDragging] = React.useState(false)\n const [files, setFiles] = React.useState<File[]>([])\n const fileUploadInputRef = React.useRef<HTMLInputElement>(null)\n\n const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {\n event.preventDefault()\n setIsDragging(true)\n }\n\n const handleDragLeave = () => setIsDragging(false)\n\n const handleDrop = (fileList: FileList | null) => {\n if (!fileList) return\n\n setIsDragging(false)\n\n const files = Array.from(fileList)\n onDrop(files)\n setFiles(files)\n }\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (['Space', 'Enter'].includes(event.key)) {\n fileUploadInputRef.current?.click()\n }\n }\n\n const value: FileDropContextValue = { isDragging, files }\n\n return (\n <FileDropContext.Provider value={value}>\n <StyledContainer\n onDragOver={handleDragOver}\n onDragLeave={handleDragLeave}\n onDrop={(event) => {\n event.preventDefault()\n handleDrop(event.dataTransfer.files)\n }}\n onClick={() => fileUploadInputRef.current?.click()}\n role=\"button\"\n onKeyDown={handleKeyDown}\n tabIndex={0}\n {...rest}\n >\n {typeof children === 'function' ? children(value) : children}\n <input\n type=\"file\"\n ref={fileUploadInputRef}\n style={{ visibility: 'hidden' }}\n accept={accept}\n multiple={multiple}\n onChange={(event) => {\n handleDrop(event.target.files)\n }}\n />\n </StyledContainer>\n </FileDropContext.Provider>\n )\n}\n\nFileDrop.displayName = 'FileDrop'\n"],"mappings":";;;;;AAkBA,IAAM,kBAAkB,OAAO,OAAO,EACpC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAED,IAAa,YAAY,EACvB,UACA,QACA,UACA,QACA,GAAG,WACgB;CACnB,MAAM,CAAC,YAAY,iBAAiB,QAAM,SAAS,KAAK;CACxD,MAAM,CAAC,OAAO,YAAY,QAAM,SAAiB,CAAC,CAAC;CACnD,MAAM,qBAAqB,QAAM,OAAyB,IAAI;CAE9D,MAAM,kBAAkB,UAA2C;EACjE,MAAM,eAAe;EACrB,cAAc,IAAI;CACpB;CAEA,MAAM,wBAAwB,cAAc,KAAK;CAEjD,MAAM,cAAc,aAA8B;EAChD,IAAI,CAAC,UAAU;EAEf,cAAc,KAAK;EAEnB,MAAM,QAAQ,MAAM,KAAK,QAAQ;EACjC,OAAO,KAAK;EACZ,SAAS,KAAK;CAChB;CAEA,MAAM,iBAAiB,UAA+C;EACpE,IAAI,CAAC,SAAS,OAAO,CAAC,CAAC,SAAS,MAAM,GAAG,GACvC,mBAAmB,SAAS,MAAM;CAEtC;CAEA,MAAM,QAA8B;EAAE;EAAY;CAAM;CAExD,OACE,oBAAC,gBAAgB,UAAjB;EAAiC;YAC/B,qBAAC,iBAAD;GACE,YAAY;GACZ,aAAa;GACb,SAAS,UAAU;IACjB,MAAM,eAAe;IACrB,WAAW,MAAM,aAAa,KAAK;GACrC;GACA,eAAe,mBAAmB,SAAS,MAAM;GACjD,MAAK;GACL,WAAW;GACX,UAAU;GACV,GAAI;aAXN,CAaG,OAAO,aAAa,aAAa,SAAS,KAAK,IAAI,UACpD,oBAAC,SAAD;IACE,MAAK;IACL,KAAK;IACL,OAAO,EAAE,YAAY,SAAS;IACtB;IACE;IACV,WAAW,UAAU;KACnB,WAAW,MAAM,OAAO,KAAK;IAC/B;GACD,CAAA,CACc;;CACO,CAAA;AAE9B;AAEA,SAAS,cAAc"}
1
+ {"version":3,"file":"FileDrop.js","names":[],"sources":["../../../src/components/file-drop/FileDrop.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { FileDropContext } from './FileDrop.context'\nimport { type FileDropContextValue } from './types'\n\ninterface FileDropProps extends Omit<\n React.ComponentProps<'div'>,\n 'onDrop' | 'ref' | 'children'\n> {\n onDrop: (files: File[]) => void\n children?:\n | React.ReactNode\n | ((value: FileDropContextValue) => React.ReactNode)\n accept?: React.InputHTMLAttributes<HTMLInputElement>['accept']\n multiple?: React.InputHTMLAttributes<HTMLInputElement>['multiple']\n}\n\nconst StyledContainer = styled('div', {\n base: [\n 'flex',\n 'flex-col',\n 'gap-6',\n 'items-center',\n 'border',\n 'border-dashed',\n 'border-grey-500',\n 'px-12',\n 'py-8',\n 'rounded-md',\n 'cursor-pointer',\n '**:pointer-events-none'\n ]\n})\n\nexport const FileDrop = ({\n children,\n accept,\n multiple,\n onDrop,\n ...rest\n}: FileDropProps) => {\n const [isDragging, setIsDragging] = React.useState(false)\n const [files, setFiles] = React.useState<File[]>([])\n const fileUploadInputRef = React.useRef<HTMLInputElement>(null)\n\n const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {\n event.preventDefault()\n setIsDragging(true)\n }\n\n const handleDragLeave = () => setIsDragging(false)\n\n const handleDrop = (fileList: FileList | null) => {\n if (!fileList) return\n\n setIsDragging(false)\n\n const files = Array.from(fileList)\n onDrop(files)\n setFiles(files)\n }\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (['Space', 'Enter'].includes(event.key)) {\n fileUploadInputRef.current?.click()\n }\n }\n\n // Memoized: consumers otherwise re-render at drag-over event frequency.\n const value = React.useMemo<FileDropContextValue>(\n () => ({ isDragging, files }),\n [isDragging, files]\n )\n\n return (\n <FileDropContext value={value}>\n <StyledContainer\n onDragOver={handleDragOver}\n onDragLeave={handleDragLeave}\n onDrop={(event) => {\n event.preventDefault()\n handleDrop(event.dataTransfer.files)\n }}\n onClick={() => fileUploadInputRef.current?.click()}\n role=\"button\"\n onKeyDown={handleKeyDown}\n tabIndex={0}\n {...rest}\n >\n {typeof children === 'function' ? children(value) : children}\n <input\n type=\"file\"\n ref={fileUploadInputRef}\n style={{ visibility: 'hidden' }}\n accept={accept}\n multiple={multiple}\n onChange={(event) => {\n handleDrop(event.target.files)\n }}\n />\n </StyledContainer>\n </FileDropContext>\n )\n}\n\nFileDrop.displayName = 'FileDrop'\n"],"mappings":";;;;;AAkBA,IAAM,kBAAkB,OAAO,OAAO,EACpC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAED,IAAa,YAAY,EACvB,UACA,QACA,UACA,QACA,GAAG,WACgB;CACnB,MAAM,CAAC,YAAY,iBAAiB,QAAM,SAAS,KAAK;CACxD,MAAM,CAAC,OAAO,YAAY,QAAM,SAAiB,CAAC,CAAC;CACnD,MAAM,qBAAqB,QAAM,OAAyB,IAAI;CAE9D,MAAM,kBAAkB,UAA2C;EACjE,MAAM,eAAe;EACrB,cAAc,IAAI;CACpB;CAEA,MAAM,wBAAwB,cAAc,KAAK;CAEjD,MAAM,cAAc,aAA8B;EAChD,IAAI,CAAC,UAAU;EAEf,cAAc,KAAK;EAEnB,MAAM,QAAQ,MAAM,KAAK,QAAQ;EACjC,OAAO,KAAK;EACZ,SAAS,KAAK;CAChB;CAEA,MAAM,iBAAiB,UAA+C;EACpE,IAAI,CAAC,SAAS,OAAO,CAAC,CAAC,SAAS,MAAM,GAAG,GACvC,mBAAmB,SAAS,MAAM;CAEtC;CAGA,MAAM,QAAQ,QAAM,eACX;EAAE;EAAY;CAAM,IAC3B,CAAC,YAAY,KAAK,CACpB;CAEA,OACE,oBAAC,iBAAD;EAAwB;YACtB,qBAAC,iBAAD;GACE,YAAY;GACZ,aAAa;GACb,SAAS,UAAU;IACjB,MAAM,eAAe;IACrB,WAAW,MAAM,aAAa,KAAK;GACrC;GACA,eAAe,mBAAmB,SAAS,MAAM;GACjD,MAAK;GACL,WAAW;GACX,UAAU;GACV,GAAI;aAXN,CAaG,OAAO,aAAa,aAAa,SAAS,KAAK,IAAI,UACpD,oBAAC,SAAD;IACE,MAAK;IACL,KAAK;IACL,OAAO,EAAE,YAAY,SAAS;IACtB;IACE;IACV,WAAW,UAAU;KACnB,WAAW,MAAM,OAAO,KAAK;IAC/B;GACD,CAAA,CACc;;CACF,CAAA;AAErB;AAEA,SAAS,cAAc"}
@@ -1,7 +1,7 @@
1
1
  import { FileDropContext } from "./FileDrop.context.js";
2
2
  import * as React$1 from "react";
3
3
  //#region src/components/file-drop/useFileDrop.ts
4
- var useFileDrop = () => React$1.useContext(FileDropContext);
4
+ var useFileDrop = () => React$1.use(FileDropContext);
5
5
  //#endregion
6
6
  export { useFileDrop };
7
7
 
@@ -1 +1 @@
1
- {"version":3,"file":"useFileDrop.js","names":[],"sources":["../../../src/components/file-drop/useFileDrop.ts"],"sourcesContent":["import * as React from 'react'\n\nimport { FileDropContext } from './FileDrop.context'\nimport type { FileDropContextValue } from './types'\n\nexport const useFileDrop = (): FileDropContextValue =>\n React.useContext(FileDropContext)\n"],"mappings":";;;AAKA,IAAa,oBACX,QAAM,WAAW,eAAe"}
1
+ {"version":3,"file":"useFileDrop.js","names":[],"sources":["../../../src/components/file-drop/useFileDrop.ts"],"sourcesContent":["import * as React from 'react'\n\nimport { FileDropContext } from './FileDrop.context'\nimport type { FileDropContextValue } from './types'\n\nexport const useFileDrop = (): FileDropContextValue =>\n React.use(FileDropContext)\n"],"mappings":";;;AAKA,IAAa,oBACX,QAAM,IAAI,eAAe"}
@@ -1,5 +1,5 @@
1
1
  import { FormCustomContext } from "./useFormCustomContext.js";
2
- import "react";
2
+ import * as React$1 from "react";
3
3
  import { jsx } from "react/jsx-runtime";
4
4
  import { FormProvider, useForm } from "react-hook-form";
5
5
  //#region src/components/form/Form.tsx
@@ -9,13 +9,14 @@ var Form = (props) => {
9
9
  defaultValues,
10
10
  mode: validationMode
11
11
  });
12
+ const customContextValue = React$1.useMemo(() => ({
13
+ appearance,
14
+ theme
15
+ }), [appearance, theme]);
12
16
  return /* @__PURE__ */ jsx(FormProvider, {
13
17
  ...methods,
14
- children: /* @__PURE__ */ jsx(FormCustomContext.Provider, {
15
- value: {
16
- appearance,
17
- theme
18
- },
18
+ children: /* @__PURE__ */ jsx(FormCustomContext, {
19
+ value: customContextValue,
19
20
  children: /* @__PURE__ */ jsx("form", {
20
21
  "aria-label": "form",
21
22
  onSubmit: methods.handleSubmit(onSubmit, onError),
@@ -1 +1 @@
1
- {"version":3,"file":"Form.js","names":[],"sources":["../../../src/components/form/Form.tsx"],"sourcesContent":["import * as React from 'react'\nimport type {\n DefaultValues,\n FieldValues,\n Mode,\n SubmitErrorHandler,\n SubmitHandler,\n UseFormMethods\n} from 'react-hook-form'\nimport { FormProvider, useForm } from 'react-hook-form'\n\nimport {\n type FormCustomContextType,\n FormCustomContext\n} from './useFormCustomContext'\n\ntype FormProps<TFormData extends FieldValues> = Omit<\n React.HTMLAttributes<HTMLFormElement>,\n 'onSubmit' | 'onError' | 'children'\n> & {\n defaultValues?: DefaultValues<TFormData>\n validationMode?: Mode\n onSubmit: SubmitHandler<TFormData>\n onError?: SubmitErrorHandler<TFormData>\n noValidate?: boolean\n children:\n | React.ReactNode\n | ((methods: UseFormMethods<TFormData>) => React.ReactNode)\n}\n\nexport const Form = <TFormData extends FieldValues>(\n props: FormProps<TFormData> & FormCustomContextType\n) => {\n const {\n children,\n defaultValues,\n validationMode = 'onBlur',\n onSubmit,\n onError,\n appearance,\n theme,\n ...rest\n } = props\n\n const methods = useForm<TFormData>({\n defaultValues,\n mode: validationMode\n })\n\n return (\n <FormProvider {...methods}>\n <FormCustomContext.Provider value={{ appearance, theme }}>\n <form\n aria-label=\"form\"\n onSubmit={methods.handleSubmit(onSubmit, onError)}\n {...rest}\n >\n {typeof children === 'function' ? children(methods) : children}\n </form>\n </FormCustomContext.Provider>\n </FormProvider>\n )\n}\n\nForm.displayName = 'Form'\n"],"mappings":";;;;;AA8BA,IAAa,QACX,UACG;CACH,MAAM,EACJ,UACA,eACA,iBAAiB,UACjB,UACA,SACA,YACA,OACA,GAAG,SACD;CAEJ,MAAM,UAAU,QAAmB;EACjC;EACA,MAAM;CACR,CAAC;CAED,OACE,oBAAC,cAAD;EAAc,GAAI;YAChB,oBAAC,kBAAkB,UAAnB;GAA4B,OAAO;IAAE;IAAY;GAAM;aACrD,oBAAC,QAAD;IACE,cAAW;IACX,UAAU,QAAQ,aAAa,UAAU,OAAO;IAChD,GAAI;cAEH,OAAO,aAAa,aAAa,SAAS,OAAO,IAAI;GAClD,CAAA;EACoB,CAAA;CAChB,CAAA;AAElB;AAEA,KAAK,cAAc"}
1
+ {"version":3,"file":"Form.js","names":[],"sources":["../../../src/components/form/Form.tsx"],"sourcesContent":["import * as React from 'react'\nimport type {\n DefaultValues,\n FieldValues,\n Mode,\n SubmitErrorHandler,\n SubmitHandler,\n UseFormMethods\n} from 'react-hook-form'\nimport { FormProvider, useForm } from 'react-hook-form'\n\nimport {\n type FormCustomContextType,\n FormCustomContext\n} from './useFormCustomContext'\n\ntype FormProps<TFormData extends FieldValues> = Omit<\n React.HTMLAttributes<HTMLFormElement>,\n 'onSubmit' | 'onError' | 'children'\n> & {\n defaultValues?: DefaultValues<TFormData>\n validationMode?: Mode\n onSubmit: SubmitHandler<TFormData>\n onError?: SubmitErrorHandler<TFormData>\n noValidate?: boolean\n children:\n | React.ReactNode\n | ((methods: UseFormMethods<TFormData>) => React.ReactNode)\n}\n\nexport const Form = <TFormData extends FieldValues>(\n props: FormProps<TFormData> & FormCustomContextType\n) => {\n const {\n children,\n defaultValues,\n validationMode = 'onBlur',\n onSubmit,\n onError,\n appearance,\n theme,\n ...rest\n } = props\n\n const methods = useForm<TFormData>({\n defaultValues,\n mode: validationMode\n })\n\n // Memoized: the form re-renders on every RHF state change and would\n // otherwise push a fresh context value to every consumer each time.\n const customContextValue = React.useMemo(\n () => ({ appearance, theme }),\n [appearance, theme]\n )\n\n return (\n <FormProvider {...methods}>\n <FormCustomContext value={customContextValue}>\n <form\n aria-label=\"form\"\n onSubmit={methods.handleSubmit(onSubmit, onError)}\n {...rest}\n >\n {typeof children === 'function' ? children(methods) : children}\n </form>\n </FormCustomContext>\n </FormProvider>\n )\n}\n\nForm.displayName = 'Form'\n"],"mappings":";;;;;AA8BA,IAAa,QACX,UACG;CACH,MAAM,EACJ,UACA,eACA,iBAAiB,UACjB,UACA,SACA,YACA,OACA,GAAG,SACD;CAEJ,MAAM,UAAU,QAAmB;EACjC;EACA,MAAM;CACR,CAAC;CAID,MAAM,qBAAqB,QAAM,eACxB;EAAE;EAAY;CAAM,IAC3B,CAAC,YAAY,KAAK,CACpB;CAEA,OACE,oBAAC,cAAD;EAAc,GAAI;YAChB,oBAAC,mBAAD;GAAmB,OAAO;aACxB,oBAAC,QAAD;IACE,cAAW;IACX,UAAU,QAAQ,aAAa,UAAU,OAAO;IAChD,GAAI;cAEH,OAAO,aAAa,aAAa,SAAS,OAAO,IAAI;GAClD,CAAA;EACW,CAAA;CACP,CAAA;AAElB;AAEA,KAAK,cAAc"}
@@ -1,7 +1,7 @@
1
1
  import * as React$1 from "react";
2
2
  //#region src/components/form/useFormCustomContext.ts
3
3
  var FormCustomContext = React$1.createContext({ appearance: "standard" });
4
- var useFormCustomContext = () => React$1.useContext(FormCustomContext);
4
+ var useFormCustomContext = () => React$1.use(FormCustomContext);
5
5
  //#endregion
6
6
  export { FormCustomContext, useFormCustomContext };
7
7
 
@@ -1 +1 @@
1
- {"version":3,"file":"useFormCustomContext.js","names":[],"sources":["../../../src/components/form/useFormCustomContext.ts"],"sourcesContent":["import * as React from 'react'\n\nimport type { InputProps } from '../input/Input'\n\nexport type FormCustomContextType =\n | {\n appearance?: InputProps['appearance']\n theme?: InputProps['theme']\n }\n | undefined\n\nexport const FormCustomContext = React.createContext<FormCustomContextType>({\n appearance: 'standard'\n})\n\nexport const useFormCustomContext = () => React.useContext(FormCustomContext)\n"],"mappings":";;AAWA,IAAa,oBAAoB,QAAM,cAAqC,EAC1E,YAAY,WACd,CAAC;AAED,IAAa,6BAA6B,QAAM,WAAW,iBAAiB"}
1
+ {"version":3,"file":"useFormCustomContext.js","names":[],"sources":["../../../src/components/form/useFormCustomContext.ts"],"sourcesContent":["import * as React from 'react'\n\nimport type { InputProps } from '../input/Input'\n\nexport type FormCustomContextType =\n | {\n appearance?: InputProps['appearance']\n theme?: InputProps['theme']\n }\n | undefined\n\nexport const FormCustomContext = React.createContext<FormCustomContextType>({\n appearance: 'standard'\n})\n\nexport const useFormCustomContext = () => React.use(FormCustomContext)\n"],"mappings":";;AAWA,IAAa,oBAAoB,QAAM,cAAqC,EAC1E,YAAY,WACd,CAAC;AAED,IAAa,6BAA6B,QAAM,IAAI,iBAAiB"}
@@ -1,7 +1,7 @@
1
1
  import { styled } from "../../styled.js";
2
2
  import { Text } from "../text/Text.js";
3
3
  import { overrideStyledVariantValue } from "../../utilities/override-styled-variant-value/overrideStyledVariantValue.js";
4
- import * as React$1 from "react";
4
+ import "react";
5
5
  import { jsx } from "react/jsx-runtime";
6
6
  //#region src/components/input/Input.tsx
7
7
  var InputBackground = styled("div", {
@@ -91,7 +91,7 @@ var toTextSize = {
91
91
  xl: "lg"
92
92
  };
93
93
  var InputText = ({ ref, type = "text", size, ...rest }) => {
94
- const textSize = React$1.useMemo(() => overrideStyledVariantValue(size, (s) => toTextSize[s]), [size]);
94
+ const textSize = overrideStyledVariantValue(size, (s) => toTextSize[s]);
95
95
  return /* @__PURE__ */ jsx(StyledInputText, {
96
96
  ref,
97
97
  as: "input",
@@ -1 +1 @@
1
- {"version":3,"file":"Input.js","names":[],"sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { overrideStyledVariantValue } from '../../utilities/override-styled-variant-value/overrideStyledVariantValue'\nimport { Text } from '../text/Text'\n\nexport const InputBackground = styled('div', {\n base: [\n 'flex',\n 'text-grey-1000',\n 'transition-[background,border-color]',\n 'duration-100',\n 'ease-out',\n 'w-full'\n ],\n variants: {\n appearance: {\n standard: [\n 'bg-white',\n 'border',\n 'border-grey-800',\n 'focus-within:border-blue-800',\n 'rounded-md'\n ],\n modern: [\n 'bg-grey-100',\n 'border-none',\n 'focus-within:outline-2',\n 'focus-within:outline-blue-800',\n 'focus-within:outline-offset-1',\n 'focus-within:outline-solid',\n 'focus-within:z-1',\n 'rounded-md'\n ]\n },\n size: {\n sm: ['h-8'],\n md: ['h-10'],\n lg: ['h-12'],\n xl: ['h-16']\n },\n disabled: {\n true: ['cursor-not-allowed', 'opacity-30']\n },\n state: {\n error: []\n },\n theme: {\n white: [],\n grey: []\n }\n },\n compoundVariants: [\n {\n state: 'error',\n appearance: 'standard',\n class: ['border-danger']\n },\n {\n state: 'error',\n appearance: 'modern',\n class: ['bg-danger-light', 'focus-within:outline-danger']\n },\n {\n appearance: 'modern',\n theme: 'white',\n class: ['bg-white']\n },\n {\n appearance: 'modern',\n theme: 'grey',\n class: ['bg-grey-100']\n }\n ]\n})\n\nInputBackground.displayName = 'InputBackground'\n\n// @__PURE__ keeps this tree-shakable for consumers importing only\n// InputBackground from this module.\nconst StyledInputText = /* @__PURE__ */ styled(Text, {\n base: [\n 'appearance-none',\n 'border-none',\n 'bg-none',\n 'bg-transparent',\n 'shadow-none',\n 'box-border',\n 'focus:outline-none',\n 'px-3',\n 'size-full',\n 'placeholder:opacity-100',\n 'placeholder:text-grey-700'\n ]\n})\n\nexport type InputTextProps = Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'size'\n> &\n Omit<React.ComponentProps<typeof StyledInputText>, 'type' | 'as' | 'ref'> & {\n // override default 'type' property to prevent Input from being used to render\n // checkboxes, radios etc — we have dedicated components for them\n type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n as?: never\n disabled?: boolean\n // StyledInputText wraps Text (default element 'p'), but InputText always\n // renders it as=\"input\", so the inherited paragraph ref must be overridden\n ref?: React.Ref<HTMLInputElement>\n }\n\nconst toTextSize = {\n sm: 'sm',\n md: 'md',\n lg: 'md',\n xl: 'lg'\n}\n\nexport const InputText = ({\n ref,\n type = 'text',\n size,\n ...rest\n}: InputTextProps) => {\n const textSize = React.useMemo(\n () => overrideStyledVariantValue(size, (s) => toTextSize[s]),\n [size]\n )\n\n return (\n <StyledInputText\n ref={ref}\n as=\"input\"\n type={type === 'number' ? 'text' : type}\n inputMode={type === 'number' ? 'numeric' : undefined}\n pattern={type === 'number' ? '[0-9]*' : undefined}\n size={textSize}\n {...rest}\n />\n )\n}\n\ntype InputBackgroundProps = React.ComponentProps<typeof InputBackground>\nexport type InputProps = Omit<\n React.ComponentProps<typeof InputText>,\n 'size' | 'state' | 'appearance'\n> & {\n size?: InputBackgroundProps['size']\n state?: InputBackgroundProps['state']\n appearance?: InputBackgroundProps['appearance']\n theme?: InputBackgroundProps['theme']\n disabled?: boolean\n name?: string\n readOnly?: boolean\n value?: string | number\n onChange?: React.ChangeEventHandler<HTMLInputElement>\n}\n\nexport const Input = ({\n ref,\n className,\n size = 'md',\n appearance = 'standard',\n theme,\n state,\n disabled,\n style,\n ...rest\n}: InputProps) => (\n <InputBackground\n size={size}\n appearance={appearance}\n theme={theme}\n disabled={disabled}\n state={state}\n className={className}\n style={style}\n >\n <InputText size={size} ref={ref} disabled={disabled} {...rest} />\n </InputBackground>\n)\n"],"mappings":";;;;;;AAMA,IAAa,kBAAkB,OAAO,OAAO;CAC3C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;EACF;EACA,MAAM;GACJ,IAAI,CAAC,KAAK;GACV,IAAI,CAAC,MAAM;GACX,IAAI,CAAC,MAAM;GACX,IAAI,CAAC,MAAM;EACb;EACA,UAAU,EACR,MAAM,CAAC,sBAAsB,YAAY,EAC3C;EACA,OAAO,EACL,OAAO,CAAC,EACV;EACA,OAAO;GACL,OAAO,CAAC;GACR,MAAM,CAAC;EACT;CACF;CACA,kBAAkB;EAChB;GACE,OAAO;GACP,YAAY;GACZ,OAAO,CAAC,eAAe;EACzB;EACA;GACE,OAAO;GACP,YAAY;GACZ,OAAO,CAAC,mBAAmB,6BAA6B;EAC1D;EACA;GACE,YAAY;GACZ,OAAO;GACP,OAAO,CAAC,UAAU;EACpB;EACA;GACE,YAAY;GACZ,OAAO;GACP,OAAO,CAAC,aAAa;EACvB;CACF;AACF,CAAC;AAED,gBAAgB,cAAc;;AAI9B,IAAM,kBAAkC,uBAAO,MAAM,EACnD,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAiBD,IAAM,aAAa;CACjB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,aAAa,EACxB,KACA,OAAO,QACP,MACA,GAAG,WACiB;CACpB,MAAM,WAAW,QAAM,cACf,2BAA2B,OAAO,MAAM,WAAW,EAAE,GAC3D,CAAC,IAAI,CACP;CAEA,OACE,oBAAC,iBAAD;EACO;EACL,IAAG;EACH,MAAM,SAAS,WAAW,SAAS;EACnC,WAAW,SAAS,WAAW,YAAY,KAAA;EAC3C,SAAS,SAAS,WAAW,WAAW,KAAA;EACxC,MAAM;EACN,GAAI;CACL,CAAA;AAEL;AAkBA,IAAa,SAAS,EACpB,KACA,WACA,OAAO,MACP,aAAa,YACb,OACA,OACA,UACA,OACA,GAAG,WAEH,oBAAC,iBAAD;CACQ;CACM;CACL;CACG;CACH;CACI;CACJ;WAEP,oBAAC,WAAD;EAAiB;EAAW;EAAe;EAAU,GAAI;CAAO,CAAA;AACjD,CAAA"}
1
+ {"version":3,"file":"Input.js","names":[],"sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { overrideStyledVariantValue } from '../../utilities/override-styled-variant-value/overrideStyledVariantValue'\nimport { Text } from '../text/Text'\n\nexport const InputBackground = styled('div', {\n base: [\n 'flex',\n 'text-grey-1000',\n 'transition-[background,border-color]',\n 'duration-100',\n 'ease-out',\n 'w-full'\n ],\n variants: {\n appearance: {\n standard: [\n 'bg-white',\n 'border',\n 'border-grey-800',\n 'focus-within:border-blue-800',\n 'rounded-md'\n ],\n modern: [\n 'bg-grey-100',\n 'border-none',\n 'focus-within:outline-2',\n 'focus-within:outline-blue-800',\n 'focus-within:outline-offset-1',\n 'focus-within:outline-solid',\n 'focus-within:z-1',\n 'rounded-md'\n ]\n },\n size: {\n sm: ['h-8'],\n md: ['h-10'],\n lg: ['h-12'],\n xl: ['h-16']\n },\n disabled: {\n true: ['cursor-not-allowed', 'opacity-30']\n },\n state: {\n error: []\n },\n theme: {\n white: [],\n grey: []\n }\n },\n compoundVariants: [\n {\n state: 'error',\n appearance: 'standard',\n class: ['border-danger']\n },\n {\n state: 'error',\n appearance: 'modern',\n class: ['bg-danger-light', 'focus-within:outline-danger']\n },\n {\n appearance: 'modern',\n theme: 'white',\n class: ['bg-white']\n },\n {\n appearance: 'modern',\n theme: 'grey',\n class: ['bg-grey-100']\n }\n ]\n})\n\nInputBackground.displayName = 'InputBackground'\n\n// @__PURE__ keeps this tree-shakable for consumers importing only\n// InputBackground from this module.\nconst StyledInputText = /* @__PURE__ */ styled(Text, {\n base: [\n 'appearance-none',\n 'border-none',\n 'bg-none',\n 'bg-transparent',\n 'shadow-none',\n 'box-border',\n 'focus:outline-none',\n 'px-3',\n 'size-full',\n 'placeholder:opacity-100',\n 'placeholder:text-grey-700'\n ]\n})\n\nexport type InputTextProps = Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'size'\n> &\n Omit<React.ComponentProps<typeof StyledInputText>, 'type' | 'as' | 'ref'> & {\n // override default 'type' property to prevent Input from being used to render\n // checkboxes, radios etc — we have dedicated components for them\n type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search'\n as?: never\n disabled?: boolean\n // StyledInputText wraps Text (default element 'p'), but InputText always\n // renders it as=\"input\", so the inherited paragraph ref must be overridden\n ref?: React.Ref<HTMLInputElement>\n }\n\nconst toTextSize = {\n sm: 'sm',\n md: 'md',\n lg: 'md',\n xl: 'lg'\n}\n\nexport const InputText = ({\n ref,\n type = 'text',\n size,\n ...rest\n}: InputTextProps) => {\n const textSize = overrideStyledVariantValue(size, (s) => toTextSize[s])\n\n return (\n <StyledInputText\n ref={ref}\n as=\"input\"\n type={type === 'number' ? 'text' : type}\n inputMode={type === 'number' ? 'numeric' : undefined}\n pattern={type === 'number' ? '[0-9]*' : undefined}\n size={textSize}\n {...rest}\n />\n )\n}\n\ntype InputBackgroundProps = React.ComponentProps<typeof InputBackground>\nexport type InputProps = Omit<\n React.ComponentProps<typeof InputText>,\n 'size' | 'state' | 'appearance'\n> & {\n size?: InputBackgroundProps['size']\n state?: InputBackgroundProps['state']\n appearance?: InputBackgroundProps['appearance']\n theme?: InputBackgroundProps['theme']\n disabled?: boolean\n name?: string\n readOnly?: boolean\n value?: string | number\n onChange?: React.ChangeEventHandler<HTMLInputElement>\n}\n\nexport const Input = ({\n ref,\n className,\n size = 'md',\n appearance = 'standard',\n theme,\n state,\n disabled,\n style,\n ...rest\n}: InputProps) => (\n <InputBackground\n size={size}\n appearance={appearance}\n theme={theme}\n disabled={disabled}\n state={state}\n className={className}\n style={style}\n >\n <InputText size={size} ref={ref} disabled={disabled} {...rest} />\n </InputBackground>\n)\n"],"mappings":";;;;;;AAMA,IAAa,kBAAkB,OAAO,OAAO;CAC3C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;GACF;GACA,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;EACF;EACA,MAAM;GACJ,IAAI,CAAC,KAAK;GACV,IAAI,CAAC,MAAM;GACX,IAAI,CAAC,MAAM;GACX,IAAI,CAAC,MAAM;EACb;EACA,UAAU,EACR,MAAM,CAAC,sBAAsB,YAAY,EAC3C;EACA,OAAO,EACL,OAAO,CAAC,EACV;EACA,OAAO;GACL,OAAO,CAAC;GACR,MAAM,CAAC;EACT;CACF;CACA,kBAAkB;EAChB;GACE,OAAO;GACP,YAAY;GACZ,OAAO,CAAC,eAAe;EACzB;EACA;GACE,OAAO;GACP,YAAY;GACZ,OAAO,CAAC,mBAAmB,6BAA6B;EAC1D;EACA;GACE,YAAY;GACZ,OAAO;GACP,OAAO,CAAC,UAAU;EACpB;EACA;GACE,YAAY;GACZ,OAAO;GACP,OAAO,CAAC,aAAa;EACvB;CACF;AACF,CAAC;AAED,gBAAgB,cAAc;;AAI9B,IAAM,kBAAkC,uBAAO,MAAM,EACnD,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAiBD,IAAM,aAAa;CACjB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,IAAa,aAAa,EACxB,KACA,OAAO,QACP,MACA,GAAG,WACiB;CACpB,MAAM,WAAW,2BAA2B,OAAO,MAAM,WAAW,EAAE;CAEtE,OACE,oBAAC,iBAAD;EACO;EACL,IAAG;EACH,MAAM,SAAS,WAAW,SAAS;EACnC,WAAW,SAAS,WAAW,YAAY,KAAA;EAC3C,SAAS,SAAS,WAAW,WAAW,KAAA;EACxC,MAAM;EACN,GAAI;CACL,CAAA;AAEL;AAkBA,IAAa,SAAS,EACpB,KACA,WACA,OAAO,MACP,aAAa,YACb,OACA,OACA,UACA,OACA,GAAG,WAEH,oBAAC,iBAAD;CACQ;CACM;CACL;CACG;CACH;CACI;CACJ;WAEP,oBAAC,WAAD;EAAiB;EAAW;EAAe;EAAU,GAAI;CAAO,CAAA;AACjD,CAAA"}
@@ -1,13 +1,10 @@
1
1
  import { styled } from "../../styled.js";
2
2
  import { Text } from "../text/Text.js";
3
- import { useCallbackRefState } from "../../utilities/hooks/useCallbackRef.js";
4
3
  import * as React$1 from "react";
5
4
  import { jsx } from "react/jsx-runtime";
6
5
  import { Slot } from "@radix-ui/react-slot";
7
6
  //#region src/components/keyboard-shortcut/KeyboardShortcut.tsx
8
7
  var KeyboardShortcut = ({ ref, asChild, config, targetWindow = false, onKeyDown, ...rest }) => {
9
- const [targetElRef, setTargetElRef] = useCallbackRefState();
10
- React$1.useImperativeHandle(ref, () => targetElRef);
11
8
  const handleOnKeydown = React$1.useCallback((e) => {
12
9
  config.forEach(({ shortcut, action }) => {
13
10
  if (Object.entries(shortcut).every(([key, value]) => e[key] === value)) action({
@@ -17,15 +14,21 @@ var KeyboardShortcut = ({ ref, asChild, config, targetWindow = false, onKeyDown,
17
14
  });
18
15
  onKeyDown?.(e);
19
16
  }, [config, onKeyDown]);
17
+ const handleOnKeydownRef = React$1.useRef(handleOnKeydown);
18
+ React$1.useLayoutEffect(() => {
19
+ handleOnKeydownRef.current = handleOnKeydown;
20
+ });
20
21
  React$1.useEffect(() => {
21
- if (targetWindow) window.addEventListener("keydown", handleOnKeydown);
22
+ if (!targetWindow) return;
23
+ const listener = (e) => handleOnKeydownRef.current(e);
24
+ window.addEventListener("keydown", listener);
22
25
  return () => {
23
- window.removeEventListener("keydown", handleOnKeydown);
26
+ window.removeEventListener("keydown", listener);
24
27
  };
25
- }, [targetWindow, handleOnKeydown]);
28
+ }, [targetWindow]);
26
29
  return /* @__PURE__ */ jsx(asChild ? Slot : "div", {
27
30
  onKeyDown: targetWindow ? void 0 : handleOnKeydown,
28
- ref: setTargetElRef,
31
+ ref,
29
32
  ...rest
30
33
  });
31
34
  };
@@ -1 +1 @@
1
- {"version":3,"file":"KeyboardShortcut.js","names":[],"sources":["../../../src/components/keyboard-shortcut/KeyboardShortcut.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { useCallbackRefState } from '../../utilities/hooks/useCallbackRef'\nimport { Text } from '../text/Text'\n\ntype KeyboardEventWindowOrElement =\n | KeyboardEvent\n | React.KeyboardEvent<HTMLDivElement>\ntype ShortcutConfig = Partial<KeyboardEvent>\n\ntype KeyboardShortcutProps = React.HTMLAttributes<HTMLDivElement> & {\n asChild?: boolean\n config: {\n shortcut: ShortcutConfig\n action: ({\n event,\n shortcut\n }: {\n event: KeyboardEvent | React.KeyboardEvent<HTMLDivElement>\n shortcut: ShortcutConfig\n }) => void\n }[]\n targetWindow?: boolean\n onKeyDown?: (e: KeyboardEventWindowOrElement) => void\n ref?: React.Ref<HTMLDivElement>\n}\n\nexport const KeyboardShortcut = ({\n ref,\n asChild,\n config,\n targetWindow = false,\n onKeyDown,\n ...rest\n}: KeyboardShortcutProps) => {\n const [targetElRef, setTargetElRef] = useCallbackRefState()\n React.useImperativeHandle(ref, () => targetElRef as HTMLDivElement)\n\n const handleOnKeydown = React.useCallback(\n (e: KeyboardEventWindowOrElement) => {\n config.forEach(({ shortcut, action }) => {\n if (Object.entries(shortcut).every(([key, value]) => e[key] === value))\n action({ event: e, shortcut })\n })\n onKeyDown?.(e)\n },\n [config, onKeyDown]\n )\n\n React.useEffect(() => {\n if (targetWindow) window.addEventListener('keydown', handleOnKeydown)\n\n return () => {\n window.removeEventListener('keydown', handleOnKeydown)\n }\n }, [targetWindow, handleOnKeydown])\n\n const Component = asChild ? Slot : 'div'\n\n return (\n <Component\n onKeyDown={targetWindow ? undefined : handleOnKeydown}\n ref={setTargetElRef}\n {...rest}\n />\n )\n}\n\nconst StyledKeyboardShortcutIndicator = /* @__PURE__ */ styled(Text, {\n base: [\n 'bg-grey-100',\n 'text-text-subtle',\n 'px-2',\n 'py-0.5',\n 'min-w-6',\n 'min-h-6',\n 'font-normal',\n 'inline-flex',\n 'justify-center',\n 'items-center',\n 'rounded-md',\n 'shrink-0',\n 'capsize-none'\n ]\n})\n\ntype KeyboardShortcutIndicatorProps = React.ComponentProps<\n typeof StyledKeyboardShortcutIndicator\n>\n\nexport const KeyboardShortcutIndicator = (\n props: KeyboardShortcutIndicatorProps\n) => {\n return <StyledKeyboardShortcutIndicator size=\"sm\" as=\"kbd\" {...props} />\n}\n"],"mappings":";;;;;;;AA6BA,IAAa,oBAAoB,EAC/B,KACA,SACA,QACA,eAAe,OACf,WACA,GAAG,WACwB;CAC3B,MAAM,CAAC,aAAa,kBAAkB,oBAAoB;CAC1D,QAAM,oBAAoB,WAAW,WAA6B;CAElE,MAAM,kBAAkB,QAAM,aAC3B,MAAoC;EACnC,OAAO,SAAS,EAAE,UAAU,aAAa;GACvC,IAAI,OAAO,QAAQ,QAAQ,CAAC,CAAC,OAAO,CAAC,KAAK,WAAW,EAAE,SAAS,KAAK,GACnE,OAAO;IAAE,OAAO;IAAG;GAAS,CAAC;EACjC,CAAC;EACD,YAAY,CAAC;CACf,GACA,CAAC,QAAQ,SAAS,CACpB;CAEA,QAAM,gBAAgB;EACpB,IAAI,cAAc,OAAO,iBAAiB,WAAW,eAAe;EAEpE,aAAa;GACX,OAAO,oBAAoB,WAAW,eAAe;EACvD;CACF,GAAG,CAAC,cAAc,eAAe,CAAC;CAIlC,OACE,oBAHgB,UAAU,OAAO,OAGjC;EACE,WAAW,eAAe,KAAA,IAAY;EACtC,KAAK;EACL,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,kCAAkD,uBAAO,MAAM,EACnE,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAMD,IAAa,6BACX,UACG;CACH,OAAO,oBAAC,iCAAD;EAAiC,MAAK;EAAK,IAAG;EAAM,GAAI;CAAQ,CAAA;AACzE"}
1
+ {"version":3,"file":"KeyboardShortcut.js","names":[],"sources":["../../../src/components/keyboard-shortcut/KeyboardShortcut.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Text } from '../text/Text'\n\ntype KeyboardEventWindowOrElement =\n | KeyboardEvent\n | React.KeyboardEvent<HTMLDivElement>\ntype ShortcutConfig = Partial<KeyboardEvent>\n\ntype KeyboardShortcutProps = React.HTMLAttributes<HTMLDivElement> & {\n asChild?: boolean\n config: {\n shortcut: ShortcutConfig\n action: ({\n event,\n shortcut\n }: {\n event: KeyboardEvent | React.KeyboardEvent<HTMLDivElement>\n shortcut: ShortcutConfig\n }) => void\n }[]\n targetWindow?: boolean\n onKeyDown?: (e: KeyboardEventWindowOrElement) => void\n ref?: React.Ref<HTMLDivElement>\n}\n\nexport const KeyboardShortcut = ({\n ref,\n asChild,\n config,\n targetWindow = false,\n onKeyDown,\n ...rest\n}: KeyboardShortcutProps) => {\n const handleOnKeydown = React.useCallback(\n (e: KeyboardEventWindowOrElement) => {\n config.forEach(({ shortcut, action }) => {\n if (Object.entries(shortcut).every(([key, value]) => e[key] === value))\n action({ event: e, shortcut })\n })\n onKeyDown?.(e)\n },\n [config, onKeyDown]\n )\n\n // Latest-ref so the window listener subscribes once — keyed on the handler\n // it would re-subscribe whenever an inline `config` array changes identity.\n const handleOnKeydownRef = React.useRef(handleOnKeydown)\n React.useLayoutEffect(() => {\n handleOnKeydownRef.current = handleOnKeydown\n })\n\n React.useEffect(() => {\n if (!targetWindow) return\n\n const listener = (e: KeyboardEvent) => handleOnKeydownRef.current(e)\n window.addEventListener('keydown', listener)\n\n return () => {\n window.removeEventListener('keydown', listener)\n }\n }, [targetWindow])\n\n const Component = asChild ? Slot : 'div'\n\n return (\n <Component\n onKeyDown={targetWindow ? undefined : handleOnKeydown}\n ref={ref}\n {...rest}\n />\n )\n}\n\nconst StyledKeyboardShortcutIndicator = /* @__PURE__ */ styled(Text, {\n base: [\n 'bg-grey-100',\n 'text-text-subtle',\n 'px-2',\n 'py-0.5',\n 'min-w-6',\n 'min-h-6',\n 'font-normal',\n 'inline-flex',\n 'justify-center',\n 'items-center',\n 'rounded-md',\n 'shrink-0',\n 'capsize-none'\n ]\n})\n\ntype KeyboardShortcutIndicatorProps = React.ComponentProps<\n typeof StyledKeyboardShortcutIndicator\n>\n\nexport const KeyboardShortcutIndicator = (\n props: KeyboardShortcutIndicatorProps\n) => {\n return <StyledKeyboardShortcutIndicator size=\"sm\" as=\"kbd\" {...props} />\n}\n"],"mappings":";;;;;;AA4BA,IAAa,oBAAoB,EAC/B,KACA,SACA,QACA,eAAe,OACf,WACA,GAAG,WACwB;CAC3B,MAAM,kBAAkB,QAAM,aAC3B,MAAoC;EACnC,OAAO,SAAS,EAAE,UAAU,aAAa;GACvC,IAAI,OAAO,QAAQ,QAAQ,CAAC,CAAC,OAAO,CAAC,KAAK,WAAW,EAAE,SAAS,KAAK,GACnE,OAAO;IAAE,OAAO;IAAG;GAAS,CAAC;EACjC,CAAC;EACD,YAAY,CAAC;CACf,GACA,CAAC,QAAQ,SAAS,CACpB;CAIA,MAAM,qBAAqB,QAAM,OAAO,eAAe;CACvD,QAAM,sBAAsB;EAC1B,mBAAmB,UAAU;CAC/B,CAAC;CAED,QAAM,gBAAgB;EACpB,IAAI,CAAC,cAAc;EAEnB,MAAM,YAAY,MAAqB,mBAAmB,QAAQ,CAAC;EACnE,OAAO,iBAAiB,WAAW,QAAQ;EAE3C,aAAa;GACX,OAAO,oBAAoB,WAAW,QAAQ;EAChD;CACF,GAAG,CAAC,YAAY,CAAC;CAIjB,OACE,oBAHgB,UAAU,OAAO,OAGjC;EACE,WAAW,eAAe,KAAA,IAAY;EACjC;EACL,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,kCAAkD,uBAAO,MAAM,EACnE,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAMD,IAAa,6BACX,UACG;CACH,OAAO,oBAAC,iCAAD;EAAiC,MAAK;EAAK,IAAG;EAAM,GAAI;CAAQ,CAAA;AACzE"}
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- type HandleNode = (node: any) => React.JSX.Element | null;
2
+ type HandleNode = (node: any, index?: number) => React.JSX.Element | null;
3
3
  declare const StyledMarkdownContent: import("../..").PolymorphicComponent<"div", unknown>;
4
4
  type MarkdownContentProps = React.ComponentProps<typeof StyledMarkdownContent> & {
5
5
  content: string;
@@ -42,12 +42,12 @@ var defaultComponentsMap = {
42
42
  text: MarkdownText,
43
43
  thematicBreak: MarkdownThematicBreak
44
44
  };
45
- var generateNodeKey = (node) => {
45
+ var generateNodeKey = (node, index) => {
46
46
  if (node.position?.start) {
47
47
  const { line, column, offset } = node.position.start;
48
48
  return `${node.type}${line}${column}${offset}`;
49
49
  }
50
- return `${node.type}${+/* @__PURE__ */ new Date()}`;
50
+ return `${node.type}${index}`;
51
51
  };
52
52
  var MarkdownContent = ({ content, customComponents = {}, className }) => {
53
53
  const AST = fromMarkdown(content, {
@@ -58,12 +58,12 @@ var MarkdownContent = ({ content, customComponents = {}, className }) => {
58
58
  ...defaultComponentsMap,
59
59
  ...customComponents
60
60
  };
61
- const handleNode = (node) => {
61
+ const handleNode = (node, index = 0) => {
62
62
  const MarkdownComponent = componentsMap[node.type];
63
63
  return MarkdownComponent ? /* @__PURE__ */ jsx(MarkdownComponent, {
64
64
  node,
65
65
  handleNode
66
- }, generateNodeKey(node)) : null;
66
+ }, generateNodeKey(node, index)) : null;
67
67
  };
68
68
  return /* @__PURE__ */ jsx(StyledMarkdownContent, {
69
69
  className,
@@ -1 +1 @@
1
- {"version":3,"file":"MarkdownContent.js","names":[],"sources":["../../../src/components/markdown-content/MarkdownContent.tsx"],"sourcesContent":["import directive from 'mdast-util-directive'\nimport fromMarkdown from 'mdast-util-from-markdown'\nimport syntax from 'micromark-extension-directive'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { MarkdownCode } from './components/MarkdownCode'\nimport { MarkdownEmphasis } from './components/MarkdownEmphasis'\nimport { MarkdownHeading } from './components/MarkdownHeading'\nimport { MarkdownImage } from './components/MarkdownImage'\nimport { MarkdownInlineCode } from './components/MarkdownInlineCode'\nimport { MarkdownLink } from './components/MarkdownLink'\nimport { MarkdownList } from './components/MarkdownList'\nimport { MarkdownListItem } from './components/MarkdownListItem'\nimport { MarkdownParagraph } from './components/MarkdownParagraph'\nimport { MarkdownStrong } from './components/MarkdownStrong'\nimport { MarkdownText } from './components/MarkdownText'\nimport { MarkdownThematicBreak } from './components/MarkdownThematicBreak'\n\ntype HandleNode = (node) => React.JSX.Element | null\n\nconst StyledMarkdownContent = styled('div', {\n base: [\n 'flex',\n 'flex-col',\n 'gap-8',\n '[&>h1]:max-w-[65ch]',\n '[&>h2]:max-w-[65ch]',\n '[&>h3]:max-w-[65ch]',\n '[&>h4]:max-w-[65ch]',\n '[&>p]:max-w-[75ch]',\n '[&>ul]:max-w-[75ch]'\n ]\n})\n\ntype MarkdownContentProps = React.ComponentProps<\n typeof StyledMarkdownContent\n> & {\n content: string\n customComponents?: {\n [key: string]: (props: {\n node: any\n handleNode: HandleNode\n }) => React.JSX.Element\n }\n}\n\nconst defaultComponentsMap = {\n code: MarkdownCode,\n emphasis: MarkdownEmphasis,\n heading: MarkdownHeading,\n inlineCode: MarkdownInlineCode,\n image: MarkdownImage,\n link: MarkdownLink,\n list: MarkdownList,\n listItem: MarkdownListItem,\n paragraph: MarkdownParagraph,\n strong: MarkdownStrong,\n text: MarkdownText,\n thematicBreak: MarkdownThematicBreak\n}\n\nconst generateNodeKey = (node) => {\n if (node.position?.start) {\n const { line, column, offset } = node.position.start\n return `${node.type}${line}${column}${offset}`\n }\n\n return `${node.type}${+new Date()}`\n}\n\nexport const MarkdownContent = ({\n content,\n customComponents = {},\n className\n}: MarkdownContentProps) => {\n const AST = fromMarkdown(content, {\n extensions: [syntax()],\n mdastExtensions: [directive.fromMarkdown]\n })\n\n const componentsMap = {\n ...defaultComponentsMap,\n ...customComponents\n }\n\n const handleNode: HandleNode = (node) => {\n const MarkdownComponent = componentsMap[node.type]\n\n return MarkdownComponent ? (\n <MarkdownComponent\n key={generateNodeKey(node)}\n node={node}\n handleNode={handleNode}\n />\n ) : null\n }\n\n return (\n <StyledMarkdownContent className={className}>\n {AST.children.map(handleNode)}\n </StyledMarkdownContent>\n )\n}\n\nMarkdownContent.displayName = 'MarkdownContent'\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAqBA,IAAM,wBAAwB,OAAO,OAAO,EAC1C,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAcD,IAAM,uBAAuB;CAC3B,MAAM;CACN,UAAU;CACV,SAAS;CACT,YAAY;CACZ,OAAO;CACP,MAAM;CACN,MAAM;CACN,UAAU;CACV,WAAW;CACX,QAAQ;CACR,MAAM;CACN,eAAe;AACjB;AAEA,IAAM,mBAAmB,SAAS;CAChC,IAAI,KAAK,UAAU,OAAO;EACxB,MAAM,EAAE,MAAM,QAAQ,WAAW,KAAK,SAAS;EAC/C,OAAO,GAAG,KAAK,OAAO,OAAO,SAAS;CACxC;CAEA,OAAO,GAAG,KAAK,OAAO,iBAAC,IAAI,KAAK;AAClC;AAEA,IAAa,mBAAmB,EAC9B,SACA,mBAAmB,CAAC,GACpB,gBAC0B;CAC1B,MAAM,MAAM,aAAa,SAAS;EAChC,YAAY,CAAC,OAAO,CAAC;EACrB,iBAAiB,CAAC,UAAU,YAAY;CAC1C,CAAC;CAED,MAAM,gBAAgB;EACpB,GAAG;EACH,GAAG;CACL;CAEA,MAAM,cAA0B,SAAS;EACvC,MAAM,oBAAoB,cAAc,KAAK;EAE7C,OAAO,oBACL,oBAAC,mBAAD;GAEQ;GACM;EACb,GAHM,gBAAgB,IAAI,CAG1B,IACC;CACN;CAEA,OACE,oBAAC,uBAAD;EAAkC;YAC/B,IAAI,SAAS,IAAI,UAAU;CACP,CAAA;AAE3B;AAEA,gBAAgB,cAAc"}
1
+ {"version":3,"file":"MarkdownContent.js","names":[],"sources":["../../../src/components/markdown-content/MarkdownContent.tsx"],"sourcesContent":["import directive from 'mdast-util-directive'\nimport fromMarkdown from 'mdast-util-from-markdown'\nimport syntax from 'micromark-extension-directive'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { MarkdownCode } from './components/MarkdownCode'\nimport { MarkdownEmphasis } from './components/MarkdownEmphasis'\nimport { MarkdownHeading } from './components/MarkdownHeading'\nimport { MarkdownImage } from './components/MarkdownImage'\nimport { MarkdownInlineCode } from './components/MarkdownInlineCode'\nimport { MarkdownLink } from './components/MarkdownLink'\nimport { MarkdownList } from './components/MarkdownList'\nimport { MarkdownListItem } from './components/MarkdownListItem'\nimport { MarkdownParagraph } from './components/MarkdownParagraph'\nimport { MarkdownStrong } from './components/MarkdownStrong'\nimport { MarkdownText } from './components/MarkdownText'\nimport { MarkdownThematicBreak } from './components/MarkdownThematicBreak'\n\ntype HandleNode = (node, index?: number) => React.JSX.Element | null\n\nconst StyledMarkdownContent = styled('div', {\n base: [\n 'flex',\n 'flex-col',\n 'gap-8',\n '[&>h1]:max-w-[65ch]',\n '[&>h2]:max-w-[65ch]',\n '[&>h3]:max-w-[65ch]',\n '[&>h4]:max-w-[65ch]',\n '[&>p]:max-w-[75ch]',\n '[&>ul]:max-w-[75ch]'\n ]\n})\n\ntype MarkdownContentProps = React.ComponentProps<\n typeof StyledMarkdownContent\n> & {\n content: string\n customComponents?: {\n [key: string]: (props: {\n node: any\n handleNode: HandleNode\n }) => React.JSX.Element\n }\n}\n\nconst defaultComponentsMap = {\n code: MarkdownCode,\n emphasis: MarkdownEmphasis,\n heading: MarkdownHeading,\n inlineCode: MarkdownInlineCode,\n image: MarkdownImage,\n link: MarkdownLink,\n list: MarkdownList,\n listItem: MarkdownListItem,\n paragraph: MarkdownParagraph,\n strong: MarkdownStrong,\n text: MarkdownText,\n thematicBreak: MarkdownThematicBreak\n}\n\nconst generateNodeKey = (node, index: number) => {\n if (node.position?.start) {\n const { line, column, offset } = node.position.start\n return `${node.type}${line}${column}${offset}`\n }\n\n // Deterministic fallback: keys must be stable across renders and identical\n // between server and client, so no timestamps or random values.\n return `${node.type}${index}`\n}\n\nexport const MarkdownContent = ({\n content,\n customComponents = {},\n className\n}: MarkdownContentProps) => {\n const AST = fromMarkdown(content, {\n extensions: [syntax()],\n mdastExtensions: [directive.fromMarkdown]\n })\n\n const componentsMap = {\n ...defaultComponentsMap,\n ...customComponents\n }\n\n const handleNode: HandleNode = (node, index = 0) => {\n const MarkdownComponent = componentsMap[node.type]\n\n return MarkdownComponent ? (\n <MarkdownComponent\n key={generateNodeKey(node, index)}\n node={node}\n handleNode={handleNode}\n />\n ) : null\n }\n\n return (\n <StyledMarkdownContent className={className}>\n {AST.children.map(handleNode)}\n </StyledMarkdownContent>\n )\n}\n\nMarkdownContent.displayName = 'MarkdownContent'\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAqBA,IAAM,wBAAwB,OAAO,OAAO,EAC1C,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAcD,IAAM,uBAAuB;CAC3B,MAAM;CACN,UAAU;CACV,SAAS;CACT,YAAY;CACZ,OAAO;CACP,MAAM;CACN,MAAM;CACN,UAAU;CACV,WAAW;CACX,QAAQ;CACR,MAAM;CACN,eAAe;AACjB;AAEA,IAAM,mBAAmB,MAAM,UAAkB;CAC/C,IAAI,KAAK,UAAU,OAAO;EACxB,MAAM,EAAE,MAAM,QAAQ,WAAW,KAAK,SAAS;EAC/C,OAAO,GAAG,KAAK,OAAO,OAAO,SAAS;CACxC;CAIA,OAAO,GAAG,KAAK,OAAO;AACxB;AAEA,IAAa,mBAAmB,EAC9B,SACA,mBAAmB,CAAC,GACpB,gBAC0B;CAC1B,MAAM,MAAM,aAAa,SAAS;EAChC,YAAY,CAAC,OAAO,CAAC;EACrB,iBAAiB,CAAC,UAAU,YAAY;CAC1C,CAAC;CAED,MAAM,gBAAgB;EACpB,GAAG;EACH,GAAG;CACL;CAEA,MAAM,cAA0B,MAAM,QAAQ,MAAM;EAClD,MAAM,oBAAoB,cAAc,KAAK;EAE7C,OAAO,oBACL,oBAAC,mBAAD;GAEQ;GACM;EACb,GAHM,gBAAgB,MAAM,KAAK,CAGjC,IACC;CACN;CAEA,OACE,oBAAC,uBAAD;EAAkC;YAC/B,IAAI,SAAS,IAAI,UAAU;CACP,CAAA;AAE3B;AAEA,gBAAgB,cAAc"}
@@ -2,7 +2,7 @@ import * as React$1 from "react";
2
2
  //#region src/components/navigation/NavigationMenu.context.tsx
3
3
  var NavigationMenuContext = React$1.createContext(void 0);
4
4
  var useNavigationMenuContext = () => {
5
- const context = React$1.useContext(NavigationMenuContext);
5
+ const context = React$1.use(NavigationMenuContext);
6
6
  if (context === void 0) throw new Error("useNavigationMenuContext must be used within a NavigationMenuContextProvider");
7
7
  return context;
8
8
  };
@@ -1 +1 @@
1
- {"version":3,"file":"NavigationMenu.context.js","names":[],"sources":["../../../src/components/navigation/NavigationMenu.context.tsx"],"sourcesContent":["import * as React from 'react'\n\ninterface NavigationMenuContextValue {\n onNodeUpdate: (\n trigger: HTMLButtonElement,\n itemValue: string\n ) => HTMLButtonElement\n}\n\nexport const NavigationMenuContext = React.createContext<\n NavigationMenuContextValue | undefined\n>(undefined)\n\nexport const useNavigationMenuContext = (): NavigationMenuContextValue => {\n const context = React.useContext(NavigationMenuContext)\n\n if (context === undefined) {\n throw new Error(\n 'useNavigationMenuContext must be used within a NavigationMenuContextProvider'\n )\n }\n\n return context\n}\n"],"mappings":";;AASA,IAAa,wBAAwB,QAAM,cAEzC,KAAA,CAAS;AAEX,IAAa,iCAA6D;CACxE,MAAM,UAAU,QAAM,WAAW,qBAAqB;CAEtD,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MACR,8EACF;CAGF,OAAO;AACT"}
1
+ {"version":3,"file":"NavigationMenu.context.js","names":[],"sources":["../../../src/components/navigation/NavigationMenu.context.tsx"],"sourcesContent":["import * as React from 'react'\n\ninterface NavigationMenuContextValue {\n onNodeUpdate: (\n trigger: HTMLButtonElement,\n itemValue: string\n ) => HTMLButtonElement\n}\n\nexport const NavigationMenuContext = React.createContext<\n NavigationMenuContextValue | undefined\n>(undefined)\n\nexport const useNavigationMenuContext = (): NavigationMenuContextValue => {\n const context = React.use(NavigationMenuContext)\n\n if (context === undefined) {\n throw new Error(\n 'useNavigationMenuContext must be used within a NavigationMenuContextProvider'\n )\n }\n\n return context\n}\n"],"mappings":";;AASA,IAAa,wBAAwB,QAAM,cAEzC,KAAA,CAAS;AAEX,IAAa,iCAA6D;CACxE,MAAM,UAAU,QAAM,IAAI,qBAAqB;CAE/C,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MACR,8EACF;CAGF,OAAO;AACT"}