@zentauri-ui/zentauri-components 1.0.0 → 1.1.1
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 +28 -23
- package/dist/ui/avatar.d.mts +59 -0
- package/dist/ui/avatar.d.ts +59 -0
- package/dist/ui/avatar.js +221 -0
- package/dist/ui/avatar.js.map +1 -0
- package/dist/ui/avatar.mjs +211 -0
- package/dist/ui/avatar.mjs.map +1 -0
- package/dist/ui/breadcrumb.d.mts +71 -0
- package/dist/ui/breadcrumb.d.ts +71 -0
- package/dist/ui/breadcrumb.js +174 -0
- package/dist/ui/breadcrumb.js.map +1 -0
- package/dist/ui/breadcrumb.mjs +161 -0
- package/dist/ui/breadcrumb.mjs.map +1 -0
- package/dist/ui/file-upload.d.mts +32 -0
- package/dist/ui/file-upload.d.ts +32 -0
- package/dist/ui/file-upload.js +142 -0
- package/dist/ui/file-upload.js.map +1 -0
- package/dist/ui/file-upload.mjs +139 -0
- package/dist/ui/file-upload.mjs.map +1 -0
- package/dist/ui/slider.d.mts +83 -0
- package/dist/ui/slider.d.ts +83 -0
- package/dist/ui/slider.js +521 -0
- package/dist/ui/slider.js.map +1 -0
- package/dist/ui/slider.mjs +511 -0
- package/dist/ui/slider.mjs.map +1 -0
- package/dist/ui/stepper.d.mts +64 -0
- package/dist/ui/stepper.d.ts +64 -0
- package/dist/ui/stepper.js +207 -0
- package/dist/ui/stepper.js.map +1 -0
- package/dist/ui/stepper.mjs +198 -0
- package/dist/ui/stepper.mjs.map +1 -0
- package/package.json +1 -1
|
@@ -0,0 +1,511 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from '../chunk-B23TPTVG.mjs';
|
|
3
|
+
import { createContext, useRef, useState, useCallback, useMemo, useContext } from 'react';
|
|
4
|
+
import { cva } from 'class-variance-authority';
|
|
5
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
6
|
+
|
|
7
|
+
var sliderRootVariants = cva("w-full select-none touch-none", {
|
|
8
|
+
variants: {
|
|
9
|
+
size: {
|
|
10
|
+
sm: "py-2",
|
|
11
|
+
md: "py-2.5",
|
|
12
|
+
lg: "py-3"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
defaultVariants: {
|
|
16
|
+
size: "md"
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
var sliderTrackVariants = cva(
|
|
20
|
+
"relative h-2 w-full shrink-0 overflow-hidden rounded-full bg-white/10",
|
|
21
|
+
{
|
|
22
|
+
variants: {
|
|
23
|
+
size: {
|
|
24
|
+
sm: "h-1.5",
|
|
25
|
+
md: "h-2",
|
|
26
|
+
lg: "h-2.5"
|
|
27
|
+
}
|
|
28
|
+
},
|
|
29
|
+
defaultVariants: {
|
|
30
|
+
size: "md"
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
var sliderRangeVariants = cva(
|
|
35
|
+
"absolute h-full rounded-full bg-gradient-to-r from-violet-500 to-indigo-400",
|
|
36
|
+
{
|
|
37
|
+
variants: {
|
|
38
|
+
appearance: {
|
|
39
|
+
default: "from-violet-500 to-indigo-400",
|
|
40
|
+
sky: "from-sky-500 to-indigo-400",
|
|
41
|
+
rose: "from-rose-500 to-indigo-400",
|
|
42
|
+
purple: "from-purple-500 to-indigo-400",
|
|
43
|
+
pink: "from-pink-500 to-indigo-400",
|
|
44
|
+
orange: "from-orange-500 to-indigo-400",
|
|
45
|
+
yellow: "from-yellow-500 to-indigo-400",
|
|
46
|
+
teal: "from-teal-500 to-indigo-400",
|
|
47
|
+
indigo: "from-indigo-500 to-indigo-400",
|
|
48
|
+
emerald: "from-emerald-500 to-teal-400",
|
|
49
|
+
amber: "from-amber-500 to-orange-400",
|
|
50
|
+
gray: "from-gray-500 to-indigo-400",
|
|
51
|
+
violet: "from-violet-500 to-indigo-400",
|
|
52
|
+
"gradient-blue": "from-blue-500 to-indigo-400",
|
|
53
|
+
"gradient-green": "from-green-500 to-indigo-400",
|
|
54
|
+
"gradient-red": "from-red-500 to-indigo-400",
|
|
55
|
+
"gradient-yellow": "from-yellow-500 to-indigo-400",
|
|
56
|
+
"gradient-purple": "from-purple-500 to-indigo-400",
|
|
57
|
+
"gradient-teal": "from-teal-500 to-indigo-400",
|
|
58
|
+
"gradient-indigo": "from-indigo-500 to-indigo-400",
|
|
59
|
+
"gradient-pink": "from-pink-500 to-indigo-400",
|
|
60
|
+
"gradient-orange": "from-orange-500 to-indigo-400"
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
defaultVariants: {
|
|
64
|
+
appearance: "default"
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
);
|
|
68
|
+
var sliderThumbVariants = cva(
|
|
69
|
+
"block size-4 rounded-full border border-white/20 bg-white shadow-md ring-offset-2 ring-offset-slate-950 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/40 disabled:pointer-events-none disabled:opacity-40",
|
|
70
|
+
{
|
|
71
|
+
variants: {
|
|
72
|
+
size: {
|
|
73
|
+
sm: "size-3.5",
|
|
74
|
+
md: "size-4",
|
|
75
|
+
lg: "size-5"
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
defaultVariants: {
|
|
79
|
+
size: "md"
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
);
|
|
83
|
+
function clamp(value, min, max) {
|
|
84
|
+
return Math.min(max, Math.max(min, value));
|
|
85
|
+
}
|
|
86
|
+
function snapToStep(value, min, step) {
|
|
87
|
+
const steps = Math.round((value - min) / step);
|
|
88
|
+
return min + steps * step;
|
|
89
|
+
}
|
|
90
|
+
var SliderContext = createContext(null);
|
|
91
|
+
function useSliderContext(component) {
|
|
92
|
+
const ctx = useContext(SliderContext);
|
|
93
|
+
if (!ctx) {
|
|
94
|
+
throw new Error(`${component} must be used within <Slider>`);
|
|
95
|
+
}
|
|
96
|
+
return ctx;
|
|
97
|
+
}
|
|
98
|
+
function computeValueFromPointer(clientX, track, min, max, step) {
|
|
99
|
+
const rect = track.getBoundingClientRect();
|
|
100
|
+
const ratio = rect.width === 0 ? 0 : (clientX - rect.left) / rect.width;
|
|
101
|
+
const raw = min + ratio * (max - min);
|
|
102
|
+
return snapToStep(clamp(raw, min, max), min, step);
|
|
103
|
+
}
|
|
104
|
+
function Slider({
|
|
105
|
+
className,
|
|
106
|
+
size = "md",
|
|
107
|
+
min = 0,
|
|
108
|
+
max = 100,
|
|
109
|
+
step = 1,
|
|
110
|
+
value: valueProp,
|
|
111
|
+
defaultValue,
|
|
112
|
+
onValueChange,
|
|
113
|
+
disabled = false,
|
|
114
|
+
appearance = "default",
|
|
115
|
+
"aria-label": ariaLabel,
|
|
116
|
+
"aria-labelledby": ariaLabelledBy,
|
|
117
|
+
children,
|
|
118
|
+
ref,
|
|
119
|
+
...rest
|
|
120
|
+
}) {
|
|
121
|
+
const trackRef = useRef(null);
|
|
122
|
+
const isControlled = valueProp !== void 0;
|
|
123
|
+
const [uncontrolled, setUncontrolled] = useState(
|
|
124
|
+
defaultValue ?? min
|
|
125
|
+
);
|
|
126
|
+
const value = isControlled ? valueProp : uncontrolled;
|
|
127
|
+
const setValue = useCallback(
|
|
128
|
+
(next) => {
|
|
129
|
+
const clamped = clamp(snapToStep(next, min, step), min, max);
|
|
130
|
+
if (!isControlled) {
|
|
131
|
+
setUncontrolled(clamped);
|
|
132
|
+
}
|
|
133
|
+
onValueChange?.(clamped);
|
|
134
|
+
},
|
|
135
|
+
[isControlled, max, min, onValueChange, step]
|
|
136
|
+
);
|
|
137
|
+
const ctx = useMemo(
|
|
138
|
+
() => ({
|
|
139
|
+
min,
|
|
140
|
+
max,
|
|
141
|
+
step,
|
|
142
|
+
value: clamp(snapToStep(value, min, step), min, max),
|
|
143
|
+
setValue,
|
|
144
|
+
disabled,
|
|
145
|
+
size: size ?? "md",
|
|
146
|
+
appearance: appearance ?? "default",
|
|
147
|
+
trackRef
|
|
148
|
+
}),
|
|
149
|
+
[appearance, disabled, max, min, setValue, size, step, value]
|
|
150
|
+
);
|
|
151
|
+
return /* @__PURE__ */ jsx(SliderContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
|
|
152
|
+
"div",
|
|
153
|
+
{
|
|
154
|
+
ref,
|
|
155
|
+
"data-slot": "slider",
|
|
156
|
+
role: "group",
|
|
157
|
+
"aria-label": ariaLabel,
|
|
158
|
+
"aria-labelledby": ariaLabelledBy,
|
|
159
|
+
className: cn(sliderRootVariants({ size }), className),
|
|
160
|
+
...rest,
|
|
161
|
+
children
|
|
162
|
+
}
|
|
163
|
+
) });
|
|
164
|
+
}
|
|
165
|
+
Slider.displayName = "Slider";
|
|
166
|
+
function SliderTrack({
|
|
167
|
+
className,
|
|
168
|
+
ref: refProp,
|
|
169
|
+
...rest
|
|
170
|
+
}) {
|
|
171
|
+
const { size, trackRef } = useSliderContext("SliderTrack");
|
|
172
|
+
return /* @__PURE__ */ jsx(
|
|
173
|
+
"div",
|
|
174
|
+
{
|
|
175
|
+
ref: (node) => {
|
|
176
|
+
trackRef.current = node;
|
|
177
|
+
if (typeof refProp === "function") {
|
|
178
|
+
refProp(node);
|
|
179
|
+
} else if (refProp) {
|
|
180
|
+
refProp.current = node;
|
|
181
|
+
}
|
|
182
|
+
},
|
|
183
|
+
"data-slot": "slider-track",
|
|
184
|
+
className: cn(sliderTrackVariants({ size }), className),
|
|
185
|
+
...rest
|
|
186
|
+
}
|
|
187
|
+
);
|
|
188
|
+
}
|
|
189
|
+
SliderTrack.displayName = "SliderTrack";
|
|
190
|
+
function SliderRange({
|
|
191
|
+
className,
|
|
192
|
+
ref,
|
|
193
|
+
...rest
|
|
194
|
+
}) {
|
|
195
|
+
const { min, max, value, appearance } = useSliderContext("SliderRange");
|
|
196
|
+
const pct = max === min ? 0 : (value - min) / (max - min) * 100;
|
|
197
|
+
return /* @__PURE__ */ jsx(
|
|
198
|
+
"div",
|
|
199
|
+
{
|
|
200
|
+
ref,
|
|
201
|
+
"data-slot": "slider-range",
|
|
202
|
+
className: cn(sliderRangeVariants({ appearance }), className),
|
|
203
|
+
style: { width: `${pct}%` },
|
|
204
|
+
...rest
|
|
205
|
+
}
|
|
206
|
+
);
|
|
207
|
+
}
|
|
208
|
+
SliderRange.displayName = "SliderRange";
|
|
209
|
+
function SliderThumb({
|
|
210
|
+
className,
|
|
211
|
+
ref: refProp,
|
|
212
|
+
...rest
|
|
213
|
+
}) {
|
|
214
|
+
const { min, max, value, step, setValue, disabled, size, trackRef } = useSliderContext("SliderThumb");
|
|
215
|
+
const pct = max === min ? 0 : (value - min) / (max - min) * 100;
|
|
216
|
+
const onPointerDown = useCallback(
|
|
217
|
+
(event) => {
|
|
218
|
+
if (disabled) {
|
|
219
|
+
return;
|
|
220
|
+
}
|
|
221
|
+
event.preventDefault();
|
|
222
|
+
const track = trackRef.current;
|
|
223
|
+
if (!track) {
|
|
224
|
+
return;
|
|
225
|
+
}
|
|
226
|
+
event.currentTarget.setPointerCapture(event.pointerId);
|
|
227
|
+
const move = (e) => {
|
|
228
|
+
setValue(computeValueFromPointer(e.clientX, track, min, max, step));
|
|
229
|
+
};
|
|
230
|
+
const up = () => {
|
|
231
|
+
window.removeEventListener("pointermove", move);
|
|
232
|
+
window.removeEventListener("pointerup", up);
|
|
233
|
+
};
|
|
234
|
+
window.addEventListener("pointermove", move);
|
|
235
|
+
window.addEventListener("pointerup", up);
|
|
236
|
+
},
|
|
237
|
+
[disabled, max, min, setValue, step, trackRef]
|
|
238
|
+
);
|
|
239
|
+
const onKeyDown = useCallback(
|
|
240
|
+
(event) => {
|
|
241
|
+
if (disabled) {
|
|
242
|
+
return;
|
|
243
|
+
}
|
|
244
|
+
const big = (max - min) / 10;
|
|
245
|
+
let delta = 0;
|
|
246
|
+
if (event.key === "ArrowRight" || event.key === "ArrowUp") {
|
|
247
|
+
delta = step;
|
|
248
|
+
} else if (event.key === "ArrowLeft" || event.key === "ArrowDown") {
|
|
249
|
+
delta = -step;
|
|
250
|
+
} else if (event.key === "PageUp") {
|
|
251
|
+
delta = big;
|
|
252
|
+
} else if (event.key === "PageDown") {
|
|
253
|
+
delta = -big;
|
|
254
|
+
} else if (event.key === "Home") {
|
|
255
|
+
event.preventDefault();
|
|
256
|
+
setValue(min);
|
|
257
|
+
return;
|
|
258
|
+
} else if (event.key === "End") {
|
|
259
|
+
event.preventDefault();
|
|
260
|
+
setValue(max);
|
|
261
|
+
return;
|
|
262
|
+
} else {
|
|
263
|
+
return;
|
|
264
|
+
}
|
|
265
|
+
event.preventDefault();
|
|
266
|
+
setValue(value + delta);
|
|
267
|
+
},
|
|
268
|
+
[disabled, max, min, setValue, step, value]
|
|
269
|
+
);
|
|
270
|
+
return /* @__PURE__ */ jsx(
|
|
271
|
+
"div",
|
|
272
|
+
{
|
|
273
|
+
ref: (node) => {
|
|
274
|
+
if (typeof refProp === "function") {
|
|
275
|
+
refProp(node);
|
|
276
|
+
} else if (refProp) {
|
|
277
|
+
refProp.current = node;
|
|
278
|
+
}
|
|
279
|
+
},
|
|
280
|
+
role: "slider",
|
|
281
|
+
tabIndex: disabled ? -1 : 0,
|
|
282
|
+
"data-slot": "slider-thumb",
|
|
283
|
+
"aria-valuemin": min,
|
|
284
|
+
"aria-valuemax": max,
|
|
285
|
+
"aria-valuenow": value,
|
|
286
|
+
"aria-disabled": disabled || void 0,
|
|
287
|
+
className: cn(
|
|
288
|
+
"absolute top-1/2 z-10 -translate-x-1/2 -translate-y-1/2",
|
|
289
|
+
sliderThumbVariants({ size }),
|
|
290
|
+
className
|
|
291
|
+
),
|
|
292
|
+
style: { left: `${pct}%` },
|
|
293
|
+
onPointerDown,
|
|
294
|
+
onKeyDown,
|
|
295
|
+
...rest
|
|
296
|
+
}
|
|
297
|
+
);
|
|
298
|
+
}
|
|
299
|
+
SliderThumb.displayName = "SliderThumb";
|
|
300
|
+
function RangeSlider({
|
|
301
|
+
className,
|
|
302
|
+
size = "md",
|
|
303
|
+
min = 0,
|
|
304
|
+
max = 100,
|
|
305
|
+
step = 1,
|
|
306
|
+
value: valueProp,
|
|
307
|
+
defaultValue,
|
|
308
|
+
onValueChange,
|
|
309
|
+
disabled = false,
|
|
310
|
+
appearance = "default",
|
|
311
|
+
"aria-label": ariaLabel,
|
|
312
|
+
"aria-labelledby": ariaLabelledBy,
|
|
313
|
+
ref,
|
|
314
|
+
...rest
|
|
315
|
+
}) {
|
|
316
|
+
const trackRef = useRef(null);
|
|
317
|
+
const isControlled = valueProp !== void 0;
|
|
318
|
+
const [uncontrolled, setUncontrolled] = useState(() => {
|
|
319
|
+
const seed = defaultValue ?? [min, max];
|
|
320
|
+
const lo2 = clamp(snapToStep(seed[0], min, step), min, max);
|
|
321
|
+
const hi2 = clamp(snapToStep(seed[1], min, step), min, max);
|
|
322
|
+
return lo2 <= hi2 ? [lo2, hi2] : [hi2, lo2];
|
|
323
|
+
});
|
|
324
|
+
const value = isControlled ? valueProp : uncontrolled;
|
|
325
|
+
const [lo, hi] = value[0] <= value[1] ? [value[0], value[1]] : [value[1], value[0]];
|
|
326
|
+
const setPair = useCallback(
|
|
327
|
+
(next) => {
|
|
328
|
+
const a = clamp(snapToStep(next[0], min, step), min, max);
|
|
329
|
+
const b = clamp(snapToStep(next[1], min, step), min, max);
|
|
330
|
+
const ordered = a <= b ? [a, b] : [b, a];
|
|
331
|
+
if (!isControlled) {
|
|
332
|
+
setUncontrolled(ordered);
|
|
333
|
+
}
|
|
334
|
+
onValueChange?.(ordered);
|
|
335
|
+
},
|
|
336
|
+
[isControlled, max, min, onValueChange, step]
|
|
337
|
+
);
|
|
338
|
+
const moveThumb = useCallback(
|
|
339
|
+
(index, clientX) => {
|
|
340
|
+
const track = trackRef.current;
|
|
341
|
+
if (!track) {
|
|
342
|
+
return;
|
|
343
|
+
}
|
|
344
|
+
const raw = computeValueFromPointer(clientX, track, min, max, step);
|
|
345
|
+
if (index === 0) {
|
|
346
|
+
setPair([raw, hi]);
|
|
347
|
+
} else {
|
|
348
|
+
setPair([lo, raw]);
|
|
349
|
+
}
|
|
350
|
+
},
|
|
351
|
+
[hi, lo, max, min, setPair, step]
|
|
352
|
+
);
|
|
353
|
+
const loPct = max === min ? 0 : (lo - min) / (max - min) * 100;
|
|
354
|
+
const hiPct = max === min ? 0 : (hi - min) / (max - min) * 100;
|
|
355
|
+
const resolvedSize = size ?? "md";
|
|
356
|
+
return /* @__PURE__ */ jsx(
|
|
357
|
+
"div",
|
|
358
|
+
{
|
|
359
|
+
ref,
|
|
360
|
+
"data-slot": "range-slider",
|
|
361
|
+
role: "group",
|
|
362
|
+
"aria-label": ariaLabel,
|
|
363
|
+
"aria-labelledby": ariaLabelledBy,
|
|
364
|
+
"aria-valuetext": `${lo} \u2013 ${hi}`,
|
|
365
|
+
className: cn(sliderRootVariants({ size: resolvedSize }), className),
|
|
366
|
+
...rest,
|
|
367
|
+
children: /* @__PURE__ */ jsxs(
|
|
368
|
+
"div",
|
|
369
|
+
{
|
|
370
|
+
ref: trackRef,
|
|
371
|
+
"data-slot": "slider-track",
|
|
372
|
+
className: cn(sliderTrackVariants({ size: resolvedSize }), "relative"),
|
|
373
|
+
children: [
|
|
374
|
+
/* @__PURE__ */ jsx(
|
|
375
|
+
"div",
|
|
376
|
+
{
|
|
377
|
+
"data-slot": "slider-range",
|
|
378
|
+
className: cn(sliderRangeVariants({ appearance }), "absolute"),
|
|
379
|
+
style: {
|
|
380
|
+
left: `${loPct}%`,
|
|
381
|
+
width: `${Math.max(hiPct - loPct, 0)}%`
|
|
382
|
+
}
|
|
383
|
+
}
|
|
384
|
+
),
|
|
385
|
+
/* @__PURE__ */ jsx(
|
|
386
|
+
RangeThumb,
|
|
387
|
+
{
|
|
388
|
+
disabled,
|
|
389
|
+
size: resolvedSize,
|
|
390
|
+
value: lo,
|
|
391
|
+
min,
|
|
392
|
+
max,
|
|
393
|
+
step,
|
|
394
|
+
positionPct: loPct,
|
|
395
|
+
trackRef,
|
|
396
|
+
onMoveClientX: (x) => moveThumb(0, x),
|
|
397
|
+
onNudge: (delta) => setPair([lo + delta, hi])
|
|
398
|
+
}
|
|
399
|
+
),
|
|
400
|
+
/* @__PURE__ */ jsx(
|
|
401
|
+
RangeThumb,
|
|
402
|
+
{
|
|
403
|
+
disabled,
|
|
404
|
+
size: resolvedSize,
|
|
405
|
+
value: hi,
|
|
406
|
+
min,
|
|
407
|
+
max,
|
|
408
|
+
step,
|
|
409
|
+
positionPct: hiPct,
|
|
410
|
+
trackRef,
|
|
411
|
+
onMoveClientX: (x) => moveThumb(1, x),
|
|
412
|
+
onNudge: (delta) => setPair([lo, hi + delta])
|
|
413
|
+
}
|
|
414
|
+
)
|
|
415
|
+
]
|
|
416
|
+
}
|
|
417
|
+
)
|
|
418
|
+
}
|
|
419
|
+
);
|
|
420
|
+
}
|
|
421
|
+
RangeSlider.displayName = "RangeSlider";
|
|
422
|
+
function RangeThumb({
|
|
423
|
+
disabled,
|
|
424
|
+
size,
|
|
425
|
+
value,
|
|
426
|
+
min,
|
|
427
|
+
max,
|
|
428
|
+
step,
|
|
429
|
+
positionPct,
|
|
430
|
+
trackRef,
|
|
431
|
+
onMoveClientX,
|
|
432
|
+
onNudge
|
|
433
|
+
}) {
|
|
434
|
+
const onPointerDown = useCallback(
|
|
435
|
+
(event) => {
|
|
436
|
+
if (disabled) {
|
|
437
|
+
return;
|
|
438
|
+
}
|
|
439
|
+
event.preventDefault();
|
|
440
|
+
const track = trackRef.current;
|
|
441
|
+
if (!track) {
|
|
442
|
+
return;
|
|
443
|
+
}
|
|
444
|
+
event.currentTarget.setPointerCapture(event.pointerId);
|
|
445
|
+
const move = (e) => {
|
|
446
|
+
onMoveClientX(e.clientX);
|
|
447
|
+
};
|
|
448
|
+
const up = () => {
|
|
449
|
+
window.removeEventListener("pointermove", move);
|
|
450
|
+
window.removeEventListener("pointerup", up);
|
|
451
|
+
};
|
|
452
|
+
window.addEventListener("pointermove", move);
|
|
453
|
+
window.addEventListener("pointerup", up);
|
|
454
|
+
},
|
|
455
|
+
[disabled, onMoveClientX, trackRef]
|
|
456
|
+
);
|
|
457
|
+
const onKeyDown = useCallback(
|
|
458
|
+
(event) => {
|
|
459
|
+
if (disabled) {
|
|
460
|
+
return;
|
|
461
|
+
}
|
|
462
|
+
const big = (max - min) / 10;
|
|
463
|
+
let delta = 0;
|
|
464
|
+
if (event.key === "ArrowRight" || event.key === "ArrowUp") {
|
|
465
|
+
delta = step;
|
|
466
|
+
} else if (event.key === "ArrowLeft" || event.key === "ArrowDown") {
|
|
467
|
+
delta = -step;
|
|
468
|
+
} else if (event.key === "PageUp") {
|
|
469
|
+
delta = big;
|
|
470
|
+
} else if (event.key === "PageDown") {
|
|
471
|
+
delta = -big;
|
|
472
|
+
} else if (event.key === "Home") {
|
|
473
|
+
event.preventDefault();
|
|
474
|
+
onNudge(min - value);
|
|
475
|
+
return;
|
|
476
|
+
} else if (event.key === "End") {
|
|
477
|
+
event.preventDefault();
|
|
478
|
+
onNudge(max - value);
|
|
479
|
+
return;
|
|
480
|
+
} else {
|
|
481
|
+
return;
|
|
482
|
+
}
|
|
483
|
+
event.preventDefault();
|
|
484
|
+
onNudge(delta);
|
|
485
|
+
},
|
|
486
|
+
[disabled, max, min, onNudge, step, value]
|
|
487
|
+
);
|
|
488
|
+
return /* @__PURE__ */ jsx(
|
|
489
|
+
"div",
|
|
490
|
+
{
|
|
491
|
+
role: "slider",
|
|
492
|
+
tabIndex: disabled ? -1 : 0,
|
|
493
|
+
"data-slot": "range-slider-thumb",
|
|
494
|
+
"aria-valuemin": min,
|
|
495
|
+
"aria-valuemax": max,
|
|
496
|
+
"aria-valuenow": value,
|
|
497
|
+
"aria-disabled": disabled || void 0,
|
|
498
|
+
className: cn(
|
|
499
|
+
"absolute top-1/2 z-10 -translate-x-1/2 -translate-y-1/2",
|
|
500
|
+
sliderThumbVariants({ size })
|
|
501
|
+
),
|
|
502
|
+
style: { left: `${positionPct}%` },
|
|
503
|
+
onPointerDown,
|
|
504
|
+
onKeyDown
|
|
505
|
+
}
|
|
506
|
+
);
|
|
507
|
+
}
|
|
508
|
+
|
|
509
|
+
export { RangeSlider, Slider, SliderRange, SliderThumb, SliderTrack, sliderRangeVariants, sliderRootVariants, sliderThumbVariants, sliderTrackVariants };
|
|
510
|
+
//# sourceMappingURL=slider.mjs.map
|
|
511
|
+
//# sourceMappingURL=slider.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/ui/slider/variants.ts","../../src/ui/slider/slider.tsx"],"names":["lo","hi"],"mappings":"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","file":"slider.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nexport const sliderRootVariants = cva(\"w-full select-none touch-none\", {\n variants: {\n size: {\n sm: \"py-2\",\n md: \"py-2.5\",\n lg: \"py-3\",\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n});\n\nexport const sliderTrackVariants = cva(\n \"relative h-2 w-full shrink-0 overflow-hidden rounded-full bg-white/10\",\n {\n variants: {\n size: {\n sm: \"h-1.5\",\n md: \"h-2\",\n lg: \"h-2.5\",\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n },\n);\n\nexport const sliderRangeVariants = cva(\n \"absolute h-full rounded-full bg-gradient-to-r from-violet-500 to-indigo-400\",\n {\n variants: {\n appearance: {\n default: \"from-violet-500 to-indigo-400\",\n sky: \"from-sky-500 to-indigo-400\",\n rose: \"from-rose-500 to-indigo-400\",\n purple: \"from-purple-500 to-indigo-400\",\n pink: \"from-pink-500 to-indigo-400\",\n orange: \"from-orange-500 to-indigo-400\",\n yellow: \"from-yellow-500 to-indigo-400\",\n teal: \"from-teal-500 to-indigo-400\",\n indigo: \"from-indigo-500 to-indigo-400\",\n emerald: \"from-emerald-500 to-teal-400\",\n amber: \"from-amber-500 to-orange-400\",\n gray: \"from-gray-500 to-indigo-400\",\n violet: \"from-violet-500 to-indigo-400\",\n \"gradient-blue\": \"from-blue-500 to-indigo-400\",\n \"gradient-green\": \"from-green-500 to-indigo-400\",\n \"gradient-red\": \"from-red-500 to-indigo-400\",\n \"gradient-yellow\": \"from-yellow-500 to-indigo-400\",\n \"gradient-purple\": \"from-purple-500 to-indigo-400\",\n \"gradient-teal\": \"from-teal-500 to-indigo-400\",\n \"gradient-indigo\": \"from-indigo-500 to-indigo-400\",\n \"gradient-pink\": \"from-pink-500 to-indigo-400\",\n \"gradient-orange\": \"from-orange-500 to-indigo-400\",\n },\n },\n defaultVariants: {\n appearance: \"default\",\n },\n },\n);\n\nexport const sliderThumbVariants = cva(\n \"block size-4 rounded-full border border-white/20 bg-white shadow-md ring-offset-2 ring-offset-slate-950 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/40 disabled:pointer-events-none disabled:opacity-40\",\n {\n variants: {\n size: {\n sm: \"size-3.5\",\n md: \"size-4\",\n lg: \"size-5\",\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n },\n);\n","\"use client\";\n\nimport {\n createContext,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n type KeyboardEvent as ReactKeyboardEvent,\n type MutableRefObject,\n type PointerEvent as ReactPointerEvent,\n type Ref,\n type RefObject,\n} from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type {\n RangeSliderProps,\n SliderProps,\n SliderRangeProps,\n SliderThumbProps,\n SliderTrackProps,\n} from \"./types\";\nimport {\n sliderRangeVariants,\n sliderRootVariants,\n sliderThumbVariants,\n sliderTrackVariants,\n} from \"./variants\";\n\nfunction clamp(value: number, min: number, max: number) {\n return Math.min(max, Math.max(min, value));\n}\n\nfunction snapToStep(value: number, min: number, step: number) {\n const steps = Math.round((value - min) / step);\n return min + steps * step;\n}\n\ntype SliderAppearance = NonNullable<\n Parameters<typeof sliderRangeVariants>[0]\n>[\"appearance\"];\n\ntype SliderCtx = {\n min: number;\n max: number;\n step: number;\n value: number;\n setValue: (next: number) => void;\n disabled: boolean;\n size: NonNullable<SliderProps[\"size\"]>;\n appearance: SliderAppearance;\n trackRef: RefObject<HTMLDivElement | null>;\n};\n\nconst SliderContext = createContext<SliderCtx | null>(null);\n\nfunction useSliderContext(component: string): SliderCtx {\n const ctx = useContext(SliderContext);\n if (!ctx) {\n throw new Error(`${component} must be used within <Slider>`);\n }\n return ctx;\n}\n\nfunction computeValueFromPointer(\n clientX: number,\n track: HTMLDivElement,\n min: number,\n max: number,\n step: number,\n) {\n const rect = track.getBoundingClientRect();\n const ratio = rect.width === 0 ? 0 : (clientX - rect.left) / rect.width;\n const raw = min + ratio * (max - min);\n return snapToStep(clamp(raw, min, max), min, step);\n}\n\nexport function Slider({\n className,\n size = \"md\",\n min = 0,\n max = 100,\n step = 1,\n value: valueProp,\n defaultValue,\n onValueChange,\n disabled = false,\n appearance = \"default\",\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n children,\n ref,\n ...rest\n}: SliderProps & { ref?: Ref<HTMLDivElement> }) {\n const trackRef = useRef<HTMLDivElement | null>(null);\n const isControlled = valueProp !== undefined;\n const [uncontrolled, setUncontrolled] = useState(\n defaultValue ?? min,\n );\n const value = isControlled ? (valueProp as number) : uncontrolled;\n\n const setValue = useCallback(\n (next: number) => {\n const clamped = clamp(snapToStep(next, min, step), min, max);\n if (!isControlled) {\n setUncontrolled(clamped);\n }\n onValueChange?.(clamped);\n },\n [isControlled, max, min, onValueChange, step],\n );\n\n const ctx = useMemo(\n () => ({\n min,\n max,\n step,\n value: clamp(snapToStep(value, min, step), min, max),\n setValue,\n disabled,\n size: size ?? \"md\",\n appearance: appearance ?? \"default\",\n trackRef,\n }),\n [appearance, disabled, max, min, setValue, size, step, value],\n );\n\n return (\n <SliderContext.Provider value={ctx}>\n <div\n ref={ref}\n data-slot=\"slider\"\n role=\"group\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className={cn(sliderRootVariants({ size }), className)}\n {...rest}\n >\n {children}\n </div>\n </SliderContext.Provider>\n );\n}\n\nSlider.displayName = \"Slider\";\n\nexport function SliderTrack({\n className,\n ref: refProp,\n ...rest\n}: SliderTrackProps & { ref?: Ref<HTMLDivElement> }) {\n const { size, trackRef } = useSliderContext(\"SliderTrack\");\n\n return (\n <div\n ref={(node) => {\n trackRef.current = node;\n if (typeof refProp === \"function\") {\n refProp(node);\n } else if (refProp) {\n (refProp as MutableRefObject<HTMLDivElement | null>).current = node;\n }\n }}\n data-slot=\"slider-track\"\n className={cn(sliderTrackVariants({ size }), className)}\n {...rest}\n />\n );\n}\n\nSliderTrack.displayName = \"SliderTrack\";\n\nexport function SliderRange({\n className,\n ref,\n ...rest\n}: SliderRangeProps & { ref?: Ref<HTMLDivElement> }) {\n const { min, max, value, appearance } = useSliderContext(\"SliderRange\");\n const pct = max === min ? 0 : ((value - min) / (max - min)) * 100;\n return (\n <div\n ref={ref}\n data-slot=\"slider-range\"\n className={cn(sliderRangeVariants({ appearance }), className)}\n style={{ width: `${pct}%` }}\n {...rest}\n />\n );\n}\n\nSliderRange.displayName = \"SliderRange\";\n\nexport function SliderThumb({\n className,\n ref: refProp,\n ...rest\n}: SliderThumbProps & { ref?: Ref<HTMLDivElement> }) {\n const { min, max, value, step, setValue, disabled, size, trackRef } =\n useSliderContext(\"SliderThumb\");\n const pct = max === min ? 0 : ((value - min) / (max - min)) * 100;\n\n const onPointerDown = useCallback(\n (event: ReactPointerEvent<HTMLDivElement>) => {\n if (disabled) {\n return;\n }\n event.preventDefault();\n const track = trackRef.current;\n if (!track) {\n return;\n }\n event.currentTarget.setPointerCapture(event.pointerId);\n const move = (e: PointerEvent) => {\n setValue(computeValueFromPointer(e.clientX, track, min, max, step));\n };\n const up = () => {\n window.removeEventListener(\"pointermove\", move);\n window.removeEventListener(\"pointerup\", up);\n };\n window.addEventListener(\"pointermove\", move);\n window.addEventListener(\"pointerup\", up);\n },\n [disabled, max, min, setValue, step, trackRef],\n );\n\n const onKeyDown = useCallback(\n (event: ReactKeyboardEvent<HTMLDivElement>) => {\n if (disabled) {\n return;\n }\n const big = (max - min) / 10;\n let delta = 0;\n if (event.key === \"ArrowRight\" || event.key === \"ArrowUp\") {\n delta = step;\n } else if (event.key === \"ArrowLeft\" || event.key === \"ArrowDown\") {\n delta = -step;\n } else if (event.key === \"PageUp\") {\n delta = big;\n } else if (event.key === \"PageDown\") {\n delta = -big;\n } else if (event.key === \"Home\") {\n event.preventDefault();\n setValue(min);\n return;\n } else if (event.key === \"End\") {\n event.preventDefault();\n setValue(max);\n return;\n } else {\n return;\n }\n event.preventDefault();\n setValue(value + delta);\n },\n [disabled, max, min, setValue, step, value],\n );\n\n return (\n <div\n ref={(node) => {\n if (typeof refProp === \"function\") {\n refProp(node);\n } else if (refProp) {\n (refProp as MutableRefObject<HTMLDivElement | null>).current = node;\n }\n }}\n role=\"slider\"\n tabIndex={disabled ? -1 : 0}\n data-slot=\"slider-thumb\"\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={value}\n aria-disabled={disabled || undefined}\n className={cn(\n \"absolute top-1/2 z-10 -translate-x-1/2 -translate-y-1/2\",\n sliderThumbVariants({ size }),\n className,\n )}\n style={{ left: `${pct}%` }}\n onPointerDown={onPointerDown}\n onKeyDown={onKeyDown}\n {...rest}\n />\n );\n}\n\nSliderThumb.displayName = \"SliderThumb\";\n\nexport function RangeSlider({\n className,\n size = \"md\",\n min = 0,\n max = 100,\n step = 1,\n value: valueProp,\n defaultValue,\n onValueChange,\n disabled = false,\n appearance = \"default\",\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n ref,\n ...rest\n}: RangeSliderProps & { ref?: Ref<HTMLDivElement> }) {\n const trackRef = useRef<HTMLDivElement | null>(null);\n const isControlled = valueProp !== undefined;\n const [uncontrolled, setUncontrolled] = useState<[number, number]>(() => {\n const seed = defaultValue ?? [min, max];\n const lo = clamp(snapToStep(seed[0], min, step), min, max);\n const hi = clamp(snapToStep(seed[1], min, step), min, max);\n return lo <= hi ? [lo, hi] : [hi, lo];\n });\n\n const value = isControlled ? (valueProp as [number, number]) : uncontrolled;\n const [lo, hi] =\n value[0] <= value[1]\n ? [value[0], value[1]]\n : [value[1], value[0]];\n\n const setPair = useCallback(\n (next: [number, number]) => {\n const a = clamp(snapToStep(next[0], min, step), min, max);\n const b = clamp(snapToStep(next[1], min, step), min, max);\n const ordered: [number, number] = a <= b ? [a, b] : [b, a];\n if (!isControlled) {\n setUncontrolled(ordered);\n }\n onValueChange?.(ordered);\n },\n [isControlled, max, min, onValueChange, step],\n );\n\n const moveThumb = useCallback(\n (index: 0 | 1, clientX: number) => {\n const track = trackRef.current;\n if (!track) {\n return;\n }\n const raw = computeValueFromPointer(clientX, track, min, max, step);\n if (index === 0) {\n setPair([raw, hi]);\n } else {\n setPair([lo, raw]);\n }\n },\n [hi, lo, max, min, setPair, step],\n );\n\n const loPct = max === min ? 0 : ((lo - min) / (max - min)) * 100;\n const hiPct = max === min ? 0 : ((hi - min) / (max - min)) * 100;\n const resolvedSize = size ?? \"md\";\n\n return (\n <div\n ref={ref}\n data-slot=\"range-slider\"\n role=\"group\"\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-valuetext={`${lo} – ${hi}`}\n className={cn(sliderRootVariants({ size: resolvedSize }), className)}\n {...rest}\n >\n <div\n ref={trackRef}\n data-slot=\"slider-track\"\n className={cn(sliderTrackVariants({ size: resolvedSize }), \"relative\")}\n >\n <div\n data-slot=\"slider-range\"\n className={cn(sliderRangeVariants({ appearance }), \"absolute\")}\n style={{\n left: `${loPct}%`,\n width: `${Math.max(hiPct - loPct, 0)}%`,\n }}\n />\n <RangeThumb\n disabled={disabled}\n size={resolvedSize}\n value={lo}\n min={min}\n max={max}\n step={step}\n positionPct={loPct}\n trackRef={trackRef}\n onMoveClientX={(x) => moveThumb(0, x)}\n onNudge={(delta) => setPair([lo + delta, hi])}\n />\n <RangeThumb\n disabled={disabled}\n size={resolvedSize}\n value={hi}\n min={min}\n max={max}\n step={step}\n positionPct={hiPct}\n trackRef={trackRef}\n onMoveClientX={(x) => moveThumb(1, x)}\n onNudge={(delta) => setPair([lo, hi + delta])}\n />\n </div>\n </div>\n );\n}\n\nRangeSlider.displayName = \"RangeSlider\";\n\ntype RangeThumbProps = {\n disabled: boolean;\n size: \"sm\" | \"md\" | \"lg\";\n value: number;\n min: number;\n max: number;\n step: number;\n positionPct: number;\n trackRef: RefObject<HTMLDivElement | null>;\n onMoveClientX: (clientX: number) => void;\n onNudge: (delta: number) => void;\n};\n\nfunction RangeThumb({\n disabled,\n size,\n value,\n min,\n max,\n step,\n positionPct,\n trackRef,\n onMoveClientX,\n onNudge,\n}: RangeThumbProps) {\n const onPointerDown = useCallback(\n (event: ReactPointerEvent<HTMLDivElement>) => {\n if (disabled) {\n return;\n }\n event.preventDefault();\n const track = trackRef.current;\n if (!track) {\n return;\n }\n event.currentTarget.setPointerCapture(event.pointerId);\n const move = (e: PointerEvent) => {\n onMoveClientX(e.clientX);\n };\n const up = () => {\n window.removeEventListener(\"pointermove\", move);\n window.removeEventListener(\"pointerup\", up);\n };\n window.addEventListener(\"pointermove\", move);\n window.addEventListener(\"pointerup\", up);\n },\n [disabled, onMoveClientX, trackRef],\n );\n\n const onKeyDown = useCallback(\n (event: ReactKeyboardEvent<HTMLDivElement>) => {\n if (disabled) {\n return;\n }\n const big = (max - min) / 10;\n let delta = 0;\n if (event.key === \"ArrowRight\" || event.key === \"ArrowUp\") {\n delta = step;\n } else if (event.key === \"ArrowLeft\" || event.key === \"ArrowDown\") {\n delta = -step;\n } else if (event.key === \"PageUp\") {\n delta = big;\n } else if (event.key === \"PageDown\") {\n delta = -big;\n } else if (event.key === \"Home\") {\n event.preventDefault();\n onNudge(min - value);\n return;\n } else if (event.key === \"End\") {\n event.preventDefault();\n onNudge(max - value);\n return;\n } else {\n return;\n }\n event.preventDefault();\n onNudge(delta);\n },\n [disabled, max, min, onNudge, step, value],\n );\n\n return (\n <div\n role=\"slider\"\n tabIndex={disabled ? -1 : 0}\n data-slot=\"range-slider-thumb\"\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={value}\n aria-disabled={disabled || undefined}\n className={cn(\n \"absolute top-1/2 z-10 -translate-x-1/2 -translate-y-1/2\",\n sliderThumbVariants({ size }),\n )}\n style={{ left: `${positionPct}%` }}\n onPointerDown={onPointerDown}\n onKeyDown={onKeyDown}\n />\n );\n}\n"]}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ReactNode, ComponentPropsWithoutRef, Ref } from 'react';
|
|
3
|
+
import { VariantProps } from 'class-variance-authority';
|
|
4
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
5
|
+
|
|
6
|
+
declare const stepperVariants: (props?: ({
|
|
7
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
8
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
9
|
+
declare const stepperItemVariants: (props?: ({
|
|
10
|
+
orientation?: "horizontal" | "vertical" | null | undefined;
|
|
11
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
12
|
+
declare const stepperIndicatorVariants: (props?: ({
|
|
13
|
+
appearance?: "complete" | "current" | "upcoming" | "sky" | "rose" | "purple" | "pink" | "orange" | "yellow" | "teal" | "indigo" | "emerald" | "gray" | "violet" | "gradient-blue" | "gradient-green" | "gradient-red" | "gradient-yellow" | "gradient-purple" | "gradient-teal" | "gradient-indigo" | "gradient-pink" | "gradient-orange" | null | undefined;
|
|
14
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
15
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
16
|
+
|
|
17
|
+
type StepperVariantProps = VariantProps<typeof stepperVariants>;
|
|
18
|
+
type StepperProps = StepperVariantProps & {
|
|
19
|
+
size?: VariantProps<typeof stepperIndicatorVariants>["size"];
|
|
20
|
+
children?: ReactNode;
|
|
21
|
+
} & Omit<ComponentPropsWithoutRef<"div">, "children">;
|
|
22
|
+
type StepperItemProps = ComponentPropsWithoutRef<"div"> & {
|
|
23
|
+
children?: ReactNode;
|
|
24
|
+
};
|
|
25
|
+
type StepperIndicatorProps = ComponentPropsWithoutRef<"div"> & {
|
|
26
|
+
children?: ReactNode;
|
|
27
|
+
appearance?: StepperAppearance;
|
|
28
|
+
};
|
|
29
|
+
type StepperTitleProps = ComponentPropsWithoutRef<"div">;
|
|
30
|
+
type StepperDescriptionProps = ComponentPropsWithoutRef<"p">;
|
|
31
|
+
type StepperAppearance = VariantProps<typeof stepperIndicatorVariants>["appearance"];
|
|
32
|
+
|
|
33
|
+
declare function Stepper({ className, orientation, size, children, ref, ...rest }: StepperProps & {
|
|
34
|
+
ref?: Ref<HTMLDivElement>;
|
|
35
|
+
}): react_jsx_runtime.JSX.Element;
|
|
36
|
+
declare namespace Stepper {
|
|
37
|
+
var displayName: string;
|
|
38
|
+
}
|
|
39
|
+
declare function StepperItem({ className, ref, children, ...rest }: StepperItemProps & {
|
|
40
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
41
|
+
}): react_jsx_runtime.JSX.Element;
|
|
42
|
+
declare namespace StepperItem {
|
|
43
|
+
var displayName: string;
|
|
44
|
+
}
|
|
45
|
+
declare function StepperIndicator({ className, ref, children, appearance, ...rest }: StepperIndicatorProps & {
|
|
46
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
47
|
+
}): react_jsx_runtime.JSX.Element;
|
|
48
|
+
declare namespace StepperIndicator {
|
|
49
|
+
var displayName: string;
|
|
50
|
+
}
|
|
51
|
+
declare function StepperTitle({ className, ref, ...rest }: StepperTitleProps & {
|
|
52
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
53
|
+
}): react_jsx_runtime.JSX.Element;
|
|
54
|
+
declare namespace StepperTitle {
|
|
55
|
+
var displayName: string;
|
|
56
|
+
}
|
|
57
|
+
declare function StepperDescription({ className, ref, ...rest }: StepperDescriptionProps & {
|
|
58
|
+
ref?: React.Ref<HTMLParagraphElement>;
|
|
59
|
+
}): react_jsx_runtime.JSX.Element;
|
|
60
|
+
declare namespace StepperDescription {
|
|
61
|
+
var displayName: string;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
export { Stepper, type StepperAppearance, StepperDescription, type StepperDescriptionProps, StepperIndicator, type StepperIndicatorProps, StepperItem, type StepperItemProps, type StepperProps, StepperTitle, type StepperTitleProps, stepperIndicatorVariants, stepperItemVariants, stepperVariants };
|