@spark-ui/components 18.1.1 → 18.1.2
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/{FormFieldRequiredIndicator-DY3STDp1.js → FormFieldRequiredIndicator-BxZgeZ9H.js} +2 -2
- package/dist/{FormFieldRequiredIndicator-DY3STDp1.js.map → FormFieldRequiredIndicator-BxZgeZ9H.js.map} +1 -1
- package/dist/{FormFieldRequiredIndicator-COKYxTNs.mjs → FormFieldRequiredIndicator-CfE6AOta.mjs} +2 -2
- package/dist/{FormFieldRequiredIndicator-COKYxTNs.mjs.map → FormFieldRequiredIndicator-CfE6AOta.mjs.map} +1 -1
- package/dist/accordion/index.js +1 -1
- package/dist/accordion/index.js.map +1 -1
- package/dist/accordion/index.mjs +45 -50
- package/dist/accordion/index.mjs.map +1 -1
- package/dist/alert-dialog/AlertDialogAction.d.ts +1 -1
- package/dist/alert-dialog/AlertDialogCancel.d.ts +1 -1
- package/dist/alert-dialog/AlertDialogTrigger.d.ts +1 -1
- package/dist/alert-dialog/index.js +1 -1
- package/dist/alert-dialog/index.js.map +1 -1
- package/dist/alert-dialog/index.mjs +53 -56
- package/dist/alert-dialog/index.mjs.map +1 -1
- package/dist/avatar/index.js +1 -1
- package/dist/avatar/index.mjs +2 -2
- package/dist/badge/BadgeItem.styles.d.ts +1 -1
- package/dist/badge/index.js +1 -1
- package/dist/badge/index.mjs +13 -13
- package/dist/breadcrumb/index.js +1 -1
- package/dist/breadcrumb/index.mjs +1 -1
- package/dist/button/Button.styles.d.ts +1 -1
- package/dist/button/index.js +1 -1
- package/dist/button/index.mjs +1 -1
- package/dist/{button-D0s-21qo.js → button-3vvMrf1L.js} +2 -2
- package/dist/{button-D0s-21qo.js.map → button-3vvMrf1L.js.map} +1 -1
- package/dist/{button-DwLTXeJX.mjs → button-DBNjh3Bi.mjs} +76 -76
- package/dist/{button-DwLTXeJX.mjs.map → button-DBNjh3Bi.mjs.map} +1 -1
- package/dist/card/Backdrop.d.ts +1 -1
- package/dist/card/Card.styles.d.ts +1 -1
- package/dist/card/Content.styles.d.ts +1 -1
- package/dist/card/Type.d.ts +1 -1
- package/dist/card/index.js +1 -1
- package/dist/card/index.mjs +53 -53
- package/dist/carousel/index.js +1 -1
- package/dist/carousel/index.mjs +2 -2
- package/dist/checkbox/CheckboxInput.styles.d.ts +1 -1
- package/dist/checkbox/index.js +1 -1
- package/dist/checkbox/index.mjs +1 -1
- package/dist/{checkbox-uSINHQYe.mjs → checkbox-BEo9AVSB.mjs} +26 -26
- package/dist/{checkbox-uSINHQYe.mjs.map → checkbox-BEo9AVSB.mjs.map} +1 -1
- package/dist/{checkbox-Cbewcw6G.js → checkbox-Cr60_jql.js} +2 -2
- package/dist/{checkbox-Cbewcw6G.js.map → checkbox-Cr60_jql.js.map} +1 -1
- package/dist/chip/Chip.styles.d.ts +1 -1
- package/dist/chip/index.js +1 -1
- package/dist/chip/index.mjs +86 -86
- package/dist/collapsible/index.js +1 -1
- package/dist/collapsible/index.js.map +1 -1
- package/dist/collapsible/index.mjs +18 -24
- package/dist/collapsible/index.mjs.map +1 -1
- package/dist/combobox/index.js +1 -1
- package/dist/combobox/index.mjs +4 -4
- package/dist/dialog/DialogClose.d.ts +1 -1
- package/dist/dialog/DialogTrigger.d.ts +1 -1
- package/dist/dialog/index.js +1 -1
- package/dist/dialog/index.js.map +1 -1
- package/dist/dialog/index.mjs +13 -11
- package/dist/dialog/index.mjs.map +1 -1
- package/dist/divider/index.js +1 -1
- package/dist/divider/index.mjs +26 -26
- package/dist/drawer/DrawerClose.d.ts +1 -1
- package/dist/drawer/DrawerTrigger.d.ts +1 -1
- package/dist/drawer/index.js +1 -1
- package/dist/drawer/index.js.map +1 -1
- package/dist/drawer/index.mjs +13 -11
- package/dist/drawer/index.mjs.map +1 -1
- package/dist/dropdown/index.js +1 -1
- package/dist/dropdown/index.mjs +2 -2
- package/dist/file-upload/index.js +1 -1
- package/dist/file-upload/index.mjs +3 -3
- package/dist/form-field/index.js +1 -1
- package/dist/form-field/index.mjs +1 -1
- package/dist/{form-field-B38U0zp8.js → form-field-DMHwopHt.js} +2 -2
- package/dist/{form-field-B38U0zp8.js.map → form-field-DMHwopHt.js.map} +1 -1
- package/dist/{form-field-DCKyhBmv.mjs → form-field-Doq4zLEX.mjs} +4 -4
- package/dist/{form-field-DCKyhBmv.mjs.map → form-field-Doq4zLEX.mjs.map} +1 -1
- package/dist/icon/Icon.styles.d.ts +1 -1
- package/dist/icon/index.js +1 -1
- package/dist/icon/index.mjs +1 -1
- package/dist/icon-CfEsla9z.js +2 -0
- package/dist/{icon-DY4l9nsc.js.map → icon-CfEsla9z.js.map} +1 -1
- package/dist/{icon-Bs-39J-H.mjs → icon-VM_Ys9Xn.mjs} +11 -11
- package/dist/{icon-Bs-39J-H.mjs.map → icon-VM_Ys9Xn.mjs.map} +1 -1
- package/dist/icon-button/index.js +1 -1
- package/dist/icon-button/index.mjs +1 -1
- package/dist/icon-button-B2TM0Xby.js +2 -0
- package/dist/{icon-button-DRFf308H.js.map → icon-button-B2TM0Xby.js.map} +1 -1
- package/dist/icon-button-CexCkoV0.mjs +29 -0
- package/dist/{icon-button-C1ThqdK1.mjs.map → icon-button-CexCkoV0.mjs.map} +1 -1
- package/dist/input/index.js +1 -1
- package/dist/input/index.mjs +1 -1
- package/dist/{input-BoxJZira.js → input-CADvgFpY.js} +2 -2
- package/dist/{input-BoxJZira.js.map → input-CADvgFpY.js.map} +1 -1
- package/dist/{input-Du9YSgAt.mjs → input-CmlNZ4Bo.mjs} +2 -2
- package/dist/{input-Du9YSgAt.mjs.map → input-CmlNZ4Bo.mjs.map} +1 -1
- package/dist/label/index.js +1 -1
- package/dist/label/index.mjs +1 -1
- package/dist/{label-DO48yda7.js → label-B085X0Sg.js} +2 -2
- package/dist/{label-DO48yda7.js.map → label-B085X0Sg.js.map} +1 -1
- package/dist/{label-RKaPen31.mjs → label-BqWu-wLT.mjs} +6 -6
- package/dist/{label-RKaPen31.mjs.map → label-BqWu-wLT.mjs.map} +1 -1
- package/dist/menu/MenuItemStyles.d.ts +1 -1
- package/dist/menu/index.js +1 -1
- package/dist/menu/index.js.map +1 -1
- package/dist/menu/index.mjs +131 -140
- package/dist/menu/index.mjs.map +1 -1
- package/dist/meter/MeterTrack.styles.d.ts +1 -1
- package/dist/pagination/index.js +1 -1
- package/dist/pagination/index.mjs +3 -3
- package/dist/popover/PopoverContent.styles.d.ts +1 -1
- package/dist/popover/index.js +1 -1
- package/dist/popover/index.mjs +1 -1
- package/dist/{popover-DVz0JvON.js → popover-B-mcHcLF.js} +2 -2
- package/dist/{popover-DVz0JvON.js.map → popover-B-mcHcLF.js.map} +1 -1
- package/dist/{popover-CGhSHQzb.mjs → popover-COqbFikI.mjs} +17 -17
- package/dist/{popover-CGhSHQzb.mjs.map → popover-COqbFikI.mjs.map} +1 -1
- package/dist/progress/ProgressIndicator.d.ts +1 -1
- package/dist/progress-tracker/index.js +1 -1
- package/dist/progress-tracker/index.mjs +1 -1
- package/dist/radio-group/RadioIndicator.styles.d.ts +1 -1
- package/dist/radio-group/RadioInput.styles.d.ts +1 -1
- package/dist/radio-group/index.js +1 -1
- package/dist/radio-group/index.mjs +37 -37
- package/dist/rating/index.js +1 -1
- package/dist/rating/index.mjs +2 -2
- package/dist/rating-display/index.js +1 -1
- package/dist/rating-display/index.mjs +1 -1
- package/dist/scrolling-list/index.js +1 -1
- package/dist/scrolling-list/index.mjs +3 -3
- package/dist/select/index.js +1 -1
- package/dist/select/index.mjs +1 -1
- package/dist/slider/SliderThumb.styles.d.ts +1 -1
- package/dist/slider/SliderTrack.styles.d.ts +1 -1
- package/dist/slider/index.js +1 -1
- package/dist/slider/index.mjs +2 -2
- package/dist/slot/index.js +1 -1
- package/dist/slot/index.mjs +3 -3
- package/dist/spinner/Spinner.styles.d.ts +1 -1
- package/dist/spinner/index.js +1 -1
- package/dist/spinner/index.mjs +1 -1
- package/dist/{spinner-CmPypfJR.js → spinner-BAreohbs.js} +2 -2
- package/dist/{spinner-CmPypfJR.js.map → spinner-BAreohbs.js.map} +1 -1
- package/dist/{spinner-TfGcjNm3.mjs → spinner-DnrZf01S.mjs} +9 -9
- package/dist/{spinner-TfGcjNm3.mjs.map → spinner-DnrZf01S.mjs.map} +1 -1
- package/dist/stepper/index.js +1 -1
- package/dist/stepper/index.mjs +3 -3
- package/dist/switch/SwitchInput.d.ts +1 -1
- package/dist/switch/index.js +1 -1
- package/dist/switch/index.js.map +1 -1
- package/dist/switch/index.mjs +43 -44
- package/dist/switch/index.mjs.map +1 -1
- package/dist/table/index.js +1 -1
- package/dist/table/index.mjs +3 -3
- package/dist/tabs/index.js +1 -1
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/index.mjs +144 -153
- package/dist/tabs/index.mjs.map +1 -1
- package/dist/tag/Tag.styles.d.ts +1 -1
- package/dist/tag/index.js +1 -1
- package/dist/tag/index.mjs +37 -37
- package/dist/text-link/TextLink.d.ts +1 -1
- package/dist/textarea/index.js +1 -1
- package/dist/textarea/index.mjs +1 -1
- package/dist/toast/Toast.styles.d.ts +1 -1
- package/dist/toast/index.js +1 -1
- package/dist/toast/index.mjs +3 -3
- package/dist/toggle-group/index.js +1 -1
- package/dist/toggle-group/index.js.map +1 -1
- package/dist/toggle-group/index.mjs +16 -21
- package/dist/toggle-group/index.mjs.map +1 -1
- package/package.json +5 -5
- package/dist/accordion/useRenderSlot.d.ts +0 -3
- package/dist/alert-dialog/useRenderSlot.d.ts +0 -3
- package/dist/collapsible/useRenderSlot.d.ts +0 -3
- package/dist/drawer/useRenderSlot.d.ts +0 -3
- package/dist/icon-DY4l9nsc.js +0 -2
- package/dist/icon-button-C1ThqdK1.mjs +0 -29
- package/dist/icon-button-DRFf308H.js +0 -2
- package/dist/menu/useRenderSlot.d.ts +0 -1
- package/dist/tabs/useRenderSlot.d.ts +0 -1
- package/dist/toast/useRenderSlot.d.ts +0 -3
- package/dist/toggle-group/useRenderSlot.d.ts +0 -1
- package/dist/useRenderSlot-5CPC9Lkj.mjs +0 -11
- package/dist/useRenderSlot-5CPC9Lkj.mjs.map +0 -1
- package/dist/useRenderSlot-DHV0CegV.js +0 -2
- package/dist/useRenderSlot-DHV0CegV.js.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { t } from "
|
|
1
|
+
import { t as e } from "../DialogContent.styles-ClKRO43s.mjs";
|
|
2
|
+
import { createRenderSlot as t } from "@spark-ui/internal-utils";
|
|
3
3
|
import { cx as n } from "class-variance-authority";
|
|
4
4
|
import { createContext as r, useContext as i, useRef as a } from "react";
|
|
5
5
|
import { jsx as o } from "react/jsx-runtime";
|
|
@@ -33,25 +33,20 @@ var u = r(null), d = ({ children: e, withFade: t = !1, cancelRef: n }) => /* @__
|
|
|
33
33
|
};
|
|
34
34
|
p.displayName = "AlertDialog";
|
|
35
35
|
//#endregion
|
|
36
|
-
//#region src/alert-dialog/useRenderSlot.tsx
|
|
37
|
-
function m(t, n) {
|
|
38
|
-
let r = t ? e : n;
|
|
39
|
-
return t ? ({ ...e }) => /* @__PURE__ */ o(r, { ...e }) : void 0;
|
|
40
|
-
}
|
|
41
|
-
//#endregion
|
|
42
36
|
//#region src/alert-dialog/AlertDialogAction.tsx
|
|
43
|
-
var
|
|
44
|
-
let
|
|
37
|
+
var m = ({ asChild: e = !1, children: n, ...r }) => {
|
|
38
|
+
let { renderProp: i, innerChildren: a } = t(e, n);
|
|
45
39
|
return /* @__PURE__ */ o(s.Close, {
|
|
46
40
|
"data-spark-component": "alert-dialog-action",
|
|
47
|
-
render:
|
|
48
|
-
...
|
|
41
|
+
render: i,
|
|
42
|
+
...r,
|
|
43
|
+
children: a
|
|
49
44
|
});
|
|
50
45
|
};
|
|
51
|
-
|
|
46
|
+
m.displayName = "AlertDialog.Action";
|
|
52
47
|
//#endregion
|
|
53
48
|
//#region src/alert-dialog/AlertDialogBody.tsx
|
|
54
|
-
var
|
|
49
|
+
var h = ({ children: e, className: t, inset: r = !1, ref: i, ...s }) => {
|
|
55
50
|
let u = a(null), d = c(i, u), { withFade: p } = f(), { overflow: m } = l(u);
|
|
56
51
|
return /* @__PURE__ */ o("div", {
|
|
57
52
|
"data-spark-component": "alert-dialog-body",
|
|
@@ -66,115 +61,117 @@ var g = ({ children: e, className: t, inset: r = !1, ref: i, ...s }) => {
|
|
|
66
61
|
children: e
|
|
67
62
|
});
|
|
68
63
|
};
|
|
69
|
-
|
|
64
|
+
h.displayName = "AlertDialog.Body";
|
|
70
65
|
//#endregion
|
|
71
66
|
//#region src/alert-dialog/AlertDialogCancel.tsx
|
|
72
|
-
var
|
|
73
|
-
let { cancelRef:
|
|
67
|
+
var g = ({ asChild: e = !1, ref: n, children: r, ...i }) => {
|
|
68
|
+
let { cancelRef: a } = f(), l = c(n, a), { renderProp: u, innerChildren: d } = t(e, r);
|
|
74
69
|
return /* @__PURE__ */ o(s.Close, {
|
|
75
|
-
ref:
|
|
70
|
+
ref: l,
|
|
76
71
|
"data-spark-component": "alert-dialog-cancel",
|
|
77
|
-
render:
|
|
78
|
-
...
|
|
72
|
+
render: u,
|
|
73
|
+
...i,
|
|
74
|
+
children: d
|
|
79
75
|
});
|
|
80
76
|
};
|
|
81
|
-
|
|
77
|
+
g.displayName = "AlertDialog.Cancel";
|
|
82
78
|
//#endregion
|
|
83
79
|
//#region src/alert-dialog/AlertDialogContent.tsx
|
|
84
|
-
var
|
|
80
|
+
var _ = ({ className: t, ref: r, initialFocus: i, ...a }) => {
|
|
85
81
|
let { cancelRef: c } = f(), l = i === void 0 ? () => c.current : i;
|
|
86
82
|
return /* @__PURE__ */ o(s.Popup, {
|
|
87
83
|
ref: r,
|
|
88
84
|
"data-spark-component": "alert-dialog-content",
|
|
89
85
|
role: "alertdialog",
|
|
90
|
-
className: (r) => n(
|
|
86
|
+
className: (r) => n(e({
|
|
91
87
|
size: "md",
|
|
92
88
|
isNarrow: !0
|
|
93
|
-
}), "min-w-[min(288px,calc(100vw-2rem))]", "transition-all duration-150", "data-starting-style:scale-90 data-starting-style:opacity-0", "data-ending-style:scale-90 data-ending-style:opacity-0", typeof
|
|
89
|
+
}), "min-w-[min(288px,calc(100vw-2rem))]", "transition-all duration-150", "data-starting-style:scale-90 data-starting-style:opacity-0", "data-ending-style:scale-90 data-ending-style:opacity-0", typeof t == "function" ? t(r) : t),
|
|
94
90
|
initialFocus: l,
|
|
95
91
|
...a
|
|
96
92
|
});
|
|
97
93
|
};
|
|
98
|
-
|
|
94
|
+
_.displayName = "AlertDialog.Content";
|
|
99
95
|
//#endregion
|
|
100
96
|
//#region src/alert-dialog/AlertDialogDescription.tsx
|
|
101
|
-
var
|
|
97
|
+
var v = (e) => /* @__PURE__ */ o(s.Description, {
|
|
102
98
|
"data-spark-component": "alert-dialog-description",
|
|
103
99
|
...e
|
|
104
100
|
});
|
|
105
|
-
|
|
101
|
+
v.displayName = "AlertDialog.Description";
|
|
106
102
|
//#endregion
|
|
107
103
|
//#region src/alert-dialog/AlertDialogFooter.tsx
|
|
108
|
-
var
|
|
104
|
+
var y = ({ children: e, className: t, ref: r, ...i }) => /* @__PURE__ */ o("footer", {
|
|
109
105
|
"data-spark-component": "alert-dialog-footer",
|
|
110
106
|
ref: r,
|
|
111
107
|
className: n(t, ["px-xl", "py-lg"]),
|
|
112
108
|
...i,
|
|
113
109
|
children: e
|
|
114
110
|
});
|
|
115
|
-
|
|
111
|
+
y.displayName = "AlertDialog.Footer";
|
|
116
112
|
//#endregion
|
|
117
113
|
//#region src/alert-dialog/AlertDialogHeader.tsx
|
|
118
|
-
var
|
|
114
|
+
var b = ({ children: e, className: t, ref: r, ...i }) => /* @__PURE__ */ o("header", {
|
|
119
115
|
"data-spark-component": "alert-dialog-header",
|
|
120
116
|
ref: r,
|
|
121
117
|
className: n(t, ["px-xl", "py-lg"]),
|
|
122
118
|
...i,
|
|
123
119
|
children: e
|
|
124
120
|
});
|
|
125
|
-
|
|
121
|
+
b.displayName = "AlertDialog.Header";
|
|
126
122
|
//#endregion
|
|
127
123
|
//#region src/alert-dialog/AlertDialogOverlay.tsx
|
|
128
|
-
var
|
|
124
|
+
var x = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Backdrop, {
|
|
129
125
|
"data-spark-component": "alert-dialog-overlay",
|
|
130
126
|
className: (t) => n("z-overlay fixed top-0 left-0 h-screen w-screen", "bg-overlay/dim-1", "data-starting-style:animate-fade-in", "data-ending-style:animate-fade-out", typeof e == "function" ? e(t) : e),
|
|
131
127
|
...t
|
|
132
128
|
});
|
|
133
|
-
|
|
129
|
+
x.displayName = "AlertDialog.Overlay";
|
|
134
130
|
//#endregion
|
|
135
131
|
//#region src/alert-dialog/AlertDialogPortal.tsx
|
|
136
|
-
var
|
|
132
|
+
var S = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Portal, {
|
|
137
133
|
"data-spark-component": "alert-dialog-portal",
|
|
138
134
|
className: n(e, "z-modal absolute"),
|
|
139
135
|
...t
|
|
140
136
|
});
|
|
141
|
-
|
|
137
|
+
S.displayName = "AlertDialog.Portal";
|
|
142
138
|
//#endregion
|
|
143
139
|
//#region src/alert-dialog/AlertDialogTitle.tsx
|
|
144
|
-
var
|
|
140
|
+
var C = ({ className: e, ...t }) => /* @__PURE__ */ o(s.Title, {
|
|
145
141
|
"data-spark-component": "alert-dialog-title",
|
|
146
142
|
className: n("text-headline-1 text-on-surface", e),
|
|
147
143
|
...t
|
|
148
144
|
});
|
|
149
|
-
|
|
145
|
+
C.displayName = "AlertDialog.Title";
|
|
150
146
|
//#endregion
|
|
151
147
|
//#region src/alert-dialog/AlertDialogTrigger.tsx
|
|
152
|
-
var
|
|
153
|
-
let
|
|
148
|
+
var w = ({ asChild: e = !1, children: n, ...r }) => {
|
|
149
|
+
let { renderProp: i, innerChildren: a } = t(e, n);
|
|
154
150
|
return /* @__PURE__ */ o(s.Trigger, {
|
|
155
151
|
"data-spark-component": "alert-dialog-trigger",
|
|
156
|
-
render:
|
|
157
|
-
...
|
|
152
|
+
render: i,
|
|
153
|
+
...r,
|
|
154
|
+
children: a
|
|
158
155
|
});
|
|
159
156
|
};
|
|
160
|
-
|
|
157
|
+
w.displayName = "AlertDialog.Trigger";
|
|
161
158
|
//#endregion
|
|
162
159
|
//#region src/alert-dialog/index.ts
|
|
163
|
-
var
|
|
164
|
-
Action:
|
|
165
|
-
Body:
|
|
166
|
-
Cancel:
|
|
167
|
-
Content:
|
|
168
|
-
Description:
|
|
169
|
-
Footer:
|
|
170
|
-
Header:
|
|
171
|
-
Overlay:
|
|
172
|
-
Portal:
|
|
173
|
-
Title:
|
|
174
|
-
Trigger:
|
|
160
|
+
var T = Object.assign(p, {
|
|
161
|
+
Action: m,
|
|
162
|
+
Body: h,
|
|
163
|
+
Cancel: g,
|
|
164
|
+
Content: _,
|
|
165
|
+
Description: v,
|
|
166
|
+
Footer: y,
|
|
167
|
+
Header: b,
|
|
168
|
+
Overlay: x,
|
|
169
|
+
Portal: S,
|
|
170
|
+
Title: C,
|
|
171
|
+
Trigger: w
|
|
175
172
|
});
|
|
176
|
-
|
|
173
|
+
T.displayName = "AlertDialog", T.Action.displayName = "AlertDialog.Action", T.Body.displayName = "AlertDialog.Body", T.Cancel.displayName = "AlertDialog.Cancel", T.Content.displayName = "AlertDialog.Content", T.Description.displayName = "AlertDialog.Description", T.Footer.displayName = "AlertDialog.Footer", T.Header.displayName = "AlertDialog.Header", T.Overlay.displayName = "AlertDialog.Overlay", T.Portal.displayName = "AlertDialog.Portal", T.Title.displayName = "AlertDialog.Title", T.Trigger.displayName = "AlertDialog.Trigger";
|
|
177
174
|
//#endregion
|
|
178
|
-
export {
|
|
175
|
+
export { T as AlertDialog, f as useAlertDialog };
|
|
179
176
|
|
|
180
177
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":[],"sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/useRenderSlot.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n children,\n withFade = false,\n cancelRef,\n}: {\n children: ReactNode\n withFade?: boolean\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n return (\n <AlertDialogContext\n value={{\n cancelRef,\n withFade,\n }}\n >\n {children}\n </AlertDialogContext>\n )\n}\n\nexport const useAlertDialog = () => {\n const context = useContext(AlertDialogContext)\n\n if (!context) {\n throw Error('useAlertDialog must be used within an AlertDialog provider')\n }\n\n return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Root>,\n 'onOpenChange' | 'render'\n> {\n /**\n * Specifies if the dialog is open or not.\n */\n open?: boolean\n /**\n * Default open state.\n */\n defaultOpen?: boolean\n /**\n * Handler executed on every dialog open state change.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n */\n withFade?: boolean\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n const handleOpenChange = onOpenChange\n ? (open: boolean, _eventDetails: unknown) => {\n onOpenChange(open)\n }\n : undefined\n\n return (\n <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n <BaseAlertDialog.Root\n data-spark-component=\"alert-dialog\"\n onOpenChange={handleOpenChange}\n {...props}\n />\n </AlertDialogProvider>\n )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n const Component = asChild ? Slot : defaultTag\n\n return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogActionProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Close>,\n 'render'\n> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog and confirms the action. Renders a <button> element.\n */\nexport const AlertDialogAction = ({ asChild = false, ...props }: AlertDialogActionProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n data-spark-component=\"alert-dialog-action\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n children: ReactNode\n className?: string\n tabIndex?: number\n ref?: Ref<HTMLDivElement>\n inset?: boolean\n}\n\n/**\n * The scrollable body section of the alert dialog. Renders a <div> element.\n */\nexport const AlertDialogBody = ({\n children,\n className,\n inset = false,\n ref: forwardedRef,\n ...rest\n}: AlertDialogBodyProps): ReactElement => {\n const scrollAreaRef = useRef<HTMLDivElement>(null)\n const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n const { withFade } = useAlertDialog()\n const { overflow } = useScrollOverflow(scrollAreaRef)\n\n return (\n <div\n data-spark-component=\"alert-dialog-body\"\n ref={ref}\n className={cx(\n 'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n 'transition-all duration-300',\n {\n ['px-xl py-lg']: !inset,\n },\n className\n )}\n style={{\n ...(withFade && {\n maskImage:\n 'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n }),\n }}\n {...rest}\n >\n {children}\n </div>\n )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogCancelProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Close>,\n 'render'\n> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog without confirming the action. Renders a <button> element.\n */\nexport const AlertDialogCancel = ({\n asChild = false,\n ref: forwardedRef,\n ...props\n}: AlertDialogCancelProps) => {\n const { cancelRef } = useAlertDialog()\n const ref = useMergeRefs(forwardedRef, cancelRef)\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Close\n ref={ref}\n data-spark-component=\"alert-dialog-cancel\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Popup>,\n 'render'\n> {\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The popup element that contains the alert dialog content. Renders a <div> element.\n */\nexport const AlertDialogContent = ({\n className,\n ref,\n initialFocus,\n ...others\n}: AlertDialogContentProps) => {\n const { cancelRef } = useAlertDialog()\n\n // Default: focus the cancel button when dialog opens\n // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n return (\n <BaseAlertDialog.Popup\n ref={ref}\n data-spark-component=\"alert-dialog-content\"\n role=\"alertdialog\"\n className={state =>\n cx(\n dialogContentStyles({ size: 'md', isNarrow: true }),\n 'min-w-[min(288px,calc(100vw-2rem))]',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n // Transition with opacity and scale for smooth open/close animations\n 'transition-all duration-150',\n 'data-starting-style:scale-90 data-starting-style:opacity-0',\n 'data-ending-style:scale-90 data-ending-style:opacity-0',\n typeof className === 'function' ? className(state) : className\n )\n }\n initialFocus={handleInitialFocus}\n {...others}\n />\n )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Description>,\n 'render'\n> {\n ref?: Ref<HTMLParagraphElement>\n}\n\n/**\n * A paragraph with additional information about the dialog. Renders a <p> element.\n */\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The footer section of the alert dialog, typically containing action buttons. Renders a <footer> element.\n */\nexport const AlertDialogFooter = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogFooterProps): ReactElement => (\n <footer\n data-spark-component=\"alert-dialog-footer\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The header section of the alert dialog. Renders a <header> element.\n */\nexport const AlertDialogHeader = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n <header\n data-spark-component=\"alert-dialog-header\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Backdrop>,\n 'render'\n> {\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The backdrop element that dims the rest of the page. Renders a <div> element.\n */\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n return (\n <BaseAlertDialog.Backdrop\n data-spark-component=\"alert-dialog-overlay\"\n className={state =>\n cx(\n 'z-overlay fixed top-0 left-0 h-screen w-screen',\n 'bg-overlay/dim-1',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n 'data-starting-style:animate-fade-in',\n 'data-ending-style:animate-fade-out',\n typeof className === 'function' ? className(state) : className\n )\n }\n {...props}\n />\n )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\n/**\n * A portal that renders the dialog in a different part of the DOM. Renders a <div> element.\n */\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n return (\n <BaseAlertDialog.Portal\n data-spark-component=\"alert-dialog-portal\"\n className={cx(className, 'z-modal absolute')}\n {...props}\n />\n )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Title>,\n 'render'\n> {\n ref?: Ref<HTMLHeadingElement>\n}\n\n/**\n * The title of the alert dialog, announced to assistive technology. Renders an <h2> element.\n */\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n return (\n <BaseAlertDialog.Title\n data-spark-component=\"alert-dialog-title\"\n className={cx('text-headline-1 text-on-surface', className)}\n {...props}\n />\n )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface AlertDialogTriggerProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Trigger>,\n 'render'\n> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that opens the alert dialog. Renders a <button> element.\n */\nexport const AlertDialogTrigger = ({ asChild = false, ...props }: AlertDialogTriggerProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAlertDialog.Trigger\n data-spark-component=\"alert-dialog-trigger\"\n render={renderSlot}\n {...props}\n />\n )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\n/**\n * A modal dialog that interrupts the user with important content and requires a response.\n */\nexport const AlertDialog: typeof Root & {\n Action: typeof AlertDialogAction\n Body: typeof AlertDialogBody\n Cancel: typeof AlertDialogCancel\n Content: typeof AlertDialogContent\n Description: typeof AlertDialogDescription\n Footer: typeof AlertDialogFooter\n Header: typeof AlertDialogHeader\n Overlay: typeof AlertDialogOverlay\n Portal: typeof AlertDialogPortal\n Title: typeof AlertDialogTitle\n Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n Action: AlertDialogAction,\n Body: AlertDialogBody,\n Cancel: AlertDialogCancel,\n Content: AlertDialogContent,\n Description: AlertDialogDescription,\n Footer: AlertDialogFooter,\n Header: AlertDialogHeader,\n Overlay: AlertDialogOverlay,\n Portal: AlertDialogPortal,\n Title: AlertDialogTitle,\n Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../../src/alert-dialog/AlertDialogContext.tsx","../../src/alert-dialog/AlertDialog.tsx","../../src/alert-dialog/AlertDialogAction.tsx","../../src/alert-dialog/AlertDialogBody.tsx","../../src/alert-dialog/AlertDialogCancel.tsx","../../src/alert-dialog/AlertDialogContent.tsx","../../src/alert-dialog/AlertDialogDescription.tsx","../../src/alert-dialog/AlertDialogFooter.tsx","../../src/alert-dialog/AlertDialogHeader.tsx","../../src/alert-dialog/AlertDialogOverlay.tsx","../../src/alert-dialog/AlertDialogPortal.tsx","../../src/alert-dialog/AlertDialogTitle.tsx","../../src/alert-dialog/AlertDialogTrigger.tsx","../../src/alert-dialog/index.ts"],"sourcesContent":["import { createContext, MutableRefObject, type ReactNode, useContext } from 'react'\n\nexport interface AlertDialogContextValue {\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n withFade: boolean\n}\n\nexport const AlertDialogContext = createContext<AlertDialogContextValue | null>(null)\n\nexport const AlertDialogProvider = ({\n children,\n withFade = false,\n cancelRef,\n}: {\n children: ReactNode\n withFade?: boolean\n cancelRef: MutableRefObject<HTMLButtonElement | null>\n}) => {\n return (\n <AlertDialogContext\n value={{\n cancelRef,\n withFade,\n }}\n >\n {children}\n </AlertDialogContext>\n )\n}\n\nexport const useAlertDialog = () => {\n const context = useContext(AlertDialogContext)\n\n if (!context) {\n throw Error('useAlertDialog must be used within an AlertDialog provider')\n }\n\n return context\n}\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref, useRef } from 'react'\n\nimport { AlertDialogProvider } from './AlertDialogContext'\n\nexport interface AlertDialogProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Root>,\n 'onOpenChange' | 'render'\n> {\n /**\n * Specifies if the dialog is open or not.\n */\n open?: boolean\n /**\n * Default open state.\n */\n defaultOpen?: boolean\n /**\n * Handler executed on every dialog open state change.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n */\n withFade?: boolean\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const AlertDialog = ({ onOpenChange, withFade = false, ...props }: AlertDialogProps) => {\n const cancelRef = useRef<HTMLButtonElement | null>(null)\n\n const handleOpenChange = onOpenChange\n ? (open: boolean, _eventDetails: unknown) => {\n onOpenChange(open)\n }\n : undefined\n\n return (\n <AlertDialogProvider withFade={withFade} cancelRef={cancelRef}>\n <BaseAlertDialog.Root\n data-spark-component=\"alert-dialog\"\n onOpenChange={handleOpenChange}\n {...props}\n />\n </AlertDialogProvider>\n )\n}\n\nAlertDialog.displayName = 'AlertDialog'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogActionProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Close>,\n 'render'\n> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog and confirms the action. Renders a <button> element.\n */\nexport const AlertDialogAction = ({\n asChild = false,\n children,\n ...props\n}: AlertDialogActionProps) => {\n const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n return (\n <BaseAlertDialog.Close\n data-spark-component=\"alert-dialog-action\"\n render={renderProp}\n {...props}\n >\n {innerChildren}\n </BaseAlertDialog.Close>\n )\n}\n\nAlertDialogAction.displayName = 'AlertDialog.Action'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogBodyProps {\n children: ReactNode\n className?: string\n tabIndex?: number\n ref?: Ref<HTMLDivElement>\n inset?: boolean\n}\n\n/**\n * The scrollable body section of the alert dialog. Renders a <div> element.\n */\nexport const AlertDialogBody = ({\n children,\n className,\n inset = false,\n ref: forwardedRef,\n ...rest\n}: AlertDialogBodyProps): ReactElement => {\n const scrollAreaRef = useRef<HTMLDivElement>(null)\n const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n const { withFade } = useAlertDialog()\n const { overflow } = useScrollOverflow(scrollAreaRef)\n\n return (\n <div\n data-spark-component=\"alert-dialog-body\"\n ref={ref}\n className={cx(\n 'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n 'transition-all duration-300',\n {\n ['px-xl py-lg']: !inset,\n },\n className\n )}\n style={{\n ...(withFade && {\n maskImage:\n 'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n }),\n }}\n {...rest}\n >\n {children}\n </div>\n )\n}\n\nAlertDialogBody.displayName = 'AlertDialog.Body'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogCancelProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Close>,\n 'render'\n> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that closes the dialog without confirming the action. Renders a <button> element.\n */\nexport const AlertDialogCancel = ({\n asChild = false,\n ref: forwardedRef,\n children,\n ...props\n}: AlertDialogCancelProps) => {\n const { cancelRef } = useAlertDialog()\n const ref = useMergeRefs(forwardedRef, cancelRef)\n const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n return (\n <BaseAlertDialog.Close\n ref={ref}\n data-spark-component=\"alert-dialog-cancel\"\n render={renderProp}\n {...props}\n >\n {innerChildren}\n </BaseAlertDialog.Close>\n )\n}\n\nAlertDialogCancel.displayName = 'AlertDialog.Cancel'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nimport { dialogContentStyles } from '../dialog/DialogContent.styles'\nimport { useAlertDialog } from './AlertDialogContext'\n\nexport interface AlertDialogContentProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Popup>,\n 'render'\n> {\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The popup element that contains the alert dialog content. Renders a <div> element.\n */\nexport const AlertDialogContent = ({\n className,\n ref,\n initialFocus,\n ...others\n}: AlertDialogContentProps) => {\n const { cancelRef } = useAlertDialog()\n\n // Default: focus the cancel button when dialog opens\n // Users can override by passing their own initialFocus prop (RefObject, false, true, or function)\n const handleInitialFocus = initialFocus !== undefined ? initialFocus : () => cancelRef.current\n\n return (\n <BaseAlertDialog.Popup\n ref={ref}\n data-spark-component=\"alert-dialog-content\"\n role=\"alertdialog\"\n className={state =>\n cx(\n dialogContentStyles({ size: 'md', isNarrow: true }),\n 'min-w-[min(288px,calc(100vw-2rem))]',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n // Transition with opacity and scale for smooth open/close animations\n 'transition-all duration-150',\n 'data-starting-style:scale-90 data-starting-style:opacity-0',\n 'data-ending-style:scale-90 data-ending-style:opacity-0',\n typeof className === 'function' ? className(state) : className\n )\n }\n initialFocus={handleInitialFocus}\n {...others}\n />\n )\n}\n\nAlertDialogContent.displayName = 'AlertDialog.Content'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogDescriptionProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Description>,\n 'render'\n> {\n ref?: Ref<HTMLParagraphElement>\n}\n\n/**\n * A paragraph with additional information about the dialog. Renders a <p> element.\n */\nexport const AlertDialogDescription = (props: AlertDialogDescriptionProps) => {\n return <BaseAlertDialog.Description data-spark-component=\"alert-dialog-description\" {...props} />\n}\n\nAlertDialogDescription.displayName = 'AlertDialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogFooterProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The footer section of the alert dialog, typically containing action buttons. Renders a <footer> element.\n */\nexport const AlertDialogFooter = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogFooterProps): ReactElement => (\n <footer\n data-spark-component=\"alert-dialog-footer\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </footer>\n)\n\nAlertDialogFooter.displayName = 'AlertDialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface AlertDialogHeaderProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The header section of the alert dialog. Renders a <header> element.\n */\nexport const AlertDialogHeader = ({\n children,\n className,\n ref,\n ...rest\n}: AlertDialogHeaderProps): ReactElement => (\n <header\n data-spark-component=\"alert-dialog-header\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </header>\n)\n\nAlertDialogHeader.displayName = 'AlertDialog.Header'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogOverlayProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Backdrop>,\n 'render'\n> {\n ref?: Ref<HTMLDivElement>\n}\n\n/**\n * The backdrop element that dims the rest of the page. Renders a <div> element.\n */\nexport const AlertDialogOverlay = ({ className, ...props }: AlertDialogOverlayProps) => {\n return (\n <BaseAlertDialog.Backdrop\n data-spark-component=\"alert-dialog-overlay\"\n className={state =>\n cx(\n 'z-overlay fixed top-0 left-0 h-screen w-screen',\n 'bg-overlay/dim-1',\n // Base UI automatically adds data-[starting-style] and data-[ending-style] attributes\n 'data-starting-style:animate-fade-in',\n 'data-ending-style:animate-fade-out',\n typeof className === 'function' ? className(state) : className\n )\n }\n {...props}\n />\n )\n}\n\nAlertDialogOverlay.displayName = 'AlertDialog.Overlay'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type AlertDialogPortalProps = ComponentProps<typeof BaseAlertDialog.Portal>\n\n/**\n * A portal that renders the dialog in a different part of the DOM. Renders a <div> element.\n */\nexport const AlertDialogPortal = ({ className, ...props }: AlertDialogPortalProps) => {\n return (\n <BaseAlertDialog.Portal\n data-spark-component=\"alert-dialog-portal\"\n className={cx(className, 'z-modal absolute')}\n {...props}\n />\n )\n}\n\nAlertDialogPortal.displayName = 'AlertDialog.Portal'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTitleProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Title>,\n 'render'\n> {\n ref?: Ref<HTMLHeadingElement>\n}\n\n/**\n * The title of the alert dialog, announced to assistive technology. Renders an <h2> element.\n */\nexport const AlertDialogTitle = ({ className, ...props }: AlertDialogTitleProps) => {\n return (\n <BaseAlertDialog.Title\n data-spark-component=\"alert-dialog-title\"\n className={cx('text-headline-1 text-on-surface', className)}\n {...props}\n />\n )\n}\n\nAlertDialogTitle.displayName = 'AlertDialog.Title'\n","import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface AlertDialogTriggerProps extends Omit<\n ComponentProps<typeof BaseAlertDialog.Trigger>,\n 'render'\n> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A button that opens the alert dialog. Renders a <button> element.\n */\nexport const AlertDialogTrigger = ({\n asChild = false,\n children,\n ...props\n}: AlertDialogTriggerProps) => {\n const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n return (\n <BaseAlertDialog.Trigger\n data-spark-component=\"alert-dialog-trigger\"\n render={renderProp}\n {...props}\n >\n {innerChildren}\n </BaseAlertDialog.Trigger>\n )\n}\n\nAlertDialogTrigger.displayName = 'AlertDialog.Trigger'\n","import { AlertDialog as Root } from './AlertDialog'\nimport { AlertDialogAction } from './AlertDialogAction'\nimport { AlertDialogBody } from './AlertDialogBody'\nimport { AlertDialogCancel } from './AlertDialogCancel'\nimport { AlertDialogContent } from './AlertDialogContent'\nimport { AlertDialogDescription } from './AlertDialogDescription'\nimport { AlertDialogFooter } from './AlertDialogFooter'\nimport { AlertDialogHeader } from './AlertDialogHeader'\nimport { AlertDialogOverlay } from './AlertDialogOverlay'\nimport { AlertDialogPortal } from './AlertDialogPortal'\nimport { AlertDialogTitle } from './AlertDialogTitle'\nimport { AlertDialogTrigger } from './AlertDialogTrigger'\n\nexport * from './AlertDialog'\nexport { useAlertDialog } from './AlertDialogContext'\nexport { type AlertDialogActionProps } from './AlertDialogAction'\nexport { type AlertDialogBodyProps } from './AlertDialogBody'\nexport { type AlertDialogCancelProps } from './AlertDialogCancel'\nexport { type AlertDialogContentProps } from './AlertDialogContent'\nexport { type AlertDialogDescriptionProps } from './AlertDialogDescription'\nexport { type AlertDialogFooterProps } from './AlertDialogFooter'\nexport { type AlertDialogHeaderProps } from './AlertDialogHeader'\nexport { type AlertDialogOverlayProps } from './AlertDialogOverlay'\nexport { type AlertDialogPortalProps } from './AlertDialogPortal'\nexport { type AlertDialogTitleProps } from './AlertDialogTitle'\nexport { type AlertDialogTriggerProps } from './AlertDialogTrigger'\n\n/**\n * A modal dialog that interrupts the user with important content and requires a response.\n */\nexport const AlertDialog: typeof Root & {\n Action: typeof AlertDialogAction\n Body: typeof AlertDialogBody\n Cancel: typeof AlertDialogCancel\n Content: typeof AlertDialogContent\n Description: typeof AlertDialogDescription\n Footer: typeof AlertDialogFooter\n Header: typeof AlertDialogHeader\n Overlay: typeof AlertDialogOverlay\n Portal: typeof AlertDialogPortal\n Title: typeof AlertDialogTitle\n Trigger: typeof AlertDialogTrigger\n} = Object.assign(Root, {\n Action: AlertDialogAction,\n Body: AlertDialogBody,\n Cancel: AlertDialogCancel,\n Content: AlertDialogContent,\n Description: AlertDialogDescription,\n Footer: AlertDialogFooter,\n Header: AlertDialogHeader,\n Overlay: AlertDialogOverlay,\n Portal: AlertDialogPortal,\n Title: AlertDialogTitle,\n Trigger: AlertDialogTrigger,\n})\n\nAlertDialog.displayName = 'AlertDialog'\nAlertDialog.Action.displayName = 'AlertDialog.Action'\nAlertDialog.Body.displayName = 'AlertDialog.Body'\nAlertDialog.Cancel.displayName = 'AlertDialog.Cancel'\nAlertDialog.Content.displayName = 'AlertDialog.Content'\nAlertDialog.Description.displayName = 'AlertDialog.Description'\nAlertDialog.Footer.displayName = 'AlertDialog.Footer'\nAlertDialog.Header.displayName = 'AlertDialog.Header'\nAlertDialog.Overlay.displayName = 'AlertDialog.Overlay'\nAlertDialog.Portal.displayName = 'AlertDialog.Portal'\nAlertDialog.Title.displayName = 'AlertDialog.Title'\nAlertDialog.Trigger.displayName = 'AlertDialog.Trigger'\n"],"mappings":"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"}
|
package/dist/avatar/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.js"),t=require("../slot/index.js"),n=require("../icon-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime-CMqjfN_6.js"),t=require("../slot/index.js"),n=require("../icon-CfEsla9z.js"),r=require("../icon-button-B2TM0Xby.js");let i=require("class-variance-authority"),a=require("react");a=e.t(a);let o=require("react/jsx-runtime"),s=require("@spark-ui/icons/PenOutline");var c=a.createContext(void 0),l=()=>{let e=a.useContext(c);if(!e)throw Error(`useAvatarContext must be used within an Avatar component`);return e},u={xs:24,sm:32,md:40,lg:56,xl:64,"2xl":96},d=a.forwardRef(({className:e,size:n=`xl`,isOnline:r=!1,onlineText:s,username:l,asChild:d,children:f,shape:p=`circle`,...m},h)=>{let g=d?t.Slot:`div`;return(0,o.jsx)(c,{value:a.useMemo(()=>({size:n,isOnline:r,onlineText:s,username:l,shape:p,pixelSize:u[n]}),[n,r,l,p,s]),children:(0,o.jsx)(g,{ref:h,style:{width:u[n],height:u[n]},"data-spark-component":`avatar`,className:(0,i.cx)(`relative inline-flex items-center justify-center`,e),...m,children:f})})});d.displayName=`Avatar`;var f=({className:e,children:a,asChild:c,angle:u=135,ariaLabel:d,...f})=>{let p=c?t.Slot:r.t,{pixelSize:m,shape:h}=l();function g(e){let t=(90-u)*Math.PI/180,n=e/2;return{x:n+n*Math.cos(t),y:n-n*Math.sin(t)}}let _=g(m),v=c;return(0,o.jsx)(p,{"data-spark-component":`avatar-action`,style:{position:`absolute`,...h===`circle`?{left:`${_.x}px`,top:`${_.y}px`}:{},...h===`square`?{right:`0px`,bottom:`0px`}:{}},className:(0,i.cx)(`z-raised`,h===`circle`?`-translate-x-1/2 -translate-y-1/2`:`translate-x-1/4 translate-y-1/4`,{"shadow-sm":!v},e),"aria-label":d,title:d,...v?{}:{size:`sm`,intent:`support`,design:`contrast`},...f,children:a||(0,o.jsx)(n.t,{size:`sm`,children:(0,o.jsx)(s.PenOutline,{})})})};f.displayName=`AvatarAction`;var p=({className:e,asChild:n,src:r,onLoad:s,onError:c,...u})=>{let{username:d,isOnline:f,onlineText:p}=l(),m=n?t.Slot:`img`,[h,g]=(0,a.useState)(!1),_=f&&p?`${d} (${p})`:d;return(0,a.useEffect)(()=>{g(!1)},[r]),r?(0,o.jsx)(m,{"aria-hidden":!0,className:(0,i.cx)(`absolute inset-0 size-full`,`object-cover`,{"transition-all duration-300 group-hover:scale-120":u.onClick},`focus-visible:u-outline`,h?`block`:`hidden`,e),alt:_,src:r,onLoad:e=>{g(!0),s?.(e)},onError:e=>{g(!1),c?.(e)},...u}):null};p.displayName=`AvatarImage`;var m=({angle:e=135,...t})=>{let{isOnline:n,pixelSize:r,shape:a,onlineText:s,size:c}=l();if(!n)return null;function u(t){let n=(90-e)*Math.PI/180,r=t/2;return{x:r+r*Math.cos(n),y:r-r*Math.sin(n)}}let d=u(r);return(0,o.jsx)(`div`,{"data-spark-component":`avatar-online-badge`,role:`status`,"aria-label":s,style:{...a===`circle`?{left:`${d.x}px`,top:`${d.y}px`}:{right:`0px`,bottom:`0px`}},className:(0,i.cx)(`bg-success outline-surface absolute rounded-full`,a===`circle`?`-translate-x-1/2 -translate-y-1/2`:`translate-x-1/4 translate-y-1/4`,[`lg`,`xl`,`2xl`].includes(c)?(0,i.cx)(`size-sz-12 outline-4`):(0,i.cx)(`size-sz-8 outline-2`)),...t})};m.displayName=`AvatarOnlineBadge`;var h=({className:e,children:t,...n})=>{let{size:r,username:a}=l(),s=a?.charAt(0);return(0,o.jsx)(`div`,{"aria-hidden":!0,className:(0,i.cx)(`absolute inset-0 flex size-full items-center justify-center`,`default:bg-neutral default:text-on-neutral`,{"text-display-1":r===`2xl`,"text-display-2":[`xl`,`lg`].includes(r),"text-display-3":r===`md`,"text-headline-2":r===`sm`,"text-body-2-highlight":r===`xs`},e),...n,children:t||s})};h.displayName=`AvatarPlaceholder`;var g=({asChild:e,children:n,className:r,...a})=>{let{shape:s,isOnline:c,onlineText:u,username:d}=l(),f=e?t.Slot:`div`,p=c&&u?`${d} (${u})`:d;return(0,o.jsx)(f,{...!e&&{role:`img`},"aria-label":p,title:p,className:(0,i.cx)(`group default:border-outline relative size-full overflow-hidden`,`focus-visible:u-outline`,{"default:rounded-full":s===`circle`,"default:rounded-md":s===`square`,"hover:opacity-dim-1 cursor-pointer":e||a.onClick},r),...a,children:n})};g.displayName=`AvatarUser`;var _=Object.assign(d,{Image:p,Action:f,OnlineBadge:m,User:g,Placeholder:h});_.displayName=`Avatar`,p.displayName=`Avatar.Image`,f.displayName=`Avatar.Action`,m.displayName=`Avatar.OnlineBadge`,g.displayName=`Avatar.User`,h.displayName=`Avatar.Placeholder`,exports.Avatar=_;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/avatar/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Slot as e } from "../slot/index.mjs";
|
|
2
|
-
import { t } from "../icon-
|
|
3
|
-
import { t as n } from "../icon-button-
|
|
2
|
+
import { t } from "../icon-VM_Ys9Xn.mjs";
|
|
3
|
+
import { t as n } from "../icon-button-CexCkoV0.mjs";
|
|
4
4
|
import { cx as r } from "class-variance-authority";
|
|
5
5
|
import * as i from "react";
|
|
6
6
|
import { useEffect as a, useState as o } from "react";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { VariantProps } from 'class-variance-authority';
|
|
2
2
|
export declare const styles: (props?: ({
|
|
3
|
-
intent?: "main" | "
|
|
3
|
+
intent?: "main" | "surface" | "support" | "alert" | "accent" | "success" | "info" | "neutral" | "danger" | null | undefined;
|
|
4
4
|
size?: "sm" | "md" | null | undefined;
|
|
5
5
|
type?: "relative" | "standalone" | null | undefined;
|
|
6
6
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
package/dist/badge/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("@spark-ui/internal-utils"),t=require("class-variance-authority"),n=require("react/jsx-runtime");var r=(0,t.cva)([`inline-flex h-fit`,`empty:p-0`,`text-center`,`rounded-full box-content`],{variants:{intent:(0,e.makeVariants)({main:[`bg-main`,`text-on-main`,`border-surface`],support:[`bg-support`,`text-on-support`,`border-surface`],accent:[`bg-accent`,`text-on-accent`,`border-surface`],success:[`bg-success`,`text-on-success`,`border-surface`],alert:[`bg-alert`,`text-on-alert`,`border-surface`],danger:[`bg-error`,`text-on-error`,`border-surface`],info:[`bg-info`,`text-on-info`,`border-surface`],neutral:[`bg-neutral`,`text-on-neutral`,`border-surface`],surface:[`bg-surface`,`text-on-surface`,`border-surface`]}),size:(0,e.makeVariants)({sm:[`text-small-highlight`,`px-[var(--spacing-sz-6)] py-[var(--spacing-sz-2)]`,`empty:size-sz-8`],md:[`text-caption-highlight`,`px-md py-sm`,`empty:size-sz-16`]}),type:{relative:[`absolute right-0 border-md`,`translate-x-1/2 -translate-y-1/2`],standalone:[]}},defaultVariants:{intent:`danger`,size:`md`,type:`relative`}}),i=({intent:e=`danger`,size:t=`md`,type:i=`relative`,count:a,overflowCount:o=99,"aria-label":s,className:c,...l})=>{let u=a&&a>o,d=typeof s==`function`?s({count:a,overflowCount:o}):s,f={...l,"aria-label":d};return(0,n.jsx)(`span`,{"data-spark-component":`badge`,role:`status`,className:r({intent:e,size:t,type:i,className:c}),...f,children:u?`${o}+`:a})};i.displayName=`BadgeItem`;var a=({children:e,...t})=>e?(0,n.jsxs)(`div`,{className:`relative inline-flex`,children:[e,(0,n.jsx)(i,{...t})]}):(0,n.jsx)(i,{type:`standalone`,...t});a.displayName=`Badge`,exports.Badge=a;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/badge/index.mjs
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
1
|
+
import { makeVariants as e } from "@spark-ui/internal-utils";
|
|
2
|
+
import { cva as t } from "class-variance-authority";
|
|
3
|
+
import { jsx as n, jsxs as r } from "react/jsx-runtime";
|
|
4
4
|
//#region src/badge/BadgeItem.styles.tsx
|
|
5
|
-
var i =
|
|
5
|
+
var i = t([
|
|
6
6
|
"inline-flex h-fit",
|
|
7
7
|
"empty:p-0",
|
|
8
8
|
"text-center",
|
|
9
9
|
"rounded-full box-content"
|
|
10
10
|
], {
|
|
11
11
|
variants: {
|
|
12
|
-
intent:
|
|
12
|
+
intent: e({
|
|
13
13
|
main: [
|
|
14
14
|
"bg-main",
|
|
15
15
|
"text-on-main",
|
|
@@ -56,7 +56,7 @@ var i = e([
|
|
|
56
56
|
"border-surface"
|
|
57
57
|
]
|
|
58
58
|
}),
|
|
59
|
-
size:
|
|
59
|
+
size: e({
|
|
60
60
|
sm: [
|
|
61
61
|
"text-small-highlight",
|
|
62
62
|
"px-[var(--spacing-sz-6)] py-[var(--spacing-sz-2)]",
|
|
@@ -78,7 +78,7 @@ var i = e([
|
|
|
78
78
|
size: "md",
|
|
79
79
|
type: "relative"
|
|
80
80
|
}
|
|
81
|
-
}), a = ({ intent: e = "danger", size:
|
|
81
|
+
}), a = ({ intent: e = "danger", size: t = "md", type: r = "relative", count: a, overflowCount: o = 99, "aria-label": s, className: c, ...l }) => {
|
|
82
82
|
let u = a && a > o, d = typeof s == "function" ? s({
|
|
83
83
|
count: a,
|
|
84
84
|
overflowCount: o
|
|
@@ -86,12 +86,12 @@ var i = e([
|
|
|
86
86
|
...l,
|
|
87
87
|
"aria-label": d
|
|
88
88
|
};
|
|
89
|
-
return /* @__PURE__ */
|
|
89
|
+
return /* @__PURE__ */ n("span", {
|
|
90
90
|
"data-spark-component": "badge",
|
|
91
91
|
role: "status",
|
|
92
92
|
className: i({
|
|
93
93
|
intent: e,
|
|
94
|
-
size:
|
|
94
|
+
size: t,
|
|
95
95
|
type: r,
|
|
96
96
|
className: c
|
|
97
97
|
}),
|
|
@@ -102,12 +102,12 @@ var i = e([
|
|
|
102
102
|
a.displayName = "BadgeItem";
|
|
103
103
|
//#endregion
|
|
104
104
|
//#region src/badge/Badge.tsx
|
|
105
|
-
var o = ({ children: e, ...
|
|
105
|
+
var o = ({ children: e, ...t }) => e ? /* @__PURE__ */ r("div", {
|
|
106
106
|
className: "relative inline-flex",
|
|
107
|
-
children: [e, /* @__PURE__ */
|
|
108
|
-
}) : /* @__PURE__ */
|
|
107
|
+
children: [e, /* @__PURE__ */ n(a, { ...t })]
|
|
108
|
+
}) : /* @__PURE__ */ n(a, {
|
|
109
109
|
type: "standalone",
|
|
110
|
-
...
|
|
110
|
+
...t
|
|
111
111
|
});
|
|
112
112
|
o.displayName = "Badge";
|
|
113
113
|
//#endregion
|
package/dist/breadcrumb/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../slot/index.js"),t=require("../icon-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../slot/index.js"),t=require("../icon-CfEsla9z.js"),n=require("../text-link/index.js");let r=require("class-variance-authority"),i=require("react/jsx-runtime"),a=require("@spark-ui/icons/ArrowVerticalRight");var o=({className:e,"aria-label":t,ref:n,...a})=>(0,i.jsx)(`nav`,{"data-spark-component":`breadcrumb`,ref:n,"aria-label":t,className:(0,r.cx)(`text-caption text-neutral`,e),children:(0,i.jsx)(`ol`,{className:(0,r.cx)(`gap-sm flex flex-wrap items-center break-words`),...a})});o.displayName=`Breadcrumb.Breadcrumb`;var s=({asChild:t=!1,className:n,children:a,...o})=>(0,i.jsx)(t?e.Slot:`span`,{"data-spark-component":`breadcrumb-current-page`,role:`link`,"aria-disabled":!0,"aria-current":`page`,className:(0,r.cx)(`inline! overflow-hidden font-medium text-ellipsis whitespace-nowrap text-current`,n),...o,children:a});s.displayName=`Breadcrumb.CurrentPage`;var c=({className:e,...t})=>(0,i.jsx)(`li`,{"data-spark-component":`breadcrumb-item`,className:(0,r.cx)(`min-w-none gap-sm inline-flex items-center`,e),...t});c.displayName=`Breadcrumb.Item`;var l=({asChild:t=!1,className:a,bold:o=!0,intent:s=`current`,underline:c=!0,href:l,ref:u,...d})=>(0,i.jsx)(t?e.Slot:n.TextLink,{"data-spark-component":`breadcrumb-link`,href:l,ref:u,className:(0,r.cx)(`inline! overflow-hidden text-ellipsis whitespace-nowrap`,a),bold:o,intent:s,underline:c,...d});l.displayName=`Breadcrumb.Link`;var u=({asChild:n=!1,className:o,children:s,ref:c,...l})=>(0,i.jsx)(n?e.Slot:`li`,{role:`presentation`,"aria-hidden":!0,"data-spark-component":`breadcrumb-separator`,ref:c,className:(0,r.cx)(`gap-sm inline-flex items-center`,o),...l,children:s??(0,i.jsx)(t.t,{children:(0,i.jsx)(a.ArrowVerticalRight,{})})});u.displayName=`Breadcrumb.Separator`;var d=Object.assign(o,{Item:c,Link:l,CurrentPage:s,Separator:u});d.displayName=`Breadcrumb`,c.displayName=`Breadcrumb.Item`,l.displayName=`Breadcrumb.Link`,s.displayName=`Breadcrumb.CurrentPage`,u.displayName=`Breadcrumb.Separator`,exports.Breadcrumb=d;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Slot as e } from "../slot/index.mjs";
|
|
2
|
-
import { t } from "../icon-
|
|
2
|
+
import { t } from "../icon-VM_Ys9Xn.mjs";
|
|
3
3
|
import { TextLink as n } from "../text-link/index.mjs";
|
|
4
4
|
import { cx as r } from "class-variance-authority";
|
|
5
5
|
import { jsx as i } from "react/jsx-runtime";
|
|
@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
|
|
|
2
2
|
export declare const buttonStyles: (props?: ({
|
|
3
3
|
design?: "filled" | "outlined" | "contrast" | "ghost" | "tinted" | null | undefined;
|
|
4
4
|
underline?: boolean | null | undefined;
|
|
5
|
-
intent?: "main" | "
|
|
5
|
+
intent?: "main" | "surface" | "support" | "alert" | "accent" | "success" | "info" | "neutral" | "ai" | "danger" | "surfaceInverse" | null | undefined;
|
|
6
6
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
7
7
|
shape?: "square" | "rounded" | "pill" | null | undefined;
|
|
8
8
|
disabled?: boolean | null | undefined;
|
package/dist/button/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../button-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../button-3vvMrf1L.js");exports.Button=e.t;
|
package/dist/button/index.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as e } from "../button-
|
|
1
|
+
import { t as e } from "../button-DBNjh3Bi.mjs";
|
|
2
2
|
export { e as Button };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require("./slot/index.js"),t=require("./spinner-CmPypfJR.js");let n=require("class-variance-authority"),r=require("react"),i=require("react/jsx-runtime"),a=require("@spark-ui/internal-utils");var o=(0,n.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`rounded-button`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{underline:{true:[`underline`]},appearance:{primary:[`bg-main`,`text-on-main`,`rounded-button`,`enabled:hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`enabled:focus-visible:bg-main-hovered`],secondary:[`bg-support`,`text-on-support`,`rounded-button`,`enabled:hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`enabled:focus-visible:bg-support-hovered`],tertiary:[`border-outline`,`border-sm`,`bg-surface`,`text-on-surface`,`rounded-button`,`enabled:hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`enabled:focus-visible:bg-surface-hovered`],contrast:[`bg-surface`,`text-on-surface`,`rounded-button`,`enabled:hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`enabled:focus-visible:bg-surface-hovered`],ghost:[`text-on-surface default:-mx-md px-md enabled:hover:bg-surface-hovered`],success:[`border-outline`,`border-sm`,`bg-transparent`,`text-success`,`rounded-button`,`enabled:hover:bg-success-container`,`enabled:active:bg-success-container`,`enabled:focus-visible:bg-success-container`],danger:[`border-outline`,`border-sm`,`bg-transparent`,`text-error`,`rounded-button`,`enabled:hover:bg-error-container`,`enabled:active:bg-error-container`,`enabled:focus-visible:bg-error-container`],boost:[`bg-accent`,`text-on-accent`,`rounded-button`,`enabled:hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`enabled:focus-visible:bg-accent-hovered`],AI:[`bg-ai`,`text-on-ai`,`rounded-button`,`enabled:hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`enabled:focus-visible:bg-ai-hovered`]},size:(0,a.makeVariants)({sm:[`min-w-sz-32 h-sz-32`],md:[`min-w-sz-44 h-sz-44`],lg:[`min-w-sz-56 h-sz-56`]}),disabled:{true:[`cursor-not-allowed opacity-dim-3`],false:[`cursor-pointer`]}},defaultVariants:{size:`md`}}),s=[{intent:`main`,design:`filled`,class:(0,a.tw)([`bg-main`,`text-on-main`,`hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`focus-visible:bg-main-hovered`])},{intent:`support`,design:`filled`,class:(0,a.tw)([`bg-support`,`text-on-support`,`hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`focus-visible:bg-support-hovered`])},{intent:`accent`,design:`filled`,class:(0,a.tw)([`bg-accent`,`text-on-accent`,`hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`focus-visible:bg-accent-hovered`])},{intent:`ai`,design:`filled`,class:(0,a.tw)([`bg-ai`,`text-on-ai`,`hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`focus-visible:bg-ai-hovered`])},{intent:`success`,design:`filled`,class:(0,a.tw)([`bg-success`,`text-on-success`,`hover:bg-success-hovered`,`enabled:active:bg-success-hovered`,`focus-visible:bg-success-hovered`])},{intent:`alert`,design:`filled`,class:(0,a.tw)([`bg-alert`,`text-on-alert`,`hover:bg-alert-hovered`,`enabled:active:bg-alert-hovered`,`focus-visible:bg-alert-hovered`])},{intent:`danger`,design:`filled`,class:(0,a.tw)([`text-on-error bg-error`,`hover:bg-error-hovered enabled:active:bg-error-hovered`,`focus-visible:bg-error-hovered`])},{intent:`info`,design:`filled`,class:(0,a.tw)([`text-on-error bg-info`,`hover:bg-info-hovered enabled:active:bg-info-hovered`,`focus-visible:bg-info-hovered`])},{intent:`neutral`,design:`filled`,class:(0,a.tw)([`bg-neutral`,`text-on-neutral`,`hover:bg-neutral-hovered`,`enabled:active:bg-neutral-hovered`,`focus-visible:bg-neutral-hovered`])},{intent:`surface`,design:`filled`,class:(0,a.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`filled`,class:(0,a.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],c=[{intent:`main`,design:`ghost`,class:(0,a.tw)([`text-on-main-container`,`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`])},{intent:`support`,design:`ghost`,class:(0,a.tw)([`text-on-support-container`,`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`])},{intent:`accent`,design:`ghost`,class:(0,a.tw)([`text-on-accent-container`,`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`])},{intent:`ai`,design:`ghost`,class:(0,a.tw)([`text-on-ai-container`,`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`])},{intent:`success`,design:`ghost`,class:(0,a.tw)([`text-on-success-container`,`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`])},{intent:`alert`,design:`ghost`,class:(0,a.tw)([`text-on-alert-container`,`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`])},{intent:`danger`,design:`ghost`,class:(0,a.tw)([`text-on-error-container`,`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`])},{intent:`info`,design:`ghost`,class:(0,a.tw)([`text-on-info-container`,`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`])},{intent:`neutral`,design:`ghost`,class:(0,a.tw)([`text-on-neutral-container`,`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`])},{intent:`surface`,design:`ghost`,class:(0,a.tw)([`text-surface`,`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`])},{intent:`surfaceInverse`,design:`ghost`,class:(0,a.tw)([`text-surface-inverse`,`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`])}],l=[{intent:`main`,design:`outlined`,class:(0,a.tw)([`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`text-main`])},{intent:`support`,design:`outlined`,class:(0,a.tw)([`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`text-support`])},{intent:`accent`,design:`outlined`,class:(0,a.tw)([`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`text-accent`])},{intent:`ai`,design:`outlined`,class:(0,a.tw)([`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`,`text-ai`])},{intent:`success`,design:`outlined`,class:(0,a.tw)([`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`text-success`])},{intent:`alert`,design:`outlined`,class:(0,a.tw)([`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`text-alert`])},{intent:`danger`,design:`outlined`,class:(0,a.tw)([`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`text-error`])},{intent:`info`,design:`outlined`,class:(0,a.tw)([`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`text-info`])},{intent:`neutral`,design:`outlined`,class:(0,a.tw)([`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`text-neutral`])},{intent:`surface`,design:`outlined`,class:(0,a.tw)([`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`text-surface`])},{intent:`surfaceInverse`,design:`outlined`,class:(0,a.tw)([`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`,`text-surface-inverse`])}],u=[{intent:`main`,design:`tinted`,class:(0,a.tw)([`bg-main-container`,`text-on-main-container`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`tinted`,class:(0,a.tw)([`bg-support-container`,`text-on-support-container`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`tinted`,class:(0,a.tw)([`bg-accent-container`,`text-on-accent-container`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`tinted`,class:(0,a.tw)([`bg-ai-container`,`text-on-ai-container`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`tinted`,class:(0,a.tw)([`bg-success-container`,`text-on-success-container`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`tinted`,class:(0,a.tw)([`bg-alert-container`,`text-on-alert-container`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`tinted`,class:(0,a.tw)([`bg-error-container`,`text-on-error-container`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`tinted`,class:(0,a.tw)([`bg-info-container`,`text-on-info-container`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`tinted`,class:(0,a.tw)([`bg-neutral-container`,`text-on-neutral-container`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`tinted`,class:(0,a.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`tinted`,class:(0,a.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],d=[{intent:`main`,design:`contrast`,class:(0,a.tw)([`text-on-main-contaier bg-surface`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`contrast`,class:(0,a.tw)([`text-on-support-container bg-surface`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`contrast`,class:(0,a.tw)([`text-on-accent-container bg-surface`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`contrast`,class:(0,a.tw)([`text-on-ai-container bg-surface`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`contrast`,class:(0,a.tw)([`text-on-success-container bg-surface`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`contrast`,class:(0,a.tw)([`text-on-alert-container bg-surface`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`contrast`,class:(0,a.tw)([`text-on-error-container bg-surface`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`contrast`,class:(0,a.tw)([`text-on-info-container bg-surface`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`contrast`,class:(0,a.tw)([`text-on-neutral-container bg-surface`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`contrast`,class:(0,a.tw)([`text-on-surface bg-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`contrast`,class:(0,a.tw)([`text-on-surface-inverse bg-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],f=(0,n.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{design:(0,a.makeVariants)({filled:[],outlined:[`bg-transparent`,`border-sm`,`border-current`],tinted:[],ghost:[`default:-mx-md px-md hover:bg-main/dim-5`],contrast:[]}),underline:{true:[`underline`]},intent:(0,a.makeVariants)({main:[],support:[],accent:[],ai:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[],surfaceInverse:[]}),size:(0,a.makeVariants)({sm:[`min-w-sz-32`,`h-sz-32`],md:[`min-w-sz-44`,`h-sz-44`],lg:[`min-w-sz-56`,`h-sz-56`]}),shape:(0,a.makeVariants)({rounded:[`rounded-button`],square:[`rounded-0`],pill:[`rounded-full`]}),disabled:{true:[`cursor-not-allowed`,`opacity-dim-3`],false:[`cursor-pointer`]}},compoundVariants:[...s,...l,...u,...c,...d],defaultVariants:{design:`filled`,intent:`main`,size:`md`,shape:`rounded`}}),p=[`onClick`,`onMouseDown`,`onMouseUp`,`onMouseEnter`,`onMouseLeave`,`onMouseOver`,`onMouseOut`,`onKeyDown`,`onKeyPress`,`onKeyUp`,`onSubmit`],m=({children:a,design:s=`filled`,disabled:c=!1,ariaDisabled:l=!1,intent:u=`main`,isLoading:d=!1,loadingLabel:m,loadingText:h,shape:g=`pill`,size:_=`md`,asChild:v,className:y,underline:b=!1,appearance:x,ref:S,...C})=>{let w=v?e.Slot:`button`,T=!!c||!!l||d,E=!!c&&!l,D=(0,r.useMemo)(()=>{let e={};return T&&p.forEach(t=>{e[t]=e=>{e.type===`keydown`&&e.key===`Tab`||e.preventDefault()}}),e},[T]),O={size:`current`,className:h?`inline-block`:`absolute`,...m&&{"aria-label":m}},k=x?o({className:y,appearance:x,disabled:T,size:_,underline:b}):f({className:y,design:s,disabled:T,intent:u,shape:g,size:_,underline:b});return(0,i.jsx)(w,{"data-spark-component":`button`,...w===`button`&&{type:`button`},ref:S,className:k,disabled:E,"aria-disabled":T?!0:void 0,"aria-busy":d,"aria-live":d?`assertive`:`off`,...C,...D,children:e.wrapPolymorphicSlot(v,a,e=>d?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(t.t,{...O}),h,(0,i.jsx)(`div`,{"aria-hidden":!0,className:(0,n.cx)(`gap-md`,h?`hidden`:`inline-flex opacity-0`),children:e})]}):e)})};m.displayName=`Button`,Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return m}});
|
|
2
|
-
//# sourceMappingURL=button-
|
|
1
|
+
const e=require("./slot/index.js"),t=require("./spinner-BAreohbs.js");let n=require("@spark-ui/internal-utils"),r=require("class-variance-authority"),i=require("react"),a=require("react/jsx-runtime");var o=(0,r.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`rounded-button`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{underline:{true:[`underline`]},appearance:{primary:[`bg-main`,`text-on-main`,`rounded-button`,`enabled:hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`enabled:focus-visible:bg-main-hovered`],secondary:[`bg-support`,`text-on-support`,`rounded-button`,`enabled:hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`enabled:focus-visible:bg-support-hovered`],tertiary:[`border-outline`,`border-sm`,`bg-surface`,`text-on-surface`,`rounded-button`,`enabled:hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`enabled:focus-visible:bg-surface-hovered`],contrast:[`bg-surface`,`text-on-surface`,`rounded-button`,`enabled:hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`enabled:focus-visible:bg-surface-hovered`],ghost:[`text-on-surface default:-mx-md px-md enabled:hover:bg-surface-hovered`],success:[`border-outline`,`border-sm`,`bg-transparent`,`text-success`,`rounded-button`,`enabled:hover:bg-success-container`,`enabled:active:bg-success-container`,`enabled:focus-visible:bg-success-container`],danger:[`border-outline`,`border-sm`,`bg-transparent`,`text-error`,`rounded-button`,`enabled:hover:bg-error-container`,`enabled:active:bg-error-container`,`enabled:focus-visible:bg-error-container`],boost:[`bg-accent`,`text-on-accent`,`rounded-button`,`enabled:hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`enabled:focus-visible:bg-accent-hovered`],AI:[`bg-ai`,`text-on-ai`,`rounded-button`,`enabled:hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`enabled:focus-visible:bg-ai-hovered`]},size:(0,n.makeVariants)({sm:[`min-w-sz-32 h-sz-32`],md:[`min-w-sz-44 h-sz-44`],lg:[`min-w-sz-56 h-sz-56`]}),disabled:{true:[`cursor-not-allowed opacity-dim-3`],false:[`cursor-pointer`]}},defaultVariants:{size:`md`}}),s=[{intent:`main`,design:`filled`,class:(0,n.tw)([`bg-main`,`text-on-main`,`hover:bg-main-hovered`,`enabled:active:bg-main-hovered`,`focus-visible:bg-main-hovered`])},{intent:`support`,design:`filled`,class:(0,n.tw)([`bg-support`,`text-on-support`,`hover:bg-support-hovered`,`enabled:active:bg-support-hovered`,`focus-visible:bg-support-hovered`])},{intent:`accent`,design:`filled`,class:(0,n.tw)([`bg-accent`,`text-on-accent`,`hover:bg-accent-hovered`,`enabled:active:bg-accent-hovered`,`focus-visible:bg-accent-hovered`])},{intent:`ai`,design:`filled`,class:(0,n.tw)([`bg-ai`,`text-on-ai`,`hover:bg-ai-hovered`,`enabled:active:bg-ai-hovered`,`focus-visible:bg-ai-hovered`])},{intent:`success`,design:`filled`,class:(0,n.tw)([`bg-success`,`text-on-success`,`hover:bg-success-hovered`,`enabled:active:bg-success-hovered`,`focus-visible:bg-success-hovered`])},{intent:`alert`,design:`filled`,class:(0,n.tw)([`bg-alert`,`text-on-alert`,`hover:bg-alert-hovered`,`enabled:active:bg-alert-hovered`,`focus-visible:bg-alert-hovered`])},{intent:`danger`,design:`filled`,class:(0,n.tw)([`text-on-error bg-error`,`hover:bg-error-hovered enabled:active:bg-error-hovered`,`focus-visible:bg-error-hovered`])},{intent:`info`,design:`filled`,class:(0,n.tw)([`text-on-error bg-info`,`hover:bg-info-hovered enabled:active:bg-info-hovered`,`focus-visible:bg-info-hovered`])},{intent:`neutral`,design:`filled`,class:(0,n.tw)([`bg-neutral`,`text-on-neutral`,`hover:bg-neutral-hovered`,`enabled:active:bg-neutral-hovered`,`focus-visible:bg-neutral-hovered`])},{intent:`surface`,design:`filled`,class:(0,n.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`filled`,class:(0,n.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],c=[{intent:`main`,design:`ghost`,class:(0,n.tw)([`text-on-main-container`,`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`])},{intent:`support`,design:`ghost`,class:(0,n.tw)([`text-on-support-container`,`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`])},{intent:`accent`,design:`ghost`,class:(0,n.tw)([`text-on-accent-container`,`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`])},{intent:`ai`,design:`ghost`,class:(0,n.tw)([`text-on-ai-container`,`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`])},{intent:`success`,design:`ghost`,class:(0,n.tw)([`text-on-success-container`,`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`])},{intent:`alert`,design:`ghost`,class:(0,n.tw)([`text-on-alert-container`,`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`])},{intent:`danger`,design:`ghost`,class:(0,n.tw)([`text-on-error-container`,`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`])},{intent:`info`,design:`ghost`,class:(0,n.tw)([`text-on-info-container`,`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`])},{intent:`neutral`,design:`ghost`,class:(0,n.tw)([`text-on-neutral-container`,`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`])},{intent:`surface`,design:`ghost`,class:(0,n.tw)([`text-surface`,`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`])},{intent:`surfaceInverse`,design:`ghost`,class:(0,n.tw)([`text-surface-inverse`,`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`])}],l=[{intent:`main`,design:`outlined`,class:(0,n.tw)([`hover:bg-main/dim-5`,`enabled:active:bg-main/dim-5`,`focus-visible:bg-main/dim-5`,`text-main`])},{intent:`support`,design:`outlined`,class:(0,n.tw)([`hover:bg-support/dim-5`,`enabled:active:bg-support/dim-5`,`focus-visible:bg-support/dim-5`,`text-support`])},{intent:`accent`,design:`outlined`,class:(0,n.tw)([`hover:bg-accent/dim-5`,`enabled:active:bg-accent/dim-5`,`focus-visible:bg-accent/dim-5`,`text-accent`])},{intent:`ai`,design:`outlined`,class:(0,n.tw)([`hover:bg-ai/dim-5`,`enabled:active:bg-ai/dim-5`,`focus-visible:bg-ai/dim-5`,`text-ai`])},{intent:`success`,design:`outlined`,class:(0,n.tw)([`hover:bg-success/dim-5`,`enabled:active:bg-success/dim-5`,`focus-visible:bg-success/dim-5`,`text-success`])},{intent:`alert`,design:`outlined`,class:(0,n.tw)([`hover:bg-alert/dim-5`,`enabled:active:bg-alert/dim-5`,`focus-visible:bg-alert/dim-5`,`text-alert`])},{intent:`danger`,design:`outlined`,class:(0,n.tw)([`hover:bg-error/dim-5`,`enabled:active:bg-error/dim-5`,`focus-visible:bg-error/dim-5`,`text-error`])},{intent:`info`,design:`outlined`,class:(0,n.tw)([`hover:bg-info/dim-5`,`enabled:active:bg-info/dim-5`,`focus-visible:bg-info/dim-5`,`text-info`])},{intent:`neutral`,design:`outlined`,class:(0,n.tw)([`hover:bg-neutral/dim-5`,`enabled:active:bg-neutral/dim-5`,`focus-visible:bg-neutral/dim-5`,`text-neutral`])},{intent:`surface`,design:`outlined`,class:(0,n.tw)([`hover:bg-surface/dim-5`,`enabled:active:bg-surface/dim-5`,`focus-visible:bg-surface/dim-5`,`text-surface`])},{intent:`surfaceInverse`,design:`outlined`,class:(0,n.tw)([`hover:bg-surface-inverse/dim-5`,`enabled:active:bg-surface-inverse/dim-5`,`focus-visible:bg-surface-inverse/dim-5`,`text-surface-inverse`])}],u=[{intent:`main`,design:`tinted`,class:(0,n.tw)([`bg-main-container`,`text-on-main-container`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`tinted`,class:(0,n.tw)([`bg-support-container`,`text-on-support-container`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`tinted`,class:(0,n.tw)([`bg-accent-container`,`text-on-accent-container`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`tinted`,class:(0,n.tw)([`bg-ai-container`,`text-on-ai-container`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`tinted`,class:(0,n.tw)([`bg-success-container`,`text-on-success-container`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`tinted`,class:(0,n.tw)([`bg-alert-container`,`text-on-alert-container`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`tinted`,class:(0,n.tw)([`bg-error-container`,`text-on-error-container`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`tinted`,class:(0,n.tw)([`bg-info-container`,`text-on-info-container`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`tinted`,class:(0,n.tw)([`bg-neutral-container`,`text-on-neutral-container`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`tinted`,class:(0,n.tw)([`bg-surface`,`text-on-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`tinted`,class:(0,n.tw)([`bg-surface-inverse`,`text-on-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],d=[{intent:`main`,design:`contrast`,class:(0,n.tw)([`text-on-main-contaier bg-surface`,`hover:bg-main-container-hovered`,`enabled:active:bg-main-container-hovered`,`focus-visible:bg-main-container-hovered`])},{intent:`support`,design:`contrast`,class:(0,n.tw)([`text-on-support-container bg-surface`,`hover:bg-support-container-hovered`,`enabled:active:bg-support-container-hovered`,`focus-visible:bg-support-container-hovered`])},{intent:`accent`,design:`contrast`,class:(0,n.tw)([`text-on-accent-container bg-surface`,`hover:bg-accent-container-hovered`,`enabled:active:bg-accent-container-hovered`,`focus-visible:bg-accent-container-hovered`])},{intent:`ai`,design:`contrast`,class:(0,n.tw)([`text-on-ai-container bg-surface`,`hover:bg-ai-container-hovered`,`enabled:active:bg-ai-container-hovered`,`focus-visible:bg-ai-container-hovered`])},{intent:`success`,design:`contrast`,class:(0,n.tw)([`text-on-success-container bg-surface`,`hover:bg-success-container-hovered`,`enabled:active:bg-success-container-hovered`,`focus-visible:bg-success-container-hovered`])},{intent:`alert`,design:`contrast`,class:(0,n.tw)([`text-on-alert-container bg-surface`,`hover:bg-alert-container-hovered`,`enabled:active:bg-alert-container-hovered`,`focus-visible:bg-alert-container-hovered`])},{intent:`danger`,design:`contrast`,class:(0,n.tw)([`text-on-error-container bg-surface`,`hover:bg-error-container-hovered`,`enabled:active:bg-error-container-hovered`,`focus-visible:bg-error-container-hovered`])},{intent:`info`,design:`contrast`,class:(0,n.tw)([`text-on-info-container bg-surface`,`hover:bg-info-container-hovered`,`enabled:active:bg-info-container-hovered`,`focus-visible:bg-info-container-hovered`])},{intent:`neutral`,design:`contrast`,class:(0,n.tw)([`text-on-neutral-container bg-surface`,`hover:bg-neutral-container-hovered`,`enabled:active:bg-neutral-container-hovered`,`focus-visible:bg-neutral-container-hovered`])},{intent:`surface`,design:`contrast`,class:(0,n.tw)([`text-on-surface bg-surface`,`hover:bg-surface-hovered`,`enabled:active:bg-surface-hovered`,`focus-visible:bg-surface-hovered`])},{intent:`surfaceInverse`,design:`contrast`,class:(0,n.tw)([`text-on-surface-inverse bg-surface-inverse`,`hover:bg-surface-inverse-hovered`,`enabled:active:bg-surface-inverse-hovered`,`focus-visible:bg-surface-inverse-hovered`])}],f=(0,r.cva)([`u-shadow-border-transition`,`box-border inline-flex items-center justify-center gap-md whitespace-nowrap`,`default:px-lg`,`text-body-1-highlight`,`focus-visible:u-outline`],{variants:{design:(0,n.makeVariants)({filled:[],outlined:[`bg-transparent`,`border-sm`,`border-current`],tinted:[],ghost:[`default:-mx-md px-md hover:bg-main/dim-5`],contrast:[]}),underline:{true:[`underline`]},intent:(0,n.makeVariants)({main:[],support:[],accent:[],ai:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[],surfaceInverse:[]}),size:(0,n.makeVariants)({sm:[`min-w-sz-32`,`h-sz-32`],md:[`min-w-sz-44`,`h-sz-44`],lg:[`min-w-sz-56`,`h-sz-56`]}),shape:(0,n.makeVariants)({rounded:[`rounded-button`],square:[`rounded-0`],pill:[`rounded-full`]}),disabled:{true:[`cursor-not-allowed`,`opacity-dim-3`],false:[`cursor-pointer`]}},compoundVariants:[...s,...l,...u,...c,...d],defaultVariants:{design:`filled`,intent:`main`,size:`md`,shape:`rounded`}}),p=[`onClick`,`onMouseDown`,`onMouseUp`,`onMouseEnter`,`onMouseLeave`,`onMouseOver`,`onMouseOut`,`onKeyDown`,`onKeyPress`,`onKeyUp`,`onSubmit`],m=({children:n,design:s=`filled`,disabled:c=!1,ariaDisabled:l=!1,intent:u=`main`,isLoading:d=!1,loadingLabel:m,loadingText:h,shape:g=`pill`,size:_=`md`,asChild:v,className:y,underline:b=!1,appearance:x,ref:S,...C})=>{let w=v?e.Slot:`button`,T=!!c||!!l||d,E=!!c&&!l,D=(0,i.useMemo)(()=>{let e={};return T&&p.forEach(t=>{e[t]=e=>{e.type===`keydown`&&e.key===`Tab`||e.preventDefault()}}),e},[T]),O={size:`current`,className:h?`inline-block`:`absolute`,...m&&{"aria-label":m}},k=x?o({className:y,appearance:x,disabled:T,size:_,underline:b}):f({className:y,design:s,disabled:T,intent:u,shape:g,size:_,underline:b});return(0,a.jsx)(w,{"data-spark-component":`button`,...w===`button`&&{type:`button`},ref:S,className:k,disabled:E,"aria-disabled":T?!0:void 0,"aria-busy":d,"aria-live":d?`assertive`:`off`,...C,...D,children:e.wrapPolymorphicSlot(v,n,e=>d?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.t,{...O}),h,(0,a.jsx)(`div`,{"aria-hidden":!0,className:(0,r.cx)(`gap-md`,h?`hidden`:`inline-flex opacity-0`),children:e})]}):e)})};m.displayName=`Button`,Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return m}});
|
|
2
|
+
//# sourceMappingURL=button-3vvMrf1L.js.map
|