entangle-ui 0.3.0 → 0.5.0

package/dist/esm/components/primitives/Button/Button.js

@@ -1,153 +1,9 @@
+"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
-import styled from '@emotion/styled';
-import { processCss } from '../../../utils/styledUtils.js';
+import { cx } from '../../../utils/cx.js';
+import { loadingSpinnerStyle, iconWrapperStyle, buttonRecipe } from './Button.css.js';
 
-const StyledButton = styled.button `
-  /* Reset */
-  margin: 0;
-  font-family: inherit;
-  cursor: ${props => (props.disabled ? 'not-allowed' : 'pointer')};
-  user-select: none;
-
-  /* Layout */
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  font-weight: ${props => props.theme.typography.fontWeight.medium};
-  border-radius: ${props => props.theme.borderRadius.md}px;
-  transition: all ${props => props.theme.transitions.normal};
-  outline: none;
-
-  /* Size variants */
-  ${props => {
-    const sizes = {
-        sm: {
-            height: '20px',
-            padding: `0 ${props.theme.spacing.sm}px`,
-            fontSize: `${props.theme.typography.fontSize.md}px`,
-            gap: `${props.theme.spacing.xs}px`,
-        },
-        md: {
-            height: '24px',
-            padding: `0 ${props.theme.spacing.md}px`,
-            fontSize: `${props.theme.typography.fontSize.md}px`,
-            gap: `${props.theme.spacing.sm}px`,
-        },
-        lg: {
-            height: '32px',
-            padding: `0 ${props.theme.spacing.xl}px`,
-            fontSize: `${props.theme.typography.fontSize.lg}px`,
-            gap: `${props.theme.spacing.md}px`,
-        },
-    };
-    const size = sizes[props.$size];
-    return `
-      height: ${size.height};
-      padding: ${size.padding};
-      font-size: ${size.fontSize};
-      gap: ${size.gap};
-    `;
-}}
-
-  /* Variant styles */
-  ${props => {
-    const { colors } = props.theme;
-    switch (props.$variant) {
-        case 'default':
-            return `
-          background: transparent;
-          border: 1px solid ${colors.border.default};
-          color: ${colors.text.primary};
-          
-          &:hover:not(:disabled) {
-            background: ${colors.surface.hover};
-            border-color: transparent;
-          }
-          
-          &:active:not(:disabled) {
-            background: ${colors.surface.active};
-          }
-        `;
-        case 'ghost':
-            return `
-          background: transparent;
-          border: 1px solid transparent;
-          color: ${colors.text.secondary};
-          
-          &:hover:not(:disabled) {
-            background: ${colors.surface.hover};
-            color: ${colors.text.primary};
-          }
-          
-          &:active:not(:disabled) {
-            background: ${colors.surface.active};
-          }
-        `;
-        case 'filled':
-            return `
-          background: ${colors.accent.primary};
-          border: 1px solid ${colors.accent.primary};
-          color: white;
-          
-          &:hover:not(:disabled) {
-            background: ${colors.accent.secondary};
-            border-color: ${colors.accent.secondary};
-          }
-          
-          &:active:not(:disabled) {
-            background: ${colors.accent.secondary};
-          }
-        `;
-        default:
-            return '';
-    }
-}}
-  
-  /* Full width */
-  ${props => props.$fullWidth && 'width: 100%;'}
-  
-  /* Disabled state */
-  &:disabled {
-    opacity: 0.5;
-    cursor: not-allowed;
-  }
-
-  /* Focus visible */
-  &:focus-visible {
-    box-shadow: ${props => props.theme.shadows.focus};
-  }
-
-  /* Custom CSS */
-  ${props => processCss(props.$css, props.theme)}
-`;
-/**
- * Loading spinner component
- */
-const LoadingSpinner = styled.div `
-  width: 16px;
-  height: 16px;
-  border: 2px solid currentColor;
-  border-top-color: transparent;
-  border-radius: 50%;
-  animation: spin 1s linear infinite;
-
-  @keyframes spin {
-    to {
-      transform: rotate(360deg);
-    }
-  }
-`;
-/**
- * Icon wrapper
- */
-const IconWrapper = styled.span `
-  width: 16px;
-  height: 16px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`;
 /**
  * Versatile button component for editor interfaces.
  *
@@ -174,8 +30,8 @@ const IconWrapper = styled.span `
  * </Button>
  * ```
  */
-const Button = /*#__PURE__*/ React.memo(({ children, className, size = 'md', variant = 'default', disabled = false, loading = false, icon, fullWidth = false, onClick, testId, style, css, ref, ...props }) => {
-    return (jsxs(StyledButton, { ref: ref, className: className, "$size": size, "$variant": variant, "$loading": loading, "$fullWidth": fullWidth, "$css": css, disabled: disabled || loading, onClick: onClick, "data-testid": testId, style: style, ...props, children: [loading ? (jsx(LoadingSpinner, {})) : icon ? (jsx(IconWrapper, { children: icon })) : null, children && jsx("span", { children: children })] }));
+const Button = /*#__PURE__*/ React.memo(({ children, className, size = 'md', variant = 'default', disabled = false, loading = false, icon, fullWidth = false, onClick, testId, style, ref, ...props }) => {
+    return (jsxs("button", { ref: ref, className: cx(buttonRecipe({ variant, size, fullWidth: fullWidth || undefined }), className), disabled: disabled || loading, onClick: onClick, "data-testid": testId, style: style, ...props, children: [loading ? (jsx("div", { className: loadingSpinnerStyle })) : icon ? (jsx("span", { className: iconWrapperStyle, children: icon })) : null, children && jsx("span", { children: children })] }));
 });
 Button.displayName = 'Button';
 

package/dist/esm/components/primitives/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../../../src/components/primitives/Button/Button.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../../../../../src/components/primitives/Button/Button.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;AAqGA;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;;AAiBC;AAsBF;AAGF;;"}

package/dist/esm/components/primitives/Checkbox/Checkbox.css.js

@@ -0,0 +1,14 @@
+import './../../../assets/src/components/primitives/Checkbox/Checkbox.css.ts.vanilla-dvrGPiPs.css';
+import { c as createRuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js';
+
+var boxSizeVar = 'var(--boxSizeVar__2ajd0p9)';
+var checkboxBoxRecipe = createRuntimeFn({defaultClassName:'Checkbox_checkboxBoxRecipe__2ajd0pa',variantClassNames:{active:{true:'Checkbox_checkboxBoxRecipe_active_true__2ajd0pb',false:'Checkbox_checkboxBoxRecipe_active_false__2ajd0pc'},variant:{'default':'Checkbox_checkboxBoxRecipe_variant_default__2ajd0pd',filled:'Checkbox_checkboxBoxRecipe_variant_filled__2ajd0pe'},disabled:{true:'Checkbox_checkboxBoxRecipe_disabled_true__2ajd0pf',false:'Checkbox_checkboxBoxRecipe_disabled_false__2ajd0pg'},error:{true:'Checkbox_checkboxBoxRecipe_error_true__2ajd0ph',false:'Checkbox_checkboxBoxRecipe_error_false__2ajd0pi'}},defaultVariants:{active:false,variant:'default',disabled:false,error:false},compoundVariants:[[{error:true,active:false},'Checkbox_checkboxBoxRecipe_compound_0__2ajd0pj'],[{error:true,active:true},'Checkbox_checkboxBoxRecipe_compound_1__2ajd0pk'],[{variant:'filled',active:false},'Checkbox_checkboxBoxRecipe_compound_2__2ajd0pl'],[{disabled:true,active:true},'Checkbox_checkboxBoxRecipe_compound_3__2ajd0pm'],[{disabled:true,active:false,variant:'filled'},'Checkbox_checkboxBoxRecipe_compound_4__2ajd0pn'],[{disabled:true,active:false,variant:'default'},'Checkbox_checkboxBoxRecipe_compound_5__2ajd0po']]});
+var checkboxContainerStyle = 'Checkbox_checkboxContainerStyle__2ajd0p0';
+var checkboxLabelRecipe = createRuntimeFn({defaultClassName:'Checkbox_checkboxLabelRecipe__2ajd0p1',variantClassNames:{labelPosition:{left:'Checkbox_checkboxLabelRecipe_labelPosition_left__2ajd0p2',right:'Checkbox_checkboxLabelRecipe_labelPosition_right__2ajd0p3'},size:{sm:'Checkbox_checkboxLabelRecipe_size_sm__2ajd0p4',md:'Checkbox_checkboxLabelRecipe_size_md__2ajd0p5',lg:'Checkbox_checkboxLabelRecipe_size_lg__2ajd0p6'},disabled:{true:'Checkbox_checkboxLabelRecipe_disabled_true__2ajd0p7',false:'Checkbox_checkboxLabelRecipe_disabled_false__2ajd0p8'}},defaultVariants:{labelPosition:'right',size:'md',disabled:false},compoundVariants:[]});
+var groupContainerStyle = 'Checkbox_groupContainerStyle__2ajd0pp';
+var groupDirectionVar = 'var(--groupDirectionVar__2ajd0pq)';
+var groupGapVar = 'var(--groupGapVar__2ajd0pr)';
+var groupItemsStyle = 'Checkbox_groupItemsStyle__2ajd0ps';
+
+export { boxSizeVar, checkboxBoxRecipe, checkboxContainerStyle, checkboxLabelRecipe, groupContainerStyle, groupDirectionVar, groupGapVar, groupItemsStyle };
+//# sourceMappingURL=Checkbox.css.js.map

package/dist/esm/components/primitives/Checkbox/Checkbox.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/esm/components/primitives/Checkbox/Checkbox.js

@@ -1,11 +1,13 @@
+"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useContext, useId, useState, useCallback } from 'react';
-import styled from '@emotion/styled';
-import { processCss } from '../../../utils/styledUtils.js';
+import { assignInlineVars } from '../../../node_modules/@vanilla-extract/dynamic/dist/vanilla-extract-dynamic.esm.js';
 import '../../form/FormLabel.js';
 import { FormHelperText } from '../../form/FormHelperText.js';
 import '../../form/InputWrapper.js';
 import { CheckboxGroupContext } from './CheckboxGroup.js';
+import { cx } from '../../../utils/cx.js';
+import { boxSizeVar, checkboxBoxRecipe, checkboxLabelRecipe, checkboxContainerStyle } from './Checkbox.css.js';
 
 // --- Size maps ---
 const BOX_SIZES = {
@@ -18,113 +20,6 @@ const ICON_SIZES = {
     md: 12,
     lg: 14,
 };
-const FONT_SIZE_MAP = {
-    sm: 'xs',
-    md: 'sm',
-    lg: 'md',
-};
-// --- Styled components ---
-const StyledCheckboxContainer = styled.div `
-  display: flex;
-  flex-direction: column;
-`;
-const StyledCheckboxLabel = styled.label `
-  display: inline-flex;
-  align-items: center;
-  gap: ${props => props.theme.spacing.sm}px;
-  cursor: ${props => (props.$disabled ? 'not-allowed' : 'pointer')};
-  flex-direction: ${props => props.$labelPosition === 'left' ? 'row-reverse' : 'row'};
-  font-size: ${props => props.theme.typography.fontSize[FONT_SIZE_MAP[props.$size]]}px;
-  color: ${props => props.$disabled
-    ? props.theme.colors.text.disabled
-    : props.theme.colors.text.secondary};
-  line-height: ${props => props.theme.typography.lineHeight.normal};
-  user-select: none;
-`;
-const StyledCheckboxBox = styled.button `
-  /* Reset */
-  padding: 0;
-  margin: 0;
-  border: none;
-  font: inherit;
-  outline: none;
-  cursor: ${props => (props.$disabled ? 'not-allowed' : 'pointer')};
-
-  /* Layout */
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-
-  /* Sizing */
-  width: ${props => BOX_SIZES[props.$size]}px;
-  height: ${props => BOX_SIZES[props.$size]}px;
-  border-radius: ${props => props.theme.borderRadius.sm}px;
-  transition: all ${props => props.theme.transitions.fast};
-
-  /* Variant + State styles */
-  ${props => {
-    const { colors } = props.theme;
-    const isActive = props.$checked || props.$indeterminate;
-    if (props.$disabled) {
-        return `
-        opacity: 0.5;
-        background: ${isActive ? colors.accent.primary : props.$variant === 'filled' ? colors.surface.default : 'transparent'};
-        border: 1px solid ${isActive ? colors.accent.primary : colors.border.default};
-      `;
-    }
-    if (props.$error) {
-        return `
-        background: ${isActive ? colors.accent.error : 'transparent'};
-        border: 1px solid ${colors.accent.error};
-        &:hover {
-          border-color: ${colors.accent.error};
-          background: ${isActive ? colors.accent.error : 'transparent'};
-        }
-      `;
-    }
-    if (isActive) {
-        return `
-        background: ${colors.accent.primary};
-        border: 1px solid ${colors.accent.primary};
-        &:hover {
-          background: ${colors.accent.secondary};
-          border-color: ${colors.accent.secondary};
-        }
-      `;
-    }
-    if (props.$variant === 'filled') {
-        return `
-        background: ${colors.surface.default};
-        border: 1px solid ${colors.border.default};
-        &:hover {
-          border-color: ${colors.border.focus};
-        }
-      `;
-    }
-    return `
-      background: transparent;
-      border: 1px solid ${colors.border.default};
-      &:hover {
-        border-color: ${colors.border.focus};
-      }
-    `;
-}}
-
-  /* Focus visible */
-  &:focus-visible {
-    box-shadow: ${props => props.theme.shadows.focus};
-  }
-
-  /* Disabled state */
-  &:disabled {
-    opacity: 0.5;
-    cursor: not-allowed;
-  }
-
-  /* Custom CSS */
-  ${props => processCss(props.$css, props.theme)}
-`;
 /**
  * Checkbox component for boolean selection in settings panels,
  * property inspectors, and form interfaces.
@@ -139,7 +34,7 @@ const StyledCheckboxBox = styled.button `
  * <Checkbox indeterminate label="Select all" />
  * ```
  */
-const Checkbox = ({ checked: checkedProp, defaultChecked = false, indeterminate = false, label, labelPosition = 'right', size: sizeProp = 'md', variant = 'default', disabled: disabledProp = false, required = false, error = false, helperText, errorMessage, value, name, onChange, className, style, css, testId, ref, id: idProp, ...rest }) => {
+const Checkbox = ({ checked: checkedProp, defaultChecked = false, indeterminate = false, label, labelPosition = 'right', size: sizeProp = 'md', variant = 'default', disabled: disabledProp = false, required = false, error = false, helperText, errorMessage, value, name, onChange, className, style, testId, ref, id: idProp, ...rest }) => {
     const groupContext = useContext(CheckboxGroupContext);
     const autoId = useId();
     const checkboxId = idProp ?? autoId;
@@ -189,7 +84,16 @@ const Checkbox = ({ checked: checkedProp, defaultChecked = false, indeterminate
         : resolvedChecked
             ? 'true'
             : 'false';
-    const checkboxBox = (jsxs(StyledCheckboxBox, { ref: ref, type: "button", role: "checkbox", "aria-checked": ariaChecked, "aria-disabled": disabled || undefined, "aria-required": required || undefined, "aria-invalid": error || undefined, "aria-describedby": showHelperText ? helperId : undefined, disabled: disabled, onClick: handleClick, "$size": size, "$variant": variant, "$checked": resolvedChecked, "$indeterminate": indeterminate, "$disabled": disabled, "$error": error, "$css": css, "data-testid": testId, ...rest, children: [indeterminate ? (jsx("svg", { width: iconSize, height: iconSize, viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: jsx("line", { x1: "2", y1: "6", x2: "10", y2: "6", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }) })) : (jsx("svg", { width: iconSize, height: iconSize, viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", style: {
+    const isActive = resolvedChecked || indeterminate;
+    const boxInlineVars = assignInlineVars({
+        [boxSizeVar]: `${BOX_SIZES[size]}px`,
+    });
+    const checkboxBox = (jsxs("button", { ref: ref, type: "button", role: "checkbox", "aria-checked": ariaChecked, "aria-disabled": disabled || undefined, "aria-required": required || undefined, "aria-invalid": error || undefined, "aria-describedby": showHelperText ? helperId : undefined, disabled: disabled, onClick: handleClick, className: checkboxBoxRecipe({
+            active: isActive || undefined,
+            variant,
+            disabled: disabled || undefined,
+            error: error || undefined,
+        }), style: boxInlineVars, "data-testid": testId, ...rest, children: [indeterminate ? (jsx("svg", { width: iconSize, height: iconSize, viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: jsx("line", { x1: "2", y1: "6", x2: "10", y2: "6", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }) })) : (jsx("svg", { width: iconSize, height: iconSize, viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", style: {
                     opacity: resolvedChecked ? 1 : 0,
                     transform: resolvedChecked ? 'scale(1)' : 'scale(0)',
                     transition: 'opacity 150ms ease-out, transform 150ms ease-out',
@@ -197,7 +101,11 @@ const Checkbox = ({ checked: checkedProp, defaultChecked = false, indeterminate
     if (!label && !showHelperText) {
         return checkboxBox;
     }
-    return (jsxs(StyledCheckboxContainer, { className: className, style: style, children: [jsxs(StyledCheckboxLabel, { "$labelPosition": labelPosition, "$disabled": disabled, "$size": size, children: [checkboxBox, label && jsx("span", { children: label })] }), showHelperText && (jsx(FormHelperText, { id: helperId, error: error, children: showHelperText }))] }));
+    return (jsxs("div", { className: cx(checkboxContainerStyle, className), style: style, children: [jsxs("label", { className: checkboxLabelRecipe({
+                    labelPosition,
+                    disabled: disabled || undefined,
+                    size,
+                }), children: [checkboxBox, label && jsx("span", { children: label })] }), showHelperText && (jsx(FormHelperText, { id: helperId, error: error, children: showHelperText }))] }));
 };
 Checkbox.displayName = 'Checkbox';
 

package/dist/esm/components/primitives/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../../../../../src/components/primitives/Checkbox/Checkbox.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"Checkbox.js","sources":["../../../../../../src/components/primitives/Checkbox/Checkbox.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;AAeA;AAEA;AACE;AACA;AACA;;AAGF;AACE;AACA;AACA;;AAGF;;;;;;;;;;;;;AAaG;AACI;AAuBL;AACA;AACA;AACA;;;;;;;;AAWA;AAEA;;;;;;;;;;AASA;AACE;;AAEA;AAEA;AACE;;AAGF;;;AAIA;AACF;;;;;;;;AAQC;AAED;AACA;;AAGE;AACA;AACE;;AAGJ;;;AAIC;;;;;;AAmBI;;;AAiCK;;AAsBV;AACE;;AAGF;;;;AAOO;AAYT;AAEA;;"}

package/dist/esm/components/primitives/Checkbox/CheckboxGroup.js

@@ -1,25 +1,15 @@
+"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { createContext, useId, useState, useCallback } from 'react';
-import styled from '@emotion/styled';
+import { useId, useState, useCallback, createContext } from 'react';
+import { assignInlineVars } from '../../../node_modules/@vanilla-extract/dynamic/dist/vanilla-extract-dynamic.esm.js';
 import { FormLabel } from '../../form/FormLabel.js';
 import { FormHelperText } from '../../form/FormHelperText.js';
 import '../../form/InputWrapper.js';
-import { processCss } from '../../../utils/styledUtils.js';
+import { cx } from '../../../utils/cx.js';
+import { groupItemsStyle, groupGapVar, groupDirectionVar, groupContainerStyle } from './Checkbox.css.js';
 
 const CheckboxGroupContext = 
 /*#__PURE__*/ createContext(null);
-const StyledGroupContainer = styled.div `
-  display: flex;
-  flex-direction: column;
-
-  /* Custom CSS */
-  ${props => processCss(props.$css, props.theme)}
-`;
-const StyledGroupItems = styled.div `
-  display: flex;
-  flex-direction: ${props => props.$direction};
-  gap: ${props => props.theme.spacing.md * props.$gap}px;
-`;
 /**
  * Groups multiple Checkbox components with shared state management.
  *
@@ -39,7 +29,7 @@ const StyledGroupItems = styled.div `
  * </CheckboxGroup>
  * ```
  */
-const CheckboxGroup = ({ value: valueProp, defaultValue = [], label, direction = 'column', gap = 2, disabled = false, size = 'md', helperText, error = false, errorMessage, required = false, children, onChange, className, style, css, testId, ref, id: idProp, ...rest }) => {
+const CheckboxGroup = ({ value: valueProp, defaultValue = [], label, direction = 'column', gap = 2, disabled = false, size = 'md', helperText, error = false, errorMessage, required = false, children, onChange, className, style, testId, ref, id: idProp, ...rest }) => {
     const autoId = useId();
     const groupId = idProp ?? autoId;
     const labelId = `${groupId}-label`;
@@ -63,7 +53,10 @@ const CheckboxGroup = ({ value: valueProp, defaultValue = [], label, direction =
         size,
     };
     const showHelperText = error && errorMessage ? errorMessage : helperText;
-    return (jsxs(StyledGroupContainer, { ref: ref, role: "group", "aria-labelledby": label ? labelId : undefined, "aria-describedby": showHelperText ? helperId : undefined, className: className, style: style, "$css": css, "data-testid": testId, ...rest, children: [label && (jsx(FormLabel, { id: labelId, required: required, disabled: disabled, children: label })), jsx(CheckboxGroupContext.Provider, { value: contextValue, children: jsx(StyledGroupItems, { "$direction": direction, "$gap": gap, children: children }) }), showHelperText && (jsx(FormHelperText, { id: helperId, error: error, children: showHelperText }))] }));
+    return (jsxs("div", { ref: ref, role: "group", "aria-labelledby": label ? labelId : undefined, "aria-describedby": showHelperText ? helperId : undefined, className: cx(groupContainerStyle, className), style: style, "data-testid": testId, ...rest, children: [label && (jsx(FormLabel, { id: labelId, required: required, disabled: disabled, children: label })), jsx(CheckboxGroupContext.Provider, { value: contextValue, children: jsx("div", { className: groupItemsStyle, style: assignInlineVars({
+                        [groupDirectionVar]: direction,
+                        [groupGapVar]: `${8 * gap}px`,
+                    }), children: children }) }), showHelperText && (jsx(FormHelperText, { id: helperId, error: error, children: showHelperText }))] }));
 };
 CheckboxGroup.displayName = 'CheckboxGroup';
 

package/dist/esm/components/primitives/Checkbox/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.js","sources":["../../../../../../src/components/primitives/Checkbox/CheckboxGroup.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"CheckboxGroup.js","sources":["../../../../../../src/components/primitives/Checkbox/CheckboxGroup.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;AAmBE;AAEF;;;;;;;;;;;;;;;;;;AAkBG;AACI;AAqBL;AACA;AACA;AACA;;AAGA;;AAGA;AAEI;AACE;AACA;;;;AAKF;;AAKJ;AACE;;;;;AAMF;AAEA;;AAqBU;;AAaZ;AAEA;;"}

package/dist/esm/components/primitives/Collapsible/Collapsible.css.js

@@ -0,0 +1,18 @@
+import './../../../assets/src/components/primitives/Collapsible/Collapsible.css.ts.vanilla-C1rYV-JT.css';
+import { c as createRuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js';
+
+var chevronRecipe = createRuntimeFn({defaultClassName:'Collapsible_chevronRecipe__14aon2g8',variantClassNames:{open:{true:'Collapsible_chevronRecipe_open_true__14aon2g9',false:'Collapsible_chevronRecipe_open_false__14aon2ga'}},defaultVariants:{open:false},compoundVariants:[]});
+var chevronSizeVar = 'var(--chevronSizeVar__14aon2g7)';
+var collapsibleRootStyle = 'Collapsible_collapsibleRootStyle__14aon2g0';
+var contentBodyStyle = 'Collapsible_contentBodyStyle__14aon2gh';
+var contentInnerStyle = 'Collapsible_contentInnerStyle__14aon2ge';
+var contentPaddingHVar = 'var(--contentPaddingHVar__14aon2gg)';
+var contentPaddingVVar = 'var(--contentPaddingVVar__14aon2gf)';
+var contentWrapperRecipe = createRuntimeFn({defaultClassName:'Collapsible_contentWrapperRecipe__14aon2gb',variantClassNames:{open:{true:'Collapsible_contentWrapperRecipe_open_true__14aon2gc',false:'Collapsible_contentWrapperRecipe_open_false__14aon2gd'}},defaultVariants:{open:false},compoundVariants:[]});
+var triggerFontSizeVar = 'var(--triggerFontSizeVar__14aon2g3)';
+var triggerHeightVar = 'var(--triggerHeightVar__14aon2g1)';
+var triggerPaddingVar = 'var(--triggerPaddingVar__14aon2g2)';
+var triggerRecipe = createRuntimeFn({defaultClassName:'Collapsible_triggerRecipe__14aon2g4',variantClassNames:{disabled:{true:'Collapsible_triggerRecipe_disabled_true__14aon2g5',false:'Collapsible_triggerRecipe_disabled_false__14aon2g6'}},defaultVariants:{disabled:false},compoundVariants:[]});
+
+export { chevronRecipe, chevronSizeVar, collapsibleRootStyle, contentBodyStyle, contentInnerStyle, contentPaddingHVar, contentPaddingVVar, contentWrapperRecipe, triggerFontSizeVar, triggerHeightVar, triggerPaddingVar, triggerRecipe };
+//# sourceMappingURL=Collapsible.css.js.map

package/dist/esm/components/primitives/Collapsible/Collapsible.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapsible.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/primitives/Collapsible/Collapsible.js

@@ -1,94 +1,38 @@
+"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useId, useState, useCallback } from 'react';
-import styled from '@emotion/styled';
+import { assignInlineVars } from '../../../node_modules/@vanilla-extract/dynamic/dist/vanilla-extract-dynamic.esm.js';
+import { cx } from '../../../utils/cx.js';
+import { triggerFontSizeVar, triggerPaddingVar, triggerHeightVar, contentPaddingHVar, contentPaddingVVar, chevronSizeVar, chevronRecipe, triggerRecipe, contentInnerStyle, contentBodyStyle, contentWrapperRecipe, collapsibleRootStyle } from './Collapsible.css.js';
+import { vars } from '../../../theme/contract.css.js';
 
 const TRIGGER_SIZE_MAP = {
-    sm: { height: 24, paddingKey: 'md', fontKey: 'xs', chevronSize: 10 },
-    md: { height: 28, paddingKey: 'md', fontKey: 'sm', chevronSize: 12 },
-    lg: { height: 32, paddingKey: 'lg', fontKey: 'md', chevronSize: 14 },
+    sm: {
+        height: '24px',
+        padding: vars.spacing.md,
+        fontSize: vars.typography.fontSize.xs,
+        chevronSize: 10,
+    },
+    md: {
+        height: '28px',
+        padding: vars.spacing.md,
+        fontSize: vars.typography.fontSize.sm,
+        chevronSize: 12,
+    },
+    lg: {
+        height: '32px',
+        padding: vars.spacing.lg,
+        fontSize: vars.typography.fontSize.md,
+        chevronSize: 14,
+    },
 };
 const CONTENT_SIZE_MAP = {
-    sm: { paddingVKey: 'sm', paddingHKey: 'md' },
-    md: { paddingVKey: 'md', paddingHKey: 'lg' },
-    lg: { paddingVKey: 'lg', paddingHKey: 'xl' },
+    sm: { paddingV: vars.spacing.sm, paddingH: vars.spacing.md },
+    md: { paddingV: vars.spacing.md, paddingH: vars.spacing.lg },
+    lg: { paddingV: vars.spacing.lg, paddingH: vars.spacing.xl },
 };
 // --- Chevron icon ---
 const ChevronRightIcon = ({ size }) => (jsx("svg", { width: size, height: size, viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: jsx("path", { d: "M4.5 3L7.5 6L4.5 9", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
-// --- Styled ---
-const StyledRoot = styled.div `
-  display: flex;
-  flex-direction: column;
-`;
-const StyledTrigger = styled.button `
-  /* Reset */
-  margin: 0;
-  border: none;
-  font-family: inherit;
-  outline: none;
-  user-select: none;
-  width: 100%;
-  text-align: left;
-
-  /* Layout */
-  display: flex;
-  align-items: center;
-  gap: ${props => props.theme.spacing.sm}px;
-
-  /* Sizing */
-  height: ${props => TRIGGER_SIZE_MAP[props.$size].height}px;
-  padding: 0
-    ${props => props.theme.spacing[TRIGGER_SIZE_MAP[props.$size].paddingKey]}px;
-  font-size: ${props => props.theme.typography.fontSize[TRIGGER_SIZE_MAP[props.$size].fontKey]}px;
-  font-weight: ${props => props.theme.typography.fontWeight.medium};
-
-  /* Colors */
-  background: transparent;
-  color: ${props => props.theme.colors.text.muted};
-  cursor: ${props => (props.$disabled ? 'not-allowed' : 'pointer')};
-  opacity: ${props => (props.$disabled ? 0.5 : 1)};
-  transition:
-    color ${props => props.theme.transitions.fast},
-    background ${props => props.theme.transitions.fast};
-
-  &:hover {
-    color: ${props => props.$disabled
-    ? props.theme.colors.text.muted
-    : props.theme.colors.text.primary};
-  }
-
-  &:focus-visible {
-    box-shadow: ${props => props.theme.shadows.focus};
-    border-radius: ${props => props.theme.borderRadius.sm}px;
-    z-index: 1;
-  }
-`;
-const StyledChevron = styled.span `
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  transition: transform ${props => props.theme.transitions.fast};
-  transform: rotate(${props => (props.$open ? '90deg' : '0deg')});
-  color: currentColor;
-
-  svg {
-    width: ${props => props.$size}px;
-    height: ${props => props.$size}px;
-  }
-`;
-const StyledContentWrapper = styled.div `
-  display: grid;
-  grid-template-rows: ${props => (props.$open ? '1fr' : '0fr')};
-  transition: grid-template-rows ${props => props.theme.transitions.normal};
-`;
-const StyledContentInner = styled.div `
-  overflow: hidden;
-  min-height: 0;
-`;
-const StyledContentBody = styled.div `
-  padding: ${props => props.theme.spacing[CONTENT_SIZE_MAP[props.$size].paddingVKey]}px
-    ${props => props.theme.spacing[CONTENT_SIZE_MAP[props.$size].paddingHKey]}px;
-`;
 // --- Component ---
 const Collapsible = ({ trigger, open: openProp, defaultOpen = false, size = 'sm', indicator, disabled = false, keepMounted = false, onChange, children, className, style, testId, ref, ...rest }) => {
     const autoId = useId();
@@ -108,7 +52,25 @@ const Collapsible = ({ trigger, open: openProp, defaultOpen = false, size = 'sm'
     }, [disabled, resolvedOpen, isControlled, onChange]);
     const showIndicator = indicator !== null;
     const sizeConfig = TRIGGER_SIZE_MAP[size];
-    return (jsxs(StyledRoot, { ref: ref, className: className, style: style, "data-testid": testId, ...rest, children: [jsxs(StyledTrigger, { type: "button", id: triggerId, "aria-expanded": resolvedOpen, "aria-controls": contentId, "aria-disabled": disabled || undefined, disabled: disabled, onClick: handleToggle, "$size": size, "$disabled": disabled, children: [showIndicator && (jsx(StyledChevron, { "$open": resolvedOpen, "$size": sizeConfig.chevronSize, children: indicator ?? jsx(ChevronRightIcon, { size: sizeConfig.chevronSize }) })), jsx("span", { children: trigger })] }), (resolvedOpen || keepMounted) && (jsx(StyledContentWrapper, { "$open": resolvedOpen, role: "region", id: contentId, "aria-labelledby": triggerId, hidden: !resolvedOpen || undefined, children: jsx(StyledContentInner, { children: jsx(StyledContentBody, { "$size": size, children: children }) }) }))] }));
+    const contentConfig = CONTENT_SIZE_MAP[size];
+    const triggerInlineVars = assignInlineVars({
+        [triggerHeightVar]: sizeConfig.height,
+        [triggerPaddingVar]: sizeConfig.padding,
+        [triggerFontSizeVar]: sizeConfig.fontSize,
+    });
+    const contentInlineVars = assignInlineVars({
+        [contentPaddingVVar]: contentConfig.paddingV,
+        [contentPaddingHVar]: contentConfig.paddingH,
+    });
+    return (jsxs("div", { ref: ref, className: cx(collapsibleRootStyle, className), style: style, "data-testid": testId, ...rest, children: [jsxs("button", { type: "button", id: triggerId, "aria-expanded": resolvedOpen, "aria-controls": contentId, "aria-disabled": disabled || undefined, disabled: disabled, onClick: handleToggle, className: triggerRecipe({
+                    disabled: disabled || undefined,
+                }), style: triggerInlineVars, children: [showIndicator && (jsx("span", { className: chevronRecipe({
+                            open: resolvedOpen || undefined,
+                        }), style: assignInlineVars({
+                            [chevronSizeVar]: `${sizeConfig.chevronSize}px`,
+                        }), children: indicator ?? jsx(ChevronRightIcon, { size: sizeConfig.chevronSize }) })), jsx("span", { children: trigger })] }), (resolvedOpen || keepMounted) && (jsx("div", { className: contentWrapperRecipe({
+                    open: resolvedOpen || undefined,
+                }), role: "region", id: contentId, "aria-labelledby": triggerId, hidden: !resolvedOpen || undefined, children: jsx("div", { className: contentInnerStyle, children: jsx("div", { className: contentBodyStyle, style: contentInlineVars, children: children }) }) }))] }));
 };
 Collapsible.displayName = 'Collapsible';
 

package/dist/esm/components/primitives/Collapsible/Collapsible.js.map

@@ -1 +1 @@
-{"version":3,"file":"Collapsible.js","sources":["../../../../../../src/components/primitives/Collapsible/Collapsible.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"Collapsible.js","sources":["../../../../../../src/components/primitives/Collapsible/Collapsible.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;AA+BA;AACE;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACD;;AAQH;AACE;AACA;AACA;;AAGF;AAEA;AAkBA;;AAkBE;AACA;AACA;;AAGA;;AAGA;AACE;;AAEA;;;;AAMA;;AAGF;AACA;AACA;;AAGE;AACA;AACA;AACD;;AAGC;AACA;AACD;;;AAoBM;;AAOI;AAEC;AACD;;AAYF;AAeX;AAEA;;"}