@kimdw-rtk/ui 0.0.9 → 0.0.11

package/dist/components/Select/SelectOptionList.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Select/SelectOptionList.css.ts","/home/runner/work/react-kits/react-kits/packages/ui/dist/components/Select/SelectOptionList.css.cjs"],"names":[],"mappings":"AAAA,oHAA0B;AAE1B,yCAAgC;AAChC,iCAAsB;AAEtB,MAAM,OAAA,EAAS,4BAAA;AAAU,EACvB,IAAA,EAAM;AAAA,IACJ,SAAA,EAAW,aAAA;AAAA,IACX,OAAA,EAAS;AAAA,EACX,CAAA;AAAA,EAEA,MAAA,EAAQ;AAAA,IACN,SAAA,EAAW,UAAA;AAAA,IACX,OAAA,EAAS;AAAA,EACX;AACF,CAAC,CAAA;AAEM,MAAM,UAAA,EAAY,yCAAA;AAAgB,EACvC,IAAA,EAAM;AAAA,IACJ,SAAA,EAAW,MAAA;AAAA,IACX,QAAA,EAAU,UAAA;AAAA,IACV,MAAA,EAAQ,IAAA;AAAA,IAER,KAAA,EAAO,MAAA;AAAA,IACP,QAAA,EAAU,aAAA;AAAA,IACV,MAAA,EAAQ,CAAA,cAAA,EAAiB,aAAA,CAAM,KAAA,CAAM,MAAM,CAAA,CAAA,CAAA;AAAA,IAC3C,YAAA,EAAc,aAAA,CAAM,YAAA;AAAA,IACpB,MAAA,EAAQ,UAAA;AAAA,IAER,eAAA,EAAiB,CAAA,IAAA,EAAO,aAAA,CAAM,KAAA,CAAM,UAAU,CAAA,CAAA,CAAA;AAAA,IAE9C,SAAA,EAAW,CAAA,EAAA;AACX,IAAA;AAEY,IAAA;AAEZ,IAAA;AACS,MAAA;AACC,MAAA;AACV,IAAA;AAEA,IAAA;AACE,MAAA;AAEA,MAAA;AACF,IAAA;AACF,EAAA;AAEU,EAAA;AACG,IAAA;AACH,MAAA;AACJ,QAAA;AACF,MAAA;AACO,MAAA;AACL,QAAA;AACF,MAAA;AACF,IAAA;AAES,IAAA;AACD,MAAA;AACC,QAAA;AACP,MAAA;AACO,MAAA;AACG,QAAA;AACV,MAAA;AACF,IAAA;AACF,EAAA;AACD;ACZe;AACA;AACA","file":"/home/runner/work/react-kits/react-kits/packages/ui/dist/components/Select/SelectOptionList.css.cjs","sourcesContent":["import { keyframes } from '@vanilla-extract/css';\n\nimport { recipeWithLayer } from '#styleUtils';\nimport { theme } from '#themes';\n\nconst fadeIn = keyframes({\n  '0%': {\n    transform: 'scale(0.95)',\n    opacity: 0,\n  },\n\n  '100%': {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n});\n\nexport const container = recipeWithLayer({\n  base: {\n    overflowY: 'auto',\n    position: 'absolute',\n    zIndex: '10',\n\n    width: '100%',\n    minWidth: 'max-content',\n    border: `1px solid rgb(${theme.color.border})`,\n    borderRadius: theme.borderRadius,\n    margin: '0.5rem 0',\n\n    backgroundColor: `rgb(${theme.color.background})`,\n\n    animation: `${fadeIn} 0.3s ease 1`,\n    transformOrigin: '0 0',\n\n    userSelect: 'none',\n\n    '::-webkit-scrollbar': {\n      width: '0.25rem',\n      height: '0.25rem',\n    },\n\n    '::-webkit-scrollbar-thumb': {\n      borderRadius: '0.5rem',\n\n      backgroundColor: `rgb(${theme.color['muted-foreground']})`,\n    },\n  },\n\n  variants: {\n    isVisible: {\n      true: {\n        display: 'block',\n      },\n      false: {\n        display: 'none',\n      },\n    },\n\n    isAbove: {\n      true: {\n        top: '100%',\n      },\n      false: {\n        bottom: '100%',\n      },\n    },\n  },\n});\n",null]}

package/dist/components/Select/SelectOptionList.css.d.cts

@@ -0,0 +1,22 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+
+declare const container: _vanilla_extract_recipes.RuntimeFn<{
+    isVisible: {
+        true: {
+            display: "block";
+        };
+        false: {
+            display: "none";
+        };
+    };
+    isAbove: {
+        true: {
+            top: "100%";
+        };
+        false: {
+            bottom: "100%";
+        };
+    };
+}>;
+
+export { container };

package/dist/components/Select/SelectOptionList.css.d.ts

@@ -1,4 +1,6 @@
-export declare const container: import("@vanilla-extract/recipes").RuntimeFn<{
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+
+declare const container: _vanilla_extract_recipes.RuntimeFn<{
     isVisible: {
         true: {
             display: "block";
@@ -16,4 +18,5 @@ export declare const container: import("@vanilla-extract/recipes").RuntimeFn<{
         };
     };
 }>;
-//# sourceMappingURL=SelectOptionList.css.d.ts.map
+
+export { container };

package/dist/components/Select/SelectOptionList.css.js

@@ -1,58 +1,59 @@
-import { keyframes } from '../../node_modules/.pnpm/@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.esm.js';
-import { recipeWithLayer } from '../../utils/styleUtils.css.js';
-import { theme } from '../../themes/theme.css.js';
-
+import { keyframes } from "@vanilla-extract/css";
+import { recipeWithLayer } from "#styleUtils";
+import { theme } from "#themes";
 const fadeIn = keyframes({
-    '0%': {
-        transform: 'scale(0.95)',
-        opacity: 0,
-    },
-    '100%': {
-        transform: 'scale(1)',
-        opacity: 1,
-    },
+  "0%": {
+    transform: "scale(0.95)",
+    opacity: 0
+  },
+  "100%": {
+    transform: "scale(1)",
+    opacity: 1
+  }
 });
 const container = recipeWithLayer({
-    base: {
-        overflowY: 'auto',
-        position: 'absolute',
-        zIndex: '10',
-        width: '100%',
-        minWidth: 'max-content',
-        border: `1px solid rgb(${theme.color.border})`,
-        borderRadius: theme.borderRadius,
-        margin: '0.5rem 0',
-        backgroundColor: `rgb(${theme.color.background})`,
-        animation: `${fadeIn} 0.3s ease 1`,
-        transformOrigin: '0 0',
-        userSelect: 'none',
-        '::-webkit-scrollbar': {
-            width: '0.25rem',
-            height: '0.25rem',
-        },
-        '::-webkit-scrollbar-thumb': {
-            borderRadius: '0.5rem',
-            backgroundColor: `rgb(${theme.color['muted-foreground']})`,
-        },
+  base: {
+    overflowY: "auto",
+    position: "absolute",
+    zIndex: "10",
+    width: "100%",
+    minWidth: "max-content",
+    border: `1px solid rgb(${theme.color.border})`,
+    borderRadius: theme.borderRadius,
+    margin: "0.5rem 0",
+    backgroundColor: `rgb(${theme.color.background})`,
+    animation: `${fadeIn} 0.3s ease 1`,
+    transformOrigin: "0 0",
+    userSelect: "none",
+    "::-webkit-scrollbar": {
+      width: "0.25rem",
+      height: "0.25rem"
     },
-    variants: {
-        isVisible: {
-            true: {
-                display: 'block',
-            },
-            false: {
-                display: 'none',
-            },
-        },
-        isAbove: {
-            true: {
-                top: '100%',
-            },
-            false: {
-                bottom: '100%',
-            },
-        },
+    "::-webkit-scrollbar-thumb": {
+      borderRadius: "0.5rem",
+      backgroundColor: `rgb(${theme.color["muted-foreground"]})`
+    }
+  },
+  variants: {
+    isVisible: {
+      true: {
+        display: "block"
+      },
+      false: {
+        display: "none"
+      }
     },
+    isAbove: {
+      true: {
+        top: "100%"
+      },
+      false: {
+        bottom: "100%"
+      }
+    }
+  }
 });
-
-export { container };
+export {
+  container
+};
+//# sourceMappingURL=SelectOptionList.css.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Select/SelectOptionList.css.ts"],"sourcesContent":["import { keyframes } from '@vanilla-extract/css';\n\nimport { recipeWithLayer } from '#styleUtils';\nimport { theme } from '#themes';\n\nconst fadeIn = keyframes({\n  '0%': {\n    transform: 'scale(0.95)',\n    opacity: 0,\n  },\n\n  '100%': {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n});\n\nexport const container = recipeWithLayer({\n  base: {\n    overflowY: 'auto',\n    position: 'absolute',\n    zIndex: '10',\n\n    width: '100%',\n    minWidth: 'max-content',\n    border: `1px solid rgb(${theme.color.border})`,\n    borderRadius: theme.borderRadius,\n    margin: '0.5rem 0',\n\n    backgroundColor: `rgb(${theme.color.background})`,\n\n    animation: `${fadeIn} 0.3s ease 1`,\n    transformOrigin: '0 0',\n\n    userSelect: 'none',\n\n    '::-webkit-scrollbar': {\n      width: '0.25rem',\n      height: '0.25rem',\n    },\n\n    '::-webkit-scrollbar-thumb': {\n      borderRadius: '0.5rem',\n\n      backgroundColor: `rgb(${theme.color['muted-foreground']})`,\n    },\n  },\n\n  variants: {\n    isVisible: {\n      true: {\n        display: 'block',\n      },\n      false: {\n        display: 'none',\n      },\n    },\n\n    isAbove: {\n      true: {\n        top: '100%',\n      },\n      false: {\n        bottom: '100%',\n      },\n    },\n  },\n});\n"],"mappings":"AAAA,SAAS,iBAAiB;AAE1B,SAAS,uBAAuB;AAChC,SAAS,aAAa;AAEtB,MAAM,SAAS,UAAU;AAAA,EACvB,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AAAA,EAEA,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AACF,CAAC;AAEM,MAAM,YAAY,gBAAgB;AAAA,EACvC,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,UAAU;AAAA,IACV,QAAQ;AAAA,IAER,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ,iBAAiB,MAAM,MAAM,MAAM;AAAA,IAC3C,cAAc,MAAM;AAAA,IACpB,QAAQ;AAAA,IAER,iBAAiB,OAAO,MAAM,MAAM,UAAU;AAAA,IAE9C,WAAW,GAAG,MAAM;AAAA,IACpB,iBAAiB;AAAA,IAEjB,YAAY;AAAA,IAEZ,uBAAuB;AAAA,MACrB,OAAO;AAAA,MACP,QAAQ;AAAA,IACV;AAAA,IAEA,6BAA6B;AAAA,MAC3B,cAAc;AAAA,MAEd,iBAAiB,OAAO,MAAM,MAAM,kBAAkB,CAAC;AAAA,IACzD;AAAA,EACF;AAAA,EAEA,UAAU;AAAA,IACR,WAAW;AAAA,MACT,MAAM;AAAA,QACJ,SAAS;AAAA,MACX;AAAA,MACA,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IAEA,SAAS;AAAA,MACP,MAAM;AAAA,QACJ,KAAK;AAAA,MACP;AAAA,MACA,OAAO;AAAA,QACL,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AACF,CAAC;","names":[]}

package/dist/components/Select/SelectOptionList.d.cts

@@ -0,0 +1,9 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+interface SelectOptionListProps {
+    children: ReactNode;
+}
+declare const SelectOptionList: ({ children }: SelectOptionListProps) => react_jsx_runtime.JSX.Element;
+
+export { SelectOptionList as default };

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

@@ -1,7 +1,9 @@
-import { type ReactNode } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
 interface SelectOptionListProps {
     children: ReactNode;
 }
-declare const SelectOptionList: ({ children }: SelectOptionListProps) => import("react/jsx-runtime").JSX.Element;
-export default SelectOptionList;
-//# sourceMappingURL=SelectOptionList.d.ts.map
+declare const SelectOptionList: ({ children }: SelectOptionListProps) => react_jsx_runtime.JSX.Element;
+
+export { SelectOptionList as default };

package/dist/components/Select/SelectOptionList.js

@@ -1,37 +1,45 @@
-import jsxRuntimeExports from '../../_virtual/jsx-runtime.js';
-import { useContext, useRef, useMemo } from 'react';
-import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
-import '../../styles/layers.css.js';
-import { sprinkles } from '../../styles/sprinkles.css.js';
-import '../../styles/globalStyle.css.js';
-import { SelectContext } from './SelectContext.js';
-import { container } from './SelectOptionList.css.js';
-
+import { jsx } from "react/jsx-runtime";
+import { useContext, useMemo, useRef } from "react";
+import clsx from "clsx";
+import { sprinkles } from "#styles";
+import { SelectContext } from "./SelectContext";
+import * as s from "./SelectOptionList.css";
 const SelectOptionList = ({ children }) => {
-    const selectContext = useContext(SelectContext);
-    const containerRef = useRef(null);
-    if (!selectContext) {
-        throw new Error('SelectOption must be rendered within a Select.');
+  const selectContext = useContext(SelectContext);
+  const containerRef = useRef(null);
+  if (!selectContext) {
+    throw new Error("SelectOption must be rendered within a Select.");
+  }
+  const { state } = selectContext;
+  const isAbove = useMemo(() => {
+    const container = containerRef.current;
+    const parent = state.containerRef.current;
+    if (!state.isActive || !container || !parent) {
+      return;
     }
-    const { state } = selectContext;
-    const isAbove = useMemo(() => {
-        const container = containerRef.current;
-        const parent = state.containerRef.current;
-        if (!state.isActive || !container || !parent) {
-            return;
-        }
-        const parentRect = parent.getBoundingClientRect();
-        container.style.display = 'block';
-        const containerRect = container.getBoundingClientRect();
-        container.style.display = '';
-        // 하단에 리스트를 모두 보여줄 공간이 충분한 경우
-        if (containerRect.top + containerRect.height < window.innerHeight) {
-            return true;
-        }
-        // 그렇지 않으면 parent의 상단/하단 중 공간이 더 넓은 쪽으로 리스트를 보여줌
-        return parentRect.top + parentRect.height / 2 < window.innerHeight / 2;
-    }, [state.isActive, state.containerRef]);
-    return (jsxRuntimeExports.jsx("div", { ref: containerRef, className: clsx(container({ isVisible: state.isActive, isAbove }), sprinkles({ boxShadow: 'accent-sm' })), children: children }));
+    const parentRect = parent.getBoundingClientRect();
+    container.style.display = "block";
+    const containerRect = container.getBoundingClientRect();
+    container.style.display = "";
+    if (containerRect.top + containerRect.height < window.innerHeight) {
+      return true;
+    }
+    return parentRect.top + parentRect.height / 2 < window.innerHeight / 2;
+  }, [state.isActive, state.containerRef]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: containerRef,
+      className: clsx(
+        s.container({ isVisible: state.isActive, isAbove }),
+        sprinkles({ boxShadow: "accent-sm" })
+      ),
+      children
+    }
+  );
+};
+var SelectOptionList_default = SelectOptionList;
+export {
+  SelectOptionList_default as default
 };
-
-export { SelectOptionList as default };
+//# sourceMappingURL=SelectOptionList.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Select/SelectOptionList.tsx"],"sourcesContent":["import { useContext, useMemo, useRef, type ReactNode } from 'react';\n\nimport clsx from 'clsx';\n\nimport { sprinkles } from '#styles';\n\nimport { SelectContext } from './SelectContext';\nimport * as s from './SelectOptionList.css';\n\ninterface SelectOptionListProps {\n  children: ReactNode;\n}\n\nconst SelectOptionList = ({ children }: SelectOptionListProps) => {\n  const selectContext = useContext(SelectContext);\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  if (!selectContext) {\n    throw new Error('SelectOption must be rendered within a Select.');\n  }\n\n  const { state } = selectContext;\n\n  const isAbove = useMemo(() => {\n    const container = containerRef.current;\n    const parent = state.containerRef.current;\n\n    if (!state.isActive || !container || !parent) {\n      return;\n    }\n\n    const parentRect = parent.getBoundingClientRect();\n    container.style.display = 'block';\n    const containerRect = container.getBoundingClientRect();\n    container.style.display = '';\n\n    // 하단에 리스트를 모두 보여줄 공간이 충분한 경우\n    if (containerRect.top + containerRect.height < window.innerHeight) {\n      return true;\n    }\n\n    // 그렇지 않으면 parent의 상단/하단 중 공간이 더 넓은 쪽으로 리스트를 보여줌\n    return parentRect.top + parentRect.height / 2 < window.innerHeight / 2;\n  }, [state.isActive, state.containerRef]);\n\n  return (\n    <div\n      ref={containerRef}\n      className={clsx(\n        s.container({ isVisible: state.isActive, isAbove }),\n        sprinkles({ boxShadow: 'accent-sm' }),\n      )}\n    >\n      {children}\n    </div>\n  );\n};\n\nexport default SelectOptionList;\n"],"mappings":"AA8CI;AA9CJ,SAAS,YAAY,SAAS,cAA8B;AAE5D,OAAO,UAAU;AAEjB,SAAS,iBAAiB;AAE1B,SAAS,qBAAqB;AAC9B,YAAY,OAAO;AAMnB,MAAM,mBAAmB,CAAC,EAAE,SAAS,MAA6B;AAChE,QAAM,gBAAgB,WAAW,aAAa;AAC9C,QAAM,eAAe,OAAuB,IAAI;AAEhD,MAAI,CAAC,eAAe;AAClB,UAAM,IAAI,MAAM,gDAAgD;AAAA,EAClE;AAEA,QAAM,EAAE,MAAM,IAAI;AAElB,QAAM,UAAU,QAAQ,MAAM;AAC5B,UAAM,YAAY,aAAa;AAC/B,UAAM,SAAS,MAAM,aAAa;AAElC,QAAI,CAAC,MAAM,YAAY,CAAC,aAAa,CAAC,QAAQ;AAC5C;AAAA,IACF;AAEA,UAAM,aAAa,OAAO,sBAAsB;AAChD,cAAU,MAAM,UAAU;AAC1B,UAAM,gBAAgB,UAAU,sBAAsB;AACtD,cAAU,MAAM,UAAU;AAG1B,QAAI,cAAc,MAAM,cAAc,SAAS,OAAO,aAAa;AACjE,aAAO;AAAA,IACT;AAGA,WAAO,WAAW,MAAM,WAAW,SAAS,IAAI,OAAO,cAAc;AAAA,EACvE,GAAG,CAAC,MAAM,UAAU,MAAM,YAAY,CAAC;AAEvC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW;AAAA,QACT,EAAE,UAAU,EAAE,WAAW,MAAM,UAAU,QAAQ,CAAC;AAAA,QAClD,UAAU,EAAE,WAAW,YAAY,CAAC;AAAA,MACtC;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,2BAAQ;","names":[]}

package/dist/components/Select/SelectTrigger.cjs

@@ -0,0 +1,42 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var _jsxruntime = require('react/jsx-runtime');
+var _react = require('react');
+var _clsx = require('clsx'); var _clsx2 = _interopRequireDefault(_clsx);
+var _lucidereact = require('lucide-react');
+var _styles = require('#styles');
+var _SelectContext = require('./SelectContext');
+var _SelectTriggercss = require('./SelectTrigger.css'); var s = _interopRequireWildcard(_SelectTriggercss);
+const SelectTrigger = ({
+  children,
+  className,
+  variant,
+  sx: propSx
+}) => {
+  const selectContext = _react.useContext.call(void 0, _SelectContext.SelectContext);
+  if (!selectContext) {
+    throw new Error("SelectTrigger must be rendered within a Select.");
+  }
+  const { state, dispatch } = selectContext;
+  const handleClick = () => {
+    dispatch({ type: "TOGGLE" });
+  };
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "div",
+    {
+      className: _clsx2.default.call(void 0, 
+        s.selectTrigger({ isActive: state.isActive, variant }),
+        className,
+        _styles.sx.call(void 0, propSx)
+      ),
+      onClick: handleClick,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: s.children, children }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: s.icon({ isActive: state.isActive }), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ChevronDownIcon, { size: "1em", strokeWidth: "2px" }) })
+      ]
+    }
+  );
+};
+var SelectTrigger_default = SelectTrigger;
+
+
+exports.default = SelectTrigger_default;
+//# sourceMappingURL=SelectTrigger.cjs.map

package/dist/components/Select/SelectTrigger.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Select/SelectTrigger.tsx","/home/runner/work/react-kits/react-kits/packages/ui/dist/components/Select/SelectTrigger.cjs"],"names":[],"mappings":"AAgCI,0eAAA;AAhCJ,8BAA2B;AAE3B,wEAAiB;AACjB,2CAAgC;AAEhC,iCAAmB;AAGnB,gDAA8B;AAC9B,2GAAmB;AAInB,MAAM,cAAA,EAAgB,CAAC;AAAA,EACrB,QAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,EAAA,EAAI;AACN,CAAA,EAAA,GAA0B;AACxB,EAAA,MAAM,cAAA,EAAgB,+BAAA,4BAAwB,CAAA;AAE9C,EAAA,GAAA,CAAI,CAAC,aAAA,EAAe;AAClB,IAAA,MAAM,IAAI,KAAA,CAAM,iDAAiD,CAAA;AAAA,EACnE;AAEA,EAAA,MAAM,EAAE,KAAA,EAAO,SAAS,EAAA,EAAI,aAAA;AAE5B,EAAA,MAAM,YAAA,EAAc,CAAA,EAAA,GAAM;AACxB,IAAA,QAAA,CAAS,EAAE,IAAA,EAAM,SAAS,CAAC,CAAA;AAAA,EAC7B,CAAA;AAEA,EAAA,uBACE,8BAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,4BAAA;AAAA,QACT,CAAA,CAAE,aAAA,CAAc,EAAE,QAAA,EAAU,KAAA,CAAM,QAAA,EAAU,QAAQ,CAAC,CAAA;AAAA,QACrD,SAAA;AAAA,QACA,wBAAA,MAAS;AAAA,MACX,CAAA;AAAA,MACA,OAAA,EAAS,WAAA;AAAA,MAET,QAAA,EAAA;AAAA,wBAAA,6BAAA,MAAC,EAAA,EAAK,SAAA,EAAW,CAAA,CAAE,QAAA,EAAW,SAAA,CAAS,CAAA;AAAA,wBACvC,6BAAA,MAAC,EAAA,EAAK,SAAA,EAAW,CAAA,CAAE,IAAA,CAAK,EAAE,QAAA,EAAU,KAAA,CAAM,SAAS,CAAC,CAAA,EAClD,QAAA,kBAAA,6BAAA,4BAAC,EAAA,EAAgB,IAAA,EAAK,KAAA,EAAM,WAAA,EAAY,MAAA,CAAM,EAAA,CAChD;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,CAAA;AAEJ,CAAA;AAEA,IAAO,sBAAA,EAAQ,aAAA;ACVf;AACE;AACF,wCAAC","file":"/home/runner/work/react-kits/react-kits/packages/ui/dist/components/Select/SelectTrigger.cjs","sourcesContent":["import { useContext } from 'react';\n\nimport clsx from 'clsx';\nimport { ChevronDownIcon } from 'lucide-react';\n\nimport { sx } from '#styles';\nimport type { UIComponent } from '#types';\n\nimport { SelectContext } from './SelectContext';\nimport * as s from './SelectTrigger.css';\n\ntype SelectTriggerProps = UIComponent<'div', typeof s.selectTrigger>;\n\nconst SelectTrigger = ({\n  children,\n  className,\n  variant,\n  sx: propSx,\n}: SelectTriggerProps) => {\n  const selectContext = useContext(SelectContext);\n\n  if (!selectContext) {\n    throw new Error('SelectTrigger must be rendered within a Select.');\n  }\n\n  const { state, dispatch } = selectContext;\n\n  const handleClick = () => {\n    dispatch({ type: 'TOGGLE' });\n  };\n\n  return (\n    <div\n      className={clsx(\n        s.selectTrigger({ isActive: state.isActive, variant }),\n        className,\n        sx(propSx),\n      )}\n      onClick={handleClick}\n    >\n      <span className={s.children}>{children}</span>\n      <span className={s.icon({ isActive: state.isActive })}>\n        <ChevronDownIcon size=\"1em\" strokeWidth=\"2px\" />\n      </span>\n    </div>\n  );\n};\n\nexport default SelectTrigger;\n",null]}

package/dist/components/Select/SelectTrigger.css.cjs

@@ -0,0 +1,65 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});var _css = require('@vanilla-extract/css');
+var _recipes = require('@vanilla-extract/recipes');
+var _themes = require('#themes');
+const children = _css.style.call(void 0, {
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  whiteSpace: "nowrap"
+});
+const icon = _recipes.recipe.call(void 0, {
+  base: {
+    flexShrink: "0",
+    lineHeight: "0",
+    transition: "color 0.2s ease, transform 0.2s ease"
+  },
+  variants: {
+    isActive: {
+      false: {
+        transform: "rotate(0)"
+      },
+      true: {
+        color: `rgb(${_themes.theme.color.primary})`,
+        transform: "rotate(-180deg)"
+      }
+    }
+  }
+});
+const selectTrigger = _recipes.recipe.call(void 0, {
+  base: {
+    display: "flex",
+    alignItems: "center",
+    gap: "0.5em",
+    justifyContent: "space-between",
+    width: "100%",
+    transition: "border-color 0.2s ease",
+    cursor: "pointer",
+    userSelect: "none"
+  },
+  variants: {
+    isActive: {
+      true: {
+        borderColor: `rgb(${_themes.theme.color.primary})`
+      }
+    },
+    variant: {
+      contained: {
+        padding: "0.75em 0.75em",
+        borderRadius: _themes.theme.borderRadius,
+        backgroundColor: `rgb(${_themes.theme.color.secondary})`
+      },
+      outlined: {
+        padding: "0.75em 0.5em",
+        border: "1px solid",
+        borderColor: `rgb(${_themes.theme.color.border})`,
+        borderRadius: _themes.theme.borderRadius,
+        backgroundColor: `rgb(${_themes.theme.color.background})`
+      }
+    }
+  }
+});
+
+
+
+
+exports.children = children; exports.icon = icon; exports.selectTrigger = selectTrigger;
+//# sourceMappingURL=SelectTrigger.css.cjs.map

package/dist/components/Select/SelectTrigger.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Select/SelectTrigger.css.ts","/home/runner/work/react-kits/react-kits/packages/ui/dist/components/Select/SelectTrigger.css.cjs"],"names":[],"mappings":"AAAA,oHAAsB;AACtB,mDAAuB;AAEvB,iCAAsB;AAEf,MAAM,SAAA,EAAW,wBAAA;AAAM,EAC5B,QAAA,EAAU,QAAA;AAAA,EACV,YAAA,EAAc,UAAA;AAAA,EACd,UAAA,EAAY;AACd,CAAC,CAAA;AAEM,MAAM,KAAA,EAAO,6BAAA;AAAO,EACzB,IAAA,EAAM;AAAA,IACJ,UAAA,EAAY,GAAA;AAAA,IAEZ,UAAA,EAAY,GAAA;AAAA,IAEZ,UAAA,EAAY;AAAA,EACd,CAAA;AAAA,EAEA,QAAA,EAAU;AAAA,IACR,QAAA,EAAU;AAAA,MACR,KAAA,EAAO;AAAA,QACL,SAAA,EAAW;AAAA,MACb,CAAA;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,KAAA,EAAO,CAAA,IAAA,EAAO,aAAA,CAAM,KAAA,CAAM,OAAO,CAAA,CAAA,CAAA;AAAA,QAEjC,SAAA,EAAW;AAAA,MACb;AAAA,IACF;AAAA,EACF;AACF,CAAC,CAAA;AAEM,MAAM,cAAA,EAAgB,6BAAA;AAAO,EAClC,IAAA,EAAM;AAAA,IACJ,OAAA,EAAS,MAAA;AAAA,IACT,UAAA,EAAY,QAAA;AAAA,IACZ,GAAA,EAAK,OAAA;AAAA,IACL,cAAA,EAAgB,eAAA;AAAA,IAEhB,KAAA,EAAO,MAAA;AAAA,IAEP,UAAA,EAAY,wBAAA;AAAA,IAEZ,MAAA,EAAQ,SAAA;AAAA,IACR,UAAA,EAAY;AAAA,EACd,CAAA;AAAA,EAEA,QAAA,EAAU;AAAA,IACR,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,WAAA,EAAa,CAAA,IAAA,EAAO,aAAA,CAAM,KAAA,CAAM,OAAO,CAAA,CAAA;AAAA,MACzC;AAAA,IACF,CAAA;AAAA,IACA,OAAA,EAAS;AAAA,MACP,SAAA,EAAW;AAAA,QACT,OAAA,EAAS,eAAA;AAAA,QACT,YAAA,EAAc,aAAA,CAAM,YAAA;AAAA,QAEpB,eAAA,EAAiB,CAAA,IAAA,EAAO,aAAA,CAAM,KAAA,CAAM,SAAS,CAAA,CAAA;AAAA,MAC/C,CAAA;AAAA,MACA,QAAA,EAAU;AAAA,QACR,OAAA,EAAS,cAAA;AAAA,QACT,MAAA,EAAQ,WAAA;AAAA,QACR,WAAA,EAAa,CAAA,IAAA,EAAO,aAAA,CAAM,KAAA,CAAM,MAAM,CAAA,CAAA,CAAA;AAAA,QACtC,YAAA,EAAc,aAAA,CAAM,YAAA;AAAA,QAEpB,eAAA,EAAiB,CAAA,IAAA,EAAO,aAAA,CAAM,KAAA,CAAM,UAAU,CAAA,CAAA;AAAA,MAChD;AAAA,IACF;AAAA,EACF;AACF,CAAC,CAAA;ACbD;AACE;AACA;AACA;AACF,wFAAC","file":"/home/runner/work/react-kits/react-kits/packages/ui/dist/components/Select/SelectTrigger.css.cjs","sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { theme } from '#themes';\n\nexport const children = style({\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n});\n\nexport const icon = recipe({\n  base: {\n    flexShrink: '0',\n\n    lineHeight: '0',\n\n    transition: 'color 0.2s ease, transform 0.2s ease',\n  },\n\n  variants: {\n    isActive: {\n      false: {\n        transform: 'rotate(0)',\n      },\n      true: {\n        color: `rgb(${theme.color.primary})`,\n\n        transform: 'rotate(-180deg)',\n      },\n    },\n  },\n});\n\nexport const selectTrigger = recipe({\n  base: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: '0.5em',\n    justifyContent: 'space-between',\n\n    width: '100%',\n\n    transition: 'border-color 0.2s ease',\n\n    cursor: 'pointer',\n    userSelect: 'none',\n  },\n\n  variants: {\n    isActive: {\n      true: {\n        borderColor: `rgb(${theme.color.primary})`,\n      },\n    },\n    variant: {\n      contained: {\n        padding: '0.75em 0.75em',\n        borderRadius: theme.borderRadius,\n\n        backgroundColor: `rgb(${theme.color.secondary})`,\n      },\n      outlined: {\n        padding: '0.75em 0.5em',\n        border: '1px solid',\n        borderColor: `rgb(${theme.color.border})`,\n        borderRadius: theme.borderRadius,\n\n        backgroundColor: `rgb(${theme.color.background})`,\n      },\n    },\n  },\n});\n",null]}

package/dist/components/Select/SelectTrigger.css.d.cts

@@ -0,0 +1,37 @@
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+
+declare const children: string;
+declare const icon: _vanilla_extract_recipes.RuntimeFn<{
+    isActive: {
+        false: {
+            transform: "rotate(0)";
+        };
+        true: {
+            color: `rgb(var(--${string}))`;
+            transform: "rotate(-180deg)";
+        };
+    };
+}>;
+declare const selectTrigger: _vanilla_extract_recipes.RuntimeFn<{
+    isActive: {
+        true: {
+            borderColor: `rgb(var(--${string}))`;
+        };
+    };
+    variant: {
+        contained: {
+            padding: "0.75em 0.75em";
+            borderRadius: `var(--${string})`;
+            backgroundColor: `rgb(var(--${string}))`;
+        };
+        outlined: {
+            padding: "0.75em 0.5em";
+            border: "1px solid";
+            borderColor: `rgb(var(--${string}))`;
+            borderRadius: `var(--${string})`;
+            backgroundColor: `rgb(var(--${string}))`;
+        };
+    };
+}>;
+
+export { children, icon, selectTrigger };

package/dist/components/Select/SelectTrigger.css.d.ts

@@ -1,5 +1,7 @@
-export declare const children: string;
-export declare const icon: import("@vanilla-extract/recipes").RuntimeFn<{
+import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
+
+declare const children: string;
+declare const icon: _vanilla_extract_recipes.RuntimeFn<{
     isActive: {
         false: {
             transform: "rotate(0)";
@@ -10,7 +12,7 @@ export declare const icon: import("@vanilla-extract/recipes").RuntimeFn<{
         };
     };
 }>;
-export declare const selectTrigger: import("@vanilla-extract/recipes").RuntimeFn<{
+declare const selectTrigger: _vanilla_extract_recipes.RuntimeFn<{
     isActive: {
         true: {
             borderColor: `rgb(var(--${string}))`;
@@ -31,4 +33,5 @@ export declare const selectTrigger: import("@vanilla-extract/recipes").RuntimeFn
         };
     };
 }>;
-//# sourceMappingURL=SelectTrigger.css.d.ts.map
+
+export { children, icon, selectTrigger };

package/dist/components/Select/SelectTrigger.css.js

@@ -1,62 +1,65 @@
-import { style } from '../../node_modules/.pnpm/@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0/node_modules/@vanilla-extract/css/dist/vanilla-extract-css.esm.js';
-import { recipe } from '../../node_modules/.pnpm/@vanilla-extract_recipes@0.5.7_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/recipes/dist/vanilla-extract-recipes.esm.js';
-import { theme } from '../../themes/theme.css.js';
-
+import { style } from "@vanilla-extract/css";
+import { recipe } from "@vanilla-extract/recipes";
+import { theme } from "#themes";
 const children = style({
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-    whiteSpace: 'nowrap',
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  whiteSpace: "nowrap"
 });
 const icon = recipe({
-    base: {
-        flexShrink: '0',
-        lineHeight: '0',
-        transition: 'color 0.2s ease, transform 0.2s ease',
-    },
-    variants: {
-        isActive: {
-            false: {
-                transform: 'rotate(0)',
-            },
-            true: {
-                color: `rgb(${theme.color.primary})`,
-                transform: 'rotate(-180deg)',
-            },
-        },
-    },
+  base: {
+    flexShrink: "0",
+    lineHeight: "0",
+    transition: "color 0.2s ease, transform 0.2s ease"
+  },
+  variants: {
+    isActive: {
+      false: {
+        transform: "rotate(0)"
+      },
+      true: {
+        color: `rgb(${theme.color.primary})`,
+        transform: "rotate(-180deg)"
+      }
+    }
+  }
 });
 const selectTrigger = recipe({
-    base: {
-        display: 'flex',
-        alignItems: 'center',
-        gap: '0.5em',
-        justifyContent: 'space-between',
-        width: '100%',
-        transition: 'border-color 0.2s ease',
-        cursor: 'pointer',
-        userSelect: 'none',
-    },
-    variants: {
-        isActive: {
-            true: {
-                borderColor: `rgb(${theme.color.primary})`,
-            },
-        },
-        variant: {
-            contained: {
-                padding: '0.75em 0.75em',
-                borderRadius: theme.borderRadius,
-                backgroundColor: `rgb(${theme.color.secondary})`,
-            },
-            outlined: {
-                padding: '0.75em 0.5em',
-                border: '1px solid',
-                borderColor: `rgb(${theme.color.border})`,
-                borderRadius: theme.borderRadius,
-                backgroundColor: `rgb(${theme.color.background})`,
-            },
-        },
+  base: {
+    display: "flex",
+    alignItems: "center",
+    gap: "0.5em",
+    justifyContent: "space-between",
+    width: "100%",
+    transition: "border-color 0.2s ease",
+    cursor: "pointer",
+    userSelect: "none"
+  },
+  variants: {
+    isActive: {
+      true: {
+        borderColor: `rgb(${theme.color.primary})`
+      }
     },
+    variant: {
+      contained: {
+        padding: "0.75em 0.75em",
+        borderRadius: theme.borderRadius,
+        backgroundColor: `rgb(${theme.color.secondary})`
+      },
+      outlined: {
+        padding: "0.75em 0.5em",
+        border: "1px solid",
+        borderColor: `rgb(${theme.color.border})`,
+        borderRadius: theme.borderRadius,
+        backgroundColor: `rgb(${theme.color.background})`
+      }
+    }
+  }
 });
-
-export { children, icon, selectTrigger };
+export {
+  children,
+  icon,
+  selectTrigger
+};
+//# sourceMappingURL=SelectTrigger.css.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Select/SelectTrigger.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { recipe } from '@vanilla-extract/recipes';\n\nimport { theme } from '#themes';\n\nexport const children = style({\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n});\n\nexport const icon = recipe({\n  base: {\n    flexShrink: '0',\n\n    lineHeight: '0',\n\n    transition: 'color 0.2s ease, transform 0.2s ease',\n  },\n\n  variants: {\n    isActive: {\n      false: {\n        transform: 'rotate(0)',\n      },\n      true: {\n        color: `rgb(${theme.color.primary})`,\n\n        transform: 'rotate(-180deg)',\n      },\n    },\n  },\n});\n\nexport const selectTrigger = recipe({\n  base: {\n    display: 'flex',\n    alignItems: 'center',\n    gap: '0.5em',\n    justifyContent: 'space-between',\n\n    width: '100%',\n\n    transition: 'border-color 0.2s ease',\n\n    cursor: 'pointer',\n    userSelect: 'none',\n  },\n\n  variants: {\n    isActive: {\n      true: {\n        borderColor: `rgb(${theme.color.primary})`,\n      },\n    },\n    variant: {\n      contained: {\n        padding: '0.75em 0.75em',\n        borderRadius: theme.borderRadius,\n\n        backgroundColor: `rgb(${theme.color.secondary})`,\n      },\n      outlined: {\n        padding: '0.75em 0.5em',\n        border: '1px solid',\n        borderColor: `rgb(${theme.color.border})`,\n        borderRadius: theme.borderRadius,\n\n        backgroundColor: `rgb(${theme.color.background})`,\n      },\n    },\n  },\n});\n"],"mappings":"AAAA,SAAS,aAAa;AACtB,SAAS,cAAc;AAEvB,SAAS,aAAa;AAEf,MAAM,WAAW,MAAM;AAAA,EAC5B,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AACd,CAAC;AAEM,MAAM,OAAO,OAAO;AAAA,EACzB,MAAM;AAAA,IACJ,YAAY;AAAA,IAEZ,YAAY;AAAA,IAEZ,YAAY;AAAA,EACd;AAAA,EAEA,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,WAAW;AAAA,MACb;AAAA,MACA,MAAM;AAAA,QACJ,OAAO,OAAO,MAAM,MAAM,OAAO;AAAA,QAEjC,WAAW;AAAA,MACb;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAEM,MAAM,gBAAgB,OAAO;AAAA,EAClC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,gBAAgB;AAAA,IAEhB,OAAO;AAAA,IAEP,YAAY;AAAA,IAEZ,QAAQ;AAAA,IACR,YAAY;AAAA,EACd;AAAA,EAEA,UAAU;AAAA,IACR,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,aAAa,OAAO,MAAM,MAAM,OAAO;AAAA,MACzC;AAAA,IACF;AAAA,IACA,SAAS;AAAA,MACP,WAAW;AAAA,QACT,SAAS;AAAA,QACT,cAAc,MAAM;AAAA,QAEpB,iBAAiB,OAAO,MAAM,MAAM,SAAS;AAAA,MAC/C;AAAA,MACA,UAAU;AAAA,QACR,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,aAAa,OAAO,MAAM,MAAM,MAAM;AAAA,QACtC,cAAc,MAAM;AAAA,QAEpB,iBAAiB,OAAO,MAAM,MAAM,UAAU;AAAA,MAChD;AAAA,IACF;AAAA,EACF;AACF,CAAC;","names":[]}

package/dist/components/Select/SelectTrigger.d.cts

@@ -0,0 +1,12 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { UIComponent } from '../../types/ui.types.cjs';
+import { selectTrigger } from './SelectTrigger.css.cjs';
+import 'react';
+import '@vanilla-extract/css';
+import '@vanilla-extract/recipes';
+import '../../styles/sprinkles.css.cjs';
+
+type SelectTriggerProps = UIComponent<'div', typeof selectTrigger>;
+declare const SelectTrigger: ({ children, className, variant, sx: propSx, }: SelectTriggerProps) => react_jsx_runtime.JSX.Element;
+
+export { SelectTrigger as default };

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

@@ -1,6 +1,12 @@
-import type { UIComponent } from '#types';
-import * as s from './SelectTrigger.css';
-type SelectTriggerProps = UIComponent<'div', typeof s.selectTrigger>;
-declare const SelectTrigger: ({ children, className, variant, sx: propSx, }: SelectTriggerProps) => import("react/jsx-runtime").JSX.Element;
-export default SelectTrigger;
-//# sourceMappingURL=SelectTrigger.d.ts.map
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { UIComponent } from '../../types/ui.types.js';
+import { selectTrigger } from './SelectTrigger.css.js';
+import 'react';
+import '@vanilla-extract/css';
+import '@vanilla-extract/recipes';
+import '../../styles/sprinkles.css.js';
+
+type SelectTriggerProps = UIComponent<'div', typeof selectTrigger>;
+declare const SelectTrigger: ({ children, className, variant, sx: propSx, }: SelectTriggerProps) => react_jsx_runtime.JSX.Element;
+
+export { SelectTrigger as default };