thread-ui 0.9.0 → 0.12.0

package/dist/components/typography/typography.js

@@ -1,145 +1,193 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { getColoredTextColor } from '../../utils';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { css, cva, cx } from '../../styled-system/css';
+import { getResolvedTypographyValues, getTextColorStyles } from '../../utils';
+/** Typography CVA — map individual token keys to style declarations. */
+const getTypographyStyles = cva({
+    variants: {
+        fontFamily: {
+            body: { fontFamily: 'body' },
+            heading: { fontFamily: 'heading' },
+            mono: { fontFamily: 'mono' },
+        },
+        fontSize: {
+            'heading.sm': { fontSize: 'heading.sm' },
+            'heading.md': { fontSize: 'heading.md' },
+            'heading.lg': { fontSize: 'heading.lg' },
+            'heading.xl': { fontSize: 'heading.xl' },
+            'body.xxs': { fontSize: 'body.xxs' },
+            'body.xs': { fontSize: 'body.xs' },
+            'body.sm': { fontSize: 'body.sm' },
+            'body.md': { fontSize: 'body.md' },
+            'body.lg': { fontSize: 'body.lg' },
+            'body.xl': { fontSize: 'body.xl' },
+        },
+        fontWeight: {
+            regular: { fontWeight: 'regular' },
+            medium: { fontWeight: 'medium' },
+            semibold: { fontWeight: 'semibold' },
+            bold: { fontWeight: 'bold' },
+        },
+        lineHeight: {
+            none: { lineHeight: 'none' },
+            tighter: { lineHeight: 'tighter' },
+            tight: { lineHeight: 'tight' },
+            normal: { lineHeight: 'normal' },
+            loose: { lineHeight: 'loose' },
+            looser: { lineHeight: 'looser' },
+        },
+        letterSpacing: {
+            tight: { letterSpacing: 'tight' },
+            normal: { letterSpacing: 'normal' },
+            wide: { letterSpacing: 'wide' },
+        },
+        marginBottom: {
+            none: { marginBottom: 'none' },
+            xxs: { marginBottom: 'xxs' },
+            xs: { marginBottom: 'xs' },
+            sm: { marginBottom: 'sm' },
+            md: { marginBottom: 'md' },
+            lg: { marginBottom: 'lg' },
+            xl: { marginBottom: 'xl' },
+            xxl: { marginBottom: 'xxl' },
+        },
+    },
+});
+/** Presentation CVA for align/truncate. Not part of the typography chord. */
+const getPresentationStyles = cva({
+    variants: {
+        align: {
+            left: { textAlign: 'left' },
+            center: { textAlign: 'center' },
+        },
+        truncate: {
+            true: {
+                overflow: 'hidden',
+                whiteSpace: 'nowrap',
+                textOverflow: 'ellipsis',
+            },
+        },
+        indent: {
+            true: {
+                textIndent: '4',
+            },
+            false: {},
+        },
+    },
+});
+/** Subtitle role mapping: subtitle under a heading uses one-step-down typography role. */
+const SUBTITLE_ROLE_MAP = {
+    title: 'h1',
+    h1: 'h2',
+    h2: 'h3',
+    h3: 'body',
+};
+/**
+ * Internal helper rendering a heading with optional subtitle.
+ * Wraps in <hgroup> when subtitle is present.
+ *
+ */
+const renderHeading = (role, HeadingTag, { children, align = 'left', inline = false, color = 'standard', truncate = false, subtitle, }) => {
+    // If no subtitle, pass marginBottom through unless inline
+    if (!subtitle) {
+        const resolved = getResolvedTypographyValues({
+            role,
+            marginBottom: inline ? 'none' : undefined,
+        });
+        const headingClass = cx(getTypographyStyles(resolved), getPresentationStyles({ align, truncate: truncate || undefined }), getTextColorStyles(color));
+        return _jsx(HeadingTag, { className: headingClass, children: children });
+    }
+    // Wrap subtitle and heading in hgroup, add margin to wrapper
+    const headingResolved = getResolvedTypographyValues({
+        role,
+        marginBottom: 'none',
+    });
+    const headingClass = cx(getTypographyStyles(headingResolved), getPresentationStyles({ align, truncate: truncate || undefined }), getTextColorStyles(color));
+    const subtitleRole = SUBTITLE_ROLE_MAP[role];
+    const subtitleResolved = getResolvedTypographyValues({
+        role: subtitleRole,
+        fontFamily: 'heading',
+        marginBottom: 'none',
+    });
+    const subtitleClass = cx(getTypographyStyles(subtitleResolved), getPresentationStyles({ align, truncate: truncate || undefined }), getTextColorStyles('text-secondary'));
+    // Derive hgroup outer margin from heading
+    const wrapperResolved = getResolvedTypographyValues({
+        role,
+        marginBottom: inline ? 'none' : undefined,
+    });
+    const wrapperClass = getTypographyStyles({
+        fontSize: wrapperResolved.fontSize,
+        marginBottom: wrapperResolved.marginBottom,
+    });
+    return (_jsxs("hgroup", { className: wrapperClass, children: [_jsx(HeadingTag, { className: headingClass, children: children }), _jsx("p", { className: subtitleClass, children: subtitle })] }));
+};
 /**
- * Display-level heading. Renders as `h1` at 3rem/700 weight.
+ * Display-level heading. Renders as `h1`
  *
  * @example
  * <Title align="center">Welcome</Title>
+ * <Title subtitle="Last updated March 2025">Welcome</Title>
  */
-export const Title = ({ children, align = 'left', inline = false, color = 'standard', truncate = false, }) => {
-    const styles = {
-        fontSize: '3rem',
-        fontWeight: 700,
-        lineHeight: 1.3,
-        marginBottom: inline ? 0 : '40px',
-        textAlign: align,
-        color: getColoredTextColor(color),
-        ...(truncate && {
-            overflow: 'hidden',
-            whiteSpace: 'nowrap',
-            textOverflow: 'ellipsis',
-        }),
-    };
-    return _jsx("h1", { style: styles, children: children });
-};
+export const Title = (props) => renderHeading('title', 'h1', props);
 /**
- * Primary heading. Renders as `h1` at 2rem/600 weight.
+ * Primary heading
  *
  * @example
  * <H1>Page Title</H1>
  */
-export const H1 = ({ children, align = 'left', color = 'standard', inline = false, truncate = false, }) => {
-    const styles = {
-        fontSize: '2rem',
-        fontWeight: 600,
-        lineHeight: 1.3,
-        marginBottom: inline ? 0 : '32px',
-        textAlign: align,
-        color: getColoredTextColor(color),
-        ...(truncate && {
-            overflow: 'hidden',
-            whiteSpace: 'nowrap',
-            textOverflow: 'ellipsis',
-        }),
-    };
-    return _jsx("h1", { style: styles, children: children });
-};
+export const H1 = (props) => renderHeading('h1', 'h1', props);
 /**
- * Secondary heading. Renders as `h2` at 1.5rem/600 weight.
+ * Secondary heading
  *
  * @example
  * <H2>Section Title</H2>
  */
-export const H2 = ({ children, align = 'left', color = 'standard', inline = false, truncate = false, }) => {
-    const styles = {
-        fontSize: '1.5rem',
-        fontWeight: 600,
-        lineHeight: 1.3,
-        marginBottom: inline ? 0 : '24px',
-        textAlign: align,
-        color: getColoredTextColor(color),
-        ...(truncate && {
-            overflow: 'hidden',
-            whiteSpace: 'nowrap',
-            textOverflow: 'ellipsis',
-        }),
-    };
-    return _jsx("h2", { style: styles, children: children });
-};
+export const H2 = (props) => renderHeading('h2', 'h2', props);
 /**
- * Tertiary heading. Renders as `h3` at 1.25rem/600 weight.
+ * Tertiary heading
  *
  * @example
  * <H3>Subsection Title</H3>
  */
-export const H3 = ({ children, align = 'left', color = 'standard', inline = false, truncate = false, }) => {
-    const styles = {
-        fontSize: '1.25rem',
-        fontWeight: 600,
-        lineHeight: 1.3,
-        marginBottom: inline ? 0 : '16px',
-        textAlign: align,
-        color: getColoredTextColor(color),
-        ...(truncate && {
-            overflow: 'hidden',
-            whiteSpace: 'nowrap',
-            textOverflow: 'ellipsis',
-        }),
-    };
-    return _jsx("h3", { style: styles, children: children });
-};
-const TEXT_SIZES = {
-    xxs: '0.625rem',
-    xs: '0.75rem',
-    sm: '0.875rem',
-    md: '1rem',
-    lg: '1.125rem',
-    xl: '1.25rem',
-    xxl: '1.375rem',
-};
+export const H3 = (props) => renderHeading('h3', 'h3', props);
 /**
  * Body text. Renders as `p` by default or `span` when `inline` is true.
  *
+ * Allows for individual attribute overrides for customization
+ *
  * @example
- * <Text size="sm" bold>Important note</Text>
+ * <Text>Default Text</Text>
+ * @example
+ * <Text size="sm" weight="semibold">Important note</Text>
  */
-export const Text = ({ children, align = 'left', inline = false, color = 'standard', bold = false, size = 'md', truncate = false, }) => {
+export const Text = ({ children, align = 'left', inline = false, color = 'standard', size = 'md', weight, lineHeight, letterSpacing, marginBottom, truncate = false, indent, }) => {
     const Component = inline ? 'span' : 'p';
-    const styles = {
-        fontSize: TEXT_SIZES[size],
-        fontWeight: bold ? 600 : 400,
-        lineHeight: 1.5,
-        marginBottom: inline ? 0 : '0.25em',
-        textAlign: align,
-        color: getColoredTextColor(color),
-        ...(truncate && {
-            overflow: 'hidden',
-            whiteSpace: 'nowrap',
-            textOverflow: 'ellipsis',
-        }),
-    };
-    return _jsx(Component, { style: styles, children: children });
+    const resolved = getResolvedTypographyValues({
+        role: 'body',
+        fontSize: `body.${size}`,
+        fontWeight: weight,
+        lineHeight,
+        letterSpacing,
+        marginBottom: inline ? 'none' : marginBottom,
+    });
+    const className = cx(getTypographyStyles(resolved), getPresentationStyles({ indent, align, truncate: truncate || undefined }), getTextColorStyles(color));
+    return _jsx(Component, { className: className, children: children });
 };
 /**
- * Secondary text rendered as an inline `span`. Fluid font size between 0.875rem and 1.5rem.
+ * Standalone secondary text rendered as an inline `span`.
+ * For subtitles attached to headings, use the `subtitle` prop on Title/H1/H2/H3 instead.
  *
  * @example
  * <Subtitle>Last updated March 2025</Subtitle>
  */
-export const Subtitle = ({ children, align = 'left', color = 'text-secondary', truncate = false, }) => {
-    const styles = {
-        display: 'block',
-        fontSize: '0.875rem',
-        marginTop: '0.2em',
-        textAlign: align,
-        color: getColoredTextColor(color),
-        ...(truncate && {
-            overflow: 'hidden',
-            whiteSpace: 'nowrap',
-            textOverflow: 'ellipsis',
-        }),
-    };
-    return _jsx("span", { style: styles, children: children });
+export const Subtitle = ({ children, align = 'left', color = 'secondary', truncate = false, fontFamily, indent, }) => {
+    const resolved = getResolvedTypographyValues({
+        role: 'body',
+        fontSize: 'body.sm',
+        marginBottom: 'none',
+        fontFamily,
+    });
+    const className = cx(getTypographyStyles(resolved), getPresentationStyles({ indent, align, truncate: truncate || undefined }), getTextColorStyles(color));
+    return (_jsx("span", { className: className, style: { display: 'block', marginTop: '0.2em' }, children: children }));
 };
 /**
  * Unordered list with configurable marker style, size, and color.
@@ -147,16 +195,22 @@ export const Subtitle = ({ children, align = 'left', color = 'text-secondary', t
  * @example
  * <List items={['Apples', 'Oranges', 'Bananas']} decoration="circle" />
  */
-export const List = ({ align = 'left', color = 'standard', size = 'md', items, decoration = 'disc', }) => {
-    const styles = {
-        fontSize: TEXT_SIZES[size],
-        lineHeight: 1.5,
-        textAlign: align,
-        color: getColoredTextColor(color),
+export const List = ({ align = 'left', color = 'standard', size = 'md', weight, lineHeight, letterSpacing, items, decoration = 'disc', }) => {
+    const resolved = getResolvedTypographyValues({
+        role: 'body',
+        fontSize: `body.${size}`,
+        fontWeight: weight,
+        lineHeight,
+        letterSpacing,
+        marginBottom: 'none',
+    });
+    const itemClass = cx(getTypographyStyles(resolved), getPresentationStyles({ align }), getTextColorStyles(color));
+    const listStyles = {
+        padding: 0,
         listStyleType: decoration === 'blank' ? 'none' : decoration,
         marginLeft: decoration !== 'none' ? '1em' : undefined,
     };
-    return (_jsx("ul", { style: { padding: 0 }, children: items.map((item, index) => (_jsx("li", { style: styles, children: item }, index))) }));
+    return (_jsx("ul", { style: listStyles, children: items.map((item, index) => (_jsx("li", { className: itemClass, children: item }, index))) }));
 };
 /**
  * Ordered list with decimal numbering.
@@ -164,15 +218,32 @@ export const List = ({ align = 'left', color = 'standard', size = 'md', items, d
  * @example
  * <OrderedList items={['First', 'Second', 'Third']} />
  */
-export const OrderedList = ({ align = 'left', color = 'standard', size = 'md', items, }) => {
-    const styles = {
-        fontSize: TEXT_SIZES[size],
-        lineHeight: 1.5,
-        textAlign: align,
-        color: getColoredTextColor(color),
-        listStyleType: 'decimal',
-        marginLeft: '1em',
-    };
-    return (_jsx("ol", { style: { padding: 0 }, children: items.map((item, index) => (_jsx("li", { style: styles, children: item }, index))) }));
+export const OrderedList = ({ align = 'left', color = 'standard', size = 'md', weight, lineHeight, letterSpacing, items, }) => {
+    const resolved = getResolvedTypographyValues({
+        role: 'body',
+        fontSize: `body.${size}`,
+        fontWeight: weight,
+        lineHeight,
+        letterSpacing,
+        marginBottom: 'none',
+    });
+    const itemClass = cx(getTypographyStyles(resolved), getPresentationStyles({ align }), getTextColorStyles(color));
+    return (_jsx("ol", { style: { padding: 0, listStyleType: 'decimal', marginLeft: '1em' }, children: items.map((item, index) => (_jsx("li", { className: itemClass, children: item }, index))) }));
+};
+export const Code = ({ children, align = 'left', color = 'standard', size = 'sm', truncate = false, }) => {
+    const resolved = getResolvedTypographyValues({
+        role: 'code',
+        fontSize: `body.${size}`,
+    });
+    const className = cx(css({
+        paddingY: '2px',
+        paddingX: '3px',
+        backgroundColor: 'structure.subtle',
+        borderRadius: 'xs',
+        borderWidth: 'sm',
+        borderColor: 'structure.default',
+        letterSpacing: 'wide',
+    }), getTypographyStyles(resolved), getPresentationStyles({ align, truncate: truncate || undefined }), getTextColorStyles(color));
+    return _jsx("code", { className: className, children: children });
 };
 //# sourceMappingURL=typography.js.map

package/dist/components/typography/typography.js.map

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

package/dist/components/typography/typography.types.d.ts

@@ -0,0 +1,23 @@
+import { ColoredTextOptions, Prettify } from '../../types';
+import { ReactNode } from 'react';
+export type BaseTypographyPresentationProps = {
+    /** Text alignment @default `'left'` */
+    align?: 'left' | 'center';
+    /** Removes bottom margin when true @default `false` */
+    inline?: boolean;
+    /** Truncates text to a single line with ellipsis @default `false` */
+    truncate?: boolean;
+};
+export type ExpandedTypographyPresentationProps = Prettify<BaseTypographyPresentationProps & {
+    /** Optionally indent text */
+    indent?: boolean;
+    /** Optionally underline text */
+    underline?: boolean;
+}>;
+/** Shared Typography Props */
+export type TypographyProps = Prettify<BaseTypographyPresentationProps & {
+    /** Content */
+    children: ReactNode;
+    /** Text color variant @default `'standard'` */
+    color?: ColoredTextOptions;
+}>;

package/dist/components/typography/typography.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=typography.types.js.map

package/dist/components/typography/typography.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.types.js","sourceRoot":"","sources":["../../../src/components/typography/typography.types.ts"],"names":[],"mappings":""}

package/dist/components/ui/card/card.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cva } from '../../../styled-system/css';
+import { cva, cx } from '../../../styled-system/css';
 import { H3 } from '../../../components/typography';
 import { Divider } from '../divider';
-import { getResolvedLayerValues } from '../../../utils';
+import { getResolvedLayerValues, getSurfaceStyles } from '../../../utils';
 const styles = {
     cardContainer: cva({
         base: {
@@ -39,26 +39,6 @@ const styles = {
                     },
                 },
             },
-            bg: {
-                none: {},
-                canvas: { backgroundColor: 'canvas' },
-                inset: { backgroundColor: 'inset' },
-                surface: { backgroundColor: 'surface' },
-                elevated: { backgroundColor: 'elevated' },
-                overlay: { backgroundColor: 'overlay' },
-            },
-            shadow: {
-                none: { boxShadow: 'none' },
-                sm: { boxShadow: 'sm' },
-                md: { boxShadow: 'md' },
-                lg: { boxShadow: 'lg' },
-            },
-            structure: {
-                none: { borderWidth: '0' },
-                subtle: { borderWidth: 'md', borderColor: 'structure.subtle' },
-                default: { borderWidth: 'md', borderColor: 'structure.default' },
-                strong: { borderWidth: 'md', borderColor: 'structure.strong' },
-            },
         },
         compoundVariants: [
             {
@@ -72,9 +52,6 @@ const styles = {
         defaultVariants: {
             size: 'md',
             fullWidth: false,
-            bg: 'surface',
-            shadow: 'none',
-            structure: 'subtle',
         },
     }),
     title: cva({
@@ -113,12 +90,6 @@ const styles = {
 export const Card = ({ layer = 'surface', bg, shadow, structure, children, size = 'md', fullWidth = false, title, }) => {
     // Resolve from level, allow individual overrides
     const layerValues = getResolvedLayerValues({ layer, bg, shadow, structure });
-    return (_jsxs("div", { className: styles.cardContainer({
-            size,
-            fullWidth,
-            bg: layerValues.bg,
-            shadow: layerValues.shadow,
-            structure: layerValues.structure,
-        }), 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 })] }));
+    return (_jsxs("div", { className: cx(styles.cardContainer({ size, fullWidth }), getSurfaceStyles(layerValues)), 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 })] }));
 };
 //# sourceMappingURL=card.js.map

package/dist/components/ui/card/card.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../../src/components/ui/card/card.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../../src/components/ui/card/card.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,qBAAqB,CAAC;AAE9C,OAAO,EAAE,EAAE,EAAE,MAAM,yBAAyB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEnE,MAAM,MAAM,GAAG;IACd,aAAa,EAAE,GAAG,CAAC;QAClB,IAAI,EAAE;YACL,WAAW,EAAE,OAAO;YACpB,OAAO,EAAE;gBACR,IAAI,EAAE,GAAG;aACT;YACD,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,oDAAoD;SAChE;QACD,QAAQ,EAAE;YACT,IAAI,EAAE;gBACL,EAAE,EAAE;oBACH,YAAY,EAAE,IAAI;oBAClB,QAAQ,EAAE,KAAK;iBACf;gBACD,EAAE,EAAE;oBACH,YAAY,EAAE,IAAI;iBAClB;gBACD,EAAE,EAAE;oBACH,YAAY,EAAE,IAAI;iBAClB;aACD;YACD,SAAS,EAAE;gBACV,IAAI,EAAE;oBACL,KAAK,EAAE,MAAM;oBACb,QAAQ,EAAE,MAAM;iBAChB;gBACD,KAAK,EAAE;oBACN,QAAQ,EAAE,KAAK;oBACf,KAAK,EAAE;wBACN,IAAI,EAAE,MAAM;wBACZ,EAAE,EAAE,KAAK;qBACT;iBACD;aACD;SACD;QACD,gBAAgB,EAAE;YACjB;gBACC,IAAI,EAAE,IAAI;gBACV,SAAS,EAAE,KAAK;gBAChB,GAAG,EAAE;oBACJ,QAAQ,EAAE,KAAK;iBACf;aACD;SACD;QACD,eAAe,EAAE;YAChB,IAAI,EAAE,IAAI;YACV,SAAS,EAAE,KAAK;SAChB;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;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EACpB,KAAK,GAAG,SAAS,EACjB,EAAE,EACF,MAAM,EACN,SAAS,EACT,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,SAAS,GAAG,KAAK,EACjB,KAAK,GACM,EAAE,EAAE;IACf,iDAAiD;IACjD,MAAM,WAAW,GAAG,sBAAsB,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC;IAE7E,OAAO,CACN,eACC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC,aAEtF,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"}

package/dist/components/ui/divider/divider.d.ts

@@ -5,4 +5,4 @@ import { DividerProps } from './divider.types';
  * @example
  * <Divider width="50%" marginY="12px" weight="light" />
  */
-export declare const Divider: ({ width, marginY, weight }: DividerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Divider: ({ width, marginY, weight, color }: DividerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/divider/divider.js

@@ -2,10 +2,24 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { css, cva, cx } from '../../../styled-system/css';
 const styles = {
     core: {
-        base: css({
-            marginX: 'auto',
-            backgroundColor: 'structure.default',
-            borderRadius: '9999px',
+        base: cva({
+            base: {
+                marginX: 'auto',
+                borderRadius: '9999px',
+            },
+            variants: {
+                color: {
+                    subtle: {
+                        backgroundColor: 'structure.subtle',
+                    },
+                    default: {
+                        backgroundColor: 'structure.default',
+                    },
+                    strong: {
+                        backgroundColor: 'structure.strong',
+                    },
+                },
+            },
         }),
         marginY: css({
             marginY: '4',
@@ -33,12 +47,12 @@ const styles = {
  * @example
  * <Divider width="50%" marginY="12px" weight="light" />
  */
-export const Divider = ({ width, marginY, weight }) => {
+export const Divider = ({ width, marginY, weight, color = 'default' }) => {
     const staticStyles = {
         ...(width && { width }),
         ...(marginY && { marginTop: marginY, marginBottom: marginY }),
     };
-    const className = cx(styles.core.base, styles.dividerWeight({ weight }), !marginY && styles.core.marginY, !width && styles.core.width);
+    const className = cx(styles.core.base({ color }), styles.dividerWeight({ weight }), !marginY && styles.core.marginY, !width && styles.core.width);
     return _jsx("div", { style: staticStyles, className: className });
 };
 //# sourceMappingURL=divider.js.map

package/dist/components/ui/divider/divider.js.map

@@ -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,MAAM,GAAG;IACd,IAAI,EAAE;QACL,IAAI,EAAE,GAAG,CAAC;YACT,OAAO,EAAE,MAAM;YACf,eAAe,EAAE,mBAAmB;YACpC,YAAY,EAAE,QAAQ;SACtB,CAAC;QACF,OAAO,EAAE,GAAG,CAAC;YACZ,OAAO,EAAE,GAAG;SACZ,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,MAAM,EAAE;gBAC5B,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"}
+{"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,IAAI,EAAE;gBACL,OAAO,EAAE,MAAM;gBACf,YAAY,EAAE,QAAQ;aACtB;YACD,QAAQ,EAAE;gBACT,KAAK,EAAE;oBACN,MAAM,EAAE;wBACP,eAAe,EAAE,kBAAkB;qBACnC;oBACD,OAAO,EAAE;wBACR,eAAe,EAAE,mBAAmB;qBACpC;oBACD,MAAM,EAAE;wBACP,eAAe,EAAE,kBAAkB;qBACnC;iBACD;aACD;SACD,CAAC;QACF,OAAO,EAAE,GAAG,CAAC;YACZ,OAAO,EAAE,GAAG;SACZ,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,MAAM,EAAE;gBAC5B,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,EAAE,KAAK,GAAG,SAAS,EAAgB,EAAE,EAAE;IACtF,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,CAAC,EAAE,KAAK,EAAE,CAAC,EAC3B,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"}

package/dist/components/ui/divider/divider.types.d.ts

@@ -1,3 +1,4 @@
+import { StructureColorOptions } from '../../../types';
 export type DividerProps = {
     /** Width override. Defaults to `75%` */
     width?: string;
@@ -5,4 +6,6 @@ export type DividerProps = {
     marginY?: string;
     /** Line thickness @default `'standard'` */
     weight?: 'light' | 'standard' | 'heavy';
+    /** Structure Color @default `'default'` */
+    color?: StructureColorOptions;
 };

package/dist/components/ui/index.d.ts

@@ -6,3 +6,4 @@ export * from './loaders';
 export * from './modal';
 export * from './toggle';
 export * from './card';
+export * from './tab-view';

package/dist/components/ui/index.js

@@ -6,4 +6,5 @@ export * from './loaders';
 export * from './modal';
 export * from './toggle';
 export * from './card';
+export * from './tab-view';
 //# sourceMappingURL=index.js.map

package/dist/components/ui/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC"}

package/dist/components/ui/tab-view/components/tab-item-content.d.ts

@@ -0,0 +1,5 @@
+type TabItemContentProps = {
+    itemId: string;
+};
+export declare const TabItemContent: ({ itemId }: TabItemContentProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};