@fuf-stack/pixels 0.39.9 → 0.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Button/index.cjs +2 -2
- package/dist/Button/index.js +1 -1
- package/dist/Json/index.cjs +3 -3
- package/dist/Json/index.js +2 -2
- package/dist/Progress/index.cjs +5 -82
- package/dist/Progress/index.cjs.map +1 -1
- package/dist/Progress/index.d.cts +9 -222
- package/dist/Progress/index.d.ts +9 -222
- package/dist/Progress/index.js +5 -82
- package/dist/Progress/index.js.map +1 -1
- package/dist/Progress-7yXUVioO.d.cts +228 -0
- package/dist/Progress-7yXUVioO.d.ts +228 -0
- package/dist/ProgressCircular/index.cjs +12 -0
- package/dist/ProgressCircular/index.cjs.map +1 -0
- package/dist/ProgressCircular/index.d.cts +11 -0
- package/dist/ProgressCircular/index.d.ts +11 -0
- package/dist/ProgressCircular/index.js +12 -0
- package/dist/ProgressCircular/index.js.map +1 -0
- package/dist/ProgressCircular-U4kPZ1T1.d.cts +414 -0
- package/dist/ProgressCircular-U4kPZ1T1.d.ts +414 -0
- package/dist/{chunk-HHCDSQ6N.cjs → chunk-FLPLJTAC.cjs} +2 -2
- package/dist/{chunk-HHCDSQ6N.cjs.map → chunk-FLPLJTAC.cjs.map} +1 -1
- package/dist/chunk-GJQTAEHH.js +113 -0
- package/dist/chunk-GJQTAEHH.js.map +1 -0
- package/dist/{chunk-374SO74F.cjs → chunk-J63YGHTG.cjs} +3 -3
- package/dist/{chunk-374SO74F.cjs.map → chunk-J63YGHTG.cjs.map} +1 -1
- package/dist/{chunk-Q5DUSUCZ.js → chunk-MAKWBTTW.js} +2 -2
- package/dist/{chunk-Q5DUSUCZ.js.map → chunk-MAKWBTTW.js.map} +1 -1
- package/dist/chunk-RV7YPQXI.js +95 -0
- package/dist/chunk-RV7YPQXI.js.map +1 -0
- package/dist/chunk-VGXW3PSF.cjs +95 -0
- package/dist/chunk-VGXW3PSF.cjs.map +1 -0
- package/dist/{chunk-L3DEBOPG.js → chunk-VRPX6QUG.js} +2 -2
- package/dist/chunk-WCRVH4DS.cjs +113 -0
- package/dist/chunk-WCRVH4DS.cjs.map +1 -0
- package/dist/index.cjs +16 -6
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +15 -5
- package/dist/index.js.map +1 -1
- package/package.json +30 -25
- /package/dist/{chunk-L3DEBOPG.js.map → chunk-VRPX6QUG.js.map} +0 -0
|
@@ -0,0 +1,414 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as tailwind_variants from 'tailwind-variants';
|
|
3
|
+
import * as tailwind_variants_dist_config_js from 'tailwind-variants/dist/config.js';
|
|
4
|
+
import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
|
|
5
|
+
import { ReactNode } from 'react';
|
|
6
|
+
|
|
7
|
+
declare const progressCircularVariants: tailwind_variants.TVReturnType<{
|
|
8
|
+
color: {
|
|
9
|
+
default: {
|
|
10
|
+
svg: string;
|
|
11
|
+
};
|
|
12
|
+
primary: {
|
|
13
|
+
svg: string;
|
|
14
|
+
};
|
|
15
|
+
secondary: {
|
|
16
|
+
svg: string;
|
|
17
|
+
};
|
|
18
|
+
success: {
|
|
19
|
+
svg: string;
|
|
20
|
+
};
|
|
21
|
+
warning: {
|
|
22
|
+
svg: string;
|
|
23
|
+
};
|
|
24
|
+
danger: {
|
|
25
|
+
svg: string;
|
|
26
|
+
};
|
|
27
|
+
info: {
|
|
28
|
+
svg: string;
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
hasError: {
|
|
32
|
+
true: {
|
|
33
|
+
svg: string;
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
size: {
|
|
37
|
+
xs: {
|
|
38
|
+
svg: string;
|
|
39
|
+
value: string;
|
|
40
|
+
};
|
|
41
|
+
sm: {
|
|
42
|
+
svg: string;
|
|
43
|
+
value: string;
|
|
44
|
+
};
|
|
45
|
+
md: {
|
|
46
|
+
svg: string;
|
|
47
|
+
value: string;
|
|
48
|
+
};
|
|
49
|
+
lg: {
|
|
50
|
+
svg: string;
|
|
51
|
+
value: string;
|
|
52
|
+
};
|
|
53
|
+
xl: {
|
|
54
|
+
svg: string;
|
|
55
|
+
value: string;
|
|
56
|
+
};
|
|
57
|
+
};
|
|
58
|
+
}, {
|
|
59
|
+
base: string;
|
|
60
|
+
indicator: string;
|
|
61
|
+
label: string;
|
|
62
|
+
svg: string;
|
|
63
|
+
svgWrapper: string;
|
|
64
|
+
track: string;
|
|
65
|
+
value: string;
|
|
66
|
+
}, undefined, tailwind_variants_dist_config_js.TVConfig<{
|
|
67
|
+
color: {
|
|
68
|
+
default: {
|
|
69
|
+
svg: string;
|
|
70
|
+
};
|
|
71
|
+
primary: {
|
|
72
|
+
svg: string;
|
|
73
|
+
};
|
|
74
|
+
secondary: {
|
|
75
|
+
svg: string;
|
|
76
|
+
};
|
|
77
|
+
success: {
|
|
78
|
+
svg: string;
|
|
79
|
+
};
|
|
80
|
+
warning: {
|
|
81
|
+
svg: string;
|
|
82
|
+
};
|
|
83
|
+
danger: {
|
|
84
|
+
svg: string;
|
|
85
|
+
};
|
|
86
|
+
info: {
|
|
87
|
+
svg: string;
|
|
88
|
+
};
|
|
89
|
+
};
|
|
90
|
+
hasError: {
|
|
91
|
+
true: {
|
|
92
|
+
svg: string;
|
|
93
|
+
};
|
|
94
|
+
};
|
|
95
|
+
size: {
|
|
96
|
+
xs: {
|
|
97
|
+
svg: string;
|
|
98
|
+
value: string;
|
|
99
|
+
};
|
|
100
|
+
sm: {
|
|
101
|
+
svg: string;
|
|
102
|
+
value: string;
|
|
103
|
+
};
|
|
104
|
+
md: {
|
|
105
|
+
svg: string;
|
|
106
|
+
value: string;
|
|
107
|
+
};
|
|
108
|
+
lg: {
|
|
109
|
+
svg: string;
|
|
110
|
+
value: string;
|
|
111
|
+
};
|
|
112
|
+
xl: {
|
|
113
|
+
svg: string;
|
|
114
|
+
value: string;
|
|
115
|
+
};
|
|
116
|
+
};
|
|
117
|
+
}, {
|
|
118
|
+
color: {
|
|
119
|
+
default: {
|
|
120
|
+
svg: string;
|
|
121
|
+
};
|
|
122
|
+
primary: {
|
|
123
|
+
svg: string;
|
|
124
|
+
};
|
|
125
|
+
secondary: {
|
|
126
|
+
svg: string;
|
|
127
|
+
};
|
|
128
|
+
success: {
|
|
129
|
+
svg: string;
|
|
130
|
+
};
|
|
131
|
+
warning: {
|
|
132
|
+
svg: string;
|
|
133
|
+
};
|
|
134
|
+
danger: {
|
|
135
|
+
svg: string;
|
|
136
|
+
};
|
|
137
|
+
info: {
|
|
138
|
+
svg: string;
|
|
139
|
+
};
|
|
140
|
+
};
|
|
141
|
+
hasError: {
|
|
142
|
+
true: {
|
|
143
|
+
svg: string;
|
|
144
|
+
};
|
|
145
|
+
};
|
|
146
|
+
size: {
|
|
147
|
+
xs: {
|
|
148
|
+
svg: string;
|
|
149
|
+
value: string;
|
|
150
|
+
};
|
|
151
|
+
sm: {
|
|
152
|
+
svg: string;
|
|
153
|
+
value: string;
|
|
154
|
+
};
|
|
155
|
+
md: {
|
|
156
|
+
svg: string;
|
|
157
|
+
value: string;
|
|
158
|
+
};
|
|
159
|
+
lg: {
|
|
160
|
+
svg: string;
|
|
161
|
+
value: string;
|
|
162
|
+
};
|
|
163
|
+
xl: {
|
|
164
|
+
svg: string;
|
|
165
|
+
value: string;
|
|
166
|
+
};
|
|
167
|
+
};
|
|
168
|
+
}>, {
|
|
169
|
+
color: {
|
|
170
|
+
default: {
|
|
171
|
+
svg: string;
|
|
172
|
+
};
|
|
173
|
+
primary: {
|
|
174
|
+
svg: string;
|
|
175
|
+
};
|
|
176
|
+
secondary: {
|
|
177
|
+
svg: string;
|
|
178
|
+
};
|
|
179
|
+
success: {
|
|
180
|
+
svg: string;
|
|
181
|
+
};
|
|
182
|
+
warning: {
|
|
183
|
+
svg: string;
|
|
184
|
+
};
|
|
185
|
+
danger: {
|
|
186
|
+
svg: string;
|
|
187
|
+
};
|
|
188
|
+
info: {
|
|
189
|
+
svg: string;
|
|
190
|
+
};
|
|
191
|
+
};
|
|
192
|
+
hasError: {
|
|
193
|
+
true: {
|
|
194
|
+
svg: string;
|
|
195
|
+
};
|
|
196
|
+
};
|
|
197
|
+
size: {
|
|
198
|
+
xs: {
|
|
199
|
+
svg: string;
|
|
200
|
+
value: string;
|
|
201
|
+
};
|
|
202
|
+
sm: {
|
|
203
|
+
svg: string;
|
|
204
|
+
value: string;
|
|
205
|
+
};
|
|
206
|
+
md: {
|
|
207
|
+
svg: string;
|
|
208
|
+
value: string;
|
|
209
|
+
};
|
|
210
|
+
lg: {
|
|
211
|
+
svg: string;
|
|
212
|
+
value: string;
|
|
213
|
+
};
|
|
214
|
+
xl: {
|
|
215
|
+
svg: string;
|
|
216
|
+
value: string;
|
|
217
|
+
};
|
|
218
|
+
};
|
|
219
|
+
}, {
|
|
220
|
+
base: string;
|
|
221
|
+
indicator: string;
|
|
222
|
+
label: string;
|
|
223
|
+
svg: string;
|
|
224
|
+
svgWrapper: string;
|
|
225
|
+
track: string;
|
|
226
|
+
value: string;
|
|
227
|
+
}, tailwind_variants.TVReturnType<{
|
|
228
|
+
color: {
|
|
229
|
+
default: {
|
|
230
|
+
svg: string;
|
|
231
|
+
};
|
|
232
|
+
primary: {
|
|
233
|
+
svg: string;
|
|
234
|
+
};
|
|
235
|
+
secondary: {
|
|
236
|
+
svg: string;
|
|
237
|
+
};
|
|
238
|
+
success: {
|
|
239
|
+
svg: string;
|
|
240
|
+
};
|
|
241
|
+
warning: {
|
|
242
|
+
svg: string;
|
|
243
|
+
};
|
|
244
|
+
danger: {
|
|
245
|
+
svg: string;
|
|
246
|
+
};
|
|
247
|
+
info: {
|
|
248
|
+
svg: string;
|
|
249
|
+
};
|
|
250
|
+
};
|
|
251
|
+
hasError: {
|
|
252
|
+
true: {
|
|
253
|
+
svg: string;
|
|
254
|
+
};
|
|
255
|
+
};
|
|
256
|
+
size: {
|
|
257
|
+
xs: {
|
|
258
|
+
svg: string;
|
|
259
|
+
value: string;
|
|
260
|
+
};
|
|
261
|
+
sm: {
|
|
262
|
+
svg: string;
|
|
263
|
+
value: string;
|
|
264
|
+
};
|
|
265
|
+
md: {
|
|
266
|
+
svg: string;
|
|
267
|
+
value: string;
|
|
268
|
+
};
|
|
269
|
+
lg: {
|
|
270
|
+
svg: string;
|
|
271
|
+
value: string;
|
|
272
|
+
};
|
|
273
|
+
xl: {
|
|
274
|
+
svg: string;
|
|
275
|
+
value: string;
|
|
276
|
+
};
|
|
277
|
+
};
|
|
278
|
+
}, {
|
|
279
|
+
base: string;
|
|
280
|
+
indicator: string;
|
|
281
|
+
label: string;
|
|
282
|
+
svg: string;
|
|
283
|
+
svgWrapper: string;
|
|
284
|
+
track: string;
|
|
285
|
+
value: string;
|
|
286
|
+
}, undefined, tailwind_variants_dist_config_js.TVConfig<{
|
|
287
|
+
color: {
|
|
288
|
+
default: {
|
|
289
|
+
svg: string;
|
|
290
|
+
};
|
|
291
|
+
primary: {
|
|
292
|
+
svg: string;
|
|
293
|
+
};
|
|
294
|
+
secondary: {
|
|
295
|
+
svg: string;
|
|
296
|
+
};
|
|
297
|
+
success: {
|
|
298
|
+
svg: string;
|
|
299
|
+
};
|
|
300
|
+
warning: {
|
|
301
|
+
svg: string;
|
|
302
|
+
};
|
|
303
|
+
danger: {
|
|
304
|
+
svg: string;
|
|
305
|
+
};
|
|
306
|
+
info: {
|
|
307
|
+
svg: string;
|
|
308
|
+
};
|
|
309
|
+
};
|
|
310
|
+
hasError: {
|
|
311
|
+
true: {
|
|
312
|
+
svg: string;
|
|
313
|
+
};
|
|
314
|
+
};
|
|
315
|
+
size: {
|
|
316
|
+
xs: {
|
|
317
|
+
svg: string;
|
|
318
|
+
value: string;
|
|
319
|
+
};
|
|
320
|
+
sm: {
|
|
321
|
+
svg: string;
|
|
322
|
+
value: string;
|
|
323
|
+
};
|
|
324
|
+
md: {
|
|
325
|
+
svg: string;
|
|
326
|
+
value: string;
|
|
327
|
+
};
|
|
328
|
+
lg: {
|
|
329
|
+
svg: string;
|
|
330
|
+
value: string;
|
|
331
|
+
};
|
|
332
|
+
xl: {
|
|
333
|
+
svg: string;
|
|
334
|
+
value: string;
|
|
335
|
+
};
|
|
336
|
+
};
|
|
337
|
+
}, {
|
|
338
|
+
color: {
|
|
339
|
+
default: {
|
|
340
|
+
svg: string;
|
|
341
|
+
};
|
|
342
|
+
primary: {
|
|
343
|
+
svg: string;
|
|
344
|
+
};
|
|
345
|
+
secondary: {
|
|
346
|
+
svg: string;
|
|
347
|
+
};
|
|
348
|
+
success: {
|
|
349
|
+
svg: string;
|
|
350
|
+
};
|
|
351
|
+
warning: {
|
|
352
|
+
svg: string;
|
|
353
|
+
};
|
|
354
|
+
danger: {
|
|
355
|
+
svg: string;
|
|
356
|
+
};
|
|
357
|
+
info: {
|
|
358
|
+
svg: string;
|
|
359
|
+
};
|
|
360
|
+
};
|
|
361
|
+
hasError: {
|
|
362
|
+
true: {
|
|
363
|
+
svg: string;
|
|
364
|
+
};
|
|
365
|
+
};
|
|
366
|
+
size: {
|
|
367
|
+
xs: {
|
|
368
|
+
svg: string;
|
|
369
|
+
value: string;
|
|
370
|
+
};
|
|
371
|
+
sm: {
|
|
372
|
+
svg: string;
|
|
373
|
+
value: string;
|
|
374
|
+
};
|
|
375
|
+
md: {
|
|
376
|
+
svg: string;
|
|
377
|
+
value: string;
|
|
378
|
+
};
|
|
379
|
+
lg: {
|
|
380
|
+
svg: string;
|
|
381
|
+
value: string;
|
|
382
|
+
};
|
|
383
|
+
xl: {
|
|
384
|
+
svg: string;
|
|
385
|
+
value: string;
|
|
386
|
+
};
|
|
387
|
+
};
|
|
388
|
+
}>, unknown, unknown, undefined>>;
|
|
389
|
+
type VariantProps = TVProps<typeof progressCircularVariants>;
|
|
390
|
+
type ClassName = TVClassName<typeof progressCircularVariants>;
|
|
391
|
+
interface ProgressCircularProps extends VariantProps {
|
|
392
|
+
/** sets HTML aria-label attribute */
|
|
393
|
+
ariaLabel?: string;
|
|
394
|
+
/** CSS class name */
|
|
395
|
+
className?: ClassName;
|
|
396
|
+
/** color options */
|
|
397
|
+
color?: VariantProps['color'];
|
|
398
|
+
/** disables all animations */
|
|
399
|
+
disableAnimation?: boolean;
|
|
400
|
+
/** formats the display value of the progress in the center */
|
|
401
|
+
format?: (percent?: number) => ReactNode;
|
|
402
|
+
/** enables error version */
|
|
403
|
+
hasError?: boolean;
|
|
404
|
+
/** percentage / progress of the circular progress bar */
|
|
405
|
+
percent: number;
|
|
406
|
+
/** size options */
|
|
407
|
+
size?: VariantProps['size'];
|
|
408
|
+
}
|
|
409
|
+
/**
|
|
410
|
+
* ProgressCircular component based on [HeroUI CircularProgress](https://www.heroui.com/docs/components/circular-progress)
|
|
411
|
+
*/
|
|
412
|
+
declare const ProgressCircular: ({ ariaLabel, className, format, hasError, percent, disableAnimation, size, color, }: ProgressCircularProps) => react_jsx_runtime.JSX.Element;
|
|
413
|
+
|
|
414
|
+
export { ProgressCircular as P, type ProgressCircularProps as a, progressCircularVariants as p };
|
|
@@ -72,7 +72,7 @@ var buttonVariants = _pixelutils.tv.call(void 0, {
|
|
|
72
72
|
{
|
|
73
73
|
color: "info",
|
|
74
74
|
variant: "shadow",
|
|
75
|
-
class: 'shadow-lg shadow-info/40
|
|
75
|
+
class: 'text-info-foreground" bg-info shadow-lg shadow-info/40'
|
|
76
76
|
},
|
|
77
77
|
{
|
|
78
78
|
color: "info",
|
|
@@ -150,4 +150,4 @@ var Button_default2 = Button_default;
|
|
|
150
150
|
|
|
151
151
|
|
|
152
152
|
exports.buttonVariants = buttonVariants; exports.Button_default = Button_default; exports.Button_default2 = Button_default2;
|
|
153
|
-
//# sourceMappingURL=chunk-
|
|
153
|
+
//# sourceMappingURL=chunk-FLPLJTAC.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-FLPLJTAC.cjs","../src/Button/Button.tsx","../src/Button/subcomponents/LoadingSpinner.tsx","../src/Button/index.ts"],"names":["jsxs","jsx","Button_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/pixels/dist/chunk-FLPLJTAC.cjs","sourcesContent":[null,"import type { TVProps } from '@fuf-stack/pixel-utils';\nimport type { ButtonProps as HeroButtonProps } from '@heroui/button';\nimport type { ReactNode } from 'react';\n\nimport { Button as HeroButton } from '@heroui/button';\nimport { button as heroButtonVariants } from '@heroui/theme';\n\nimport { tv } from '@fuf-stack/pixel-utils';\n\nimport LoadingSpinner from './subcomponents/LoadingSpinner';\n\nexport const buttonVariants = tv({\n base: '',\n variants: {\n color: {\n info: '',\n ...heroButtonVariants.variants.color,\n },\n variant: {\n ...heroButtonVariants.variants.variant,\n },\n size: {\n ...heroButtonVariants.variants.size,\n },\n },\n compoundVariants: [\n // white text on solid / shadow success button\n {\n color: 'success',\n variant: ['solid', 'shadow'],\n class: 'text-white',\n },\n // white text on solid / shadow warning button\n {\n color: 'warning',\n variant: ['solid', 'shadow'],\n class: 'text-white',\n },\n {\n color: 'info',\n variant: 'solid',\n class: 'bg-info text-info-foreground',\n },\n {\n color: 'info',\n variant: 'shadow',\n class: 'text-info-foreground\" bg-info shadow-lg shadow-info/40',\n },\n {\n color: 'info',\n variant: 'bordered',\n class: 'border-medium border-info bg-transparent text-info',\n },\n {\n color: 'info',\n variant: 'flat',\n class: 'bg-info/20 text-info-600',\n },\n {\n color: 'info',\n variant: 'faded',\n class: 'border-default bg-default-100 text-info',\n },\n {\n color: 'info',\n variant: 'light',\n class: 'bg-transparent text-info data-[hover=true]:bg-info-100',\n },\n {\n color: 'info',\n variant: 'ghost',\n class:\n 'border-info text-info data-[hover=true]:!bg-info data-[hover=true]:!text-info-foreground',\n },\n ],\n});\n\nexport type VariantProps = TVProps<typeof buttonVariants>;\n\nexport interface ButtonProps extends VariantProps {\n /** sets HTML aria-label attribute */\n ariaLabel?: string;\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** hero ui button color */\n color?: HeroButtonProps['color'];\n /** disables function of the button. */\n disabled?: boolean;\n /** disables all button animations */\n disableAnimation?: boolean;\n /** If set loading animation is shown */\n loading?: boolean;\n /** optional icon */\n icon?: ReactNode;\n /** on click event */\n onClick?: HeroButtonProps['onPress'];\n /** 3 size options */\n size?: HeroButtonProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** sets the button type. */\n type?: 'button' | 'submit' | 'reset' | undefined;\n /** hero ui button variants */\n variant?: HeroButtonProps['variant'];\n}\n\n/**\n * Button component based on [HeroUI Button](https://www.heroui.com//docs/components/button)\n */\nconst Button = ({\n ariaLabel = undefined,\n children = undefined,\n className = undefined,\n color = 'default',\n disabled = false,\n disableAnimation = false,\n icon = undefined,\n loading = false,\n onClick = undefined,\n size = undefined,\n testId = undefined,\n type = undefined,\n variant = 'solid',\n}: ButtonProps) => {\n return (\n <HeroButton\n aria-label={ariaLabel}\n className={buttonVariants({ color, variant, className })}\n color={color}\n data-testid={testId}\n disableAnimation={disableAnimation}\n disableRipple={disableAnimation}\n isDisabled={disabled}\n isIconOnly={!!(icon && !children)}\n isLoading={loading}\n onPress={onClick}\n size={size}\n spinner={<LoadingSpinner />}\n type={type}\n variant={variant}\n >\n {icon}\n {children}\n </HeroButton>\n );\n};\n\nexport default Button;\n","/**\n * svg loading spinner for button\n * @see https://www.heroui.com//docs/components/button#loading\n * */\nexport default () => (\n <svg\n className=\"animate-spin h-5 w-5 text-current\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle\n className=\"opacity-25\"\n cx=\"12\"\n cy=\"12\"\n r=\"10\"\n stroke=\"currentColor\"\n strokeWidth=\"4\"\n />\n <path\n className=\"opacity-75\"\n d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n","import Button, { buttonVariants } from './Button';\n\nexport type { ButtonProps } from './Button';\n\nexport { Button, buttonVariants };\n\nexport default Button;\n"]}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import {
|
|
2
|
+
__spreadValues
|
|
3
|
+
} from "./chunk-J7N2552D.js";
|
|
4
|
+
|
|
5
|
+
// src/ProgressCircular/ProgressCircular.tsx
|
|
6
|
+
import { FaCheck, FaTimes } from "react-icons/fa";
|
|
7
|
+
import { CircularProgress as HeroCircularProgress } from "@heroui/progress";
|
|
8
|
+
import { circularProgress as heroCircularProgressVariants } from "@heroui/theme";
|
|
9
|
+
import { tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
|
|
10
|
+
import { jsx } from "react/jsx-runtime";
|
|
11
|
+
var progressCircularVariants = tv({
|
|
12
|
+
slots: {
|
|
13
|
+
// wrapper around the whole component
|
|
14
|
+
base: "",
|
|
15
|
+
// indicator of the circle (finished part)
|
|
16
|
+
indicator: "",
|
|
17
|
+
// label next to the svgWrapper
|
|
18
|
+
label: "",
|
|
19
|
+
// wrapper for the circle
|
|
20
|
+
svg: "",
|
|
21
|
+
// wrapper around progress svg and value span
|
|
22
|
+
svgWrapper: "",
|
|
23
|
+
// track of the circle (not finished part)
|
|
24
|
+
track: "stroke-default-50",
|
|
25
|
+
// outer span next to the svg
|
|
26
|
+
value: ""
|
|
27
|
+
},
|
|
28
|
+
variants: {
|
|
29
|
+
color: __spreadValues({
|
|
30
|
+
info: {
|
|
31
|
+
svg: "text-info"
|
|
32
|
+
}
|
|
33
|
+
}, heroCircularProgressVariants.variants.color),
|
|
34
|
+
hasError: {
|
|
35
|
+
true: {
|
|
36
|
+
svg: "text-danger"
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
size: {
|
|
40
|
+
xs: {
|
|
41
|
+
svg: "h-10 w-10",
|
|
42
|
+
value: "text-xs"
|
|
43
|
+
},
|
|
44
|
+
sm: {
|
|
45
|
+
svg: "h-12 w-12",
|
|
46
|
+
value: "text-sm"
|
|
47
|
+
},
|
|
48
|
+
md: {
|
|
49
|
+
svg: "h-16 w-16",
|
|
50
|
+
value: "text-md"
|
|
51
|
+
},
|
|
52
|
+
lg: {
|
|
53
|
+
svg: "h-20 w-20",
|
|
54
|
+
value: "text-lg"
|
|
55
|
+
},
|
|
56
|
+
xl: {
|
|
57
|
+
svg: "h-24 w-24",
|
|
58
|
+
value: "text-xl"
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
var defaultFormat = (percent = 0) => `${percent}%`;
|
|
64
|
+
var ProgressCircular = ({
|
|
65
|
+
ariaLabel = "progress",
|
|
66
|
+
className = void 0,
|
|
67
|
+
format = defaultFormat,
|
|
68
|
+
hasError = false,
|
|
69
|
+
percent,
|
|
70
|
+
disableAnimation = false,
|
|
71
|
+
size = "md",
|
|
72
|
+
color = "info"
|
|
73
|
+
}) => {
|
|
74
|
+
const variants = progressCircularVariants({ color, hasError, size });
|
|
75
|
+
const classNames = variantsToClassNames(variants, className, "base");
|
|
76
|
+
let value = format(percent);
|
|
77
|
+
let progressColor = color;
|
|
78
|
+
if (hasError) {
|
|
79
|
+
progressColor = "danger";
|
|
80
|
+
value = /* @__PURE__ */ jsx(FaTimes, { className: "text-danger" });
|
|
81
|
+
} else if (percent >= 100) {
|
|
82
|
+
progressColor = "success";
|
|
83
|
+
value = /* @__PURE__ */ jsx(FaCheck, { className: "text-success" });
|
|
84
|
+
}
|
|
85
|
+
const heroUiColor = Object.keys(
|
|
86
|
+
heroCircularProgressVariants.variants.color
|
|
87
|
+
).includes(color) ? progressColor : void 0;
|
|
88
|
+
return /* @__PURE__ */ jsx(
|
|
89
|
+
HeroCircularProgress,
|
|
90
|
+
{
|
|
91
|
+
"aria-label": ariaLabel,
|
|
92
|
+
classNames,
|
|
93
|
+
color: heroUiColor,
|
|
94
|
+
disableAnimation,
|
|
95
|
+
formatOptions: void 0,
|
|
96
|
+
showValueLabel: true,
|
|
97
|
+
strokeWidth: 2,
|
|
98
|
+
value: percent || 0,
|
|
99
|
+
valueLabel: value
|
|
100
|
+
}
|
|
101
|
+
);
|
|
102
|
+
};
|
|
103
|
+
var ProgressCircular_default = ProgressCircular;
|
|
104
|
+
|
|
105
|
+
// src/ProgressCircular/index.ts
|
|
106
|
+
var ProgressCircular_default2 = ProgressCircular_default;
|
|
107
|
+
|
|
108
|
+
export {
|
|
109
|
+
progressCircularVariants,
|
|
110
|
+
ProgressCircular_default,
|
|
111
|
+
ProgressCircular_default2
|
|
112
|
+
};
|
|
113
|
+
//# sourceMappingURL=chunk-GJQTAEHH.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/ProgressCircular/ProgressCircular.tsx","../src/ProgressCircular/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { CircularProgressProps as HeroCircularProgressProps } from '@heroui/progress';\nimport type { ReactNode } from 'react';\n\nimport { FaCheck, FaTimes } from 'react-icons/fa';\n\nimport { CircularProgress as HeroCircularProgress } from '@heroui/progress';\nimport { circularProgress as heroCircularProgressVariants } from '@heroui/theme';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const progressCircularVariants = tv({\n slots: {\n // wrapper around the whole component\n base: '',\n // indicator of the circle (finished part)\n indicator: '',\n // label next to the svgWrapper\n label: '',\n // wrapper for the circle\n svg: '',\n // wrapper around progress svg and value span\n svgWrapper: '',\n // track of the circle (not finished part)\n track: 'stroke-default-50',\n // outer span next to the svg\n value: '',\n },\n variants: {\n color: {\n info: {\n svg: 'text-info',\n },\n // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/progress.ts\n ...heroCircularProgressVariants.variants.color,\n },\n hasError: {\n true: {\n svg: 'text-danger',\n },\n },\n size: {\n xs: {\n svg: 'h-10 w-10',\n value: 'text-xs',\n },\n sm: {\n svg: 'h-12 w-12',\n value: 'text-sm',\n },\n md: {\n svg: 'h-16 w-16',\n value: 'text-md',\n },\n lg: {\n svg: 'h-20 w-20',\n value: 'text-lg',\n },\n xl: {\n svg: 'h-24 w-24',\n value: 'text-xl',\n },\n },\n },\n});\n\ntype VariantProps = TVProps<typeof progressCircularVariants>;\ntype ClassName = TVClassName<typeof progressCircularVariants>;\n\nexport interface ProgressCircularProps extends VariantProps {\n /** sets HTML aria-label attribute */\n ariaLabel?: string;\n /** CSS class name */\n className?: ClassName;\n /** color options */\n color?: VariantProps['color'];\n /** disables all animations */\n disableAnimation?: boolean;\n /** formats the display value of the progress in the center */\n format?: (percent?: number) => ReactNode;\n /** enables error version */\n hasError?: boolean;\n /** percentage / progress of the circular progress bar */\n percent: number;\n /** size options */\n size?: VariantProps['size'];\n}\n\n/** formats percent with percent sign */\nconst defaultFormat = (percent = 0) => `${percent}%`;\n\n/**\n * ProgressCircular component based on [HeroUI CircularProgress](https://www.heroui.com/docs/components/circular-progress)\n */\nconst ProgressCircular = ({\n ariaLabel = 'progress',\n className = undefined,\n format = defaultFormat,\n hasError = false,\n percent,\n disableAnimation = false,\n size = 'md',\n color = 'info',\n}: ProgressCircularProps) => {\n const variants = progressCircularVariants({ color, hasError, size });\n const classNames = variantsToClassNames(variants, className, 'base');\n\n // format value\n let value = format(percent);\n\n // handle special states\n let progressColor: VariantProps['color'] = color;\n if (hasError) {\n progressColor = 'danger';\n value = <FaTimes className=\"text-danger\" />;\n } else if (percent >= 100) {\n progressColor = 'success';\n value = <FaCheck className=\"text-success\" />;\n }\n\n // pass only HeroUI colors as props\n const heroUiColor = Object.keys(\n heroCircularProgressVariants.variants.color,\n ).includes(color)\n ? (progressColor as HeroCircularProgressProps['color'])\n : undefined;\n\n return (\n <HeroCircularProgress\n aria-label={ariaLabel}\n classNames={classNames}\n color={heroUiColor}\n disableAnimation={disableAnimation}\n formatOptions={undefined}\n showValueLabel\n strokeWidth={2}\n // we do not use spinner animation when no percent provided\n value={percent || 0}\n valueLabel={value}\n />\n );\n};\n\nexport default ProgressCircular;\n","import ProgressCircular, { progressCircularVariants } from './ProgressCircular';\n\nexport type { ProgressCircularProps } from './ProgressCircular';\n\nexport { ProgressCircular, progressCircularVariants };\n\nexport default ProgressCircular;\n"],"mappings":";;;;;AAIA,SAAS,SAAS,eAAe;AAEjC,SAAS,oBAAoB,4BAA4B;AACzD,SAAS,oBAAoB,oCAAoC;AAEjE,SAAS,IAAI,4BAA4B;AAyG7B;AAvGL,IAAM,2BAA2B,GAAG;AAAA,EACzC,OAAO;AAAA;AAAA,IAEL,MAAM;AAAA;AAAA,IAEN,WAAW;AAAA;AAAA,IAEX,OAAO;AAAA;AAAA,IAEP,KAAK;AAAA;AAAA,IAEL,YAAY;AAAA;AAAA,IAEZ,OAAO;AAAA;AAAA,IAEP,OAAO;AAAA,EACT;AAAA,EACA,UAAU;AAAA,IACR,OAAO;AAAA,MACL,MAAM;AAAA,QACJ,KAAK;AAAA,MACP;AAAA,OAEG,6BAA6B,SAAS;AAAA,IAE3C,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,KAAK;AAAA,MACP;AAAA,IACF;AAAA,IACA,MAAM;AAAA,MACJ,IAAI;AAAA,QACF,KAAK;AAAA,QACL,OAAO;AAAA,MACT;AAAA,MACA,IAAI;AAAA,QACF,KAAK;AAAA,QACL,OAAO;AAAA,MACT;AAAA,MACA,IAAI;AAAA,QACF,KAAK;AAAA,QACL,OAAO;AAAA,MACT;AAAA,MACA,IAAI;AAAA,QACF,KAAK;AAAA,QACL,OAAO;AAAA,MACT;AAAA,MACA,IAAI;AAAA,QACF,KAAK;AAAA,QACL,OAAO;AAAA,MACT;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAyBD,IAAM,gBAAgB,CAAC,UAAU,MAAM,GAAG,OAAO;AAKjD,IAAM,mBAAmB,CAAC;AAAA,EACxB,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,WAAW;AAAA,EACX;AAAA,EACA,mBAAmB;AAAA,EACnB,OAAO;AAAA,EACP,QAAQ;AACV,MAA6B;AAC3B,QAAM,WAAW,yBAAyB,EAAE,OAAO,UAAU,KAAK,CAAC;AACnE,QAAM,aAAa,qBAAqB,UAAU,WAAW,MAAM;AAGnE,MAAI,QAAQ,OAAO,OAAO;AAG1B,MAAI,gBAAuC;AAC3C,MAAI,UAAU;AACZ,oBAAgB;AAChB,YAAQ,oBAAC,WAAQ,WAAU,eAAc;AAAA,EAC3C,WAAW,WAAW,KAAK;AACzB,oBAAgB;AAChB,YAAQ,oBAAC,WAAQ,WAAU,gBAAe;AAAA,EAC5C;AAGA,QAAM,cAAc,OAAO;AAAA,IACzB,6BAA6B,SAAS;AAAA,EACxC,EAAE,SAAS,KAAK,IACX,gBACD;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,cAAY;AAAA,MACZ;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,eAAe;AAAA,MACf,gBAAc;AAAA,MACd,aAAa;AAAA,MAEb,OAAO,WAAW;AAAA,MAClB,YAAY;AAAA;AAAA,EACd;AAEJ;AAEA,IAAO,2BAAQ;;;ACzIf,IAAOA,4BAAQ;","names":["ProgressCircular_default"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkFLPLJTACcjs = require('./chunk-FLPLJTAC.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
|
|
@@ -2590,7 +2590,7 @@ var ErrorRenderer = ({
|
|
|
2590
2590
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium", children: "Failed to parse JSON data" })
|
|
2591
2591
|
] }),
|
|
2592
2592
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
2593
|
-
|
|
2593
|
+
_chunkFLPLJTACcjs.Button_default,
|
|
2594
2594
|
{
|
|
2595
2595
|
color: "danger",
|
|
2596
2596
|
size: "sm",
|
|
@@ -2709,4 +2709,4 @@ var Json_default2 = Json_default;
|
|
|
2709
2709
|
|
|
2710
2710
|
|
|
2711
2711
|
exports.Json_default = Json_default; exports.Json_default2 = Json_default2;
|
|
2712
|
-
//# sourceMappingURL=chunk-
|
|
2712
|
+
//# sourceMappingURL=chunk-J63YGHTG.cjs.map
|