@7onic-ui/react 0.3.9 → 0.3.10
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/README.md +2 -2
- package/dist/chart.mjs +3 -9
- package/dist/chart.mjs.map +1 -1
- package/dist/chunk-234NAXGV.mjs +252 -0
- package/dist/chunk-234NAXGV.mjs.map +1 -0
- package/dist/chunk-53MIUPSY.mjs +13 -0
- package/dist/chunk-53MIUPSY.mjs.map +1 -0
- package/dist/chunk-BN5BEA3V.mjs +195 -0
- package/dist/chunk-BN5BEA3V.mjs.map +1 -0
- package/dist/chunk-COW3B62M.mjs +214 -0
- package/dist/chunk-COW3B62M.mjs.map +1 -0
- package/dist/chunk-CTH6SN5Y.mjs +114 -0
- package/dist/chunk-CTH6SN5Y.mjs.map +1 -0
- package/dist/chunk-D3NTQNDW.mjs +440 -0
- package/dist/chunk-D3NTQNDW.mjs.map +1 -0
- package/dist/chunk-DDRYEJBJ.mjs +164 -0
- package/dist/chunk-DDRYEJBJ.mjs.map +1 -0
- package/dist/chunk-DJAEXCRU.mjs +190 -0
- package/dist/chunk-DJAEXCRU.mjs.map +1 -0
- package/dist/chunk-DRVHHEAY.mjs +145 -0
- package/dist/chunk-DRVHHEAY.mjs.map +1 -0
- package/dist/chunk-DTLNWOTR.mjs +482 -0
- package/dist/chunk-DTLNWOTR.mjs.map +1 -0
- package/dist/chunk-DYYQOHQR.mjs +214 -0
- package/dist/chunk-DYYQOHQR.mjs.map +1 -0
- package/dist/chunk-FHUAH6AJ.mjs +93 -0
- package/dist/chunk-FHUAH6AJ.mjs.map +1 -0
- package/dist/chunk-GD4YE5AE.mjs +209 -0
- package/dist/chunk-GD4YE5AE.mjs.map +1 -0
- package/dist/chunk-GRCJ35DX.mjs +144 -0
- package/dist/chunk-GRCJ35DX.mjs.map +1 -0
- package/dist/chunk-HHX4GABH.mjs +129 -0
- package/dist/chunk-HHX4GABH.mjs.map +1 -0
- package/dist/chunk-IPCIC2BI.mjs +148 -0
- package/dist/chunk-IPCIC2BI.mjs.map +1 -0
- package/dist/chunk-IY3R2VGB.mjs +272 -0
- package/dist/chunk-IY3R2VGB.mjs.map +1 -0
- package/dist/chunk-JCJEVXER.mjs +170 -0
- package/dist/chunk-JCJEVXER.mjs.map +1 -0
- package/dist/chunk-KBPYAMGS.mjs +157 -0
- package/dist/chunk-KBPYAMGS.mjs.map +1 -0
- package/dist/chunk-LJJ6K4IU.mjs +318 -0
- package/dist/chunk-LJJ6K4IU.mjs.map +1 -0
- package/dist/chunk-MRUVGHGP.mjs +375 -0
- package/dist/chunk-MRUVGHGP.mjs.map +1 -0
- package/dist/chunk-N4K2BDGM.mjs +153 -0
- package/dist/chunk-N4K2BDGM.mjs.map +1 -0
- package/dist/chunk-NWFMJWGX.mjs +165 -0
- package/dist/chunk-NWFMJWGX.mjs.map +1 -0
- package/dist/chunk-PTAPPOKU.mjs +117 -0
- package/dist/chunk-PTAPPOKU.mjs.map +1 -0
- package/dist/chunk-PVTBM7V7.mjs +316 -0
- package/dist/chunk-PVTBM7V7.mjs.map +1 -0
- package/dist/chunk-Q5WVLK2L.mjs +77 -0
- package/dist/chunk-Q5WVLK2L.mjs.map +1 -0
- package/dist/chunk-RKSB2N5L.mjs +206 -0
- package/dist/chunk-RKSB2N5L.mjs.map +1 -0
- package/dist/chunk-S4DGVKBK.mjs +151 -0
- package/dist/chunk-S4DGVKBK.mjs.map +1 -0
- package/dist/chunk-S4T4PU7F.mjs +114 -0
- package/dist/chunk-S4T4PU7F.mjs.map +1 -0
- package/dist/chunk-SZPZOGPC.mjs +394 -0
- package/dist/chunk-SZPZOGPC.mjs.map +1 -0
- package/dist/chunk-T546XBQG.mjs +443 -0
- package/dist/chunk-T546XBQG.mjs.map +1 -0
- package/dist/chunk-UWTT5AE6.mjs +145 -0
- package/dist/chunk-UWTT5AE6.mjs.map +1 -0
- package/dist/chunk-V5UFWYFI.mjs +255 -0
- package/dist/chunk-V5UFWYFI.mjs.map +1 -0
- package/dist/chunk-VUPGBB5X.mjs +150 -0
- package/dist/chunk-VUPGBB5X.mjs.map +1 -0
- package/dist/chunk-W6YNEU53.mjs +175 -0
- package/dist/chunk-W6YNEU53.mjs.map +1 -0
- package/dist/chunk-WWSN5YME.mjs +222 -0
- package/dist/chunk-WWSN5YME.mjs.map +1 -0
- package/dist/chunk-XK52LYR4.mjs +182 -0
- package/dist/chunk-XK52LYR4.mjs.map +1 -0
- package/dist/chunk-YIAH6KHV.mjs +164 -0
- package/dist/chunk-YIAH6KHV.mjs.map +1 -0
- package/dist/chunk-Z6JWWCNL.mjs +108 -0
- package/dist/chunk-Z6JWWCNL.mjs.map +1 -0
- package/dist/chunk-ZDRUTJ4T.mjs +119 -0
- package/dist/chunk-ZDRUTJ4T.mjs.map +1 -0
- package/dist/components/accordion.mjs +19 -0
- package/dist/components/accordion.mjs.map +1 -0
- package/dist/components/alert.mjs +15 -0
- package/dist/components/alert.mjs.map +1 -0
- package/dist/components/avatar.mjs +23 -0
- package/dist/components/avatar.mjs.map +1 -0
- package/dist/components/badge.mjs +11 -0
- package/dist/components/badge.mjs.map +1 -0
- package/dist/components/breadcrumb.mjs +23 -0
- package/dist/components/breadcrumb.mjs.map +1 -0
- package/dist/components/button-group.mjs +11 -0
- package/dist/components/button-group.mjs.map +1 -0
- package/dist/components/button.mjs +12 -0
- package/dist/components/button.mjs.map +1 -0
- package/dist/components/card.mjs +25 -0
- package/dist/components/card.mjs.map +1 -0
- package/dist/components/chat-input.mjs +15 -0
- package/dist/components/chat-input.mjs.map +1 -0
- package/dist/components/chat-message.mjs +17 -0
- package/dist/components/chat-message.mjs.map +1 -0
- package/dist/components/checkbox.mjs +12 -0
- package/dist/components/checkbox.mjs.map +1 -0
- package/dist/components/divider.mjs +11 -0
- package/dist/components/divider.mjs.map +1 -0
- package/dist/components/drawer.mjs +33 -0
- package/dist/components/drawer.mjs.map +1 -0
- package/dist/components/dropdown.mjs +35 -0
- package/dist/components/dropdown.mjs.map +1 -0
- package/dist/components/field.mjs +17 -0
- package/dist/components/field.mjs.map +1 -0
- package/dist/components/icon-button.mjs +12 -0
- package/dist/components/icon-button.mjs.map +1 -0
- package/dist/components/input.mjs +12 -0
- package/dist/components/input.mjs.map +1 -0
- package/dist/components/metric-card.mjs +23 -0
- package/dist/components/metric-card.mjs.map +1 -0
- package/dist/components/modal.mjs +57 -0
- package/dist/components/modal.mjs.map +1 -0
- package/dist/components/navigation-menu.mjs +27 -0
- package/dist/components/navigation-menu.mjs.map +1 -0
- package/dist/components/pagination.mjs +33 -0
- package/dist/components/pagination.mjs.map +1 -0
- package/dist/components/popover.mjs +23 -0
- package/dist/components/popover.mjs.map +1 -0
- package/dist/components/progress.mjs +11 -0
- package/dist/components/progress.mjs.map +1 -0
- package/dist/components/quick-reply.mjs +15 -0
- package/dist/components/quick-reply.mjs.map +1 -0
- package/dist/components/radio-group.mjs +16 -0
- package/dist/components/radio-group.mjs.map +1 -0
- package/dist/components/segmented.mjs +15 -0
- package/dist/components/segmented.mjs.map +1 -0
- package/dist/components/select.mjs +23 -0
- package/dist/components/select.mjs.map +1 -0
- package/dist/components/skeleton.mjs +11 -0
- package/dist/components/skeleton.mjs.map +1 -0
- package/dist/components/slider.mjs +11 -0
- package/dist/components/slider.mjs.map +1 -0
- package/dist/components/spinner.mjs +11 -0
- package/dist/components/spinner.mjs.map +1 -0
- package/dist/components/switch.mjs +12 -0
- package/dist/components/switch.mjs.map +1 -0
- package/dist/components/table.mjs +23 -0
- package/dist/components/table.mjs.map +1 -0
- package/dist/components/tabs.mjs +19 -0
- package/dist/components/tabs.mjs.map +1 -0
- package/dist/components/textarea.mjs +12 -0
- package/dist/components/textarea.mjs.map +1 -0
- package/dist/components/toast.mjs +13 -0
- package/dist/components/toast.mjs.map +1 -0
- package/dist/components/toggle-group.mjs +15 -0
- package/dist/components/toggle-group.mjs.map +1 -0
- package/dist/components/toggle.mjs +11 -0
- package/dist/components/toggle.mjs.map +1 -0
- package/dist/components/tooltip.mjs +21 -0
- package/dist/components/tooltip.mjs.map +1 -0
- package/dist/components/typing-indicator.mjs +11 -0
- package/dist/components/typing-indicator.mjs.map +1 -0
- package/dist/index.mjs +296 -7536
- package/dist/index.mjs.map +1 -1
- package/llms.txt +23 -23
- package/package.json +4 -3
- package/dist/chart.d.mts +0 -147
- package/dist/index.d.mts +0 -1535
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/ui/quick-reply.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ============================================================================\n// Color mapping per variant × color\n// ============================================================================\n\nconst colorMap = {\n default: {\n outline: 'border border-border text-foreground bg-background hover:bg-background-muted',\n filled: 'bg-background-muted text-foreground hover:bg-background-elevated',\n ghost: 'text-foreground hover:bg-background-muted',\n },\n primary: {\n outline: 'border border-primary text-text-primary bg-background hover:bg-primary-tint',\n filled: 'bg-primary-tint text-text-primary hover:bg-primary/20',\n ghost: 'text-text-primary hover:bg-primary-tint',\n },\n} as const\n\n// ============================================================================\n// Context — propagates variant/color/size/radius from Root to Items\n// ============================================================================\n\ntype QuickReplyContextValue = {\n size: QuickReplySize\n variant: QuickReplyVariant\n color: QuickReplyColor\n radius: QuickReplyRadius\n}\n\nconst QuickReplyContext = React.createContext<QuickReplyContextValue>({\n size: 'default',\n variant: 'outline',\n color: 'default',\n radius: 'full',\n})\n\n// ============================================================================\n// Variants (CVA)\n// ============================================================================\n\nconst quickReplyRootVariants = cva(\n 'flex items-center',\n {\n variants: {\n layout: {\n scroll: 'overflow-x-auto',\n wrap: 'flex-wrap',\n },\n gap: {\n sm: 'gap-1.5',\n default: 'gap-2',\n lg: 'gap-2.5',\n },\n },\n defaultVariants: {\n layout: 'scroll',\n gap: 'default',\n },\n }\n)\n\nconst quickReplyItemVariants = cva(\n [\n 'inline-flex items-center justify-center',\n 'whitespace-nowrap font-semibold shrink-0',\n 'transition-colors duration-fast cursor-pointer',\n 'focus-visible:outline-none focus-visible:focus-ring',\n 'disabled:pointer-events-none disabled:opacity-50',\n 'select-none',\n ].join(' '),\n {\n variants: {\n size: {\n sm: 'h-7 px-2.5 text-xs gap-1.5', // 28px\n default: 'h-8 px-3 text-sm gap-1.5', // 32px\n lg: 'h-9 px-3.5 text-md gap-1.5', // 36px\n },\n radius: {\n md: 'rounded-md', // 6px\n lg: 'rounded-lg', // 8px\n full: 'rounded-full', // 9999px\n },\n },\n defaultVariants: {\n size: 'default',\n radius: 'full',\n },\n }\n)\n\n// ============================================================================\n// Icon sizes per item size\n// ============================================================================\n\nconst iconSizeMap = {\n sm: 'icon-xs', // 14px\n default: 'icon-xs', // 14px\n lg: 'icon-sm', // 16px\n} as const\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type QuickReplyLayout = 'scroll' | 'wrap'\nexport type QuickReplyVariant = 'outline' | 'filled' | 'ghost'\nexport type QuickReplyColor = 'default' | 'primary'\nexport type QuickReplySize = 'sm' | 'default' | 'lg'\nexport type QuickReplyRadius = 'md' | 'lg' | 'full'\nexport type QuickReplyGap = 'sm' | 'default' | 'lg'\n\nexport interface QuickReplyRootProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof quickReplyRootVariants> {\n /** Layout mode: horizontal scroll or wrap to multiple rows */\n layout?: QuickReplyLayout\n /** Visual style applied to all child Items */\n variant?: QuickReplyVariant\n /** Color theme applied to all child Items */\n color?: QuickReplyColor\n /** Chip size applied to all child Items */\n size?: QuickReplySize\n /** Border radius applied to all child Items */\n radius?: QuickReplyRadius\n /** Gap between Items */\n gap?: QuickReplyGap\n}\n\nexport interface QuickReplyItemProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n /** Leading icon (SVG or ReactNode) */\n icon?: React.ReactNode\n /** Render as child element (Slot pattern) */\n asChild?: boolean\n}\n\n// ============================================================================\n// QuickReply Root — group container that propagates style via Context\n// ============================================================================\n\nconst QuickReply = React.forwardRef<HTMLDivElement, QuickReplyRootProps>(\n (\n {\n className,\n layout = 'scroll',\n gap = 'default',\n variant = 'outline',\n color = 'default',\n size = 'default',\n radius = 'full',\n role = 'group',\n children,\n ...props\n },\n ref\n ) => {\n const contextValue = React.useMemo<QuickReplyContextValue>(\n () => ({ size, variant, color, radius }),\n [size, variant, color, radius]\n )\n\n return (\n <QuickReplyContext.Provider value={contextValue}>\n <div\n ref={ref}\n role={role}\n className={cn(quickReplyRootVariants({ layout, gap }), className)}\n {...props}\n >\n {children}\n </div>\n </QuickReplyContext.Provider>\n )\n }\n)\nQuickReply.displayName = 'QuickReply'\n\n// ============================================================================\n// QuickReply Item — individual chip button\n// ============================================================================\n\nconst QuickReplyItem = React.forwardRef<HTMLButtonElement, QuickReplyItemProps>(\n ({ className, icon, asChild = false, children, ...props }, ref) => {\n const { size, variant, color, radius } = React.useContext(QuickReplyContext)\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const Comp = asChild ? (Slot as any) : 'button'\n const colorClasses = colorMap[color][variant]\n\n return (\n <Comp\n ref={ref}\n type={!asChild ? 'button' : undefined}\n {...props}\n className={cn(\n quickReplyItemVariants({ size, radius }),\n colorClasses,\n className\n )}\n >\n {icon && (\n <span\n className={cn('shrink-0 [&>svg]:w-full [&>svg]:h-full', iconSizeMap[size])}\n aria-hidden=\"true\"\n >\n {icon}\n </span>\n )}\n {children}\n </Comp>\n )\n }\n)\nQuickReplyItem.displayName = 'QuickReplyItem'\n\nexport {\n QuickReply,\n QuickReplyItem,\n quickReplyRootVariants,\n quickReplyItemVariants,\n}\n"],"mappings":"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","names":[]}
|
|
@@ -0,0 +1,318 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
cn
|
|
4
|
+
} from "./chunk-53MIUPSY.mjs";
|
|
5
|
+
|
|
6
|
+
// src/components/ui/modal.tsx
|
|
7
|
+
import * as React from "react";
|
|
8
|
+
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
9
|
+
import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
|
|
10
|
+
import { cva } from "class-variance-authority";
|
|
11
|
+
var DefaultCloseIcon = ({ className }) => /* @__PURE__ */ React.createElement(
|
|
12
|
+
"svg",
|
|
13
|
+
{
|
|
14
|
+
className,
|
|
15
|
+
fill: "none",
|
|
16
|
+
viewBox: "0 0 24 24",
|
|
17
|
+
stroke: "currentColor",
|
|
18
|
+
strokeWidth: 2,
|
|
19
|
+
"aria-hidden": "true"
|
|
20
|
+
},
|
|
21
|
+
/* @__PURE__ */ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" })
|
|
22
|
+
);
|
|
23
|
+
var ModalStyleContext = React.createContext({
|
|
24
|
+
scrollBehavior: "outside"
|
|
25
|
+
});
|
|
26
|
+
function Modal(props) {
|
|
27
|
+
return /* @__PURE__ */ React.createElement(DialogPrimitive.Root, { ...props });
|
|
28
|
+
}
|
|
29
|
+
var ModalTrigger = DialogPrimitive.Trigger;
|
|
30
|
+
var ModalPortal = DialogPrimitive.Portal;
|
|
31
|
+
var ModalClose = DialogPrimitive.Close;
|
|
32
|
+
var ModalOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
33
|
+
DialogPrimitive.Overlay,
|
|
34
|
+
{
|
|
35
|
+
ref,
|
|
36
|
+
className: cn(
|
|
37
|
+
"fixed inset-0 z-overlay bg-black/50",
|
|
38
|
+
"data-[state=open]:animate-modal-overlay-enter data-[state=closed]:animate-modal-overlay-exit",
|
|
39
|
+
className
|
|
40
|
+
),
|
|
41
|
+
...props
|
|
42
|
+
}
|
|
43
|
+
));
|
|
44
|
+
ModalOverlay.displayName = "ModalOverlay";
|
|
45
|
+
var modalContentVariants = cva("", {
|
|
46
|
+
variants: {
|
|
47
|
+
size: {
|
|
48
|
+
xs: "max-w-[360px]",
|
|
49
|
+
// 360px — simple confirmation
|
|
50
|
+
sm: "max-w-[480px]",
|
|
51
|
+
// 480px — standard (default)
|
|
52
|
+
md: "max-w-[600px]",
|
|
53
|
+
// 600px — standard form
|
|
54
|
+
lg: "max-w-[760px]",
|
|
55
|
+
// 760px — complex form
|
|
56
|
+
xl: "max-w-[960px]",
|
|
57
|
+
// 960px — table, dashboard
|
|
58
|
+
full: "max-w-none"
|
|
59
|
+
// full width (constrained by wrapper padding)
|
|
60
|
+
}
|
|
61
|
+
},
|
|
62
|
+
defaultVariants: {
|
|
63
|
+
size: "sm"
|
|
64
|
+
}
|
|
65
|
+
});
|
|
66
|
+
var ModalContent = React.forwardRef(({ className, children, size = "sm", scrollBehavior = "outside", showCloseButton = true, closeIcon, ...props }, ref) => {
|
|
67
|
+
const isInside = scrollBehavior === "inside";
|
|
68
|
+
const isFull = size === "full";
|
|
69
|
+
const useInsideScroll = isInside || isFull;
|
|
70
|
+
const closeButton = showCloseButton && /* @__PURE__ */ React.createElement(DialogPrimitive.Close, { className: cn(
|
|
71
|
+
"absolute right-4 top-4 rounded-md p-1",
|
|
72
|
+
"text-text-muted hover:text-foreground",
|
|
73
|
+
"transition-colors duration-fast",
|
|
74
|
+
"focus-visible:focus-ring focus-visible:outline-none",
|
|
75
|
+
"disabled:pointer-events-none"
|
|
76
|
+
) }, closeIcon || /* @__PURE__ */ React.createElement(DefaultCloseIcon, { className: "icon-sm" }), /* @__PURE__ */ React.createElement("span", { className: "sr-only" }, "Close"));
|
|
77
|
+
if (!useInsideScroll) {
|
|
78
|
+
return /* @__PURE__ */ React.createElement(ModalPortal, null, /* @__PURE__ */ React.createElement(ModalOverlay, null), /* @__PURE__ */ React.createElement(ModalStyleContext.Provider, { value: { scrollBehavior: "outside" } }, /* @__PURE__ */ React.createElement(
|
|
79
|
+
DialogPrimitive.Content,
|
|
80
|
+
{
|
|
81
|
+
ref,
|
|
82
|
+
className: cn(
|
|
83
|
+
"fixed inset-0 z-modal overflow-y-auto",
|
|
84
|
+
"focus:outline-none",
|
|
85
|
+
"data-[state=open]:animate-modal-content-enter data-[state=closed]:animate-modal-content-exit"
|
|
86
|
+
),
|
|
87
|
+
...props
|
|
88
|
+
},
|
|
89
|
+
/* @__PURE__ */ React.createElement(DialogPrimitive.Close, { asChild: true }, /* @__PURE__ */ React.createElement("div", { className: "flex min-h-full items-center justify-center p-4" }, /* @__PURE__ */ React.createElement(
|
|
90
|
+
"div",
|
|
91
|
+
{
|
|
92
|
+
className: cn(
|
|
93
|
+
"relative w-full rounded-xl bg-background text-foreground shadow-xl overflow-hidden",
|
|
94
|
+
modalContentVariants({ size }),
|
|
95
|
+
className
|
|
96
|
+
),
|
|
97
|
+
onClick: (e) => e.stopPropagation()
|
|
98
|
+
},
|
|
99
|
+
children,
|
|
100
|
+
closeButton
|
|
101
|
+
)))
|
|
102
|
+
)));
|
|
103
|
+
}
|
|
104
|
+
return /* @__PURE__ */ React.createElement(ModalPortal, null, /* @__PURE__ */ React.createElement(ModalOverlay, null), /* @__PURE__ */ React.createElement(ModalStyleContext.Provider, { value: { scrollBehavior: "inside" } }, /* @__PURE__ */ React.createElement("div", { className: "fixed inset-0 z-modal flex items-center justify-center p-4" }, /* @__PURE__ */ React.createElement(
|
|
105
|
+
DialogPrimitive.Content,
|
|
106
|
+
{
|
|
107
|
+
ref,
|
|
108
|
+
className: cn(
|
|
109
|
+
"relative w-full rounded-xl bg-background text-foreground shadow-xl overflow-hidden",
|
|
110
|
+
"focus:outline-none",
|
|
111
|
+
"data-[state=open]:animate-modal-content-enter data-[state=closed]:animate-modal-content-exit",
|
|
112
|
+
modalContentVariants({ size }),
|
|
113
|
+
isInside && "flex flex-col max-h-[85vh]",
|
|
114
|
+
isFull && "flex flex-col h-full",
|
|
115
|
+
className
|
|
116
|
+
),
|
|
117
|
+
...props
|
|
118
|
+
},
|
|
119
|
+
children,
|
|
120
|
+
closeButton
|
|
121
|
+
))));
|
|
122
|
+
});
|
|
123
|
+
ModalContent.displayName = "ModalContent";
|
|
124
|
+
var ModalHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
125
|
+
"div",
|
|
126
|
+
{
|
|
127
|
+
ref,
|
|
128
|
+
className: cn("flex flex-col gap-1.5 p-6 pb-0", className),
|
|
129
|
+
...props
|
|
130
|
+
}
|
|
131
|
+
));
|
|
132
|
+
ModalHeader.displayName = "ModalHeader";
|
|
133
|
+
var ModalTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
134
|
+
DialogPrimitive.Title,
|
|
135
|
+
{
|
|
136
|
+
ref,
|
|
137
|
+
className: cn("text-lg font-semibold text-foreground", className),
|
|
138
|
+
...props
|
|
139
|
+
}
|
|
140
|
+
));
|
|
141
|
+
ModalTitle.displayName = "ModalTitle";
|
|
142
|
+
var ModalDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
143
|
+
DialogPrimitive.Description,
|
|
144
|
+
{
|
|
145
|
+
ref,
|
|
146
|
+
className: cn("text-md text-text-muted", className),
|
|
147
|
+
...props
|
|
148
|
+
}
|
|
149
|
+
));
|
|
150
|
+
ModalDescription.displayName = "ModalDescription";
|
|
151
|
+
var ModalBody = React.forwardRef(({ className, ...props }, ref) => {
|
|
152
|
+
const { scrollBehavior } = React.useContext(ModalStyleContext);
|
|
153
|
+
return /* @__PURE__ */ React.createElement(
|
|
154
|
+
"div",
|
|
155
|
+
{
|
|
156
|
+
ref,
|
|
157
|
+
className: cn(
|
|
158
|
+
"p-6",
|
|
159
|
+
scrollBehavior === "inside" && "flex-1 overflow-y-auto",
|
|
160
|
+
className
|
|
161
|
+
),
|
|
162
|
+
...props
|
|
163
|
+
}
|
|
164
|
+
);
|
|
165
|
+
});
|
|
166
|
+
ModalBody.displayName = "ModalBody";
|
|
167
|
+
var ModalFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
168
|
+
"div",
|
|
169
|
+
{
|
|
170
|
+
ref,
|
|
171
|
+
className: cn(
|
|
172
|
+
"flex items-center justify-end gap-3 p-6 pt-0",
|
|
173
|
+
className
|
|
174
|
+
),
|
|
175
|
+
...props
|
|
176
|
+
}
|
|
177
|
+
));
|
|
178
|
+
ModalFooter.displayName = "ModalFooter";
|
|
179
|
+
var AlertModal = AlertDialogPrimitive.Root;
|
|
180
|
+
var AlertModalTrigger = AlertDialogPrimitive.Trigger;
|
|
181
|
+
var AlertModalPortal = AlertDialogPrimitive.Portal;
|
|
182
|
+
var AlertModalOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
183
|
+
AlertDialogPrimitive.Overlay,
|
|
184
|
+
{
|
|
185
|
+
ref,
|
|
186
|
+
className: cn(
|
|
187
|
+
"fixed inset-0 z-overlay bg-black/50",
|
|
188
|
+
"data-[state=open]:animate-modal-overlay-enter data-[state=closed]:animate-modal-overlay-exit",
|
|
189
|
+
className
|
|
190
|
+
),
|
|
191
|
+
...props
|
|
192
|
+
}
|
|
193
|
+
));
|
|
194
|
+
AlertModalOverlay.displayName = "AlertModalOverlay";
|
|
195
|
+
var alertModalContentVariants = cva("", {
|
|
196
|
+
variants: {
|
|
197
|
+
size: {
|
|
198
|
+
xs: "max-w-[360px]",
|
|
199
|
+
// 360px
|
|
200
|
+
sm: "max-w-[480px]"
|
|
201
|
+
// 480px (default)
|
|
202
|
+
}
|
|
203
|
+
},
|
|
204
|
+
defaultVariants: {
|
|
205
|
+
size: "sm"
|
|
206
|
+
}
|
|
207
|
+
});
|
|
208
|
+
var AlertModalContent = React.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ React.createElement(AlertModalPortal, null, /* @__PURE__ */ React.createElement(AlertModalOverlay, null), /* @__PURE__ */ React.createElement("div", { className: "fixed inset-0 z-modal flex items-center justify-center p-4" }, /* @__PURE__ */ React.createElement(
|
|
209
|
+
AlertDialogPrimitive.Content,
|
|
210
|
+
{
|
|
211
|
+
ref,
|
|
212
|
+
className: cn(
|
|
213
|
+
"relative w-full rounded-xl bg-background text-foreground shadow-xl",
|
|
214
|
+
"focus:outline-none",
|
|
215
|
+
"data-[state=open]:animate-modal-content-enter data-[state=closed]:animate-modal-content-exit",
|
|
216
|
+
alertModalContentVariants({ size }),
|
|
217
|
+
className
|
|
218
|
+
),
|
|
219
|
+
...props
|
|
220
|
+
},
|
|
221
|
+
children
|
|
222
|
+
))));
|
|
223
|
+
AlertModalContent.displayName = "AlertModalContent";
|
|
224
|
+
var AlertModalHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
225
|
+
"div",
|
|
226
|
+
{
|
|
227
|
+
ref,
|
|
228
|
+
className: cn("flex flex-col gap-1.5 p-6 pb-0", className),
|
|
229
|
+
...props
|
|
230
|
+
}
|
|
231
|
+
));
|
|
232
|
+
AlertModalHeader.displayName = "AlertModalHeader";
|
|
233
|
+
var AlertModalTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
234
|
+
AlertDialogPrimitive.Title,
|
|
235
|
+
{
|
|
236
|
+
ref,
|
|
237
|
+
className: cn("text-lg font-semibold text-foreground", className),
|
|
238
|
+
...props
|
|
239
|
+
}
|
|
240
|
+
));
|
|
241
|
+
AlertModalTitle.displayName = "AlertModalTitle";
|
|
242
|
+
var AlertModalDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
243
|
+
AlertDialogPrimitive.Description,
|
|
244
|
+
{
|
|
245
|
+
ref,
|
|
246
|
+
className: cn("text-md text-text-muted", className),
|
|
247
|
+
...props
|
|
248
|
+
}
|
|
249
|
+
));
|
|
250
|
+
AlertModalDescription.displayName = "AlertModalDescription";
|
|
251
|
+
var AlertModalBody = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
252
|
+
"div",
|
|
253
|
+
{
|
|
254
|
+
ref,
|
|
255
|
+
className: cn("p-6", className),
|
|
256
|
+
...props
|
|
257
|
+
}
|
|
258
|
+
));
|
|
259
|
+
AlertModalBody.displayName = "AlertModalBody";
|
|
260
|
+
var AlertModalFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
261
|
+
"div",
|
|
262
|
+
{
|
|
263
|
+
ref,
|
|
264
|
+
className: cn(
|
|
265
|
+
"flex items-center justify-end gap-3 p-6 pt-0",
|
|
266
|
+
className
|
|
267
|
+
),
|
|
268
|
+
...props
|
|
269
|
+
}
|
|
270
|
+
));
|
|
271
|
+
AlertModalFooter.displayName = "AlertModalFooter";
|
|
272
|
+
var AlertModalAction = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
273
|
+
AlertDialogPrimitive.Action,
|
|
274
|
+
{
|
|
275
|
+
ref,
|
|
276
|
+
className,
|
|
277
|
+
...props
|
|
278
|
+
}
|
|
279
|
+
));
|
|
280
|
+
AlertModalAction.displayName = "AlertModalAction";
|
|
281
|
+
var AlertModalCancel = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
|
|
282
|
+
AlertDialogPrimitive.Cancel,
|
|
283
|
+
{
|
|
284
|
+
ref,
|
|
285
|
+
className,
|
|
286
|
+
...props
|
|
287
|
+
}
|
|
288
|
+
));
|
|
289
|
+
AlertModalCancel.displayName = "AlertModalCancel";
|
|
290
|
+
|
|
291
|
+
export {
|
|
292
|
+
Modal,
|
|
293
|
+
ModalTrigger,
|
|
294
|
+
ModalPortal,
|
|
295
|
+
ModalClose,
|
|
296
|
+
ModalOverlay,
|
|
297
|
+
modalContentVariants,
|
|
298
|
+
ModalContent,
|
|
299
|
+
ModalHeader,
|
|
300
|
+
ModalTitle,
|
|
301
|
+
ModalDescription,
|
|
302
|
+
ModalBody,
|
|
303
|
+
ModalFooter,
|
|
304
|
+
AlertModal,
|
|
305
|
+
AlertModalTrigger,
|
|
306
|
+
AlertModalPortal,
|
|
307
|
+
AlertModalOverlay,
|
|
308
|
+
alertModalContentVariants,
|
|
309
|
+
AlertModalContent,
|
|
310
|
+
AlertModalHeader,
|
|
311
|
+
AlertModalTitle,
|
|
312
|
+
AlertModalDescription,
|
|
313
|
+
AlertModalBody,
|
|
314
|
+
AlertModalFooter,
|
|
315
|
+
AlertModalAction,
|
|
316
|
+
AlertModalCancel
|
|
317
|
+
};
|
|
318
|
+
//# sourceMappingURL=chunk-LJJ6K4IU.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/ui/modal.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\nimport * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ─── Default Close Icon (built-in, no external dependency) ──\nconst DefaultCloseIcon = ({ className }: { className?: string }) => (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n aria-hidden=\"true\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n)\n\n// ─── Style Context ──────────────────────────────────────────\ntype ModalStyleContextValue = {\n scrollBehavior: 'inside' | 'outside'\n}\nconst ModalStyleContext = React.createContext<ModalStyleContextValue>({\n scrollBehavior: 'outside',\n})\n\n// ═══════════════════════════════════════════════════════════════\n// Modal (Dialog)\n// ═══════════════════════════════════════════════════════════════\n\n// ─── Modal (Root) — thin wrapper to expose as named export without mutating DialogPrimitive.Root ──\nfunction Modal(props: React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>) {\n return <DialogPrimitive.Root {...props} />\n}\n\n// ─── ModalTrigger ───────────────────────────────────────────\nconst ModalTrigger = DialogPrimitive.Trigger\n\n// ─── ModalPortal ────────────────────────────────────────────\nconst ModalPortal = DialogPrimitive.Portal\n\n// ─── ModalClose ─────────────────────────────────────────────\nconst ModalClose = DialogPrimitive.Close\n\n// ─── ModalOverlay ───────────────────────────────────────────\nconst ModalOverlay = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Overlay\n ref={ref}\n className={cn(\n 'fixed inset-0 z-overlay bg-black/50',\n 'data-[state=open]:animate-modal-overlay-enter data-[state=closed]:animate-modal-overlay-exit',\n className\n )}\n {...props}\n />\n))\nModalOverlay.displayName = 'ModalOverlay'\n\n// ─── ModalContent ───────────────────────────────────────────\nconst modalContentVariants = cva('', {\n variants: {\n size: {\n xs: 'max-w-[360px]', // 360px — simple confirmation\n sm: 'max-w-[480px]', // 480px — standard (default)\n md: 'max-w-[600px]', // 600px — standard form\n lg: 'max-w-[760px]', // 760px — complex form\n xl: 'max-w-[960px]', // 960px — table, dashboard\n full: 'max-w-none', // full width (constrained by wrapper padding)\n },\n },\n defaultVariants: {\n size: 'sm',\n },\n})\n\nexport interface ModalContentProps\n extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>,\n VariantProps<typeof modalContentVariants> {\n /** Scroll behavior when content overflows */\n scrollBehavior?: 'inside' | 'outside'\n /** Show built-in close button */\n showCloseButton?: boolean\n /** Custom close icon (replaces default X) */\n closeIcon?: React.ReactNode\n}\n\nconst ModalContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Content>,\n ModalContentProps\n>(({ className, children, size = 'sm', scrollBehavior = 'outside', showCloseButton = true, closeIcon, ...props }, ref) => {\n const isInside = scrollBehavior === 'inside'\n const isFull = size === 'full'\n const useInsideScroll = isInside || isFull\n\n const closeButton = showCloseButton && (\n <DialogPrimitive.Close className={cn(\n 'absolute right-4 top-4 rounded-md p-1',\n 'text-text-muted hover:text-foreground',\n 'transition-colors duration-fast',\n 'focus-visible:focus-ring focus-visible:outline-none',\n 'disabled:pointer-events-none'\n )}>\n {closeIcon || <DefaultCloseIcon className=\"icon-sm\" />}\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n )\n\n if (!useInsideScroll) {\n // Outside scroll: DialogPrimitive.Content becomes the full-screen scrollable container.\n // Radix's internal RemoveScroll detects its own root element as scrollable,\n // allowing wheel/touch scroll events to pass through correctly.\n return (\n <ModalPortal>\n <ModalOverlay />\n <ModalStyleContext.Provider value={{ scrollBehavior: 'outside' }}>\n <DialogPrimitive.Content\n ref={ref}\n className={cn(\n 'fixed inset-0 z-modal overflow-y-auto',\n 'focus:outline-none',\n 'data-[state=open]:animate-modal-content-enter data-[state=closed]:animate-modal-content-exit',\n )}\n {...props}\n >\n {/* Backdrop click area: closes dialog when clicking outside the panel */}\n <DialogPrimitive.Close asChild>\n <div className=\"flex min-h-full items-center justify-center p-4\">\n <div\n className={cn(\n 'relative w-full rounded-xl bg-background text-foreground shadow-xl overflow-hidden',\n modalContentVariants({ size }),\n className,\n )}\n onClick={(e) => e.stopPropagation()}\n >\n {children}\n {closeButton}\n </div>\n </div>\n </DialogPrimitive.Close>\n </DialogPrimitive.Content>\n </ModalStyleContext.Provider>\n </ModalPortal>\n )\n }\n\n // Inside scroll / full: DialogPrimitive.Content is the visual modal panel.\n return (\n <ModalPortal>\n <ModalOverlay />\n <ModalStyleContext.Provider value={{ scrollBehavior: 'inside' }}>\n <div className=\"fixed inset-0 z-modal flex items-center justify-center p-4\">\n <DialogPrimitive.Content\n ref={ref}\n className={cn(\n 'relative w-full rounded-xl bg-background text-foreground shadow-xl overflow-hidden',\n 'focus:outline-none',\n 'data-[state=open]:animate-modal-content-enter data-[state=closed]:animate-modal-content-exit',\n modalContentVariants({ size }),\n isInside && 'flex flex-col max-h-[85vh]',\n isFull && 'flex flex-col h-full',\n className,\n )}\n {...props}\n >\n {children}\n {closeButton}\n </DialogPrimitive.Content>\n </div>\n </ModalStyleContext.Provider>\n </ModalPortal>\n )\n})\nModalContent.displayName = 'ModalContent'\n\n// ─── ModalHeader ────────────────────────────────────────────\nconst ModalHeader = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn('flex flex-col gap-1.5 p-6 pb-0', className)}\n {...props}\n />\n))\nModalHeader.displayName = 'ModalHeader'\n\n// ─── ModalTitle ─────────────────────────────────────────────\nconst ModalTitle = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Title\n ref={ref}\n className={cn('text-lg font-semibold text-foreground', className)}\n {...props}\n />\n))\nModalTitle.displayName = 'ModalTitle'\n\n// ─── ModalDescription ───────────────────────────────────────\nconst ModalDescription = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Description\n ref={ref}\n className={cn('text-md text-text-muted', className)}\n {...props}\n />\n))\nModalDescription.displayName = 'ModalDescription'\n\n// ─── ModalBody ──────────────────────────────────────────────\nconst ModalBody = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n const { scrollBehavior } = React.useContext(ModalStyleContext)\n return (\n <div\n ref={ref}\n className={cn(\n 'p-6',\n scrollBehavior === 'inside' && 'flex-1 overflow-y-auto',\n className\n )}\n {...props}\n />\n )\n})\nModalBody.displayName = 'ModalBody'\n\n// ─── ModalFooter ────────────────────────────────────────────\nconst ModalFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n 'flex items-center justify-end gap-3 p-6 pt-0',\n className\n )}\n {...props}\n />\n))\nModalFooter.displayName = 'ModalFooter'\n\n// ═══════════════════════════════════════════════════════════════\n// AlertModal (AlertDialog)\n// ═══════════════════════════════════════════════════════════════\n\n// ─── AlertModal (Root) ──────────────────────────────────────\nconst AlertModal = AlertDialogPrimitive.Root\n\n// ─── AlertModalTrigger ──────────────────────────────────────\nconst AlertModalTrigger = AlertDialogPrimitive.Trigger\n\n// ─── AlertModalPortal ───────────────────────────────────────\nconst AlertModalPortal = AlertDialogPrimitive.Portal\n\n// ─── AlertModalOverlay ──────────────────────────────────────\nconst AlertModalOverlay = React.forwardRef<\n React.ElementRef<typeof AlertDialogPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <AlertDialogPrimitive.Overlay\n ref={ref}\n className={cn(\n 'fixed inset-0 z-overlay bg-black/50',\n 'data-[state=open]:animate-modal-overlay-enter data-[state=closed]:animate-modal-overlay-exit',\n className\n )}\n {...props}\n />\n))\nAlertModalOverlay.displayName = 'AlertModalOverlay'\n\n// ─── AlertModalContent ──────────────────────────────────────\nconst alertModalContentVariants = cva('', {\n variants: {\n size: {\n xs: 'max-w-[360px]', // 360px\n sm: 'max-w-[480px]', // 480px (default)\n },\n },\n defaultVariants: {\n size: 'sm',\n },\n})\n\nexport interface AlertModalContentProps\n extends React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content>,\n VariantProps<typeof alertModalContentVariants> {}\n\nconst AlertModalContent = React.forwardRef<\n React.ElementRef<typeof AlertDialogPrimitive.Content>,\n AlertModalContentProps\n>(({ className, children, size = 'sm', ...props }, ref) => (\n <AlertModalPortal>\n <AlertModalOverlay />\n <div className=\"fixed inset-0 z-modal flex items-center justify-center p-4\">\n <AlertDialogPrimitive.Content\n ref={ref}\n className={cn(\n 'relative w-full rounded-xl bg-background text-foreground shadow-xl',\n 'focus:outline-none',\n 'data-[state=open]:animate-modal-content-enter data-[state=closed]:animate-modal-content-exit',\n alertModalContentVariants({ size }),\n className\n )}\n {...props}\n >\n {children}\n </AlertDialogPrimitive.Content>\n </div>\n </AlertModalPortal>\n))\nAlertModalContent.displayName = 'AlertModalContent'\n\n// ─── AlertModalHeader ───────────────────────────────────────\nconst AlertModalHeader = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn('flex flex-col gap-1.5 p-6 pb-0', className)}\n {...props}\n />\n))\nAlertModalHeader.displayName = 'AlertModalHeader'\n\n// ─── AlertModalTitle ────────────────────────────────────────\nconst AlertModalTitle = React.forwardRef<\n React.ElementRef<typeof AlertDialogPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <AlertDialogPrimitive.Title\n ref={ref}\n className={cn('text-lg font-semibold text-foreground', className)}\n {...props}\n />\n))\nAlertModalTitle.displayName = 'AlertModalTitle'\n\n// ─── AlertModalDescription ──────────────────────────────────\nconst AlertModalDescription = React.forwardRef<\n React.ElementRef<typeof AlertDialogPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <AlertDialogPrimitive.Description\n ref={ref}\n className={cn('text-md text-text-muted', className)}\n {...props}\n />\n))\nAlertModalDescription.displayName = 'AlertModalDescription'\n\n// ─── AlertModalBody ─────────────────────────────────────────\nconst AlertModalBody = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn('p-6', className)}\n {...props}\n />\n))\nAlertModalBody.displayName = 'AlertModalBody'\n\n// ─── AlertModalFooter ───────────────────────────────────────\nconst AlertModalFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n 'flex items-center justify-end gap-3 p-6 pt-0',\n className\n )}\n {...props}\n />\n))\nAlertModalFooter.displayName = 'AlertModalFooter'\n\n// ─── AlertModalAction ───────────────────────────────────────\nconst AlertModalAction = React.forwardRef<\n React.ElementRef<typeof AlertDialogPrimitive.Action>,\n React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action>\n>(({ className, ...props }, ref) => (\n <AlertDialogPrimitive.Action\n ref={ref}\n className={className}\n {...props}\n />\n))\nAlertModalAction.displayName = 'AlertModalAction'\n\n// ─── AlertModalCancel ───────────────────────────────────────\nconst AlertModalCancel = React.forwardRef<\n React.ElementRef<typeof AlertDialogPrimitive.Cancel>,\n React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel>\n>(({ className, ...props }, ref) => (\n <AlertDialogPrimitive.Cancel\n ref={ref}\n className={className}\n {...props}\n />\n))\nAlertModalCancel.displayName = 'AlertModalCancel'\n\n// ─── Exports ────────────────────────────────────────────────\nexport {\n Modal,\n ModalTrigger,\n ModalPortal,\n ModalOverlay,\n ModalContent,\n ModalHeader,\n ModalTitle,\n ModalDescription,\n ModalBody,\n ModalFooter,\n ModalClose,\n modalContentVariants,\n AlertModal,\n AlertModalTrigger,\n AlertModalPortal,\n AlertModalOverlay,\n AlertModalContent,\n AlertModalHeader,\n AlertModalTitle,\n AlertModalDescription,\n AlertModalBody,\n AlertModalFooter,\n AlertModalAction,\n AlertModalCancel,\n alertModalContentVariants,\n}\n"],"mappings":"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","names":[]}
|