@mindlogic-ai/logician-ui 3.0.0-alpha.34 → 3.0.0-alpha.35

package/dist/components/Select/Select.styles.js

@@ -2,79 +2,77 @@
 'use strict';
 
 /**
- * Select component styles (Chakra v3 compatible)
+ * Shared style objects for the Select and Combobox components.
  *
- * Defaults mirror the Input component (Chakra v3 `Input` recipe + Logician
- * Input.tsx overrides) so the two controls share the same border, hover,
- * focus, font, and disabled/readOnly behavior. When the Input component
- * changes, update these values to match.
- *
- * Reference (kept in sync with Input.tsx):
- *   borderColor: gray.400
- *   _hover     : primary.lighter
- *   _focus     : primary.main
- *   _invalid   : danger.main
- *   borderRadius: 6 (Chakra `l2` -> Logician `radii.sm`)
- *   minHeight  : 40 (Chakra md, `sizes.10`)
- *   fontSize   : 1em (Chakra textStyle `sm`, inherits responsively)
- *   fontWeight : 500 (Chakra textStyle `sm` -> `subtitleAndP.medium`)
- *   paddingX   : 12px (Chakra md, `px: 3`)
+ * These mirror the Input component (`Input.tsx`) so the form controls share
+ * the same border, hover, focus and disabled behavior. They are applied on
+ * top of Chakra's built-in `select` / `combobox` slot recipes via the `css`
+ * prop — only the design-system deltas live here. When `Input.tsx` changes,
+ * update these values to match.
  */
-const getPlaceholderStyles = (colors) => ({
-    color: colors.gray500,
-    fontSize: '1em',
-    fontWeight: 500,
-});
-const getMenuStyles = (colors) => ({
-    width: 'max-content',
-    minWidth: '100%',
-    backgroundColor: 'white',
-    borderRadius: 8,
-    border: `1px solid ${colors.gray300}`,
-    marginTop: 12,
+const focusVars = {
+    '--focus-color': 'var(--chakra-colors-primary-main)',
+    '--error-color': 'var(--chakra-colors-danger-main)',
+};
+const fieldBase = {
+    ...focusVars,
+    bg: 'white',
+    borderColor: 'gray.400',
+    _hover: { borderColor: 'primary.lighter' },
+    _focus: { borderColor: 'primary.main' },
+    _invalid: {
+        borderColor: 'danger.main',
+        _hover: { borderColor: 'danger.main' },
+        _focus: { borderColor: 'danger.main' },
+    },
+    _disabled: {
+        opacity: 1,
+        cursor: 'not-allowed',
+        bg: 'gray.50',
+        color: 'gray.1000',
+        fontWeight: 'semibold',
+    },
+};
+/** Select trigger — the clickable control. */
+const triggerStyles = {
+    ...fieldBase,
+    cursor: 'pointer',
+    _open: { borderColor: 'primary.main' },
+};
+/** Combobox text input — the typeable control. */
+const inputStyles = {
+    ...fieldBase,
+};
+/** Dropdown panel for both Select and Combobox. */
+const contentStyles = {
+    bg: 'white',
+    borderColor: 'gray.300',
+    borderWidth: '1px',
+    borderRadius: '8px',
     boxShadow: '0px 5px 20px 0px rgba(0, 0, 0, 0.10)',
-    zIndex: 9,
-});
-const getOptionStyles = ({ isSelected, isDisabled, colors, }) => ({
-    cursor: isDisabled ? 'not-allowed' : 'pointer',
-    minHeight: 36,
-    margin: '4px 0',
-    borderRadius: 4,
-    fontSize: 14,
-    backgroundColor: isSelected ? colors.primaryLightest : 'white',
-    color: isSelected
-        ? colors.primaryDark
-        : isDisabled
-            ? colors.gray500
-            : colors.gray1200,
-    fontWeight: isSelected ? 700 : 400,
-    '&:hover': {
-        backgroundColor: isSelected ? colors.primaryLightest : colors.gray50,
+    padding: '4px',
+};
+/** Individual option for both Select and Combobox. */
+const itemStyles = {
+    borderRadius: '4px',
+    cursor: 'pointer',
+    color: 'gray.1200',
+    _highlighted: { bg: 'gray.50' },
+    _checked: {
+        bg: 'primary.extralight',
+        color: 'primary.dark',
+        fontWeight: 'bold',
     },
-});
-const getControlStyles = (variant, colors) => {
-    const baseStyles = {
-        borderRadius: 6,
-        cursor: 'pointer',
-        minHeight: 40,
-        fontSize: '1em',
-        fontWeight: 500,
-        paddingLeft: 12,
-        paddingRight: 8,
-        backgroundColor: 'white',
-    };
-    if (variant === 'danger') {
-        return {
-            ...baseStyles,
-            border: `1px solid ${colors.dangerColor}`,
-            boxShadow: `0 0 0 1px ${colors.dangerColor}`,
-        };
-    }
-    return baseStyles;
+    _disabled: { color: 'gray.500', cursor: 'not-allowed' },
+};
+/** Dropdown chevron — softened so it doesn't outweigh adjacent icons. */
+const indicatorStyles = {
+    color: 'gray.600',
 };
 
-exports.getControlStyles = getControlStyles;
-exports.getMenuStyles = getMenuStyles;
-exports.getOptionStyles = getOptionStyles;
-exports.getPlaceholderStyles = getPlaceholderStyles;
+exports.contentStyles = contentStyles;
+exports.indicatorStyles = indicatorStyles;
+exports.inputStyles = inputStyles;
+exports.itemStyles = itemStyles;
+exports.triggerStyles = triggerStyles;
 //# sourceMappingURL=Select.styles.js.map

package/dist/components/Select/Select.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.styles.js","sources":["../../../src/components/Select/Select.styles.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;AAkBG;MAIU,oBAAoB,GAAG,CAAC,MAAoB,MAAM;IAC7D,KAAK,EAAE,MAAM,CAAC,OAAO;AACrB,IAAA,QAAQ,EAAE,KAAK;AACf,IAAA,UAAU,EAAE,GAAG;AAChB,CAAA;MAEY,aAAa,GAAG,CAAC,MAAoB,MAAM;AACtD,IAAA,KAAK,EAAE,aAAa;AACpB,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,eAAe,EAAE,OAAO;AACxB,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,MAAM,EAAE,CAAA,UAAA,EAAa,MAAM,CAAC,OAAO,CAAA,CAAE;AACrC,IAAA,SAAS,EAAE,EAAE;AACb,IAAA,SAAS,EAAE,sCAAsC;AACjD,IAAA,MAAM,EAAE,CAAC;AACV,CAAA;AAEM,MAAM,eAAe,GAAG,CAAC,EAC9B,UAAU,EACV,UAAU,EACV,MAAM,GAKP,MAAM;IACL,MAAM,EAAE,UAAU,GAAG,aAAa,GAAG,SAAS;AAC9C,IAAA,SAAS,EAAE,EAAE;AACb,IAAA,MAAM,EAAE,OAAO;AACf,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,QAAQ,EAAE,EAAE;IACZ,eAAe,EAAE,UAAU,GAAG,MAAM,CAAC,eAAe,GAAG,OAAO;AAC9D,IAAA,KAAK,EAAE;UACH,MAAM,CAAC;AACT,UAAE;cACE,MAAM,CAAC;cACP,MAAM,CAAC,QAAQ;IACrB,UAAU,EAAE,UAAU,GAAG,GAAG,GAAG,GAAG;AAClC,IAAA,SAAS,EAAE;AACT,QAAA,eAAe,EAAE,UAAU,GAAG,MAAM,CAAC,eAAe,GAAG,MAAM,CAAC,MAAM;AACrE,KAAA;AACF,CAAA;MAEY,gBAAgB,GAAG,CAAC,OAAe,EAAE,MAAoB,KAAI;AACxE,IAAA,MAAM,UAAU,GAAG;AACjB,QAAA,YAAY,EAAE,CAAC;AACf,QAAA,MAAM,EAAE,SAAS;AACjB,QAAA,SAAS,EAAE,EAAE;AACb,QAAA,QAAQ,EAAE,KAAK;AACf,QAAA,UAAU,EAAE,GAAG;AACf,QAAA,WAAW,EAAE,EAAE;AACf,QAAA,YAAY,EAAE,CAAC;AACf,QAAA,eAAe,EAAE,OAAO;KACzB;AAED,IAAA,IAAI,OAAO,KAAK,QAAQ,EAAE;QACxB,OAAO;AACL,YAAA,GAAG,UAAU;AACb,YAAA,MAAM,EAAE,CAAA,UAAA,EAAa,MAAM,CAAC,WAAW,CAAA,CAAE;AACzC,YAAA,SAAS,EAAE,CAAA,UAAA,EAAa,MAAM,CAAC,WAAW,CAAA,CAAE;SAC7C;IACH;AAEA,IAAA,OAAO,UAAU;AACnB;;;;;;;"}
+{"version":3,"file":"Select.styles.js","sources":["../../../src/components/Select/Select.styles.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAAA;;;;;;;;AAQG;AAEH,MAAM,SAAS,GAAG;AAChB,IAAA,eAAe,EAAE,mCAAmC;AACpD,IAAA,eAAe,EAAE,kCAAkC;CACpD;AAED,MAAM,SAAS,GAAG;AAChB,IAAA,GAAG,SAAS;AACZ,IAAA,EAAE,EAAE,OAAO;AACX,IAAA,WAAW,EAAE,UAAU;AACvB,IAAA,MAAM,EAAE,EAAE,WAAW,EAAE,iBAAiB,EAAE;AAC1C,IAAA,MAAM,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE;AACvC,IAAA,QAAQ,EAAE;AACR,QAAA,WAAW,EAAE,aAAa;AAC1B,QAAA,MAAM,EAAE,EAAE,WAAW,EAAE,aAAa,EAAE;AACtC,QAAA,MAAM,EAAE,EAAE,WAAW,EAAE,aAAa,EAAE;AACvC,KAAA;AACD,IAAA,SAAS,EAAE;AACT,QAAA,OAAO,EAAE,CAAC;AACV,QAAA,MAAM,EAAE,aAAa;AACrB,QAAA,EAAE,EAAE,SAAS;AACb,QAAA,KAAK,EAAE,WAAW;AAClB,QAAA,UAAU,EAAE,UAAU;AACvB,KAAA;CACF;AAED;AACO,MAAM,aAAa,GAAG;AAC3B,IAAA,GAAG,SAAS;AACZ,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,KAAK,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE;;AAGxC;AACO,MAAM,WAAW,GAAG;AACzB,IAAA,GAAG,SAAS;;AAGd;AACO,MAAM,aAAa,GAAG;AAC3B,IAAA,EAAE,EAAE,OAAO;AACX,IAAA,WAAW,EAAE,UAAU;AACvB,IAAA,WAAW,EAAE,KAAK;AAClB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,SAAS,EAAE,sCAAsC;AACjD,IAAA,OAAO,EAAE,KAAK;;AAGhB;AACO,MAAM,UAAU,GAAG;AACxB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,KAAK,EAAE,WAAW;AAClB,IAAA,YAAY,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE;AAC/B,IAAA,QAAQ,EAAE;AACR,QAAA,EAAE,EAAE,oBAAoB;AACxB,QAAA,KAAK,EAAE,cAAc;AACrB,QAAA,UAAU,EAAE,MAAM;AACnB,KAAA;IACD,SAAS,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,aAAa,EAAE;;AAGzD;AACO,MAAM,eAAe,GAAG;AAC7B,IAAA,KAAK,EAAE,UAAU;;;;;;;;;"}

package/dist/components/Select/Select.styles.mjs

@@ -1,75 +1,72 @@
 "use client";
 /**
- * Select component styles (Chakra v3 compatible)
+ * Shared style objects for the Select and Combobox components.
  *
- * Defaults mirror the Input component (Chakra v3 `Input` recipe + Logician
- * Input.tsx overrides) so the two controls share the same border, hover,
- * focus, font, and disabled/readOnly behavior. When the Input component
- * changes, update these values to match.
- *
- * Reference (kept in sync with Input.tsx):
- *   borderColor: gray.400
- *   _hover     : primary.lighter
- *   _focus     : primary.main
- *   _invalid   : danger.main
- *   borderRadius: 6 (Chakra `l2` -> Logician `radii.sm`)
- *   minHeight  : 40 (Chakra md, `sizes.10`)
- *   fontSize   : 1em (Chakra textStyle `sm`, inherits responsively)
- *   fontWeight : 500 (Chakra textStyle `sm` -> `subtitleAndP.medium`)
- *   paddingX   : 12px (Chakra md, `px: 3`)
+ * These mirror the Input component (`Input.tsx`) so the form controls share
+ * the same border, hover, focus and disabled behavior. They are applied on
+ * top of Chakra's built-in `select` / `combobox` slot recipes via the `css`
+ * prop — only the design-system deltas live here. When `Input.tsx` changes,
+ * update these values to match.
  */
-const getPlaceholderStyles = (colors) => ({
-    color: colors.gray500,
-    fontSize: '1em',
-    fontWeight: 500,
-});
-const getMenuStyles = (colors) => ({
-    width: 'max-content',
-    minWidth: '100%',
-    backgroundColor: 'white',
-    borderRadius: 8,
-    border: `1px solid ${colors.gray300}`,
-    marginTop: 12,
+const focusVars = {
+    '--focus-color': 'var(--chakra-colors-primary-main)',
+    '--error-color': 'var(--chakra-colors-danger-main)',
+};
+const fieldBase = {
+    ...focusVars,
+    bg: 'white',
+    borderColor: 'gray.400',
+    _hover: { borderColor: 'primary.lighter' },
+    _focus: { borderColor: 'primary.main' },
+    _invalid: {
+        borderColor: 'danger.main',
+        _hover: { borderColor: 'danger.main' },
+        _focus: { borderColor: 'danger.main' },
+    },
+    _disabled: {
+        opacity: 1,
+        cursor: 'not-allowed',
+        bg: 'gray.50',
+        color: 'gray.1000',
+        fontWeight: 'semibold',
+    },
+};
+/** Select trigger — the clickable control. */
+const triggerStyles = {
+    ...fieldBase,
+    cursor: 'pointer',
+    _open: { borderColor: 'primary.main' },
+};
+/** Combobox text input — the typeable control. */
+const inputStyles = {
+    ...fieldBase,
+};
+/** Dropdown panel for both Select and Combobox. */
+const contentStyles = {
+    bg: 'white',
+    borderColor: 'gray.300',
+    borderWidth: '1px',
+    borderRadius: '8px',
     boxShadow: '0px 5px 20px 0px rgba(0, 0, 0, 0.10)',
-    zIndex: 9,
-});
-const getOptionStyles = ({ isSelected, isDisabled, colors, }) => ({
-    cursor: isDisabled ? 'not-allowed' : 'pointer',
-    minHeight: 36,
-    margin: '4px 0',
-    borderRadius: 4,
-    fontSize: 14,
-    backgroundColor: isSelected ? colors.primaryLightest : 'white',
-    color: isSelected
-        ? colors.primaryDark
-        : isDisabled
-            ? colors.gray500
-            : colors.gray1200,
-    fontWeight: isSelected ? 700 : 400,
-    '&:hover': {
-        backgroundColor: isSelected ? colors.primaryLightest : colors.gray50,
+    padding: '4px',
+};
+/** Individual option for both Select and Combobox. */
+const itemStyles = {
+    borderRadius: '4px',
+    cursor: 'pointer',
+    color: 'gray.1200',
+    _highlighted: { bg: 'gray.50' },
+    _checked: {
+        bg: 'primary.extralight',
+        color: 'primary.dark',
+        fontWeight: 'bold',
     },
-});
-const getControlStyles = (variant, colors) => {
-    const baseStyles = {
-        borderRadius: 6,
-        cursor: 'pointer',
-        minHeight: 40,
-        fontSize: '1em',
-        fontWeight: 500,
-        paddingLeft: 12,
-        paddingRight: 8,
-        backgroundColor: 'white',
-    };
-    if (variant === 'danger') {
-        return {
-            ...baseStyles,
-            border: `1px solid ${colors.dangerColor}`,
-            boxShadow: `0 0 0 1px ${colors.dangerColor}`,
-        };
-    }
-    return baseStyles;
+    _disabled: { color: 'gray.500', cursor: 'not-allowed' },
+};
+/** Dropdown chevron — softened so it doesn't outweigh adjacent icons. */
+const indicatorStyles = {
+    color: 'gray.600',
 };
 
-export { getControlStyles, getMenuStyles, getOptionStyles, getPlaceholderStyles };
+export { contentStyles, indicatorStyles, inputStyles, itemStyles, triggerStyles };
 //# sourceMappingURL=Select.styles.mjs.map

package/dist/components/Select/Select.styles.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Select.styles.mjs","sources":["../../../src/components/Select/Select.styles.ts"],"sourcesContent":[null],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;AAkBG;MAIU,oBAAoB,GAAG,CAAC,MAAoB,MAAM;IAC7D,KAAK,EAAE,MAAM,CAAC,OAAO;AACrB,IAAA,QAAQ,EAAE,KAAK;AACf,IAAA,UAAU,EAAE,GAAG;AAChB,CAAA;MAEY,aAAa,GAAG,CAAC,MAAoB,MAAM;AACtD,IAAA,KAAK,EAAE,aAAa;AACpB,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,eAAe,EAAE,OAAO;AACxB,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,MAAM,EAAE,CAAA,UAAA,EAAa,MAAM,CAAC,OAAO,CAAA,CAAE;AACrC,IAAA,SAAS,EAAE,EAAE;AACb,IAAA,SAAS,EAAE,sCAAsC;AACjD,IAAA,MAAM,EAAE,CAAC;AACV,CAAA;AAEM,MAAM,eAAe,GAAG,CAAC,EAC9B,UAAU,EACV,UAAU,EACV,MAAM,GAKP,MAAM;IACL,MAAM,EAAE,UAAU,GAAG,aAAa,GAAG,SAAS;AAC9C,IAAA,SAAS,EAAE,EAAE;AACb,IAAA,MAAM,EAAE,OAAO;AACf,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,QAAQ,EAAE,EAAE;IACZ,eAAe,EAAE,UAAU,GAAG,MAAM,CAAC,eAAe,GAAG,OAAO;AAC9D,IAAA,KAAK,EAAE;UACH,MAAM,CAAC;AACT,UAAE;cACE,MAAM,CAAC;cACP,MAAM,CAAC,QAAQ;IACrB,UAAU,EAAE,UAAU,GAAG,GAAG,GAAG,GAAG;AAClC,IAAA,SAAS,EAAE;AACT,QAAA,eAAe,EAAE,UAAU,GAAG,MAAM,CAAC,eAAe,GAAG,MAAM,CAAC,MAAM;AACrE,KAAA;AACF,CAAA;MAEY,gBAAgB,GAAG,CAAC,OAAe,EAAE,MAAoB,KAAI;AACxE,IAAA,MAAM,UAAU,GAAG;AACjB,QAAA,YAAY,EAAE,CAAC;AACf,QAAA,MAAM,EAAE,SAAS;AACjB,QAAA,SAAS,EAAE,EAAE;AACb,QAAA,QAAQ,EAAE,KAAK;AACf,QAAA,UAAU,EAAE,GAAG;AACf,QAAA,WAAW,EAAE,EAAE;AACf,QAAA,YAAY,EAAE,CAAC;AACf,QAAA,eAAe,EAAE,OAAO;KACzB;AAED,IAAA,IAAI,OAAO,KAAK,QAAQ,EAAE;QACxB,OAAO;AACL,YAAA,GAAG,UAAU;AACb,YAAA,MAAM,EAAE,CAAA,UAAA,EAAa,MAAM,CAAC,WAAW,CAAA,CAAE;AACzC,YAAA,SAAS,EAAE,CAAA,UAAA,EAAa,MAAM,CAAC,WAAW,CAAA,CAAE;SAC7C;IACH;AAEA,IAAA,OAAO,UAAU;AACnB;;;;"}
+{"version":3,"file":"Select.styles.mjs","sources":["../../../src/components/Select/Select.styles.ts"],"sourcesContent":[null],"names":[],"mappings":";AAAA;;;;;;;;AAQG;AAEH,MAAM,SAAS,GAAG;AAChB,IAAA,eAAe,EAAE,mCAAmC;AACpD,IAAA,eAAe,EAAE,kCAAkC;CACpD;AAED,MAAM,SAAS,GAAG;AAChB,IAAA,GAAG,SAAS;AACZ,IAAA,EAAE,EAAE,OAAO;AACX,IAAA,WAAW,EAAE,UAAU;AACvB,IAAA,MAAM,EAAE,EAAE,WAAW,EAAE,iBAAiB,EAAE;AAC1C,IAAA,MAAM,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE;AACvC,IAAA,QAAQ,EAAE;AACR,QAAA,WAAW,EAAE,aAAa;AAC1B,QAAA,MAAM,EAAE,EAAE,WAAW,EAAE,aAAa,EAAE;AACtC,QAAA,MAAM,EAAE,EAAE,WAAW,EAAE,aAAa,EAAE;AACvC,KAAA;AACD,IAAA,SAAS,EAAE;AACT,QAAA,OAAO,EAAE,CAAC;AACV,QAAA,MAAM,EAAE,aAAa;AACrB,QAAA,EAAE,EAAE,SAAS;AACb,QAAA,KAAK,EAAE,WAAW;AAClB,QAAA,UAAU,EAAE,UAAU;AACvB,KAAA;CACF;AAED;AACO,MAAM,aAAa,GAAG;AAC3B,IAAA,GAAG,SAAS;AACZ,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,KAAK,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE;;AAGxC;AACO,MAAM,WAAW,GAAG;AACzB,IAAA,GAAG,SAAS;;AAGd;AACO,MAAM,aAAa,GAAG;AAC3B,IAAA,EAAE,EAAE,OAAO;AACX,IAAA,WAAW,EAAE,UAAU;AACvB,IAAA,WAAW,EAAE,KAAK;AAClB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,SAAS,EAAE,sCAAsC;AACjD,IAAA,OAAO,EAAE,KAAK;;AAGhB;AACO,MAAM,UAAU,GAAG;AACxB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,KAAK,EAAE,WAAW;AAClB,IAAA,YAAY,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE;AAC/B,IAAA,QAAQ,EAAE;AACR,QAAA,EAAE,EAAE,oBAAoB;AACxB,QAAA,KAAK,EAAE,cAAc;AACrB,QAAA,UAAU,EAAE,MAAM;AACnB,KAAA;IACD,SAAS,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,aAAa,EAAE;;AAGzD;AACO,MAAM,eAAe,GAAG;AAC7B,IAAA,KAAK,EAAE,UAAU;;;;;"}

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

@@ -1,11 +1,34 @@
-import { GroupBase, Props } from 'react-select';
-export type SelectVariant = 'default' | 'danger';
-export type SelectProps<Option, IsMulti extends boolean, Group extends GroupBase<Option>> = Props<Option, IsMulti, Group> & {
-    variant?: SelectVariant;
-    invalid?: boolean;
-};
-export type SelectOption<T> = {
+import type { ReactNode } from 'react';
+export type SelectSize = 'xs' | 'sm' | 'md' | 'lg';
+export interface SelectOption<T = string> {
     label: string;
     value: T;
-};
+    disabled?: boolean;
+}
+interface FieldBaseProps<T> {
+    /** Options rendered in the dropdown. */
+    options: SelectOption<T>[];
+    /** Controlled selected value. */
+    value?: T | null;
+    /** Initial value for uncontrolled usage. */
+    defaultValue?: T | null;
+    /** Called with the selected value, or `null` when the selection is cleared. */
+    onChange?: (value: T | null) => void;
+    placeholder?: string;
+    /** Optional label rendered above the control. */
+    label?: ReactNode;
+    size?: SelectSize;
+    invalid?: boolean;
+    disabled?: boolean;
+    readOnly?: boolean;
+    required?: boolean;
+    name?: string;
+    width?: string | number;
+}
+export type SelectFieldProps<T = string> = FieldBaseProps<T>;
+export interface ComboboxFieldProps<T = string> extends FieldBaseProps<T> {
+    /** Content shown when no option matches the typed query. */
+    emptyText?: ReactNode;
+}
+export {};
 //# sourceMappingURL=Select.types.d.ts.map

package/dist/components/Select/Select.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.types.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAEhD,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEjD,MAAM,MAAM,WAAW,CACrB,MAAM,EACN,OAAO,SAAS,OAAO,EACvB,KAAK,SAAS,SAAS,CAAC,MAAM,CAAC,IAC7B,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC,GAAG;IAClC,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,CAAC,CAAC;CACV,CAAC"}
+{"version":3,"file":"Select.types.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEnD,MAAM,WAAW,YAAY,CAAC,CAAC,GAAG,MAAM;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,cAAc,CAAC,CAAC;IACxB,wCAAwC;IACxC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3B,iCAAiC;IACjC,KAAK,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC;IACjB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC;IACxB,+EAA+E;IAC/E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iDAAiD;IACjD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,MAAM,MAAM,gBAAgB,CAAC,CAAC,GAAG,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC,CAAC;AAE7D,MAAM,WAAW,kBAAkB,CAAC,CAAC,GAAG,MAAM,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IACvE,4DAA4D;IAC5D,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB"}

package/dist/components/Select/SelectField.d.ts

@@ -0,0 +1,11 @@
+import { SelectFieldProps } from './Select.types';
+/**
+ * Single-select dropdown with the Logician design-system styling applied.
+ * The ergonomic counterpart to `Input` — pass `options`, `value` and
+ * `onChange` and it renders the full Select composition internally.
+ *
+ * For multi-select, grouped options or custom layouts, compose the `Select`
+ * primitives directly.
+ */
+export declare function SelectField<T = string>({ options, value, defaultValue, onChange, placeholder, label, size, invalid, disabled, readOnly, required, name, width, }: SelectFieldProps<T>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SelectField.d.ts.map

package/dist/components/Select/SelectField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectField.d.ts","sourceRoot":"","sources":["../../../src/components/Select/SelectField.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,CAAC,GAAG,MAAM,EAAE,EACtC,OAAO,EACP,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,IAAW,EACX,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,KAAc,GACf,EAAE,gBAAgB,CAAC,CAAC,CAAC,2CA0DrB"}

package/dist/components/Select/SelectField.js

@@ -0,0 +1,32 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var react = require('@chakra-ui/react');
+var Select = require('./Select.js');
+
+/**
+ * Single-select dropdown with the Logician design-system styling applied.
+ * The ergonomic counterpart to `Input` — pass `options`, `value` and
+ * `onChange` and it renders the full Select composition internally.
+ *
+ * For multi-select, grouped options or custom layouts, compose the `Select`
+ * primitives directly.
+ */
+function SelectField({ options, value, defaultValue, onChange, placeholder, label, size = 'md', invalid, disabled, readOnly, required, name, width = 'full', }) {
+    const collection = React.useMemo(() => react.createListCollection({
+        items: options,
+        itemToValue: (item) => String(item.value),
+        itemToString: (item) => item.label,
+        isItemDisabled: (item) => Boolean(item.disabled),
+    }), [options]);
+    const toKeys = (val) => val === null || val === undefined ? [] : [String(val)];
+    return (jsxRuntime.jsxs(Select.Select.Root, { collection: collection, size: size, width: width, invalid: invalid, disabled: disabled, readOnly: readOnly, required: required, name: name, value: value === undefined ? undefined : toKeys(value), defaultValue: defaultValue === undefined ? undefined : toKeys(defaultValue), onValueChange: (details) => {
+            const selected = details.items[0];
+            onChange?.(selected ? selected.value : null);
+        }, children: [jsxRuntime.jsx(Select.Select.HiddenSelect, {}), label != null && jsxRuntime.jsx(Select.Select.Label, { children: label }), jsxRuntime.jsxs(Select.Select.Control, { children: [jsxRuntime.jsx(Select.Select.Trigger, { children: jsxRuntime.jsx(Select.Select.ValueText, { placeholder: placeholder }) }), jsxRuntime.jsx(Select.Select.IndicatorGroup, { children: jsxRuntime.jsx(Select.Select.Indicator, {}) })] }), jsxRuntime.jsx(react.Portal, { children: jsxRuntime.jsx(Select.Select.Positioner, { children: jsxRuntime.jsx(Select.Select.Content, { children: options.map((option) => (jsxRuntime.jsxs(Select.Select.Item, { item: option, children: [jsxRuntime.jsx(Select.Select.ItemText, { children: option.label }), jsxRuntime.jsx(Select.Select.ItemIndicator, {})] }, String(option.value)))) }) }) })] }));
+}
+
+exports.SelectField = SelectField;
+//# sourceMappingURL=SelectField.js.map

package/dist/components/Select/SelectField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectField.js","sources":["../../../src/components/Select/SelectField.tsx"],"sourcesContent":[null],"names":["useMemo","createListCollection","_jsxs","Select","_jsx","Portal"],"mappings":";;;;;;;;AAMA;;;;;;;AAOG;AACG,SAAU,WAAW,CAAa,EACtC,OAAO,EACP,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,IAAI,GAAG,IAAI,EACX,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,KAAK,GAAG,MAAM,GACM,EAAA;IACpB,MAAM,UAAU,GAAGA,aAAO,CACxB,MACEC,0BAAoB,CAAC;AACnB,QAAA,KAAK,EAAE,OAAO;QACd,WAAW,EAAE,CAAC,IAAI,KAAK,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;QACzC,YAAY,EAAE,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK;QAClC,cAAc,EAAE,CAAC,IAAI,KAAK,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC;AACjD,KAAA,CAAC,EACJ,CAAC,OAAO,CAAC,CACV;IAED,MAAM,MAAM,GAAG,CAAC,GAAyB,KACvC,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,SAAS,GAAG,EAAE,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;AAExD,IAAA,QACEC,eAAA,CAACC,aAAM,CAAC,IAAI,IACV,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC,KAAK,CAAC,EACtD,YAAY,EACV,YAAY,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC,YAAY,CAAC,EAE/D,aAAa,EAAE,CAAC,OAAO,KAAI;YACzB,MAAM,QAAQ,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC;AACjC,YAAA,QAAQ,GAAG,QAAQ,GAAG,QAAQ,CAAC,KAAK,GAAG,IAAI,CAAC;QAC9C,CAAC,EAAA,QAAA,EAAA,CAEDC,cAAA,CAACD,aAAM,CAAC,YAAY,KAAG,EACtB,KAAK,IAAI,IAAI,IAAIC,cAAA,CAACD,aAAM,CAAC,KAAK,EAAA,EAAA,QAAA,EAAE,KAAK,EAAA,CAAgB,EACtDD,eAAA,CAACC,aAAM,CAAC,OAAO,EAAA,EAAA,QAAA,EAAA,CACbC,cAAA,CAACD,aAAM,CAAC,OAAO,EAAA,EAAA,QAAA,EACbC,cAAA,CAACD,aAAM,CAAC,SAAS,EAAA,EAAC,WAAW,EAAE,WAAW,EAAA,CAAI,EAAA,CAC/B,EACjBC,cAAA,CAACD,aAAM,CAAC,cAAc,EAAA,EAAA,QAAA,EACpBC,cAAA,CAACD,aAAM,CAAC,SAAS,EAAA,EAAA,CAAG,EAAA,CACE,CAAA,EAAA,CACT,EACjBC,cAAA,CAACC,YAAM,EAAA,EAAA,QAAA,EACLD,cAAA,CAACD,aAAM,CAAC,UAAU,EAAA,EAAA,QAAA,EAChBC,cAAA,CAACD,aAAM,CAAC,OAAO,EAAA,EAAA,QAAA,EACZ,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MAClBD,eAAA,CAACC,aAAM,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,MAAM,EAAA,QAAA,EAAA,CACvBC,cAAA,CAACD,aAAM,CAAC,QAAQ,EAAA,EAAA,QAAA,EAAE,MAAM,CAAC,KAAK,EAAA,CAAmB,EACjDC,cAAA,CAACD,aAAM,CAAC,aAAa,EAAA,EAAA,CAAG,CAAA,EAAA,EAFM,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAGtC,CACf,CAAC,EAAA,CACa,EAAA,CACC,EAAA,CACb,CAAA,EAAA,CACG;AAElB;;;;"}

package/dist/components/Select/SelectField.mjs

@@ -0,0 +1,30 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useMemo } from 'react';
+import { createListCollection, Portal } from '@chakra-ui/react';
+import { Select } from './Select.mjs';
+
+/**
+ * Single-select dropdown with the Logician design-system styling applied.
+ * The ergonomic counterpart to `Input` — pass `options`, `value` and
+ * `onChange` and it renders the full Select composition internally.
+ *
+ * For multi-select, grouped options or custom layouts, compose the `Select`
+ * primitives directly.
+ */
+function SelectField({ options, value, defaultValue, onChange, placeholder, label, size = 'md', invalid, disabled, readOnly, required, name, width = 'full', }) {
+    const collection = useMemo(() => createListCollection({
+        items: options,
+        itemToValue: (item) => String(item.value),
+        itemToString: (item) => item.label,
+        isItemDisabled: (item) => Boolean(item.disabled),
+    }), [options]);
+    const toKeys = (val) => val === null || val === undefined ? [] : [String(val)];
+    return (jsxs(Select.Root, { collection: collection, size: size, width: width, invalid: invalid, disabled: disabled, readOnly: readOnly, required: required, name: name, value: value === undefined ? undefined : toKeys(value), defaultValue: defaultValue === undefined ? undefined : toKeys(defaultValue), onValueChange: (details) => {
+            const selected = details.items[0];
+            onChange?.(selected ? selected.value : null);
+        }, children: [jsx(Select.HiddenSelect, {}), label != null && jsx(Select.Label, { children: label }), jsxs(Select.Control, { children: [jsx(Select.Trigger, { children: jsx(Select.ValueText, { placeholder: placeholder }) }), jsx(Select.IndicatorGroup, { children: jsx(Select.Indicator, {}) })] }), jsx(Portal, { children: jsx(Select.Positioner, { children: jsx(Select.Content, { children: options.map((option) => (jsxs(Select.Item, { item: option, children: [jsx(Select.ItemText, { children: option.label }), jsx(Select.ItemIndicator, {})] }, String(option.value)))) }) }) })] }));
+}
+
+export { SelectField };
+//# sourceMappingURL=SelectField.mjs.map

package/dist/components/Select/SelectField.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectField.mjs","sources":["../../../src/components/Select/SelectField.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"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"}

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

@@ -1,3 +1,7 @@
+export { Combobox } from './Combobox';
+export { ComboboxField } from './ComboboxField';
 export { Select } from './Select';
 export type * from './Select.types';
+export { SelectField } from './SelectField';
+export { createListCollection, useFilter, useListCollection, } from '@chakra-ui/react';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,mBAAmB,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,mBAAmB,gBAAgB,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EACL,oBAAoB,EACpB,SAAS,EACT,iBAAiB,GAClB,MAAM,kBAAkB,CAAC"}

package/dist/index.js

@@ -78,7 +78,11 @@ var SeeMoreButton = require('./components/SeeMoreButton/SeeMoreButton.js');
 var SegmentedControl = require('./components/SegmentedControl/SegmentedControl.js');
 var ProgressSegment = require('./components/SegmentedProgressBar/ProgressSegment.js');
 var SegmentedProgressBar = require('./components/SegmentedProgressBar/SegmentedProgressBar.js');
+var Combobox = require('./components/Select/Combobox.js');
+var ComboboxField = require('./components/Select/ComboboxField.js');
 var Select = require('./components/Select/Select.js');
+var SelectField = require('./components/Select/SelectField.js');
+var react = require('@chakra-ui/react');
 var Slider = require('./components/Slider/Slider.js');
 var SliderControl = require('./components/Slider/SliderControl/SliderControl.js');
 var SliderFilledTrack = require('./components/Slider/SliderFilledTrack/SliderFilledTrack.js');
@@ -101,7 +105,6 @@ var TabList = require('./components/Tabs/TabList/TabList.js');
 var TabPanel = require('./components/Tabs/TabPanel.js');
 var TabPanels = require('./components/Tabs/TabPanels.js');
 var Tabs = require('./components/Tabs/Tabs.js');
-var react = require('@chakra-ui/react');
 var Tag = require('./components/Tag/Tag.js');
 var Tag_styles = require('./components/Tag/Tag.styles.js');
 var TagCloseButton = require('./components/Tag/TagCloseButton/TagCloseButton.js');
@@ -219,7 +222,30 @@ exports.SeeMoreButton = SeeMoreButton.SeeMoreButton;
 exports.SegmentedControl = SegmentedControl.SegmentedControl;
 exports.ProgressSegment = ProgressSegment.ProgressSegment;
 exports.SegmentedProgressBar = SegmentedProgressBar.SegmentedProgressBar;
+exports.Combobox = Combobox.Combobox;
+exports.ComboboxField = ComboboxField.ComboboxField;
 exports.Select = Select.Select;
+exports.SelectField = SelectField.SelectField;
+Object.defineProperty(exports, "TagLeftIcon", {
+	enumerable: true,
+	get: function () { return react.Icon; }
+});
+Object.defineProperty(exports, "TagRightIcon", {
+	enumerable: true,
+	get: function () { return react.Icon; }
+});
+Object.defineProperty(exports, "createListCollection", {
+	enumerable: true,
+	get: function () { return react.createListCollection; }
+});
+Object.defineProperty(exports, "useFilter", {
+	enumerable: true,
+	get: function () { return react.useFilter; }
+});
+Object.defineProperty(exports, "useListCollection", {
+	enumerable: true,
+	get: function () { return react.useListCollection; }
+});
 exports.Slider = Slider.Slider;
 exports.SliderControl = SliderControl.SliderControl;
 exports.SliderFilledTrack = SliderFilledTrack.SliderFilledTrack;
@@ -242,14 +268,6 @@ exports.TabList = TabList.TabList;
 exports.TabPanel = TabPanel.TabPanel;
 exports.TabPanels = TabPanels.TabPanels;
 exports.Tabs = Tabs.Tabs;
-Object.defineProperty(exports, "TagLeftIcon", {
-	enumerable: true,
-	get: function () { return react.Icon; }
-});
-Object.defineProperty(exports, "TagRightIcon", {
-	enumerable: true,
-	get: function () { return react.Icon; }
-});
 exports.Tag = Tag.Tag;
 exports.getTagStyles = Tag_styles.getTagStyles;
 exports.tagColorPaletteStyles = Tag_styles.tagColorPaletteStyles;

package/dist/index.js.map

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

package/dist/index.mjs

@@ -76,7 +76,11 @@ export { SeeMoreButton } from './components/SeeMoreButton/SeeMoreButton.mjs';
 export { SegmentedControl } from './components/SegmentedControl/SegmentedControl.mjs';
 export { ProgressSegment } from './components/SegmentedProgressBar/ProgressSegment.mjs';
 export { SegmentedProgressBar } from './components/SegmentedProgressBar/SegmentedProgressBar.mjs';
+export { Combobox } from './components/Select/Combobox.mjs';
+export { ComboboxField } from './components/Select/ComboboxField.mjs';
 export { Select } from './components/Select/Select.mjs';
+export { SelectField } from './components/Select/SelectField.mjs';
+export { Icon as TagLeftIcon, Icon as TagRightIcon, createListCollection, useFilter, useListCollection } from '@chakra-ui/react';
 export { Slider } from './components/Slider/Slider.mjs';
 export { SliderControl } from './components/Slider/SliderControl/SliderControl.mjs';
 export { SliderFilledTrack } from './components/Slider/SliderFilledTrack/SliderFilledTrack.mjs';
@@ -99,7 +103,6 @@ export { TabList } from './components/Tabs/TabList/TabList.mjs';
 export { TabPanel } from './components/Tabs/TabPanel.mjs';
 export { TabPanels } from './components/Tabs/TabPanels.mjs';
 export { Tabs } from './components/Tabs/Tabs.mjs';
-export { Icon as TagLeftIcon, Icon as TagRightIcon } from '@chakra-ui/react';
 export { Tag } from './components/Tag/Tag.mjs';
 export { getTagStyles, tagColorPaletteStyles, tagColorPalettes, tagVariants } from './components/Tag/Tag.styles.mjs';
 export { TagCloseButton } from './components/Tag/TagCloseButton/TagCloseButton.mjs';

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindlogic-ai/logician-ui",
-  "version": "3.0.0-alpha.34",
+  "version": "3.0.0-alpha.35",
   "description": "A comprehensive React design system built on Chakra UI",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -60,7 +60,6 @@
   },
   "dependencies": {
     "@mdxeditor/editor": "^3.45.1",
-    "@tanstack/react-virtual": "^3.0.0",
     "@types/lodash": "^4.17.20",
     "chakra-dayzed-datepicker": "3.0.0",
     "date-fns": "^2.30.0",
@@ -70,7 +69,6 @@
     "polished": "^4.3.0",
     "react-markdown": "^10.1.0",
     "react-pin-input": "^1.3.0",
-    "react-select": "^5.8.0",
     "react-spinners": "^0.17.0",
     "recharts": "^3.1.2",
     "rehype-katex": "^7.0.1",