shared-design-system 1.19.0 → 1.23.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/src/components/Alert.d.ts +1 -1
- package/dist/src/components/Alert.js +34 -20
- package/dist/src/components/Alert.js.map +1 -1
- package/dist/src/components/Avatar.d.ts +7 -2
- package/dist/src/components/Avatar.js +15 -12
- package/dist/src/components/Avatar.js.map +1 -1
- package/dist/src/components/Badge.d.ts +1 -1
- package/dist/src/components/Badge.js +113 -89
- package/dist/src/components/Badge.js.map +1 -1
- package/dist/src/components/Breadcrumbs.d.ts +1 -1
- package/dist/src/components/Breadcrumbs.js +7 -9
- package/dist/src/components/Breadcrumbs.js.map +1 -1
- package/dist/src/components/Button.d.ts +1 -1
- package/dist/src/components/Button.js +6 -4
- package/dist/src/components/Button.js.map +1 -1
- package/dist/src/components/ConfigProvider.d.ts +17 -0
- package/dist/src/components/ConfigProvider.js +54 -0
- package/dist/src/components/ConfigProvider.js.map +1 -0
- package/dist/src/components/ConfirmModal.d.ts +1 -1
- package/dist/src/components/ConfirmModal.js +82 -72
- package/dist/src/components/ConfirmModal.js.map +1 -1
- package/dist/src/components/DatePicker.d.ts +1 -1
- package/dist/src/components/DatePicker.js +33 -10
- package/dist/src/components/DatePicker.js.map +1 -1
- package/dist/src/components/Descriptions.d.ts +15 -0
- package/dist/src/components/Descriptions.js +44 -0
- package/dist/src/components/Descriptions.js.map +1 -0
- package/dist/src/components/Divider.d.ts +1 -1
- package/dist/src/components/Divider.js +21 -16
- package/dist/src/components/Divider.js.map +1 -1
- package/dist/src/components/Drawer.d.ts +1 -1
- package/dist/src/components/Drawer.js +81 -68
- package/dist/src/components/Drawer.js.map +1 -1
- package/dist/src/components/Dropdown.d.ts +17 -0
- package/dist/src/components/Dropdown.js +129 -0
- package/dist/src/components/Dropdown.js.map +1 -0
- package/dist/src/components/Empty.d.ts +9 -0
- package/dist/src/components/Empty.js +15 -0
- package/dist/src/components/Empty.js.map +1 -0
- package/dist/src/components/Form.d.ts +35 -0
- package/dist/src/components/Form.js +54 -0
- package/dist/src/components/Form.js.map +1 -0
- package/dist/src/components/InputComponents.d.ts +4 -4
- package/dist/src/components/InputComponents.js +57 -26
- package/dist/src/components/InputComponents.js.map +1 -1
- package/dist/src/components/ListComponents.d.ts +4 -2
- package/dist/src/components/ListComponents.js +36 -15
- package/dist/src/components/ListComponents.js.map +1 -1
- package/dist/src/components/Message.d.ts +20 -0
- package/dist/src/components/Message.js +69 -0
- package/dist/src/components/Message.js.map +1 -0
- package/dist/src/components/Modal.d.ts +1 -1
- package/dist/src/components/Modal.js +90 -77
- package/dist/src/components/Modal.js.map +1 -1
- package/dist/src/components/MultiSelect.d.ts +1 -1
- package/dist/src/components/MultiSelect.js +65 -20
- package/dist/src/components/MultiSelect.js.map +1 -1
- package/dist/src/components/Popconfirm.d.ts +12 -0
- package/dist/src/components/Popconfirm.js +24 -0
- package/dist/src/components/Popconfirm.js.map +1 -0
- package/dist/src/components/Popover.d.ts +10 -0
- package/dist/src/components/Popover.js +108 -0
- package/dist/src/components/Popover.js.map +1 -0
- package/dist/src/components/Portal.d.ts +11 -0
- package/dist/src/components/Portal.js +30 -0
- package/dist/src/components/Portal.js.map +1 -0
- package/dist/src/components/Radio.d.ts +5 -2
- package/dist/src/components/Radio.js +10 -6
- package/dist/src/components/Radio.js.map +1 -1
- package/dist/src/components/Result.d.ts +9 -0
- package/dist/src/components/Result.js +52 -0
- package/dist/src/components/Result.js.map +1 -0
- package/dist/src/components/Select.d.ts +1 -1
- package/dist/src/components/Select.js +70 -19
- package/dist/src/components/Select.js.map +1 -1
- package/dist/src/components/Skeleton.d.ts +1 -1
- package/dist/src/components/Skeleton.js +10 -7
- package/dist/src/components/Skeleton.js.map +1 -1
- package/dist/src/components/Steps.d.ts +1 -1
- package/dist/src/components/Steps.js +17 -14
- package/dist/src/components/Steps.js.map +1 -1
- package/dist/src/components/Switch.d.ts +1 -1
- package/dist/src/components/Switch.js +6 -6
- package/dist/src/components/Switch.js.map +1 -1
- package/dist/src/components/Table.d.ts +20 -7
- package/dist/src/components/Table.js +140 -113
- package/dist/src/components/Table.js.map +1 -1
- package/dist/src/components/Tabs.d.ts +4 -2
- package/dist/src/components/Tabs.js +15 -10
- package/dist/src/components/Tabs.js.map +1 -1
- package/dist/src/components/Tag.d.ts +1 -1
- package/dist/src/components/Tag.js +17 -8
- package/dist/src/components/Tag.js.map +1 -1
- package/dist/src/components/Timeline.d.ts +13 -0
- package/dist/src/components/Timeline.js +35 -0
- package/dist/src/components/Timeline.js.map +1 -0
- package/dist/src/components/Tooltip.d.ts +1 -1
- package/dist/src/components/Tooltip.js +17 -10
- package/dist/src/components/Tooltip.js.map +1 -1
- package/dist/src/components/Typography.d.ts +5 -5
- package/dist/src/components/Typography.js +38 -23
- package/dist/src/components/Typography.js.map +1 -1
- package/dist/src/index.d.ts +25 -4
- package/dist/src/index.js +15 -5
- package/dist/src/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { tokens } from '../tokens';
|
|
4
|
-
export const Tabs = ({ value, onChange, items, children, variant = 'standard', columns = 4, className = '', style = {}, }) => {
|
|
4
|
+
export const Tabs = React.forwardRef(({ value, onChange, items, children, variant = 'standard', columns = 4, className = '', style = {}, ...props }, ref) => {
|
|
5
5
|
const isPills = variant === 'pills';
|
|
6
6
|
const isDashboard = variant === 'dashboard';
|
|
7
7
|
const isUnderline = variant === 'underline' || variant === 'standard';
|
|
@@ -24,7 +24,7 @@ export const Tabs = ({ value, onChange, items, children, variant = 'standard', c
|
|
|
24
24
|
borderRadius: isPills ? tokens.radius.xl : 'none',
|
|
25
25
|
...style,
|
|
26
26
|
};
|
|
27
|
-
return (_jsx("div", { style: containerStyle, className: `ds-tabs ds-tabs--${variant} ${className}`, role: "tablist", children: items
|
|
27
|
+
return (_jsx("div", { ref: ref, style: containerStyle, className: `ds-tabs ds-tabs--${variant} ${className}`, role: "tablist", ...props, children: items
|
|
28
28
|
? items.map((item, index) => (_jsx(Tab, { label: item.label, value: item.value, icon: item.icon, badge: item.badge, disabled: item.disabled, active: item.value === value, onClick: () => !item.disabled && onChange(item.value), variant: variant }, index)))
|
|
29
29
|
: React.Children.map(children, (child) => {
|
|
30
30
|
if (!React.isValidElement(child))
|
|
@@ -35,12 +35,13 @@ export const Tabs = ({ value, onChange, items, children, variant = 'standard', c
|
|
|
35
35
|
variant,
|
|
36
36
|
});
|
|
37
37
|
}) }));
|
|
38
|
-
};
|
|
39
|
-
|
|
38
|
+
});
|
|
39
|
+
Tabs.displayName = 'Tabs';
|
|
40
|
+
export const Tab = React.forwardRef(({ label, value, icon, badge, active, disabled = false, onClick, variant, className = '', style = {}, ...props }, ref) => {
|
|
40
41
|
const isPills = variant === 'pills';
|
|
41
42
|
const isDashboard = variant === 'dashboard';
|
|
42
43
|
if (isDashboard) {
|
|
43
|
-
return (_jsxs("div", { role: "tab", "aria-selected": active, style: {
|
|
44
|
+
return (_jsxs("div", { ref: ref, role: "tab", "aria-selected": active, "aria-disabled": disabled, style: {
|
|
44
45
|
position: 'relative',
|
|
45
46
|
cursor: disabled ? 'not-allowed' : 'pointer',
|
|
46
47
|
backgroundColor: tokens.color.white,
|
|
@@ -54,7 +55,7 @@ export const Tab = ({ label, value, icon, badge, active, disabled = false, onCli
|
|
|
54
55
|
gap: tokens.spacing[3],
|
|
55
56
|
opacity: disabled ? 0.5 : 1,
|
|
56
57
|
...style,
|
|
57
|
-
}, onClick: disabled ? undefined : onClick, className: className, children: [icon && (_jsx("span", { style: {
|
|
58
|
+
}, onClick: disabled ? undefined : onClick, className: className, ...props, children: [icon && (_jsx("span", { style: {
|
|
58
59
|
display: 'flex',
|
|
59
60
|
padding: tokens.spacing[2],
|
|
60
61
|
borderRadius: tokens.radius.md,
|
|
@@ -69,7 +70,7 @@ export const Tab = ({ label, value, icon, badge, active, disabled = false, onCli
|
|
|
69
70
|
}, children: label }), badge && _jsx("span", { style: { marginLeft: 'auto' }, children: badge })] }));
|
|
70
71
|
}
|
|
71
72
|
// Pills & Standard/Underline
|
|
72
|
-
return (_jsxs("div", { role: "tab", "aria-selected": active, style: {
|
|
73
|
+
return (_jsxs("div", { ref: ref, role: "tab", "aria-selected": active, "aria-disabled": disabled, style: {
|
|
73
74
|
display: 'inline-flex',
|
|
74
75
|
alignItems: 'center',
|
|
75
76
|
gap: tokens.spacing[2],
|
|
@@ -81,7 +82,9 @@ export const Tab = ({ label, value, icon, badge, active, disabled = false, onCli
|
|
|
81
82
|
color: active ? tokens.color.primary : tokens.color.textMuted,
|
|
82
83
|
cursor: disabled ? 'not-allowed' : 'pointer',
|
|
83
84
|
borderRadius: isPills ? tokens.radius.lg : '0',
|
|
84
|
-
borderBottom: !isPills
|
|
85
|
+
borderBottom: !isPills
|
|
86
|
+
? `2px solid ${active ? tokens.color.primary : 'transparent'}`
|
|
87
|
+
: 'none',
|
|
85
88
|
backgroundColor: isPills && active ? tokens.color.surface : 'transparent',
|
|
86
89
|
boxShadow: isPills && active ? tokens.shadow.sm : 'none',
|
|
87
90
|
transition: tokens.transition.fast,
|
|
@@ -89,6 +92,8 @@ export const Tab = ({ label, value, icon, badge, active, disabled = false, onCli
|
|
|
89
92
|
opacity: disabled ? 0.45 : 1,
|
|
90
93
|
userSelect: 'none',
|
|
91
94
|
...style,
|
|
92
|
-
}, onClick: disabled ? undefined : onClick, className: className, children: [icon && _jsx("span", { style: { display: 'inline-flex', alignItems: 'center' }, children: icon }), label, badge && _jsx("span", { style: { marginLeft: '2px' }, children: badge })] }));
|
|
93
|
-
};
|
|
95
|
+
}, onClick: disabled ? undefined : onClick, className: className, ...props, children: [icon && _jsx("span", { style: { display: 'inline-flex', alignItems: 'center' }, children: icon }), label, badge && _jsx("span", { style: { marginLeft: '2px' }, children: badge })] }));
|
|
96
|
+
});
|
|
97
|
+
Tab.displayName = 'Tabs.Tab';
|
|
98
|
+
Tabs.Tab = Tab;
|
|
94
99
|
//# sourceMappingURL=Tabs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/components/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AA6BnC,MAAM,CAAC,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/components/Tabs.tsx"],"names":[],"mappings":"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"}
|
|
@@ -7,4 +7,4 @@ export interface TagProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
|
7
7
|
icon?: React.ReactNode;
|
|
8
8
|
clickable?: boolean;
|
|
9
9
|
}
|
|
10
|
-
export declare const Tag: React.
|
|
10
|
+
export declare const Tag: React.ForwardRefExoticComponent<TagProps & React.RefAttributes<HTMLSpanElement>>;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import React from 'react';
|
|
2
3
|
import { tokens } from '../tokens';
|
|
3
4
|
const COLOR_SCHEMES = {
|
|
4
5
|
// primary = brand red
|
|
@@ -67,7 +68,7 @@ const COLOR_SCHEMES = {
|
|
|
67
68
|
border: tokens.color.slate200,
|
|
68
69
|
},
|
|
69
70
|
};
|
|
70
|
-
export const Tag = ({ children, color = 'slate', variant = 'subtle', size = 'md', className = '', style = {}, onClose, icon, clickable = false, onClick, ...props }) => {
|
|
71
|
+
export const Tag = React.forwardRef(({ children, color = 'slate', variant = 'subtle', size = 'md', className = '', style = {}, onClose, icon, clickable = false, onClick, ...props }, ref) => {
|
|
71
72
|
const c = COLOR_SCHEMES[color] || COLOR_SCHEMES.slate;
|
|
72
73
|
const isGradient = variant === 'gradient';
|
|
73
74
|
const backgroundStyle = () => {
|
|
@@ -76,10 +77,16 @@ export const Tag = ({ children, color = 'slate', variant = 'subtle', size = 'md'
|
|
|
76
77
|
}
|
|
77
78
|
if (isGradient && (color === 'gold' || color === 'accent')) {
|
|
78
79
|
// brand gradient: red → yellow
|
|
79
|
-
return {
|
|
80
|
+
return {
|
|
81
|
+
background: `linear-gradient(135deg, ${tokens.color.primary} 0%, ${tokens.color.accent} 100%)`,
|
|
82
|
+
color: '#fff',
|
|
83
|
+
};
|
|
80
84
|
}
|
|
81
85
|
if (isGradient && color === 'primary') {
|
|
82
|
-
return {
|
|
86
|
+
return {
|
|
87
|
+
background: `linear-gradient(135deg, ${tokens.color.primary} 0%, ${tokens.color.primaryDark} 100%)`,
|
|
88
|
+
color: '#fff',
|
|
89
|
+
};
|
|
83
90
|
}
|
|
84
91
|
if (variant === 'solid' || isGradient) {
|
|
85
92
|
return { backgroundColor: c.bg, color: c.text };
|
|
@@ -89,9 +96,7 @@ export const Tag = ({ children, color = 'slate', variant = 'subtle', size = 'md'
|
|
|
89
96
|
}
|
|
90
97
|
return { backgroundColor: c.lightBg, color: c.lightText };
|
|
91
98
|
};
|
|
92
|
-
const borderColor = variant === 'outline' ? c.lightText :
|
|
93
|
-
variant === 'subtle' ? c.border :
|
|
94
|
-
'transparent';
|
|
99
|
+
const borderColor = variant === 'outline' ? c.lightText : variant === 'subtle' ? c.border : 'transparent';
|
|
95
100
|
const sizeStyles = size === 'sm'
|
|
96
101
|
? { padding: '1px 8px', fontSize: '10px', gap: '4px' }
|
|
97
102
|
: { padding: '3px 10px', fontSize: '11px', gap: '5px' };
|
|
@@ -112,7 +117,10 @@ export const Tag = ({ children, color = 'slate', variant = 'subtle', size = 'md'
|
|
|
112
117
|
...backgroundStyle(),
|
|
113
118
|
...style,
|
|
114
119
|
};
|
|
115
|
-
return (_jsxs("span", { style: baseStyle, className: `ds-tag ${className}`, onClick: onClick, ...props, children: [icon &&
|
|
120
|
+
return (_jsxs("span", { ref: ref, style: baseStyle, className: `ds-tag ${className}`, onClick: onClick, ...props, children: [icon && _jsx("span", { style: { display: 'inline-flex', alignItems: 'center', flexShrink: 0 }, children: icon }), children, onClose && (_jsx("span", { onClick: (e) => {
|
|
121
|
+
e.stopPropagation();
|
|
122
|
+
onClose();
|
|
123
|
+
}, style: {
|
|
116
124
|
cursor: 'pointer',
|
|
117
125
|
display: 'inline-flex',
|
|
118
126
|
alignItems: 'center',
|
|
@@ -131,5 +139,6 @@ export const Tag = ({ children, color = 'slate', variant = 'subtle', size = 'md'
|
|
|
131
139
|
e.currentTarget.style.opacity = '0.7';
|
|
132
140
|
e.currentTarget.style.backgroundColor = 'transparent';
|
|
133
141
|
}, children: _jsx("svg", { width: "10", height: "10", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", children: _jsx("path", { d: "M18 6L6 18M6 6l12 12" }) }) }))] }));
|
|
134
|
-
};
|
|
142
|
+
});
|
|
143
|
+
Tag.displayName = 'Tag';
|
|
135
144
|
//# sourceMappingURL=Tag.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tag.js","sourceRoot":"","sources":["../../../src/components/Tag.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"Tag.js","sourceRoot":"","sources":["../../../src/components/Tag.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface TimelineItem {
|
|
3
|
+
label?: React.ReactNode;
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
dot?: React.ReactNode;
|
|
6
|
+
color?: 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'gray';
|
|
7
|
+
}
|
|
8
|
+
export interface TimelineProps {
|
|
9
|
+
items: TimelineItem[];
|
|
10
|
+
mode?: 'left' | 'alternate';
|
|
11
|
+
}
|
|
12
|
+
export declare const Timeline: any;
|
|
13
|
+
export declare const TimelineItem: React.FC<TimelineItem>;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { tokens } from '../tokens';
|
|
4
|
+
export const Timeline = React.forwardRef(({ items, mode = 'left' }, ref) => {
|
|
5
|
+
return (_jsx("div", { ref: ref, style: { display: 'flex', flexDirection: 'column' }, className: "ds-timeline", children: items.map((item, index) => (_jsxs("div", { style: {
|
|
6
|
+
display: 'flex',
|
|
7
|
+
gap: tokens.spacing[4],
|
|
8
|
+
position: 'relative',
|
|
9
|
+
paddingBottom: index === items.length - 1 ? 0 : tokens.spacing[8],
|
|
10
|
+
}, children: [item.label && (_jsx("div", { style: {
|
|
11
|
+
width: '100px',
|
|
12
|
+
textAlign: 'right',
|
|
13
|
+
fontSize: '12px',
|
|
14
|
+
color: tokens.color.slate400,
|
|
15
|
+
paddingTop: '2px',
|
|
16
|
+
}, children: item.label })), _jsxs("div", { style: { display: 'flex', flexDirection: 'column', alignItems: 'center', position: 'relative' }, children: [_jsx("div", { style: {
|
|
17
|
+
width: '12px',
|
|
18
|
+
height: '12px',
|
|
19
|
+
borderRadius: '50%',
|
|
20
|
+
border: `2px solid ${tokens.color[item.color || 'primary'] || tokens.color.primary}`,
|
|
21
|
+
backgroundColor: tokens.color.white,
|
|
22
|
+
zIndex: 1,
|
|
23
|
+
marginTop: '4px',
|
|
24
|
+
}, children: item.dot }), index < items.length - 1 && (_jsx("div", { style: {
|
|
25
|
+
position: 'absolute',
|
|
26
|
+
top: '16px',
|
|
27
|
+
bottom: '-2px',
|
|
28
|
+
width: '2px',
|
|
29
|
+
backgroundColor: tokens.color.slate100,
|
|
30
|
+
} }))] }), _jsx("div", { style: { flex: 1, paddingTop: '1px' }, children: _jsx("div", { style: { fontSize: tokens.font.sm, color: tokens.color.slate700 }, children: item.children }) })] }, index))) }));
|
|
31
|
+
});
|
|
32
|
+
Timeline.displayName = 'Timeline';
|
|
33
|
+
export const TimelineItem = ({ children }) => _jsx(_Fragment, { children: children });
|
|
34
|
+
Timeline.Item = TimelineItem;
|
|
35
|
+
//# sourceMappingURL=Timeline.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Timeline.js","sourceRoot":"","sources":["../../../src/components/Timeline.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAcnC,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,CAAC,EAAE,KAAK,EAAE,IAAI,GAAG,MAAM,EAAE,EAAE,GAAG,EAAE,EAAE;IAChC,OAAO,CACL,cAAK,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,EAAE,SAAS,EAAC,aAAa,YACxF,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC1B,eAEE,KAAK,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,GAAG,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;gBACtB,QAAQ,EAAE,UAAU;gBACpB,aAAa,EAAE,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;aAClE,aAGA,IAAI,CAAC,KAAK,IAAI,CACb,cACE,KAAK,EAAE;wBACL,KAAK,EAAE,OAAO;wBACd,SAAS,EAAE,OAAO;wBAClB,QAAQ,EAAE,MAAM;wBAChB,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ;wBAC5B,UAAU,EAAE,KAAK;qBAClB,YAEA,IAAI,CAAC,KAAK,GACP,CACP,EAGD,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,aAClG,cACE,KAAK,EAAE;gCACL,KAAK,EAAE,MAAM;gCACb,MAAM,EAAE,MAAM;gCACd,YAAY,EAAE,KAAK;gCACnB,MAAM,EAAE,aACL,MAAM,CAAC,KAAa,CAAC,IAAI,CAAC,KAAK,IAAI,SAAS,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,OACjE,EAAE;gCACF,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK;gCACnC,MAAM,EAAE,CAAC;gCACT,SAAS,EAAE,KAAK;6BACjB,YAEA,IAAI,CAAC,GAAG,GACL,EACL,KAAK,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CAC3B,cACE,KAAK,EAAE;gCACL,QAAQ,EAAE,UAAU;gCACpB,GAAG,EAAE,MAAM;gCACX,MAAM,EAAE,MAAM;gCACd,KAAK,EAAE,KAAK;gCACZ,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ;6BACvC,GACD,CACH,IACG,EAGN,cAAK,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,YACxC,cAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,YACnE,IAAI,CAAC,QAAQ,GACV,GACF,KA1DD,KAAK,CA2DN,CACP,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CACK,CAAC;AAET,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;AAElC,MAAM,CAAC,MAAM,YAAY,GAA2B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,4BAAG,QAAQ,GAAI,CAAC;AACtF,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC"}
|
|
@@ -6,4 +6,4 @@ export interface TooltipProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
|
|
|
6
6
|
maxWidth?: string;
|
|
7
7
|
arrow?: boolean;
|
|
8
8
|
}
|
|
9
|
-
export declare const Tooltip: React.
|
|
9
|
+
export declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useState, useRef, useEffect } from 'react';
|
|
2
|
+
import React, { useState, useRef, useEffect } from 'react';
|
|
3
3
|
import { tokens } from '../tokens';
|
|
4
4
|
const ARROW_STYLES = {
|
|
5
5
|
top: {
|
|
@@ -41,7 +41,7 @@ const POSITION_STYLES = {
|
|
|
41
41
|
left: { top: '50%', right: 'calc(100% + 8px)', transform: 'translateY(-50%)' },
|
|
42
42
|
right: { top: '50%', left: 'calc(100% + 8px)', transform: 'translateY(-50%)' },
|
|
43
43
|
};
|
|
44
|
-
export const Tooltip = ({ children, title, position = 'top', delay = 120, maxWidth = '240px', arrow = true, className = '', style = {}, ...props }) => {
|
|
44
|
+
export const Tooltip = React.forwardRef(({ children, title, position = 'top', delay = 120, maxWidth = '240px', arrow = true, className = '', style = {}, ...props }, ref) => {
|
|
45
45
|
const [visible, setVisible] = useState(false);
|
|
46
46
|
const timerRef = useRef(null);
|
|
47
47
|
const show = () => {
|
|
@@ -52,13 +52,15 @@ export const Tooltip = ({ children, title, position = 'top', delay = 120, maxWid
|
|
|
52
52
|
clearTimeout(timerRef.current);
|
|
53
53
|
setVisible(false);
|
|
54
54
|
};
|
|
55
|
-
useEffect(() =>
|
|
56
|
-
|
|
57
|
-
|
|
55
|
+
useEffect(() => {
|
|
56
|
+
return () => {
|
|
57
|
+
if (timerRef.current)
|
|
58
|
+
clearTimeout(timerRef.current);
|
|
59
|
+
};
|
|
58
60
|
}, []);
|
|
59
61
|
if (!title)
|
|
60
62
|
return _jsx(_Fragment, { children: children });
|
|
61
|
-
return (_jsxs("div", { style: { position: 'relative', display: 'inline-flex', ...style }, className: `ds-tooltip-wrapper ${className}`, onMouseEnter: show, onMouseLeave: hide, onFocus: show, onBlur: hide, ...props, children: [children, _jsxs("div", { role: "tooltip", style: {
|
|
63
|
+
return (_jsxs("div", { ref: ref, style: { position: 'relative', display: 'inline-flex', ...style }, className: `ds-tooltip-wrapper ${className}`, onMouseEnter: show, onMouseLeave: hide, onFocus: show, onBlur: hide, ...props, children: [children, _jsxs("div", { role: "tooltip", "aria-hidden": !visible, style: {
|
|
62
64
|
position: 'absolute',
|
|
63
65
|
...POSITION_STYLES[position],
|
|
64
66
|
backgroundColor: tokens.color.slate800,
|
|
@@ -77,9 +79,13 @@ export const Tooltip = ({ children, title, position = 'top', delay = 120, maxWid
|
|
|
77
79
|
opacity: visible ? 1 : 0,
|
|
78
80
|
visibility: visible ? 'visible' : 'hidden',
|
|
79
81
|
transform: `${POSITION_STYLES[position].transform || ''} ${!visible
|
|
80
|
-
? position === 'top'
|
|
81
|
-
|
|
82
|
-
|
|
82
|
+
? position === 'top'
|
|
83
|
+
? 'translateY(4px)'
|
|
84
|
+
: position === 'bottom'
|
|
85
|
+
? 'translateY(-4px)'
|
|
86
|
+
: position === 'left'
|
|
87
|
+
? 'translateX(4px)'
|
|
88
|
+
: 'translateX(-4px)'
|
|
83
89
|
: ''}`,
|
|
84
90
|
transition: 'opacity 0.15s ease, visibility 0.15s ease, transform 0.15s ease',
|
|
85
91
|
boxShadow: `${tokens.shadow.lg}, 0 0 0 1px rgba(0,0,0,0.05)`,
|
|
@@ -90,5 +96,6 @@ export const Tooltip = ({ children, title, position = 'top', delay = 120, maxWid
|
|
|
90
96
|
height: 0,
|
|
91
97
|
...ARROW_STYLES[position],
|
|
92
98
|
} }))] })] }));
|
|
93
|
-
};
|
|
99
|
+
});
|
|
100
|
+
Tooltip.displayName = 'Tooltip';
|
|
94
101
|
//# sourceMappingURL=Tooltip.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":";AAAA,
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip.tsx"],"names":[],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ export interface HeadingProps extends React.HTMLAttributes<HTMLHeadingElement> {
|
|
|
4
4
|
level?: 1 | 2 | 3 | 4 | 5 | 6;
|
|
5
5
|
gradient?: boolean;
|
|
6
6
|
}
|
|
7
|
-
export declare const Heading: React.
|
|
7
|
+
export declare const Heading: React.ForwardRefExoticComponent<HeadingProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
8
8
|
type TextColor = keyof typeof tokens.color | 'default' | 'muted' | 'disabled' | 'primary' | 'danger' | 'success' | 'warning' | 'info';
|
|
9
9
|
export interface TextProps extends React.HTMLAttributes<HTMLParagraphElement> {
|
|
10
10
|
size?: keyof typeof tokens.font;
|
|
@@ -13,17 +13,17 @@ export interface TextProps extends React.HTMLAttributes<HTMLParagraphElement> {
|
|
|
13
13
|
truncate?: boolean;
|
|
14
14
|
as?: 'p' | 'span' | 'div' | 'li';
|
|
15
15
|
}
|
|
16
|
-
export declare const Text: React.
|
|
16
|
+
export declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
17
17
|
export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
|
|
18
18
|
required?: boolean;
|
|
19
19
|
}
|
|
20
|
-
export declare const Label: React.
|
|
20
|
+
export declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;
|
|
21
21
|
export interface CaptionProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
22
22
|
}
|
|
23
|
-
export declare const Caption: React.
|
|
23
|
+
export declare const Caption: React.ForwardRefExoticComponent<CaptionProps & React.RefAttributes<HTMLSpanElement>>;
|
|
24
24
|
export interface SectionHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
25
25
|
title: string;
|
|
26
26
|
description?: string;
|
|
27
27
|
}
|
|
28
|
-
export declare const SectionHeader: React.
|
|
28
|
+
export declare const SectionHeader: React.ForwardRefExoticComponent<SectionHeaderProps & React.RefAttributes<HTMLDivElement>>;
|
|
29
29
|
export {};
|
|
@@ -25,7 +25,7 @@ const HEADING_LETTER_SPACING = {
|
|
|
25
25
|
5: '-0.01em',
|
|
26
26
|
6: '0',
|
|
27
27
|
};
|
|
28
|
-
export const Heading = ({ level = 2, children, className = '', style = {}, gradient = false, ...props }) => {
|
|
28
|
+
export const Heading = React.forwardRef(({ level = 2, children, className = '', style = {}, gradient = false, ...props }, ref) => {
|
|
29
29
|
const baseStyle = {
|
|
30
30
|
fontFamily: tokens.font.family,
|
|
31
31
|
fontWeight: tokens.font.weightBold,
|
|
@@ -34,17 +34,20 @@ export const Heading = ({ level = 2, children, className = '', style = {}, gradi
|
|
|
34
34
|
margin: 0,
|
|
35
35
|
lineHeight: HEADING_LINE_HEIGHTS[level] || 1.25,
|
|
36
36
|
letterSpacing: HEADING_LETTER_SPACING[level] || '-0.02em',
|
|
37
|
-
...(gradient
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
37
|
+
...(gradient
|
|
38
|
+
? {
|
|
39
|
+
background: `linear-gradient(135deg, ${tokens.color.slate800} 0%, ${tokens.color.slate600} 100%)`,
|
|
40
|
+
WebkitBackgroundClip: 'text',
|
|
41
|
+
WebkitTextFillColor: 'transparent',
|
|
42
|
+
backgroundClip: 'text',
|
|
43
|
+
}
|
|
44
|
+
: {}),
|
|
43
45
|
...style,
|
|
44
46
|
};
|
|
45
47
|
const tag = `h${level}`;
|
|
46
|
-
return React.createElement(tag, { style: baseStyle, className: `ds-heading ${className}`, ...props }, children);
|
|
47
|
-
};
|
|
48
|
+
return React.createElement(tag, { ref, style: baseStyle, className: `ds-heading ${className}`, ...props }, children);
|
|
49
|
+
});
|
|
50
|
+
Heading.displayName = 'Heading';
|
|
48
51
|
const COLOR_MAP = {
|
|
49
52
|
muted: tokens.color.textMuted,
|
|
50
53
|
disabled: tokens.color.textDisabled,
|
|
@@ -61,7 +64,7 @@ const WEIGHT_MAP = {
|
|
|
61
64
|
semibold: tokens.font.weightSemibold,
|
|
62
65
|
bold: tokens.font.weightBold,
|
|
63
66
|
};
|
|
64
|
-
export const Text = ({ size = 'base', weight = 'normal', color = 'default', truncate = false, as: Tag = 'p', children, className = '', style = {}, ...props }) => {
|
|
67
|
+
export const Text = React.forwardRef(({ size = 'base', weight = 'normal', color = 'default', truncate = false, as: Tag = 'p', children, className = '', style = {}, ...props }, ref) => {
|
|
65
68
|
const resolvedColor = COLOR_MAP[color] ||
|
|
66
69
|
tokens.color[color] ||
|
|
67
70
|
tokens.color.text;
|
|
@@ -72,16 +75,19 @@ export const Text = ({ size = 'base', weight = 'normal', color = 'default', trun
|
|
|
72
75
|
color: resolvedColor,
|
|
73
76
|
margin: 0,
|
|
74
77
|
lineHeight: 1.65,
|
|
75
|
-
...(truncate
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
78
|
+
...(truncate
|
|
79
|
+
? {
|
|
80
|
+
whiteSpace: 'nowrap',
|
|
81
|
+
overflow: 'hidden',
|
|
82
|
+
textOverflow: 'ellipsis',
|
|
83
|
+
}
|
|
84
|
+
: {}),
|
|
80
85
|
...style,
|
|
81
86
|
};
|
|
82
|
-
return React.createElement(Tag, { style: baseStyle, className: `ds-text ${className}`, ...props }, children);
|
|
83
|
-
};
|
|
84
|
-
|
|
87
|
+
return React.createElement(Tag, { ref, style: baseStyle, className: `ds-text ${className}`, ...props }, children);
|
|
88
|
+
});
|
|
89
|
+
Text.displayName = 'Text';
|
|
90
|
+
export const Label = React.forwardRef(({ children, required, className = '', style = {}, ...props }, ref) => (_jsxs("label", { ref: ref, style: {
|
|
85
91
|
display: 'inline-flex',
|
|
86
92
|
alignItems: 'center',
|
|
87
93
|
gap: '3px',
|
|
@@ -90,15 +96,23 @@ export const Label = ({ children, required, className = '', style = {}, ...props
|
|
|
90
96
|
color: tokens.color.slate600,
|
|
91
97
|
letterSpacing: '0.02em',
|
|
92
98
|
...style,
|
|
93
|
-
}, className: `ds-label ${className}`, ...props, children: [children, required &&
|
|
94
|
-
|
|
99
|
+
}, className: `ds-label ${className}`, ...props, children: [children, required && _jsx("span", { style: { color: tokens.color.danger, lineHeight: 1 }, children: "*" })] })));
|
|
100
|
+
Label.displayName = 'Label';
|
|
101
|
+
export const Caption = React.forwardRef(({ children, className = '', style = {}, ...props }, ref) => (_jsx("span", { ref: ref, style: {
|
|
95
102
|
fontSize: '11px',
|
|
96
103
|
fontWeight: tokens.font.weightMedium,
|
|
97
104
|
color: tokens.color.textMuted,
|
|
98
105
|
lineHeight: 1.5,
|
|
99
106
|
...style,
|
|
100
|
-
}, className: `ds-caption ${className}`, ...props, children: children }));
|
|
101
|
-
|
|
107
|
+
}, className: `ds-caption ${className}`, ...props, children: children })));
|
|
108
|
+
Caption.displayName = 'Caption';
|
|
109
|
+
export const SectionHeader = React.forwardRef(({ title, description, className = '', style = {}, ...props }, ref) => (_jsxs("div", { ref: ref, style: {
|
|
110
|
+
display: 'flex',
|
|
111
|
+
alignItems: 'center',
|
|
112
|
+
gap: tokens.spacing[4],
|
|
113
|
+
margin: `${tokens.spacing[6]} 0`,
|
|
114
|
+
...style,
|
|
115
|
+
}, className: `ds-section-header ${className}`, ...props, children: [_jsx("div", { style: {
|
|
102
116
|
width: '3px',
|
|
103
117
|
height: '16px',
|
|
104
118
|
background: `linear-gradient(to bottom, ${tokens.color.primary}, ${tokens.color.accent})`,
|
|
@@ -121,5 +135,6 @@ export const SectionHeader = ({ title, description, className = '', style = {},
|
|
|
121
135
|
flex: 1,
|
|
122
136
|
height: '1px',
|
|
123
137
|
background: `linear-gradient(to right, ${tokens.color.slate200}, transparent)`,
|
|
124
|
-
} })] }));
|
|
138
|
+
} })] })));
|
|
139
|
+
SectionHeader.displayName = 'SectionHeader';
|
|
125
140
|
//# sourceMappingURL=Typography.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Typography.js","sourceRoot":"","sources":["../../../src/components/Typography.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAQnC,MAAM,aAAa,GAA2B;IAC5C,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;IACrB,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE;IACjB,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE;IACjB,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE;IACjB,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,IAAI;IACnB,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE;CAClB,CAAC;AAEF,MAAM,oBAAoB,GAA2B;IACnD,CAAC,EAAE,IAAI;IACP,CAAC,EAAE,GAAG;IACN,CAAC,EAAE,IAAI;IACP,CAAC,EAAE,GAAG;IACN,CAAC,EAAE,IAAI;IACP,CAAC,EAAE,GAAG;CACP,CAAC;AAEF,MAAM,sBAAsB,GAA2B;IACrD,CAAC,EAAE,SAAS;IACZ,CAAC,EAAE,UAAU;IACb,CAAC,EAAE,SAAS;IACZ,CAAC,EAAE,UAAU;IACb,CAAC,EAAE,SAAS;IACZ,CAAC,EAAE,GAAG;CACP,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Typography.js","sourceRoot":"","sources":["../../../src/components/Typography.tsx"],"names":[],"mappings":"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"}
|
package/dist/src/index.d.ts
CHANGED
|
@@ -6,6 +6,10 @@ export { Badge } from './components/Badge';
|
|
|
6
6
|
export type { BadgeProps } from './components/Badge';
|
|
7
7
|
export { Card } from './components/Card';
|
|
8
8
|
export type { CardProps } from './components/Card';
|
|
9
|
+
export { Form, FormItem, Space } from './components/Form';
|
|
10
|
+
export type { FormProps, FormItemProps, SpaceProps } from './components/Form';
|
|
11
|
+
export { Empty } from './components/Empty';
|
|
12
|
+
export type { EmptyProps } from './components/Empty';
|
|
9
13
|
export { Input, Textarea, Checkbox, NativeSelect } from './components/InputComponents';
|
|
10
14
|
export { DatePicker } from './components/DatePicker';
|
|
11
15
|
export { MultiSelect } from './components/MultiSelect';
|
|
@@ -17,13 +21,15 @@ export { Heading, Text, SectionHeader, Label, Caption } from './components/Typog
|
|
|
17
21
|
export type { HeadingProps, TextProps, SectionHeaderProps, LabelProps, CaptionProps } from './components/Typography';
|
|
18
22
|
export { LoadingSpinner, LoadingOverlay } from './components/LoadingSpinner';
|
|
19
23
|
export type { LoadingSpinnerProps, LoadingOverlayProps } from './components/LoadingSpinner';
|
|
24
|
+
export { message, MessageProvider } from './components/Message';
|
|
25
|
+
export type { MessageProps, MessageType } from './components/Message';
|
|
20
26
|
export { ReadOnlyField } from './components/ReadOnlyField';
|
|
21
27
|
export type { ReadOnlyFieldProps } from './components/ReadOnlyField';
|
|
22
28
|
export { Modal } from './components/Modal';
|
|
23
29
|
export type { ModalProps } from './components/Modal';
|
|
24
30
|
export { Drawer } from './components/Drawer';
|
|
25
31
|
export type { DrawerProps } from './components/Drawer';
|
|
26
|
-
export { Avatar
|
|
32
|
+
export { Avatar } from './components/Avatar';
|
|
27
33
|
export type { AvatarProps, AvatarGroupProps } from './components/Avatar';
|
|
28
34
|
export { Switch } from './components/Switch';
|
|
29
35
|
export type { SwitchProps } from './components/Switch';
|
|
@@ -37,6 +43,20 @@ export { Skeleton } from './components/Skeleton';
|
|
|
37
43
|
export type { SkeletonProps } from './components/Skeleton';
|
|
38
44
|
export { Tooltip } from './components/Tooltip';
|
|
39
45
|
export type { TooltipProps } from './components/Tooltip';
|
|
46
|
+
export { Popover } from './components/Popover';
|
|
47
|
+
export type { PopoverProps } from './components/Popover';
|
|
48
|
+
export { Popconfirm } from './components/Popconfirm';
|
|
49
|
+
export type { PopconfirmProps } from './components/Popconfirm';
|
|
50
|
+
export { Dropdown } from './components/Dropdown';
|
|
51
|
+
export type { DropdownProps, MenuItemProps } from './components/Dropdown';
|
|
52
|
+
export { Timeline } from './components/Timeline';
|
|
53
|
+
export type { TimelineProps, TimelineItem } from './components/Timeline';
|
|
54
|
+
export { Descriptions } from './components/Descriptions';
|
|
55
|
+
export type { DescriptionsProps, DescriptionItem } from './components/Descriptions';
|
|
56
|
+
export { Result } from './components/Result';
|
|
57
|
+
export type { ResultProps } from './components/Result';
|
|
58
|
+
export { ConfigProvider, useConfig } from './components/ConfigProvider';
|
|
59
|
+
export type { ConfigProviderProps, ThemeMode } from './components/ConfigProvider';
|
|
40
60
|
export { Stack } from './components/Stack';
|
|
41
61
|
export type { StackProps } from './components/Stack';
|
|
42
62
|
export { Alert } from './components/Alert';
|
|
@@ -51,13 +71,14 @@ export { Statistic } from './components/Statistic';
|
|
|
51
71
|
export type { StatisticProps } from './components/Statistic';
|
|
52
72
|
export { List, ListItem } from './components/ListComponents';
|
|
53
73
|
export type { ListProps, ListItemProps } from './components/ListComponents';
|
|
54
|
-
export { Table
|
|
55
|
-
export type { TableProps, TableColumn, TableContainerProps, THeadProps, TBodyProps, TRProps, THProps, TDProps } from './components/Table';
|
|
74
|
+
export { Table } from './components/Table';
|
|
75
|
+
export type { TableProps, TableColumn, TableContainerProps, THeadProps, TBodyProps, TRProps, THProps, TDProps, } from './components/Table';
|
|
56
76
|
export { Radio, RadioGroup } from './components/Radio';
|
|
57
77
|
export type { RadioProps, RadioGroupProps } from './components/Radio';
|
|
58
78
|
export { Steps } from './components/Steps';
|
|
59
79
|
export type { StepsProps, StepItem, StepStatus } from './components/Steps';
|
|
80
|
+
export { Portal } from './components/Portal';
|
|
60
81
|
export { colors, brand, palette, semanticColors } from './colors';
|
|
61
82
|
export type { Colors } from './colors';
|
|
62
83
|
export { tokens } from './tokens';
|
|
63
|
-
export type { DesignTokens, ColorTokens, RadiusTokens, ShadowTokens, FontTokens, SpacingTokens, TransitionTokens } from './tokens';
|
|
84
|
+
export type { DesignTokens, ColorTokens, RadiusTokens, ShadowTokens, FontTokens, SpacingTokens, TransitionTokens, } from './tokens';
|