@medusajs/ui 4.0.5-preview-20250211104335 → 4.0.5-snapshot-20250127145424
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/cjs/blocks/data-table/components/data-table-action-cell.d.ts.map +1 -1
- package/dist/cjs/blocks/data-table/components/data-table-action-cell.js +1 -1
- package/dist/cjs/blocks/data-table/components/data-table-action-cell.js.map +1 -1
- package/dist/cjs/blocks/data-table/components/data-table-select-cell.d.ts.map +1 -1
- package/dist/cjs/blocks/data-table/components/data-table-select-cell.js.map +1 -1
- package/dist/cjs/blocks/data-table/components/data-table-table.js +4 -4
- package/dist/cjs/blocks/data-table/components/data-table-table.js.map +1 -1
- package/dist/cjs/blocks/data-table/index.d.ts +1 -1
- package/dist/cjs/blocks/data-table/index.d.ts.map +1 -1
- package/dist/cjs/blocks/data-table/index.js.map +1 -1
- package/dist/cjs/blocks/data-table/types.d.ts +1 -2
- package/dist/cjs/blocks/data-table/types.d.ts.map +1 -1
- package/dist/cjs/blocks/data-table/types.js.map +1 -1
- package/dist/cjs/blocks/data-table/use-data-table.d.ts +1 -2
- package/dist/cjs/blocks/data-table/use-data-table.d.ts.map +1 -1
- package/dist/cjs/blocks/data-table/use-data-table.js +1 -2
- package/dist/cjs/blocks/data-table/use-data-table.js.map +1 -1
- package/dist/cjs/components/alert/alert.d.ts.map +1 -1
- package/dist/cjs/components/alert/alert.js +0 -1
- package/dist/cjs/components/alert/alert.js.map +1 -1
- package/dist/cjs/components/avatar/avatar.d.ts +2 -2
- package/dist/cjs/components/avatar/avatar.d.ts.map +1 -1
- package/dist/cjs/components/avatar/avatar.js +4 -4
- package/dist/cjs/components/avatar/avatar.js.map +1 -1
- package/dist/cjs/components/badge/badge.d.ts.map +1 -1
- package/dist/cjs/components/badge/badge.js +2 -2
- package/dist/cjs/components/badge/badge.js.map +1 -1
- package/dist/cjs/components/button/button.d.ts.map +1 -1
- package/dist/cjs/components/button/button.js +2 -2
- package/dist/cjs/components/button/button.js.map +1 -1
- package/dist/cjs/components/calender/calendar.d.ts.map +1 -1
- package/dist/cjs/components/calender/calendar.js +0 -1
- package/dist/cjs/components/calender/calendar.js.map +1 -1
- package/dist/cjs/components/checkbox/checkbox.d.ts +2 -2
- package/dist/cjs/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/cjs/components/checkbox/checkbox.js +3 -3
- package/dist/cjs/components/checkbox/checkbox.js.map +1 -1
- package/dist/cjs/components/checkbox/types.d.ts +2 -2
- package/dist/cjs/components/checkbox/types.d.ts.map +1 -1
- package/dist/cjs/components/checkbox/types.js.map +1 -1
- package/dist/cjs/components/command-bar/command-bar.d.ts.map +1 -1
- package/dist/cjs/components/command-bar/command-bar.js +7 -10
- package/dist/cjs/components/command-bar/command-bar.js.map +1 -1
- package/dist/cjs/components/copy/copy.js +2 -2
- package/dist/cjs/components/copy/copy.js.map +1 -1
- package/dist/cjs/components/drawer/drawer.d.ts +9 -9
- package/dist/cjs/components/drawer/drawer.d.ts.map +1 -1
- package/dist/cjs/components/drawer/drawer.js +10 -10
- package/dist/cjs/components/drawer/drawer.js.map +1 -1
- package/dist/cjs/components/dropdown-menu/dropdown-menu.d.ts +14 -14
- package/dist/cjs/components/dropdown-menu/dropdown-menu.d.ts.map +1 -1
- package/dist/cjs/components/dropdown-menu/dropdown-menu.js +18 -18
- package/dist/cjs/components/dropdown-menu/dropdown-menu.js.map +1 -1
- package/dist/cjs/components/focus-modal/focus-modal.d.ts +9 -9
- package/dist/cjs/components/focus-modal/focus-modal.d.ts.map +1 -1
- package/dist/cjs/components/focus-modal/focus-modal.js +10 -10
- package/dist/cjs/components/focus-modal/focus-modal.js.map +1 -1
- package/dist/cjs/components/hint/hint.js.map +1 -1
- package/dist/cjs/components/icon-badge/icon-badge.d.ts.map +1 -1
- package/dist/cjs/components/icon-badge/icon-badge.js +2 -2
- package/dist/cjs/components/icon-badge/icon-badge.js.map +1 -1
- package/dist/cjs/components/icon-button/icon-button.d.ts.map +1 -1
- package/dist/cjs/components/icon-button/icon-button.js +2 -2
- package/dist/cjs/components/icon-button/icon-button.js.map +1 -1
- package/dist/cjs/components/label/label.d.ts.map +1 -1
- package/dist/cjs/components/label/label.js +2 -2
- package/dist/cjs/components/label/label.js.map +1 -1
- package/dist/cjs/components/popover/popover.d.ts +6 -6
- package/dist/cjs/components/popover/popover.d.ts.map +1 -1
- package/dist/cjs/components/popover/popover.js +7 -7
- package/dist/cjs/components/popover/popover.js.map +1 -1
- package/dist/cjs/components/progress-accordion/progress-accordion.d.ts +5 -5
- package/dist/cjs/components/progress-accordion/progress-accordion.d.ts.map +1 -1
- package/dist/cjs/components/progress-accordion/progress-accordion.js +6 -6
- package/dist/cjs/components/progress-accordion/progress-accordion.js.map +1 -1
- package/dist/cjs/components/progress-tabs/progress-tabs.d.ts +5 -5
- package/dist/cjs/components/progress-tabs/progress-tabs.d.ts.map +1 -1
- package/dist/cjs/components/progress-tabs/progress-tabs.js +5 -5
- package/dist/cjs/components/progress-tabs/progress-tabs.js.map +1 -1
- package/dist/cjs/components/prompt/prompt.d.ts +8 -8
- package/dist/cjs/components/prompt/prompt.d.ts.map +1 -1
- package/dist/cjs/components/prompt/prompt.js +10 -10
- package/dist/cjs/components/prompt/prompt.js.map +1 -1
- package/dist/cjs/components/radio-group/radio-group.d.ts +4 -4
- package/dist/cjs/components/radio-group/radio-group.d.ts.map +1 -1
- package/dist/cjs/components/radio-group/radio-group.js +6 -6
- package/dist/cjs/components/radio-group/radio-group.js.map +1 -1
- package/dist/cjs/components/select/select.d.ts +9 -9
- package/dist/cjs/components/select/select.d.ts.map +1 -1
- package/dist/cjs/components/select/select.js +14 -14
- package/dist/cjs/components/select/select.js.map +1 -1
- package/dist/cjs/components/skeleton/skeleton.d.ts.map +1 -1
- package/dist/cjs/components/skeleton/skeleton.js +1 -1
- package/dist/cjs/components/skeleton/skeleton.js.map +1 -1
- package/dist/cjs/components/switch/switch.d.ts +2 -2
- package/dist/cjs/components/switch/switch.d.ts.map +1 -1
- package/dist/cjs/components/switch/switch.js +3 -3
- package/dist/cjs/components/switch/switch.js.map +1 -1
- package/dist/cjs/components/tabs/tabs.d.ts +5 -5
- package/dist/cjs/components/tabs/tabs.d.ts.map +1 -1
- package/dist/cjs/components/tabs/tabs.js +5 -5
- package/dist/cjs/components/tabs/tabs.js.map +1 -1
- package/dist/cjs/components/text/text.d.ts.map +1 -1
- package/dist/cjs/components/text/text.js +2 -2
- package/dist/cjs/components/text/text.js.map +1 -1
- package/dist/cjs/components/textarea/textarea.js +1 -1
- package/dist/cjs/components/textarea/textarea.js.map +1 -1
- package/dist/cjs/components/toast/toast.d.ts.map +1 -1
- package/dist/cjs/components/toast/toast.js +1 -1
- package/dist/cjs/components/toast/toast.js.map +1 -1
- package/dist/cjs/components/tooltip/tooltip.d.ts +3 -3
- package/dist/cjs/components/tooltip/tooltip.d.ts.map +1 -1
- package/dist/cjs/components/tooltip/tooltip.js +6 -6
- package/dist/cjs/components/tooltip/tooltip.js.map +1 -1
- package/dist/cjs/index.d.ts +0 -1
- package/dist/cjs/index.d.ts.map +1 -1
- package/dist/cjs/index.js +1 -3
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/blocks/data-table/components/data-table-action-cell.d.ts.map +1 -1
- package/dist/esm/blocks/data-table/components/data-table-action-cell.js +1 -1
- package/dist/esm/blocks/data-table/components/data-table-action-cell.js.map +1 -1
- package/dist/esm/blocks/data-table/components/data-table-select-cell.d.ts.map +1 -1
- package/dist/esm/blocks/data-table/components/data-table-select-cell.js.map +1 -1
- package/dist/esm/blocks/data-table/components/data-table-table.js +4 -4
- package/dist/esm/blocks/data-table/components/data-table-table.js.map +1 -1
- package/dist/esm/blocks/data-table/index.d.ts +1 -1
- package/dist/esm/blocks/data-table/index.d.ts.map +1 -1
- package/dist/esm/blocks/data-table/index.js.map +1 -1
- package/dist/esm/blocks/data-table/types.d.ts +1 -2
- package/dist/esm/blocks/data-table/types.d.ts.map +1 -1
- package/dist/esm/blocks/data-table/types.js.map +1 -1
- package/dist/esm/blocks/data-table/use-data-table.d.ts +1 -2
- package/dist/esm/blocks/data-table/use-data-table.d.ts.map +1 -1
- package/dist/esm/blocks/data-table/use-data-table.js +1 -2
- package/dist/esm/blocks/data-table/use-data-table.js.map +1 -1
- package/dist/esm/components/alert/alert.d.ts.map +1 -1
- package/dist/esm/components/alert/alert.js +0 -1
- package/dist/esm/components/alert/alert.js.map +1 -1
- package/dist/esm/components/avatar/avatar.d.ts +2 -2
- package/dist/esm/components/avatar/avatar.d.ts.map +1 -1
- package/dist/esm/components/avatar/avatar.js +4 -4
- package/dist/esm/components/avatar/avatar.js.map +1 -1
- package/dist/esm/components/badge/badge.d.ts.map +1 -1
- package/dist/esm/components/badge/badge.js +2 -2
- package/dist/esm/components/badge/badge.js.map +1 -1
- package/dist/esm/components/button/button.d.ts.map +1 -1
- package/dist/esm/components/button/button.js +2 -2
- package/dist/esm/components/button/button.js.map +1 -1
- package/dist/esm/components/calender/calendar.d.ts.map +1 -1
- package/dist/esm/components/calender/calendar.js +0 -1
- package/dist/esm/components/calender/calendar.js.map +1 -1
- package/dist/esm/components/checkbox/checkbox.d.ts +2 -2
- package/dist/esm/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/esm/components/checkbox/checkbox.js +3 -3
- package/dist/esm/components/checkbox/checkbox.js.map +1 -1
- package/dist/esm/components/checkbox/types.d.ts +2 -2
- package/dist/esm/components/checkbox/types.d.ts.map +1 -1
- package/dist/esm/components/checkbox/types.js.map +1 -1
- package/dist/esm/components/command-bar/command-bar.d.ts.map +1 -1
- package/dist/esm/components/command-bar/command-bar.js +2 -5
- package/dist/esm/components/command-bar/command-bar.js.map +1 -1
- package/dist/esm/components/copy/copy.js +2 -2
- package/dist/esm/components/copy/copy.js.map +1 -1
- package/dist/esm/components/drawer/drawer.d.ts +9 -9
- package/dist/esm/components/drawer/drawer.d.ts.map +1 -1
- package/dist/esm/components/drawer/drawer.js +10 -10
- package/dist/esm/components/drawer/drawer.js.map +1 -1
- package/dist/esm/components/dropdown-menu/dropdown-menu.d.ts +14 -14
- package/dist/esm/components/dropdown-menu/dropdown-menu.d.ts.map +1 -1
- package/dist/esm/components/dropdown-menu/dropdown-menu.js +18 -18
- package/dist/esm/components/dropdown-menu/dropdown-menu.js.map +1 -1
- package/dist/esm/components/focus-modal/focus-modal.d.ts +9 -9
- package/dist/esm/components/focus-modal/focus-modal.d.ts.map +1 -1
- package/dist/esm/components/focus-modal/focus-modal.js +10 -10
- package/dist/esm/components/focus-modal/focus-modal.js.map +1 -1
- package/dist/esm/components/hint/hint.js.map +1 -1
- package/dist/esm/components/icon-badge/icon-badge.d.ts.map +1 -1
- package/dist/esm/components/icon-badge/icon-badge.js +2 -2
- package/dist/esm/components/icon-badge/icon-badge.js.map +1 -1
- package/dist/esm/components/icon-button/icon-button.d.ts.map +1 -1
- package/dist/esm/components/icon-button/icon-button.js +2 -2
- package/dist/esm/components/icon-button/icon-button.js.map +1 -1
- package/dist/esm/components/label/label.d.ts.map +1 -1
- package/dist/esm/components/label/label.js +2 -2
- package/dist/esm/components/label/label.js.map +1 -1
- package/dist/esm/components/popover/popover.d.ts +6 -6
- package/dist/esm/components/popover/popover.d.ts.map +1 -1
- package/dist/esm/components/popover/popover.js +7 -7
- package/dist/esm/components/popover/popover.js.map +1 -1
- package/dist/esm/components/progress-accordion/progress-accordion.d.ts +5 -5
- package/dist/esm/components/progress-accordion/progress-accordion.d.ts.map +1 -1
- package/dist/esm/components/progress-accordion/progress-accordion.js +6 -6
- package/dist/esm/components/progress-accordion/progress-accordion.js.map +1 -1
- package/dist/esm/components/progress-tabs/progress-tabs.d.ts +5 -5
- package/dist/esm/components/progress-tabs/progress-tabs.d.ts.map +1 -1
- package/dist/esm/components/progress-tabs/progress-tabs.js +5 -5
- package/dist/esm/components/progress-tabs/progress-tabs.js.map +1 -1
- package/dist/esm/components/prompt/prompt.d.ts +8 -8
- package/dist/esm/components/prompt/prompt.d.ts.map +1 -1
- package/dist/esm/components/prompt/prompt.js +10 -10
- package/dist/esm/components/prompt/prompt.js.map +1 -1
- package/dist/esm/components/radio-group/radio-group.d.ts +4 -4
- package/dist/esm/components/radio-group/radio-group.d.ts.map +1 -1
- package/dist/esm/components/radio-group/radio-group.js +6 -6
- package/dist/esm/components/radio-group/radio-group.js.map +1 -1
- package/dist/esm/components/select/select.d.ts +9 -9
- package/dist/esm/components/select/select.d.ts.map +1 -1
- package/dist/esm/components/select/select.js +14 -14
- package/dist/esm/components/select/select.js.map +1 -1
- package/dist/esm/components/skeleton/skeleton.d.ts.map +1 -1
- package/dist/esm/components/skeleton/skeleton.js +1 -1
- package/dist/esm/components/skeleton/skeleton.js.map +1 -1
- package/dist/esm/components/switch/switch.d.ts +2 -2
- package/dist/esm/components/switch/switch.d.ts.map +1 -1
- package/dist/esm/components/switch/switch.js +3 -3
- package/dist/esm/components/switch/switch.js.map +1 -1
- package/dist/esm/components/tabs/tabs.d.ts +5 -5
- package/dist/esm/components/tabs/tabs.d.ts.map +1 -1
- package/dist/esm/components/tabs/tabs.js +5 -5
- package/dist/esm/components/tabs/tabs.js.map +1 -1
- package/dist/esm/components/text/text.d.ts.map +1 -1
- package/dist/esm/components/text/text.js +2 -2
- package/dist/esm/components/text/text.js.map +1 -1
- package/dist/esm/components/textarea/textarea.js +1 -1
- package/dist/esm/components/textarea/textarea.js.map +1 -1
- package/dist/esm/components/toast/toast.d.ts.map +1 -1
- package/dist/esm/components/toast/toast.js +1 -1
- package/dist/esm/components/toast/toast.js.map +1 -1
- package/dist/esm/components/tooltip/tooltip.d.ts +3 -3
- package/dist/esm/components/tooltip/tooltip.d.ts.map +1 -1
- package/dist/esm/components/tooltip/tooltip.js +6 -6
- package/dist/esm/components/tooltip/tooltip.js.map +1 -1
- package/dist/esm/index.d.ts +0 -1
- package/dist/esm/index.d.ts.map +1 -1
- package/dist/esm/index.js +0 -1
- package/dist/esm/index.js.map +1 -1
- package/package.json +20 -6
- package/dist/cjs/components/divider/divider.d.ts +0 -8
- package/dist/cjs/components/divider/divider.d.ts.map +0 -1
- package/dist/cjs/components/divider/divider.js +0 -17
- package/dist/cjs/components/divider/divider.js.map +0 -1
- package/dist/cjs/components/divider/index.d.ts +0 -2
- package/dist/cjs/components/divider/index.d.ts.map +0 -1
- package/dist/cjs/components/divider/index.js +0 -5
- package/dist/cjs/components/divider/index.js.map +0 -1
- package/dist/cjs/utils/is-input-element.d.ts +0 -3
- package/dist/cjs/utils/is-input-element.d.ts.map +0 -1
- package/dist/cjs/utils/is-input-element.js +0 -12
- package/dist/cjs/utils/is-input-element.js.map +0 -1
- package/dist/esm/components/divider/divider.d.ts +0 -8
- package/dist/esm/components/divider/divider.d.ts.map +0 -1
- package/dist/esm/components/divider/divider.js +0 -12
- package/dist/esm/components/divider/divider.js.map +0 -1
- package/dist/esm/components/divider/index.d.ts +0 -2
- package/dist/esm/components/divider/index.d.ts.map +0 -1
- package/dist/esm/components/divider/index.js +0 -2
- package/dist/esm/components/divider/index.js.map +0 -1
- package/dist/esm/utils/is-input-element.d.ts +0 -3
- package/dist/esm/utils/is-input-element.d.ts.map +0 -1
- package/dist/esm/utils/is-input-element.js +0 -9
- package/dist/esm/utils/is-input-element.js.map +0 -1
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
exports.Drawer = void 0;
|
5
5
|
const tslib_1 = require("tslib");
|
6
6
|
const icons_1 = require("@medusajs/icons");
|
7
|
-
const
|
7
|
+
const DrawerPrimitives = tslib_1.__importStar(require("@radix-ui/react-dialog"));
|
8
8
|
const React = tslib_1.__importStar(require("react"));
|
9
9
|
const icon_button_1 = require("../icon-button");
|
10
10
|
const kbd_1 = require("../kbd");
|
@@ -14,7 +14,7 @@ const clx_1 = require("../../utils/clx");
|
|
14
14
|
* This component is based on the [Radix UI Dialog](https://www.radix-ui.com/primitives/docs/components/dialog) primitives.
|
15
15
|
*/
|
16
16
|
const DrawerRoot = (props) => {
|
17
|
-
return React.createElement(
|
17
|
+
return React.createElement(DrawerPrimitives.Root, { ...props });
|
18
18
|
};
|
19
19
|
DrawerRoot.displayName = "Drawer";
|
20
20
|
/**
|
@@ -22,7 +22,7 @@ DrawerRoot.displayName = "Drawer";
|
|
22
22
|
* It accepts props from the [Radix UI Dialog Trigger](https://www.radix-ui.com/primitives/docs/components/dialog#trigger) component.
|
23
23
|
*/
|
24
24
|
const DrawerTrigger = React.forwardRef(({ className, ...props }, ref) => {
|
25
|
-
return (React.createElement(
|
25
|
+
return (React.createElement(DrawerPrimitives.Trigger, { ref: ref, className: (0, clx_1.clx)(className), ...props }));
|
26
26
|
});
|
27
27
|
DrawerTrigger.displayName = "Drawer.Trigger";
|
28
28
|
/**
|
@@ -30,7 +30,7 @@ DrawerTrigger.displayName = "Drawer.Trigger";
|
|
30
30
|
* It accepts props from the [Radix UI Dialog Close](https://www.radix-ui.com/primitives/docs/components/dialog#close) component.
|
31
31
|
*/
|
32
32
|
const DrawerClose = React.forwardRef(({ className, ...props }, ref) => {
|
33
|
-
return (React.createElement(
|
33
|
+
return (React.createElement(DrawerPrimitives.Close, { ref: ref, className: (0, clx_1.clx)(className), ...props }));
|
34
34
|
});
|
35
35
|
DrawerClose.displayName = "Drawer.Close";
|
36
36
|
/**
|
@@ -38,7 +38,7 @@ DrawerClose.displayName = "Drawer.Close";
|
|
38
38
|
* It accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.
|
39
39
|
*/
|
40
40
|
const DrawerPortal = (props) => {
|
41
|
-
return React.createElement(
|
41
|
+
return React.createElement(DrawerPrimitives.DialogPortal, { ...props });
|
42
42
|
};
|
43
43
|
DrawerPortal.displayName = "Drawer.Portal";
|
44
44
|
/**
|
@@ -46,7 +46,7 @@ DrawerPortal.displayName = "Drawer.Portal";
|
|
46
46
|
* It accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.
|
47
47
|
*/
|
48
48
|
const DrawerOverlay = React.forwardRef(({ className, ...props }, ref) => {
|
49
|
-
return (React.createElement(
|
49
|
+
return (React.createElement(DrawerPrimitives.Overlay, { ref: ref, className: (0, clx_1.clx)("bg-ui-bg-overlay fixed inset-0", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props }));
|
50
50
|
});
|
51
51
|
DrawerOverlay.displayName = "Drawer.Overlay";
|
52
52
|
/**
|
@@ -56,7 +56,7 @@ DrawerOverlay.displayName = "Drawer.Overlay";
|
|
56
56
|
const DrawerContent = React.forwardRef(({ className, overlayProps, portalProps, ...props }, ref) => {
|
57
57
|
return (React.createElement(DrawerPortal, { ...portalProps },
|
58
58
|
React.createElement(DrawerOverlay, { ...overlayProps }),
|
59
|
-
React.createElement(
|
59
|
+
React.createElement(DrawerPrimitives.Content, { ref: ref, className: (0, clx_1.clx)("bg-ui-bg-base shadow-elevation-modal border-ui-border-base fixed inset-y-2 flex w-full flex-1 flex-col rounded-lg border outline-none max-sm:inset-x-2 max-sm:w-[calc(100%-16px)] sm:right-2 sm:max-w-[560px]", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:slide-out-to-right-1/2 data-[state=open]:slide-in-from-right-1/2 duration-200", className), ...props })));
|
60
60
|
});
|
61
61
|
DrawerContent.displayName = "Drawer.Content";
|
62
62
|
/**
|
@@ -68,7 +68,7 @@ const DrawerHeader = React.forwardRef(({ children, className, ...props }, ref) =
|
|
68
68
|
React.createElement("div", { className: (0, clx_1.clx)("flex flex-col gap-y-1", className) }, children),
|
69
69
|
React.createElement("div", { className: "flex items-center gap-x-2" },
|
70
70
|
React.createElement(kbd_1.Kbd, null, "esc"),
|
71
|
-
React.createElement(
|
71
|
+
React.createElement(DrawerPrimitives.Close, { asChild: true },
|
72
72
|
React.createElement(icon_button_1.IconButton, { size: "small", type: "button", variant: "transparent" },
|
73
73
|
React.createElement(icons_1.XMark, null))))));
|
74
74
|
});
|
@@ -93,13 +93,13 @@ DrawerFooter.displayName = "Drawer.Footer";
|
|
93
93
|
* This component adds an accessible title to the drawer.
|
94
94
|
* It accepts props from the [Radix UI Dialog Title](https://www.radix-ui.com/primitives/docs/components/dialog#title) component.
|
95
95
|
*/
|
96
|
-
const DrawerTitle =
|
96
|
+
const DrawerTitle = DrawerPrimitives.Title;
|
97
97
|
DrawerTitle.displayName = "Drawer.Title";
|
98
98
|
/**
|
99
99
|
* This component adds accessible description to the drawer.
|
100
100
|
* It accepts props from the [Radix UI Dialog Description](https://www.radix-ui.com/primitives/docs/components/dialog#description) component.
|
101
101
|
*/
|
102
|
-
const DrawerDescription = React.forwardRef(({ className, children, ...props }, ref) => (React.createElement(
|
102
|
+
const DrawerDescription = React.forwardRef(({ className, children, ...props }, ref) => (React.createElement(DrawerPrimitives.Description, { ref: ref, className: (0, clx_1.clx)(className), asChild: true, ...props },
|
103
103
|
React.createElement(text_1.Text, null, children))));
|
104
104
|
DrawerDescription.displayName = "Drawer.Description";
|
105
105
|
const Drawer = Object.assign(DrawerRoot, {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport { XMark } from \"@medusajs/icons\"\nimport { Dialog as RadixDialog } from \"radix-ui\"\nimport * as React from \"react\"\n\nimport { IconButton } from \"@/components/icon-button\"\nimport { Kbd } from \"@/components/kbd\"\nimport { Text } from \"@/components/text\"\nimport { clx } from \"@/utils/clx\"\n\ninterface DrawerRootProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Root> {}\n\n/**\n * This component is based on the [Radix UI Dialog](https://www.radix-ui.com/primitives/docs/components/dialog) primitives.\n */\nconst DrawerRoot = (\n props: DrawerRootProps\n) => {\n return <RadixDialog.Root {...props} />\n}\nDrawerRoot.displayName = \"Drawer\"\n\ninterface DrawerTriggerProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Trigger> {}\n\n/**\n * This component is used to create the trigger button that opens the drawer.\n * It accepts props from the [Radix UI Dialog Trigger](https://www.radix-ui.com/primitives/docs/components/dialog#trigger) component.\n */\nconst DrawerTrigger = React.forwardRef<\n React.ElementRef<typeof RadixDialog.Trigger>,\n DrawerTriggerProps\n>(({ className, ...props }: DrawerTriggerProps, ref) => {\n return (\n <RadixDialog.Trigger ref={ref} className={clx(className)} {...props} />\n )\n})\nDrawerTrigger.displayName = \"Drawer.Trigger\"\n\ninterface DrawerCloseProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Close> {}\n\n/**\n * This component is used to create the close button for the drawer.\n * It accepts props from the [Radix UI Dialog Close](https://www.radix-ui.com/primitives/docs/components/dialog#close) component.\n */\nconst DrawerClose = React.forwardRef<\n React.ElementRef<typeof RadixDialog.Close>,\n DrawerCloseProps\n>(({ className, ...props }: DrawerCloseProps, ref) => {\n return (\n <RadixDialog.Close ref={ref} className={clx(className)} {...props} />\n )\n})\nDrawerClose.displayName = \"Drawer.Close\"\n\ninterface DrawerPortalProps extends RadixDialog.DialogPortalProps {}\n\n/**\n * The `Drawer.Content` component uses this component to wrap the drawer content.\n * It accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.\n */\nconst DrawerPortal = (props: DrawerPortalProps) => {\n return <RadixDialog.DialogPortal {...props} />\n}\nDrawerPortal.displayName = \"Drawer.Portal\"\n\ninterface DrawerOverlayProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Overlay> {}\n\n/**\n * This component is used to create the overlay for the drawer.\n * It accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.\n */\nconst DrawerOverlay = React.forwardRef<\n React.ElementRef<typeof RadixDialog.Overlay>,\n DrawerOverlayProps\n>(({ className, ...props }: DrawerOverlayProps, ref) => {\n return (\n <RadixDialog.Overlay\n ref={ref}\n className={clx(\n \"bg-ui-bg-overlay fixed inset-0\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n className\n )}\n {...props}\n />\n )\n})\nDrawerOverlay.displayName = \"Drawer.Overlay\"\n\ninterface DrawerContentProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Content> {\n /**\n * Props for the overlay component.\n * It accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.\n */\n overlayProps?: React.ComponentPropsWithoutRef<typeof DrawerOverlay>\n /**\n * Props for the portal component that wraps the drawer content.\n * It accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.\n */\n portalProps?: React.ComponentPropsWithoutRef<typeof DrawerPortal>\n}\n\n/**\n * This component wraps the content of the drawer.\n * It accepts props from the [Radix UI Dialog Content](https://www.radix-ui.com/primitives/docs/components/dialog#content) component.\n */\nconst DrawerContent = React.forwardRef<\n React.ElementRef<typeof RadixDialog.Content>,\n DrawerContentProps\n>(({ className, overlayProps, portalProps, ...props }: DrawerContentProps, ref) => {\n return (\n <DrawerPortal {...portalProps}>\n <DrawerOverlay {...overlayProps} />\n <RadixDialog.Content\n ref={ref}\n className={clx(\n \"bg-ui-bg-base shadow-elevation-modal border-ui-border-base fixed inset-y-2 flex w-full flex-1 flex-col rounded-lg border outline-none max-sm:inset-x-2 max-sm:w-[calc(100%-16px)] sm:right-2 sm:max-w-[560px]\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:slide-out-to-right-1/2 data-[state=open]:slide-in-from-right-1/2 duration-200\",\n className\n )}\n {...props}\n />\n </DrawerPortal>\n )\n})\nDrawerContent.displayName = \"Drawer.Content\"\n\ninterface DrawerHeaderProps extends React.ComponentPropsWithoutRef<\"div\"> {}\n\n/**\n * This component is used to wrap the header content of the drawer.\n * This component is based on the `div` element and supports all of its props.\n */\nconst DrawerHeader = React.forwardRef<\n HTMLDivElement,\n DrawerHeaderProps\n>(({ children, className, ...props }: DrawerHeaderProps, ref) => {\n return (\n <div\n ref={ref}\n className=\"border-ui-border-base flex items-start justify-between gap-x-4 border-b px-6 py-4\"\n {...props}\n >\n <div className={clx(\"flex flex-col gap-y-1\", className)}>{children}</div>\n <div className=\"flex items-center gap-x-2\">\n <Kbd>esc</Kbd>\n <RadixDialog.Close asChild>\n <IconButton size=\"small\" type=\"button\" variant=\"transparent\">\n <XMark />\n </IconButton>\n </RadixDialog.Close>\n </div>\n </div>\n )\n})\nDrawerHeader.displayName = \"Drawer.Header\"\n\ninterface DrawerBodyProps extends React.ComponentPropsWithoutRef<\"div\"> {}\n\n/**\n * This component is used to wrap the body content of the drawer.\n * This component is based on the `div` element and supports all of its props\n */\nconst DrawerBody = React.forwardRef<\n HTMLDivElement,\n DrawerBodyProps\n>(({ className, ...props }: DrawerBodyProps, ref) => {\n return (\n <div ref={ref} className={clx(\"flex-1 px-6 py-4\", className)} {...props} />\n )\n})\nDrawerBody.displayName = \"Drawer.Body\"\n\ninterface DrawerFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\n/**\n * This component is used to wrap the footer content of the drawer.\n * This component is based on the `div` element and supports all of its props.\n */\nconst DrawerFooter = ({\n className,\n ...props\n}: DrawerFooterProps) => {\n return (\n <div\n className={clx(\n \"border-ui-border-base flex items-center justify-end space-x-2 overflow-y-auto border-t px-6 py-4\",\n className\n )}\n {...props}\n />\n )\n}\nDrawerFooter.displayName = \"Drawer.Footer\"\n\n/**\n * This component adds an accessible title to the drawer.\n * It accepts props from the [Radix UI Dialog Title](https://www.radix-ui.com/primitives/docs/components/dialog#title) component.\n */\nconst DrawerTitle = RadixDialog.Title\nDrawerTitle.displayName = \"Drawer.Title\"\n\ninterface DrawerDescriptionProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Description> {}\n\n/**\n * This component adds accessible description to the drawer.\n * It accepts props from the [Radix UI Dialog Description](https://www.radix-ui.com/primitives/docs/components/dialog#description) component.\n */\nconst DrawerDescription = React.forwardRef<\n React.ElementRef<typeof RadixDialog.Description>,\n DrawerDescriptionProps\n>(({ className, children, ...props }: DrawerDescriptionProps, ref) => (\n <RadixDialog.Description\n ref={ref}\n className={clx(className)}\n asChild\n {...props}\n >\n <Text>{children}</Text>\n </RadixDialog.Description>\n))\nDrawerDescription.displayName = \"Drawer.Description\"\n\nconst Drawer = Object.assign(DrawerRoot, {\n Body: DrawerBody,\n Close: DrawerClose,\n Content: DrawerContent,\n Description: DrawerDescription,\n Footer: DrawerFooter,\n Header: DrawerHeader,\n Title: DrawerTitle,\n Trigger: DrawerTrigger,\n})\n\nexport { Drawer }\n"]}
|
1
|
+
{"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../../../src/components/drawer/drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport { XMark } from \"@medusajs/icons\"\nimport * as DrawerPrimitives from \"@radix-ui/react-dialog\"\nimport * as React from \"react\"\n\nimport { IconButton } from \"@/components/icon-button\"\nimport { Kbd } from \"@/components/kbd\"\nimport { Text } from \"@/components/text\"\nimport { clx } from \"@/utils/clx\"\n\ninterface DrawerRootProps extends React.ComponentPropsWithoutRef<typeof DrawerPrimitives.Root> {}\n\n/**\n * This component is based on the [Radix UI Dialog](https://www.radix-ui.com/primitives/docs/components/dialog) primitives.\n */\nconst DrawerRoot = (\n props: DrawerRootProps\n) => {\n return <DrawerPrimitives.Root {...props} />\n}\nDrawerRoot.displayName = \"Drawer\"\n\ninterface DrawerTriggerProps extends React.ComponentPropsWithoutRef<typeof DrawerPrimitives.Trigger> {}\n\n/**\n * This component is used to create the trigger button that opens the drawer.\n * It accepts props from the [Radix UI Dialog Trigger](https://www.radix-ui.com/primitives/docs/components/dialog#trigger) component.\n */\nconst DrawerTrigger = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitives.Trigger>,\n DrawerTriggerProps\n>(({ className, ...props }: DrawerTriggerProps, ref) => {\n return (\n <DrawerPrimitives.Trigger ref={ref} className={clx(className)} {...props} />\n )\n})\nDrawerTrigger.displayName = \"Drawer.Trigger\"\n\ninterface DrawerCloseProps extends React.ComponentPropsWithoutRef<typeof DrawerPrimitives.Close> {}\n\n/**\n * This component is used to create the close button for the drawer.\n * It accepts props from the [Radix UI Dialog Close](https://www.radix-ui.com/primitives/docs/components/dialog#close) component.\n */\nconst DrawerClose = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitives.Close>,\n DrawerCloseProps\n>(({ className, ...props }: DrawerCloseProps, ref) => {\n return (\n <DrawerPrimitives.Close ref={ref} className={clx(className)} {...props} />\n )\n})\nDrawerClose.displayName = \"Drawer.Close\"\n\ninterface DrawerPortalProps extends DrawerPrimitives.DialogPortalProps {}\n\n/**\n * The `Drawer.Content` component uses this component to wrap the drawer content.\n * It accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.\n */\nconst DrawerPortal = (props: DrawerPortalProps) => {\n return <DrawerPrimitives.DialogPortal {...props} />\n}\nDrawerPortal.displayName = \"Drawer.Portal\"\n\ninterface DrawerOverlayProps extends React.ComponentPropsWithoutRef<typeof DrawerPrimitives.Overlay> {}\n\n/**\n * This component is used to create the overlay for the drawer.\n * It accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.\n */\nconst DrawerOverlay = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitives.Overlay>,\n DrawerOverlayProps\n>(({ className, ...props }: DrawerOverlayProps, ref) => {\n return (\n <DrawerPrimitives.Overlay\n ref={ref}\n className={clx(\n \"bg-ui-bg-overlay fixed inset-0\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n className\n )}\n {...props}\n />\n )\n})\nDrawerOverlay.displayName = \"Drawer.Overlay\"\n\ninterface DrawerContentProps extends React.ComponentPropsWithoutRef<typeof DrawerPrimitives.Content> {\n /**\n * Props for the overlay component.\n * It accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.\n */\n overlayProps?: React.ComponentPropsWithoutRef<typeof DrawerOverlay>\n /**\n * Props for the portal component that wraps the drawer content.\n * It accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.\n */\n portalProps?: React.ComponentPropsWithoutRef<typeof DrawerPortal>\n}\n\n/**\n * This component wraps the content of the drawer.\n * It accepts props from the [Radix UI Dialog Content](https://www.radix-ui.com/primitives/docs/components/dialog#content) component.\n */\nconst DrawerContent = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitives.Content>,\n DrawerContentProps\n>(({ className, overlayProps, portalProps, ...props }: DrawerContentProps, ref) => {\n return (\n <DrawerPortal {...portalProps}>\n <DrawerOverlay {...overlayProps} />\n <DrawerPrimitives.Content\n ref={ref}\n className={clx(\n \"bg-ui-bg-base shadow-elevation-modal border-ui-border-base fixed inset-y-2 flex w-full flex-1 flex-col rounded-lg border outline-none max-sm:inset-x-2 max-sm:w-[calc(100%-16px)] sm:right-2 sm:max-w-[560px]\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:slide-out-to-right-1/2 data-[state=open]:slide-in-from-right-1/2 duration-200\",\n className\n )}\n {...props}\n />\n </DrawerPortal>\n )\n})\nDrawerContent.displayName = \"Drawer.Content\"\n\ninterface DrawerHeaderProps extends React.ComponentPropsWithoutRef<\"div\"> {}\n\n/**\n * This component is used to wrap the header content of the drawer.\n * This component is based on the `div` element and supports all of its props.\n */\nconst DrawerHeader = React.forwardRef<\n HTMLDivElement,\n DrawerHeaderProps\n>(({ children, className, ...props }: DrawerHeaderProps, ref) => {\n return (\n <div\n ref={ref}\n className=\"border-ui-border-base flex items-start justify-between gap-x-4 border-b px-6 py-4\"\n {...props}\n >\n <div className={clx(\"flex flex-col gap-y-1\", className)}>{children}</div>\n <div className=\"flex items-center gap-x-2\">\n <Kbd>esc</Kbd>\n <DrawerPrimitives.Close asChild>\n <IconButton size=\"small\" type=\"button\" variant=\"transparent\">\n <XMark />\n </IconButton>\n </DrawerPrimitives.Close>\n </div>\n </div>\n )\n})\nDrawerHeader.displayName = \"Drawer.Header\"\n\ninterface DrawerBodyProps extends React.ComponentPropsWithoutRef<\"div\"> {}\n\n/**\n * This component is used to wrap the body content of the drawer.\n * This component is based on the `div` element and supports all of its props\n */\nconst DrawerBody = React.forwardRef<\n HTMLDivElement,\n DrawerBodyProps\n>(({ className, ...props }: DrawerBodyProps, ref) => {\n return (\n <div ref={ref} className={clx(\"flex-1 px-6 py-4\", className)} {...props} />\n )\n})\nDrawerBody.displayName = \"Drawer.Body\"\n\ninterface DrawerFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\n/**\n * This component is used to wrap the footer content of the drawer.\n * This component is based on the `div` element and supports all of its props.\n */\nconst DrawerFooter = ({\n className,\n ...props\n}: DrawerFooterProps) => {\n return (\n <div\n className={clx(\n \"border-ui-border-base flex items-center justify-end space-x-2 overflow-y-auto border-t px-6 py-4\",\n className\n )}\n {...props}\n />\n )\n}\nDrawerFooter.displayName = \"Drawer.Footer\"\n\n/**\n * This component adds an accessible title to the drawer.\n * It accepts props from the [Radix UI Dialog Title](https://www.radix-ui.com/primitives/docs/components/dialog#title) component.\n */\nconst DrawerTitle = DrawerPrimitives.Title\nDrawerTitle.displayName = \"Drawer.Title\"\n\ninterface DrawerDescriptionProps extends React.ComponentPropsWithoutRef<typeof DrawerPrimitives.Description> {}\n\n/**\n * This component adds accessible description to the drawer.\n * It accepts props from the [Radix UI Dialog Description](https://www.radix-ui.com/primitives/docs/components/dialog#description) component.\n */\nconst DrawerDescription = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitives.Description>,\n DrawerDescriptionProps\n>(({ className, children, ...props }: DrawerDescriptionProps, ref) => (\n <DrawerPrimitives.Description\n ref={ref}\n className={clx(className)}\n asChild\n {...props}\n >\n <Text>{children}</Text>\n </DrawerPrimitives.Description>\n))\nDrawerDescription.displayName = \"Drawer.Description\"\n\nconst Drawer = Object.assign(DrawerRoot, {\n Body: DrawerBody,\n Close: DrawerClose,\n Content: DrawerContent,\n Description: DrawerDescription,\n Footer: DrawerFooter,\n Header: DrawerHeader,\n Title: DrawerTitle,\n Trigger: DrawerTrigger,\n})\n\nexport { Drawer }\n"]}
|
@@ -1,18 +1,18 @@
|
|
1
|
-
import
|
1
|
+
import * as Primitives from "@radix-ui/react-dropdown-menu";
|
2
2
|
import * as React from "react";
|
3
|
-
declare const DropdownMenu: React.FC<
|
4
|
-
Trigger: React.ForwardRefExoticComponent<
|
5
|
-
Group: React.ForwardRefExoticComponent<
|
6
|
-
SubMenu: React.FC<
|
7
|
-
SubMenuContent: React.ForwardRefExoticComponent<Omit<
|
8
|
-
SubMenuTrigger: React.ForwardRefExoticComponent<Omit<
|
9
|
-
Content: React.ForwardRefExoticComponent<Omit<
|
10
|
-
Item: React.ForwardRefExoticComponent<Omit<
|
11
|
-
CheckboxItem: React.ForwardRefExoticComponent<Omit<
|
12
|
-
RadioGroup: React.ForwardRefExoticComponent<
|
13
|
-
RadioItem: React.ForwardRefExoticComponent<Omit<
|
14
|
-
Label: React.ForwardRefExoticComponent<Omit<
|
15
|
-
Separator: React.ForwardRefExoticComponent<Omit<
|
3
|
+
declare const DropdownMenu: React.FC<Primitives.DropdownMenuProps> & {
|
4
|
+
Trigger: React.ForwardRefExoticComponent<Primitives.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
5
|
+
Group: React.ForwardRefExoticComponent<Primitives.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
|
6
|
+
SubMenu: React.FC<Primitives.DropdownMenuSubProps>;
|
7
|
+
SubMenuContent: React.ForwardRefExoticComponent<Omit<Primitives.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
8
|
+
SubMenuTrigger: React.ForwardRefExoticComponent<Omit<Primitives.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
9
|
+
Content: React.ForwardRefExoticComponent<Omit<Primitives.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
10
|
+
Item: React.ForwardRefExoticComponent<Omit<Primitives.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
11
|
+
CheckboxItem: React.ForwardRefExoticComponent<Omit<Primitives.DropdownMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
12
|
+
RadioGroup: React.ForwardRefExoticComponent<Primitives.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
|
13
|
+
RadioItem: React.ForwardRefExoticComponent<Omit<Primitives.DropdownMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
14
|
+
Label: React.ForwardRefExoticComponent<Omit<Primitives.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
15
|
+
Separator: React.ForwardRefExoticComponent<Omit<Primitives.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
16
16
|
Shortcut: {
|
17
17
|
({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): React.JSX.Element;
|
18
18
|
displayName: string;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../../../src/components/dropdown-menu/dropdown-menu.tsx"],"names":[],"mappings":"AAGA,OAAO,
|
1
|
+
{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../../../src/components/dropdown-menu/dropdown-menu.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,UAAU,MAAM,+BAA+B,CAAA;AAC3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AA2Q9B,QAAA,MAAM,YAAY;;;;;;;;;;;;;;kCAhCf,MAAM,cAAc,CAAC,eAAe,CAAC;;;;kCAmBrC,MAAM,cAAc,CAAC,eAAe,CAAC;;;CA4BtC,CAAA;AAEF,OAAO,EAAE,YAAY,EAAE,CAAA"}
|
@@ -4,85 +4,85 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
exports.DropdownMenu = void 0;
|
5
5
|
const tslib_1 = require("tslib");
|
6
6
|
const icons_1 = require("@medusajs/icons");
|
7
|
-
const
|
7
|
+
const Primitives = tslib_1.__importStar(require("@radix-ui/react-dropdown-menu"));
|
8
8
|
const React = tslib_1.__importStar(require("react"));
|
9
9
|
const clx_1 = require("../../utils/clx");
|
10
10
|
/**
|
11
11
|
* This component is based on the [Radix UI Dropdown Menu](https://www.radix-ui.com/primitives/docs/components/dropdown-menu) primitive.
|
12
12
|
*/
|
13
|
-
const Root =
|
13
|
+
const Root = Primitives.Root;
|
14
14
|
Root.displayName = "DropdownMenu";
|
15
15
|
/**
|
16
16
|
* This component is based on the [Radix UI Dropdown Menu Trigger](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#trigger) primitive.
|
17
17
|
*/
|
18
|
-
const Trigger =
|
18
|
+
const Trigger = Primitives.Trigger;
|
19
19
|
Trigger.displayName = "DropdownMenu.Trigger";
|
20
20
|
/**
|
21
21
|
* This component is based on the [Radix UI Dropdown Menu Group](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#group) primitive.
|
22
22
|
*/
|
23
|
-
const Group =
|
23
|
+
const Group = Primitives.Group;
|
24
24
|
Group.displayName = "DropdownMenu.Group";
|
25
25
|
/**
|
26
26
|
* This component is based on the [Radix UI Dropdown Menu Sub](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#sub) primitive.
|
27
27
|
*/
|
28
|
-
const SubMenu =
|
28
|
+
const SubMenu = Primitives.Sub;
|
29
29
|
SubMenu.displayName = "DropdownMenu.SubMenu";
|
30
30
|
/**
|
31
31
|
* This component is based on the [Radix UI Dropdown Menu RadioGroup](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#radiogroup) primitive.
|
32
32
|
*/
|
33
|
-
const RadioGroup =
|
33
|
+
const RadioGroup = Primitives.RadioGroup;
|
34
34
|
RadioGroup.displayName = "DropdownMenu.RadioGroup";
|
35
35
|
/**
|
36
36
|
* This component is based on the [Radix UI Dropdown Menu SubTrigger](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#subtrigger) primitive.
|
37
37
|
*/
|
38
|
-
const SubMenuTrigger = React.forwardRef(({ className, children, ...props }, ref) => (React.createElement(
|
38
|
+
const SubMenuTrigger = React.forwardRef(({ className, children, ...props }, ref) => (React.createElement(Primitives.SubTrigger, { ref: ref, className: (0, clx_1.clx)("bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 outline-none transition-colors", "focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover", "active:bg-ui-bg-component-hover", "data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none", "data-[state=open]:!bg-ui-bg-component-hover", className), ...props },
|
39
39
|
children,
|
40
40
|
React.createElement(icons_1.ChevronRightMini, { className: "text-ui-fg-muted ml-auto" }))));
|
41
41
|
SubMenuTrigger.displayName = "DropdownMenu.SubMenuTrigger";
|
42
42
|
/**
|
43
43
|
* This component is based on the [Radix UI Dropdown Menu SubContent](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#subcontent) primitive.
|
44
44
|
*/
|
45
|
-
const SubMenuContent = React.forwardRef(({ className, collisionPadding = 8, ...props }, ref) => (React.createElement(
|
46
|
-
React.createElement(
|
45
|
+
const SubMenuContent = React.forwardRef(({ className, collisionPadding = 8, ...props }, ref) => (React.createElement(Primitives.Portal, null,
|
46
|
+
React.createElement(Primitives.SubContent, { ref: ref, collisionPadding: collisionPadding, className: (0, clx_1.clx)("bg-ui-bg-component text-ui-fg-base shadow-elevation-flyout max-h-[var(--radix-popper-available-height)] min-w-[220px] overflow-hidden rounded-lg p-1", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className), ...props }))));
|
47
47
|
SubMenuContent.displayName = "DropdownMenu.SubMenuContent";
|
48
48
|
/**
|
49
49
|
* This component is based on the [Radix UI Dropdown Menu Content](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#content) primitive.
|
50
50
|
*/
|
51
|
-
const Content = React.forwardRef(({ className, sideOffset = 8, collisionPadding = 8, align = "center", ...props }, ref) => (React.createElement(
|
52
|
-
React.createElement(
|
51
|
+
const Content = React.forwardRef(({ className, sideOffset = 8, collisionPadding = 8, align = "center", ...props }, ref) => (React.createElement(Primitives.Portal, null,
|
52
|
+
React.createElement(Primitives.Content, { ref: ref, sideOffset: sideOffset, align: align, collisionPadding: collisionPadding, className: (0, clx_1.clx)("bg-ui-bg-component text-ui-fg-base shadow-elevation-flyout max-h-[var(--radix-popper-available-height)] min-w-[220px] overflow-hidden rounded-lg p-1", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className), ...props }))));
|
53
53
|
Content.displayName = "DropdownMenu.Content";
|
54
54
|
/**
|
55
55
|
* This component is based on the [Radix UI Dropdown Menu Item](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#item) primitive.
|
56
56
|
*/
|
57
|
-
const Item = React.forwardRef(({ className, ...props }, ref) => (React.createElement(
|
57
|
+
const Item = React.forwardRef(({ className, ...props }, ref) => (React.createElement(Primitives.Item, { ref: ref, className: (0, clx_1.clx)("bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 outline-none transition-colors", "focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover", "active:bg-ui-bg-component-hover", "data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none", className), ...props })));
|
58
58
|
Item.displayName = "DropdownMenu.Item";
|
59
59
|
/**
|
60
60
|
* This component is based on the [Radix UI Dropdown Menu CheckboxItem](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#checkboxitem) primitive.
|
61
61
|
*/
|
62
|
-
const CheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => (React.createElement(
|
62
|
+
const CheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => (React.createElement(Primitives.CheckboxItem, { ref: ref, className: (0, clx_1.clx)("bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md py-1.5 pl-[31px] pr-2 outline-none transition-colors", "focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover", "active:bg-ui-bg-component-hover", "data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none", "data-[state=checked]:txt-compact-small-plus", className), checked: checked, ...props },
|
63
63
|
React.createElement("span", { className: "absolute left-2 flex size-[15px] items-center justify-center" },
|
64
|
-
React.createElement(
|
64
|
+
React.createElement(Primitives.ItemIndicator, null,
|
65
65
|
React.createElement(icons_1.CheckMini, null))),
|
66
66
|
children)));
|
67
67
|
CheckboxItem.displayName = "DropdownMenu.CheckboxItem";
|
68
68
|
/**
|
69
69
|
* This component is based on the [Radix UI Dropdown Menu RadioItem](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#radioitem) primitive.
|
70
70
|
*/
|
71
|
-
const RadioItem = React.forwardRef(({ className, children, ...props }, ref) => (React.createElement(
|
71
|
+
const RadioItem = React.forwardRef(({ className, children, ...props }, ref) => (React.createElement(Primitives.RadioItem, { ref: ref, className: (0, clx_1.clx)("bg-ui-bg-component txt-compact-small relative flex cursor-pointer select-none items-center rounded-md py-1.5 pl-[31px] pr-2 outline-none transition-colors", "focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover", "active:bg-ui-bg-component-hover", "data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none", "data-[state=checked]:txt-compact-small-plus", className), ...props },
|
72
72
|
React.createElement("span", { className: "absolute left-2 flex size-[15px] items-center justify-center" },
|
73
|
-
React.createElement(
|
73
|
+
React.createElement(Primitives.ItemIndicator, null,
|
74
74
|
React.createElement(icons_1.EllipseMiniSolid, { className: "text-ui-fg-base" }))),
|
75
75
|
children)));
|
76
76
|
RadioItem.displayName = "DropdownMenu.RadioItem";
|
77
77
|
/**
|
78
78
|
* This component is based on the [Radix UI Dropdown Menu Label](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#label) primitive.
|
79
79
|
*/
|
80
|
-
const Label = React.forwardRef(({ className, ...props }, ref) => (React.createElement(
|
80
|
+
const Label = React.forwardRef(({ className, ...props }, ref) => (React.createElement(Primitives.Label, { ref: ref, className: (0, clx_1.clx)("text-ui-fg-subtle txt-compact-xsmall-plus", className), ...props })));
|
81
81
|
Label.displayName = "DropdownMenu.Label";
|
82
82
|
/**
|
83
83
|
* This component is based on the [Radix UI Dropdown Menu Separator](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#separator) primitive.
|
84
84
|
*/
|
85
|
-
const Separator = React.forwardRef(({ className, ...props }, ref) => (React.createElement(
|
85
|
+
const Separator = React.forwardRef(({ className, ...props }, ref) => (React.createElement(Primitives.Separator, { ref: ref, className: (0, clx_1.clx)("bg-ui-border-component border-t-ui-border-menu-top border-b-ui-border-menu-bot -mx-1 my-1 h-0.5 border-b border-t", className), ...props })));
|
86
86
|
Separator.displayName = "DropdownMenu.Separator";
|
87
87
|
/**
|
88
88
|
* This component is based on the `span` element and supports all of its props
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"dropdown-menu.js","sourceRoot":"","sources":["../../../../src/components/dropdown-menu/dropdown-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport { CheckMini, ChevronRightMini, EllipseMiniSolid } from \"@medusajs/icons\"\nimport { DropdownMenu as RadixDropdownMenu } from \"radix-ui\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu](https://www.radix-ui.com/primitives/docs/components/dropdown-menu) primitive.\n */\nconst Root = RadixDropdownMenu.Root\nRoot.displayName = \"DropdownMenu\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Trigger](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#trigger) primitive.\n */\nconst Trigger = RadixDropdownMenu.Trigger\nTrigger.displayName = \"DropdownMenu.Trigger\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Group](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#group) primitive.\n */\nconst Group = RadixDropdownMenu.Group\nGroup.displayName = \"DropdownMenu.Group\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Sub](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#sub) primitive.\n */\nconst SubMenu = RadixDropdownMenu.Sub\nSubMenu.displayName = \"DropdownMenu.SubMenu\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu RadioGroup](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#radiogroup) primitive.\n */\nconst RadioGroup = RadixDropdownMenu.RadioGroup\nRadioGroup.displayName = \"DropdownMenu.RadioGroup\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu SubTrigger](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#subtrigger) primitive.\n */\nconst SubMenuTrigger = React.forwardRef<\n React.ElementRef<typeof RadixDropdownMenu.SubTrigger>,\n React.ComponentPropsWithoutRef<typeof RadixDropdownMenu.SubTrigger>\n>(({ className, children, ...props }, ref) => (\n <RadixDropdownMenu.SubTrigger\n ref={ref}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 outline-none transition-colors\",\n \"focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover\",\n \"active:bg-ui-bg-component-hover\",\n \"data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none\",\n \"data-[state=open]:!bg-ui-bg-component-hover\",\n className\n )}\n {...props}\n >\n {children}\n <ChevronRightMini className=\"text-ui-fg-muted ml-auto\" />\n </RadixDropdownMenu.SubTrigger>\n))\nSubMenuTrigger.displayName = \"DropdownMenu.SubMenuTrigger\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu SubContent](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#subcontent) primitive.\n */\nconst SubMenuContent = React.forwardRef<\n React.ElementRef<typeof RadixDropdownMenu.SubContent>,\n React.ComponentPropsWithoutRef<typeof RadixDropdownMenu.SubContent>\n>(({ className, collisionPadding = 8, ...props }, ref) => (\n <RadixDropdownMenu.Portal>\n <RadixDropdownMenu.SubContent\n ref={ref}\n collisionPadding={collisionPadding}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base shadow-elevation-flyout max-h-[var(--radix-popper-available-height)] min-w-[220px] overflow-hidden rounded-lg p-1\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\n className\n )}\n {...props}\n />\n </RadixDropdownMenu.Portal>\n))\nSubMenuContent.displayName = \"DropdownMenu.SubMenuContent\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Content](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#content) primitive.\n */\nconst Content = React.forwardRef<\n React.ElementRef<typeof RadixDropdownMenu.Content>,\n React.ComponentPropsWithoutRef<typeof RadixDropdownMenu.Content>\n>(\n (\n {\n className,\n sideOffset = 8,\n collisionPadding = 8,\n align = \"center\",\n ...props\n },\n ref\n ) => (\n <RadixDropdownMenu.Portal>\n <RadixDropdownMenu.Content\n ref={ref}\n sideOffset={sideOffset}\n align={align}\n collisionPadding={collisionPadding}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base shadow-elevation-flyout max-h-[var(--radix-popper-available-height)] min-w-[220px] overflow-hidden rounded-lg p-1\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\n className\n )}\n {...props}\n />\n </RadixDropdownMenu.Portal>\n )\n)\nContent.displayName = \"DropdownMenu.Content\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Item](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#item) primitive.\n */\nconst Item = React.forwardRef<\n React.ElementRef<typeof RadixDropdownMenu.Item>,\n React.ComponentPropsWithoutRef<typeof RadixDropdownMenu.Item>\n>(({ className, ...props }, ref) => (\n <RadixDropdownMenu.Item\n ref={ref}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 outline-none transition-colors\",\n \"focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover\",\n \"active:bg-ui-bg-component-hover\",\n \"data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none\",\n className\n )}\n {...props}\n />\n))\nItem.displayName = \"DropdownMenu.Item\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu CheckboxItem](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#checkboxitem) primitive.\n */\nconst CheckboxItem = React.forwardRef<\n React.ElementRef<typeof RadixDropdownMenu.CheckboxItem>,\n React.ComponentPropsWithoutRef<typeof RadixDropdownMenu.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n <RadixDropdownMenu.CheckboxItem\n ref={ref}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md py-1.5 pl-[31px] pr-2 outline-none transition-colors\",\n \"focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover\",\n \"active:bg-ui-bg-component-hover\",\n \"data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none\",\n \"data-[state=checked]:txt-compact-small-plus\",\n className\n )}\n checked={checked}\n {...props}\n >\n <span className=\"absolute left-2 flex size-[15px] items-center justify-center\">\n <RadixDropdownMenu.ItemIndicator>\n <CheckMini />\n </RadixDropdownMenu.ItemIndicator>\n </span>\n {children}\n </RadixDropdownMenu.CheckboxItem>\n))\nCheckboxItem.displayName = \"DropdownMenu.CheckboxItem\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu RadioItem](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#radioitem) primitive.\n */\nconst RadioItem = React.forwardRef<\n React.ElementRef<typeof RadixDropdownMenu.RadioItem>,\n React.ComponentPropsWithoutRef<typeof RadixDropdownMenu.RadioItem>\n>(({ className, children, ...props }, ref) => (\n <RadixDropdownMenu.RadioItem\n ref={ref}\n className={clx(\n \"bg-ui-bg-component txt-compact-small relative flex cursor-pointer select-none items-center rounded-md py-1.5 pl-[31px] pr-2 outline-none transition-colors\",\n \"focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover\",\n \"active:bg-ui-bg-component-hover\",\n \"data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none\",\n \"data-[state=checked]:txt-compact-small-plus\",\n className\n )}\n {...props}\n >\n <span className=\"absolute left-2 flex size-[15px] items-center justify-center\">\n <RadixDropdownMenu.ItemIndicator>\n <EllipseMiniSolid className=\"text-ui-fg-base\" />\n </RadixDropdownMenu.ItemIndicator>\n </span>\n {children}\n </RadixDropdownMenu.RadioItem>\n))\nRadioItem.displayName = \"DropdownMenu.RadioItem\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Label](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#label) primitive.\n */\nconst Label = React.forwardRef<\n React.ElementRef<typeof RadixDropdownMenu.Label>,\n React.ComponentPropsWithoutRef<typeof RadixDropdownMenu.Label>\n>(({ className, ...props }, ref) => (\n <RadixDropdownMenu.Label\n ref={ref}\n className={clx(\"text-ui-fg-subtle txt-compact-xsmall-plus\", className)}\n {...props}\n />\n))\nLabel.displayName = \"DropdownMenu.Label\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Separator](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#separator) primitive.\n */\nconst Separator = React.forwardRef<\n React.ElementRef<typeof RadixDropdownMenu.Separator>,\n React.ComponentPropsWithoutRef<typeof RadixDropdownMenu.Separator>\n>(({ className, ...props }, ref) => (\n <RadixDropdownMenu.Separator\n ref={ref}\n className={clx(\n \"bg-ui-border-component border-t-ui-border-menu-top border-b-ui-border-menu-bot -mx-1 my-1 h-0.5 border-b border-t\",\n className\n )}\n {...props}\n />\n))\nSeparator.displayName = \"DropdownMenu.Separator\"\n\n/**\n * This component is based on the `span` element and supports all of its props\n */\nconst Shortcut = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={clx(\n \"text-ui-fg-subtle txt-compact-small ml-auto tracking-widest\",\n className\n )}\n {...props}\n />\n )\n}\nShortcut.displayName = \"DropdownMenu.Shortcut\"\n\n/**\n * This component is based on the `span` element and supports all of its props\n */\nconst Hint = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={clx(\n \"text-ui-fg-subtle txt-compact-small ml-auto tracking-widest\",\n className\n )}\n {...props}\n />\n )\n}\nHint.displayName = \"DropdownMenu.Hint\"\n\nconst DropdownMenu = Object.assign(Root, {\n Trigger,\n Group,\n SubMenu,\n SubMenuContent,\n SubMenuTrigger,\n Content,\n Item,\n CheckboxItem,\n RadioGroup,\n RadioItem,\n Label,\n Separator,\n Shortcut,\n Hint,\n})\n\nexport { DropdownMenu }\n"]}
|
1
|
+
{"version":3,"file":"dropdown-menu.js","sourceRoot":"","sources":["../../../../src/components/dropdown-menu/dropdown-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport { CheckMini, ChevronRightMini, EllipseMiniSolid } from \"@medusajs/icons\"\nimport * as Primitives from \"@radix-ui/react-dropdown-menu\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu](https://www.radix-ui.com/primitives/docs/components/dropdown-menu) primitive.\n */\nconst Root = Primitives.Root\nRoot.displayName = \"DropdownMenu\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Trigger](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#trigger) primitive.\n */\nconst Trigger = Primitives.Trigger\nTrigger.displayName = \"DropdownMenu.Trigger\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Group](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#group) primitive.\n */\nconst Group = Primitives.Group\nGroup.displayName = \"DropdownMenu.Group\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Sub](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#sub) primitive.\n */\nconst SubMenu = Primitives.Sub\nSubMenu.displayName = \"DropdownMenu.SubMenu\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu RadioGroup](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#radiogroup) primitive.\n */\nconst RadioGroup = Primitives.RadioGroup\nRadioGroup.displayName = \"DropdownMenu.RadioGroup\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu SubTrigger](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#subtrigger) primitive.\n */\nconst SubMenuTrigger = React.forwardRef<\n React.ElementRef<typeof Primitives.SubTrigger>,\n React.ComponentPropsWithoutRef<typeof Primitives.SubTrigger>\n>(({ className, children, ...props }, ref) => (\n <Primitives.SubTrigger\n ref={ref}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 outline-none transition-colors\",\n \"focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover\",\n \"active:bg-ui-bg-component-hover\",\n \"data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none\",\n \"data-[state=open]:!bg-ui-bg-component-hover\",\n className\n )}\n {...props}\n >\n {children}\n <ChevronRightMini className=\"text-ui-fg-muted ml-auto\" />\n </Primitives.SubTrigger>\n))\nSubMenuTrigger.displayName = \"DropdownMenu.SubMenuTrigger\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu SubContent](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#subcontent) primitive.\n */\nconst SubMenuContent = React.forwardRef<\n React.ElementRef<typeof Primitives.SubContent>,\n React.ComponentPropsWithoutRef<typeof Primitives.SubContent>\n>(({ className, collisionPadding = 8, ...props }, ref) => (\n <Primitives.Portal>\n <Primitives.SubContent\n ref={ref}\n collisionPadding={collisionPadding}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base shadow-elevation-flyout max-h-[var(--radix-popper-available-height)] min-w-[220px] overflow-hidden rounded-lg p-1\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\n className\n )}\n {...props}\n />\n </Primitives.Portal>\n))\nSubMenuContent.displayName = \"DropdownMenu.SubMenuContent\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Content](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#content) primitive.\n */\nconst Content = React.forwardRef<\n React.ElementRef<typeof Primitives.Content>,\n React.ComponentPropsWithoutRef<typeof Primitives.Content>\n>(\n (\n {\n className,\n sideOffset = 8,\n collisionPadding = 8,\n align = \"center\",\n ...props\n },\n ref\n ) => (\n <Primitives.Portal>\n <Primitives.Content\n ref={ref}\n sideOffset={sideOffset}\n align={align}\n collisionPadding={collisionPadding}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base shadow-elevation-flyout max-h-[var(--radix-popper-available-height)] min-w-[220px] overflow-hidden rounded-lg p-1\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\",\n className\n )}\n {...props}\n />\n </Primitives.Portal>\n )\n)\nContent.displayName = \"DropdownMenu.Content\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Item](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#item) primitive.\n */\nconst Item = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n React.ComponentPropsWithoutRef<typeof Primitives.Item>\n>(({ className, ...props }, ref) => (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 outline-none transition-colors\",\n \"focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover\",\n \"active:bg-ui-bg-component-hover\",\n \"data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none\",\n className\n )}\n {...props}\n />\n))\nItem.displayName = \"DropdownMenu.Item\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu CheckboxItem](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#checkboxitem) primitive.\n */\nconst CheckboxItem = React.forwardRef<\n React.ElementRef<typeof Primitives.CheckboxItem>,\n React.ComponentPropsWithoutRef<typeof Primitives.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n <Primitives.CheckboxItem\n ref={ref}\n className={clx(\n \"bg-ui-bg-component text-ui-fg-base txt-compact-small relative flex cursor-pointer select-none items-center rounded-md py-1.5 pl-[31px] pr-2 outline-none transition-colors\",\n \"focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover\",\n \"active:bg-ui-bg-component-hover\",\n \"data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none\",\n \"data-[state=checked]:txt-compact-small-plus\",\n className\n )}\n checked={checked}\n {...props}\n >\n <span className=\"absolute left-2 flex size-[15px] items-center justify-center\">\n <Primitives.ItemIndicator>\n <CheckMini />\n </Primitives.ItemIndicator>\n </span>\n {children}\n </Primitives.CheckboxItem>\n))\nCheckboxItem.displayName = \"DropdownMenu.CheckboxItem\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu RadioItem](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#radioitem) primitive.\n */\nconst RadioItem = React.forwardRef<\n React.ElementRef<typeof Primitives.RadioItem>,\n React.ComponentPropsWithoutRef<typeof Primitives.RadioItem>\n>(({ className, children, ...props }, ref) => (\n <Primitives.RadioItem\n ref={ref}\n className={clx(\n \"bg-ui-bg-component txt-compact-small relative flex cursor-pointer select-none items-center rounded-md py-1.5 pl-[31px] pr-2 outline-none transition-colors\",\n \"focus-visible:bg-ui-bg-component-hover focus:bg-ui-bg-component-hover\",\n \"active:bg-ui-bg-component-hover\",\n \"data-[disabled]:text-ui-fg-disabled data-[disabled]:pointer-events-none\",\n \"data-[state=checked]:txt-compact-small-plus\",\n className\n )}\n {...props}\n >\n <span className=\"absolute left-2 flex size-[15px] items-center justify-center\">\n <Primitives.ItemIndicator>\n <EllipseMiniSolid className=\"text-ui-fg-base\" />\n </Primitives.ItemIndicator>\n </span>\n {children}\n </Primitives.RadioItem>\n))\nRadioItem.displayName = \"DropdownMenu.RadioItem\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Label](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#label) primitive.\n */\nconst Label = React.forwardRef<\n React.ElementRef<typeof Primitives.Label>,\n React.ComponentPropsWithoutRef<typeof Primitives.Label>\n>(({ className, ...props }, ref) => (\n <Primitives.Label\n ref={ref}\n className={clx(\"text-ui-fg-subtle txt-compact-xsmall-plus\", className)}\n {...props}\n />\n))\nLabel.displayName = \"DropdownMenu.Label\"\n\n/**\n * This component is based on the [Radix UI Dropdown Menu Separator](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#separator) primitive.\n */\nconst Separator = React.forwardRef<\n React.ElementRef<typeof Primitives.Separator>,\n React.ComponentPropsWithoutRef<typeof Primitives.Separator>\n>(({ className, ...props }, ref) => (\n <Primitives.Separator\n ref={ref}\n className={clx(\n \"bg-ui-border-component border-t-ui-border-menu-top border-b-ui-border-menu-bot -mx-1 my-1 h-0.5 border-b border-t\",\n className\n )}\n {...props}\n />\n))\nSeparator.displayName = \"DropdownMenu.Separator\"\n\n/**\n * This component is based on the `span` element and supports all of its props\n */\nconst Shortcut = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={clx(\n \"text-ui-fg-subtle txt-compact-small ml-auto tracking-widest\",\n className\n )}\n {...props}\n />\n )\n}\nShortcut.displayName = \"DropdownMenu.Shortcut\"\n\n/**\n * This component is based on the `span` element and supports all of its props\n */\nconst Hint = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n return (\n <span\n className={clx(\n \"text-ui-fg-subtle txt-compact-small ml-auto tracking-widest\",\n className\n )}\n {...props}\n />\n )\n}\nHint.displayName = \"DropdownMenu.Hint\"\n\nconst DropdownMenu = Object.assign(Root, {\n Trigger,\n Group,\n SubMenu,\n SubMenuContent,\n SubMenuTrigger,\n Content,\n Item,\n CheckboxItem,\n RadioGroup,\n RadioItem,\n Label,\n Separator,\n Shortcut,\n Hint,\n})\n\nexport { DropdownMenu }\n"]}
|
@@ -1,17 +1,17 @@
|
|
1
|
-
import
|
1
|
+
import * as FocusModalPrimitives from "@radix-ui/react-dialog";
|
2
2
|
import * as React from "react";
|
3
3
|
/**
|
4
4
|
* @prop defaultOpen - Whether the modal is opened by default.
|
5
5
|
* @prop open - Whether the modal is opened.
|
6
6
|
* @prop onOpenChange - A function to handle when the modal is opened or closed.
|
7
7
|
*/
|
8
|
-
interface FocusModalRootProps extends React.ComponentPropsWithoutRef<typeof
|
8
|
+
interface FocusModalRootProps extends React.ComponentPropsWithoutRef<typeof FocusModalPrimitives.Root> {
|
9
9
|
}
|
10
|
-
interface FocusModalTriggerProps extends React.ComponentPropsWithoutRef<typeof
|
10
|
+
interface FocusModalTriggerProps extends React.ComponentPropsWithoutRef<typeof FocusModalPrimitives.Trigger> {
|
11
11
|
}
|
12
|
-
interface FocusModalPortalProps extends
|
12
|
+
interface FocusModalPortalProps extends FocusModalPrimitives.DialogPortalProps {
|
13
13
|
}
|
14
|
-
interface FocusModalTitleProps extends React.ComponentPropsWithoutRef<typeof
|
14
|
+
interface FocusModalTitleProps extends React.ComponentPropsWithoutRef<typeof FocusModalPrimitives.Title> {
|
15
15
|
}
|
16
16
|
declare const FocusModal: {
|
17
17
|
(props: FocusModalRootProps): React.JSX.Element;
|
@@ -19,14 +19,14 @@ declare const FocusModal: {
|
|
19
19
|
} & {
|
20
20
|
Trigger: React.ForwardRefExoticComponent<FocusModalTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
21
21
|
Title: React.ForwardRefExoticComponent<FocusModalTitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
22
|
-
Description: React.ForwardRefExoticComponent<
|
23
|
-
Content: React.ForwardRefExoticComponent<Omit<
|
24
|
-
overlayProps?: Omit<Omit<
|
22
|
+
Description: React.ForwardRefExoticComponent<FocusModalPrimitives.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
|
23
|
+
Content: React.ForwardRefExoticComponent<Omit<FocusModalPrimitives.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
|
24
|
+
overlayProps?: Omit<Omit<FocusModalPrimitives.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> | undefined;
|
25
25
|
portalProps?: FocusModalPortalProps | undefined;
|
26
26
|
} & React.RefAttributes<HTMLDivElement>>;
|
27
27
|
Header: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
28
28
|
Body: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
29
|
-
Close: React.ForwardRefExoticComponent<
|
29
|
+
Close: React.ForwardRefExoticComponent<FocusModalPrimitives.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
|
30
30
|
Footer: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
31
31
|
};
|
32
32
|
export { FocusModal };
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"focus-modal.d.ts","sourceRoot":"","sources":["../../../../src/components/focus-modal/focus-modal.tsx"],"names":[],"mappings":"AAGA,OAAO,
|
1
|
+
{"version":3,"file":"focus-modal.d.ts","sourceRoot":"","sources":["../../../../src/components/focus-modal/focus-modal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,oBAAoB,MAAM,wBAAwB,CAAA;AAC9D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B;;;;GAIG;AACH,UAAU,mBACR,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC;CAAG;AAU7E,UAAU,sBAAuB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,OAAO,CAAC;CAAG;AAqB/G,UAAU,qBAAsB,SAAQ,oBAAoB,CAAC,iBAAiB;CAAG;AAqHjF,UAAU,oBAAqB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,oBAAoB,CAAC,KAAK,CAAC;CAAG;AAmC3G,QAAA,MAAM,UAAU;YAlLe,mBAAmB;;;;;;;;;;;;;;CA2LhD,CAAA;AAEF,OAAO,EAAE,UAAU,EAAE,CAAA"}
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
exports.FocusModal = void 0;
|
5
5
|
const tslib_1 = require("tslib");
|
6
6
|
const icons_1 = require("@medusajs/icons");
|
7
|
-
const
|
7
|
+
const FocusModalPrimitives = tslib_1.__importStar(require("@radix-ui/react-dialog"));
|
8
8
|
const React = tslib_1.__importStar(require("react"));
|
9
9
|
const icon_button_1 = require("../icon-button");
|
10
10
|
const kbd_1 = require("../kbd");
|
@@ -13,7 +13,7 @@ const clx_1 = require("../../utils/clx");
|
|
13
13
|
* This component is based on the [Radix UI Dialog](https://www.radix-ui.com/primitives/docs/components/dialog) primitives.
|
14
14
|
*/
|
15
15
|
const FocusModalRoot = (props) => {
|
16
|
-
return React.createElement(
|
16
|
+
return React.createElement(FocusModalPrimitives.Root, { ...props });
|
17
17
|
};
|
18
18
|
FocusModalRoot.displayName = "FocusModal";
|
19
19
|
/**
|
@@ -21,21 +21,21 @@ FocusModalRoot.displayName = "FocusModal";
|
|
21
21
|
* It accepts props from the [Radix UI Dialog Trigger](https://www.radix-ui.com/primitives/docs/components/dialog#trigger) component.
|
22
22
|
*/
|
23
23
|
const FocusModalTrigger = React.forwardRef((props, ref) => {
|
24
|
-
return React.createElement(
|
24
|
+
return React.createElement(FocusModalPrimitives.Trigger, { ref: ref, ...props });
|
25
25
|
});
|
26
26
|
FocusModalTrigger.displayName = "FocusModal.Trigger";
|
27
27
|
/**
|
28
28
|
* This component is used to create the close button for the modal.
|
29
29
|
* It accepts props from the [Radix UI Dialog Close](https://www.radix-ui.com/primitives/docs/components/dialog#close) component.
|
30
30
|
*/
|
31
|
-
const FocusModalClose =
|
31
|
+
const FocusModalClose = FocusModalPrimitives.Close;
|
32
32
|
FocusModalClose.displayName = "FocusModal.Close";
|
33
33
|
/**
|
34
34
|
* The `FocusModal.Content` component uses this component to wrap the modal content.
|
35
35
|
* It accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.
|
36
36
|
*/
|
37
37
|
const FocusModalPortal = (props) => {
|
38
|
-
return (React.createElement(
|
38
|
+
return (React.createElement(FocusModalPrimitives.DialogPortal, { ...props }));
|
39
39
|
};
|
40
40
|
FocusModalPortal.displayName = "FocusModal.Portal";
|
41
41
|
/**
|
@@ -43,7 +43,7 @@ FocusModalPortal.displayName = "FocusModal.Portal";
|
|
43
43
|
* It accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.
|
44
44
|
*/
|
45
45
|
const FocusModalOverlay = React.forwardRef(({ className, ...props }, ref) => {
|
46
|
-
return (React.createElement(
|
46
|
+
return (React.createElement(FocusModalPrimitives.Overlay, { ref: ref, className: (0, clx_1.clx)("bg-ui-bg-overlay fixed inset-0", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props }));
|
47
47
|
});
|
48
48
|
FocusModalOverlay.displayName = "FocusModal.Overlay";
|
49
49
|
/**
|
@@ -53,7 +53,7 @@ FocusModalOverlay.displayName = "FocusModal.Overlay";
|
|
53
53
|
const FocusModalContent = React.forwardRef(({ className, overlayProps, portalProps, ...props }, ref) => {
|
54
54
|
return (React.createElement(FocusModalPortal, { ...portalProps },
|
55
55
|
React.createElement(FocusModalOverlay, { ...overlayProps }),
|
56
|
-
React.createElement(
|
56
|
+
React.createElement(FocusModalPrimitives.Content, { ref: ref, className: (0, clx_1.clx)("bg-ui-bg-base shadow-elevation-modal fixed inset-2 flex flex-col overflow-hidden rounded-lg border outline-none", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=open]:slide-in-from-bottom-0 data-[state=closed]:slide-in-from-bottom-2 duration-200", className), ...props })));
|
57
57
|
});
|
58
58
|
FocusModalContent.displayName = "FocusModal.Content";
|
59
59
|
/**
|
@@ -63,7 +63,7 @@ FocusModalContent.displayName = "FocusModal.Content";
|
|
63
63
|
const FocusModalHeader = React.forwardRef(({ children, className, ...props }, ref) => {
|
64
64
|
return (React.createElement("div", { ref: ref, className: (0, clx_1.clx)("border-ui-border-base flex items-center justify-between gap-x-4 border-b px-4 py-2", className), ...props },
|
65
65
|
React.createElement("div", { className: "flex items-center gap-x-2" },
|
66
|
-
React.createElement(
|
66
|
+
React.createElement(FocusModalPrimitives.Close, { asChild: true },
|
67
67
|
React.createElement(icon_button_1.IconButton, { size: "small", type: "button", variant: "transparent" },
|
68
68
|
React.createElement(icons_1.XMark, null))),
|
69
69
|
React.createElement(kbd_1.Kbd, null, "esc")),
|
@@ -83,14 +83,14 @@ FocusModalFooter.displayName = "FocusModal.Footer";
|
|
83
83
|
* It accepts props from the [Radix UI Dialog Title](https://www.radix-ui.com/primitives/docs/components/dialog#title) component.
|
84
84
|
*/
|
85
85
|
const FocusModalTitle = React.forwardRef(({ className, ...props }, ref) => {
|
86
|
-
return (React.createElement(
|
86
|
+
return (React.createElement(FocusModalPrimitives.Title, { ref: ref, ...props }));
|
87
87
|
});
|
88
88
|
FocusModalTitle.displayName = "FocusModal.Title";
|
89
89
|
/**
|
90
90
|
* This component adds accessible description to the modal.
|
91
91
|
* It accepts props from the [Radix UI Dialog Description](https://www.radix-ui.com/primitives/docs/components/dialog#description) component.
|
92
92
|
*/
|
93
|
-
const FocusModalDescription =
|
93
|
+
const FocusModalDescription = FocusModalPrimitives.Description;
|
94
94
|
FocusModalDescription.displayName = "FocusModal.Description";
|
95
95
|
/**
|
96
96
|
* This component is used to wrap the body content of the modal.
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"focus-modal.js","sourceRoot":"","sources":["../../../../src/components/focus-modal/focus-modal.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport { XMark } from \"@medusajs/icons\"\nimport { Dialog as RadixDialog } from \"radix-ui\"\nimport * as React from \"react\"\n\nimport { IconButton } from \"@/components/icon-button\"\nimport { Kbd } from \"@/components/kbd\"\nimport { clx } from \"@/utils/clx\"\n\n/**\n * @prop defaultOpen - Whether the modal is opened by default.\n * @prop open - Whether the modal is opened.\n * @prop onOpenChange - A function to handle when the modal is opened or closed.\n */\ninterface FocusModalRootProps\n extends React.ComponentPropsWithoutRef<typeof RadixDialog.Root> {}\n\n/**\n * This component is based on the [Radix UI Dialog](https://www.radix-ui.com/primitives/docs/components/dialog) primitives.\n */\nconst FocusModalRoot = (props: FocusModalRootProps) => {\n return <RadixDialog.Root {...props} />\n}\nFocusModalRoot.displayName = \"FocusModal\"\n\ninterface FocusModalTriggerProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Trigger> {}\n\n/**\n * This component is used to create the trigger button that opens the modal.\n * It accepts props from the [Radix UI Dialog Trigger](https://www.radix-ui.com/primitives/docs/components/dialog#trigger) component.\n */\nconst FocusModalTrigger = React.forwardRef<\n React.ElementRef<typeof RadixDialog.Trigger>,\n FocusModalTriggerProps\n>((props: FocusModalTriggerProps, ref) => {\n return <RadixDialog.Trigger ref={ref} {...props} />\n})\nFocusModalTrigger.displayName = \"FocusModal.Trigger\"\n\n/**\n * This component is used to create the close button for the modal.\n * It accepts props from the [Radix UI Dialog Close](https://www.radix-ui.com/primitives/docs/components/dialog#close) component.\n */\nconst FocusModalClose = RadixDialog.Close\nFocusModalClose.displayName = \"FocusModal.Close\"\n\ninterface FocusModalPortalProps extends RadixDialog.DialogPortalProps {}\n\n/**\n * The `FocusModal.Content` component uses this component to wrap the modal content.\n * It accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.\n */\nconst FocusModalPortal = (props: FocusModalPortalProps) => {\n return (\n <RadixDialog.DialogPortal {...props} />\n )\n}\nFocusModalPortal.displayName = \"FocusModal.Portal\"\n\n/**\n * This component is used to create the overlay for the modal.\n * It accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.\n */\nconst FocusModalOverlay = React.forwardRef<\n React.ElementRef<typeof RadixDialog.Overlay>,\n React.ComponentPropsWithoutRef<typeof RadixDialog.Overlay>\n>(({ className, ...props }, ref) => {\n return (\n <RadixDialog.Overlay\n ref={ref}\n className={clx(\n \"bg-ui-bg-overlay fixed inset-0\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n className\n )}\n {...props}\n />\n )\n})\nFocusModalOverlay.displayName = \"FocusModal.Overlay\"\n\n/**\n * This component wraps the content of the modal.\n * It accepts props from the [Radix UI Dialog Content](https://www.radix-ui.com/primitives/docs/components/dialog#content) component.\n */\nconst FocusModalContent = React.forwardRef<\n React.ElementRef<typeof RadixDialog.Content>,\n React.ComponentPropsWithoutRef<typeof RadixDialog.Content> & {\n overlayProps?: React.ComponentPropsWithoutRef<typeof FocusModalOverlay>\n portalProps?: React.ComponentPropsWithoutRef<typeof FocusModalPortal>\n }\n>(({ className, overlayProps, portalProps, ...props }, ref) => {\n return (\n <FocusModalPortal {...portalProps}>\n <FocusModalOverlay {...overlayProps} />\n <RadixDialog.Content\n ref={ref}\n className={clx(\n \"bg-ui-bg-base shadow-elevation-modal fixed inset-2 flex flex-col overflow-hidden rounded-lg border outline-none\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=open]:slide-in-from-bottom-0 data-[state=closed]:slide-in-from-bottom-2 duration-200\",\n className\n )}\n {...props}\n />\n </FocusModalPortal>\n )\n})\nFocusModalContent.displayName = \"FocusModal.Content\"\n\n/**\n * This component is used to wrap the header content of the modal.\n * This component is based on the `div` element and supports all of its props\n */\nconst FocusModalHeader = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<\"div\">\n>(({ children, className, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={clx(\n \"border-ui-border-base flex items-center justify-between gap-x-4 border-b px-4 py-2\",\n className\n )}\n {...props}\n >\n <div className=\"flex items-center gap-x-2\">\n <RadixDialog.Close asChild>\n <IconButton size=\"small\" type=\"button\" variant=\"transparent\">\n <XMark />\n </IconButton>\n </RadixDialog.Close>\n <Kbd>esc</Kbd>\n </div>\n {children}\n </div>\n )\n})\nFocusModalHeader.displayName = \"FocusModal.Header\"\n\n/**\n * This component is used to wrap the footer content of the modal.\n * This component is based on the `div` element and supports all of its props\n */\nconst FocusModalFooter = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<\"div\">\n>(({ children, className, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={clx(\n \"border-ui-border-base flex items-center justify-end gap-x-2 border-t p-4\",\n className\n )}\n {...props}\n >\n {children}\n </div>\n )\n})\nFocusModalFooter.displayName = \"FocusModal.Footer\"\n\ninterface FocusModalTitleProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Title> {}\n\n/**\n * This component adds an accessible title to the modal.\n * It accepts props from the [Radix UI Dialog Title](https://www.radix-ui.com/primitives/docs/components/dialog#title) component.\n */\nconst FocusModalTitle = React.forwardRef<\n HTMLHeadingElement,\n FocusModalTitleProps\n>(({ className, ...props }: FocusModalTitleProps, ref) => {\n return (\n <RadixDialog.Title ref={ref} {...props} />\n )\n})\nFocusModalTitle.displayName = \"FocusModal.Title\"\n\n/**\n * This component adds accessible description to the modal.\n * It accepts props from the [Radix UI Dialog Description](https://www.radix-ui.com/primitives/docs/components/dialog#description) component.\n */\nconst FocusModalDescription = RadixDialog.Description\nFocusModalDescription.displayName = \"FocusModal.Description\"\n\n/**\n * This component is used to wrap the body content of the modal.\n * This component is based on the `div` element and supports all of its props\n */\nconst FocusModalBody = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => {\n return <div ref={ref} className={clx(\"flex-1\", className)} {...props} />\n})\nFocusModalBody.displayName = \"FocusModal.Body\"\n\nconst FocusModal = Object.assign(FocusModalRoot, {\n Trigger: FocusModalTrigger,\n Title: FocusModalTitle,\n Description: FocusModalDescription,\n Content: FocusModalContent,\n Header: FocusModalHeader,\n Body: FocusModalBody,\n Close: FocusModalClose,\n Footer: FocusModalFooter,\n})\n\nexport { FocusModal }\n"]}
|
1
|
+
{"version":3,"file":"focus-modal.js","sourceRoot":"","sources":["../../../../src/components/focus-modal/focus-modal.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;AAEZ,2CAAuC;AACvC,qFAA8D;AAC9D,qDAA8B;AAE9B,0DAAqD;AACrD,0CAAsC;AACtC,qCAAiC;AAUjC;;GAEG;AACH,MAAM,cAAc,GAAG,CAAC,KAA0B,EAAE,EAAE;IACpD,OAAO,oBAAC,oBAAoB,CAAC,IAAI,OAAK,KAAK,GAAI,CAAA;AACjD,CAAC,CAAA;AACD,cAAc,CAAC,WAAW,GAAG,YAAY,CAAA;AAIzC;;;GAGG;AACH,MAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAGxC,CAAC,KAA6B,EAAE,GAAG,EAAE,EAAE;IACvC,OAAO,oBAAC,oBAAoB,CAAC,OAAO,IAAC,GAAG,EAAE,GAAG,KAAM,KAAK,GAAI,CAAA;AAC9D,CAAC,CAAC,CAAA;AACF,iBAAiB,CAAC,WAAW,GAAG,oBAAoB,CAAA;AAEpD;;;GAGG;AACH,MAAM,eAAe,GAAG,oBAAoB,CAAC,KAAK,CAAA;AAClD,eAAe,CAAC,WAAW,GAAG,kBAAkB,CAAA;AAIhD;;;GAGG;AACH,MAAM,gBAAgB,GAAG,CAAC,KAA4B,EAAE,EAAE;IACxD,OAAO,CACL,oBAAC,oBAAoB,CAAC,YAAY,OAAK,KAAK,GAAI,CACjD,CAAA;AACH,CAAC,CAAA;AACD,gBAAgB,CAAC,WAAW,GAAG,mBAAmB,CAAA;AAElD;;;GAGG;AACH,MAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAGxC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,OAAO,CACL,oBAAC,oBAAoB,CAAC,OAAO,IAC3B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,gCAAgC,EAChC,yHAAyH,EACzH,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AACF,iBAAiB,CAAC,WAAW,GAAG,oBAAoB,CAAA;AAEpD;;;GAGG;AACH,MAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAMxC,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC5D,OAAO,CACL,oBAAC,gBAAgB,OAAK,WAAW;QAC/B,oBAAC,iBAAiB,OAAK,YAAY,GAAI;QACvC,oBAAC,oBAAoB,CAAC,OAAO,IAC3B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,iHAAiH,EACjH,2NAA2N,EAC3N,SAAS,CACV,KACG,KAAK,GACT,CACe,CACpB,CAAA;AACH,CAAC,CAAC,CAAA;AACF,iBAAiB,CAAC,WAAW,GAAG,oBAAoB,CAAA;AAEpD;;;GAGG;AACH,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CAGvC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC3C,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,oFAAoF,EACpF,SAAS,CACV,KACG,KAAK;QAET,6BAAK,SAAS,EAAC,2BAA2B;YACxC,oBAAC,oBAAoB,CAAC,KAAK,IAAC,OAAO;gBACjC,oBAAC,wBAAU,IAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAC,aAAa;oBAC1D,oBAAC,aAAK,OAAG,CACE,CACc;YAC7B,oBAAC,SAAG,cAAU,CACV;QACL,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AACF,gBAAgB,CAAC,WAAW,GAAG,mBAAmB,CAAA;AAElD;;;GAGG;AACH,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CAGvC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC3C,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,0EAA0E,EAC1E,SAAS,CACV,KACG,KAAK,IAER,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AACF,gBAAgB,CAAC,WAAW,GAAG,mBAAmB,CAAA;AAIlD;;;GAGG;AACH,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAGtC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAwB,EAAE,GAAG,EAAE,EAAE;IACvD,OAAO,CACL,oBAAC,oBAAoB,CAAC,KAAK,IAAC,GAAG,EAAE,GAAG,KAAM,KAAK,GAAI,CACpD,CAAA;AACH,CAAC,CAAC,CAAA;AACF,eAAe,CAAC,WAAW,GAAG,kBAAkB,CAAA;AAEhD;;;GAGG;AACH,MAAM,qBAAqB,GAAG,oBAAoB,CAAC,WAAW,CAAA;AAC9D,qBAAqB,CAAC,WAAW,GAAG,wBAAwB,CAAA;AAE5D;;;GAGG;AACH,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAGrC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,OAAO,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAA,SAAG,EAAC,QAAQ,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAAA;AAC1E,CAAC,CAAC,CAAA;AACF,cAAc,CAAC,WAAW,GAAG,iBAAiB,CAAA;AAE9C,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,EAAE;IAC/C,OAAO,EAAE,iBAAiB;IAC1B,KAAK,EAAE,eAAe;IACtB,WAAW,EAAE,qBAAqB;IAClC,OAAO,EAAE,iBAAiB;IAC1B,MAAM,EAAE,gBAAgB;IACxB,IAAI,EAAE,cAAc;IACpB,KAAK,EAAE,eAAe;IACtB,MAAM,EAAE,gBAAgB;CACzB,CAAC,CAAA;AAEO,gCAAU","sourcesContent":["\"use client\"\n\nimport { XMark } from \"@medusajs/icons\"\nimport * as FocusModalPrimitives from \"@radix-ui/react-dialog\"\nimport * as React from \"react\"\n\nimport { IconButton } from \"@/components/icon-button\"\nimport { Kbd } from \"@/components/kbd\"\nimport { clx } from \"@/utils/clx\"\n\n/**\n * @prop defaultOpen - Whether the modal is opened by default.\n * @prop open - Whether the modal is opened.\n * @prop onOpenChange - A function to handle when the modal is opened or closed.\n */\ninterface FocusModalRootProps\n extends React.ComponentPropsWithoutRef<typeof FocusModalPrimitives.Root> {}\n\n/**\n * This component is based on the [Radix UI Dialog](https://www.radix-ui.com/primitives/docs/components/dialog) primitives.\n */\nconst FocusModalRoot = (props: FocusModalRootProps) => {\n return <FocusModalPrimitives.Root {...props} />\n}\nFocusModalRoot.displayName = \"FocusModal\"\n\ninterface FocusModalTriggerProps extends React.ComponentPropsWithoutRef<typeof FocusModalPrimitives.Trigger> {}\n\n/**\n * This component is used to create the trigger button that opens the modal.\n * It accepts props from the [Radix UI Dialog Trigger](https://www.radix-ui.com/primitives/docs/components/dialog#trigger) component.\n */\nconst FocusModalTrigger = React.forwardRef<\n React.ElementRef<typeof FocusModalPrimitives.Trigger>,\n FocusModalTriggerProps\n>((props: FocusModalTriggerProps, ref) => {\n return <FocusModalPrimitives.Trigger ref={ref} {...props} />\n})\nFocusModalTrigger.displayName = \"FocusModal.Trigger\"\n\n/**\n * This component is used to create the close button for the modal.\n * It accepts props from the [Radix UI Dialog Close](https://www.radix-ui.com/primitives/docs/components/dialog#close) component.\n */\nconst FocusModalClose = FocusModalPrimitives.Close\nFocusModalClose.displayName = \"FocusModal.Close\"\n\ninterface FocusModalPortalProps extends FocusModalPrimitives.DialogPortalProps {}\n\n/**\n * The `FocusModal.Content` component uses this component to wrap the modal content.\n * It accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.\n */\nconst FocusModalPortal = (props: FocusModalPortalProps) => {\n return (\n <FocusModalPrimitives.DialogPortal {...props} />\n )\n}\nFocusModalPortal.displayName = \"FocusModal.Portal\"\n\n/**\n * This component is used to create the overlay for the modal.\n * It accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.\n */\nconst FocusModalOverlay = React.forwardRef<\n React.ElementRef<typeof FocusModalPrimitives.Overlay>,\n React.ComponentPropsWithoutRef<typeof FocusModalPrimitives.Overlay>\n>(({ className, ...props }, ref) => {\n return (\n <FocusModalPrimitives.Overlay\n ref={ref}\n className={clx(\n \"bg-ui-bg-overlay fixed inset-0\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n className\n )}\n {...props}\n />\n )\n})\nFocusModalOverlay.displayName = \"FocusModal.Overlay\"\n\n/**\n * This component wraps the content of the modal.\n * It accepts props from the [Radix UI Dialog Content](https://www.radix-ui.com/primitives/docs/components/dialog#content) component.\n */\nconst FocusModalContent = React.forwardRef<\n React.ElementRef<typeof FocusModalPrimitives.Content>,\n React.ComponentPropsWithoutRef<typeof FocusModalPrimitives.Content> & {\n overlayProps?: React.ComponentPropsWithoutRef<typeof FocusModalOverlay>\n portalProps?: React.ComponentPropsWithoutRef<typeof FocusModalPortal>\n }\n>(({ className, overlayProps, portalProps, ...props }, ref) => {\n return (\n <FocusModalPortal {...portalProps}>\n <FocusModalOverlay {...overlayProps} />\n <FocusModalPrimitives.Content\n ref={ref}\n className={clx(\n \"bg-ui-bg-base shadow-elevation-modal fixed inset-2 flex flex-col overflow-hidden rounded-lg border outline-none\",\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=open]:slide-in-from-bottom-0 data-[state=closed]:slide-in-from-bottom-2 duration-200\",\n className\n )}\n {...props}\n />\n </FocusModalPortal>\n )\n})\nFocusModalContent.displayName = \"FocusModal.Content\"\n\n/**\n * This component is used to wrap the header content of the modal.\n * This component is based on the `div` element and supports all of its props\n */\nconst FocusModalHeader = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<\"div\">\n>(({ children, className, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={clx(\n \"border-ui-border-base flex items-center justify-between gap-x-4 border-b px-4 py-2\",\n className\n )}\n {...props}\n >\n <div className=\"flex items-center gap-x-2\">\n <FocusModalPrimitives.Close asChild>\n <IconButton size=\"small\" type=\"button\" variant=\"transparent\">\n <XMark />\n </IconButton>\n </FocusModalPrimitives.Close>\n <Kbd>esc</Kbd>\n </div>\n {children}\n </div>\n )\n})\nFocusModalHeader.displayName = \"FocusModal.Header\"\n\n/**\n * This component is used to wrap the footer content of the modal.\n * This component is based on the `div` element and supports all of its props\n */\nconst FocusModalFooter = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<\"div\">\n>(({ children, className, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={clx(\n \"border-ui-border-base flex items-center justify-end gap-x-2 border-t p-4\",\n className\n )}\n {...props}\n >\n {children}\n </div>\n )\n})\nFocusModalFooter.displayName = \"FocusModal.Footer\"\n\ninterface FocusModalTitleProps extends React.ComponentPropsWithoutRef<typeof FocusModalPrimitives.Title> {}\n\n/**\n * This component adds an accessible title to the modal.\n * It accepts props from the [Radix UI Dialog Title](https://www.radix-ui.com/primitives/docs/components/dialog#title) component.\n */\nconst FocusModalTitle = React.forwardRef<\n HTMLHeadingElement,\n FocusModalTitleProps\n>(({ className, ...props }: FocusModalTitleProps, ref) => {\n return (\n <FocusModalPrimitives.Title ref={ref} {...props} />\n )\n})\nFocusModalTitle.displayName = \"FocusModal.Title\"\n\n/**\n * This component adds accessible description to the modal.\n * It accepts props from the [Radix UI Dialog Description](https://www.radix-ui.com/primitives/docs/components/dialog#description) component.\n */\nconst FocusModalDescription = FocusModalPrimitives.Description\nFocusModalDescription.displayName = \"FocusModal.Description\"\n\n/**\n * This component is used to wrap the body content of the modal.\n * This component is based on the `div` element and supports all of its props\n */\nconst FocusModalBody = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => {\n return <div ref={ref} className={clx(\"flex-1\", className)} {...props} />\n})\nFocusModalBody.displayName = \"FocusModal.Body\"\n\nconst FocusModal = Object.assign(FocusModalRoot, {\n Trigger: FocusModalTrigger,\n Title: FocusModalTitle,\n Description: FocusModalDescription,\n Content: FocusModalContent,\n Header: FocusModalHeader,\n Body: FocusModalBody,\n Close: FocusModalClose,\n Footer: FocusModalFooter,\n})\n\nexport { FocusModal }\n"]}
|