shared-design-system 1.12.0 → 1.13.0

package/dist/src/components/Alert.d.ts

@@ -2,8 +2,9 @@ import React from 'react';
 export interface AlertProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
     severity?: 'success' | 'warning' | 'error' | 'info';
     title?: string;
-    variant?: 'standard';
+    variant?: 'standard' | 'filled' | 'outlined';
     icon?: React.ReactNode;
     onClose?: () => void;
+    action?: React.ReactNode;
 }
 export declare const Alert: React.FC<AlertProps>;

package/dist/src/components/Alert.js

@@ -1,58 +1,100 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
 import { tokens } from '../tokens';
-const getIcon = (severity, icon) => {
-    if (icon)
-        return icon;
-    switch (severity) {
-        case 'success':
-            return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [_jsx("path", { d: "M22 11.08V12a10 10 0 11-5.93-9.14" }), _jsx("path", { d: "M22 4L12 14.01l-3-3" })] }));
-        case 'warning':
-            return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [_jsx("path", { d: "M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z" }), _jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }), _jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })] }));
-        case 'error':
-            return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }), _jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })] }));
-        case 'info':
-        default:
-            return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "12", y1: "16", x2: "12", y2: "12" }), _jsx("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })] }));
-    }
+const SEVERITY_CONFIG = {
+    success: {
+        bg: tokens.color.successBg,
+        border: 'rgba(16, 185, 129, 0.2)',
+        text: tokens.color.success,
+        darkText: '#065f46',
+        accentBar: tokens.color.success,
+        filledBg: tokens.color.success,
+    },
+    warning: {
+        bg: tokens.color.warningBg,
+        border: 'rgba(245, 158, 11, 0.2)',
+        text: '#d97706',
+        darkText: '#92400e',
+        accentBar: tokens.color.warning,
+        filledBg: tokens.color.warning,
+    },
+    error: {
+        bg: tokens.color.dangerBg,
+        border: 'rgba(239, 68, 68, 0.2)',
+        text: tokens.color.danger,
+        darkText: '#991b1b',
+        accentBar: tokens.color.danger,
+        filledBg: tokens.color.danger,
+    },
+    info: {
+        bg: tokens.color.infoBg,
+        border: 'rgba(59, 130, 246, 0.2)',
+        text: tokens.color.info,
+        darkText: '#1e40af',
+        accentBar: tokens.color.info,
+        filledBg: tokens.color.info,
+    },
 };
-const getSeverityStyles = (severity) => {
-    switch (severity) {
-        case 'success':
-            return { bg: tokens.color.successBg, border: 'rgba(16, 185, 129, 0.2)', text: tokens.color.success, darkText: '#065f46' };
-        case 'warning':
-            return { bg: tokens.color.warningBg, border: 'rgba(245, 158, 11, 0.2)', text: tokens.color.warning, darkText: '#92400e' };
-        case 'error':
-            return { bg: tokens.color.dangerBg, border: 'rgba(239, 68, 68, 0.2)', text: tokens.color.danger, darkText: '#991b1b' };
-        case 'info':
-        default:
-            return { bg: tokens.color.infoBg, border: 'rgba(59, 130, 246, 0.2)', text: tokens.color.info, darkText: '#1e40af' };
-    }
+const DEFAULT_ICONS = {
+    success: (_jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M22 11.08V12a10 10 0 11-5.93-9.14" }), _jsx("polyline", { points: "22 4 12 14.01 9 11.01" })] })),
+    warning: (_jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z" }), _jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }), _jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })] })),
+    error: (_jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }), _jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })] })),
+    info: (_jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "12", y1: "16", x2: "12", y2: "12" }), _jsx("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })] })),
 };
-export const Alert = ({ severity = 'info', title, children, className = '', style = {}, variant = 'standard', icon, onClose, ...props }) => {
-    const s = getSeverityStyles(severity);
+export const Alert = ({ severity = 'info', title, children, className = '', style = {}, variant = 'standard', icon, onClose, action, ...props }) => {
+    const [dismissed, setDismissed] = useState(false);
+    if (dismissed)
+        return null;
+    const s = SEVERITY_CONFIG[severity] || SEVERITY_CONFIG.info;
+    const isFilled = variant === 'filled';
+    const isOutlined = variant === 'outlined';
     const baseStyle = {
         display: 'flex',
         gap: tokens.spacing['3'],
-        padding: tokens.spacing['4'],
+        padding: `${tokens.spacing['3']} ${tokens.spacing['4']}`,
         borderRadius: tokens.radius.lg,
-        border: `1px solid ${s.border}`,
-        backgroundColor: s.bg,
-        color: s.darkText,
         fontSize: tokens.font.sm,
-        lineHeight: 1.5,
+        lineHeight: 1.55,
         position: 'relative',
+        overflow: 'hidden',
+        fontFamily: tokens.font.family,
+        ...(isFilled ? {
+            backgroundColor: s.filledBg,
+            color: '#fff',
+            border: 'none',
+            boxShadow: `0 4px 12px ${s.filledBg}40`,
+        } : isOutlined ? {
+            backgroundColor: 'transparent',
+            color: s.darkText,
+            border: `1.5px solid ${s.accentBar}`,
+        } : {
+            backgroundColor: s.bg,
+            color: s.darkText,
+            border: `1px solid ${s.border}`,
+            borderLeft: `4px solid ${s.accentBar}`,
+        }),
         ...style,
     };
-    return (_jsxs("div", { style: baseStyle, className: className, ...props, children: [_jsx("div", { style: { color: s.text, flexShrink: 0, marginTop: '2px' }, children: getIcon(severity, icon) }), _jsxs("div", { style: { flex: 1 }, children: [title && _jsx("div", { style: { fontWeight: tokens.font.weightSemibold, marginBottom: '2px' }, children: title }), _jsx("div", { style: { opacity: 0.9 }, children: children })] }), onClose && (_jsx("button", { onClick: onClose, style: {
+    const iconColor = isFilled ? '#fff' : s.text;
+    const resolvedIcon = icon || DEFAULT_ICONS[severity];
+    return (_jsxs("div", { style: baseStyle, className: `ds-alert ds-alert--${severity} ds-alert--${variant} ${className}`, ...props, children: [_jsx("div", { style: { color: iconColor, flexShrink: 0, marginTop: '2px', display: 'flex', alignItems: 'flex-start' }, children: resolvedIcon }), _jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [title && (_jsx("div", { style: {
+                            fontWeight: tokens.font.weightBold,
+                            marginBottom: children ? '3px' : 0,
+                            fontSize: tokens.font.sm,
+                            lineHeight: 1.4,
+                        }, children: title })), children && (_jsx("div", { style: { opacity: isFilled ? 0.9 : 1, fontWeight: tokens.font.weightMedium }, children: children })), action && (_jsx("div", { style: { marginTop: tokens.spacing['2'] }, children: action }))] }), onClose && (_jsx("button", { type: "button", onClick: () => { setDismissed(true); onClose(); }, style: {
                     background: 'none',
                     border: 'none',
                     cursor: 'pointer',
-                    padding: tokens.spacing['1'],
-                    color: 'inherit',
-                    opacity: 0.5,
+                    padding: '3px',
+                    color: isFilled ? 'rgba(255,255,255,0.8)' : s.darkText,
                     display: 'flex',
                     alignItems: 'center',
                     justifyContent: 'center',
-                }, children: _jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: _jsx("path", { d: "M18 6L6 18M6 6l12 12" }) }) }))] }));
+                    borderRadius: tokens.radius.sm,
+                    flexShrink: 0,
+                    opacity: 0.65,
+                    transition: tokens.transition.fast,
+                }, onMouseEnter: (e) => (e.currentTarget.style.opacity = '1'), onMouseLeave: (e) => (e.currentTarget.style.opacity = '0.65'), children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", children: _jsx("path", { d: "M18 6L6 18M6 6l12 12" }) }) }))] }));
 };
 //# sourceMappingURL=Alert.js.map

package/dist/src/components/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../../src/components/Alert.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../../src/components/Alert.tsx"],"names":[],"mappings":"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"}

package/dist/src/components/Avatar.d.ts

@@ -2,8 +2,17 @@ import React from 'react';
 export interface AvatarProps extends React.HTMLAttributes<HTMLElement> {
     src?: string;
     alt?: string;
-    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-    variant?: 'circle' | 'rounded';
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+    variant?: 'circle' | 'rounded' | 'square';
     status?: 'online' | 'offline' | 'busy' | 'away';
+    initials?: string;
+    ring?: boolean;
+    ringColor?: string;
 }
 export declare const Avatar: React.FC<AvatarProps>;
+export interface AvatarGroupProps {
+    max?: number;
+    size?: AvatarProps['size'];
+    children: React.ReactElement<AvatarProps>[];
+}
+export declare const AvatarGroup: React.FC<AvatarGroupProps>;

package/dist/src/components/Avatar.js

@@ -1,61 +1,108 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { tokens } from '../tokens';
-export const Avatar = ({ src, alt, children, size = 'md', variant = 'circle', status, className = '', style = {}, ...props }) => {
-    const getDims = () => {
-        switch (size) {
-            case 'xs': return '24px';
-            case 'sm': return '32px';
-            case 'lg': return '48px';
-            case 'xl': return '64px';
-            default: return '40px';
-        }
-    };
-    const dims = getDims();
-    const radius = variant === 'circle' ? '50%' : tokens.radius.lg;
+const SIZE_MAP = {
+    xs: '24px',
+    sm: '32px',
+    md: '40px',
+    lg: '48px',
+    xl: '64px',
+    '2xl': '80px',
+};
+const STATUS_COLOR_MAP = {
+    online: tokens.color.success,
+    busy: tokens.color.danger,
+    away: tokens.color.warning,
+    offline: tokens.color.slate300,
+};
+const GRADIENT_POOL = [
+    'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
+    'linear-gradient(135deg, #f093fb 0%, #f5576c 100%)',
+    'linear-gradient(135deg, #4facfe 0%, #00f2fe 100%)',
+    'linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)',
+    'linear-gradient(135deg, #fa709a 0%, #fee140 100%)',
+    'linear-gradient(135deg, #a18cd1 0%, #fbc2eb 100%)',
+];
+function getGradientForInitials(text) {
+    let hash = 0;
+    for (let i = 0; i < text.length; i++)
+        hash = text.charCodeAt(i) + ((hash << 5) - hash);
+    return GRADIENT_POOL[Math.abs(hash) % GRADIENT_POOL.length];
+}
+export const Avatar = ({ src, alt, children, size = 'md', variant = 'circle', status, initials, ring = false, ringColor, className = '', style = {}, ...props }) => {
+    const dims = SIZE_MAP[size] || '40px';
+    const borderRadius = variant === 'circle' ? '50%' :
+        variant === 'rounded' ? tokens.radius.lg :
+            tokens.radius.md;
+    const fallbackLabel = initials || (typeof children === 'string' ? children : undefined);
+    const gradientBg = fallbackLabel ? getGradientForInitials(fallbackLabel) : undefined;
+    const statusDotSize = size === 'xs' || size === 'sm' ? '8px' : '10px';
     const containerStyle = {
         position: 'relative',
         width: dims,
         height: dims,
-        display: 'inline-block',
-        ...style
+        display: 'inline-flex',
+        flexShrink: 0,
+        ...style,
     };
-    const baseStyle = {
+    const innerStyle = {
         width: '100%',
         height: '100%',
-        borderRadius: radius,
+        borderRadius,
         display: 'flex',
         alignItems: 'center',
         justifyContent: 'center',
-        backgroundColor: tokens.color.slate100,
-        color: tokens.color.slate600,
-        fontSize: `calc(${dims} / 2.2)`,
+        ...(src ? {} : {
+            background: gradientBg || tokens.color.slate100,
+        }),
+        color: '#fff',
+        fontSize: `calc(${dims} / 2.5)`,
         fontWeight: tokens.font.weightBold,
         overflow: 'hidden',
         userSelect: 'none',
-        border: `1.5px solid ${tokens.color.white}`,
-        boxShadow: tokens.shadow.sm,
+        boxShadow: ring
+            ? `0 0 0 2.5px ${ringColor || tokens.color.surface}, 0 0 0 4.5px ${ringColor ? ringColor + '80' : tokens.color.primary}`
+            : tokens.shadow.sm,
         objectFit: 'cover',
+        letterSpacing: '-0.02em',
     };
-    const getStatusColor = () => {
-        switch (status) {
-            case 'online': return tokens.color.success;
-            case 'busy': return tokens.color.danger;
-            case 'away': return tokens.color.warning;
-            case 'offline': return tokens.color.slate400;
-            default: return 'transparent';
-        }
+    const statusStyle = {
+        position: 'absolute',
+        bottom: variant === 'circle' ? '1px' : '-2px',
+        right: variant === 'circle' ? '1px' : '-2px',
+        width: statusDotSize,
+        height: statusDotSize,
+        borderRadius: '50%',
+        backgroundColor: STATUS_COLOR_MAP[status] || 'transparent',
+        border: `2px solid ${tokens.color.white}`,
+        boxShadow: '0 1px 3px rgba(0,0,0,0.15)',
     };
-    const statusSize = size === 'xs' ? '6px' : (size === 'sm' ? '8px' : '10px');
-    return (_jsxs("div", { style: containerStyle, className: className, children: [src ? (_jsx("img", { src: src, alt: alt || 'Avatar', style: baseStyle, ...props })) : (_jsx("div", { style: baseStyle, ...props, children: children })), status && (_jsx("div", { style: {
-                    position: 'absolute',
-                    bottom: '1px',
-                    right: '1px',
-                    width: statusSize,
-                    height: statusSize,
+    return (_jsxs("div", { style: containerStyle, className: `ds-avatar ${className}`, children: [src ? (_jsx("img", { src: src, alt: alt || 'Avatar', style: innerStyle, ...props })) : (_jsx("div", { style: innerStyle, ...props, children: fallbackLabel || children })), status && _jsx("div", { style: statusStyle })] }));
+};
+export const AvatarGroup = ({ max = 4, size = 'md', children, }) => {
+    const visible = children.slice(0, max);
+    const overflow = children.length - max;
+    const dims = SIZE_MAP[size] || '40px';
+    const offset = `calc(${dims} * -0.3)`;
+    return (_jsxs("div", { style: { display: 'flex', alignItems: 'center' }, children: [visible.map((child, i) => React.cloneElement(child, {
+                key: i,
+                size,
+                ring: true,
+                style: { marginLeft: i === 0 ? 0 : offset, ...(child.props.style || {}) },
+            })), overflow > 0 && (_jsxs("div", { style: {
+                    width: dims,
+                    height: dims,
                     borderRadius: '50%',
-                    backgroundColor: getStatusColor(),
-                    border: `2px solid ${tokens.color.white}`,
-                    boxShadow: '0 0 0 1px rgba(0,0,0,0.05)'
-                } }))] }));
+                    background: tokens.color.slate200,
+                    color: tokens.color.slate600,
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    fontSize: `calc(${dims} / 3)`,
+                    fontWeight: tokens.font.weightBold,
+                    marginLeft: offset,
+                    boxShadow: `0 0 0 2.5px ${tokens.color.surface}`,
+                    userSelect: 'none',
+                }, children: ["+", overflow] }))] }));
 };
 //# sourceMappingURL=Avatar.js.map

package/dist/src/components/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAUnC,MAAM,CAAC,MAAM,MAAM,GAA0B,CAAC,EAC5C,GAAG,EACH,GAAG,EACH,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,OAAO,GAAG,QAAQ,EAClB,MAAM,EACN,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,EACV,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,QAAO,IAAI,EAAE,CAAC;YACZ,KAAK,IAAI,CAAC,CAAC,OAAO,MAAM,CAAC;YACzB,KAAK,IAAI,CAAC,CAAC,OAAO,MAAM,CAAC;YACzB,KAAK,IAAI,CAAC,CAAC,OAAO,MAAM,CAAC;YACzB,KAAK,IAAI,CAAC,CAAC,OAAO,MAAM,CAAC;YACzB,OAAO,CAAC,CAAC,OAAO,MAAM,CAAC;QACzB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,MAAM,GAAG,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;IAE/D,MAAM,cAAc,GAAwB;QAC1C,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,IAAI;QACX,MAAM,EAAE,IAAI;QACZ,OAAO,EAAE,cAAc;QACvB,GAAG,KAAK;KACT,CAAC;IAEF,MAAM,SAAS,GAAwB;QACrC,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,YAAY,EAAE,MAAM;QACpB,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ;QACtC,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ;QAC5B,QAAQ,EAAE,QAAQ,IAAI,SAAS;QAC/B,UAAU,EAAE,MAAM,CAAC,IAAI,CAAC,UAAU;QAClC,QAAQ,EAAE,QAAQ;QAClB,UAAU,EAAE,MAAe;QAC3B,MAAM,EAAE,eAAe,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE;QAC3C,SAAS,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE;QAC3B,SAAS,EAAE,OAAgB;KAC5B,CAAC;IAEF,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,QAAO,MAAM,EAAE,CAAC;YACd,KAAK,QAAQ,CAAC,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC;YAC3C,KAAK,MAAM,CAAC,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;YACxC,KAAK,MAAM,CAAC,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC;YACzC,KAAK,SAAS,CAAC,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC;YAC7C,OAAO,CAAC,CAAC,OAAO,aAAa,CAAC;QAChC,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAE5E,OAAO,CACL,eAAK,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,aAC7C,GAAG,CAAC,CAAC,CAAC,CACL,cAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,QAAQ,EAAE,KAAK,EAAE,SAAS,KAAM,KAAY,GAAI,CAC5E,CAAC,CAAC,CAAC,CACF,cAAK,KAAK,EAAE,SAAS,KAAM,KAAY,YAAG,QAAQ,GAAO,CAC1D,EAEA,MAAM,IAAI,CACT,cAAK,KAAK,EAAE;oBACV,QAAQ,EAAE,UAAU;oBACpB,MAAM,EAAE,KAAK;oBACb,KAAK,EAAE,KAAK;oBACZ,KAAK,EAAE,UAAU;oBACjB,MAAM,EAAE,UAAU;oBAClB,YAAY,EAAE,KAAK;oBACnB,eAAe,EAAE,cAAc,EAAE;oBACjC,MAAM,EAAE,aAAa,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE;oBACzC,SAAS,EAAE,4BAA4B;iBACxC,GAAI,CACN,IACG,CACP,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar.tsx"],"names":[],"mappings":"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"}

package/dist/src/components/Badge.d.ts

@@ -1,7 +1,9 @@
 import React from 'react';
 export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
     variant?: 'success' | 'warning' | 'danger' | 'info' | 'primary' | 'slate';
-    type?: 'subtle' | 'solid';
-    size?: 'sm' | 'md';
+    type?: 'subtle' | 'solid' | 'outline';
+    size?: 'sm' | 'md' | 'lg';
+    dot?: boolean;
+    icon?: React.ReactNode;
 }
 export declare const Badge: React.FC<BadgeProps>;

package/dist/src/components/Badge.js

@@ -1,89 +1,127 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { tokens } from '../tokens';
-export const Badge = ({ children, variant = 'slate', type = 'subtle', size = 'md', className = '', style = {}, ...props }) => {
+export const Badge = ({ children, variant = 'slate', type = 'subtle', size = 'md', dot = false, icon, className = '', style = {}, ...props }) => {
     const getVariantStyles = () => {
         const isSubtle = type === 'subtle';
+        const isOutline = type === 'outline';
         switch (variant) {
             case 'primary':
                 return isSubtle ? {
                     backgroundColor: tokens.color.primaryLight,
                     color: tokens.color.primary,
-                    borderColor: 'rgba(37, 99, 235, 0.15)'
+                    borderColor: 'rgba(37, 99, 235, 0.2)',
+                } : isOutline ? {
+                    backgroundColor: 'transparent',
+                    color: tokens.color.primary,
+                    borderColor: tokens.color.primary,
                 } : {
                     backgroundColor: tokens.color.primary,
-                    color: 'white',
-                    borderColor: 'transparent'
+                    color: '#fff',
+                    borderColor: 'transparent',
                 };
             case 'success':
                 return isSubtle ? {
                     backgroundColor: tokens.color.successBg,
                     color: tokens.color.success,
-                    borderColor: 'rgba(5, 150, 105, 0.15)'
+                    borderColor: 'rgba(5, 150, 105, 0.2)',
+                } : isOutline ? {
+                    backgroundColor: 'transparent',
+                    color: tokens.color.success,
+                    borderColor: tokens.color.success,
                 } : {
                     backgroundColor: tokens.color.success,
-                    color: 'white',
-                    borderColor: 'transparent'
+                    color: '#fff',
+                    borderColor: 'transparent',
                 };
             case 'warning':
                 return isSubtle ? {
                     backgroundColor: tokens.color.warningBg,
+                    color: '#b45309',
+                    borderColor: 'rgba(245, 158, 11, 0.2)',
+                } : isOutline ? {
+                    backgroundColor: 'transparent',
                     color: tokens.color.warning,
-                    borderColor: 'rgba(245, 158, 11, 0.15)'
+                    borderColor: tokens.color.warning,
                 } : {
                     backgroundColor: tokens.color.warning,
-                    color: 'white',
-                    borderColor: 'transparent'
+                    color: '#fff',
+                    borderColor: 'transparent',
                 };
             case 'danger':
                 return isSubtle ? {
                     backgroundColor: tokens.color.dangerBg,
                     color: tokens.color.danger,
-                    borderColor: 'rgba(220, 38, 38, 0.15)'
+                    borderColor: 'rgba(220, 38, 38, 0.2)',
+                } : isOutline ? {
+                    backgroundColor: 'transparent',
+                    color: tokens.color.danger,
+                    borderColor: tokens.color.danger,
                 } : {
                     backgroundColor: tokens.color.danger,
-                    color: 'white',
-                    borderColor: 'transparent'
+                    color: '#fff',
+                    borderColor: 'transparent',
                 };
             case 'info':
                 return isSubtle ? {
                     backgroundColor: tokens.color.infoBg,
                     color: tokens.color.info,
-                    borderColor: 'rgba(59, 130, 246, 0.15)'
+                    borderColor: 'rgba(59, 130, 246, 0.2)',
+                } : isOutline ? {
+                    backgroundColor: 'transparent',
+                    color: tokens.color.info,
+                    borderColor: tokens.color.info,
                 } : {
                     backgroundColor: tokens.color.info,
-                    color: 'white',
-                    borderColor: 'transparent'
+                    color: '#fff',
+                    borderColor: 'transparent',
                 };
             case 'slate':
             default:
                 return isSubtle ? {
                     backgroundColor: tokens.color.slate100,
-                    color: tokens.color.slate700,
-                    borderColor: 'rgba(100, 116, 139, 0.1)'
+                    color: tokens.color.slate600,
+                    borderColor: tokens.color.slate200,
+                } : isOutline ? {
+                    backgroundColor: 'transparent',
+                    color: tokens.color.slate600,
+                    borderColor: tokens.color.slate400,
                 } : {
                     backgroundColor: tokens.color.slate700,
-                    color: 'white',
-                    borderColor: 'transparent'
+                    color: '#fff',
+                    borderColor: 'transparent',
                 };
         }
     };
-    const vStyles = getVariantStyles();
+    const getSizeStyles = () => {
+        switch (size) {
+            case 'sm': return { padding: '1px 7px', fontSize: '10px', gap: '4px' };
+            case 'lg': return { padding: '4px 14px', fontSize: '12px', gap: '6px' };
+            default: return { padding: '2px 10px', fontSize: '11px', gap: '5px' };
+        }
+    };
+    const dotColor = getVariantStyles().color;
     const baseStyle = {
         display: 'inline-flex',
         alignItems: 'center',
         justifyContent: 'center',
-        padding: size === 'sm' ? '1px 8px' : '3px 12px',
         borderRadius: tokens.radius.full,
-        fontSize: size === 'sm' ? '10px' : '11px',
-        fontWeight: tokens.font.weightBold,
+        fontWeight: tokens.font.weightSemibold,
         textTransform: 'uppercase',
-        letterSpacing: '0.04em',
+        letterSpacing: '0.05em',
         border: '1px solid',
         whiteSpace: 'nowrap',
+        lineHeight: 1.6,
         transition: tokens.transition.fast,
-        ...vStyles,
-        ...style
+        ...getSizeStyles(),
+        ...getVariantStyles(),
+        ...style,
     };
-    return (_jsx("span", { style: baseStyle, className: className, ...props, children: children }));
+    return (_jsxs("span", { style: baseStyle, className: `ds-badge ${className}`, ...props, children: [dot && (_jsx("span", { style: {
+                    width: '6px',
+                    height: '6px',
+                    borderRadius: '50%',
+                    backgroundColor: 'currentColor',
+                    flexShrink: 0,
+                } })), icon && _jsx("span", { style: { display: 'inline-flex', alignItems: 'center', flexShrink: 0 }, children: icon }), children] }));
 };
 //# sourceMappingURL=Badge.js.map

package/dist/src/components/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../src/components/Badge.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../src/components/Badge.tsx"],"names":[],"mappings":"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"}

package/dist/src/components/Breadcrumbs.d.ts

@@ -1,10 +1,13 @@
 import React from 'react';
 export interface BreadcrumbItem {
-    label: string;
+    label: React.ReactNode;
+    icon?: React.ReactNode;
     onClick?: () => void;
 }
 export interface BreadcrumbsProps extends React.HTMLAttributes<HTMLElement> {
     items: BreadcrumbItem[];
     separator?: React.ReactNode;
+    size?: 'sm' | 'md';
+    maxItems?: number;
 }
 export declare const Breadcrumbs: React.FC<BreadcrumbsProps>;