@szum-tech/design-system 3.13.0 → 3.14.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/chunk-4IGU5SVP.js +54 -0
- package/dist/{chunk-XJZOANXX.cjs → chunk-6HX7ETL3.cjs} +1 -1
- package/dist/chunk-B4M7Q5KX.cjs +25 -0
- package/dist/{chunk-S2BCU6WG.cjs → chunk-CAIAZGSW.cjs} +5 -4
- package/dist/chunk-EOTQVIA5.js +993 -0
- package/dist/chunk-EZCWHR56.cjs +2355 -0
- package/dist/chunk-G24PWQKG.js +20 -0
- package/dist/chunk-GEDBA3JU.cjs +49 -0
- package/dist/chunk-IZU3KULT.js +41 -0
- package/dist/{chunk-KQ6QE7BT.cjs → chunk-MNDQXDV4.cjs} +4 -4
- package/dist/chunk-N4TYSZSU.cjs +44 -0
- package/dist/chunk-OZSNSRLV.cjs +1027 -0
- package/dist/{chunk-DL54DIMD.js → chunk-Q2MJKFIE.js} +2 -1
- package/dist/chunk-S3ZUFD6U.js +23 -0
- package/dist/{chunk-WXZE35FK.js → chunk-VK2FJ65F.js} +1 -1
- package/dist/chunk-VL3TPVSB.js +2299 -0
- package/dist/{chunk-E5TYGWGE.js → chunk-XKCLVPUC.js} +1 -1
- package/dist/{chunk-XIQUR62A.cjs → chunk-XY3ZNUWR.cjs} +32 -20
- package/dist/color-picker.types-GI7dq2Ig.d.cts +42 -0
- package/dist/color-picker.types-GI7dq2Ig.d.ts +42 -0
- package/dist/components/badge-overflow/index.cjs +3 -2
- package/dist/components/badge-overflow/index.js +2 -1
- package/dist/components/button/index.cjs +17 -14
- package/dist/components/button/index.d.cts +1 -0
- package/dist/components/button/index.d.ts +1 -0
- package/dist/components/button/index.js +16 -13
- package/dist/components/carousel/index.cjs +18 -15
- package/dist/components/carousel/index.d.cts +1 -0
- package/dist/components/carousel/index.d.ts +1 -0
- package/dist/components/carousel/index.js +16 -13
- package/dist/components/color-picker/index.cjs +88 -0
- package/dist/components/color-picker/index.d.cts +71 -0
- package/dist/components/color-picker/index.d.ts +71 -0
- package/dist/components/color-picker/index.js +39 -0
- package/dist/components/dialog/index.d.cts +1 -0
- package/dist/components/dialog/index.d.ts +1 -0
- package/dist/components/field/index.cjs +12 -12
- package/dist/components/field/index.js +2 -2
- package/dist/components/file-upload/index.cjs +60 -0
- package/dist/components/file-upload/index.d.cts +131 -0
- package/dist/components/file-upload/index.d.ts +131 -0
- package/dist/components/file-upload/index.js +3 -0
- package/dist/components/index.cjs +221 -94
- package/dist/components/index.d.cts +7 -1
- package/dist/components/index.d.ts +7 -1
- package/dist/components/index.js +16 -13
- package/dist/components/input/index.cjs +2 -2
- package/dist/components/input/index.js +1 -1
- package/dist/components/item/index.d.cts +1 -0
- package/dist/components/item/index.d.ts +1 -0
- package/dist/components/masonry/index.cjs +5 -4
- package/dist/components/masonry/index.js +3 -2
- package/dist/components/popover/index.cjs +35 -0
- package/dist/components/popover/index.d.cts +18 -0
- package/dist/components/popover/index.d.ts +18 -0
- package/dist/components/popover/index.js +2 -0
- package/dist/components/select/index.cjs +7 -7
- package/dist/components/select/index.d.cts +8 -14
- package/dist/components/select/index.d.ts +8 -14
- package/dist/components/select/index.js +1 -1
- package/dist/components/sheet/index.d.cts +2 -1
- package/dist/components/sheet/index.d.ts +2 -1
- package/dist/components/stepper/index.cjs +35 -32
- package/dist/components/stepper/index.d.cts +1 -0
- package/dist/components/stepper/index.d.ts +1 -0
- package/dist/components/stepper/index.js +16 -13
- package/dist/components/timeline/index.cjs +12 -11
- package/dist/components/timeline/index.d.cts +1 -0
- package/dist/components/timeline/index.d.ts +1 -0
- package/dist/components/timeline/index.js +3 -2
- package/dist/components/toaster/index.cjs +18 -15
- package/dist/components/toaster/index.js +16 -13
- package/dist/components/typing-text/index.d.cts +1 -0
- package/dist/components/typing-text/index.d.ts +1 -0
- package/dist/components/word-rotate/index.d.cts +1 -0
- package/dist/components/word-rotate/index.d.ts +1 -0
- package/dist/hooks/index.cjs +17 -8
- package/dist/hooks/index.d.cts +15 -4
- package/dist/hooks/index.d.ts +15 -4
- package/dist/hooks/index.js +2 -1
- package/dist/popover-trigger-Cf4PPj0z.d.cts +14 -0
- package/dist/popover-trigger-Cf4PPj0z.d.ts +14 -0
- package/dist/select-Bf6XQtt-.d.cts +12 -0
- package/dist/select-Bf6XQtt-.d.ts +12 -0
- package/package.json +1 -1
- package/dist/chunk-5AA4IE2T.cjs +0 -27
- package/dist/chunk-IDOJLUDL.cjs +0 -1065
- package/dist/chunk-SB5UG7OC.js +0 -41
- package/dist/chunk-U2HEQZMY.js +0 -1020
- package/dist/chunk-UGSNASZM.js +0 -25
- package/dist/{chunk-DTYX7CYN.cjs → chunk-GAZLMZBH.cjs} +1 -1
- package/dist/{chunk-3MH6P44N.js → chunk-K5QSMTKJ.js} +1 -1
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
// src/hooks/use-validation-log.tsx
|
|
4
|
+
function useValidationLog({ check, scope, message }) {
|
|
5
|
+
React.useEffect(() => {
|
|
6
|
+
if (!check) {
|
|
7
|
+
console.error(
|
|
8
|
+
`%c[Szum Tech-Design System]%c
|
|
9
|
+
${scope}%c
|
|
10
|
+
${message}`,
|
|
11
|
+
"color: #ef4444; font-weight: bold;",
|
|
12
|
+
"color: #3b82f6; font-weight: bold;",
|
|
13
|
+
"color: #f59e0b;"
|
|
14
|
+
);
|
|
15
|
+
}
|
|
16
|
+
}, [check, scope, message]);
|
|
17
|
+
}
|
|
18
|
+
function setRef(ref, value) {
|
|
19
|
+
if (typeof ref === "function") {
|
|
20
|
+
return ref(value);
|
|
21
|
+
}
|
|
22
|
+
if (ref !== null && ref !== void 0) {
|
|
23
|
+
ref.current = value;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
function composeRefs(...refs) {
|
|
27
|
+
return (node) => {
|
|
28
|
+
let hasCleanup = false;
|
|
29
|
+
const cleanups = refs.map((ref) => {
|
|
30
|
+
const cleanup = setRef(ref, node);
|
|
31
|
+
if (!hasCleanup && typeof cleanup === "function") {
|
|
32
|
+
hasCleanup = true;
|
|
33
|
+
}
|
|
34
|
+
return cleanup;
|
|
35
|
+
});
|
|
36
|
+
if (hasCleanup) {
|
|
37
|
+
return () => {
|
|
38
|
+
for (let i = 0; i < cleanups.length; i++) {
|
|
39
|
+
const cleanup = cleanups[i];
|
|
40
|
+
if (typeof cleanup === "function") {
|
|
41
|
+
cleanup();
|
|
42
|
+
} else {
|
|
43
|
+
setRef(refs[i], null);
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
function useComposedRefs(...refs) {
|
|
51
|
+
return React.useCallback(composeRefs(...refs), refs);
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
export { composeRefs, useComposedRefs, useValidationLog };
|
|
@@ -50,7 +50,7 @@ function Select({
|
|
|
50
50
|
"aria-invalid": triggerProps["aria-invalid"] || invalid ? true : void 0,
|
|
51
51
|
"data-size": size,
|
|
52
52
|
className: chunkH2BWO3SI_cjs.cn(
|
|
53
|
-
"border-input dark:bg-input/30 dark:hover:bg-input/50 flex w-
|
|
53
|
+
"border-input dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none",
|
|
54
54
|
"*:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2",
|
|
55
55
|
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
56
56
|
"aria-invalid:ring-error/20 dark:aria-invalid:ring-error/40 aria-invalid:border-error",
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunkH2BWO3SI_cjs = require('./chunk-H2BWO3SI.cjs');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
|
|
6
|
+
function Input({ className, type, invalid = false, ...props }) {
|
|
7
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
8
|
+
"input",
|
|
9
|
+
{
|
|
10
|
+
type,
|
|
11
|
+
"data-slot": "input",
|
|
12
|
+
"aria-invalid": props["aria-invalid"] || invalid,
|
|
13
|
+
className: chunkH2BWO3SI_cjs.cn(
|
|
14
|
+
"dark:bg-input/30 border-input file:text-foreground placeholder:text-muted-foreground h-8 w-full min-w-0 rounded border bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-3 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm",
|
|
15
|
+
"aria-invalid:ring-error/20 dark:aria-invalid:ring-error/40 aria-invalid:border-error dark:aria-invalid:border-error/50",
|
|
16
|
+
"focus-visible:border-ring focus-visible:ring-ring/50",
|
|
17
|
+
"disabled:bg-input/50 dark:disabled:bg-input/80",
|
|
18
|
+
className
|
|
19
|
+
),
|
|
20
|
+
...props
|
|
21
|
+
}
|
|
22
|
+
);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
exports.Input = Input;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkXY3ZNUWR_cjs = require('./chunk-XY3ZNUWR.cjs');
|
|
4
|
+
var chunkN4TYSZSU_cjs = require('./chunk-N4TYSZSU.cjs');
|
|
4
5
|
var React3 = require('react');
|
|
5
6
|
var reactSlot = require('@radix-ui/react-slot');
|
|
6
7
|
var jsxRuntime = require('react/jsx-runtime');
|
|
@@ -67,7 +68,7 @@ function MasonryViewport({ children, style, ref, ...props }) {
|
|
|
67
68
|
const [layoutVersion, setLayoutVersion] = React3__namespace.useState(0);
|
|
68
69
|
const rafId = React3__namespace.useRef(null);
|
|
69
70
|
const [mounted, setMounted] = React3__namespace.useState(false);
|
|
70
|
-
|
|
71
|
+
chunkN4TYSZSU_cjs.useIsomorphicLayoutEffect(() => {
|
|
71
72
|
setMounted(true);
|
|
72
73
|
}, []);
|
|
73
74
|
const validChildren = React3__namespace.Children.toArray(children).filter(
|
|
@@ -976,14 +977,14 @@ function Masonry(props) {
|
|
|
976
977
|
const columnGap = gapValue.column;
|
|
977
978
|
const rowGap = gapValue.row;
|
|
978
979
|
const containerRef = React3__namespace.useRef(null);
|
|
979
|
-
const composedRef =
|
|
980
|
+
const composedRef = chunkXY3ZNUWR_cjs.useComposedRefs(ref, containerRef);
|
|
980
981
|
const size = useDebouncedWindowSize({
|
|
981
982
|
containerRef,
|
|
982
983
|
defaultWidth,
|
|
983
984
|
defaultHeight
|
|
984
985
|
});
|
|
985
986
|
const [containerPosition, setContainerPosition] = React3__namespace.useState({ offset: 0, width: 0 });
|
|
986
|
-
|
|
987
|
+
chunkN4TYSZSU_cjs.useIsomorphicLayoutEffect(() => {
|
|
987
988
|
if (!containerRef.current) return;
|
|
988
989
|
let offset = 0;
|
|
989
990
|
let container = containerRef.current;
|