@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.
- package/dist/components/alert-dialog/AlertDialog.context.js +9 -6
- package/dist/components/alert-dialog/AlertDialog.context.js.map +1 -1
- package/dist/components/alert-dialog/alert-context/reducer.js +1 -5
- package/dist/components/alert-dialog/alert-context/reducer.js.map +1 -1
- package/dist/components/alert-dialog/alert-context/types.d.ts +1 -2
- package/dist/components/avatar/Avatar.js +5 -6
- package/dist/components/avatar/Avatar.js.map +1 -1
- package/dist/components/avatar/AvatarIcon.js +2 -2
- package/dist/components/avatar/AvatarIcon.js.map +1 -1
- package/dist/components/avatar/AvatarInitial.js +2 -2
- package/dist/components/avatar/AvatarInitial.js.map +1 -1
- package/dist/components/badge/Badge.context.js +12 -13
- package/dist/components/badge/Badge.context.js.map +1 -1
- package/dist/components/badge/Badge.js +4 -3
- package/dist/components/badge/Badge.js.map +1 -1
- package/dist/components/badge/BadgeText.js +3 -3
- package/dist/components/badge/BadgeText.js.map +1 -1
- package/dist/components/banner/Banner.context.js +13 -14
- package/dist/components/banner/Banner.context.js.map +1 -1
- package/dist/components/banner/banner-regular/BannerRegularActions.js +2 -8
- package/dist/components/banner/banner-regular/BannerRegularActions.js.map +1 -1
- package/dist/components/banner/banner-regular/BannerRegularButton.js +2 -2
- package/dist/components/banner/banner-regular/BannerRegularButton.js.map +1 -1
- package/dist/components/banner/banner-regular/BannerRegularDismiss.js +1 -1
- package/dist/components/banner/banner-regular/BannerRegularDismiss.js.map +1 -1
- package/dist/components/banner/banner-slim/BannerSlimButton.js +2 -2
- package/dist/components/banner/banner-slim/BannerSlimButton.js.map +1 -1
- package/dist/components/banner/banner-slim/BannerSlimContainer.js +4 -13
- package/dist/components/banner/banner-slim/BannerSlimContainer.js.map +1 -1
- package/dist/components/calendar/Calendar.d.ts +1 -1
- package/dist/components/calendar/Calendar.js +4 -2
- package/dist/components/calendar/Calendar.js.map +1 -1
- package/dist/components/carousel/Carousel.js +2 -2
- package/dist/components/carousel/Carousel.js.map +1 -1
- package/dist/components/carousel/CarouselSlide.js +1 -1
- package/dist/components/carousel/CarouselSlide.js.map +1 -1
- package/dist/components/carousel/CarouselSlider.js +1 -1
- package/dist/components/carousel/CarouselSlider.js.map +1 -1
- package/dist/components/checkbox/Checkbox.js +2 -2
- package/dist/components/checkbox/Checkbox.js.map +1 -1
- package/dist/components/checkbox-field/CheckboxField.js +7 -3
- package/dist/components/checkbox-field/CheckboxField.js.map +1 -1
- package/dist/components/checkbox-group/CheckboxGroupAllItem.js +2 -2
- package/dist/components/checkbox-group/CheckboxGroupAllItem.js.map +1 -1
- package/dist/components/checkbox-group/CheckboxGroupChecked.context.js +13 -14
- package/dist/components/checkbox-group/CheckboxGroupChecked.context.js.map +1 -1
- package/dist/components/checkbox-group/CheckboxGroupItem.js +2 -2
- package/dist/components/checkbox-group/CheckboxGroupItem.js.map +1 -1
- package/dist/components/checkbox-group/CheckboxGroupMounted.context.js +6 -7
- package/dist/components/checkbox-group/CheckboxGroupMounted.context.js.map +1 -1
- package/dist/components/chip/Chip.js +4 -5
- package/dist/components/chip/Chip.js.map +1 -1
- package/dist/components/create-password-field/CreatePasswordField.js +1 -1
- package/dist/components/create-password-field/CreatePasswordField.js.map +1 -1
- package/dist/components/data-table/DataTable.context.js +43 -26
- package/dist/components/data-table/DataTable.context.js.map +1 -1
- package/dist/components/data-table/DataTable.types.d.ts +1 -0
- package/dist/components/data-table/DataTable.types.js.map +1 -1
- package/dist/components/data-table/DataTableBulkActionsFloating.js +2 -6
- package/dist/components/data-table/DataTableBulkActionsFloating.js.map +1 -1
- package/dist/components/data-table/DataTableGlobalFilter.js +16 -8
- package/dist/components/data-table/DataTableGlobalFilter.js.map +1 -1
- package/dist/components/data-table/DataTableHead.js +5 -14
- package/dist/components/data-table/DataTableHead.js.map +1 -1
- package/dist/components/data-table/DataTableRowSelectionCheckbox.js +1 -0
- package/dist/components/data-table/DataTableRowSelectionCheckbox.js.map +1 -1
- package/dist/components/data-table/DataTableSelectAllRowsCheckbox.js +2 -1
- package/dist/components/data-table/DataTableSelectAllRowsCheckbox.js.map +1 -1
- package/dist/components/data-table/DataTableTable.js +8 -6
- package/dist/components/data-table/DataTableTable.js.map +1 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTable.js +1 -1
- package/dist/components/data-table/drag-and-drop/DragAndDropTable.js.map +1 -1
- package/dist/components/data-table/pagination/Pagination.js +3 -2
- package/dist/components/data-table/pagination/Pagination.js.map +1 -1
- package/dist/components/data-table/usePagination.d.ts +1 -0
- package/dist/components/data-table/usePagination.js +7 -2
- package/dist/components/data-table/usePagination.js.map +1 -1
- package/dist/components/date-input/DateInput.js +4 -3
- package/dist/components/date-input/DateInput.js.map +1 -1
- package/dist/components/dismissible/DismissibleRoot.js +15 -16
- package/dist/components/dismissible/DismissibleRoot.js.map +1 -1
- package/dist/components/dismissible/DismissibleTrigger.js +1 -1
- package/dist/components/dismissible/DismissibleTrigger.js.map +1 -1
- package/dist/components/dismissible-group/DismissibleGroupItem.js +1 -1
- package/dist/components/dismissible-group/DismissibleGroupItem.js.map +1 -1
- package/dist/components/dismissible-group/DismissibleGroupRoot.js +5 -6
- package/dist/components/dismissible-group/DismissibleGroupRoot.js.map +1 -1
- package/dist/components/drawer/Drawer.context.js +2 -3
- package/dist/components/drawer/Drawer.context.js.map +1 -1
- package/dist/components/drawer/DrawerContent.js +1 -1
- package/dist/components/drawer/DrawerContent.js.map +1 -1
- package/dist/components/empty-state/EmptyState.context.js +2 -3
- package/dist/components/empty-state/EmptyState.context.js.map +1 -1
- package/dist/components/empty-state/EmptyStateBody.js +1 -1
- package/dist/components/empty-state/EmptyStateBody.js.map +1 -1
- package/dist/components/empty-state/EmptyStateImage.js +1 -1
- package/dist/components/empty-state/EmptyStateImage.js.map +1 -1
- package/dist/components/empty-state/EmptyStateTitle.js +1 -1
- package/dist/components/empty-state/EmptyStateTitle.js.map +1 -1
- package/dist/components/file-drop/FileDrop.js +3 -3
- package/dist/components/file-drop/FileDrop.js.map +1 -1
- package/dist/components/file-drop/useFileDrop.js +1 -1
- package/dist/components/file-drop/useFileDrop.js.map +1 -1
- package/dist/components/form/Form.js +7 -6
- package/dist/components/form/Form.js.map +1 -1
- package/dist/components/form/useFormCustomContext.js +1 -1
- package/dist/components/form/useFormCustomContext.js.map +1 -1
- package/dist/components/input/Input.js +2 -2
- package/dist/components/input/Input.js.map +1 -1
- package/dist/components/keyboard-shortcut/KeyboardShortcut.js +10 -7
- package/dist/components/keyboard-shortcut/KeyboardShortcut.js.map +1 -1
- package/dist/components/markdown-content/MarkdownContent.d.ts +1 -1
- package/dist/components/markdown-content/MarkdownContent.js +4 -4
- package/dist/components/markdown-content/MarkdownContent.js.map +1 -1
- package/dist/components/navigation/NavigationMenu.context.js +1 -1
- package/dist/components/navigation/NavigationMenu.context.js.map +1 -1
- package/dist/components/navigation/NavigationMenu.js +8 -7
- package/dist/components/navigation/NavigationMenu.js.map +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordion.d.ts +2 -2
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordion.js +3 -3
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordion.js.map +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionContent.js +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionContent.js.map +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.js +1 -1
- package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.js.map +1 -1
- package/dist/components/number-input/NumberInput.js +15 -16
- package/dist/components/number-input/NumberInput.js.map +1 -1
- package/dist/components/number-input-field/NumberInputField.js +7 -3
- package/dist/components/number-input-field/NumberInputField.js.map +1 -1
- package/dist/components/pagination/Pagination.context.js +29 -22
- package/dist/components/pagination/Pagination.context.js.map +1 -1
- package/dist/components/pagination/usePagination.js +1 -1
- package/dist/components/pagination/usePagination.js.map +1 -1
- package/dist/components/password-input/PasswordInput.js +1 -2
- package/dist/components/password-input/PasswordInput.js.map +1 -1
- package/dist/components/radio-button-field/RadioButtonField.js +7 -3
- package/dist/components/radio-button-field/RadioButtonField.js.map +1 -1
- package/dist/components/search-input/SearchInput.js +7 -11
- package/dist/components/search-input/SearchInput.js.map +1 -1
- package/dist/components/section-message/SectionMessage.context.js +15 -16
- package/dist/components/section-message/SectionMessage.context.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlBadge.js +1 -1
- package/dist/components/segmented-control/SegmentedControlBadge.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlDescription.js +1 -1
- package/dist/components/segmented-control/SegmentedControlDescription.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlHeading.js +1 -1
- package/dist/components/segmented-control/SegmentedControlHeading.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlIcon.js +1 -1
- package/dist/components/segmented-control/SegmentedControlIcon.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlItem.js +1 -1
- package/dist/components/segmented-control/SegmentedControlItem.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlItemList.js +20 -14
- package/dist/components/segmented-control/SegmentedControlItemList.js.map +1 -1
- package/dist/components/segmented-control/SegmentedControlRoot.js +14 -18
- package/dist/components/segmented-control/SegmentedControlRoot.js.map +1 -1
- package/dist/components/select-menu/SelectMenu.context.js +1 -1
- package/dist/components/select-menu/SelectMenu.context.js.map +1 -1
- package/dist/components/select-menu/SelectMenu.js +18 -12
- package/dist/components/select-menu/SelectMenu.js.map +1 -1
- package/dist/components/side-bar/SideBar.context.js +1 -1
- package/dist/components/side-bar/SideBar.context.js.map +1 -1
- package/dist/components/side-bar/SideBar.js +2 -2
- package/dist/components/side-bar/SideBar.js.map +1 -1
- package/dist/components/slider-field/SliderField.js +8 -3
- package/dist/components/slider-field/SliderField.js.map +1 -1
- package/dist/components/sortable/SortableRoot.js +5 -3
- package/dist/components/sortable/SortableRoot.js.map +1 -1
- package/dist/components/stepper/Stepper.context.js +38 -30
- package/dist/components/stepper/Stepper.context.js.map +1 -1
- package/dist/components/toast/Toast.context.js +1 -1
- package/dist/components/toast/Toast.context.js.map +1 -1
- package/dist/components/toast/ToastProvider.js +1 -1
- package/dist/components/toast/ToastProvider.js.map +1 -1
- package/dist/components/tree/TreeCollapsible.d.ts +2 -2
- package/dist/components/tree/TreeCollapsible.js +3 -3
- package/dist/components/tree/TreeCollapsible.js.map +1 -1
- package/dist/components/tree/TreeCollapsibleContent.js +1 -1
- package/dist/components/tree/TreeCollapsibleContent.js.map +1 -1
- package/dist/components/tree/TreeCollapsibleTrigger.js +1 -1
- package/dist/components/tree/TreeCollapsibleTrigger.js.map +1 -1
- package/dist/docgen.json +1 -1
- package/dist/index.cjs.js +520 -462
- package/dist/index.cjs.js.map +1 -1
- package/dist/styled.js +5 -1
- package/dist/styled.js.map +1 -1
- package/dist/utilities/hooks/useCallbackRef.d.ts +3 -3
- package/dist/utilities/hooks/useCallbackRef.js +4 -1
- package/dist/utilities/hooks/useCallbackRef.js.map +1 -1
- package/dist/utilities/hooks/useResizeObserver.js +13 -3
- package/dist/utilities/hooks/useResizeObserver.js.map +1 -1
- package/dist/utilities/hooks/useScrollPosition.js +22 -17
- package/dist/utilities/hooks/useScrollPosition.js.map +1 -1
- package/dist/utilities/hooks/useWindowScrollPosition.js +19 -15
- package/dist/utilities/hooks/useWindowScrollPosition.js.map +1 -1
- package/dist/utilities/uri/index.js +1 -6
- package/dist/utilities/uri/index.js.map +1 -1
- 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
|
-
|
|
13
|
-
|
|
14
|
-
|
|
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
|
|
17
|
-
|
|
18
|
-
|
|
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.
|
|
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
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
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
|
|
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
|
-
|
|
7
|
-
|
|
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
|
|
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.
|
|
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.
|
|
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
|
-
|
|
7
|
-
|
|
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
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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
|
|
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
|
|
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.
|
|
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.
|
|
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
|
|
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
|
|
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.
|
|
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.
|
|
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
|
|
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 =
|
|
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 =
|
|
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)
|
|
22
|
+
if (!targetWindow) return;
|
|
23
|
+
const listener = (e) => handleOnKeydownRef.current(e);
|
|
24
|
+
window.addEventListener("keydown", listener);
|
|
22
25
|
return () => {
|
|
23
|
-
window.removeEventListener("keydown",
|
|
26
|
+
window.removeEventListener("keydown", listener);
|
|
24
27
|
};
|
|
25
|
-
}, [targetWindow
|
|
28
|
+
}, [targetWindow]);
|
|
26
29
|
return /* @__PURE__ */ jsx(asChild ? Slot : "div", {
|
|
27
30
|
onKeyDown: targetWindow ? void 0 : handleOnKeydown,
|
|
28
|
-
ref
|
|
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 {
|
|
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}${
|
|
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}${
|
|
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.
|
|
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.
|
|
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"}
|