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

package/dist/components/Code/shikiAdapter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shikiAdapter.d.ts","sourceRoot":"","sources":["../../../src/components/Code/shikiAdapter.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAoC,MAAM,OAAO,CAAC;AAE/E,eAAO,MAAM,iBAAiB,EAAE,eAAe,EA6B9C,CAAC;AAEF,eAAO,MAAM,YAAY,6CAWvB,CAAC"}
+{"version":3,"file":"shikiAdapter.d.ts","sourceRoot":"","sources":["../../../src/components/Code/shikiAdapter.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAoC,MAAM,OAAO,CAAC;AAE/E,eAAO,MAAM,iBAAiB,EAAE,eAAe,EA8B9C,CAAC;AAEF,eAAO,MAAM,YAAY,6CAWvB,CAAC"}

package/dist/components/Code/shikiAdapter.js

@@ -27,6 +27,7 @@ const BUNDLED_LANGUAGES = [
     'rust',
     'shell',
     'sql',
+    'stata',
     'toml',
     'tsx',
     'typescript',

package/dist/components/Code/shikiAdapter.js.map

@@ -1 +1 @@
-{"version":3,"file":"shikiAdapter.js","sources":["../../../src/components/Code/shikiAdapter.ts"],"sourcesContent":[null],"names":["createShikiAdapter"],"mappings":";;;;;AAGO,MAAM,iBAAiB,GAAsB;IAClD,MAAM;IACN,GAAG;IACH,QAAQ;IACR,KAAK;IACL,MAAM;IACN,YAAY;IACZ,IAAI;IACJ,MAAM;IACN,MAAM;IACN,YAAY;IACZ,MAAM;IACN,KAAK;IACL,QAAQ;IACR,KAAK;IACL,UAAU;IACV,QAAQ;IACR,SAAS;IACT,QAAQ;IACR,GAAG;IACH,MAAM;IACN,MAAM;IACN,OAAO;IACP,KAAK;IACL,MAAM;IACN,KAAK;IACL,YAAY;IACZ,KAAK;IACL,MAAM;;AAGD,MAAM,YAAY,GAAGA,wBAAkB,CAE5C;AACA,IAAA,MAAM,IAAI,GAAA;QACR,MAAM,EAAE,iBAAiB,EAAE,GAAG,MAAM,oDAAO,wCAAO,KAAC;AACnD,QAAA,OAAO,iBAAiB,CAAC;AACvB,YAAA,KAAK,EAAE,iBAAiB;YACxB,MAAM,EAAE,CAAC,aAAa,CAAC;AACxB,SAAA,CAAC;IACJ,CAAC;AACD,IAAA,KAAK,EAAE,aAAa;AACrB,CAAA;;;;;"}
+{"version":3,"file":"shikiAdapter.js","sources":["../../../src/components/Code/shikiAdapter.ts"],"sourcesContent":[null],"names":["createShikiAdapter"],"mappings":";;;;;AAGO,MAAM,iBAAiB,GAAsB;IAClD,MAAM;IACN,GAAG;IACH,QAAQ;IACR,KAAK;IACL,MAAM;IACN,YAAY;IACZ,IAAI;IACJ,MAAM;IACN,MAAM;IACN,YAAY;IACZ,MAAM;IACN,KAAK;IACL,QAAQ;IACR,KAAK;IACL,UAAU;IACV,QAAQ;IACR,SAAS;IACT,QAAQ;IACR,GAAG;IACH,MAAM;IACN,MAAM;IACN,OAAO;IACP,KAAK;IACL,OAAO;IACP,MAAM;IACN,KAAK;IACL,YAAY;IACZ,KAAK;IACL,MAAM;;AAGD,MAAM,YAAY,GAAGA,wBAAkB,CAE5C;AACA,IAAA,MAAM,IAAI,GAAA;QACR,MAAM,EAAE,iBAAiB,EAAE,GAAG,MAAM,oDAAO,wCAAO,KAAC;AACnD,QAAA,OAAO,iBAAiB,CAAC;AACvB,YAAA,KAAK,EAAE,iBAAiB;YACxB,MAAM,EAAE,CAAC,aAAa,CAAC;AACxB,SAAA,CAAC;IACJ,CAAC;AACD,IAAA,KAAK,EAAE,aAAa;AACrB,CAAA;;;;;"}

package/dist/components/Code/shikiAdapter.mjs

@@ -25,6 +25,7 @@ const BUNDLED_LANGUAGES = [
     'rust',
     'shell',
     'sql',
+    'stata',
     'toml',
     'tsx',
     'typescript',

package/dist/components/Code/shikiAdapter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"shikiAdapter.mjs","sources":["../../../src/components/Code/shikiAdapter.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAGO,MAAM,iBAAiB,GAAsB;IAClD,MAAM;IACN,GAAG;IACH,QAAQ;IACR,KAAK;IACL,MAAM;IACN,YAAY;IACZ,IAAI;IACJ,MAAM;IACN,MAAM;IACN,YAAY;IACZ,MAAM;IACN,KAAK;IACL,QAAQ;IACR,KAAK;IACL,UAAU;IACV,QAAQ;IACR,SAAS;IACT,QAAQ;IACR,GAAG;IACH,MAAM;IACN,MAAM;IACN,OAAO;IACP,KAAK;IACL,MAAM;IACN,KAAK;IACL,YAAY;IACZ,KAAK;IACL,MAAM;;AAGD,MAAM,YAAY,GAAG,kBAAkB,CAE5C;AACA,IAAA,MAAM,IAAI,GAAA;QACR,MAAM,EAAE,iBAAiB,EAAE,GAAG,MAAM,OAAO,yCAAO,CAAC;AACnD,QAAA,OAAO,iBAAiB,CAAC;AACvB,YAAA,KAAK,EAAE,iBAAiB;YACxB,MAAM,EAAE,CAAC,aAAa,CAAC;AACxB,SAAA,CAAC;IACJ,CAAC;AACD,IAAA,KAAK,EAAE,aAAa;AACrB,CAAA;;;;"}
+{"version":3,"file":"shikiAdapter.mjs","sources":["../../../src/components/Code/shikiAdapter.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAGO,MAAM,iBAAiB,GAAsB;IAClD,MAAM;IACN,GAAG;IACH,QAAQ;IACR,KAAK;IACL,MAAM;IACN,YAAY;IACZ,IAAI;IACJ,MAAM;IACN,MAAM;IACN,YAAY;IACZ,MAAM;IACN,KAAK;IACL,QAAQ;IACR,KAAK;IACL,UAAU;IACV,QAAQ;IACR,SAAS;IACT,QAAQ;IACR,GAAG;IACH,MAAM;IACN,MAAM;IACN,OAAO;IACP,KAAK;IACL,OAAO;IACP,MAAM;IACN,KAAK;IACL,YAAY;IACZ,KAAK;IACL,MAAM;;AAGD,MAAM,YAAY,GAAG,kBAAkB,CAE5C;AACA,IAAA,MAAM,IAAI,GAAA;QACR,MAAM,EAAE,iBAAiB,EAAE,GAAG,MAAM,OAAO,yCAAO,CAAC;AACnD,QAAA,OAAO,iBAAiB,CAAC;AACvB,YAAA,KAAK,EAAE,iBAAiB;YACxB,MAAM,EAAE,CAAC,aAAa,CAAC;AACxB,SAAA,CAAC;IACJ,CAAC;AACD,IAAA,KAAK,EAAE,aAAa;AACrB,CAAA;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAoB,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAUtD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,eAAO,MAAM,MAAM,GACjB,MAAM,EACN,OAAO,SAAS,OAAO,GAAG,KAAK,EAC/B,KAAK,SAAS,SAAS,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC,MAAM,CAAC,EACnD,uCAKC,WAAW,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC,4CAgJrC,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAoB,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAUtD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,eAAO,MAAM,MAAM,GACjB,MAAM,EACN,OAAO,SAAS,OAAO,GAAG,KAAK,EAC/B,KAAK,SAAS,SAAS,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC,MAAM,CAAC,EACnD,uCAKC,WAAW,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC,4CA4LrC,CAAC"}

package/dist/components/Select/Select.js

@@ -7,8 +7,9 @@ var react = require('@chakra-ui/react');
 var Select_styles = require('./Select.styles.js');
 
 const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
-    const [primaryColor, primaryLightest, primaryDark, dangerColor, gray50, gray300, gray400, gray500, gray600, gray1200,] = react.useToken('colors', [
+    const [primaryColor, primaryLighter, primaryLightest, primaryDark, dangerColor, gray50, gray300, gray400, gray500, gray600, gray1000, gray1200, gray1300,] = react.useToken('colors', [
         'primary.main',
+        'primary.lighter',
         'primary.extralight',
         'primary.dark',
         'danger.main',
@@ -17,7 +18,9 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
         'gray.400',
         'gray.500',
         'gray.600',
+        'gray.1000',
         'gray.1200',
+        'gray.1300',
     ]);
     const colors = {
         primaryLightest,
@@ -26,9 +29,7 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
         gray50,
         gray300,
         gray500,
-        gray600,
-        gray1200,
-    };
+        gray1200};
     // invalid prop이 true이면 variant를 'danger'로 오버라이드
     const effectiveVariant = invalid ? 'danger' : variant;
     return (jsxRuntime.jsx(ReactSelect, { closeMenuOnSelect: true, closeMenuOnScroll: true, isSearchable: false, ...rest, 
@@ -40,19 +41,40 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
                 return styles?.container ? styles.container(merged, state) : merged;
             },
             control: (base, state) => {
+                // Mirror Input.tsx: borderColor gray.400, _hover primary.lighter,
+                // _focus primary.main + 1px outline (Chakra Input recipe's
+                // `focusVisibleRing: "inside"`), _invalid danger.main,
+                // _disabled bg gray.50 / color gray.1000 / fontWeight semibold.
+                const focusOutlineColor = invalid ? dangerColor : primaryColor;
                 const merged = {
                     ...base,
                     ...Select_styles.getControlStyles(effectiveVariant, colors),
                     width: '100%',
-                    border: `1px solid ${invalid ? dangerColor : state.isFocused ? primaryColor : gray300}`,
+                    border: `1px solid ${invalid ? dangerColor : state.isFocused ? primaryColor : gray400}`,
                     boxShadow: 'none',
+                    outline: state.isFocused
+                        ? `1px solid ${focusOutlineColor}`
+                        : 'none',
+                    outlineOffset: 0,
+                    // react-select sets a 0.1s `transition: all` on the control,
+                    // which causes the border-color and outline (none -> solid +
+                    // transparent -> primary) to interpolate awkwardly — a brief
+                    // dark blink during focus. Disable to match Input, which
+                    // toggles its focus ring instantly via :focus-visible.
+                    transition: 'none',
                     '&:hover': {
                         borderColor: invalid
                             ? dangerColor
                             : state.isFocused
                                 ? primaryColor
-                                : gray400,
+                                : primaryLighter,
                     },
+                    ...(state.isDisabled && {
+                        backgroundColor: gray50,
+                        color: gray1000,
+                        fontWeight: 600,
+                        cursor: 'not-allowed',
+                    }),
                 };
                 return styles?.control ? styles.control(merged, state) : merged;
             },
@@ -82,17 +104,28 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
                 return styles?.option ? styles.option(merged, state) : merged;
             },
             singleValue: (base, state) => {
-                const merged = { ...base, margin: 0, color: gray1200 };
+                // Match Input text color (gray.1300, inherited from body in Input).
+                // When disabled, mirror Input's _disabled color (gray.1000).
+                const merged = {
+                    ...base,
+                    margin: 0,
+                    color: state.isDisabled ? gray1000 : gray1300,
+                };
                 return styles?.singleValue
                     ? styles.singleValue(merged, state)
                     : merged;
             },
             valueContainer: (base, state) => {
+                // Zero internal padding so the visible text starts after the
+                // control's own 12px paddingLeft (matches Input's `px: 3` =
+                // 12px). react-select's default valueContainer padding is
+                // `2px 8px`, which would otherwise stack on top.
                 const merged = {
                     ...base,
                     display: 'flex',
                     alignItems: 'center',
                     textAlign: 'left',
+                    padding: 0,
                 };
                 return styles?.valueContainer
                     ? styles.valueContainer(merged, state)
@@ -105,7 +138,10 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
                     : merged;
             },
             dropdownIndicator: (base, state) => {
-                const merged = { ...base, color: gray1200 };
+                // Lighter than the body text color so the chevron doesn't
+                // visually outweigh Input's right-side icons (which are
+                // typically outline-style and read as gray.600-ish).
+                const merged = { ...base, color: gray600 };
                 return styles?.dropdownIndicator
                     ? styles.dropdownIndicator(merged, state)
                     : merged;

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

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":[null],"names":["useToken","_jsx","getControlStyles","getPlaceholderStyles","getMenuStyles","getOptionStyles"],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":[null],"names":["useToken","_jsx","getControlStyles","getPlaceholderStyles","getMenuStyles","getOptionStyles"],"mappings":"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"}

package/dist/components/Select/Select.mjs

@@ -5,8 +5,9 @@ import { useToken } from '@chakra-ui/react';
 import { getOptionStyles, getMenuStyles, getPlaceholderStyles, getControlStyles } from './Select.styles.mjs';
 
 const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
-    const [primaryColor, primaryLightest, primaryDark, dangerColor, gray50, gray300, gray400, gray500, gray600, gray1200,] = useToken('colors', [
+    const [primaryColor, primaryLighter, primaryLightest, primaryDark, dangerColor, gray50, gray300, gray400, gray500, gray600, gray1000, gray1200, gray1300,] = useToken('colors', [
         'primary.main',
+        'primary.lighter',
         'primary.extralight',
         'primary.dark',
         'danger.main',
@@ -15,7 +16,9 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
         'gray.400',
         'gray.500',
         'gray.600',
+        'gray.1000',
         'gray.1200',
+        'gray.1300',
     ]);
     const colors = {
         primaryLightest,
@@ -24,9 +27,7 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
         gray50,
         gray300,
         gray500,
-        gray600,
-        gray1200,
-    };
+        gray1200};
     // invalid prop이 true이면 variant를 'danger'로 오버라이드
     const effectiveVariant = invalid ? 'danger' : variant;
     return (jsx(ReactSelect, { closeMenuOnSelect: true, closeMenuOnScroll: true, isSearchable: false, ...rest, 
@@ -38,19 +39,40 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
                 return styles?.container ? styles.container(merged, state) : merged;
             },
             control: (base, state) => {
+                // Mirror Input.tsx: borderColor gray.400, _hover primary.lighter,
+                // _focus primary.main + 1px outline (Chakra Input recipe's
+                // `focusVisibleRing: "inside"`), _invalid danger.main,
+                // _disabled bg gray.50 / color gray.1000 / fontWeight semibold.
+                const focusOutlineColor = invalid ? dangerColor : primaryColor;
                 const merged = {
                     ...base,
                     ...getControlStyles(effectiveVariant, colors),
                     width: '100%',
-                    border: `1px solid ${invalid ? dangerColor : state.isFocused ? primaryColor : gray300}`,
+                    border: `1px solid ${invalid ? dangerColor : state.isFocused ? primaryColor : gray400}`,
                     boxShadow: 'none',
+                    outline: state.isFocused
+                        ? `1px solid ${focusOutlineColor}`
+                        : 'none',
+                    outlineOffset: 0,
+                    // react-select sets a 0.1s `transition: all` on the control,
+                    // which causes the border-color and outline (none -> solid +
+                    // transparent -> primary) to interpolate awkwardly — a brief
+                    // dark blink during focus. Disable to match Input, which
+                    // toggles its focus ring instantly via :focus-visible.
+                    transition: 'none',
                     '&:hover': {
                         borderColor: invalid
                             ? dangerColor
                             : state.isFocused
                                 ? primaryColor
-                                : gray400,
+                                : primaryLighter,
                     },
+                    ...(state.isDisabled && {
+                        backgroundColor: gray50,
+                        color: gray1000,
+                        fontWeight: 600,
+                        cursor: 'not-allowed',
+                    }),
                 };
                 return styles?.control ? styles.control(merged, state) : merged;
             },
@@ -80,17 +102,28 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
                 return styles?.option ? styles.option(merged, state) : merged;
             },
             singleValue: (base, state) => {
-                const merged = { ...base, margin: 0, color: gray1200 };
+                // Match Input text color (gray.1300, inherited from body in Input).
+                // When disabled, mirror Input's _disabled color (gray.1000).
+                const merged = {
+                    ...base,
+                    margin: 0,
+                    color: state.isDisabled ? gray1000 : gray1300,
+                };
                 return styles?.singleValue
                     ? styles.singleValue(merged, state)
                     : merged;
             },
             valueContainer: (base, state) => {
+                // Zero internal padding so the visible text starts after the
+                // control's own 12px paddingLeft (matches Input's `px: 3` =
+                // 12px). react-select's default valueContainer padding is
+                // `2px 8px`, which would otherwise stack on top.
                 const merged = {
                     ...base,
                     display: 'flex',
                     alignItems: 'center',
                     textAlign: 'left',
+                    padding: 0,
                 };
                 return styles?.valueContainer
                     ? styles.valueContainer(merged, state)
@@ -103,7 +136,10 @@ const Select = ({ variant = 'default', invalid = false, styles, ...rest }) => {
                     : merged;
             },
             dropdownIndicator: (base, state) => {
-                const merged = { ...base, color: gray1200 };
+                // Lighter than the body text color so the chevron doesn't
+                // visually outweigh Input's right-side icons (which are
+                // typically outline-style and read as gray.600-ish).
+                const merged = { ...base, color: gray600 };
                 return styles?.dropdownIndicator
                     ? styles.dropdownIndicator(merged, state)
                     : merged;

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

@@ -1 +1 @@
-{"version":3,"file":"Select.mjs","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"Select.mjs","sources":["../../../src/components/Select/Select.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;;;MAYa,MAAM,GAAG,CAIpB,EACA,OAAO,GAAG,SAAS,EACnB,OAAO,GAAG,KAAK,EACf,MAAM,EACN,GAAG,IAAI,EAC6B,KAAI;AACxC,IAAA,MAAM,CACJ,YAAY,EACZ,cAAc,EACd,eAAe,EACf,WAAW,EACX,WAAW,EACX,MAAM,EACN,OAAO,EACP,OAAO,EACP,OAAO,EACP,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,QAAQ,EACT,GAAG,QAAQ,CAAC,QAAQ,EAAE;QACrB,cAAc;QACd,iBAAiB;QACjB,oBAAoB;QACpB,cAAc;QACd,aAAa;QACb,SAAS;QACT,UAAU;QACV,UAAU;QACV,UAAU;QACV,UAAU;QACV,WAAW;QACX,WAAW;QACX,WAAW;AACZ,KAAA,CAAC;AAEF,IAAA,MAAM,MAAM,GAAiB;QAG3B,eAAe;QACf,WAAW;QACX,WAAW;QACX,MAAM;QACN,OAAO;QAEP,OAAO;QAGP,SAED;;IAGD,MAAM,gBAAgB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO;AAErD,IAAA,QACEA,GAAA,CAAC,WAAW,EAAA,EACV,iBAAiB,EAAA,IAAA,EACjB,iBAAiB,EAAA,IAAA,EACjB,YAAY,EAAE,KAAK,EAAA,GACf,IAAI;;;AAGR,QAAA,MAAM,EAAE;AACN,YAAA,SAAS,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;gBACzB,MAAM,MAAM,GAAG,EAAE,GAAG,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE;AACzC,gBAAA,OAAO,MAAM,EAAE,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,MAAM;YACrE,CAAC;AACD,YAAA,OAAO,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;;;;;gBAKvB,MAAM,iBAAiB,GAAG,OAAO,GAAG,WAAW,GAAG,YAAY;AAC9D,gBAAA,MAAM,MAAM,GAAG;AACb,oBAAA,GAAG,IAAI;AACP,oBAAA,GAAG,gBAAgB,CAAC,gBAAgB,EAAE,MAAM,CAAC;AAC7C,oBAAA,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,aACN,OAAO,GAAG,WAAW,GAAG,KAAK,CAAC,SAAS,GAAG,YAAY,GAAG,OAC3D,CAAA,CAAE;AACF,oBAAA,SAAS,EAAE,MAAM;oBACjB,OAAO,EAAE,KAAK,CAAC;0BACX,CAAA,UAAA,EAAa,iBAAiB,CAAA;AAChC,0BAAE,MAAM;AACV,oBAAA,aAAa,EAAE,CAAC;;;;;;AAMhB,oBAAA,UAAU,EAAE,MAAM;AAClB,oBAAA,SAAS,EAAE;AACT,wBAAA,WAAW,EAAE;AACX,8BAAE;8BACA,KAAK,CAAC;AACN,kCAAE;AACF,kCAAE,cAAc;AACrB,qBAAA;AACD,oBAAA,IAAI,KAAK,CAAC,UAAU,IAAI;AACtB,wBAAA,eAAe,EAAE,MAAM;AACvB,wBAAA,KAAK,EAAE,QAAQ;AACf,wBAAA,UAAU,EAAE,GAAG;AACf,wBAAA,MAAM,EAAE,aAAa;qBACtB,CAAC;iBACH;AACD,gBAAA,OAAO,MAAM,EAAE,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,MAAM;YACjE,CAAC;AACD,YAAA,WAAW,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;AAC3B,gBAAA,MAAM,MAAM,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,oBAAoB,CAAC,MAAM,CAAC,EAAE;gBAC3D,OAAO,MAAM,EAAE;sBACX,MAAM,CAAC,WAAW,CAAC,MAAM,EAAE,KAAK;sBAChC,MAAM;YACZ,CAAC;AACD,YAAA,IAAI,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;AACpB,gBAAA,MAAM,MAAM,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,aAAa,CAAC,MAAM,CAAC,EAAE;AACpD,gBAAA,OAAO,MAAM,EAAE,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,MAAM;YAC3D,CAAC;AACD,YAAA,QAAQ,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;gBACxB,MAAM,MAAM,GAAG,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE;AAC9C,gBAAA,OAAO,MAAM,EAAE,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,MAAM;YACnE,CAAC;AACD,YAAA,MAAM,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;AACtB,gBAAA,MAAM,MAAM,GAAG;AACb,oBAAA,GAAG,IAAI;AACP,oBAAA,GAAG,eAAe,CAAC;wBACjB,UAAU,EAAE,KAAK,CAAC,UAAU;wBAC5B,UAAU,EAAE,KAAK,CAAC,UAAU;wBAC5B,MAAM;qBACP,CAAC;iBACH;AACD,gBAAA,OAAO,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,MAAM;YAC/D,CAAC;AACD,YAAA,WAAW,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;;;AAG3B,gBAAA,MAAM,MAAM,GAAG;AACb,oBAAA,GAAG,IAAI;AACP,oBAAA,MAAM,EAAE,CAAC;oBACT,KAAK,EAAE,KAAK,CAAC,UAAU,GAAG,QAAQ,GAAG,QAAQ;iBAC9C;gBACD,OAAO,MAAM,EAAE;sBACX,MAAM,CAAC,WAAW,CAAC,MAAM,EAAE,KAAK;sBAChC,MAAM;YACZ,CAAC;AACD,YAAA,cAAc,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;;;;;AAK9B,gBAAA,MAAM,MAAM,GAAG;AACb,oBAAA,GAAG,IAAI;AACP,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,UAAU,EAAE,QAAQ;AACpB,oBAAA,SAAS,EAAE,MAAe;AAC1B,oBAAA,OAAO,EAAE,CAAC;iBACX;gBACD,OAAO,MAAM,EAAE;sBACX,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,KAAK;sBACnC,MAAM;YACZ,CAAC;AACD,YAAA,kBAAkB,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;gBAClC,MAAM,MAAM,GAAG,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE;gBAC3C,OAAO,MAAM,EAAE;sBACX,MAAM,CAAC,kBAAkB,CAAC,MAAM,EAAE,KAAK;sBACvC,MAAM;YACZ,CAAC;AACD,YAAA,iBAAiB,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;;;;gBAIjC,MAAM,MAAM,GAAG,EAAE,GAAG,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE;gBAC1C,OAAO,MAAM,EAAE;sBACX,MAAM,CAAC,iBAAiB,CAAC,MAAM,EAAE,KAAK;sBACtC,MAAM;YACZ,CAAC;AACD,YAAA,mBAAmB,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;AACnC,gBAAA,MAAM,MAAM,GAAG;AACb,oBAAA,GAAG,IAAI;AACP,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,UAAU,EAAE,QAAQ;iBACrB;gBACD,OAAO,MAAM,EAAE;sBACX,MAAM,CAAC,mBAAmB,CAAC,MAAM,EAAE,KAAK;sBACxC,MAAM;YACZ,CAAC;AACD,YAAA,UAAU,EAAE,CAAC,IAAI,EAAE,KAAK,KAAI;gBAC1B,MAAM,MAAM,GAAG,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE;AACxC,gBAAA,OAAO,MAAM,EAAE,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,MAAM;YACvE,CAAC;AACF,SAAA,EAAA,CACD;AAEN;;;;"}

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

@@ -1,14 +1,27 @@
 /**
  * Select component styles (Chakra v3 compatible)
  *
- * Note: These functions accept resolved color values from useToken()
- * since Chakra v3 doesn't export useTheme() hook.
+ * 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`)
  */
 export type SelectColors = Record<string, string>;
 export declare const getPlaceholderStyles: (colors: SelectColors) => {
     color: string;
     fontSize: string;
-    fontWeight: string;
+    fontWeight: number;
 };
 export declare const getMenuStyles: (colors: SelectColors) => {
     width: string;
@@ -41,19 +54,21 @@ export declare const getControlStyles: (variant: string, colors: SelectColors) =
     borderRadius: number;
     cursor: string;
     minHeight: number;
-    fontSize: number;
+    fontSize: string;
     fontWeight: number;
     paddingLeft: number;
     paddingRight: number;
+    backgroundColor: string;
 } | {
     border: string;
     boxShadow: string;
     borderRadius: number;
     cursor: string;
     minHeight: number;
-    fontSize: number;
+    fontSize: string;
     fontWeight: number;
     paddingLeft: number;
     paddingRight: number;
+    backgroundColor: string;
 };
 //# sourceMappingURL=Select.styles.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Select.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.styles.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAElD,eAAO,MAAM,oBAAoB,GAAI,QAAQ,YAAY;;;;CAIvD,CAAC;AAEH,eAAO,MAAM,aAAa,GAAI,QAAQ,YAAY;;;;;;;;;CAShD,CAAC;AAEH,eAAO,MAAM,eAAe,GAAI,qCAI7B;IACD,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;;;;;;;;;;;;CAgBC,CAAC;AAEH,eAAO,MAAM,gBAAgB,GAAI,SAAS,MAAM,EAAE,QAAQ,YAAY;;;;;;;;;;;;;;;;;;CAoBrE,CAAC"}
+{"version":3,"file":"Select.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.styles.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAElD,eAAO,MAAM,oBAAoB,GAAI,QAAQ,YAAY;;;;CAIvD,CAAC;AAEH,eAAO,MAAM,aAAa,GAAI,QAAQ,YAAY;;;;;;;;;CAShD,CAAC;AAEH,eAAO,MAAM,eAAe,GAAI,qCAI7B;IACD,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;;;;;;;;;;;;CAgBC,CAAC;AAEH,eAAO,MAAM,gBAAgB,GAAI,SAAS,MAAM,EAAE,QAAQ,YAAY;;;;;;;;;;;;;;;;;;;;CAqBrE,CAAC"}

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

@@ -4,13 +4,26 @@
 /**
  * Select component styles (Chakra v3 compatible)
  *
- * Note: These functions accept resolved color values from useToken()
- * since Chakra v3 doesn't export useTheme() hook.
+ * 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`)
  */
 const getPlaceholderStyles = (colors) => ({
-    color: colors.gray600,
-    fontSize: '14px',
-    fontWeight: 'semibold',
+    color: colors.gray500,
+    fontSize: '1em',
+    fontWeight: 500,
 });
 const getMenuStyles = (colors) => ({
     width: 'max-content',
@@ -44,10 +57,11 @@ const getControlStyles = (variant, colors) => {
         borderRadius: 6,
         cursor: 'pointer',
         minHeight: 40,
-        fontSize: 14,
-        fontWeight: 600,
-        paddingLeft: 4,
-        paddingRight: 3,
+        fontSize: '1em',
+        fontWeight: 500,
+        paddingLeft: 12,
+        paddingRight: 8,
+        backgroundColor: 'white',
     };
     if (variant === 'danger') {
         return {

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;;;;;AAKG;MAIU,oBAAoB,GAAG,CAAC,MAAoB,MAAM;IAC7D,KAAK,EAAE,MAAM,CAAC,OAAO;AACrB,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,UAAU,EAAE,UAAU;AACvB,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,EAAE;AACZ,QAAA,UAAU,EAAE,GAAG;AACf,QAAA,WAAW,EAAE,CAAC;AACd,QAAA,YAAY,EAAE,CAAC;KAChB;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;;;;;;;;;;;;;;;;;;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;;;;;;;"}

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

@@ -2,13 +2,26 @@
 /**
  * Select component styles (Chakra v3 compatible)
  *
- * Note: These functions accept resolved color values from useToken()
- * since Chakra v3 doesn't export useTheme() hook.
+ * 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`)
  */
 const getPlaceholderStyles = (colors) => ({
-    color: colors.gray600,
-    fontSize: '14px',
-    fontWeight: 'semibold',
+    color: colors.gray500,
+    fontSize: '1em',
+    fontWeight: 500,
 });
 const getMenuStyles = (colors) => ({
     width: 'max-content',
@@ -42,10 +55,11 @@ const getControlStyles = (variant, colors) => {
         borderRadius: 6,
         cursor: 'pointer',
         minHeight: 40,
-        fontSize: 14,
-        fontWeight: 600,
-        paddingLeft: 4,
-        paddingRight: 3,
+        fontSize: '1em',
+        fontWeight: 500,
+        paddingLeft: 12,
+        paddingRight: 8,
+        backgroundColor: 'white',
     };
     if (variant === 'danger') {
         return {

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;;;;;AAKG;MAIU,oBAAoB,GAAG,CAAC,MAAoB,MAAM;IAC7D,KAAK,EAAE,MAAM,CAAC,OAAO;AACrB,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,UAAU,EAAE,UAAU;AACvB,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,EAAE;AACZ,QAAA,UAAU,EAAE,GAAG;AACf,QAAA,WAAW,EAAE,CAAC;AACd,QAAA,YAAY,EAAE,CAAC;KAChB;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;;;;;;;;;;;;;;;;;;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;;;;"}

package/dist/components/Textarea/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,eAAO,MAAM,QAAQ,+GA4DpB,CAAC"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,eAAO,MAAM,QAAQ,+GA6FpB,CAAC"}

package/dist/components/Textarea/Textarea.js

@@ -4,8 +4,9 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var react = require('@chakra-ui/react');
+var mergeCss = require('../../utils/mergeCss.js');
 
-const Textarea = React.forwardRef(({ placeholder, onChange, value: propValue, _focusVisible, disabled, invalid, readOnly, ...props }, ref) => {
+const Textarea = React.forwardRef(({ placeholder, onChange, value: propValue, _focusVisible, _hover, _focus, disabled, invalid, readOnly, css, ...props }, ref) => {
     const [currentValue, setCurrentValue] = React.useState(propValue);
     React.useEffect(() => {
         setCurrentValue(propValue);
@@ -16,10 +17,18 @@ const Textarea = React.forwardRef(({ placeholder, onChange, value: propValue, _f
             onChange(e);
         }
     };
-    return (jsxRuntime.jsx(react.Textarea, { ref: ref, placeholder: placeholder, value: currentValue, onChange: handleChange, disabled: disabled, readOnly: readOnly, "data-invalid": invalid || undefined, resize: "none", borderColor: invalid ? 'danger.main' : 'gray.400', _focus: {
+    return (jsxRuntime.jsx(react.Textarea, { ref: ref, placeholder: placeholder, value: currentValue, onChange: handleChange, disabled: disabled, readOnly: readOnly, "data-invalid": invalid || undefined, resize: "none", bg: "white", 
+        // Chakra v3 `Input` outline variant declares
+        // `focusRingColor: var(--focus-color)`, but the matching
+        // `Textarea` recipe does not — so the focus ring defaults to
+        // `colorPalette.focusRing` (gray.400) and ends up visibly
+        // different from Input/Select. Mirror Input's chain explicitly.
+        focusRingColor: invalid ? 'danger.main' : 'primary.main', borderColor: invalid ? 'danger.main' : 'gray.400', _hover: {
+            borderColor: invalid ? 'danger.main' : 'primary.lighter',
+            ..._hover,
+        }, _focus: {
             borderColor: invalid ? 'danger.main' : 'primary.main',
-        }, _hover: {
-            borderColor: invalid ? 'danger.main' : 'gray.600',
+            ..._focus,
         }, _invalid: {
             borderColor: 'danger.main',
             _hover: {
@@ -28,7 +37,22 @@ const Textarea = React.forwardRef(({ placeholder, onChange, value: propValue, _f
             _focus: {
                 borderColor: 'danger.main',
             },
-        }, ...props }));
+        }, _readOnly: {
+            opacity: 1,
+            cursor: 'not-allowed',
+            bg: 'gray.50',
+            color: 'gray.600',
+            borderColor: 'gray.200',
+        }, _disabled: {
+            opacity: 1,
+            cursor: 'not-allowed',
+            bg: 'gray.50',
+            color: 'gray.1000',
+            fontWeight: 'semibold',
+        }, ...props, css: mergeCss.mergeCss({
+            '--focus-color': 'var(--chakra-colors-primary-main)',
+            '--error-color': 'var(--chakra-colors-danger-main)',
+        }, css) }));
 });
 Textarea.displayName = 'Textarea';
 

package/dist/components/Textarea/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sources":["../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":[null],"names":["forwardRef","useState","useEffect","_jsx","ChakraTextarea"],"mappings":";;;;;;;AAKO,MAAM,QAAQ,GAAGA,gBAAU,CAChC,CACE,EACE,WAAW,EACX,QAAQ,EACR,KAAK,EAAE,SAAS,EAChB,aAAa,EACb,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,KACD;IACF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAGC,cAAQ,CAE9C,SAAS,CAAC;IAEZC,eAAS,CAAC,MAAK;QACb,eAAe,CAAC,SAAS,CAAC;AAC5B,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAEf,IAAA,MAAM,YAAY,GAAG,CAAC,CAAmC,KAAI;AAC3D,QAAA,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAE/B,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,CAAC,CAAC;QACb;AACF,IAAA,CAAC;IAED,QACEC,eAACC,cAAc,EAAA,EACb,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,kBACJ,OAAO,IAAI,SAAS,EAClC,MAAM,EAAC,MAAM,EACb,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,UAAU,EACjD,MAAM,EAAE;YACN,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,cAAc;AACtD,SAAA,EACD,MAAM,EAAE;YACN,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,UAAU;AAClD,SAAA,EACD,QAAQ,EAAE;AACR,YAAA,WAAW,EAAE,aAAa;AAC1B,YAAA,MAAM,EAAE;AACN,gBAAA,WAAW,EAAE,aAAa;AAC3B,aAAA;AACD,YAAA,MAAM,EAAE;AACN,gBAAA,WAAW,EAAE,aAAa;AAC3B,aAAA;SACF,EAAA,GACG,KAAK,EAAA,CACT;AAEN,CAAC;AAGH,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
+{"version":3,"file":"Textarea.js","sources":["../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":[null],"names":["forwardRef","useState","useEffect","_jsx","ChakraTextarea","mergeCss"],"mappings":";;;;;;;;AAOO,MAAM,QAAQ,GAAGA,gBAAU,CAChC,CACE,EACE,WAAW,EACX,QAAQ,EACR,KAAK,EAAE,SAAS,EAChB,aAAa,EACb,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EACD,GAAG,KACD;IACF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAGC,cAAQ,CAE9C,SAAS,CAAC;IAEZC,eAAS,CAAC,MAAK;QACb,eAAe,CAAC,SAAS,CAAC;AAC5B,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAEf,IAAA,MAAM,YAAY,GAAG,CAAC,CAAmC,KAAI;AAC3D,QAAA,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAE/B,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,CAAC,CAAC;QACb;AACF,IAAA,CAAC;AAED,IAAA,QACEC,cAAA,CAACC,cAAc,EAAA,EACb,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,OAAO,IAAI,SAAS,EAClC,MAAM,EAAC,MAAM,EACb,EAAE,EAAC,OAAO;;;;;;QAMV,cAAc,EAAE,OAAO,GAAG,aAAa,GAAG,cAAc,EACxD,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,UAAU,EACjD,MAAM,EAAE;YACN,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,iBAAiB;AACxD,YAAA,GAAG,MAAM;AACV,SAAA,EACD,MAAM,EAAE;YACN,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,cAAc;AACrD,YAAA,GAAG,MAAM;AACV,SAAA,EACD,QAAQ,EAAE;AACR,YAAA,WAAW,EAAE,aAAa;AAC1B,YAAA,MAAM,EAAE;AACN,gBAAA,WAAW,EAAE,aAAa;AAC3B,aAAA;AACD,YAAA,MAAM,EAAE;AACN,gBAAA,WAAW,EAAE,aAAa;AAC3B,aAAA;AACF,SAAA,EACD,SAAS,EAAE;AACT,YAAA,OAAO,EAAE,CAAC;AACV,YAAA,MAAM,EAAE,aAAa;AACrB,YAAA,EAAE,EAAE,SAAS;AACb,YAAA,KAAK,EAAE,UAAU;AACjB,YAAA,WAAW,EAAE,UAAU;AACxB,SAAA,EACD,SAAS,EAAE;AACT,YAAA,OAAO,EAAE,CAAC;AACV,YAAA,MAAM,EAAE,aAAa;AACrB,YAAA,EAAE,EAAE,SAAS;AACb,YAAA,KAAK,EAAE,WAAW;AAClB,YAAA,UAAU,EAAE,UAAU;AACvB,SAAA,EAAA,GACG,KAAK,EACT,GAAG,EAAEC,iBAAQ,CACX;AACE,YAAA,eAAe,EAAE,mCAAmC;AACpD,YAAA,eAAe,EAAE,kCAAkC;AACpD,SAAA,EACD,GAAG,CACJ,EAAA,CACD;AAEN,CAAC;AAGH,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}

package/dist/components/Textarea/Textarea.mjs

@@ -2,8 +2,9 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useState, useEffect } from 'react';
 import { Textarea as Textarea$1 } from '@chakra-ui/react';
+import { mergeCss } from '../../utils/mergeCss.mjs';
 
-const Textarea = forwardRef(({ placeholder, onChange, value: propValue, _focusVisible, disabled, invalid, readOnly, ...props }, ref) => {
+const Textarea = forwardRef(({ placeholder, onChange, value: propValue, _focusVisible, _hover, _focus, disabled, invalid, readOnly, css, ...props }, ref) => {
     const [currentValue, setCurrentValue] = useState(propValue);
     useEffect(() => {
         setCurrentValue(propValue);
@@ -14,10 +15,18 @@ const Textarea = forwardRef(({ placeholder, onChange, value: propValue, _focusVi
             onChange(e);
         }
     };
-    return (jsx(Textarea$1, { ref: ref, placeholder: placeholder, value: currentValue, onChange: handleChange, disabled: disabled, readOnly: readOnly, "data-invalid": invalid || undefined, resize: "none", borderColor: invalid ? 'danger.main' : 'gray.400', _focus: {
+    return (jsx(Textarea$1, { ref: ref, placeholder: placeholder, value: currentValue, onChange: handleChange, disabled: disabled, readOnly: readOnly, "data-invalid": invalid || undefined, resize: "none", bg: "white", 
+        // Chakra v3 `Input` outline variant declares
+        // `focusRingColor: var(--focus-color)`, but the matching
+        // `Textarea` recipe does not — so the focus ring defaults to
+        // `colorPalette.focusRing` (gray.400) and ends up visibly
+        // different from Input/Select. Mirror Input's chain explicitly.
+        focusRingColor: invalid ? 'danger.main' : 'primary.main', borderColor: invalid ? 'danger.main' : 'gray.400', _hover: {
+            borderColor: invalid ? 'danger.main' : 'primary.lighter',
+            ..._hover,
+        }, _focus: {
             borderColor: invalid ? 'danger.main' : 'primary.main',
-        }, _hover: {
-            borderColor: invalid ? 'danger.main' : 'gray.600',
+            ..._focus,
         }, _invalid: {
             borderColor: 'danger.main',
             _hover: {
@@ -26,7 +35,22 @@ const Textarea = forwardRef(({ placeholder, onChange, value: propValue, _focusVi
             _focus: {
                 borderColor: 'danger.main',
             },
-        }, ...props }));
+        }, _readOnly: {
+            opacity: 1,
+            cursor: 'not-allowed',
+            bg: 'gray.50',
+            color: 'gray.600',
+            borderColor: 'gray.200',
+        }, _disabled: {
+            opacity: 1,
+            cursor: 'not-allowed',
+            bg: 'gray.50',
+            color: 'gray.1000',
+            fontWeight: 'semibold',
+        }, ...props, css: mergeCss({
+            '--focus-color': 'var(--chakra-colors-primary-main)',
+            '--error-color': 'var(--chakra-colors-danger-main)',
+        }, css) }));
 });
 Textarea.displayName = 'Textarea';
 

package/dist/components/Textarea/Textarea.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.mjs","sources":["../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraTextarea"],"mappings":";;;;;AAKO,MAAM,QAAQ,GAAG,UAAU,CAChC,CACE,EACE,WAAW,EACX,QAAQ,EACR,KAAK,EAAE,SAAS,EAChB,aAAa,EACb,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,KACD;IACF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAE9C,SAAS,CAAC;IAEZ,SAAS,CAAC,MAAK;QACb,eAAe,CAAC,SAAS,CAAC;AAC5B,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAEf,IAAA,MAAM,YAAY,GAAG,CAAC,CAAmC,KAAI;AAC3D,QAAA,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAE/B,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,CAAC,CAAC;QACb;AACF,IAAA,CAAC;IAED,QACEA,IAACC,UAAc,EAAA,EACb,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,kBACJ,OAAO,IAAI,SAAS,EAClC,MAAM,EAAC,MAAM,EACb,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,UAAU,EACjD,MAAM,EAAE;YACN,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,cAAc;AACtD,SAAA,EACD,MAAM,EAAE;YACN,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,UAAU;AAClD,SAAA,EACD,QAAQ,EAAE;AACR,YAAA,WAAW,EAAE,aAAa;AAC1B,YAAA,MAAM,EAAE;AACN,gBAAA,WAAW,EAAE,aAAa;AAC3B,aAAA;AACD,YAAA,MAAM,EAAE;AACN,gBAAA,WAAW,EAAE,aAAa;AAC3B,aAAA;SACF,EAAA,GACG,KAAK,EAAA,CACT;AAEN,CAAC;AAGH,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
+{"version":3,"file":"Textarea.mjs","sources":["../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraTextarea"],"mappings":";;;;;;AAOO,MAAM,QAAQ,GAAG,UAAU,CAChC,CACE,EACE,WAAW,EACX,QAAQ,EACR,KAAK,EAAE,SAAS,EAChB,aAAa,EACb,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EACD,GAAG,KACD;IACF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAE9C,SAAS,CAAC;IAEZ,SAAS,CAAC,MAAK;QACb,eAAe,CAAC,SAAS,CAAC;AAC5B,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAEf,IAAA,MAAM,YAAY,GAAG,CAAC,CAAmC,KAAI;AAC3D,QAAA,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAE/B,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,CAAC,CAAC;QACb;AACF,IAAA,CAAC;AAED,IAAA,QACEA,GAAA,CAACC,UAAc,EAAA,EACb,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,OAAO,IAAI,SAAS,EAClC,MAAM,EAAC,MAAM,EACb,EAAE,EAAC,OAAO;;;;;;QAMV,cAAc,EAAE,OAAO,GAAG,aAAa,GAAG,cAAc,EACxD,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,UAAU,EACjD,MAAM,EAAE;YACN,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,iBAAiB;AACxD,YAAA,GAAG,MAAM;AACV,SAAA,EACD,MAAM,EAAE;YACN,WAAW,EAAE,OAAO,GAAG,aAAa,GAAG,cAAc;AACrD,YAAA,GAAG,MAAM;AACV,SAAA,EACD,QAAQ,EAAE;AACR,YAAA,WAAW,EAAE,aAAa;AAC1B,YAAA,MAAM,EAAE;AACN,gBAAA,WAAW,EAAE,aAAa;AAC3B,aAAA;AACD,YAAA,MAAM,EAAE;AACN,gBAAA,WAAW,EAAE,aAAa;AAC3B,aAAA;AACF,SAAA,EACD,SAAS,EAAE;AACT,YAAA,OAAO,EAAE,CAAC;AACV,YAAA,MAAM,EAAE,aAAa;AACrB,YAAA,EAAE,EAAE,SAAS;AACb,YAAA,KAAK,EAAE,UAAU;AACjB,YAAA,WAAW,EAAE,UAAU;AACxB,SAAA,EACD,SAAS,EAAE;AACT,YAAA,OAAO,EAAE,CAAC;AACV,YAAA,MAAM,EAAE,aAAa;AACrB,YAAA,EAAE,EAAE,SAAS;AACb,YAAA,KAAK,EAAE,WAAW;AAClB,YAAA,UAAU,EAAE,UAAU;AACvB,SAAA,EAAA,GACG,KAAK,EACT,GAAG,EAAE,QAAQ,CACX;AACE,YAAA,eAAe,EAAE,mCAAmC;AACpD,YAAA,eAAe,EAAE,kCAAkC;AACpD,SAAA,EACD,GAAG,CACJ,EAAA,CACD;AAEN,CAAC;AAGH,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mindlogic-ai/logician-ui",
-  "version": "3.0.0-alpha.32",
+  "version": "3.0.0-alpha.34",
   "description": "A comprehensive React design system built on Chakra UI",
   "main": "dist/index.js",
   "module": "dist/index.mjs",

package/src/components/Code/shikiAdapter.ts

@@ -25,6 +25,7 @@ export const BUNDLED_LANGUAGES: BundledLanguage[] = [
   'rust',
   'shell',
   'sql',
+  'stata',
   'toml',
   'tsx',
   'typescript',

package/src/components/Select/Comparison.stories.tsx

@@ -0,0 +1,346 @@
+import { Box, Flex, HStack, Stack, Text } from '@chakra-ui/react';
+import { Meta } from '@storybook/react';
+import { useState } from 'react';
+
+import { Button } from '../Button';
+import { FormControl } from '../FormControl';
+import { FormLabel } from '../FormLabel';
+import { IoAddOutline, IoIosMail, IoSearch } from '../Icon';
+import { Input } from '../Input';
+import { PasswordInput } from '../PasswordInput';
+import { Textarea } from '../Textarea';
+
+import { Select } from '.';
+
+/**
+ * Temporary visual comparison between Input, Select and Textarea.
+ * Used to verify the three controls share the same default look
+ * (border, hover, focus, font, padding, disabled/invalid states)
+ * and look coherent inside real form layouts.
+ *
+ * Safe to delete once the unified style is no longer being iterated on.
+ */
+const meta = {
+  title: 'Components/Select/Comparison',
+} satisfies Meta;
+
+export default meta;
+
+const sortOptions = [
+  { label: '최신순', value: 'recent' },
+  { label: '오래된순', value: 'oldest' },
+  { label: '이름순', value: 'name' },
+];
+
+const categoryOptions = [
+  { label: '전체', value: 'all' },
+  { label: '비즈니스', value: 'business' },
+  { label: '교육', value: 'education' },
+  { label: '엔터테인먼트', value: 'entertainment' },
+];
+
+const roleOptions = [
+  { label: '관리자', value: 'admin' },
+  { label: '편집자', value: 'editor' },
+  { label: '뷰어', value: 'viewer' },
+];
+
+const countryOptions = [
+  { label: '대한민국', value: 'KR' },
+  { label: '미국', value: 'US' },
+  { label: '일본', value: 'JP' },
+  { label: '독일', value: 'DE' },
+];
+
+/**
+ * Component-level diff: every Input / Select / Textarea state side-by-side.
+ */
+export const SideBySide = () => {
+  const [text, setText] = useState('');
+  const [note, setNote] = useState('');
+
+  return (
+    <Stack gap={6} width="400px">
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Input — placeholder
+        </Text>
+        <Input
+          placeholder="Placeholder text"
+          value={text}
+          onChange={e => setText(e.target.value)}
+        />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Select — placeholder
+        </Text>
+        <Select options={categoryOptions} placeholder="Placeholder text" />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Textarea — placeholder
+        </Text>
+        <Textarea
+          placeholder="Placeholder text"
+          value={note}
+          onChange={e => setNote(e.target.value)}
+        />
+      </Box>
+
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Input — with value
+        </Text>
+        <Input defaultValue="Some value" />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Select — with value
+        </Text>
+        <Select options={categoryOptions} defaultValue={categoryOptions[0]} />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Textarea — with value
+        </Text>
+        <Textarea defaultValue="Some value" />
+      </Box>
+
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Input — invalid
+        </Text>
+        <Input placeholder="Invalid input" invalid />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Select — invalid
+        </Text>
+        <Select options={categoryOptions} placeholder="Invalid select" invalid />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Textarea — invalid
+        </Text>
+        <Textarea placeholder="Invalid textarea" invalid />
+      </Box>
+
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Input — disabled
+        </Text>
+        <Input disabled defaultValue="Disabled" />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Select — disabled
+        </Text>
+        <Select
+          options={categoryOptions}
+          defaultValue={categoryOptions[0]}
+          isDisabled
+        />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Textarea — disabled
+        </Text>
+        <Textarea disabled defaultValue="Disabled" />
+      </Box>
+
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Input — readOnly
+        </Text>
+        <Input readOnly defaultValue="Read only" />
+      </Box>
+      <Box>
+        <Text mb={1} fontSize="sm" fontWeight="medium">
+          Textarea — readOnly
+        </Text>
+        <Textarea readOnly defaultValue="Read only" />
+      </Box>
+    </Stack>
+  );
+};
+
+/**
+ * factchat 챗봇 목록 페이지의 상단 toolbar 패턴.
+ * 검색 Input + 카테고리 Select + 정렬 Select + 새 챗봇 Button 이 가로로
+ * 한 줄에 배치되는 케이스 — 높이와 border 두께가 어긋나면 가장 눈에
+ * 잘 띄는 레이아웃입니다.
+ */
+export const ChatbotListToolbar = () => {
+  const [query, setQuery] = useState('');
+
+  return (
+    <Box width="100%" maxW="1200px">
+      <HStack gap={3}>
+        <Box flex={1}>
+          <Input
+            leftIcon={<IoSearch color="gray.500" />}
+            placeholder="챗봇 검색..."
+            value={query}
+            onChange={e => setQuery(e.target.value)}
+          />
+        </Box>
+        <Box w="160px">
+          <Select options={categoryOptions} defaultValue={categoryOptions[0]} />
+        </Box>
+        <Box w="160px">
+          <Select options={sortOptions} defaultValue={sortOptions[0]} />
+        </Box>
+        <Button colorPalette="primary" variant="solid">
+          <IoAddOutline />새 챗봇
+        </Button>
+      </HStack>
+    </Box>
+  );
+};
+
+/**
+ * 회원가입 폼 — Input, Select, Textarea 가 라벨과 함께 세로로 쌓이는
+ * 케이스. 라벨/필드 정렬, 좌측 padding, 폰트 두께가 모두 일관되어야
+ * 합니다.
+ */
+export const SignUpForm = () => {
+  const [email, setEmail] = useState('');
+  const [name, setName] = useState('');
+  const [bio, setBio] = useState('');
+
+  return (
+    <Box width="400px">
+      <Text fontSize="xl" fontWeight="bold" mb={6}>
+        회원가입
+      </Text>
+      <Stack gap={4}>
+        <FormControl>
+          <FormLabel>이메일</FormLabel>
+          <Input
+            leftIcon={<IoIosMail color="gray.500" />}
+            placeholder="name@example.com"
+            type="email"
+            value={email}
+            onChange={e => setEmail(e.target.value)}
+          />
+        </FormControl>
+        <FormControl>
+          <FormLabel>이름</FormLabel>
+          <Input
+            placeholder="홍길동"
+            value={name}
+            onChange={e => setName(e.target.value)}
+          />
+        </FormControl>
+        <FormControl>
+          <FormLabel>비밀번호</FormLabel>
+          <PasswordInput placeholder="8자 이상 입력해주세요" />
+        </FormControl>
+        <FormControl>
+          <FormLabel>역할</FormLabel>
+          <Select options={roleOptions} placeholder="역할을 선택하세요" />
+        </FormControl>
+        <FormControl>
+          <FormLabel>국가</FormLabel>
+          <Select options={countryOptions} placeholder="국가를 선택하세요" />
+        </FormControl>
+        <FormControl>
+          <FormLabel>자기소개</FormLabel>
+          <Textarea
+            placeholder="간단한 자기소개를 입력해주세요"
+            rows={3}
+            value={bio}
+            onChange={e => setBio(e.target.value)}
+          />
+        </FormControl>
+        <Button colorPalette="primary" variant="solid" mt={2}>
+          가입하기
+        </Button>
+      </Stack>
+    </Box>
+  );
+};
+
+/**
+ * factchat audit-logs 페이지 풍의 필터바.
+ * Select 3개가 가로로 늘어서 있고, 그 옆에 검색 Input 이 함께 있는
+ * 패턴 — 모든 컨트롤이 같은 baseline / 높이로 떨어져야 합니다.
+ */
+export const AdminFilterBar = () => {
+  const statusOptions = [
+    { label: '전체 상태', value: 'all' },
+    { label: '성공', value: 'success' },
+    { label: '실패', value: 'failed' },
+  ];
+  const actorOptions = [
+    { label: '전체 사용자', value: 'all' },
+    { label: '관리자', value: 'admin' },
+    { label: '일반 사용자', value: 'user' },
+  ];
+  const periodOptions = [
+    { label: '최근 7일', value: '7d' },
+    { label: '최근 30일', value: '30d' },
+    { label: '최근 90일', value: '90d' },
+  ];
+
+  return (
+    <Box width="100%" maxW="1100px">
+      <Flex gap={3} flexWrap="wrap" align="center">
+        <Box w="180px">
+          <Select options={periodOptions} defaultValue={periodOptions[0]} />
+        </Box>
+        <Box w="180px">
+          <Select options={statusOptions} defaultValue={statusOptions[0]} />
+        </Box>
+        <Box w="180px">
+          <Select options={actorOptions} defaultValue={actorOptions[0]} />
+        </Box>
+        <Box flex={1} minW="240px">
+          <Input
+            leftIcon={<IoSearch color="gray.500" />}
+            placeholder="로그 메시지 검색"
+          />
+        </Box>
+        <Button colorPalette="neutral" variant="outline">
+          내보내기
+        </Button>
+      </Flex>
+    </Box>
+  );
+};
+
+/**
+ * 한 row 안에 Input 과 Select 가 인라인으로 섞이는 케이스 — 예를 들어
+ * 파라미터 편집 폼에서 "필드명" + "타입" + "기본값" 처럼 늘어서는
+ * 케이스. baseline 정렬 검증용.
+ */
+export const InlineFieldRow = () => {
+  const typeOptions = [
+    { label: 'String', value: 'string' },
+    { label: 'Number', value: 'number' },
+    { label: 'Boolean', value: 'boolean' },
+  ];
+
+  return (
+    <Box width="100%" maxW="900px">
+      <Text fontSize="sm" fontWeight="medium" mb={2}>
+        파라미터 추가
+      </Text>
+      <HStack gap={3} align="flex-start">
+        <Box flex={2}>
+          <Input placeholder="필드명" />
+        </Box>
+        <Box flex={1}>
+          <Select options={typeOptions} defaultValue={typeOptions[0]} />
+        </Box>
+        <Box flex={2}>
+          <Input placeholder="기본값" />
+        </Box>
+        <Button colorPalette="primary" variant="solid">
+          추가
+        </Button>
+      </HStack>
+    </Box>
+  );
+};

package/src/components/Select/Select.styles.ts

@@ -1,16 +1,29 @@
 /**
  * Select component styles (Chakra v3 compatible)
  *
- * Note: These functions accept resolved color values from useToken()
- * since Chakra v3 doesn't export useTheme() hook.
+ * 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`)
  */
 
 export type SelectColors = Record<string, string>;
 
 export const getPlaceholderStyles = (colors: SelectColors) => ({
-  color: colors.gray600,
-  fontSize: '14px',
-  fontWeight: 'semibold',
+  color: colors.gray500,
+  fontSize: '1em',
+  fontWeight: 500,
 });
 
 export const getMenuStyles = (colors: SelectColors) => ({
@@ -55,10 +68,11 @@ export const getControlStyles = (variant: string, colors: SelectColors) => {
     borderRadius: 6,
     cursor: 'pointer',
     minHeight: 40,
-    fontSize: 14,
-    fontWeight: 600,
-    paddingLeft: 4,
-    paddingRight: 3,
+    fontSize: '1em',
+    fontWeight: 500,
+    paddingLeft: 12,
+    paddingRight: 8,
+    backgroundColor: 'white',
   };
 
   if (variant === 'danger') {

package/src/components/Select/Select.tsx

@@ -22,6 +22,7 @@ export const Select = <
 }: SelectProps<Option, IsMulti, Group>) => {
   const [
     primaryColor,
+    primaryLighter,
     primaryLightest,
     primaryDark,
     dangerColor,
@@ -30,9 +31,12 @@ export const Select = <
     gray400,
     gray500,
     gray600,
+    gray1000,
     gray1200,
+    gray1300,
   ] = useToken('colors', [
     'primary.main',
+    'primary.lighter',
     'primary.extralight',
     'primary.dark',
     'danger.main',
@@ -41,11 +45,14 @@ export const Select = <
     'gray.400',
     'gray.500',
     'gray.600',
+    'gray.1000',
     'gray.1200',
+    'gray.1300',
   ]);
 
   const colors: SelectColors = {
     primaryColor,
+    primaryLighter,
     primaryLightest,
     primaryDark,
     dangerColor,
@@ -54,7 +61,9 @@ export const Select = <
     gray400,
     gray500,
     gray600,
+    gray1000,
     gray1200,
+    gray1300,
   };
 
   // invalid prop이 true이면 variant를 'danger'로 오버라이드
@@ -74,21 +83,42 @@ export const Select = <
           return styles?.container ? styles.container(merged, state) : merged;
         },
         control: (base, state) => {
+          // Mirror Input.tsx: borderColor gray.400, _hover primary.lighter,
+          // _focus primary.main + 1px outline (Chakra Input recipe's
+          // `focusVisibleRing: "inside"`), _invalid danger.main,
+          // _disabled bg gray.50 / color gray.1000 / fontWeight semibold.
+          const focusOutlineColor = invalid ? dangerColor : primaryColor;
           const merged = {
             ...base,
             ...getControlStyles(effectiveVariant, colors),
             width: '100%',
             border: `1px solid ${
-              invalid ? dangerColor : state.isFocused ? primaryColor : gray300
+              invalid ? dangerColor : state.isFocused ? primaryColor : gray400
             }`,
             boxShadow: 'none',
+            outline: state.isFocused
+              ? `1px solid ${focusOutlineColor}`
+              : 'none',
+            outlineOffset: 0,
+            // react-select sets a 0.1s `transition: all` on the control,
+            // which causes the border-color and outline (none -> solid +
+            // transparent -> primary) to interpolate awkwardly — a brief
+            // dark blink during focus. Disable to match Input, which
+            // toggles its focus ring instantly via :focus-visible.
+            transition: 'none',
             '&:hover': {
               borderColor: invalid
                 ? dangerColor
                 : state.isFocused
                   ? primaryColor
-                  : gray400,
+                  : primaryLighter,
             },
+            ...(state.isDisabled && {
+              backgroundColor: gray50,
+              color: gray1000,
+              fontWeight: 600,
+              cursor: 'not-allowed',
+            }),
           };
           return styles?.control ? styles.control(merged, state) : merged;
         },
@@ -118,17 +148,28 @@ export const Select = <
           return styles?.option ? styles.option(merged, state) : merged;
         },
         singleValue: (base, state) => {
-          const merged = { ...base, margin: 0, color: gray1200 };
+          // Match Input text color (gray.1300, inherited from body in Input).
+          // When disabled, mirror Input's _disabled color (gray.1000).
+          const merged = {
+            ...base,
+            margin: 0,
+            color: state.isDisabled ? gray1000 : gray1300,
+          };
           return styles?.singleValue
             ? styles.singleValue(merged, state)
             : merged;
         },
         valueContainer: (base, state) => {
+          // Zero internal padding so the visible text starts after the
+          // control's own 12px paddingLeft (matches Input's `px: 3` =
+          // 12px). react-select's default valueContainer padding is
+          // `2px 8px`, which would otherwise stack on top.
           const merged = {
             ...base,
             display: 'flex',
             alignItems: 'center',
             textAlign: 'left' as const,
+            padding: 0,
           };
           return styles?.valueContainer
             ? styles.valueContainer(merged, state)
@@ -141,7 +182,10 @@ export const Select = <
             : merged;
         },
         dropdownIndicator: (base, state) => {
-          const merged = { ...base, color: gray1200 };
+          // Lighter than the body text color so the chevron doesn't
+          // visually outweigh Input's right-side icons (which are
+          // typically outline-style and read as gray.600-ish).
+          const merged = { ...base, color: gray600 };
           return styles?.dropdownIndicator
             ? styles.dropdownIndicator(merged, state)
             : merged;

package/src/components/Textarea/Textarea.tsx

@@ -1,6 +1,8 @@
 import { ChangeEvent, forwardRef, useEffect, useState } from 'react';
 import { Textarea as ChakraTextarea } from '@chakra-ui/react';
 
+import { mergeCss } from '@/utils/mergeCss';
+
 import { TextareaProps } from './Textarea.types';
 
 export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
@@ -10,9 +12,12 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
       onChange,
       value: propValue,
       _focusVisible,
+      _hover,
+      _focus,
       disabled,
       invalid,
       readOnly,
+      css,
       ...props
     },
     ref
@@ -43,12 +48,21 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
         readOnly={readOnly}
         data-invalid={invalid || undefined}
         resize="none"
+        bg="white"
+        // Chakra v3 `Input` outline variant declares
+        // `focusRingColor: var(--focus-color)`, but the matching
+        // `Textarea` recipe does not — so the focus ring defaults to
+        // `colorPalette.focusRing` (gray.400) and ends up visibly
+        // different from Input/Select. Mirror Input's chain explicitly.
+        focusRingColor={invalid ? 'danger.main' : 'primary.main'}
         borderColor={invalid ? 'danger.main' : 'gray.400'}
+        _hover={{
+          borderColor: invalid ? 'danger.main' : 'primary.lighter',
+          ..._hover,
+        }}
         _focus={{
           borderColor: invalid ? 'danger.main' : 'primary.main',
-        }}
-        _hover={{
-          borderColor: invalid ? 'danger.main' : 'gray.600',
+          ..._focus,
         }}
         _invalid={{
           borderColor: 'danger.main',
@@ -59,7 +73,28 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
             borderColor: 'danger.main',
           },
         }}
+        _readOnly={{
+          opacity: 1,
+          cursor: 'not-allowed',
+          bg: 'gray.50',
+          color: 'gray.600',
+          borderColor: 'gray.200',
+        }}
+        _disabled={{
+          opacity: 1,
+          cursor: 'not-allowed',
+          bg: 'gray.50',
+          color: 'gray.1000',
+          fontWeight: 'semibold',
+        }}
         {...props}
+        css={mergeCss(
+          {
+            '--focus-color': 'var(--chakra-colors-primary-main)',
+            '--error-color': 'var(--chakra-colors-danger-main)',
+          },
+          css
+        )}
       />
     );
   }