visits-style 2.0.0 → 2.0.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/README.md +1 -1
- package/dist/index.cjs.js +1 -1244
- package/dist/index.d.ts +447 -404
- package/dist/index.es.js +1026 -0
- package/package.json +29 -27
- package/dist/index.cjs.js.map +0 -1
- package/dist/index.d.cts +0 -404
- package/dist/index.esm.js +0 -1199
- package/dist/index.esm.js.map +0 -1
package/dist/index.esm.js
DELETED
|
@@ -1,1199 +0,0 @@
|
|
|
1
|
-
import clsx8 from 'clsx';
|
|
2
|
-
export { default as clsx } from 'clsx';
|
|
3
|
-
import { forwardRef, useMemo, useState, useRef, useCallback, useEffect, useImperativeHandle, cloneElement, Children, startTransition, createElement, useLayoutEffect } from 'react';
|
|
4
|
-
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
5
|
-
import { useId, useFloating, shift, flip, offset, autoUpdate, useTransitionStyles, useInteractions, useClick, FloatingOverlay, useHover, useClientPoint, useDismiss } from '@floating-ui/react';
|
|
6
|
-
import { createPortal } from 'react-dom';
|
|
7
|
-
|
|
8
|
-
// src/index.ts
|
|
9
|
-
|
|
10
|
-
// src/utils/merge.ts
|
|
11
|
-
function merge(a, b) {
|
|
12
|
-
if (!b) return a;
|
|
13
|
-
return a + " " + b;
|
|
14
|
-
}
|
|
15
|
-
function FormLabel({ className, ...rest }) {
|
|
16
|
-
const name = useMemo(() => clsx8("leading-none peer-disabled:opacity-70", className), [className]);
|
|
17
|
-
return /* @__PURE__ */ jsx("label", { className: name, ...rest });
|
|
18
|
-
}
|
|
19
|
-
function Field({
|
|
20
|
-
label,
|
|
21
|
-
children,
|
|
22
|
-
required,
|
|
23
|
-
htmlFor,
|
|
24
|
-
error,
|
|
25
|
-
help,
|
|
26
|
-
helpBefore,
|
|
27
|
-
className,
|
|
28
|
-
innerClass,
|
|
29
|
-
...rest
|
|
30
|
-
}) {
|
|
31
|
-
const labelName = useMemo(() => clsx8(
|
|
32
|
-
"font-medium",
|
|
33
|
-
required ? 'after:content-["*"] after:text-danger after:text-sm after:pl-0.5' : ""
|
|
34
|
-
), [required]);
|
|
35
|
-
const wrapperName = useMemo(() => merge("flex flex-col space-y-2", className), [className]);
|
|
36
|
-
return /* @__PURE__ */ jsxs("div", { className: wrapperName, ...rest, children: [
|
|
37
|
-
label ? /* @__PURE__ */ jsx(FormLabel, { className: labelName, htmlFor, children: label }) : null,
|
|
38
|
-
help && helpBefore ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted pb-2", children: help }) : null,
|
|
39
|
-
/* @__PURE__ */ jsx("div", { className: innerClass, children: cloneChildren(children, !!error) }),
|
|
40
|
-
help && !helpBefore && !error ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted", children: help }) : null,
|
|
41
|
-
error ? /* @__PURE__ */ jsx("p", { className: "text-xs text-danger", children: error }) : null
|
|
42
|
-
] });
|
|
43
|
-
}
|
|
44
|
-
function cloneChildren(children, error) {
|
|
45
|
-
const len = Children.count(children);
|
|
46
|
-
if (!len) return null;
|
|
47
|
-
if (len === 1) {
|
|
48
|
-
return cloneElement(children, { error });
|
|
49
|
-
}
|
|
50
|
-
const arr = Children.toArray(children);
|
|
51
|
-
arr[0] = cloneElement(arr[0], { error });
|
|
52
|
-
return arr;
|
|
53
|
-
}
|
|
54
|
-
function InputField({ error, unstyled, className, ...rest }) {
|
|
55
|
-
const name = useMemo(() => unstyled ? className : merge(clsx8(
|
|
56
|
-
"flex rounded-md border bg-background px-3 py-2 w-full [&_input]:placeholder:text-muted",
|
|
57
|
-
"[&_input]:disabled:opacity-50 [&_input]:focus-visible:outline-none",
|
|
58
|
-
error ? "border-danger hover:border-danger-fore" : "border-input"
|
|
59
|
-
), className), [className, error, unstyled]);
|
|
60
|
-
return /* @__PURE__ */ jsx("div", { className: name, ...rest });
|
|
61
|
-
}
|
|
62
|
-
var Input = forwardRef(({
|
|
63
|
-
className,
|
|
64
|
-
type,
|
|
65
|
-
error,
|
|
66
|
-
unstyled,
|
|
67
|
-
...rest
|
|
68
|
-
}, ref) => {
|
|
69
|
-
const name = useMemo(() => unstyled ? className : merge(clsx8(
|
|
70
|
-
"flex rounded-md border bg-background px-3 py-2 w-full placeholder:text-muted",
|
|
71
|
-
"disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring",
|
|
72
|
-
error ? "border-danger hover:border-danger-fore" : "border-input not-disabled:hover:border-input-fore",
|
|
73
|
-
type === "file" ? "file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground" : null
|
|
74
|
-
), className), [className, type, error, unstyled]);
|
|
75
|
-
return /* @__PURE__ */ jsx("input", { ref, type, className: name, ...rest });
|
|
76
|
-
});
|
|
77
|
-
Input.displayName = "Input";
|
|
78
|
-
var Input_default = Input;
|
|
79
|
-
var Textarea = forwardRef(({
|
|
80
|
-
className,
|
|
81
|
-
error,
|
|
82
|
-
unstyled,
|
|
83
|
-
...rest
|
|
84
|
-
}, ref) => {
|
|
85
|
-
const name = useMemo(() => unstyled ? className : merge(clsx8(
|
|
86
|
-
"flex rounded-md border bg-background px-3 py-2 w-full",
|
|
87
|
-
"disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring",
|
|
88
|
-
error ? "border-danger hover:border-danger-fore" : "border-input not-disabled:hover:border-input-fore"
|
|
89
|
-
), className), [className, error, unstyled]);
|
|
90
|
-
return /* @__PURE__ */ jsx("textarea", { ref, className: name, ...rest });
|
|
91
|
-
});
|
|
92
|
-
Textarea.displayName = "Textarea";
|
|
93
|
-
var Textarea_default = Textarea;
|
|
94
|
-
function Check(props) {
|
|
95
|
-
return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 30 30", ...props, children: /* @__PURE__ */ jsx("path", { d: "M11.5 18.5l-3.9-4L6 16l5.6 5.6 11.6-11.5-1.7-1.6z", fill: "currentColor" }) });
|
|
96
|
-
}
|
|
97
|
-
function Indeterminate() {
|
|
98
|
-
return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 30 30", children: /* @__PURE__ */ jsx("rect", { width: "20", height: "3", y: "13.5", x: "4.5", fill: "currentColor", stroke: "none", rx: "2" }) });
|
|
99
|
-
}
|
|
100
|
-
function Checkbox({
|
|
101
|
-
checked,
|
|
102
|
-
indeterminate,
|
|
103
|
-
className,
|
|
104
|
-
id,
|
|
105
|
-
name,
|
|
106
|
-
onChange,
|
|
107
|
-
value,
|
|
108
|
-
...rest
|
|
109
|
-
}) {
|
|
110
|
-
const innerClass = useMemo(() => merge(clsx8(
|
|
111
|
-
"inline-flex justify-center items-center border w-4.5 h-4.5 rounded",
|
|
112
|
-
"cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed",
|
|
113
|
-
checked || indeterminate ? "bg-primary text-inverted disabled:text-text disabled:bg-input disabled:border-input" : "border-input not-disabled:hover:border-input-fore"
|
|
114
|
-
), className), [checked, indeterminate, className]);
|
|
115
|
-
const handleChange = () => {
|
|
116
|
-
if (rest.disabled) return;
|
|
117
|
-
onChange?.(!checked);
|
|
118
|
-
};
|
|
119
|
-
return /* @__PURE__ */ jsxs(
|
|
120
|
-
"button",
|
|
121
|
-
{
|
|
122
|
-
type: "button",
|
|
123
|
-
role: "checkbox",
|
|
124
|
-
id: id || name,
|
|
125
|
-
className: innerClass,
|
|
126
|
-
onClick: handleChange,
|
|
127
|
-
"aria-checked": checked,
|
|
128
|
-
...rest,
|
|
129
|
-
children: [
|
|
130
|
-
checked ? /* @__PURE__ */ jsx(Check, {}) : null,
|
|
131
|
-
indeterminate && !checked ? /* @__PURE__ */ jsx(Indeterminate, {}) : null,
|
|
132
|
-
/* @__PURE__ */ jsx(
|
|
133
|
-
"input",
|
|
134
|
-
{
|
|
135
|
-
type: "checkbox",
|
|
136
|
-
"aria-hidden": "true",
|
|
137
|
-
name,
|
|
138
|
-
checked,
|
|
139
|
-
value,
|
|
140
|
-
onChange: handleChange,
|
|
141
|
-
disabled: rest.disabled,
|
|
142
|
-
style: { position: "absolute", pointerEvents: "none", top: 0, left: 0, width: 1, height: 1, opacity: 0 }
|
|
143
|
-
}
|
|
144
|
-
)
|
|
145
|
-
]
|
|
146
|
-
}
|
|
147
|
-
);
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
// src/utils/isClient.ts
|
|
151
|
-
var isClient_default = typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined";
|
|
152
|
-
|
|
153
|
-
// src/hooks/useIsomorphicLayoutEffect.ts
|
|
154
|
-
var useIsomorphicLayoutEffect_default = isClient_default ? useLayoutEffect : useEffect;
|
|
155
|
-
|
|
156
|
-
// src/components/Portal/index.tsx
|
|
157
|
-
function Portal({ children, container, disabled }) {
|
|
158
|
-
const [mountNode, setMountNode] = useState(null);
|
|
159
|
-
useIsomorphicLayoutEffect_default(() => {
|
|
160
|
-
if (!container) {
|
|
161
|
-
let dom = document.getElementById("visits-style-portals");
|
|
162
|
-
if (!dom) {
|
|
163
|
-
dom = document.createElement("div");
|
|
164
|
-
dom.id = "visits-style-portals";
|
|
165
|
-
document.body.appendChild(dom);
|
|
166
|
-
}
|
|
167
|
-
return setMountNode(dom);
|
|
168
|
-
}
|
|
169
|
-
setMountNode(container);
|
|
170
|
-
}, [container]);
|
|
171
|
-
if (disabled || !mountNode) return null;
|
|
172
|
-
return createPortal(children, mountNode);
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
// src/utils/stopPropagation.ts
|
|
176
|
-
function stopPropagation(e) {
|
|
177
|
-
if (!e) return;
|
|
178
|
-
e.stopPropagation();
|
|
179
|
-
e.preventDefault();
|
|
180
|
-
}
|
|
181
|
-
var defaultTimeout = { open: 150, close: 75 };
|
|
182
|
-
var Popover = forwardRef(({
|
|
183
|
-
position,
|
|
184
|
-
label,
|
|
185
|
-
children,
|
|
186
|
-
color = "background",
|
|
187
|
-
disabled,
|
|
188
|
-
offset: offset$1 = { x: 0, y: 6 },
|
|
189
|
-
onOpen,
|
|
190
|
-
onClose,
|
|
191
|
-
onManualClose,
|
|
192
|
-
timeout = defaultTimeout,
|
|
193
|
-
unstyled,
|
|
194
|
-
zIndex = 9996,
|
|
195
|
-
role,
|
|
196
|
-
...rest
|
|
197
|
-
}, ref) => {
|
|
198
|
-
const [open, setOpen] = useState(false);
|
|
199
|
-
const nodeId = useId();
|
|
200
|
-
const openRef = useRef(onOpen);
|
|
201
|
-
const closeRef = useRef(onClose);
|
|
202
|
-
const { refs, floatingStyles, context } = useFloating({
|
|
203
|
-
nodeId,
|
|
204
|
-
placement: position,
|
|
205
|
-
middleware: [
|
|
206
|
-
shift(),
|
|
207
|
-
flip({ fallbackAxisSideDirection: "end" }),
|
|
208
|
-
offset({ mainAxis: offset$1.y, crossAxis: offset$1.x })
|
|
209
|
-
],
|
|
210
|
-
open,
|
|
211
|
-
onOpenChange: (value) => {
|
|
212
|
-
if (value) {
|
|
213
|
-
openRef.current?.(refs.reference.current, refs.floating.current);
|
|
214
|
-
} else {
|
|
215
|
-
closeRef.current?.(refs.reference.current, refs.floating.current);
|
|
216
|
-
}
|
|
217
|
-
setOpen(value);
|
|
218
|
-
},
|
|
219
|
-
whileElementsMounted: autoUpdate
|
|
220
|
-
});
|
|
221
|
-
const { isMounted, styles } = useTransitionStyles(context, {
|
|
222
|
-
duration: timeout,
|
|
223
|
-
initial({ side }) {
|
|
224
|
-
let transform = "";
|
|
225
|
-
if (side === "top") {
|
|
226
|
-
transform = "translateY(5%) scale(0.95)";
|
|
227
|
-
} else if (side === "bottom") {
|
|
228
|
-
transform = "translateY(-5%) scale(0.95)";
|
|
229
|
-
} else if (side === "left") {
|
|
230
|
-
transform = "translateX(5%) scale(0.95)";
|
|
231
|
-
} else {
|
|
232
|
-
transform = "translateX(-5%) scale(0.95)";
|
|
233
|
-
}
|
|
234
|
-
return { opacity: 0, transform };
|
|
235
|
-
}
|
|
236
|
-
});
|
|
237
|
-
const handleBlur = useCallback((e) => {
|
|
238
|
-
stopPropagation(e);
|
|
239
|
-
if (onManualClose) return onManualClose();
|
|
240
|
-
setOpen(false);
|
|
241
|
-
closeRef.current?.(refs.reference.current, refs.floating.current);
|
|
242
|
-
}, [onManualClose]);
|
|
243
|
-
useEffect(() => {
|
|
244
|
-
if (disabled && open) return setOpen(false);
|
|
245
|
-
}, [disabled, open]);
|
|
246
|
-
useImperativeHandle(ref, () => ({
|
|
247
|
-
open: () => {
|
|
248
|
-
setOpen(true);
|
|
249
|
-
openRef.current?.(refs.reference.current, refs.floating.current);
|
|
250
|
-
},
|
|
251
|
-
close: () => {
|
|
252
|
-
setOpen(false);
|
|
253
|
-
closeRef.current?.(refs.reference.current, refs.floating.current);
|
|
254
|
-
}
|
|
255
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
256
|
-
}), []);
|
|
257
|
-
const { getFloatingProps, getReferenceProps } = useInteractions([
|
|
258
|
-
useClick(context, { enabled: !disabled })
|
|
259
|
-
]);
|
|
260
|
-
openRef.current = onOpen;
|
|
261
|
-
closeRef.current = onClose;
|
|
262
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
263
|
-
cloneElement(Children.only(label), getReferenceProps({
|
|
264
|
-
ref: refs.setReference,
|
|
265
|
-
tabIndex: 0,
|
|
266
|
-
role: "button",
|
|
267
|
-
"aria-expanded": open,
|
|
268
|
-
disabled,
|
|
269
|
-
onClick: stopPropagation
|
|
270
|
-
})),
|
|
271
|
-
/* @__PURE__ */ jsx(Portal, { disabled: disabled || !isMounted, children: /* @__PURE__ */ jsx(FloatingOverlay, { "data-testid": "vs-popover-shadow", onClick: handleBlur, style: { zIndex }, autoFocus: true, children: /* @__PURE__ */ jsx("div", { role: role || "region", ref: refs.setFloating, style: floatingStyles, children: /* @__PURE__ */ jsx(
|
|
272
|
-
PopoverContent,
|
|
273
|
-
{
|
|
274
|
-
unstyled,
|
|
275
|
-
styles,
|
|
276
|
-
...getFloatingProps({ ...rest, onClick: stopPropagation }),
|
|
277
|
-
children
|
|
278
|
-
}
|
|
279
|
-
) }) }) })
|
|
280
|
-
] });
|
|
281
|
-
});
|
|
282
|
-
Popover.displayName = "Popover";
|
|
283
|
-
var Popover_default = Popover;
|
|
284
|
-
var PopoverContent = forwardRef(({
|
|
285
|
-
className,
|
|
286
|
-
unstyled,
|
|
287
|
-
styles,
|
|
288
|
-
style = {},
|
|
289
|
-
...rest
|
|
290
|
-
}, ref) => {
|
|
291
|
-
const popoverName = useMemo(() => clsx8(
|
|
292
|
-
"z-20 w-auto h-auto outline-none transition-transform ease-in-out",
|
|
293
|
-
unstyled ? null : "border border-accent rounded-md shadow-lg p-1 bg-background",
|
|
294
|
-
className
|
|
295
|
-
), [className, unstyled]);
|
|
296
|
-
return /* @__PURE__ */ jsx("div", { ref, className: popoverName, style: { ...styles, ...style }, ...rest });
|
|
297
|
-
});
|
|
298
|
-
PopoverContent.displayName = "PopoverContent";
|
|
299
|
-
function ChevronDown(props) {
|
|
300
|
-
return /* @__PURE__ */ jsxs("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
|
|
301
|
-
/* @__PURE__ */ jsx("path", { d: "M11.7 14.8 7 9.8a.5.5 0 0 1 0-.7c.2-.2.5-.2.7 0l4.5 5c.2.2.2.6 0 .8-.1.2-.4.2-.6 0Z", fill: "currentColor" }),
|
|
302
|
-
/* @__PURE__ */ jsx("path", { d: "m16.9 9.9-4.6 5c-.2.2-.4.2-.6 0a.5.5 0 0 1 0-.8l4.5-5c.2-.2.5-.2.7 0 .1.2.1.6 0 .8Z", fill: "currentColor" })
|
|
303
|
-
] });
|
|
304
|
-
}
|
|
305
|
-
function Close(props) {
|
|
306
|
-
return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 30 30", ...props, children: /* @__PURE__ */ jsxs("g", { fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: [
|
|
307
|
-
/* @__PURE__ */ jsx("path", { d: "M26 26l-12.5-12.5L26 1" }),
|
|
308
|
-
/* @__PURE__ */ jsx("path", { d: "M1 26l12.5-12.5L1 1" })
|
|
309
|
-
] }) });
|
|
310
|
-
}
|
|
311
|
-
function Select({
|
|
312
|
-
className,
|
|
313
|
-
placeholder = "",
|
|
314
|
-
options = [],
|
|
315
|
-
error,
|
|
316
|
-
unstyled,
|
|
317
|
-
disabled,
|
|
318
|
-
value,
|
|
319
|
-
maxHeight = 408,
|
|
320
|
-
arrow,
|
|
321
|
-
onChange,
|
|
322
|
-
onClear,
|
|
323
|
-
renderItem,
|
|
324
|
-
...rest
|
|
325
|
-
}) {
|
|
326
|
-
const ref = useRef(null);
|
|
327
|
-
const [width, setWidth] = useState(0);
|
|
328
|
-
const btnName = useMemo(() => unstyled ? className : merge(clsx8(
|
|
329
|
-
"flex items-center justify-between rounded-md border bg-background px-3 py-2 w-full overflow-hidden cursor-pointer",
|
|
330
|
-
"disabled:cursor-not-allowed disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-ring",
|
|
331
|
-
error ? "border-danger hover:border-danger-fore" : "border-input not-disabled:hover:border-input-fore"
|
|
332
|
-
), className), [className, error, unstyled]);
|
|
333
|
-
const isMultiple = useMemo(() => Array.isArray(value), []);
|
|
334
|
-
const handleChange = useCallback((val) => {
|
|
335
|
-
onChange?.(val);
|
|
336
|
-
if (!isMultiple) ref.current?.close();
|
|
337
|
-
}, [onChange, isMultiple]);
|
|
338
|
-
const isSelected = useCallback((item) => {
|
|
339
|
-
if (Array.isArray(value)) return value.indexOf(item) > -1;
|
|
340
|
-
return value === item;
|
|
341
|
-
}, [value]);
|
|
342
|
-
const optionMap = useMemo(() => {
|
|
343
|
-
const map = {};
|
|
344
|
-
const items = options.filter((item) => typeof item !== "string");
|
|
345
|
-
for (let i = 0, len = items.length; i < len; i += 1) {
|
|
346
|
-
const item = items[i];
|
|
347
|
-
map[`${item.value}`] = item.label;
|
|
348
|
-
}
|
|
349
|
-
return map;
|
|
350
|
-
}, [options]);
|
|
351
|
-
const selectedLabel = useMemo(() => {
|
|
352
|
-
if (!value) return placeholder;
|
|
353
|
-
if (Array.isArray(value)) {
|
|
354
|
-
if (!value.length) return placeholder;
|
|
355
|
-
const sorted = [...value].sort();
|
|
356
|
-
const arr = [];
|
|
357
|
-
for (let i = 0, len = sorted.length; i < len; i += 1) {
|
|
358
|
-
arr[i] = optionMap[`${sorted[i]}`] || "";
|
|
359
|
-
}
|
|
360
|
-
return arr.filter(Boolean).join(",") || placeholder;
|
|
361
|
-
}
|
|
362
|
-
return optionMap[`${value}`] || placeholder;
|
|
363
|
-
}, [placeholder, value, optionMap]);
|
|
364
|
-
const isEmpty = selectedLabel === placeholder;
|
|
365
|
-
const btnLabelClass = useMemo(() => clsx8(
|
|
366
|
-
"overflow-hidden overflow-ellipsis whitespace-nowrap",
|
|
367
|
-
isEmpty ? "text-muted" : "text-text"
|
|
368
|
-
), [isEmpty]);
|
|
369
|
-
const Arrow = useMemo(() => {
|
|
370
|
-
if (arrow) return arrow;
|
|
371
|
-
return /* @__PURE__ */ jsx(ChevronDown, { className: "absolute right-0 text-muted size-5" });
|
|
372
|
-
}, [arrow]);
|
|
373
|
-
const handleRender = useCallback((item, index) => {
|
|
374
|
-
if (renderItem) {
|
|
375
|
-
if (typeof item === "string") {
|
|
376
|
-
return renderItem(item, { index, selected: false, onChange: () => {
|
|
377
|
-
} });
|
|
378
|
-
}
|
|
379
|
-
return renderItem(item, {
|
|
380
|
-
index,
|
|
381
|
-
selected: isSelected(item.value),
|
|
382
|
-
onChange: () => handleChange(item.value)
|
|
383
|
-
});
|
|
384
|
-
}
|
|
385
|
-
if (typeof item === "string") {
|
|
386
|
-
return /* @__PURE__ */ jsx("h5", { className: "font-medium py-1 px-2 text-muted", children: item }, `optionheader-${index}`);
|
|
387
|
-
}
|
|
388
|
-
return /* @__PURE__ */ jsx(
|
|
389
|
-
SelectItem,
|
|
390
|
-
{
|
|
391
|
-
selected: isSelected(item.value),
|
|
392
|
-
onChange: handleChange,
|
|
393
|
-
...item
|
|
394
|
-
},
|
|
395
|
-
item.label
|
|
396
|
-
);
|
|
397
|
-
}, [renderItem, handleChange, isSelected]);
|
|
398
|
-
return /* @__PURE__ */ jsx(
|
|
399
|
-
Popover_default,
|
|
400
|
-
{
|
|
401
|
-
label: /* @__PURE__ */ jsxs("button", { type: "button", className: btnName, disabled, ...rest, children: [
|
|
402
|
-
/* @__PURE__ */ jsx("span", { className: btnLabelClass, children: selectedLabel }),
|
|
403
|
-
/* @__PURE__ */ jsxs("div", { className: "relative flex items-center pl-8 pr-3 space-x-2", children: [
|
|
404
|
-
onClear && !isEmpty ? /* @__PURE__ */ jsx(
|
|
405
|
-
"div",
|
|
406
|
-
{
|
|
407
|
-
tabIndex: -1,
|
|
408
|
-
role: "button",
|
|
409
|
-
className: "size-6 p-1.5 rounded hover:bg-accent",
|
|
410
|
-
"aria-label": "clear selected values",
|
|
411
|
-
onKeyDown: (e) => {
|
|
412
|
-
if (e.key !== "Enter" && e.key !== "Space") return;
|
|
413
|
-
onClear();
|
|
414
|
-
},
|
|
415
|
-
onClick: (e) => {
|
|
416
|
-
e.stopPropagation();
|
|
417
|
-
onClear();
|
|
418
|
-
},
|
|
419
|
-
children: /* @__PURE__ */ jsx(Close, {})
|
|
420
|
-
}
|
|
421
|
-
) : null,
|
|
422
|
-
Arrow
|
|
423
|
-
] })
|
|
424
|
-
] }),
|
|
425
|
-
ref,
|
|
426
|
-
onOpen: (elem) => setWidth(elem?.getBoundingClientRect().width || 0),
|
|
427
|
-
disabled,
|
|
428
|
-
children: /* @__PURE__ */ jsx(
|
|
429
|
-
"ul",
|
|
430
|
-
{
|
|
431
|
-
className: "overflow-y-auto flex flex-col",
|
|
432
|
-
role: "listbox",
|
|
433
|
-
style: { minWidth: width, maxWidth: "calc(100vw - 3rem)", maxHeight },
|
|
434
|
-
children: options.map(handleRender)
|
|
435
|
-
}
|
|
436
|
-
)
|
|
437
|
-
}
|
|
438
|
-
);
|
|
439
|
-
}
|
|
440
|
-
function SelectItem({ className, value, label, selected, onChange }) {
|
|
441
|
-
const name = useMemo(() => clsx8(
|
|
442
|
-
"flex items-center w-full hover:bg-accent rounded p-1",
|
|
443
|
-
className
|
|
444
|
-
), [className]);
|
|
445
|
-
return /* @__PURE__ */ jsxs(
|
|
446
|
-
"button",
|
|
447
|
-
{
|
|
448
|
-
type: "button",
|
|
449
|
-
role: "option",
|
|
450
|
-
className: name,
|
|
451
|
-
"aria-selected": selected,
|
|
452
|
-
onClick: () => onChange?.(value),
|
|
453
|
-
children: [
|
|
454
|
-
selected ? /* @__PURE__ */ jsx(Check, { className: "w-5 h-5 mr-1" }) : /* @__PURE__ */ jsx("div", { className: "w-5 h-1 mr-1" }),
|
|
455
|
-
label
|
|
456
|
-
]
|
|
457
|
-
}
|
|
458
|
-
);
|
|
459
|
-
}
|
|
460
|
-
function Radio({ checked, className, id, name, onChange, value, ...rest }) {
|
|
461
|
-
const innerClass = useMemo(() => clsx8(
|
|
462
|
-
"relative inline-flex justify-center items-center border border-input w-4.5 h-4.5 rounded-full",
|
|
463
|
-
"cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed not-disabled:hover:border-input-fore",
|
|
464
|
-
checked ? "[&_i]:bg-primary disabled:[&_i]:bg-text disabled:border-input" : "",
|
|
465
|
-
className
|
|
466
|
-
), [className, checked]);
|
|
467
|
-
const handleChange = () => {
|
|
468
|
-
if (rest.disabled) return;
|
|
469
|
-
onChange?.(!checked);
|
|
470
|
-
};
|
|
471
|
-
return /* @__PURE__ */ jsxs(
|
|
472
|
-
"button",
|
|
473
|
-
{
|
|
474
|
-
type: "button",
|
|
475
|
-
role: "radio",
|
|
476
|
-
id: id || name,
|
|
477
|
-
className: innerClass,
|
|
478
|
-
onClick: handleChange,
|
|
479
|
-
"aria-checked": checked,
|
|
480
|
-
...rest,
|
|
481
|
-
children: [
|
|
482
|
-
/* @__PURE__ */ jsx(
|
|
483
|
-
"i",
|
|
484
|
-
{
|
|
485
|
-
className: "block w-2.5 h-2.5 rounded-full transition-transform",
|
|
486
|
-
style: { transform: checked ? "" : "scale(0.8)", opacity: checked ? 1 : 0 }
|
|
487
|
-
}
|
|
488
|
-
),
|
|
489
|
-
/* @__PURE__ */ jsx(
|
|
490
|
-
"input",
|
|
491
|
-
{
|
|
492
|
-
type: "radio",
|
|
493
|
-
"aria-hidden": "true",
|
|
494
|
-
name,
|
|
495
|
-
checked,
|
|
496
|
-
value,
|
|
497
|
-
onChange: handleChange,
|
|
498
|
-
disabled: rest.disabled,
|
|
499
|
-
style: { position: "absolute", pointerEvents: "none", top: 0, left: 0, width: 1, height: 1, opacity: 0 }
|
|
500
|
-
}
|
|
501
|
-
)
|
|
502
|
-
]
|
|
503
|
-
}
|
|
504
|
-
);
|
|
505
|
-
}
|
|
506
|
-
var Switch = forwardRef(({
|
|
507
|
-
className,
|
|
508
|
-
checked,
|
|
509
|
-
onChange,
|
|
510
|
-
value,
|
|
511
|
-
id,
|
|
512
|
-
name,
|
|
513
|
-
...rest
|
|
514
|
-
}, ref) => {
|
|
515
|
-
const buttonName = useMemo(() => merge(clsx8(
|
|
516
|
-
"inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
|
|
517
|
-
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50",
|
|
518
|
-
"w-11",
|
|
519
|
-
checked ? "bg-primary" : "bg-input"
|
|
520
|
-
), className), [className, checked]);
|
|
521
|
-
const pointerName = useMemo(() => merge(
|
|
522
|
-
"pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform",
|
|
523
|
-
className
|
|
524
|
-
), [className]);
|
|
525
|
-
const handleChange = () => {
|
|
526
|
-
if (rest.disabled) return;
|
|
527
|
-
onChange?.(!checked);
|
|
528
|
-
};
|
|
529
|
-
return /* @__PURE__ */ jsxs(
|
|
530
|
-
"button",
|
|
531
|
-
{
|
|
532
|
-
type: "button",
|
|
533
|
-
role: "switch",
|
|
534
|
-
id: id || name,
|
|
535
|
-
className: buttonName,
|
|
536
|
-
onClick: handleChange,
|
|
537
|
-
"aria-checked": checked,
|
|
538
|
-
...rest,
|
|
539
|
-
children: [
|
|
540
|
-
/* @__PURE__ */ jsx("span", { className: pointerName, style: { transform: checked ? "translateX(100%)" : "" } }),
|
|
541
|
-
/* @__PURE__ */ jsx(
|
|
542
|
-
"input",
|
|
543
|
-
{
|
|
544
|
-
ref,
|
|
545
|
-
type: "checkbox",
|
|
546
|
-
"aria-hidden": "true",
|
|
547
|
-
name,
|
|
548
|
-
checked,
|
|
549
|
-
value,
|
|
550
|
-
onChange: handleChange,
|
|
551
|
-
disabled: rest.disabled,
|
|
552
|
-
style: { position: "absolute", pointerEvents: "none", top: 0, left: 0, width: 1, height: 1, opacity: 0 }
|
|
553
|
-
}
|
|
554
|
-
)
|
|
555
|
-
]
|
|
556
|
-
}
|
|
557
|
-
);
|
|
558
|
-
});
|
|
559
|
-
Switch.displayName = "Switch";
|
|
560
|
-
var Switch_default = Switch;
|
|
561
|
-
function Accordion({ header, show, children, timeout = 300, ...rest }) {
|
|
562
|
-
const ref = useRef(null);
|
|
563
|
-
const prevHeight = useRef(0);
|
|
564
|
-
const timeoutRef = useRef(0);
|
|
565
|
-
const init = useRef(true);
|
|
566
|
-
useEffect(() => {
|
|
567
|
-
timeoutRef.current = timeout;
|
|
568
|
-
}, [timeout]);
|
|
569
|
-
useIsomorphicLayoutEffect_default(() => {
|
|
570
|
-
if (!ref.current) return;
|
|
571
|
-
ref.current.style.overflow = "hidden";
|
|
572
|
-
ref.current.style.opacity = "1";
|
|
573
|
-
if (init.current) {
|
|
574
|
-
init.current = false;
|
|
575
|
-
ref.current.style.height = show ? "auto" : "0px";
|
|
576
|
-
if (show) {
|
|
577
|
-
window.requestAnimationFrame(() => {
|
|
578
|
-
if (!ref.current) return;
|
|
579
|
-
prevHeight.current = ref.current.offsetHeight;
|
|
580
|
-
});
|
|
581
|
-
} else {
|
|
582
|
-
window.requestAnimationFrame(() => {
|
|
583
|
-
if (!ref.current) return;
|
|
584
|
-
ref.current.style.height = "auto";
|
|
585
|
-
prevHeight.current = ref.current.offsetHeight;
|
|
586
|
-
ref.current.style.height = "0px";
|
|
587
|
-
});
|
|
588
|
-
ref.current.style.opacity = "0";
|
|
589
|
-
}
|
|
590
|
-
return;
|
|
591
|
-
}
|
|
592
|
-
if (!show) {
|
|
593
|
-
ref.current.style.height = `${prevHeight.current}px`;
|
|
594
|
-
}
|
|
595
|
-
const frameIds = [];
|
|
596
|
-
frameIds[0] = window.requestAnimationFrame(() => {
|
|
597
|
-
frameIds[1] = window.requestAnimationFrame(() => {
|
|
598
|
-
if (!ref.current) return;
|
|
599
|
-
ref.current.style.height = `${show ? prevHeight.current : 0}px`;
|
|
600
|
-
ref.current.style.opacity = show ? "1" : "0";
|
|
601
|
-
});
|
|
602
|
-
});
|
|
603
|
-
let timeoutId;
|
|
604
|
-
const timeoutCallback = () => {
|
|
605
|
-
if (!ref.current) return;
|
|
606
|
-
if (show) {
|
|
607
|
-
ref.current.style.height = "auto";
|
|
608
|
-
ref.current.style.overflow = "";
|
|
609
|
-
ref.current.style.opacity = "";
|
|
610
|
-
window.requestAnimationFrame(() => {
|
|
611
|
-
if (ref.current) {
|
|
612
|
-
prevHeight.current = ref.current.offsetHeight;
|
|
613
|
-
}
|
|
614
|
-
});
|
|
615
|
-
} else {
|
|
616
|
-
ref.current.style.height = "0px";
|
|
617
|
-
}
|
|
618
|
-
};
|
|
619
|
-
if (timeoutRef.current === 0) {
|
|
620
|
-
timeoutCallback();
|
|
621
|
-
} else {
|
|
622
|
-
timeoutId = window.setTimeout(timeoutCallback, timeoutRef.current);
|
|
623
|
-
}
|
|
624
|
-
return () => {
|
|
625
|
-
frameIds.forEach(window.cancelAnimationFrame);
|
|
626
|
-
if (timeoutId) window.clearTimeout(timeoutId);
|
|
627
|
-
};
|
|
628
|
-
}, [show]);
|
|
629
|
-
return /* @__PURE__ */ jsxs("div", { ...rest, children: [
|
|
630
|
-
header,
|
|
631
|
-
/* @__PURE__ */ jsx(
|
|
632
|
-
"div",
|
|
633
|
-
{
|
|
634
|
-
className: "transition-all ease-in-out overflow-hidden",
|
|
635
|
-
role: "region",
|
|
636
|
-
"aria-hidden": !show,
|
|
637
|
-
ref,
|
|
638
|
-
style: { transitionDuration: `${timeout}ms` },
|
|
639
|
-
children
|
|
640
|
-
}
|
|
641
|
-
)
|
|
642
|
-
] });
|
|
643
|
-
}
|
|
644
|
-
var Tooltip = forwardRef(({
|
|
645
|
-
children,
|
|
646
|
-
position = "bottom",
|
|
647
|
-
label,
|
|
648
|
-
className,
|
|
649
|
-
timeout = 150,
|
|
650
|
-
offset: offset$1 = { x: 0, y: 6 },
|
|
651
|
-
clientPoint = false,
|
|
652
|
-
disabled
|
|
653
|
-
}, ref) => {
|
|
654
|
-
const [open, setOpen] = useState(false);
|
|
655
|
-
const nodeId = useId();
|
|
656
|
-
const { refs, floatingStyles, context } = useFloating({
|
|
657
|
-
nodeId,
|
|
658
|
-
open,
|
|
659
|
-
placement: position,
|
|
660
|
-
middleware: [
|
|
661
|
-
shift(),
|
|
662
|
-
flip(),
|
|
663
|
-
offset({ mainAxis: offset$1.y, crossAxis: offset$1.x })
|
|
664
|
-
],
|
|
665
|
-
whileElementsMounted: disabled ? undefined : autoUpdate,
|
|
666
|
-
onOpenChange: setOpen
|
|
667
|
-
});
|
|
668
|
-
const { getReferenceProps, getFloatingProps } = useInteractions([
|
|
669
|
-
useHover(context, { enabled: !disabled }),
|
|
670
|
-
useClientPoint(context, { enabled: clientPoint })
|
|
671
|
-
]);
|
|
672
|
-
const { isMounted, styles } = useTransitionStyles(context, {
|
|
673
|
-
duration: timeout,
|
|
674
|
-
initial: { opacity: 0, transform: "scale(0.8)" }
|
|
675
|
-
});
|
|
676
|
-
useImperativeHandle(ref, () => ({
|
|
677
|
-
floating: refs.floating,
|
|
678
|
-
reference: refs.reference,
|
|
679
|
-
open: () => setOpen(true),
|
|
680
|
-
close: () => setOpen(false)
|
|
681
|
-
}));
|
|
682
|
-
const child = typeof children === "string" ? /* @__PURE__ */ jsx("span", { children }) : children;
|
|
683
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
684
|
-
cloneElement(Children.only(child), {
|
|
685
|
-
ref: refs.setReference,
|
|
686
|
-
...getReferenceProps()
|
|
687
|
-
}),
|
|
688
|
-
/* @__PURE__ */ jsx(Portal, { disabled: disabled || !isMounted, children: /* @__PURE__ */ jsx("div", { role: "tooltip", className: "z-[9999]", ref: refs.setFloating, ...getFloatingProps({ style: floatingStyles }), children: /* @__PURE__ */ jsx(TooltipContent, { className, style: styles, children: label }) }) })
|
|
689
|
-
] });
|
|
690
|
-
});
|
|
691
|
-
var Tooltip_default = Tooltip;
|
|
692
|
-
var TooltipContent = forwardRef(({
|
|
693
|
-
className,
|
|
694
|
-
custom,
|
|
695
|
-
...rest
|
|
696
|
-
}, ref) => {
|
|
697
|
-
const tooltipName = useMemo(() => clsx8(
|
|
698
|
-
"relative w-auto h-auto outline-none transition-transform ease-in-out whitespace-pre",
|
|
699
|
-
custom ? null : "border border-accent rounded shadow-md px-3 py-1 bg-background",
|
|
700
|
-
className
|
|
701
|
-
), [className, custom]);
|
|
702
|
-
return /* @__PURE__ */ jsx("div", { ref, className: tooltipName, ...rest });
|
|
703
|
-
});
|
|
704
|
-
function varientButton({ variant, size }) {
|
|
705
|
-
return clsx8(
|
|
706
|
-
"inline-flex items-center justify-center whitespace-nowrap transition-colors rounded-md cursor-pointer",
|
|
707
|
-
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
|
|
708
|
-
"disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-auto",
|
|
709
|
-
{
|
|
710
|
-
"bg-primary text-inverted hover:bg-primary-fore": !variant || variant === "primary",
|
|
711
|
-
"bg-info text-inverted hover:bg-info-fore": variant === "info",
|
|
712
|
-
"bg-warn text-inverted hover:bg-warn-fore": variant === "warn",
|
|
713
|
-
"bg-danger text-inverted hover:bg-danger-fore": variant === "danger",
|
|
714
|
-
"hover:bg-accent": variant === "ghost",
|
|
715
|
-
"hover:underline": variant === "link",
|
|
716
|
-
"border border-input hover:bg-accent": variant === "outline"
|
|
717
|
-
},
|
|
718
|
-
{
|
|
719
|
-
"px-2 py-1": !size,
|
|
720
|
-
"p-1.5": size === "icon"
|
|
721
|
-
}
|
|
722
|
-
);
|
|
723
|
-
}
|
|
724
|
-
function Button({ size, variant, className, ...rest }) {
|
|
725
|
-
const buttonClass = useMemo(() => clsx8(varientButton({ size, variant }), className), [size, variant, className]);
|
|
726
|
-
return /* @__PURE__ */ jsx("button", { className: buttonClass, type: "button", ...rest });
|
|
727
|
-
}
|
|
728
|
-
function Dialog({
|
|
729
|
-
open,
|
|
730
|
-
children,
|
|
731
|
-
timeout = 150,
|
|
732
|
-
padding = "0.85rem",
|
|
733
|
-
verticalAlign = "center",
|
|
734
|
-
closeOnOverlay,
|
|
735
|
-
closeOnEsc,
|
|
736
|
-
onExited,
|
|
737
|
-
className,
|
|
738
|
-
onOpenChange,
|
|
739
|
-
size,
|
|
740
|
-
...rest
|
|
741
|
-
}) {
|
|
742
|
-
const exitRef = useRef(onExited);
|
|
743
|
-
const isTransMountedRef = useRef(false);
|
|
744
|
-
const nodeId = useId();
|
|
745
|
-
const { refs, context } = useFloating({ open, onOpenChange, nodeId });
|
|
746
|
-
const { getFloatingProps } = useInteractions([
|
|
747
|
-
useDismiss(context, {
|
|
748
|
-
enabled: closeOnEsc,
|
|
749
|
-
escapeKey: closeOnEsc,
|
|
750
|
-
outsidePress: false
|
|
751
|
-
})
|
|
752
|
-
]);
|
|
753
|
-
const { isMounted, styles } = useTransitionStyles(context, {
|
|
754
|
-
duration: timeout,
|
|
755
|
-
initial: { opacity: 0, transform: "scale(0.8)" }
|
|
756
|
-
});
|
|
757
|
-
useEffect(() => {
|
|
758
|
-
if (isTransMountedRef.current === isMounted) return;
|
|
759
|
-
isTransMountedRef.current = isMounted;
|
|
760
|
-
if (isMounted) return;
|
|
761
|
-
exitRef.current?.();
|
|
762
|
-
}, [isMounted]);
|
|
763
|
-
const handleOverlayClose = useCallback(() => {
|
|
764
|
-
if (!closeOnOverlay) return;
|
|
765
|
-
onOpenChange?.(false);
|
|
766
|
-
}, [onOpenChange, closeOnOverlay]);
|
|
767
|
-
exitRef.current = onExited;
|
|
768
|
-
const overlayClass = useMemo(() => clsx8("grid bg-backdrop z-40 justify-items-center", {
|
|
769
|
-
"place-items-start items-start": verticalAlign === "start",
|
|
770
|
-
"place-items-end": verticalAlign === "end",
|
|
771
|
-
"place-items-center": verticalAlign === "center" || !verticalAlign
|
|
772
|
-
}), [verticalAlign]);
|
|
773
|
-
const dialogClass = useMemo(() => merge("transition ease-in-out", className), [className]);
|
|
774
|
-
return /* @__PURE__ */ jsx(Portal, { disabled: !isMounted, children: /* @__PURE__ */ jsx(
|
|
775
|
-
FloatingOverlay,
|
|
776
|
-
{
|
|
777
|
-
className: overlayClass,
|
|
778
|
-
"data-testid": "vs-dialog-overlay",
|
|
779
|
-
onClick: handleOverlayClose,
|
|
780
|
-
style: { padding, opacity: styles.opacity },
|
|
781
|
-
lockScroll: true,
|
|
782
|
-
children: /* @__PURE__ */ jsx(
|
|
783
|
-
DialogContent,
|
|
784
|
-
{
|
|
785
|
-
ref: refs.setFloating,
|
|
786
|
-
className: dialogClass,
|
|
787
|
-
role: "dialog",
|
|
788
|
-
size,
|
|
789
|
-
...getFloatingProps({ ...rest, style: styles, onClick: stopPropagation }),
|
|
790
|
-
children
|
|
791
|
-
}
|
|
792
|
-
)
|
|
793
|
-
}
|
|
794
|
-
) });
|
|
795
|
-
}
|
|
796
|
-
var DialogContent = forwardRef(({
|
|
797
|
-
size,
|
|
798
|
-
className,
|
|
799
|
-
...rest
|
|
800
|
-
}, ref) => {
|
|
801
|
-
const dialogClass = useMemo(() => clsx8(
|
|
802
|
-
size ? "flex flex-col bg-background shadow-lg p-5 rounded" : null,
|
|
803
|
-
{
|
|
804
|
-
"w-full max-w-sm": size === "small",
|
|
805
|
-
"w-full max-w-lg": size === "medium",
|
|
806
|
-
"w-full max-w-2xl": size === "large"
|
|
807
|
-
},
|
|
808
|
-
className
|
|
809
|
-
), [size, className]);
|
|
810
|
-
return /* @__PURE__ */ jsx("div", { ref, className: dialogClass, ...rest });
|
|
811
|
-
});
|
|
812
|
-
DialogContent.displayName = "DialogContent";
|
|
813
|
-
var defaultTimeout2 = { open: 300, close: 150 };
|
|
814
|
-
function Sheet({ open, timeout = defaultTimeout2, onOpenChange, position = "right", overlay, ...rest }) {
|
|
815
|
-
const nodeId = useId();
|
|
816
|
-
const { refs, context } = useFloating({ open, onOpenChange, nodeId });
|
|
817
|
-
const { isMounted, styles } = useTransitionStyles(context, {
|
|
818
|
-
duration: timeout,
|
|
819
|
-
initial() {
|
|
820
|
-
let transform = "translateX(75%)";
|
|
821
|
-
if (position === "left") {
|
|
822
|
-
transform = "translateX(-75%)";
|
|
823
|
-
} else if (position === "top") {
|
|
824
|
-
transform = "translateY(-75%)";
|
|
825
|
-
} else if (position === "bottom") {
|
|
826
|
-
transform = "translateY(75%)";
|
|
827
|
-
}
|
|
828
|
-
return { opacity: 0, transform };
|
|
829
|
-
}
|
|
830
|
-
});
|
|
831
|
-
const name = useMemo(() => clsx8(
|
|
832
|
-
"fixed transition-transform z-30",
|
|
833
|
-
{
|
|
834
|
-
"top-0 right-0 h-full max-h-screen": position === "right",
|
|
835
|
-
"top-0 left-0 h-full max-h-screen": position === "left",
|
|
836
|
-
"top-0 left-0 right-0 w-full max-w-screen": position === "top",
|
|
837
|
-
"bottom-0 left-0 right-0 w-full max-w-screen": position === "bottom"
|
|
838
|
-
}
|
|
839
|
-
), [position]);
|
|
840
|
-
return /* @__PURE__ */ jsxs(Portal, { disabled: !isMounted, children: [
|
|
841
|
-
overlay ? /* @__PURE__ */ jsx(
|
|
842
|
-
FloatingOverlay,
|
|
843
|
-
{
|
|
844
|
-
className: "bg-backdrop",
|
|
845
|
-
style: { opacity: styles.opacity },
|
|
846
|
-
onClick: () => onOpenChange?.(false)
|
|
847
|
-
}
|
|
848
|
-
) : null,
|
|
849
|
-
/* @__PURE__ */ jsx(
|
|
850
|
-
"div",
|
|
851
|
-
{
|
|
852
|
-
ref: refs.setFloating,
|
|
853
|
-
className: name,
|
|
854
|
-
role: "dialog",
|
|
855
|
-
style: styles,
|
|
856
|
-
children: /* @__PURE__ */ jsx(SheetContent, { ...rest })
|
|
857
|
-
}
|
|
858
|
-
)
|
|
859
|
-
] });
|
|
860
|
-
}
|
|
861
|
-
function SheetContent({ className, unstyled, ...rest }) {
|
|
862
|
-
const name = useMemo(() => unstyled ? className : merge(clsx8(
|
|
863
|
-
"relative bg-background min-w-full min-h-full border border-input shadow-lg"
|
|
864
|
-
), className), [unstyled, className]);
|
|
865
|
-
return /* @__PURE__ */ jsx("div", { className: name, ...rest });
|
|
866
|
-
}
|
|
867
|
-
function Approved(props) {
|
|
868
|
-
return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 30 30", ...props, children: [
|
|
869
|
-
/* @__PURE__ */ jsx("path", { d: "M15 29a14 14 0 0 1-9.9-4.1A14 14 0 0 1 1 15a14 14 0 0 1 4.1-9.9A14 14 0 0 1 15 1a14 14 0 0 1 9.9 4.1A14 14 0 0 1 29 15a14 14 0 0 1-4.1 9.9A14 14 0 0 1 15 29z", fill: "none" }),
|
|
870
|
-
/* @__PURE__ */ jsx("path", { d: "M15 2a13 13 0 0 0-9.2 3.8A13 13 0 0 0 2 15a13 13 0 0 0 3.8 9.2A13 13 0 0 0 15 28a13 13 0 0 0 9.2-3.8A13 13 0 0 0 28 15a13 13 0 0 0-3.8-9.2A13 13 0 0 0 15 2m0-2a15 15 0 1 1 0 30 15 15 0 0 1 0-30z", fill: "currentColor" }),
|
|
871
|
-
/* @__PURE__ */ jsx("path", { d: "m11.5 18.5-3.9-4L6 16l5.6 5.6L23.2 10l-1.7-1.6z", fill: "currentColor" })
|
|
872
|
-
] });
|
|
873
|
-
}
|
|
874
|
-
function Alert(props) {
|
|
875
|
-
return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 32 32", ...props, children: [
|
|
876
|
-
/* @__PURE__ */ jsx("path", { d: "M16 0C7.16 0 0 7.16 0 16C0 24.84 7.16 32 16 32C24.84 32 32 24.84 32 16C32 7.16 24.84 0 16 0ZM16 31C7.73 31 1 24.27 1 16C1 7.73 7.73 1 16 1C24.27 1 31 7.73 31 16C31 24.27 24.27 31 16 31Z", fill: "currentColor" }),
|
|
877
|
-
/* @__PURE__ */ jsx("path", { d: "M15.5 19.55V8.54999C15.5 8.26999 15.72 8.04999 16 8.04999C16.28 8.04999 16.5 8.26999 16.5 8.54999V19.55C16.5 19.83 16.28 20.05 16 20.05C15.72 20.05 15.5 19.83 15.5 19.55Z", fill: "currentColor" }),
|
|
878
|
-
/* @__PURE__ */ jsx("path", { d: "M16 23.95C16.5523 23.95 17 23.5023 17 22.95C17 22.3977 16.5523 21.95 16 21.95C15.4477 21.95 15 22.3977 15 22.95C15 23.5023 15.4477 23.95 16 23.95Z", fill: "currentColor" })
|
|
879
|
-
] });
|
|
880
|
-
}
|
|
881
|
-
function Caution(props) {
|
|
882
|
-
return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 52 45", ...props, children: /* @__PURE__ */ jsx("path", { d: "M50.6 37.8 29.3 2c-1.5-2.6-5.1-2.8-6.7-.3l-21.2 36c-1.7 2.6.2 6.6 3.4 6.6h42.4c3.1 0 5-4 3.4-6.6Zm-24.7.6a2.7 2.7 0 1 1 0-5.5 2.7 2.7 0 0 1 0 5.5Zm2.9-10.1c0 1.5-1.3 2.7-2.8 2.7a2.8 2.8 0 0 1-2.8-2.7V13.9c0-1.5 1.3-2.7 2.8-2.7 1.5 0 2.8 1.2 2.8 2.7v14.4Z", fill: "currentColor" }) });
|
|
883
|
-
}
|
|
884
|
-
function Spinner({ size = 20, label = "Loading...", ...rest }) {
|
|
885
|
-
return /* @__PURE__ */ jsxs("div", { role: "status", ...rest, children: [
|
|
886
|
-
/* @__PURE__ */ jsxs("svg", { "aria-hidden": "true", className: "text-accent animate-spin fill-primary", width: size, height: size, viewBox: "0 0 100 101", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
|
|
887
|
-
/* @__PURE__ */ jsx("path", { d: "M100 50.6a50 50 0 1 1-100 0 50 50 0 0 1 100 0Zm-91 0a41 41 0 1 0 82 0 41 41 0 0 0-82 0Z", fill: "currentColor" }),
|
|
888
|
-
/* @__PURE__ */ jsx("path", { d: "M94 39a4.2 4.2 0 0 0 3-5.4A50 50 0 0 0 41.7 1.3c-2.4.4-3.9 2.9-3.2 5.3a5 5 0 0 0 5.6 3.5A41 41 0 0 1 88 36 5 5 0 0 0 94 39Z", fill: "currentFill" })
|
|
889
|
-
] }),
|
|
890
|
-
/* @__PURE__ */ jsx("span", { className: "sr-only", children: label })
|
|
891
|
-
] });
|
|
892
|
-
}
|
|
893
|
-
function ToastItem({ type, label, message }) {
|
|
894
|
-
return /* @__PURE__ */ jsxs("div", { className: "flex items-center px-4 py-3 w-80 text-sm bg-background border border-input rounded-lg shadow-md m-2", children: [
|
|
895
|
-
type ? /* @__PURE__ */ jsxs("figure", { className: "mr-2", children: [
|
|
896
|
-
type === "success" ? /* @__PURE__ */ jsx(Approved, { className: "text-primary size-5" }) : null,
|
|
897
|
-
type === "info" ? /* @__PURE__ */ jsx(Alert, { className: "text-info size-5" }) : null,
|
|
898
|
-
type === "error" ? /* @__PURE__ */ jsx(Alert, { className: "text-danger size-5" }) : null,
|
|
899
|
-
type === "warn" ? /* @__PURE__ */ jsx(Caution, { className: "text-warn size-5" }) : null,
|
|
900
|
-
type === "loading" ? /* @__PURE__ */ jsx(Spinner, { size: 20 }) : null
|
|
901
|
-
] }) : null,
|
|
902
|
-
/* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
|
|
903
|
-
/* @__PURE__ */ jsx("p", { className: "font-medium leading-none", children: label }),
|
|
904
|
-
message ? /* @__PURE__ */ jsx("p", { children: message }) : null
|
|
905
|
-
] })
|
|
906
|
-
] });
|
|
907
|
-
}
|
|
908
|
-
|
|
909
|
-
// src/components/Toast/observer.ts
|
|
910
|
-
function noop() {
|
|
911
|
-
}
|
|
912
|
-
var ToastObserver = class {
|
|
913
|
-
/** システムで1つしか存在しない前提とする */
|
|
914
|
-
notify = noop;
|
|
915
|
-
lastId = 0;
|
|
916
|
-
/** internal use only */
|
|
917
|
-
subscribe = (callback) => {
|
|
918
|
-
this.notify = callback;
|
|
919
|
-
return () => {
|
|
920
|
-
this.notify = noop;
|
|
921
|
-
};
|
|
922
|
-
};
|
|
923
|
-
add = (label, config = {}) => {
|
|
924
|
-
this.lastId += 1;
|
|
925
|
-
const id = `${this.lastId}`;
|
|
926
|
-
this.notify({ id, type: "add", config: { id, label, ...config } });
|
|
927
|
-
return id;
|
|
928
|
-
};
|
|
929
|
-
/** 表示中のtoastを修正します。promiseのロード状態を表示することなどに使います */
|
|
930
|
-
update = (id, config) => {
|
|
931
|
-
this.notify({ id, type: "update", config });
|
|
932
|
-
};
|
|
933
|
-
remove = (id) => {
|
|
934
|
-
this.notify({ id, type: "remove" });
|
|
935
|
-
};
|
|
936
|
-
clear = () => {
|
|
937
|
-
this.lastId = 0;
|
|
938
|
-
};
|
|
939
|
-
};
|
|
940
|
-
var observer = new ToastObserver();
|
|
941
|
-
var observer_default = observer;
|
|
942
|
-
function ToastContainer({
|
|
943
|
-
id,
|
|
944
|
-
type,
|
|
945
|
-
index,
|
|
946
|
-
duration,
|
|
947
|
-
className,
|
|
948
|
-
children,
|
|
949
|
-
inverted,
|
|
950
|
-
timeout = 250,
|
|
951
|
-
max = 3
|
|
952
|
-
}) {
|
|
953
|
-
const isPrevMountedRef = useRef(false);
|
|
954
|
-
const [open, setOpen] = useState(false);
|
|
955
|
-
const { context, refs } = useFloating({ open, onOpenChange: setOpen, nodeId: id });
|
|
956
|
-
const { isMounted, styles } = useTransitionStyles(context, {
|
|
957
|
-
duration: timeout,
|
|
958
|
-
initial: { opacity: 0, transform: `translateY(${inverted ? "" : "-"}50%)` }
|
|
959
|
-
});
|
|
960
|
-
useLayoutEffect(() => {
|
|
961
|
-
setOpen(index <= max);
|
|
962
|
-
}, [index, max]);
|
|
963
|
-
useEffect(() => {
|
|
964
|
-
if (isPrevMountedRef.current === isMounted) return;
|
|
965
|
-
if (!isMounted) {
|
|
966
|
-
observer_default.remove(id);
|
|
967
|
-
}
|
|
968
|
-
isPrevMountedRef.current = isMounted;
|
|
969
|
-
}, [isMounted, id]);
|
|
970
|
-
useEffect(() => {
|
|
971
|
-
if (!duration) return;
|
|
972
|
-
const tId = window.setTimeout(() => setOpen(false), duration);
|
|
973
|
-
return () => window.clearTimeout(tId);
|
|
974
|
-
}, [duration, id]);
|
|
975
|
-
const handleClose = useCallback(() => {
|
|
976
|
-
if (type === "loading") return;
|
|
977
|
-
setOpen(false);
|
|
978
|
-
}, [type]);
|
|
979
|
-
const name = useMemo(() => clsx8(
|
|
980
|
-
"relative flex w-fit transition-transform ease-in-out cursor-pointer",
|
|
981
|
-
className
|
|
982
|
-
), [className]);
|
|
983
|
-
if (!isMounted) return null;
|
|
984
|
-
return /* @__PURE__ */ jsx(
|
|
985
|
-
"li",
|
|
986
|
-
{
|
|
987
|
-
role: "log",
|
|
988
|
-
tabIndex: -1,
|
|
989
|
-
ref: refs.setFloating,
|
|
990
|
-
className: name,
|
|
991
|
-
style: styles,
|
|
992
|
-
onClick: handleClose,
|
|
993
|
-
children
|
|
994
|
-
}
|
|
995
|
-
);
|
|
996
|
-
}
|
|
997
|
-
function Toast({
|
|
998
|
-
className,
|
|
999
|
-
margin = 16,
|
|
1000
|
-
position = "top-left",
|
|
1001
|
-
max,
|
|
1002
|
-
ListItem = ToastItem
|
|
1003
|
-
}) {
|
|
1004
|
-
const style = useMemo(() => {
|
|
1005
|
-
const base = { position: "fixed" };
|
|
1006
|
-
if (position.indexOf("top") > -1) {
|
|
1007
|
-
base.top = margin;
|
|
1008
|
-
} else if (position.indexOf("bottom") > -1) {
|
|
1009
|
-
base.bottom = margin;
|
|
1010
|
-
}
|
|
1011
|
-
if (position.indexOf("left") > -1) {
|
|
1012
|
-
base.left = margin;
|
|
1013
|
-
base.alignItems = "flex-start";
|
|
1014
|
-
} else if (position.indexOf("right") > -1) {
|
|
1015
|
-
base.right = margin;
|
|
1016
|
-
base.alignItems = "flex-end";
|
|
1017
|
-
} else {
|
|
1018
|
-
base.left = "50%";
|
|
1019
|
-
base.alignItems = "center";
|
|
1020
|
-
base.transform = "translateX(-50%)";
|
|
1021
|
-
}
|
|
1022
|
-
return base;
|
|
1023
|
-
}, [margin, position]);
|
|
1024
|
-
const name = useMemo(() => clsx8(
|
|
1025
|
-
"flex flex-col z-40 overflow-hidden",
|
|
1026
|
-
className
|
|
1027
|
-
), [className]);
|
|
1028
|
-
const isInvertedOrder = useMemo(() => position?.startsWith("bottom") || false, [position]);
|
|
1029
|
-
const data = useRef(/* @__PURE__ */ new Map());
|
|
1030
|
-
const [order, setOrder] = useState([]);
|
|
1031
|
-
const update = useState(0)[1];
|
|
1032
|
-
useIsomorphicLayoutEffect_default(() => observer_default.subscribe((payload) => {
|
|
1033
|
-
startTransition(() => {
|
|
1034
|
-
if (payload.type === "add") {
|
|
1035
|
-
data.current.set(payload.id, payload.config);
|
|
1036
|
-
setOrder((prev) => [...prev, payload.id]);
|
|
1037
|
-
} else if (payload.type === "remove") {
|
|
1038
|
-
const isDeleted = data.current.delete(payload.id);
|
|
1039
|
-
if (!isDeleted) return;
|
|
1040
|
-
setOrder((prev) => {
|
|
1041
|
-
const next = new Set(prev);
|
|
1042
|
-
if (!next.has(payload.id)) return prev;
|
|
1043
|
-
next.delete(payload.id);
|
|
1044
|
-
return Array.from(next);
|
|
1045
|
-
});
|
|
1046
|
-
} else if (payload.type === "update") {
|
|
1047
|
-
const d = data.current.get(payload.id);
|
|
1048
|
-
if (!d) return;
|
|
1049
|
-
data.current.set(payload.id, { ...d, ...payload.config });
|
|
1050
|
-
update((prev) => prev + 1);
|
|
1051
|
-
}
|
|
1052
|
-
});
|
|
1053
|
-
}), []);
|
|
1054
|
-
const size = order.length;
|
|
1055
|
-
return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx("ol", { className: name, style, "aria-live": "polite", children: order.map((id, i) => {
|
|
1056
|
-
const item = data.current.get(id);
|
|
1057
|
-
if (!item) return null;
|
|
1058
|
-
const { className: innerClass, duration, ...props } = item;
|
|
1059
|
-
return /* @__PURE__ */ jsx(
|
|
1060
|
-
ToastContainer,
|
|
1061
|
-
{
|
|
1062
|
-
id,
|
|
1063
|
-
index: size - i,
|
|
1064
|
-
className: innerClass,
|
|
1065
|
-
duration,
|
|
1066
|
-
inverted: isInvertedOrder,
|
|
1067
|
-
max,
|
|
1068
|
-
children: createElement(ListItem, props)
|
|
1069
|
-
},
|
|
1070
|
-
id
|
|
1071
|
-
);
|
|
1072
|
-
}) }) });
|
|
1073
|
-
}
|
|
1074
|
-
function Skeleton({ className, ...props }) {
|
|
1075
|
-
const name = useMemo(() => merge(
|
|
1076
|
-
"inline-block animate-pulse rounded-md bg-accent",
|
|
1077
|
-
className
|
|
1078
|
-
), [className]);
|
|
1079
|
-
return /* @__PURE__ */ jsx("span", { className: name, ...props });
|
|
1080
|
-
}
|
|
1081
|
-
function ButtonGroup({ className, ...rest }) {
|
|
1082
|
-
const name = useMemo(() => clsx8(
|
|
1083
|
-
"flex items-center justify-center",
|
|
1084
|
-
"[&_button]:rounded-none [&_:first-child]:rounded-bl [&_:first-child]:rounded-tl [&_:last-child]:rounded-br [&_:last-child]:rounded-tr",
|
|
1085
|
-
"[&_:first-child]:border-r-0 [&_:last-child]:border-l-0",
|
|
1086
|
-
className
|
|
1087
|
-
), [className]);
|
|
1088
|
-
return /* @__PURE__ */ jsx("div", { role: "group", className: name, ...rest });
|
|
1089
|
-
}
|
|
1090
|
-
function Progress({ value, max, className, ...rest }) {
|
|
1091
|
-
const percent = useMemo(() => value ? Math.round(value / max * 100) : 0, [value, max]);
|
|
1092
|
-
const name = useMemo(() => merge("relative overflow-hidden rounded-full bg-primary", className), [className]);
|
|
1093
|
-
return /* @__PURE__ */ jsx("div", { role: "progressbar", className: name, "aria-valuemax": max, "aria-valuemin": 0, ...rest, children: /* @__PURE__ */ jsx(
|
|
1094
|
-
"div",
|
|
1095
|
-
{
|
|
1096
|
-
className: "h-full w-full flex-1 bg-input transition-all origin-right",
|
|
1097
|
-
style: { transform: `translateX(${percent > 100 ? 100 : percent}%)` }
|
|
1098
|
-
}
|
|
1099
|
-
) });
|
|
1100
|
-
}
|
|
1101
|
-
function Divider({ className, orientation = "horizontal", ...props }) {
|
|
1102
|
-
const name = useMemo(() => merge(clsx8(
|
|
1103
|
-
"border-0 p-0 shrink-0 bg-input",
|
|
1104
|
-
orientation === "horizontal" ? "h-[1px] w-full" : "w-[1px] h-full"
|
|
1105
|
-
), className), [className, orientation]);
|
|
1106
|
-
return /* @__PURE__ */ jsx("hr", { className: name, role: "none", ...props });
|
|
1107
|
-
}
|
|
1108
|
-
function IconChevronRound(props) {
|
|
1109
|
-
return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 30 30", ...props, children: [
|
|
1110
|
-
/* @__PURE__ */ jsxs("g", { fill: "none", children: [
|
|
1111
|
-
/* @__PURE__ */ jsx("path", { d: "M15 29c-3.74 0-7.255-1.456-9.9-4.1A13.908 13.908 0 011 15c0-3.74 1.456-7.255 4.1-9.9A13.908 13.908 0 0115 1c3.74 0 7.255 1.456 9.9 4.1A13.908 13.908 0 0129 15c0 3.74-1.456 7.255-4.1 9.9A13.908 13.908 0 0115 29z" }),
|
|
1112
|
-
/* @__PURE__ */ jsx(
|
|
1113
|
-
"path",
|
|
1114
|
-
{
|
|
1115
|
-
d: "M15 2a12.915 12.915 0 00-9.192 3.808A12.915 12.915 0 002 15c0 3.472 1.352 6.737 3.808 9.192A12.915 12.915 0 0015 28c3.472 0 6.737-1.352 9.192-3.808A12.915 12.915 0 0028 15c0-3.472-1.352-6.737-3.808-9.192A12.915 12.915 0 0015 2m0-2c8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15-8.284 0-15-6.716-15-15C0 6.716 6.716 0 15 0z",
|
|
1116
|
-
fill: "currentColor"
|
|
1117
|
-
}
|
|
1118
|
-
)
|
|
1119
|
-
] }),
|
|
1120
|
-
/* @__PURE__ */ jsx(
|
|
1121
|
-
"path",
|
|
1122
|
-
{
|
|
1123
|
-
d: "M18.066 8.5l-7.567 6.731 7.567 6.2",
|
|
1124
|
-
fill: "none",
|
|
1125
|
-
stroke: "currentColor",
|
|
1126
|
-
strokeWidth: "2"
|
|
1127
|
-
}
|
|
1128
|
-
)
|
|
1129
|
-
] });
|
|
1130
|
-
}
|
|
1131
|
-
function FileRound(props) {
|
|
1132
|
-
return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 30 30", ...props, children: [
|
|
1133
|
-
/* @__PURE__ */ jsxs("g", { fill: "none", children: [
|
|
1134
|
-
/* @__PURE__ */ jsx("path", { d: "M15 29c-3.74 0-7.255-1.456-9.9-4.1A13.908 13.908 0 011 15c0-3.74 1.456-7.255 4.1-9.9A13.908 13.908 0 0115 1c3.74 0 7.255 1.456 9.9 4.1A13.908 13.908 0 0129 15c0 3.74-1.456 7.255-4.1 9.9A13.908 13.908 0 0115 29z" }),
|
|
1135
|
-
/* @__PURE__ */ jsx(
|
|
1136
|
-
"path",
|
|
1137
|
-
{
|
|
1138
|
-
d: "M15 2a12.915 12.915 0 00-9.192 3.808A12.915 12.915 0 002 15c0 3.472 1.352 6.737 3.808 9.192A12.915 12.915 0 0015 28c3.472 0 6.737-1.352 9.192-3.808A12.915 12.915 0 0028 15c0-3.472-1.352-6.737-3.808-9.192A12.915 12.915 0 0015 2m0-2c8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15-8.284 0-15-6.716-15-15C0 6.716 6.716 0 15 0z",
|
|
1139
|
-
fill: "currentColor"
|
|
1140
|
-
}
|
|
1141
|
-
)
|
|
1142
|
-
] }),
|
|
1143
|
-
/* @__PURE__ */ jsxs("g", { transform: "translate(9 7)", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
|
|
1144
|
-
/* @__PURE__ */ jsx("rect", { width: "12", height: "16", rx: "1", stroke: "none" }),
|
|
1145
|
-
/* @__PURE__ */ jsx("path", { d: "M1 1h10v14H1z" })
|
|
1146
|
-
] }),
|
|
1147
|
-
/* @__PURE__ */ jsx(
|
|
1148
|
-
"path",
|
|
1149
|
-
{
|
|
1150
|
-
fill: "currentColor",
|
|
1151
|
-
d: "M13 11h4v1.3h-4zM13 14h4v1.3h-4zM13 17h4v1.3h-4z"
|
|
1152
|
-
}
|
|
1153
|
-
)
|
|
1154
|
-
] });
|
|
1155
|
-
}
|
|
1156
|
-
function Pencil(props) {
|
|
1157
|
-
return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "17.796", height: "17.908", viewBox: "0 0 17.796 17.908", ...props, children: /* @__PURE__ */ jsx(
|
|
1158
|
-
"path",
|
|
1159
|
-
{
|
|
1160
|
-
d: "M1.254 12.674L.5 17.408l4.726-.8L17.3 4.472 13.281.5zM1.375 12.766l3.851 3.838M10.949 2.959l3.836 3.801",
|
|
1161
|
-
fill: "none",
|
|
1162
|
-
stroke: "currentColor"
|
|
1163
|
-
}
|
|
1164
|
-
) });
|
|
1165
|
-
}
|
|
1166
|
-
function User(props) {
|
|
1167
|
-
return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 30 30", ...props, children: [
|
|
1168
|
-
/* @__PURE__ */ jsxs("g", { fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
|
|
1169
|
-
/* @__PURE__ */ jsx("circle", { cx: "15", cy: "15", r: "15", stroke: "none" }),
|
|
1170
|
-
/* @__PURE__ */ jsx("circle", { cx: "15", cy: "15", r: "14" })
|
|
1171
|
-
] }),
|
|
1172
|
-
/* @__PURE__ */ jsx(
|
|
1173
|
-
"path",
|
|
1174
|
-
{
|
|
1175
|
-
d: "M8 23a6.018 6.018 0 016-6h2a6.018 6.018 0 016 6zm2.6-2h8.9a4.033 4.033 0 00-3.5-2h-1.9a4.035 4.035 0 00-3.5 2zm.4-9v-1a4.012 4.012 0 014-4 4.012 4.012 0 014 4v1a4.012 4.012 0 01-4 4 4.012 4.012 0 01-4-4zm2-1v1a2.006 2.006 0 002 2 2.006 2.006 0 002-2v-1a2.006 2.006 0 00-2-2 2.006 2.006 0 00-2 2z",
|
|
1176
|
-
fill: "currentColor"
|
|
1177
|
-
}
|
|
1178
|
-
)
|
|
1179
|
-
] });
|
|
1180
|
-
}
|
|
1181
|
-
function Refresh(props) {
|
|
1182
|
-
return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "30", height: "30", viewBox: "0 0 30 30", ...props, children: /* @__PURE__ */ jsx(
|
|
1183
|
-
"path",
|
|
1184
|
-
{
|
|
1185
|
-
d: "M15.065 0A15.069 15.069 0 00.142 13.105a1.256 1.256 0 102.478.406c0-.027.008-.055.01-.082a12.52 12.52 0 0121.3-7.226l-2.584 2.584 7.532 1.255-1.255-7.532-1.92 1.92A15 15 0 0015.065 0zm13.7 15.589A1.255 1.255 0 0027.5 16.7a12.512 12.512 0 01-21.893 6.569l1.927-1.927L0 20.086l1.255 7.532 2.572-2.572a15.02 15.02 0 0026.16-8.023 1.256 1.256 0 00-1.064-1.423 1.273 1.273 0 00-.16-.011z",
|
|
1186
|
-
fill: "currentColor"
|
|
1187
|
-
}
|
|
1188
|
-
) });
|
|
1189
|
-
}
|
|
1190
|
-
function Plus(props) {
|
|
1191
|
-
return /* @__PURE__ */ jsxs("svg", { width: "30", height: "30", viewBox: "0 0 32 32", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
|
|
1192
|
-
/* @__PURE__ */ jsx("rect", { x: "16.5", y: "9", width: "14", height: "1", rx: ".5", transform: "rotate(90 16.5 9)", fill: "currentColor" }),
|
|
1193
|
-
/* @__PURE__ */ jsx("rect", { x: "9", y: "15.5", width: "14", height: "1", rx: ".5", fill: "currentColor" })
|
|
1194
|
-
] });
|
|
1195
|
-
}
|
|
1196
|
-
|
|
1197
|
-
export { Accordion, Button, ButtonGroup, Checkbox, Dialog, Divider, Field as FormField, FormLabel, Alert as IconAlert, Approved as IconApproved, ChevronDown as IconArrowDown, Caution as IconCaution, Check as IconCheck, IconChevronRound, Close as IconClose, FileRound as IconFileRound, Pencil as IconPencil, Plus as IconPlus, Refresh as IconRefresh, User as IconUser, Input_default as Input, InputField, Skeleton as Placeholder, Popover_default as Popover, Portal, Progress, Radio, Select, Sheet, Spinner, Switch_default as Switch, Textarea_default as Textarea, Toast, ToastItem, Tooltip_default as Tooltip, merge, observer_default as toast };
|
|
1198
|
-
//# sourceMappingURL=index.esm.js.map
|
|
1199
|
-
//# sourceMappingURL=index.esm.js.map
|