@lglab/compose-ui 0.28.0 → 0.29.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/accordion.d.ts +49 -40
- package/dist/accordion.d.ts.map +1 -0
- package/dist/accordion.js +47 -45
- package/dist/accordion.js.map +1 -0
- package/dist/alert-dialog.d.ts +93 -87
- package/dist/alert-dialog.d.ts.map +1 -0
- package/dist/alert-dialog.js +94 -111
- package/dist/alert-dialog.js.map +1 -0
- package/dist/autocomplete.d.ts +99 -96
- package/dist/autocomplete.d.ts.map +1 -0
- package/dist/autocomplete.js +92 -116
- package/dist/autocomplete.js.map +1 -0
- package/dist/avatar.d.ts +56 -47
- package/dist/avatar.d.ts.map +1 -0
- package/dist/avatar.js +66 -79
- package/dist/avatar.js.map +1 -0
- package/dist/badge.d.ts +48 -42
- package/dist/badge.d.ts.map +1 -0
- package/dist/badge.js +195 -202
- package/dist/badge.js.map +1 -0
- package/dist/button.d.ts +26 -21
- package/dist/button.d.ts.map +1 -0
- package/dist/button.js +24 -24
- package/dist/button.js.map +1 -0
- package/dist/card.d.ts +105 -99
- package/dist/card.d.ts.map +1 -0
- package/dist/card.js +105 -66
- package/dist/card.js.map +1 -0
- package/dist/checkbox-group.d.ts +16 -12
- package/dist/checkbox-group.d.ts.map +1 -0
- package/dist/checkbox-group.js +18 -14
- package/dist/checkbox-group.js.map +1 -0
- package/dist/checkbox.d.ts +25 -19
- package/dist/checkbox.d.ts.map +1 -0
- package/dist/checkbox.js +26 -32
- package/dist/checkbox.js.map +1 -0
- package/dist/collapsible.d.ts +32 -26
- package/dist/collapsible.d.ts.map +1 -0
- package/dist/collapsible.js +32 -32
- package/dist/collapsible.js.map +1 -0
- package/dist/combobox.d.ts +191 -182
- package/dist/combobox.d.ts.map +1 -0
- package/dist/combobox.js +176 -250
- package/dist/combobox.js.map +1 -0
- package/dist/context-menu.d.ts +151 -138
- package/dist/context-menu.d.ts.map +1 -0
- package/dist/context-menu.js +151 -173
- package/dist/context-menu.js.map +1 -0
- package/dist/dialog.d.ts +101 -92
- package/dist/dialog.d.ts.map +1 -0
- package/dist/dialog.js +101 -105
- package/dist/dialog.js.map +1 -0
- package/dist/drawer.d.ts +109 -99
- package/dist/drawer.d.ts.map +1 -0
- package/dist/drawer.js +120 -111
- package/dist/drawer.js.map +1 -0
- package/dist/field.d.ts +61 -54
- package/dist/field.d.ts.map +1 -0
- package/dist/field.js +58 -27
- package/dist/field.js.map +1 -0
- package/dist/fieldset.d.ts +24 -19
- package/dist/fieldset.d.ts.map +1 -0
- package/dist/fieldset.js +26 -18
- package/dist/fieldset.js.map +1 -0
- package/dist/form.d.ts +16 -12
- package/dist/form.d.ts.map +1 -0
- package/dist/form.js +18 -8
- package/dist/form.js.map +1 -0
- package/dist/index.d.ts +44 -2115
- package/dist/index.js +44 -318
- package/dist/input.d.ts +16 -12
- package/dist/input.d.ts.map +1 -0
- package/dist/input.js +19 -9
- package/dist/input.js.map +1 -0
- package/dist/lib/arrow-svg.js +28 -0
- package/dist/lib/arrow-svg.js.map +1 -0
- package/dist/lib/button-variants.d.ts +6 -0
- package/dist/lib/button-variants.d.ts.map +1 -0
- package/dist/lib/button-variants.js +31 -0
- package/dist/lib/button-variants.js.map +1 -0
- package/dist/lib/control-variants.d.ts +6 -0
- package/dist/lib/control-variants.d.ts.map +1 -0
- package/dist/lib/control-variants.js +37 -0
- package/dist/lib/control-variants.js.map +1 -0
- package/dist/lib/form-variants.js +11 -0
- package/dist/lib/form-variants.js.map +1 -0
- package/dist/lib/tooltip-variants.d.ts +5 -0
- package/dist/lib/tooltip-variants.d.ts.map +1 -0
- package/dist/lib/tooltip-variants.js +36 -0
- package/dist/lib/tooltip-variants.js.map +1 -0
- package/dist/lib/utils.js +11 -0
- package/dist/lib/utils.js.map +1 -0
- package/dist/menu.d.ts +151 -138
- package/dist/menu.d.ts.map +1 -0
- package/dist/menu.js +151 -146
- package/dist/menu.js.map +1 -0
- package/dist/menubar.d.ts +168 -155
- package/dist/menubar.d.ts.map +1 -0
- package/dist/menubar.js +163 -169
- package/dist/menubar.js.map +1 -0
- package/dist/meter.d.ts +53 -43
- package/dist/meter.d.ts.map +1 -0
- package/dist/meter.js +59 -64
- package/dist/meter.js.map +1 -0
- package/dist/navigation-menu.d.ts +111 -96
- package/dist/navigation-menu.d.ts.map +1 -0
- package/dist/navigation-menu.js +117 -175
- package/dist/navigation-menu.js.map +1 -0
- package/dist/number-field.d.ts +64 -54
- package/dist/number-field.d.ts.map +1 -0
- package/dist/number-field.js +61 -69
- package/dist/number-field.js.map +1 -0
- package/dist/popover.d.ts +90 -82
- package/dist/popover.d.ts.map +1 -0
- package/dist/popover.js +85 -94
- package/dist/popover.js.map +1 -0
- package/dist/preview-card.d.ts +58 -54
- package/dist/preview-card.d.ts.map +1 -0
- package/dist/preview-card.js +57 -81
- package/dist/preview-card.js.map +1 -0
- package/dist/progress.d.ts +48 -40
- package/dist/progress.d.ts.map +1 -0
- package/dist/progress.js +46 -50
- package/dist/progress.js.map +1 -0
- package/dist/radio-group.d.ts +16 -12
- package/dist/radio-group.d.ts.map +1 -0
- package/dist/radio-group.js +18 -14
- package/dist/radio-group.js.map +1 -0
- package/dist/radio.d.ts +24 -19
- package/dist/radio.d.ts.map +1 -0
- package/dist/radio.js +25 -34
- package/dist/radio.js.map +1 -0
- package/dist/scroll-area.d.ts +57 -47
- package/dist/scroll-area.d.ts.map +1 -0
- package/dist/scroll-area.js +54 -56
- package/dist/scroll-area.js.map +1 -0
- package/dist/select.d.ts +146 -133
- package/dist/select.d.ts.map +1 -0
- package/dist/select.js +133 -167
- package/dist/select.js.map +1 -0
- package/dist/separator.d.ts +17 -12
- package/dist/separator.d.ts.map +1 -0
- package/dist/separator.js +19 -23
- package/dist/separator.js.map +1 -0
- package/dist/skeleton.d.ts +20 -0
- package/dist/skeleton.d.ts.map +1 -0
- package/dist/skeleton.js +27 -0
- package/dist/skeleton.js.map +1 -0
- package/dist/slider.d.ts +56 -47
- package/dist/slider.d.ts.map +1 -0
- package/dist/slider.js +53 -62
- package/dist/slider.js.map +1 -0
- package/dist/styles/default.css +14 -0
- package/dist/switch.d.ts +24 -19
- package/dist/switch.d.ts.map +1 -0
- package/dist/switch.js +23 -39
- package/dist/switch.js.map +1 -0
- package/dist/tabs.d.ts +60 -49
- package/dist/tabs.d.ts.map +1 -0
- package/dist/tabs.js +76 -84
- package/dist/tabs.js.map +1 -0
- package/dist/textarea.d.ts +15 -11
- package/dist/textarea.d.ts.map +1 -0
- package/dist/textarea.js +18 -14
- package/dist/textarea.js.map +1 -0
- package/dist/toast.d.ts +87 -81
- package/dist/toast.d.ts.map +1 -0
- package/dist/toast.js +79 -150
- package/dist/toast.js.map +1 -0
- package/dist/toggle-group.d.ts +34 -29
- package/dist/toggle-group.d.ts.map +1 -0
- package/dist/toggle-group.js +31 -34
- package/dist/toggle-group.js.map +1 -0
- package/dist/toggle.d.ts +24 -21
- package/dist/toggle.d.ts.map +1 -0
- package/dist/toggle.js +22 -15
- package/dist/toggle.js.map +1 -0
- package/dist/toolbar.d.ts +64 -56
- package/dist/toolbar.d.ts.map +1 -0
- package/dist/toolbar.js +57 -68
- package/dist/toolbar.js.map +1 -0
- package/dist/tooltip.d.ts +67 -62
- package/dist/tooltip.d.ts.map +1 -0
- package/dist/tooltip.js +65 -90
- package/dist/tooltip.js.map +1 -0
- package/package.json +8 -8
- package/dist/arrow-svg-C6zQTvgS.js +0 -40
- package/dist/button-variants-CbFMPwc8.js +0 -33
- package/dist/control-variants-Bwep4n0y.js +0 -37
- package/dist/form-variants-LJ8gIbk0.js +0 -9
- package/dist/utils-B6yFEsav.js +0 -8
package/dist/accordion.d.ts
CHANGED
|
@@ -1,40 +1,49 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import * as react_jsx_runtime271 from "react/jsx-runtime";
|
|
3
|
+
import { Accordion } from "@base-ui/react/accordion";
|
|
4
|
+
|
|
5
|
+
//#region src/components/accordion.d.ts
|
|
6
|
+
type AccordionRootProps = React.ComponentProps<typeof Accordion.Root>;
|
|
7
|
+
declare const AccordionRoot: {
|
|
8
|
+
({
|
|
9
|
+
className,
|
|
10
|
+
...props
|
|
11
|
+
}: AccordionRootProps): react_jsx_runtime271.JSX.Element;
|
|
12
|
+
displayName: string;
|
|
13
|
+
};
|
|
14
|
+
type AccordionItemProps = React.ComponentProps<typeof Accordion.Item>;
|
|
15
|
+
declare const AccordionItem: {
|
|
16
|
+
({
|
|
17
|
+
className,
|
|
18
|
+
...props
|
|
19
|
+
}: AccordionItemProps): react_jsx_runtime271.JSX.Element;
|
|
20
|
+
displayName: string;
|
|
21
|
+
};
|
|
22
|
+
type AccordionHeaderProps = React.ComponentProps<typeof Accordion.Header>;
|
|
23
|
+
declare const AccordionHeader: {
|
|
24
|
+
({
|
|
25
|
+
className,
|
|
26
|
+
...props
|
|
27
|
+
}: AccordionHeaderProps): react_jsx_runtime271.JSX.Element;
|
|
28
|
+
displayName: string;
|
|
29
|
+
};
|
|
30
|
+
type AccordionTriggerProps = React.ComponentProps<typeof Accordion.Trigger>;
|
|
31
|
+
declare const AccordionTrigger: {
|
|
32
|
+
({
|
|
33
|
+
className,
|
|
34
|
+
children,
|
|
35
|
+
...props
|
|
36
|
+
}: AccordionTriggerProps): react_jsx_runtime271.JSX.Element;
|
|
37
|
+
displayName: string;
|
|
38
|
+
};
|
|
39
|
+
type AccordionPanelProps = React.ComponentProps<typeof Accordion.Panel>;
|
|
40
|
+
declare const AccordionPanel: {
|
|
41
|
+
({
|
|
42
|
+
className,
|
|
43
|
+
...props
|
|
44
|
+
}: AccordionPanelProps): react_jsx_runtime271.JSX.Element;
|
|
45
|
+
displayName: string;
|
|
46
|
+
};
|
|
47
|
+
//#endregion
|
|
48
|
+
export { AccordionHeader, type AccordionHeaderProps, AccordionItem, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, AccordionRoot, type AccordionRootProps, AccordionTrigger, type AccordionTriggerProps };
|
|
49
|
+
//# sourceMappingURL=accordion.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.d.ts","names":[],"sources":["../src/components/accordion.tsx"],"sourcesContent":[],"mappings":";;;;;KAWK,kBAAA,GAAqB,KAAA,CAAM,sBAAsB,SAAA,CAAc;cAE9D;;;;KAA0C,qBAAkB,oBAAA,CAAA,GAAA,CAAA;EAF7D,WAAA,EAAA,MAAA;CAAkB;KAYlB,kBAAA,GAAqB,KAAA,CAAM,cAZoC,CAAA,OAYd,SAAA,CAAc,IAZA,CAAA;cAc9D,aAd0B,EAAA;EAAc,CAAA;IAAA,SAAA;IAAA,GAAA;EAAA,CAAA,EAcE,kBAdF,CAAA,EAcoB,oBAAA,CAAA,GAAA,CAAA,OAdpB;EAExC,WAAA,EAAA,MAEL;CAAA;KAyBI,oBAAA,GAAuB,KAAA,CAAM,sBAAsB,SAAA,CAAc;cAEhE,eA7B0C,EAAA;;IAAkB,SAAA;IAAA,GAAA;EAAA,CAAA,EA6BhB,oBA7BgB,CAAA,EA6BI,oBAAA,CAAA,GAAA,CAAA,OA7BJ;EAAA,WAAA,EAAA,MAAA;AAAA,CAAA;KAuC7D,qBAAA,GAAwB,KAAA,CAAM,cA7BZ,CAAA,OA6BkC,SAAA,CAAc,OA7BhD,CAAA;cA+BjB,gBA/B8D,EAAA;;IAA1C,SAAM;IAAA,QAAA;IAAA,GAAA;EAAA,CAAA,EA+B6B,qBA/B7B,CAAA,EA+BkD,oBAAA,CAAA,GAAA,CAAA,OA/BlD;EAAc,WAAA,EAAA,MAAA;AAAA,CAAA;KAmDzC,mBAAA,GAAsB,KAAA,CAAM,cA1ChC,CAAA,OA0CsD,SAAA,CAAc,KA1CpE,CAAA;cA4CK;;IAnD0C,SAAA;IAAA,GAAA;EAAA,CAAA,EAmDC,mBAnDD,CAAA,EAmDoB,oBAAA,CAAA,GAAA,CAAA,OAnDpB;aAAkB,EAAA,MAAA;CAAA"}
|
package/dist/accordion.js
CHANGED
|
@@ -1,46 +1,48 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
);
|
|
14
|
-
i.displayName = "AccordionItem";
|
|
15
|
-
const d = ({ className: e, ...o }) => /* @__PURE__ */ r(t.Header, { className: a("flex", e), ...o });
|
|
16
|
-
d.displayName = "AccordionHeader";
|
|
17
|
-
const s = ({ className: e, children: o, ...c }) => /* @__PURE__ */ r(
|
|
18
|
-
t.Trigger,
|
|
19
|
-
{
|
|
20
|
-
className: a(
|
|
21
|
-
"flex flex-1 items-center justify-between py-3 font-medium",
|
|
22
|
-
e
|
|
23
|
-
),
|
|
24
|
-
...c,
|
|
25
|
-
children: o
|
|
26
|
-
}
|
|
27
|
-
);
|
|
28
|
-
s.displayName = "AccordionTrigger";
|
|
29
|
-
const l = ({ className: e, ...o }) => /* @__PURE__ */ r(
|
|
30
|
-
t.Panel,
|
|
31
|
-
{
|
|
32
|
-
className: a(
|
|
33
|
-
"overflow-hidden duration-200 h-(--accordion-panel-height) transition-height ease-out data-ending-style:h-0 data-starting-style:h-0",
|
|
34
|
-
e
|
|
35
|
-
),
|
|
36
|
-
...o
|
|
37
|
-
}
|
|
38
|
-
);
|
|
39
|
-
l.displayName = "AccordionPanel";
|
|
40
|
-
export {
|
|
41
|
-
d as AccordionHeader,
|
|
42
|
-
i as AccordionItem,
|
|
43
|
-
l as AccordionPanel,
|
|
44
|
-
n as AccordionRoot,
|
|
45
|
-
s as AccordionTrigger
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { cn } from "./lib/utils.js";
|
|
4
|
+
import "react";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
|
+
import { Accordion } from "@base-ui/react/accordion";
|
|
7
|
+
|
|
8
|
+
//#region src/components/accordion.tsx
|
|
9
|
+
const AccordionRoot = ({ className, ...props }) => {
|
|
10
|
+
return /* @__PURE__ */ jsx(Accordion.Root, {
|
|
11
|
+
className: cn("w-full", className),
|
|
12
|
+
...props
|
|
13
|
+
});
|
|
46
14
|
};
|
|
15
|
+
AccordionRoot.displayName = "AccordionRoot";
|
|
16
|
+
const AccordionItem = ({ className, ...props }) => {
|
|
17
|
+
return /* @__PURE__ */ jsx(Accordion.Item, {
|
|
18
|
+
className: cn("border-b border-border last:border-b-0", className),
|
|
19
|
+
...props
|
|
20
|
+
});
|
|
21
|
+
};
|
|
22
|
+
AccordionItem.displayName = "AccordionItem";
|
|
23
|
+
const AccordionHeader = ({ className, ...props }) => {
|
|
24
|
+
return /* @__PURE__ */ jsx(Accordion.Header, {
|
|
25
|
+
className: cn("flex", className),
|
|
26
|
+
...props
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
AccordionHeader.displayName = "AccordionHeader";
|
|
30
|
+
const AccordionTrigger = ({ className, children, ...props }) => {
|
|
31
|
+
return /* @__PURE__ */ jsx(Accordion.Trigger, {
|
|
32
|
+
className: cn("flex flex-1 items-center justify-between py-3 font-medium", className),
|
|
33
|
+
...props,
|
|
34
|
+
children
|
|
35
|
+
});
|
|
36
|
+
};
|
|
37
|
+
AccordionTrigger.displayName = "AccordionTrigger";
|
|
38
|
+
const AccordionPanel = ({ className, ...props }) => {
|
|
39
|
+
return /* @__PURE__ */ jsx(Accordion.Panel, {
|
|
40
|
+
className: cn("overflow-hidden duration-200 h-(--accordion-panel-height) transition-height ease-out data-ending-style:h-0 data-starting-style:h-0", className),
|
|
41
|
+
...props
|
|
42
|
+
});
|
|
43
|
+
};
|
|
44
|
+
AccordionPanel.displayName = "AccordionPanel";
|
|
45
|
+
|
|
46
|
+
//#endregion
|
|
47
|
+
export { AccordionHeader, AccordionItem, AccordionPanel, AccordionRoot, AccordionTrigger };
|
|
48
|
+
//# sourceMappingURL=accordion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.js","names":["BaseAccordion"],"sources":["../src/components/accordion.tsx"],"sourcesContent":["'use client'\n\nimport { Accordion as BaseAccordion } from '@base-ui/react/accordion'\nimport * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\n// ============================================================================\n// AccordionRoot\n// ============================================================================\n\ntype AccordionRootProps = React.ComponentProps<typeof BaseAccordion.Root>\n\nconst AccordionRoot = ({ className, ...props }: AccordionRootProps) => {\n return <BaseAccordion.Root className={cn('w-full', className)} {...props} />\n}\n\nAccordionRoot.displayName = 'AccordionRoot'\n\n// ============================================================================\n// AccordionItem\n// ============================================================================\n\ntype AccordionItemProps = React.ComponentProps<typeof BaseAccordion.Item>\n\nconst AccordionItem = ({ className, ...props }: AccordionItemProps) => {\n return (\n <BaseAccordion.Item\n className={cn('border-b border-border last:border-b-0', className)}\n {...props}\n />\n )\n}\n\nAccordionItem.displayName = 'AccordionItem'\n\n// ============================================================================\n// AccordionHeader\n// ============================================================================\n\ntype AccordionHeaderProps = React.ComponentProps<typeof BaseAccordion.Header>\n\nconst AccordionHeader = ({ className, ...props }: AccordionHeaderProps) => {\n return <BaseAccordion.Header className={cn('flex', className)} {...props} />\n}\n\nAccordionHeader.displayName = 'AccordionHeader'\n\n// ============================================================================\n// AccordionTrigger\n// ============================================================================\n\ntype AccordionTriggerProps = React.ComponentProps<typeof BaseAccordion.Trigger>\n\nconst AccordionTrigger = ({ className, children, ...props }: AccordionTriggerProps) => {\n return (\n <BaseAccordion.Trigger\n className={cn(\n 'flex flex-1 items-center justify-between py-3 font-medium',\n className,\n )}\n {...props}\n >\n {children}\n </BaseAccordion.Trigger>\n )\n}\n\nAccordionTrigger.displayName = 'AccordionTrigger'\n\n// ============================================================================\n// AccordionPanel\n// ============================================================================\n\ntype AccordionPanelProps = React.ComponentProps<typeof BaseAccordion.Panel>\n\nconst AccordionPanel = ({ className, ...props }: AccordionPanelProps) => {\n return (\n <BaseAccordion.Panel\n className={cn(\n 'overflow-hidden duration-200 h-(--accordion-panel-height) transition-height ease-out data-ending-style:h-0 data-starting-style:h-0',\n className,\n )}\n {...props}\n />\n )\n}\n\nAccordionPanel.displayName = 'AccordionPanel'\n\n// ============================================================================\n// Exports\n// ============================================================================\n\nexport { AccordionRoot, AccordionItem, AccordionHeader, AccordionTrigger, AccordionPanel }\n\nexport type {\n AccordionRootProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionPanelProps,\n}\n"],"mappings":";;;;;;;;AAaA,MAAM,iBAAiB,EAAE,WAAW,GAAG,YAAgC;AACrE,QAAO,oBAACA,UAAc;EAAK,WAAW,GAAG,UAAU,UAAU;EAAE,GAAI;GAAS;;AAG9E,cAAc,cAAc;AAQ5B,MAAM,iBAAiB,EAAE,WAAW,GAAG,YAAgC;AACrE,QACE,oBAACA,UAAc;EACb,WAAW,GAAG,0CAA0C,UAAU;EAClE,GAAI;GACJ;;AAIN,cAAc,cAAc;AAQ5B,MAAM,mBAAmB,EAAE,WAAW,GAAG,YAAkC;AACzE,QAAO,oBAACA,UAAc;EAAO,WAAW,GAAG,QAAQ,UAAU;EAAE,GAAI;GAAS;;AAG9E,gBAAgB,cAAc;AAQ9B,MAAM,oBAAoB,EAAE,WAAW,UAAU,GAAG,YAAmC;AACrF,QACE,oBAACA,UAAc;EACb,WAAW,GACT,6DACA,UACD;EACD,GAAI;EAEH;GACqB;;AAI5B,iBAAiB,cAAc;AAQ/B,MAAM,kBAAkB,EAAE,WAAW,GAAG,YAAiC;AACvE,QACE,oBAACA,UAAc;EACb,WAAW,GACT,sIACA,UACD;EACD,GAAI;GACJ;;AAIN,eAAe,cAAc"}
|
package/dist/alert-dialog.d.ts
CHANGED
|
@@ -1,87 +1,93 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import * as
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
variant
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
1
|
+
import { ButtonSize, ButtonVariant } from "./lib/button-variants.js";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import * as react_jsx_runtime207 from "react/jsx-runtime";
|
|
4
|
+
import { AlertDialog, AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
|
|
5
|
+
|
|
6
|
+
//#region src/components/alert-dialog.d.ts
|
|
7
|
+
type AlertDialogRootProps = React.ComponentProps<typeof AlertDialog$1.Root>;
|
|
8
|
+
declare const AlertDialogRoot: {
|
|
9
|
+
(props: AlertDialogRootProps): react_jsx_runtime207.JSX.Element;
|
|
10
|
+
displayName: string;
|
|
11
|
+
};
|
|
12
|
+
type AlertDialogTriggerProps = React.ComponentProps<typeof AlertDialog$1.Trigger> & {
|
|
13
|
+
/** Visual style variant */
|
|
14
|
+
variant?: ButtonVariant;
|
|
15
|
+
/** Size of the trigger button */
|
|
16
|
+
size?: ButtonSize;
|
|
17
|
+
};
|
|
18
|
+
declare const AlertDialogTrigger: {
|
|
19
|
+
({
|
|
20
|
+
className,
|
|
21
|
+
variant,
|
|
22
|
+
size,
|
|
23
|
+
...props
|
|
24
|
+
}: AlertDialogTriggerProps): react_jsx_runtime207.JSX.Element;
|
|
25
|
+
displayName: string;
|
|
26
|
+
};
|
|
27
|
+
type AlertDialogPortalProps = React.ComponentProps<typeof AlertDialog$1.Portal>;
|
|
28
|
+
declare const AlertDialogPortal: {
|
|
29
|
+
(props: AlertDialogPortalProps): react_jsx_runtime207.JSX.Element;
|
|
30
|
+
displayName: string;
|
|
31
|
+
};
|
|
32
|
+
type AlertDialogBackdropProps = React.ComponentProps<typeof AlertDialog$1.Backdrop>;
|
|
33
|
+
declare const AlertDialogBackdrop: {
|
|
34
|
+
({
|
|
35
|
+
className,
|
|
36
|
+
...props
|
|
37
|
+
}: AlertDialogBackdropProps): react_jsx_runtime207.JSX.Element;
|
|
38
|
+
displayName: string;
|
|
39
|
+
};
|
|
40
|
+
type AlertDialogViewportProps = React.ComponentProps<typeof AlertDialog$1.Viewport>;
|
|
41
|
+
declare const AlertDialogViewport: {
|
|
42
|
+
({
|
|
43
|
+
className,
|
|
44
|
+
...props
|
|
45
|
+
}: AlertDialogViewportProps): react_jsx_runtime207.JSX.Element;
|
|
46
|
+
displayName: string;
|
|
47
|
+
};
|
|
48
|
+
type AlertDialogPopupProps = React.ComponentProps<typeof AlertDialog$1.Popup> & {
|
|
49
|
+
/** Size of the alert dialog popup */
|
|
50
|
+
size?: 'sm' | 'default' | 'lg' | 'xl' | 'full';
|
|
51
|
+
};
|
|
52
|
+
declare const AlertDialogPopup: {
|
|
53
|
+
({
|
|
54
|
+
className,
|
|
55
|
+
size,
|
|
56
|
+
...props
|
|
57
|
+
}: AlertDialogPopupProps): react_jsx_runtime207.JSX.Element;
|
|
58
|
+
displayName: string;
|
|
59
|
+
};
|
|
60
|
+
type AlertDialogTitleProps = React.ComponentProps<typeof AlertDialog$1.Title>;
|
|
61
|
+
declare const AlertDialogTitle: {
|
|
62
|
+
({
|
|
63
|
+
className,
|
|
64
|
+
...props
|
|
65
|
+
}: AlertDialogTitleProps): react_jsx_runtime207.JSX.Element;
|
|
66
|
+
displayName: string;
|
|
67
|
+
};
|
|
68
|
+
type AlertDialogDescriptionProps = React.ComponentProps<typeof AlertDialog$1.Description>;
|
|
69
|
+
declare const AlertDialogDescription: {
|
|
70
|
+
({
|
|
71
|
+
className,
|
|
72
|
+
...props
|
|
73
|
+
}: AlertDialogDescriptionProps): react_jsx_runtime207.JSX.Element;
|
|
74
|
+
displayName: string;
|
|
75
|
+
};
|
|
76
|
+
type AlertDialogCloseProps = React.ComponentProps<typeof AlertDialog$1.Close> & {
|
|
77
|
+
/** Visual style variant */
|
|
78
|
+
variant?: ButtonVariant;
|
|
79
|
+
/** Size of the close button */
|
|
80
|
+
size?: ButtonSize;
|
|
81
|
+
};
|
|
82
|
+
declare const AlertDialogClose: {
|
|
83
|
+
({
|
|
84
|
+
className,
|
|
85
|
+
variant,
|
|
86
|
+
size,
|
|
87
|
+
...props
|
|
88
|
+
}: AlertDialogCloseProps): react_jsx_runtime207.JSX.Element;
|
|
89
|
+
displayName: string;
|
|
90
|
+
};
|
|
91
|
+
//#endregion
|
|
92
|
+
export { AlertDialog, AlertDialogBackdrop, type AlertDialogBackdropProps, AlertDialogClose, type AlertDialogCloseProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogPopup, type AlertDialogPopupProps, AlertDialogPortal, type AlertDialogPortalProps, AlertDialogRoot, type AlertDialogRootProps, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertDialogTriggerProps, AlertDialogViewport, type AlertDialogViewportProps };
|
|
93
|
+
//# sourceMappingURL=alert-dialog.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert-dialog.d.ts","names":[],"sources":["../src/components/alert-dialog.tsx"],"sourcesContent":[],"mappings":";;;;;;KAiBK,oBAAA,GAAuB,KAAA,CAAM,sBAAsB,aAAA,CAAgB;cAElE;UAA0B,uBAAoB,oBAAA,CAAA,GAAA,CAAA;EAF/C,WAAA,EAAA,MAAA;CAAoB;KAYpB,uBAAA,GAA0B,KAAA,CAAM,cAZmC,CAAA,OAYb,aAAA,CAAgB,OAZH,CAAA,GAAA;;EAAxB,OAAA,CAAA,EAcpC,aAdoC;EAE1C;EAEL,IAAA,CAAA,EAYQ,UAZR;;cAeK,kBAjB8C,EAAA;EAAA,CAAA;IAAA,SAAA;IAAA,OAAA;IAAA,IAAA;IAAA,GAAA;EAAA,CAAA,EAsBjD,uBAtBiD,CAAA,EAsB1B,oBAAA,CAAA,GAAA,CAAA,OAtB0B;EAU/C,WAAA,EAAA,MAAA;CAAuB;KA2BvB,sBAAA,GAAyB,KAAA,CAAM,cA3BuC,CAAA,OA2BjB,aAAA,CAAgB,MA3BC,CAAA;cA6BrE,iBA7B+B,EAAA;QAEzB,EA2BsB,sBA3BtB,CAAA,EA2B4C,oBAAA,CAAA,GAAA,CAAA,OA3B5C;aAEH,EAAA,MAAA;CAAU;AAAA,KAmCd,wBAAA,GAA2B,KAAA,CAAM,cApBrC,CAAA,OAoB2D,aAAA,CAAgB,QApB3E,CAAA;cAsBK,mBAtBL,EAAA;;;;KAsBqD,2BAAwB,oBAAA,CAAA,GAAA,CAAA;;;KAoBzE,wBAAA,GAA2B,KAAA,CAAM,cAjDnC,CAAA,OAiDyD,aAAA,CAAgB,QAjDzE,CAAA;cAmDG,mBAnDoB,EAAA;EAAA,CAAA;IAAA,SAAA;IAAA,GAAA;EAAA,CAAA,EAmD4B,wBAnD5B,CAAA,EAmDoD,oBAAA,CAAA,GAAA,CAAA,OAnDpD;EAerB,WAAA,EAAA,MAAA;CAAsB;KA6EtB,qBAAA,GAAwB,KAAA,CAAM,cA7EuC,CAAA,OA6EjB,aAAA,CAAgB,KA7EC,CAAA,GAAA;;EAAxB,IAAA,CAAA,EAAA,IAAA,GAAA,SAAA,GAAA,IAAA,GAAA,IAAA,GAAA,MAAA;AAAA,CAAA;cAkF5C,gBA9EL,EAAA;;IAFiC,SAAA;IAAA,IAAA;IAAA,GAAA;EAAA,CAAA,EAgFuB,qBAhFvB,CAAA,EAgF4C,oBAAA,CAAA,GAAA,CAAA,OAhF5C;aAAsB,EAAA,MAAA;CAAA;AAAA,KA+FnD,qBAAA,GAAwB,KAAA,CAAM,cArFN,CAAA,OAqF4B,aAAA,CAAgB,KArF5C,CAAA;cAuFvB,gBAvFuB,EAAA;;IAA+B,SAAA;IAAA,GAAgB;EAAA,CAAA,EAuFzB,qBAvFyB,CAAA,EAuFJ,oBAAA,CAAA,GAAA,CAAA,OAvFI;aAAtC,EAAA,MAAA;CAAc;AAAA,KAsG/C,2BAAA,GAA8B,KAAA,CAAM,cAxFxC,CAAA,OAyFQ,aAAA,CAAgB,WAzFxB,CAAA;cA4FK,sBA5FL,EAAA;;;;KA4FwD,8BAA2B,oBAAA,CAAA,GAAA,CAAA;aAxG9B,EAAA,MAAA;;KAkHjD,qBAAA,GAAwB,KAAA,CAAM,cAlH2C,CAAA,OAkHrB,aAAA,CAAgB,KAlHK,CAAA,GAAA;EAoBzE;EAAwB,OAAA,CAAA,EAgGjB,aAhGiB;;MAAG,CAAA,EAkGvB,UAlG6B;CAAc;AAAA,cAqG9C,gBA5FL,EAAA;EAAA,CAAA;IAAA,SAAA;IAAA,OAAA;IAAA,IAAA;IAAA,GAAA;EAAA,CAAA,EAiGE,qBAjGF,CAAA,EAiGuB,oBAAA,CAAA,GAAA,CAAA,OAjGvB"}
|
package/dist/alert-dialog.js
CHANGED
|
@@ -1,112 +1,95 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
size: o,
|
|
14
|
-
...i
|
|
15
|
-
}) => /* @__PURE__ */ e(
|
|
16
|
-
l.Trigger,
|
|
17
|
-
{
|
|
18
|
-
className: r(s({ variant: t, size: o }), a),
|
|
19
|
-
...i
|
|
20
|
-
}
|
|
21
|
-
);
|
|
22
|
-
g.displayName = "AlertDialogTrigger";
|
|
23
|
-
const c = (a) => /* @__PURE__ */ e(l.Portal, { ...a });
|
|
24
|
-
c.displayName = "AlertDialogPortal";
|
|
25
|
-
const p = ({ className: a, ...t }) => /* @__PURE__ */ e(
|
|
26
|
-
l.Backdrop,
|
|
27
|
-
{
|
|
28
|
-
className: r(
|
|
29
|
-
"fixed inset-0 z-50 bg-black/50 backdrop-blur-sm",
|
|
30
|
-
"transition-opacity duration-200",
|
|
31
|
-
"data-starting-style:opacity-0 data-ending-style:opacity-0",
|
|
32
|
-
a
|
|
33
|
-
),
|
|
34
|
-
...t
|
|
35
|
-
}
|
|
36
|
-
);
|
|
37
|
-
p.displayName = "AlertDialogBackdrop";
|
|
38
|
-
const m = ({ className: a, ...t }) => /* @__PURE__ */ e(
|
|
39
|
-
l.Viewport,
|
|
40
|
-
{
|
|
41
|
-
className: r("fixed inset-0 z-50 flex items-center justify-center p-4", a),
|
|
42
|
-
...t
|
|
43
|
-
}
|
|
44
|
-
);
|
|
45
|
-
m.displayName = "AlertDialogViewport";
|
|
46
|
-
const u = n(
|
|
47
|
-
[
|
|
48
|
-
"fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2",
|
|
49
|
-
"w-full max-w-[calc(100vw-2rem)] rounded-lg border border-border bg-background p-6 shadow-lg",
|
|
50
|
-
"transition-all duration-200",
|
|
51
|
-
"data-[starting-style]:scale-95 data-[starting-style]:opacity-0",
|
|
52
|
-
"data-[ending-style]:scale-95 data-[ending-style]:opacity-0",
|
|
53
|
-
"top-[calc(50%+1.25rem*var(--nested-dialogs))] scale-[calc(1-0.1*var(--nested-dialogs))]",
|
|
54
|
-
"data-[nested-dialog-open]:after:absolute data-[nested-dialog-open]:after:inset-0 data-[nested-dialog-open]:after:rounded-[inherit] data-[nested-dialog-open]:after:bg-black/5"
|
|
55
|
-
],
|
|
56
|
-
{
|
|
57
|
-
variants: {
|
|
58
|
-
size: {
|
|
59
|
-
sm: "w-sm",
|
|
60
|
-
default: "w-lg",
|
|
61
|
-
lg: "w-2xl",
|
|
62
|
-
xl: "w-4xl",
|
|
63
|
-
full: "h-[calc(100vh-2rem)]"
|
|
64
|
-
}
|
|
65
|
-
},
|
|
66
|
-
defaultVariants: {
|
|
67
|
-
size: "default"
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
), D = ({ className: a, size: t, ...o }) => /* @__PURE__ */ e(
|
|
71
|
-
l.Popup,
|
|
72
|
-
{
|
|
73
|
-
className: r(u({ size: t }), a),
|
|
74
|
-
...o
|
|
75
|
-
}
|
|
76
|
-
);
|
|
77
|
-
D.displayName = "AlertDialogPopup";
|
|
78
|
-
const f = ({ className: a, ...t }) => /* @__PURE__ */ e(
|
|
79
|
-
l.Title,
|
|
80
|
-
{
|
|
81
|
-
className: r("text-lg font-semibold leading-none tracking-tight", a),
|
|
82
|
-
...t
|
|
83
|
-
}
|
|
84
|
-
);
|
|
85
|
-
f.displayName = "AlertDialogTitle";
|
|
86
|
-
const y = ({ className: a, ...t }) => /* @__PURE__ */ e(l.Description, { className: r("mt-2", a), ...t });
|
|
87
|
-
y.displayName = "AlertDialogDescription";
|
|
88
|
-
const A = ({
|
|
89
|
-
className: a,
|
|
90
|
-
variant: t,
|
|
91
|
-
size: o,
|
|
92
|
-
...i
|
|
93
|
-
}) => /* @__PURE__ */ e(
|
|
94
|
-
l.Close,
|
|
95
|
-
{
|
|
96
|
-
className: r(s({ variant: t ?? "outline", size: o }), a),
|
|
97
|
-
...i
|
|
98
|
-
}
|
|
99
|
-
);
|
|
100
|
-
A.displayName = "AlertDialogClose";
|
|
101
|
-
export {
|
|
102
|
-
T as AlertDialog,
|
|
103
|
-
p as AlertDialogBackdrop,
|
|
104
|
-
A as AlertDialogClose,
|
|
105
|
-
y as AlertDialogDescription,
|
|
106
|
-
D as AlertDialogPopup,
|
|
107
|
-
c as AlertDialogPortal,
|
|
108
|
-
d as AlertDialogRoot,
|
|
109
|
-
f as AlertDialogTitle,
|
|
110
|
-
g as AlertDialogTrigger,
|
|
111
|
-
m as AlertDialogViewport
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { buttonVariants } from "./lib/button-variants.js";
|
|
4
|
+
import { cn } from "./lib/utils.js";
|
|
5
|
+
import "react";
|
|
6
|
+
import { cva } from "class-variance-authority";
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
import { AlertDialog, AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
|
|
9
|
+
|
|
10
|
+
//#region src/components/alert-dialog.tsx
|
|
11
|
+
const AlertDialogRoot = (props) => {
|
|
12
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Root, { ...props });
|
|
112
13
|
};
|
|
14
|
+
AlertDialogRoot.displayName = "AlertDialogRoot";
|
|
15
|
+
const AlertDialogTrigger = ({ className, variant, size, ...props }) => {
|
|
16
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Trigger, {
|
|
17
|
+
className: cn(buttonVariants({
|
|
18
|
+
variant,
|
|
19
|
+
size
|
|
20
|
+
}), className),
|
|
21
|
+
...props
|
|
22
|
+
});
|
|
23
|
+
};
|
|
24
|
+
AlertDialogTrigger.displayName = "AlertDialogTrigger";
|
|
25
|
+
const AlertDialogPortal = (props) => {
|
|
26
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Portal, { ...props });
|
|
27
|
+
};
|
|
28
|
+
AlertDialogPortal.displayName = "AlertDialogPortal";
|
|
29
|
+
const AlertDialogBackdrop = ({ className, ...props }) => {
|
|
30
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Backdrop, {
|
|
31
|
+
className: cn("fixed inset-0 z-50 bg-black/50 backdrop-blur-sm", "transition-opacity duration-200", "data-starting-style:opacity-0 data-ending-style:opacity-0", className),
|
|
32
|
+
...props
|
|
33
|
+
});
|
|
34
|
+
};
|
|
35
|
+
AlertDialogBackdrop.displayName = "AlertDialogBackdrop";
|
|
36
|
+
const AlertDialogViewport = ({ className, ...props }) => {
|
|
37
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Viewport, {
|
|
38
|
+
className: cn("fixed inset-0 z-50 flex items-center justify-center p-4", className),
|
|
39
|
+
...props
|
|
40
|
+
});
|
|
41
|
+
};
|
|
42
|
+
AlertDialogViewport.displayName = "AlertDialogViewport";
|
|
43
|
+
const alertDialogPopupVariants = cva([
|
|
44
|
+
"fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2",
|
|
45
|
+
"w-full max-w-[calc(100vw-2rem)] rounded-lg border border-border bg-background p-6 shadow-lg",
|
|
46
|
+
"transition-all duration-200",
|
|
47
|
+
"data-[starting-style]:scale-95 data-[starting-style]:opacity-0",
|
|
48
|
+
"data-[ending-style]:scale-95 data-[ending-style]:opacity-0",
|
|
49
|
+
"top-[calc(50%+1.25rem*var(--nested-dialogs))] scale-[calc(1-0.1*var(--nested-dialogs))]",
|
|
50
|
+
"data-[nested-dialog-open]:after:absolute data-[nested-dialog-open]:after:inset-0 data-[nested-dialog-open]:after:rounded-[inherit] data-[nested-dialog-open]:after:bg-black/5"
|
|
51
|
+
], {
|
|
52
|
+
variants: { size: {
|
|
53
|
+
sm: "w-sm",
|
|
54
|
+
default: "w-lg",
|
|
55
|
+
lg: "w-2xl",
|
|
56
|
+
xl: "w-4xl",
|
|
57
|
+
full: "h-[calc(100vh-2rem)]"
|
|
58
|
+
} },
|
|
59
|
+
defaultVariants: { size: "default" }
|
|
60
|
+
});
|
|
61
|
+
const AlertDialogPopup = ({ className, size, ...props }) => {
|
|
62
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Popup, {
|
|
63
|
+
className: cn(alertDialogPopupVariants({ size }), className),
|
|
64
|
+
...props
|
|
65
|
+
});
|
|
66
|
+
};
|
|
67
|
+
AlertDialogPopup.displayName = "AlertDialogPopup";
|
|
68
|
+
const AlertDialogTitle = ({ className, ...props }) => {
|
|
69
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Title, {
|
|
70
|
+
className: cn("text-lg font-semibold leading-none tracking-tight", className),
|
|
71
|
+
...props
|
|
72
|
+
});
|
|
73
|
+
};
|
|
74
|
+
AlertDialogTitle.displayName = "AlertDialogTitle";
|
|
75
|
+
const AlertDialogDescription = ({ className, ...props }) => {
|
|
76
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Description, {
|
|
77
|
+
className: cn("mt-2", className),
|
|
78
|
+
...props
|
|
79
|
+
});
|
|
80
|
+
};
|
|
81
|
+
AlertDialogDescription.displayName = "AlertDialogDescription";
|
|
82
|
+
const AlertDialogClose = ({ className, variant, size, ...props }) => {
|
|
83
|
+
return /* @__PURE__ */ jsx(AlertDialog$1.Close, {
|
|
84
|
+
className: cn(buttonVariants({
|
|
85
|
+
variant: variant ?? "outline",
|
|
86
|
+
size
|
|
87
|
+
}), className),
|
|
88
|
+
...props
|
|
89
|
+
});
|
|
90
|
+
};
|
|
91
|
+
AlertDialogClose.displayName = "AlertDialogClose";
|
|
92
|
+
|
|
93
|
+
//#endregion
|
|
94
|
+
export { AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogPopup, AlertDialogPortal, AlertDialogRoot, AlertDialogTitle, AlertDialogTrigger, AlertDialogViewport };
|
|
95
|
+
//# sourceMappingURL=alert-dialog.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert-dialog.js","names":["BaseAlertDialog"],"sources":["../src/components/alert-dialog.tsx"],"sourcesContent":["'use client'\n\nimport { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cva } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport {\n type ButtonSize,\n type ButtonVariant,\n buttonVariants,\n} from '../lib/button-variants'\nimport { cn } from '../lib/utils'\n\n// ============================================================================\n// AlertDialogRoot\n// ============================================================================\n\ntype AlertDialogRootProps = React.ComponentProps<typeof BaseAlertDialog.Root>\n\nconst AlertDialogRoot = (props: AlertDialogRootProps) => {\n return <BaseAlertDialog.Root {...props} />\n}\n\nAlertDialogRoot.displayName = 'AlertDialogRoot'\n\n// ============================================================================\n// AlertDialogTrigger\n// ============================================================================\n\ntype AlertDialogTriggerProps = React.ComponentProps<typeof BaseAlertDialog.Trigger> & {\n /** Visual style variant */\n variant?: ButtonVariant\n /** Size of the trigger button */\n size?: ButtonSize\n}\n\nconst AlertDialogTrigger = ({\n className,\n variant,\n size,\n ...props\n}: AlertDialogTriggerProps) => {\n return (\n <BaseAlertDialog.Trigger\n className={cn(buttonVariants({ variant, size }), className)}\n {...props}\n />\n )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialogTrigger'\n\n// ============================================================================\n// AlertDialogPortal\n// ============================================================================\n\ntype AlertDialogPortalProps = React.ComponentProps<typeof BaseAlertDialog.Portal>\n\nconst AlertDialogPortal = (props: AlertDialogPortalProps) => {\n return <BaseAlertDialog.Portal {...props} />\n}\n\nAlertDialogPortal.displayName = 'AlertDialogPortal'\n\n// ============================================================================\n// AlertDialogBackdrop\n// ============================================================================\n\ntype AlertDialogBackdropProps = React.ComponentProps<typeof BaseAlertDialog.Backdrop>\n\nconst AlertDialogBackdrop = ({ className, ...props }: AlertDialogBackdropProps) => {\n return (\n <BaseAlertDialog.Backdrop\n className={cn(\n 'fixed inset-0 z-50 bg-black/50 backdrop-blur-sm',\n 'transition-opacity duration-200',\n 'data-starting-style:opacity-0 data-ending-style:opacity-0',\n className,\n )}\n {...props}\n />\n )\n}\n\nAlertDialogBackdrop.displayName = 'AlertDialogBackdrop'\n\n// ============================================================================\n// AlertDialogViewport\n// ============================================================================\n\ntype AlertDialogViewportProps = React.ComponentProps<typeof BaseAlertDialog.Viewport>\n\nconst AlertDialogViewport = ({ className, ...props }: AlertDialogViewportProps) => {\n return (\n <BaseAlertDialog.Viewport\n className={cn('fixed inset-0 z-50 flex items-center justify-center p-4', className)}\n {...props}\n />\n )\n}\n\nAlertDialogViewport.displayName = 'AlertDialogViewport'\n\n// ============================================================================\n// AlertDialogPopup\n// ============================================================================\n\nconst alertDialogPopupVariants = cva(\n [\n 'fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2',\n 'w-full max-w-[calc(100vw-2rem)] rounded-lg border border-border bg-background p-6 shadow-lg',\n 'transition-all duration-200',\n 'data-[starting-style]:scale-95 data-[starting-style]:opacity-0',\n 'data-[ending-style]:scale-95 data-[ending-style]:opacity-0',\n 'top-[calc(50%+1.25rem*var(--nested-dialogs))] scale-[calc(1-0.1*var(--nested-dialogs))]',\n 'data-[nested-dialog-open]:after:absolute data-[nested-dialog-open]:after:inset-0 data-[nested-dialog-open]:after:rounded-[inherit] data-[nested-dialog-open]:after:bg-black/5',\n ],\n {\n variants: {\n size: {\n sm: 'w-sm',\n default: 'w-lg',\n lg: 'w-2xl',\n xl: 'w-4xl',\n full: 'h-[calc(100vh-2rem)]',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n },\n)\n\ntype AlertDialogPopupProps = React.ComponentProps<typeof BaseAlertDialog.Popup> & {\n /** Size of the alert dialog popup */\n size?: 'sm' | 'default' | 'lg' | 'xl' | 'full'\n}\n\nconst AlertDialogPopup = ({ className, size, ...props }: AlertDialogPopupProps) => {\n return (\n <BaseAlertDialog.Popup\n className={cn(alertDialogPopupVariants({ size }), className)}\n {...props}\n />\n )\n}\n\nAlertDialogPopup.displayName = 'AlertDialogPopup'\n\n// ============================================================================\n// AlertDialogTitle\n// ============================================================================\n\ntype AlertDialogTitleProps = React.ComponentProps<typeof BaseAlertDialog.Title>\n\nconst AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n return (\n <BaseAlertDialog.Title\n className={cn('text-lg font-semibold leading-none tracking-tight', className)}\n {...props}\n />\n )\n}\n\nAlertDialogTitle.displayName = 'AlertDialogTitle'\n\n// ============================================================================\n// AlertDialogDescription\n// ============================================================================\n\ntype AlertDialogDescriptionProps = React.ComponentProps<\n typeof BaseAlertDialog.Description\n>\n\nconst AlertDialogDescription = ({ className, ...props }: AlertDialogDescriptionProps) => {\n return <BaseAlertDialog.Description className={cn('mt-2', className)} {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialogDescription'\n\n// ============================================================================\n// AlertDialogClose\n// ============================================================================\n\ntype AlertDialogCloseProps = React.ComponentProps<typeof BaseAlertDialog.Close> & {\n /** Visual style variant */\n variant?: ButtonVariant\n /** Size of the close button */\n size?: ButtonSize\n}\n\nconst AlertDialogClose = ({\n className,\n variant,\n size,\n ...props\n}: AlertDialogCloseProps) => {\n return (\n <BaseAlertDialog.Close\n className={cn(buttonVariants({ variant: variant ?? 'outline', size }), className)}\n {...props}\n />\n )\n}\n\nAlertDialogClose.displayName = 'AlertDialogClose'\n\n// ============================================================================\n// Exports\n// ============================================================================\n\n// Re-export AlertDialog from Base UI for createHandle() and other utilities\nexport { AlertDialog } from '@base-ui/react/alert-dialog'\n\nexport {\n AlertDialogRoot,\n AlertDialogTrigger,\n AlertDialogPortal,\n AlertDialogBackdrop,\n AlertDialogViewport,\n AlertDialogPopup,\n AlertDialogTitle,\n AlertDialogDescription,\n AlertDialogClose,\n}\n\nexport type {\n AlertDialogRootProps,\n AlertDialogTriggerProps,\n AlertDialogPortalProps,\n AlertDialogBackdropProps,\n AlertDialogViewportProps,\n AlertDialogPopupProps,\n AlertDialogTitleProps,\n AlertDialogDescriptionProps,\n AlertDialogCloseProps,\n}\n"],"mappings":";;;;;;;;;;AAmBA,MAAM,mBAAmB,UAAgC;AACvD,QAAO,oBAACA,cAAgB,QAAK,GAAI,QAAS;;AAG5C,gBAAgB,cAAc;AAa9B,MAAM,sBAAsB,EAC1B,WACA,SACA,MACA,GAAG,YAC0B;AAC7B,QACE,oBAACA,cAAgB;EACf,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM,CAAC,EAAE,UAAU;EAC3D,GAAI;GACJ;;AAIN,mBAAmB,cAAc;AAQjC,MAAM,qBAAqB,UAAkC;AAC3D,QAAO,oBAACA,cAAgB,UAAO,GAAI,QAAS;;AAG9C,kBAAkB,cAAc;AAQhC,MAAM,uBAAuB,EAAE,WAAW,GAAG,YAAsC;AACjF,QACE,oBAACA,cAAgB;EACf,WAAW,GACT,mDACA,mCACA,6DACA,UACD;EACD,GAAI;GACJ;;AAIN,oBAAoB,cAAc;AAQlC,MAAM,uBAAuB,EAAE,WAAW,GAAG,YAAsC;AACjF,QACE,oBAACA,cAAgB;EACf,WAAW,GAAG,2DAA2D,UAAU;EACnF,GAAI;GACJ;;AAIN,oBAAoB,cAAc;AAMlC,MAAM,2BAA2B,IAC/B;CACE;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACD;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,SAAS;EACT,IAAI;EACJ,IAAI;EACJ,MAAM;EACP,EACF;CACD,iBAAiB,EACf,MAAM,WACP;CACF,CACF;AAOD,MAAM,oBAAoB,EAAE,WAAW,MAAM,GAAG,YAAmC;AACjF,QACE,oBAACA,cAAgB;EACf,WAAW,GAAG,yBAAyB,EAAE,MAAM,CAAC,EAAE,UAAU;EAC5D,GAAI;GACJ;;AAIN,iBAAiB,cAAc;AAQ/B,MAAM,oBAAoB,EAAE,WAAW,GAAG,YAAmC;AAC3E,QACE,oBAACA,cAAgB;EACf,WAAW,GAAG,qDAAqD,UAAU;EAC7E,GAAI;GACJ;;AAIN,iBAAiB,cAAc;AAU/B,MAAM,0BAA0B,EAAE,WAAW,GAAG,YAAyC;AACvF,QAAO,oBAACA,cAAgB;EAAY,WAAW,GAAG,QAAQ,UAAU;EAAE,GAAI;GAAS;;AAGrF,uBAAuB,cAAc;AAarC,MAAM,oBAAoB,EACxB,WACA,SACA,MACA,GAAG,YACwB;AAC3B,QACE,oBAACA,cAAgB;EACf,WAAW,GAAG,eAAe;GAAE,SAAS,WAAW;GAAW;GAAM,CAAC,EAAE,UAAU;EACjF,GAAI;GACJ;;AAIN,iBAAiB,cAAc"}
|