thread-ui 0.6.0 → 0.7.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/README.md +1 -1
- package/dist/components/data-display/data-display-controls/data-display-controls.d.ts +2 -0
- package/dist/components/data-display/data-display-controls/data-display-controls.js +48 -0
- package/dist/components/data-display/data-display-controls/data-display-controls.js.map +1 -0
- package/dist/components/data-display/data-display-controls/data-display-controls.types.d.ts +19 -0
- package/dist/components/data-display/data-display-controls/data-display-controls.types.js +2 -0
- package/dist/components/data-display/data-display-controls/data-display-controls.types.js.map +1 -0
- package/dist/components/data-display/data-display-controls/index.d.ts +2 -0
- package/dist/components/data-display/data-display-controls/index.js +2 -0
- package/dist/components/data-display/data-display-controls/index.js.map +1 -0
- package/dist/components/data-display/data-display-controls/use-data-display-controls.d.ts +2 -0
- package/dist/components/data-display/data-display-controls/use-data-display-controls.js +41 -0
- package/dist/components/data-display/data-display-controls/use-data-display-controls.js.map +1 -0
- package/dist/components/data-display/filter-controls/filter-controls.types.d.ts +21 -5
- package/dist/components/data-display/filter-controls/index.d.ts +4 -2
- package/dist/components/data-display/filter-controls/index.js +3 -1
- package/dist/components/data-display/filter-controls/index.js.map +1 -1
- package/dist/components/data-display/filter-controls/use-filter-controls.d.ts +1 -1
- package/dist/components/data-display/filter-controls/use-filter-controls.js +14 -5
- package/dist/components/data-display/filter-controls/use-filter-controls.js.map +1 -1
- package/dist/components/data-display/filter-controls/{filter-controls.d.ts → variants/filter-controls.d.ts} +2 -2
- package/dist/components/data-display/filter-controls/variants/filter-controls.js +52 -0
- package/dist/components/data-display/filter-controls/variants/filter-controls.js.map +1 -0
- package/dist/components/data-display/filter-controls/variants/inline-filter-controls.d.ts +13 -0
- package/dist/components/data-display/filter-controls/variants/inline-filter-controls.js +77 -0
- package/dist/components/data-display/filter-controls/variants/inline-filter-controls.js.map +1 -0
- package/dist/components/data-display/index.d.ts +1 -0
- package/dist/components/data-display/index.js +1 -0
- package/dist/components/data-display/index.js.map +1 -1
- package/dist/components/data-display/sort-controls/sort-controls.d.ts +1 -1
- package/dist/components/data-display/sort-controls/sort-controls.js +21 -14
- package/dist/components/data-display/sort-controls/sort-controls.js.map +1 -1
- package/dist/components/data-display/sort-controls/sort-controls.types.d.ts +7 -1
- package/dist/components/data-display/sort-controls/use-sort-controls.d.ts +1 -1
- package/dist/components/data-display/sort-controls/use-sort-controls.js +2 -2
- package/dist/components/data-display/sort-controls/use-sort-controls.js.map +1 -1
- package/dist/components/form-elements/dropdowns/dropdown/dropdown.d.ts +1 -1
- package/dist/components/form-elements/dropdowns/dropdown/dropdown.js +2 -2
- package/dist/components/form-elements/dropdowns/dropdown/dropdown.js.map +1 -1
- package/dist/components/form-elements/dropdowns/dropdown/dropdown.types.d.ts +3 -0
- package/dist/components/form-elements/dropdowns/dropdown-base/dropdown-base.d.ts +1 -1
- package/dist/components/form-elements/dropdowns/dropdown-base/dropdown-base.js +2 -2
- package/dist/components/form-elements/dropdowns/dropdown-base/dropdown-base.js.map +1 -1
- package/dist/components/form-elements/dropdowns/dropdown-base/dropdown-base.types.d.ts +2 -1
- package/dist/components/form-elements/dropdowns/multi-dropdown/multi-dropdown.d.ts +1 -1
- package/dist/components/form-elements/dropdowns/multi-dropdown/multi-dropdown.js +3 -3
- package/dist/components/form-elements/dropdowns/multi-dropdown/multi-dropdown.js.map +1 -1
- package/dist/components/form-elements/file-upload/components/file-upload-content.js +12 -12
- package/dist/components/form-elements/file-upload/components/file-upload-content.js.map +1 -1
- package/dist/components/form-elements/file-upload/components/file-upload-preview.js +35 -35
- package/dist/components/form-elements/file-upload/components/file-upload-preview.js.map +1 -1
- package/dist/components/form-elements/file-upload/components/item-previews.js +22 -22
- package/dist/components/form-elements/file-upload/components/item-previews.js.map +1 -1
- package/dist/components/form-elements/form-label/form-label.js +19 -19
- package/dist/components/form-elements/form-label/form-label.js.map +1 -1
- package/dist/components/form-elements/input-wrapper.js +8 -8
- package/dist/components/form-elements/input-wrapper.js.map +1 -1
- package/dist/components/form-elements/number-input/number-input.js +55 -55
- package/dist/components/form-elements/number-input/number-input.js.map +1 -1
- package/dist/components/form-elements/text-input/text-input.js +4 -4
- package/dist/components/form-elements/text-input/text-input.js.map +1 -1
- package/dist/components/layouts/column-layout/column-layout.js +23 -21
- package/dist/components/layouts/column-layout/column-layout.js.map +1 -1
- package/dist/components/layouts/footer/footer.js +38 -38
- package/dist/components/layouts/footer/footer.js.map +1 -1
- package/dist/components/layouts/masonry-layout/masonry-layout.js +14 -14
- package/dist/components/layouts/masonry-layout/masonry-layout.js.map +1 -1
- package/dist/components/media/info-card/info-card.js +51 -51
- package/dist/components/media/info-card/info-card.js.map +1 -1
- package/dist/components/media/media-card/media-card.js +133 -119
- package/dist/components/media/media-card/media-card.js.map +1 -1
- package/dist/components/navigation/nav-menu/items/base-item/base-item.js +38 -38
- package/dist/components/navigation/nav-menu/items/base-item/base-item.js.map +1 -1
- package/dist/components/navigation/nav-menu/items/nav-drop-down-item/nav-drop-down-item.js +58 -58
- package/dist/components/navigation/nav-menu/items/nav-drop-down-item/nav-drop-down-item.js.map +1 -1
- package/dist/components/navigation/nav-menu/nav-menu.js +104 -104
- package/dist/components/navigation/nav-menu/nav-menu.js.map +1 -1
- package/dist/components/navigation/side-nav/side-nav-item/side-nav-item.js +41 -41
- package/dist/components/navigation/side-nav/side-nav-item/side-nav-item.js.map +1 -1
- package/dist/components/navigation/side-nav/side-nav.js +15 -15
- package/dist/components/navigation/side-nav/side-nav.js.map +1 -1
- package/dist/components/typography/page-header/page-header.js +14 -14
- package/dist/components/typography/page-header/page-header.js.map +1 -1
- package/dist/components/ui/button/button.d.ts +1 -1
- package/dist/components/ui/button/button.js +2 -2
- package/dist/components/ui/button/button.js.map +1 -1
- package/dist/components/ui/button/button.types.d.ts +2 -0
- package/dist/components/ui/card/card.js +72 -72
- package/dist/components/ui/card/card.js.map +1 -1
- package/dist/components/ui/divider/divider.js +24 -22
- package/dist/components/ui/divider/divider.js.map +1 -1
- package/dist/components/ui/loaders/dots-loader/dots-loader.js +46 -46
- package/dist/components/ui/loaders/dots-loader/dots-loader.js.map +1 -1
- package/dist/components/ui/loaders/skeleton/skeleton.js +17 -17
- package/dist/components/ui/loaders/skeleton/skeleton.js.map +1 -1
- package/dist/components/ui/loaders/spin-loader/spin-loader.js +28 -28
- package/dist/components/ui/loaders/spin-loader/spin-loader.js.map +1 -1
- package/dist/components/ui/modal/components/modal-content.js +79 -79
- package/dist/components/ui/modal/components/modal-content.js.map +1 -1
- package/dist/components/ui/modal/modal.js +26 -14
- package/dist/components/ui/modal/modal.js.map +1 -1
- package/dist/components/ui/toggle/toggle.js +37 -48
- package/dist/components/ui/toggle/toggle.js.map +1 -1
- package/dist/styled-system/styles.css +1 -1
- package/dist/styles/panda.css +1 -1
- package/dist/theme/css-name-configurations/theme-css-names.d.ts +13 -1
- package/dist/types/theme/theme.types.d.ts +17 -17
- package/dist/types/utility/index.d.ts +1 -0
- package/dist/types/utility/type-production.types.d.ts +4 -0
- package/dist/types/utility/type-production.types.js +2 -0
- package/dist/types/utility/type-production.types.js.map +1 -0
- package/package.json +1 -1
- package/dist/components/data-display/filter-controls/filter-controls.js +0 -39
- package/dist/components/data-display/filter-controls/filter-controls.js.map +0 -1
|
@@ -2,88 +2,88 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { cva } from '../../../styled-system/css';
|
|
3
3
|
import { H3 } from '../../../components/typography';
|
|
4
4
|
import { Divider } from '../divider';
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
5
|
+
const styles = {
|
|
6
|
+
cardContainer: cva({
|
|
7
|
+
base: {
|
|
8
|
+
borderWidth: 'sm',
|
|
9
|
+
borderColor: 'structure',
|
|
10
|
+
padding: {
|
|
11
|
+
base: '5',
|
|
12
|
+
},
|
|
13
|
+
marginX: 'auto',
|
|
14
|
+
maxWidth: '850px',
|
|
15
|
+
width: {
|
|
16
|
+
base: '100%',
|
|
17
|
+
md: '75%',
|
|
18
|
+
},
|
|
19
|
+
},
|
|
20
|
+
variants: {
|
|
21
|
+
size: {
|
|
22
|
+
sm: {
|
|
23
|
+
borderRadius: 'sm',
|
|
24
|
+
maxWidth: '600px',
|
|
21
25
|
},
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
26
|
+
md: {
|
|
27
|
+
borderRadius: 'md',
|
|
28
|
+
},
|
|
29
|
+
lg: {
|
|
30
|
+
borderRadius: 'lg',
|
|
27
31
|
},
|
|
28
32
|
},
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
borderRadius: 'sm',
|
|
33
|
-
maxWidth: '600px',
|
|
34
|
-
},
|
|
35
|
-
md: {
|
|
36
|
-
borderRadius: 'md',
|
|
37
|
-
},
|
|
38
|
-
lg: {
|
|
39
|
-
borderRadius: 'lg',
|
|
40
|
-
},
|
|
33
|
+
surfaceColor: {
|
|
34
|
+
background: {
|
|
35
|
+
backgroundColor: 'background',
|
|
41
36
|
},
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
backgroundColor: 'background',
|
|
45
|
-
},
|
|
46
|
-
surface: {
|
|
47
|
-
backgroundColor: 'surface',
|
|
48
|
-
},
|
|
49
|
-
elevated: {
|
|
50
|
-
backgroundColor: 'elevated',
|
|
51
|
-
},
|
|
37
|
+
surface: {
|
|
38
|
+
backgroundColor: 'surface',
|
|
52
39
|
},
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
boxShadow: '0 1px 2px 0 rgb(0 0 0 / 0.05)',
|
|
56
|
-
},
|
|
57
|
-
false: {
|
|
58
|
-
boxShadow: 'none',
|
|
59
|
-
},
|
|
40
|
+
elevated: {
|
|
41
|
+
backgroundColor: 'elevated',
|
|
60
42
|
},
|
|
61
43
|
},
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
title: cva({
|
|
69
|
-
variants: {
|
|
70
|
-
size: {
|
|
71
|
-
sm: {
|
|
72
|
-
marginBottom: '1',
|
|
73
|
-
},
|
|
74
|
-
md: {
|
|
75
|
-
marginBottom: '3',
|
|
76
|
-
},
|
|
77
|
-
lg: {
|
|
78
|
-
marginBottom: '3',
|
|
79
|
-
},
|
|
44
|
+
shadow: {
|
|
45
|
+
true: {
|
|
46
|
+
boxShadow: '0 1px 2px 0 rgb(0 0 0 / 0.05)',
|
|
47
|
+
},
|
|
48
|
+
false: {
|
|
49
|
+
boxShadow: 'none',
|
|
80
50
|
},
|
|
81
51
|
},
|
|
82
|
-
|
|
83
|
-
|
|
52
|
+
},
|
|
53
|
+
defaultVariants: {
|
|
54
|
+
size: 'md',
|
|
55
|
+
surfaceColor: 'background',
|
|
56
|
+
shadow: true,
|
|
57
|
+
},
|
|
58
|
+
}),
|
|
59
|
+
title: cva({
|
|
60
|
+
variants: {
|
|
61
|
+
size: {
|
|
62
|
+
sm: {
|
|
63
|
+
marginBottom: '1',
|
|
64
|
+
},
|
|
65
|
+
md: {
|
|
66
|
+
marginBottom: '3',
|
|
67
|
+
},
|
|
68
|
+
lg: {
|
|
69
|
+
marginBottom: '3',
|
|
70
|
+
},
|
|
84
71
|
},
|
|
85
|
-
}
|
|
86
|
-
|
|
72
|
+
},
|
|
73
|
+
defaultVariants: {
|
|
74
|
+
size: 'md',
|
|
75
|
+
},
|
|
76
|
+
}),
|
|
77
|
+
};
|
|
78
|
+
/**
|
|
79
|
+
* General-purpose content card container with optional title, divider, shadow, and surface color variants.
|
|
80
|
+
*
|
|
81
|
+
* @example
|
|
82
|
+
* <Card title={{ text: 'Details', divider: true }} size="md" shadow>
|
|
83
|
+
* <div>Card content here</div>
|
|
84
|
+
* </Card>
|
|
85
|
+
*/
|
|
86
|
+
export const Card = ({ surfaceColor = 'background', children, size = 'md', shadow = true, title, }) => {
|
|
87
87
|
return (_jsxs("div", { className: styles.cardContainer({ size, surfaceColor, shadow }), children: [title && (_jsxs("div", { className: styles.title({ size }), children: [_jsx(H3, { align: title.align, inline: true, children: title.text }), title?.divider && _jsx(Divider, {})] })), _jsx("div", { children: children })] }));
|
|
88
88
|
};
|
|
89
89
|
//# sourceMappingURL=card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../../src/components/ui/card/card.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC
|
|
1
|
+
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../../src/components/ui/card/card.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,MAAM,MAAM,GAAG;IACd,aAAa,EAAE,GAAG,CAAC;QAClB,IAAI,EAAE;YACL,WAAW,EAAE,IAAI;YACjB,WAAW,EAAE,WAAW;YACxB,OAAO,EAAE;gBACR,IAAI,EAAE,GAAG;aACT;YACD,OAAO,EAAE,MAAM;YACf,QAAQ,EAAE,OAAO;YACjB,KAAK,EAAE;gBACN,IAAI,EAAE,MAAM;gBACZ,EAAE,EAAE,KAAK;aACT;SACD;QACD,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE;oBACH,YAAY,EAAE,IAAI;oBAClB,QAAQ,EAAE,OAAO;iBACjB;gBACD,EAAE,EAAE;oBACH,YAAY,EAAE,IAAI;iBAClB;gBACD,EAAE,EAAE;oBACH,YAAY,EAAE,IAAI;iBAClB;aACD;YACD,YAAY,EAAE;gBACb,UAAU,EAAE;oBACX,eAAe,EAAE,YAAY;iBAC7B;gBACD,OAAO,EAAE;oBACR,eAAe,EAAE,SAAS;iBAC1B;gBACD,QAAQ,EAAE;oBACT,eAAe,EAAE,UAAU;iBAC3B;aACD;YACD,MAAM,EAAE;gBACP,IAAI,EAAE;oBACL,SAAS,EAAE,+BAA+B;iBAC1C;gBACD,KAAK,EAAE;oBACN,SAAS,EAAE,MAAM;iBACjB;aACD;SACD;QACD,eAAe,EAAE;YAChB,IAAI,EAAE,IAAI;YACV,YAAY,EAAE,YAAY;YAC1B,MAAM,EAAE,IAAI;SACZ;KACD,CAAC;IACF,KAAK,EAAE,GAAG,CAAC;QACV,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE;oBACH,YAAY,EAAE,GAAG;iBACjB;gBACD,EAAE,EAAE;oBACH,YAAY,EAAE,GAAG;iBACjB;gBACD,EAAE,EAAE;oBACH,YAAY,EAAE,GAAG;iBACjB;aACD;SACD;QACD,eAAe,EAAE;YAChB,IAAI,EAAE,IAAI;SACV;KACD,CAAC;CACF,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EACpB,YAAY,GAAG,YAAY,EAC3B,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,MAAM,GAAG,IAAI,EACb,KAAK,GACM,EAAE,EAAE;IACf,OAAO,CACN,eAAK,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,EAAE,CAAC,aAClE,KAAK,IAAI,CACT,eAAK,SAAS,EAAE,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC,aACrC,KAAC,EAAE,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,MAAM,kBAC5B,KAAK,CAAC,IAAI,GACP,EACJ,KAAK,EAAE,OAAO,IAAI,KAAC,OAAO,KAAG,IACzB,CACN,EACD,wBAAM,QAAQ,GAAO,IAChB,CACN,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -1,25 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { css, cva, cx } from '../../../styled-system/css';
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
weight: {
|
|
6
|
-
light: { height: '0.5px' },
|
|
7
|
-
standard: { height: '1px' },
|
|
8
|
-
heavy: { height: '2px' },
|
|
9
|
-
},
|
|
10
|
-
},
|
|
11
|
-
defaultVariants: {
|
|
12
|
-
weight: 'standard',
|
|
13
|
-
},
|
|
14
|
-
});
|
|
15
|
-
/**
|
|
16
|
-
* Horizontal rule with configurable width, vertical margin, and weight.
|
|
17
|
-
*
|
|
18
|
-
* @example
|
|
19
|
-
* <Divider width="50%" marginY="12px" weight="light" />
|
|
20
|
-
*/
|
|
21
|
-
export const Divider = ({ width, marginY, weight }) => {
|
|
22
|
-
const styles = {
|
|
3
|
+
const styles = {
|
|
4
|
+
core: {
|
|
23
5
|
base: css({
|
|
24
6
|
marginX: 'auto',
|
|
25
7
|
backgroundColor: 'structure',
|
|
@@ -30,12 +12,32 @@ export const Divider = ({ width, marginY, weight }) => {
|
|
|
30
12
|
width: css({
|
|
31
13
|
width: '75%',
|
|
32
14
|
}),
|
|
33
|
-
}
|
|
15
|
+
},
|
|
16
|
+
dividerWeight: cva({
|
|
17
|
+
variants: {
|
|
18
|
+
weight: {
|
|
19
|
+
light: { height: '0.5px' },
|
|
20
|
+
standard: { height: '1px' },
|
|
21
|
+
heavy: { height: '2px' },
|
|
22
|
+
},
|
|
23
|
+
},
|
|
24
|
+
defaultVariants: {
|
|
25
|
+
weight: 'standard',
|
|
26
|
+
},
|
|
27
|
+
}),
|
|
28
|
+
};
|
|
29
|
+
/**
|
|
30
|
+
* Horizontal rule with configurable width, vertical margin, and weight.
|
|
31
|
+
*
|
|
32
|
+
* @example
|
|
33
|
+
* <Divider width="50%" marginY="12px" weight="light" />
|
|
34
|
+
*/
|
|
35
|
+
export const Divider = ({ width, marginY, weight }) => {
|
|
34
36
|
const staticStyles = {
|
|
35
37
|
...(width && { width }),
|
|
36
38
|
...(marginY && { marginTop: marginY, marginBottom: marginY }),
|
|
37
39
|
};
|
|
38
|
-
const className = cx(styles.base, dividerWeight({ weight }), !marginY && styles.marginY, !width && styles.width);
|
|
40
|
+
const className = cx(styles.core.base, styles.dividerWeight({ weight }), !marginY && styles.core.marginY, !width && styles.core.width);
|
|
39
41
|
return _jsx("div", { style: staticStyles, className: className });
|
|
40
42
|
};
|
|
41
43
|
//# sourceMappingURL=divider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../../src/components/ui/divider/divider.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AAGnD,MAAM,
|
|
1
|
+
{"version":3,"file":"divider.js","sourceRoot":"","sources":["../../../../src/components/ui/divider/divider.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AAGnD,MAAM,MAAM,GAAG;IACd,IAAI,EAAE;QACL,IAAI,EAAE,GAAG,CAAC;YACT,OAAO,EAAE,MAAM;YACf,eAAe,EAAE,WAAW;SAC5B,CAAC;QACF,OAAO,EAAE,GAAG,CAAC;YACZ,OAAO,EAAE,MAAM;SACf,CAAC;QACF,KAAK,EAAE,GAAG,CAAC;YACV,KAAK,EAAE,KAAK;SACZ,CAAC;KACF;IACD,aAAa,EAAE,GAAG,CAAC;QAClB,QAAQ,EAAE;YACT,MAAM,EAAE;gBACP,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE;gBAC1B,QAAQ,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE;gBAC3B,KAAK,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE;aACxB;SACD;QACD,eAAe,EAAE;YAChB,MAAM,EAAE,UAAU;SAClB;KACD,CAAC;CACF,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAgB,EAAE,EAAE;IACnE,MAAM,YAAY,GAAkB;QACnC,GAAG,CAAC,KAAK,IAAI,EAAE,KAAK,EAAE,CAAC;QACvB,GAAG,CAAC,OAAO,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,CAAC;KAC7D,CAAC;IAEF,MAAM,SAAS,GAAG,EAAE,CACnB,MAAM,CAAC,IAAI,CAAC,IAAI,EAChB,MAAM,CAAC,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC,EAChC,CAAC,OAAO,IAAI,MAAM,CAAC,IAAI,CAAC,OAAO,EAC/B,CAAC,KAAK,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAC3B,CAAC;IAEF,OAAO,cAAK,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;AAC3D,CAAC,CAAC"}
|
|
@@ -1,5 +1,51 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cva } from '../../../../styled-system/css';
|
|
3
|
+
const styles = {
|
|
4
|
+
container: cva({
|
|
5
|
+
base: {
|
|
6
|
+
display: 'inline-flex',
|
|
7
|
+
},
|
|
8
|
+
variants: {
|
|
9
|
+
size: {
|
|
10
|
+
sm: {
|
|
11
|
+
gap: '1.5',
|
|
12
|
+
},
|
|
13
|
+
md: {
|
|
14
|
+
gap: '1.5',
|
|
15
|
+
},
|
|
16
|
+
lg: {
|
|
17
|
+
gap: '3',
|
|
18
|
+
},
|
|
19
|
+
},
|
|
20
|
+
},
|
|
21
|
+
}),
|
|
22
|
+
dot: cva({
|
|
23
|
+
base: {
|
|
24
|
+
borderRadius: 'full',
|
|
25
|
+
display: 'inline-block',
|
|
26
|
+
animation: 'pulse 1.2s ease-in-out infinite',
|
|
27
|
+
},
|
|
28
|
+
variants: {
|
|
29
|
+
size: {
|
|
30
|
+
sm: { w: '2', h: '2' },
|
|
31
|
+
md: { w: '4', h: '4' },
|
|
32
|
+
lg: { w: '8', h: '8' },
|
|
33
|
+
},
|
|
34
|
+
color: {
|
|
35
|
+
primary: { bg: 'primary.light' },
|
|
36
|
+
secondary: { bg: 'secondary.light' },
|
|
37
|
+
tertiary: { bg: 'tertiary.light' },
|
|
38
|
+
black: { bg: 'black' },
|
|
39
|
+
gray: { bg: 'gray.main' },
|
|
40
|
+
text: { bg: 'text.standard' },
|
|
41
|
+
},
|
|
42
|
+
},
|
|
43
|
+
defaultVariants: {
|
|
44
|
+
size: 'md',
|
|
45
|
+
color: 'primary',
|
|
46
|
+
},
|
|
47
|
+
}),
|
|
48
|
+
};
|
|
3
49
|
/**
|
|
4
50
|
* Three-dot pulsing loader with configurable label, size and color.
|
|
5
51
|
*
|
|
@@ -7,52 +53,6 @@ import { cva } from '../../../../styled-system/css';
|
|
|
7
53
|
* <DotsLoader size="md" color="primary" />
|
|
8
54
|
*/
|
|
9
55
|
export const DotsLoader = ({ size = 'md', color, label = 'Loading...' }) => {
|
|
10
|
-
const styles = {
|
|
11
|
-
container: cva({
|
|
12
|
-
base: {
|
|
13
|
-
display: 'inline-flex',
|
|
14
|
-
},
|
|
15
|
-
variants: {
|
|
16
|
-
size: {
|
|
17
|
-
sm: {
|
|
18
|
-
gap: '1.5',
|
|
19
|
-
},
|
|
20
|
-
md: {
|
|
21
|
-
gap: '1.5',
|
|
22
|
-
},
|
|
23
|
-
lg: {
|
|
24
|
-
gap: '3',
|
|
25
|
-
},
|
|
26
|
-
},
|
|
27
|
-
},
|
|
28
|
-
}),
|
|
29
|
-
dot: cva({
|
|
30
|
-
base: {
|
|
31
|
-
borderRadius: 'full',
|
|
32
|
-
display: 'inline-block',
|
|
33
|
-
animation: 'pulse 1.2s ease-in-out infinite',
|
|
34
|
-
},
|
|
35
|
-
variants: {
|
|
36
|
-
size: {
|
|
37
|
-
sm: { w: '2', h: '2' },
|
|
38
|
-
md: { w: '4', h: '4' },
|
|
39
|
-
lg: { w: '8', h: '8' },
|
|
40
|
-
},
|
|
41
|
-
color: {
|
|
42
|
-
primary: { bg: 'primary.light' },
|
|
43
|
-
secondary: { bg: 'secondary.light' },
|
|
44
|
-
tertiary: { bg: 'tertiary.light' },
|
|
45
|
-
black: { bg: 'black' },
|
|
46
|
-
gray: { bg: 'gray.main' },
|
|
47
|
-
text: { bg: 'text.standard' },
|
|
48
|
-
},
|
|
49
|
-
},
|
|
50
|
-
defaultVariants: {
|
|
51
|
-
size: 'md',
|
|
52
|
-
color: 'primary',
|
|
53
|
-
},
|
|
54
|
-
}),
|
|
55
|
-
};
|
|
56
56
|
const dotClass = styles.dot({ size, color });
|
|
57
57
|
return (_jsxs("div", { role: "status", "aria-label": label, className: styles.container({ size }), children: [_jsx("span", { className: dotClass, style: { animationDelay: '0s' } }), _jsx("span", { className: dotClass, style: { animationDelay: '0.2s' } }), _jsx("span", { className: dotClass, style: { animationDelay: '0.4s' } })] }));
|
|
58
58
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dots-loader.js","sourceRoot":"","sources":["../../../../../src/components/ui/loaders/dots-loader/dots-loader.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM
|
|
1
|
+
{"version":3,"file":"dots-loader.js","sourceRoot":"","sources":["../../../../../src/components/ui/loaders/dots-loader/dots-loader.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,MAAM,MAAM,GAAG;IACd,SAAS,EAAE,GAAG,CAAC;QACd,IAAI,EAAE;YACL,OAAO,EAAE,aAAa;SACtB;QACD,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE;oBACH,GAAG,EAAE,KAAK;iBACV;gBACD,EAAE,EAAE;oBACH,GAAG,EAAE,KAAK;iBACV;gBACD,EAAE,EAAE;oBACH,GAAG,EAAE,GAAG;iBACR;aACD;SACD;KACD,CAAC;IACF,GAAG,EAAE,GAAG,CAAC;QACR,IAAI,EAAE;YACL,YAAY,EAAE,MAAM;YACpB,OAAO,EAAE,cAAc;YACvB,SAAS,EAAE,iCAAiC;SAC5C;QACD,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE;gBACtB,EAAE,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE;gBACtB,EAAE,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE;aACtB;YACD,KAAK,EAAE;gBACN,OAAO,EAAE,EAAE,EAAE,EAAE,eAAe,EAAE;gBAChC,SAAS,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE;gBACpC,QAAQ,EAAE,EAAE,EAAE,EAAE,gBAAgB,EAAE;gBAClC,KAAK,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE;gBACtB,IAAI,EAAE,EAAE,EAAE,EAAE,WAAW,EAAE;gBACzB,IAAI,EAAE,EAAE,EAAE,EAAE,eAAe,EAAE;aAC7B;SACD;QACD,eAAe,EAAE;YAChB,IAAI,EAAE,IAAI;YACV,KAAK,EAAE,SAAS;SAChB;KACD,CAAC;CACF,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAAE,IAAI,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,GAAG,YAAY,EAAmB,EAAE,EAAE;IAC3F,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;IAE7C,OAAO,CACN,eAAK,IAAI,EAAC,QAAQ,gBAAa,KAAK,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,CAAC,aAC1E,eAAM,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,IAAI,EAAE,GAAI,EAC9D,eAAM,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE,GAAI,EAChE,eAAM,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE,GAAI,IAC3D,CACN,CAAC;AACH,CAAC,CAAC"}
|
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { cva } from '../../../../styled-system/css';
|
|
3
|
+
const styles = cva({
|
|
4
|
+
base: {
|
|
5
|
+
display: 'block',
|
|
6
|
+
backgroundImage: `linear-gradient(90deg, var(--thread-elevated) 25%, var(--thread-structure) 50%, var(--thread-elevated) 75%)`,
|
|
7
|
+
backgroundSize: '200% 100%',
|
|
8
|
+
animation: 'shimmer 1.5s linear infinite',
|
|
9
|
+
},
|
|
10
|
+
variants: {
|
|
11
|
+
round: {
|
|
12
|
+
true: { borderRadius: 'full' },
|
|
13
|
+
false: { borderRadius: 'sm' },
|
|
14
|
+
},
|
|
15
|
+
},
|
|
16
|
+
defaultVariants: {
|
|
17
|
+
round: false,
|
|
18
|
+
},
|
|
19
|
+
});
|
|
3
20
|
/**
|
|
4
21
|
* Low-level skeleton primitive for building content placeholder layouts.
|
|
5
22
|
* Compose multiple instances to mirror the shape of loading content.
|
|
@@ -9,23 +26,6 @@ import { cva } from '../../../../styled-system/css';
|
|
|
9
26
|
* <Skeleton w="10" h="10" round />
|
|
10
27
|
*/
|
|
11
28
|
export const Skeleton = ({ w = '100%', h = '3rem', round = false }) => {
|
|
12
|
-
const styles = cva({
|
|
13
|
-
base: {
|
|
14
|
-
display: 'block',
|
|
15
|
-
backgroundImage: `linear-gradient(90deg, var(--thread-elevated) 25%, var(--thread-structure) 50%, var(--thread-elevated) 75%)`,
|
|
16
|
-
backgroundSize: '200% 100%',
|
|
17
|
-
animation: 'shimmer 1.5s linear infinite',
|
|
18
|
-
},
|
|
19
|
-
variants: {
|
|
20
|
-
round: {
|
|
21
|
-
true: { borderRadius: 'full' },
|
|
22
|
-
false: { borderRadius: 'sm' },
|
|
23
|
-
},
|
|
24
|
-
},
|
|
25
|
-
defaultVariants: {
|
|
26
|
-
round: false,
|
|
27
|
-
},
|
|
28
|
-
});
|
|
29
29
|
return _jsx("span", { role: "status", className: styles({ round }), style: { width: w, height: h } });
|
|
30
30
|
};
|
|
31
31
|
//# sourceMappingURL=skeleton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skeleton.js","sourceRoot":"","sources":["../../../../../src/components/ui/loaders/skeleton/skeleton.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"skeleton.js","sourceRoot":"","sources":["../../../../../src/components/ui/loaders/skeleton/skeleton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAG1C,MAAM,MAAM,GAAG,GAAG,CAAC;IAClB,IAAI,EAAE;QACL,OAAO,EAAE,OAAO;QAChB,eAAe,EAAE,6GAA6G;QAC9H,cAAc,EAAE,WAAW;QAC3B,SAAS,EAAE,8BAA8B;KACzC;IACD,QAAQ,EAAE;QACT,KAAK,EAAE;YACN,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE;YAC9B,KAAK,EAAE,EAAE,YAAY,EAAE,IAAI,EAAE;SAC7B;KACD;IACD,eAAe,EAAE;QAChB,KAAK,EAAE,KAAK;KACZ;CACD,CAAC,CAAC;AAEH;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,EAAE,CAAC,GAAG,MAAM,EAAE,KAAK,GAAG,KAAK,EAAiB,EAAE,EAAE;IACpF,OAAO,eAAM,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,GAAI,CAAC;AAC7F,CAAC,CAAC"}
|
|
@@ -1,5 +1,33 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { cva } from '../../../../styled-system/css';
|
|
3
|
+
const styles = cva({
|
|
4
|
+
base: {
|
|
5
|
+
borderRadius: 'full',
|
|
6
|
+
borderStyle: 'solid',
|
|
7
|
+
borderColor: 'gray.light',
|
|
8
|
+
display: 'inline-block',
|
|
9
|
+
animation: 'spin 0.75s linear infinite',
|
|
10
|
+
},
|
|
11
|
+
variants: {
|
|
12
|
+
size: {
|
|
13
|
+
sm: { w: '4', h: '4', borderWidth: '2px' },
|
|
14
|
+
md: { w: '12', h: '12', borderWidth: '4px' },
|
|
15
|
+
lg: { w: '20', h: '20', borderWidth: '8px' },
|
|
16
|
+
},
|
|
17
|
+
color: {
|
|
18
|
+
primary: { borderTopColor: 'primary.light' },
|
|
19
|
+
secondary: { borderTopColor: 'secondary.light' },
|
|
20
|
+
tertiary: { borderTopColor: 'tertiary.light' },
|
|
21
|
+
black: { borderTopColor: 'black' },
|
|
22
|
+
gray: { borderTopColor: 'gray.main' },
|
|
23
|
+
text: { borderTopColor: 'text.standard' },
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
defaultVariants: {
|
|
27
|
+
size: 'md',
|
|
28
|
+
color: 'primary',
|
|
29
|
+
},
|
|
30
|
+
});
|
|
3
31
|
/**
|
|
4
32
|
* Spinning circular loader with configurable label, size and color.
|
|
5
33
|
*
|
|
@@ -7,34 +35,6 @@ import { cva } from '../../../../styled-system/css';
|
|
|
7
35
|
* <SpinLoader size="md" color="primary" />
|
|
8
36
|
*/
|
|
9
37
|
export const SpinLoader = ({ size = 'md', color, label = 'Loading...' }) => {
|
|
10
|
-
const styles = cva({
|
|
11
|
-
base: {
|
|
12
|
-
borderRadius: 'full',
|
|
13
|
-
borderStyle: 'solid',
|
|
14
|
-
borderColor: 'gray.light',
|
|
15
|
-
display: 'inline-block',
|
|
16
|
-
animation: 'spin 0.75s linear infinite',
|
|
17
|
-
},
|
|
18
|
-
variants: {
|
|
19
|
-
size: {
|
|
20
|
-
sm: { w: '4', h: '4', borderWidth: '2px' },
|
|
21
|
-
md: { w: '12', h: '12', borderWidth: '4px' },
|
|
22
|
-
lg: { w: '20', h: '20', borderWidth: '8px' },
|
|
23
|
-
},
|
|
24
|
-
color: {
|
|
25
|
-
primary: { borderTopColor: 'primary.light' },
|
|
26
|
-
secondary: { borderTopColor: 'secondary.light' },
|
|
27
|
-
tertiary: { borderTopColor: 'tertiary.light' },
|
|
28
|
-
black: { borderTopColor: 'black' },
|
|
29
|
-
gray: { borderTopColor: 'gray.main' },
|
|
30
|
-
text: { borderTopColor: 'text.standard' },
|
|
31
|
-
},
|
|
32
|
-
},
|
|
33
|
-
defaultVariants: {
|
|
34
|
-
size: 'md',
|
|
35
|
-
color: 'primary',
|
|
36
|
-
},
|
|
37
|
-
});
|
|
38
38
|
return _jsx("div", { role: "status", "aria-label": label, className: styles({ size, color }) });
|
|
39
39
|
};
|
|
40
40
|
//# sourceMappingURL=spin-loader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spin-loader.js","sourceRoot":"","sources":["../../../../../src/components/ui/loaders/spin-loader/spin-loader.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM
|
|
1
|
+
{"version":3,"file":"spin-loader.js","sourceRoot":"","sources":["../../../../../src/components/ui/loaders/spin-loader/spin-loader.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C,MAAM,MAAM,GAAG,GAAG,CAAC;IAClB,IAAI,EAAE;QACL,YAAY,EAAE,MAAM;QACpB,WAAW,EAAE,OAAO;QACpB,WAAW,EAAE,YAAY;QACzB,OAAO,EAAE,cAAc;QACvB,SAAS,EAAE,4BAA4B;KACvC;IACD,QAAQ,EAAE;QACT,IAAI,EAAE;YACL,EAAE,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,WAAW,EAAE,KAAK,EAAE;YAC1C,EAAE,EAAE,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE;YAC5C,EAAE,EAAE,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE;SAC5C;QACD,KAAK,EAAE;YACN,OAAO,EAAE,EAAE,cAAc,EAAE,eAAe,EAAE;YAC5C,SAAS,EAAE,EAAE,cAAc,EAAE,iBAAiB,EAAE;YAChD,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE;YAC9C,KAAK,EAAE,EAAE,cAAc,EAAE,OAAO,EAAE;YAClC,IAAI,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE;YACrC,IAAI,EAAE,EAAE,cAAc,EAAE,eAAe,EAAE;SACzC;KACD;IACD,eAAe,EAAE;QAChB,IAAI,EAAE,IAAI;QACV,KAAK,EAAE,SAAS;KAChB;CACD,CAAC,CAAC;AAEH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAAE,IAAI,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,GAAG,YAAY,EAAmB,EAAE,EAAE;IAC3F,OAAO,cAAK,IAAI,EAAC,QAAQ,gBAAa,KAAK,EAAE,SAAS,EAAE,MAAM,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAI,CAAC;AACrF,CAAC,CAAC"}
|