@devup-ui/components 0.1.42 → 0.1.44

package/dist/components/Radio/index.js

@@ -1,195 +1,144 @@
-import { jsxs as n, jsx as a } from "react/jsx-runtime";
-import { Box as g, Input as v, Text as B } from "@devup-ui/react";
-function m({
-  className: o,
-  disabled: e,
-  children: i,
-  variant: t = "default",
-  checked: b,
-  classNames: p,
-  styles: s,
-  style: l,
-  firstButton: c,
-  lastButton: k,
-  colors: r,
-  ...h
-}) {
-  const d = t === "button";
-  return /* @__PURE__ */ n(
-    g,
-    {
-      alignItems: d ? void 0 : "center",
-      "aria-disabled": e,
-      as: "label",
-      cursor: d ? void 0 : "pointer",
-      display: d ? void 0 : "inline-flex",
-      gap: d ? void 0 : 2,
-      selectors: {
-        "&[aria-disabled=true]": {
-          cursor: "default"
-        }
-      },
-      children: [
-        d ? /* @__PURE__ */ a(
-          v,
-          {
-            checked: b,
-            className: o,
-            "data-radio-input": !0,
-            disabled: e,
-            display: "none",
-            opacity: 0,
-            styleOrder: 1,
-            type: "radio",
-            ...h
-          }
-        ) : /* @__PURE__ */ a(
-          v,
-          {
-            _focus: {
-              outline: "1px sold var(--border, var(--primary))"
-            },
-            appearance: "none",
-            bg: "light-dark(#fff, #2E2E2E)",
-            border: "1px solid",
-            borderColor: "$border",
-            borderRadius: "100%",
-            checked: b,
-            className: o,
-            "data-radio-input": !0,
-            disabled: e,
-            height: "18px",
-            m: 0,
-            selectors: {
-              // checked
-              "&:checked:not(:disabled)": {
-                bg: "var(--checkedBg, var(--primary, light-dark(#fff, #2E2E2E)))",
-                border: "3px solid",
-                borderColor: "var(--checkedBg, light-dark(#fff, #2E2E2E))",
-                boxShadow: "0 0 0 1px var(--checkedBorder, var(--primary))"
-              },
-              // hover
-              "&:hover:not(:disabled,:checked)": {
-                border: "1px solid var(--hoverBorder, var(--primary))",
-                bg: "var(--hoverBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 90%), color-mix(in srgb, var(--primary) 10%, black 90%)))"
-              },
-              // disabled
-              "&:is(:disabled, [aria-disabled=true])": {
-                bgColor: "var(--disabledBg, light-dark(#F0F0F3, #47474A))"
-              }
-            },
-            styleOrder: 1,
-            styleVars: {
-              primary: r?.primary,
-              border: r?.border,
-              text: r?.text,
-              bg: r?.bg,
-              hoverBg: r?.hoverBg,
-              hoverBorder: r?.hoverBorder,
-              hoverColor: r?.hoverColor,
-              checkedBg: r?.checkedBg,
-              checkedBorder: r?.checkedBorder,
-              checkedColor: r?.checkedColor,
-              disabledBg: r?.disabledBg,
-              disabledColor: r?.disabledColor
-            },
-            transition: ".25s",
-            type: "radio",
-            width: "18px",
-            ...h
-          }
-        ),
-        t === "button" ? /* @__PURE__ */ a(
-          g,
-          {
-            _disabled: {
-              cursor: "not-allowed"
-            },
-            "aria-disabled": e,
-            bg: "var(--bg, light-dark(#fff, #2E2E2E))",
-            border: "1px solid",
-            borderColor: "$border",
-            borderRadius: c ? "8px 0 0 8px" : k ? "0 8px 8px 0" : void 0,
-            className: o,
-            color: "var(--text, light-dark(#000, #fff))",
-            cursor: "pointer",
-            "data-radio-button": !0,
-            display: "flex",
-            px: 8,
-            py: 3,
-            selectors: {
-              // checked
-              "[data-radio-input]:checked + &:not([aria-disabled=true])": {
-                fontWeight: 600,
-                bg: "var(--checkedBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 80%), color-mix(in srgb, var(--primary) 10%, black 80%)))",
-                borderColor: "var(--checkedBorder, var(--primary))",
-                color: "var(--checkedColor, var(--primary))"
-              },
-              // hover
-              "&:hover:not([aria-disabled=true])": {
-                bg: "var(--hoverBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 90%), color-mix(in srgb, var(--primary) 10%, black 90%)))",
-                borderColor: "var(--hoverBorder, var(--primary))"
-              },
-              // disabled
-              "[data-radio-input]:disabled + &": {
-                bg: "var(--disabledBg, light-dark(#F0F0F3, #47474A))",
-                color: "var(--disabledColor, light-dark(#D6D7DE, #373737))"
-              }
-            },
-            style: l,
-            styleOrder: 1,
-            styleVars: {
-              primary: r?.primary,
-              border: r?.border,
-              text: r?.text,
-              bg: r?.bg,
-              hoverBg: r?.hoverBg,
-              hoverBorder: r?.hoverBorder,
-              hoverColor: r?.hoverColor,
-              checkedBg: r?.checkedBg,
-              checkedBorder: r?.checkedBorder,
-              checkedColor: r?.checkedColor,
-              disabledBg: r?.disabledBg,
-              disabledColor: r?.disabledColor
-            },
-            transition: "background-color 0.25s, border-color 0.25s",
-            w: "fit-content",
-            children: i
-          }
-        ) : /* @__PURE__ */ a(
-          B,
-          {
-            "aria-disabled": e,
-            className: p?.label,
-            color: "var(--text, light-dark(#000, #fff))",
-            selectors: {
-              "&[aria-disabled=true]": {
-                color: "var(--disabledColor, light-dark(#D6D7DE, #373737))"
-              }
-            },
-            style: l,
-            styleOrder: 1,
-            styleVars: {
-              primary: r?.primary,
-              border: r?.border,
-              text: r?.text,
-              bg: r?.bg,
-              hoverBg: r?.hoverBg,
-              hoverBorder: r?.hoverBorder,
-              hoverColor: r?.hoverColor,
-              checkedBg: r?.checkedBg,
-              checkedBorder: r?.checkedBorder,
-              checkedColor: r?.checkedColor,
-              disabledBg: r?.disabledBg,
-              disabledColor: r?.disabledColor
-            },
-            children: i
-          }
-        )
-      ]
-    }
-  );
+import { Box as e, Input as t, Text as n } from "@devup-ui/react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/Radio/index.tsx
+function a({ className: a, disabled: o, children: s, variant: c = "default", checked: l, classNames: u, styles: d, style: f, firstButton: p, lastButton: m, colors: h, ...g }) {
+	let _ = c === "button";
+	return /* @__PURE__ */ i(e, {
+		alignItems: _ ? void 0 : "center",
+		"aria-disabled": o,
+		as: "label",
+		cursor: _ ? void 0 : "pointer",
+		display: _ ? void 0 : "inline-flex",
+		gap: _ ? void 0 : 2,
+		selectors: { "&[aria-disabled=true]": { cursor: "default" } },
+		children: [_ ? /* @__PURE__ */ r(t, {
+			checked: l,
+			className: a,
+			"data-radio-input": !0,
+			disabled: o,
+			display: "none",
+			opacity: 0,
+			styleOrder: 1,
+			type: "radio",
+			...g
+		}) : /* @__PURE__ */ r(t, {
+			_focus: { outline: "1px sold var(--border, var(--primary))" },
+			appearance: "none",
+			bg: "light-dark(#fff, #2E2E2E)",
+			border: "1px solid",
+			borderColor: "$border",
+			borderRadius: "100%",
+			checked: l,
+			className: a,
+			"data-radio-input": !0,
+			disabled: o,
+			height: "18px",
+			m: 0,
+			selectors: {
+				"&:checked:not(:disabled)": {
+					bg: "var(--checkedBg, var(--primary, light-dark(#fff, #2E2E2E)))",
+					border: "3px solid",
+					borderColor: "var(--checkedBg, light-dark(#fff, #2E2E2E))",
+					boxShadow: "0 0 0 1px var(--checkedBorder, var(--primary))"
+				},
+				"&:hover:not(:disabled,:checked)": {
+					border: "1px solid var(--hoverBorder, var(--primary))",
+					bg: "var(--hoverBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 90%), color-mix(in srgb, var(--primary) 10%, black 90%)))"
+				},
+				"&:is(:disabled, [aria-disabled=true])": { bgColor: "var(--disabledBg, light-dark(#F0F0F3, #47474A))" }
+			},
+			styleOrder: 1,
+			styleVars: {
+				primary: h?.primary,
+				border: h?.border,
+				text: h?.text,
+				bg: h?.bg,
+				hoverBg: h?.hoverBg,
+				hoverBorder: h?.hoverBorder,
+				hoverColor: h?.hoverColor,
+				checkedBg: h?.checkedBg,
+				checkedBorder: h?.checkedBorder,
+				checkedColor: h?.checkedColor,
+				disabledBg: h?.disabledBg,
+				disabledColor: h?.disabledColor
+			},
+			transition: ".25s",
+			type: "radio",
+			width: "18px",
+			...g
+		}), c === "button" ? /* @__PURE__ */ r(e, {
+			_disabled: { cursor: "not-allowed" },
+			"aria-disabled": o,
+			bg: "var(--bg, light-dark(#fff, #2E2E2E))",
+			border: "1px solid",
+			borderColor: "$border",
+			borderRadius: p ? "8px 0 0 8px" : m ? "0 8px 8px 0" : void 0,
+			className: a,
+			color: "var(--text, light-dark(#000, #fff))",
+			cursor: "pointer",
+			"data-radio-button": !0,
+			display: "flex",
+			px: 8,
+			py: 3,
+			selectors: {
+				"[data-radio-input]:checked + &:not([aria-disabled=true])": {
+					fontWeight: 600,
+					bg: "var(--checkedBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 80%), color-mix(in srgb, var(--primary) 10%, black 80%)))",
+					borderColor: "var(--checkedBorder, var(--primary))",
+					color: "var(--checkedColor, var(--primary))"
+				},
+				"&:hover:not([aria-disabled=true])": {
+					bg: "var(--hoverBg, light-dark(color-mix(in srgb, var(--primary) 10%, white 90%), color-mix(in srgb, var(--primary) 10%, black 90%)))",
+					borderColor: "var(--hoverBorder, var(--primary))"
+				},
+				"[data-radio-input]:disabled + &": {
+					bg: "var(--disabledBg, light-dark(#F0F0F3, #47474A))",
+					color: "var(--disabledColor, light-dark(#D6D7DE, #373737))"
+				}
+			},
+			style: f,
+			styleOrder: 1,
+			styleVars: {
+				primary: h?.primary,
+				border: h?.border,
+				text: h?.text,
+				bg: h?.bg,
+				hoverBg: h?.hoverBg,
+				hoverBorder: h?.hoverBorder,
+				hoverColor: h?.hoverColor,
+				checkedBg: h?.checkedBg,
+				checkedBorder: h?.checkedBorder,
+				checkedColor: h?.checkedColor,
+				disabledBg: h?.disabledBg,
+				disabledColor: h?.disabledColor
+			},
+			transition: "background-color 0.25s, border-color 0.25s",
+			w: "fit-content",
+			children: s
+		}) : /* @__PURE__ */ r(n, {
+			"aria-disabled": o,
+			className: u?.label,
+			color: "var(--text, light-dark(#000, #fff))",
+			selectors: { "&[aria-disabled=true]": { color: "var(--disabledColor, light-dark(#D6D7DE, #373737))" } },
+			style: f,
+			styleOrder: 1,
+			styleVars: {
+				primary: h?.primary,
+				border: h?.border,
+				text: h?.text,
+				bg: h?.bg,
+				hoverBg: h?.hoverBg,
+				hoverBorder: h?.hoverBorder,
+				hoverColor: h?.hoverColor,
+				checkedBg: h?.checkedBg,
+				checkedBorder: h?.checkedBorder,
+				checkedColor: h?.checkedColor,
+				disabledBg: h?.disabledBg,
+				disabledColor: h?.disabledColor
+			},
+			children: s
+		})]
+	});
 }
-export {
-  m as Radio
-};
+//#endregion
+export { a as Radio };

package/dist/components/RadioGroup/index.cjs

@@ -1,2 +1 @@
-"use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),w=require("@devup-ui/react"),V=require("react"),a=require("../Radio/index.cjs");function y({disabled:u,options:i,direction:c="row",variant:t="default",style:S,value:n,onChange:f,defaultValue:s,colors:g,className:j,classNames:d,styles:h}){const[R,q]=V.useState(n?String(n):s?String(s):void 0),b=n?String(n):R??"";function m(e){f?.(e),q(e)}return o.jsx(w.Flex,{className:d?.container,flexDir:t==="button"?"row":c,gap:t==="button"?0:c==="row"?"30px":"16px",style:h?.container,children:i.map(({value:e,label:l},p)=>{const r=String(e),x={checked:b===r,disabled:u,onChange:()=>!u&&m(r),className:j,classNames:d,styles:h,style:S};return t==="button"?o.jsx(a.Radio,{colors:g,firstButton:p===0,lastButton:p===i.length-1,variant:t,...x,children:l},r):o.jsx(a.Radio,{colors:g,variant:t,...x,children:l},r)})})}exports.RadioGroup=y;
+"use client";"use client";require(`../../_virtual/_rolldown/runtime.cjs`);const e=require(`../Radio/index.cjs`);let t=require(`@devup-ui/react`),n=require(`react/jsx-runtime`),r=require(`react`);function i({disabled:i,options:a,direction:o=`row`,variant:s=`default`,style:c,value:l,onChange:u,defaultValue:d,colors:f,className:p,classNames:m,styles:h}){let[g,_]=(0,r.useState)(l?String(l):d?String(d):void 0),v=l?String(l):g??``;function y(e){u?.(e),_(e)}return(0,n.jsx)(t.Flex,{className:m?.container,flexDir:s===`button`?`row`:o,gap:s===`button`?0:o===`row`?`30px`:`16px`,style:h?.container,children:a.map(({value:t,label:r},o)=>{let l=String(t),u={checked:v===l,disabled:i,onChange:()=>!i&&y(l),className:p,classNames:m,styles:h,style:c};return s===`button`?(0,n.jsx)(e.Radio,{colors:f,firstButton:o===0,lastButton:o===a.length-1,variant:s,...u,children:r},l):(0,n.jsx)(e.Radio,{colors:f,variant:s,...u,children:r},l)})})}exports.RadioGroup=i;

package/dist/components/RadioGroup/index.js

@@ -1,61 +1,45 @@
 "use client";
-import { jsx as e } from "react/jsx-runtime";
-import { Flex as a } from "@devup-ui/react";
-import { useState as b } from "react";
-import { Radio as x } from "../Radio/index.js";
-function G({
-  disabled: i,
-  options: u,
-  direction: c = "row",
-  variant: t = "default",
-  style: S,
-  value: n,
-  onChange: d,
-  defaultValue: p,
-  colors: g,
-  className: w,
-  classNames: m,
-  styles: f
-}) {
-  const [V, B] = b(
-    n ? String(n) : p ? String(p) : void 0
-  ), C = n ? String(n) : V ?? "";
-  function R(r) {
-    d?.(r), B(r);
-  }
-  return /* @__PURE__ */ e(
-    a,
-    {
-      className: m?.container,
-      flexDir: t === "button" ? "row" : c,
-      gap: t === "button" ? 0 : c === "row" ? "30px" : "16px",
-      style: f?.container,
-      children: u.map(({ value: r, label: h }, s) => {
-        const o = String(r), l = {
-          checked: C === o,
-          disabled: i,
-          onChange: () => !i && R(o),
-          className: w,
-          classNames: m,
-          styles: f,
-          style: S
-        };
-        return t === "button" ? /* @__PURE__ */ e(
-          x,
-          {
-            colors: g,
-            firstButton: s === 0,
-            lastButton: s === u.length - 1,
-            variant: t,
-            ...l,
-            children: h
-          },
-          o
-        ) : /* @__PURE__ */ e(x, { colors: g, variant: t, ...l, children: h }, o);
-      })
-    }
-  );
+"use client";
+import { Radio as e } from "../Radio/index.js";
+import { Flex as t } from "@devup-ui/react";
+import { jsx as n } from "react/jsx-runtime";
+import { useState as r } from "react";
+//#region src/components/RadioGroup/index.tsx
+function i({ disabled: i, options: a, direction: o = "row", variant: s = "default", style: c, value: l, onChange: u, defaultValue: d, colors: f, className: p, classNames: m, styles: h }) {
+	let [g, _] = r(l ? String(l) : d ? String(d) : void 0), v = l ? String(l) : g ?? "";
+	function y(e) {
+		u?.(e), _(e);
+	}
+	return /* @__PURE__ */ n(t, {
+		className: m?.container,
+		flexDir: s === "button" ? "row" : o,
+		gap: s === "button" ? 0 : o === "row" ? "30px" : "16px",
+		style: h?.container,
+		children: a.map(({ value: t, label: r }, o) => {
+			let l = String(t), u = {
+				checked: v === l,
+				disabled: i,
+				onChange: () => !i && y(l),
+				className: p,
+				classNames: m,
+				styles: h,
+				style: c
+			};
+			return s === "button" ? /* @__PURE__ */ n(e, {
+				colors: f,
+				firstButton: o === 0,
+				lastButton: o === a.length - 1,
+				variant: s,
+				...u,
+				children: r
+			}, l) : /* @__PURE__ */ n(e, {
+				colors: f,
+				variant: s,
+				...u,
+				children: r
+			}, l);
+		})
+	});
 }
-export {
-  G as RadioGroup
-};
+//#endregion
+export { i as RadioGroup };

package/dist/components/Select/IconCheck.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");function t({...n}){return e.jsx("svg",{fill:"none",height:"10",viewBox:"0 0 12 10",width:"12",xmlns:"http://www.w3.org/2000/svg",...n,children:e.jsx("path",{clipRule:"evenodd",d:"M11.6044 0.825663C12.1054 1.28367 12.1344 2.05481 11.6692 2.54805L5.4787 9.11055C5.24011 9.36348 4.90375 9.50497 4.55315 9.49987C4.20254 9.49477 3.87058 9.34356 3.63968 9.0838L0.30635 5.3338C-0.143922 4.82725 -0.0917767 4.05729 0.42282 3.61405C0.937417 3.17081 1.7196 3.22214 2.16987 3.7287L4.59876 6.4612L9.85463 0.889455C10.3199 0.396214 11.1033 0.367654 11.6044 0.825663Z",fill:"currentColor",fillRule:"evenodd"})})}exports.IconCheck=t;
+require(`../../_virtual/_rolldown/runtime.cjs`);let e=require(`react/jsx-runtime`);function t({...t}){return(0,e.jsx)(`svg`,{fill:`none`,height:`10`,viewBox:`0 0 12 10`,width:`12`,xmlns:`http://www.w3.org/2000/svg`,...t,children:(0,e.jsx)(`path`,{clipRule:`evenodd`,d:`M11.6044 0.825663C12.1054 1.28367 12.1344 2.05481 11.6692 2.54805L5.4787 9.11055C5.24011 9.36348 4.90375 9.50497 4.55315 9.49987C4.20254 9.49477 3.87058 9.34356 3.63968 9.0838L0.30635 5.3338C-0.143922 4.82725 -0.0917767 4.05729 0.42282 3.61405C0.937417 3.17081 1.7196 3.22214 2.16987 3.7287L4.59876 6.4612L9.85463 0.889455C10.3199 0.396214 11.1033 0.367654 11.6044 0.825663Z`,fill:`currentColor`,fillRule:`evenodd`})})}exports.IconCheck=t;

package/dist/components/Select/IconCheck.js

@@ -1,26 +1,20 @@
 import { jsx as e } from "react/jsx-runtime";
-function n({ ...l }) {
-  return /* @__PURE__ */ e(
-    "svg",
-    {
-      fill: "none",
-      height: "10",
-      viewBox: "0 0 12 10",
-      width: "12",
-      xmlns: "http://www.w3.org/2000/svg",
-      ...l,
-      children: /* @__PURE__ */ e(
-        "path",
-        {
-          clipRule: "evenodd",
-          d: "M11.6044 0.825663C12.1054 1.28367 12.1344 2.05481 11.6692 2.54805L5.4787 9.11055C5.24011 9.36348 4.90375 9.50497 4.55315 9.49987C4.20254 9.49477 3.87058 9.34356 3.63968 9.0838L0.30635 5.3338C-0.143922 4.82725 -0.0917767 4.05729 0.42282 3.61405C0.937417 3.17081 1.7196 3.22214 2.16987 3.7287L4.59876 6.4612L9.85463 0.889455C10.3199 0.396214 11.1033 0.367654 11.6044 0.825663Z",
-          fill: "currentColor",
-          fillRule: "evenodd"
-        }
-      )
-    }
-  );
+//#region src/components/Select/IconCheck.tsx
+function t({ ...t }) {
+	return /* @__PURE__ */ e("svg", {
+		fill: "none",
+		height: "10",
+		viewBox: "0 0 12 10",
+		width: "12",
+		xmlns: "http://www.w3.org/2000/svg",
+		...t,
+		children: /* @__PURE__ */ e("path", {
+			clipRule: "evenodd",
+			d: "M11.6044 0.825663C12.1054 1.28367 12.1344 2.05481 11.6692 2.54805L5.4787 9.11055C5.24011 9.36348 4.90375 9.50497 4.55315 9.49987C4.20254 9.49477 3.87058 9.34356 3.63968 9.0838L0.30635 5.3338C-0.143922 4.82725 -0.0917767 4.05729 0.42282 3.61405C0.937417 3.17081 1.7196 3.22214 2.16987 3.7287L4.59876 6.4612L9.85463 0.889455C10.3199 0.396214 11.1033 0.367654 11.6044 0.825663Z",
+			fill: "currentColor",
+			fillRule: "evenodd"
+		})
+	});
 }
-export {
-  n as IconCheck
-};
+//#endregion
+export { t as IconCheck };

package/dist/components/Select/index.cjs

@@ -1,2 +1 @@
-"use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),v=require("react"),a=require("@devup-ui/react"),q=require("clsx"),E=require("../../contexts/useSelect.cjs"),w=require("../Button/index.cjs"),j=require("./IconCheck.cjs");function z({type:r="default",children:l,defaultValue:f,value:o,onChange:c,defaultOpen:g,open:x,onOpenChange:b,colors:t,typography:d,options:s,triggerProps:k,containerProps:i,optionProps:h,...u}){const p=v.useRef(null),[F,y]=v.useState(g??!1),[m,S]=v.useState(f??(r==="checkbox"?[]:""));v.useEffect(()=>{const n=C=>{p.current&&p.current.contains(C.target)||y(!1)};return document.addEventListener("click",n),()=>document.removeEventListener("click",n)},[F,y]);const A=n=>{b?.(n),y(n)},R=n=>{if(c?.(n),r!=="default"){if(r==="radio"){S(n);return}Array.isArray(m)&&m.includes(n)?S(m.filter(C=>C!==n)):S([...m,n])}};return e.jsx(E.SelectContext.Provider,{value:{open:x??F,setOpen:A,value:o??m,setValue:R,type:r,ref:p},children:e.jsx(a.Box,{ref:p,display:"inline-block",h:"fit-content",selectors:{"&, & *":{boxSizing:"border-box"}},styleOrder:1,styleVars:{primary:t?.primary,border:t?.border,inputBackground:t?.inputBackground,base10:t?.base10,title:t?.title,selectDisabled:t?.selectDisabled,primaryBg:t?.primaryBg,inputDisabledBackground:t?.inputDisabledBackground,inputDisabledText:t?.inputDisabledText},typography:d,...u,children:s?e.jsxs(e.Fragment,{children:[e.jsx(O,{...k,children:l}),e.jsx(B,{...i,children:s?.map(n=>v.createElement(D,{...h,...n,key:"option-"+n.value},n.label??n.value))})]}):l})})}function O({className:r,children:l,asChild:f,...o}){const{open:c,setOpen:g}=E.useSelect(),x=()=>{g(!c)};if(f){const b=v.Children.only(l),t=b.type;return e.jsx(t,{"aria-expanded":c,"aria-label":"Select toggle",onClick:x,...b.props})}return e.jsx(w.Button,{"aria-expanded":c,"aria-label":"Select toggle",className:q(a.css({borderRadius:"8px",styleOrder:2}),r),onClick:x,...o,children:l})}function B({children:r,showConfirmButton:l,confirmButtonText:f="완료",x:o=0,y:c=0,...g}){const{open:x,setOpen:b,type:t,ref:d}=E.useSelect();return x?e.jsxs(a.VStack,{ref:s=>{if(!d.current||!s)return;const k=d.current,i=()=>{const{height:h,x:u,y:p,top:F,left:y}=k.getBoundingClientRect(),m=s.offsetHeight+F+window.scrollY+h+c>document.documentElement.scrollHeight,S=s.offsetWidth+y+window.scrollX+o>document.documentElement.scrollWidth;m?s.style.bottom=`${window.innerHeight-p+10}px`:s.style.top=`${p+h+10+c}px`,S?s.style.left=`${Math.max(u-s.offsetWidth+k.offsetWidth,0)+o}px`:s.style.left=`${u+o}px`};return i(),window.addEventListener("scroll",i,!0),window.addEventListener("resize",i),()=>{window.removeEventListener("scroll",i,!0),window.removeEventListener("resize",i)}},"aria-label":"Select container",bg:"var(--inputBg, light-dark(#FFF,#2E2E2E))",border:"1px solid var(--border, light-dark(#E4E4E4,#434343))",borderRadius:"8px",bottom:"-4px",boxShadow:"0 2px 2px 0 var(--base10, light-dark(#0000001A,#FFFFFF1A))",boxSize:"fit-content",gap:"6px",minW:"232px",p:"10px",pos:"fixed",styleOrder:1,userSelect:"none",zIndex:1,...g,children:[r,l&&t==="checkbox"&&e.jsx(a.Flex,{justifyContent:"end",w:"100%",children:e.jsx(w.Button,{"aria-label":"Select confirm button",className:a.css({textAlign:"end",bg:"var(--primary, light-dark(#674DC7, #8163E1))",borderRadius:"8px",w:"fit-content",px:"30px",py:"10px",color:"#FFF",typography:"buttonS"}),onClick:()=>b(!1),variant:"primary",children:f})})]}):null}function D({disabled:r,onClick:l,children:f,value:o,showCheck:c=!0,...g}){const{setOpen:x,setValue:b,value:t,type:d}=E.useSelect(),s=()=>{d!=="checkbox"&&x(!1)},k=(u,p)=>{if(l){l(u,p);return}typeof u=="string"&&b(u),s()},i={default:!1,radio:t===o,checkbox:Array.isArray(t)&&o&&t.includes(o)}[d],h=!r&&!(d==="radio"&&i);return e.jsxs(a.Flex,{_hover:h&&{bg:"var(--primaryBg, light-dark(#F4F3FA, #F4F3FA0D))"},alignItems:"center","aria-label":"Select option",borderRadius:"6px",color:r?"var(--selectDisabled, light-dark(#C4C5D1, #45464D))":i?"var(--primary, light-dark(#674DC7, #8163E1)":"var(--title, light-dark(#1A1A1A,#FAFAFA))",cursor:h?"pointer":"default","data-value":o,fontWeight:i?"700":"400",gap:{checkbox:"10px",radio:"6px",default:"0"}[d],h:"40px",onClick:r?void 0:u=>k(o,u),px:"10px",styleOrder:1,transition:"background-color 0.1s ease-in-out",...g,children:[c&&{checkbox:e.jsx(a.Box,{bg:r?"var(--inputDisabledBackground, light-dark(#F0F0F3, #414244))":i?"var(--primary, light-dark(#674DC7, #8163E1)":"var(--border, light-dark(#E4E4E4, #434343))",borderRadius:"4px",boxSize:"18px",pos:"relative",transition:"background-color 0.1s ease-in-out",children:i&&e.jsx(j.IconCheck,{className:a.css({color:r?"var(--inputDisabledText, light-dark(#E5E5E5, #373737))":"#FFF",position:"absolute",top:"55%",left:"50%",transform:"translate(-50%, -50%)"})})}),radio:e.jsx(e.Fragment,{children:i&&e.jsx(a.Box,{borderRadius:"4px",boxSize:"18px",pos:"relative",transition:"background-color 0.1s ease-in-out",children:e.jsx(j.IconCheck,{className:a.css({position:"absolute",top:"55%",left:"50%",transform:"translate(-50%, -50%)",color:"inherit"})})})}),default:null}[d],f]})}function L({...r}){return e.jsx(a.Box,{bg:"var(--border, light-dark(#E4E4E4,#434343)",h:"1px",styleOrder:1,w:"100%",...r})}exports.Select=z;exports.SelectContainer=B;exports.SelectDivider=L;exports.SelectOption=D;exports.SelectTrigger=O;
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../Button/index.cjs`),n=require(`../../contexts/useSelect.cjs`),r=require(`./IconCheck.cjs`);let i=require(`@devup-ui/react`),a=require(`react/jsx-runtime`),o=require(`react`),s=require(`clsx`);s=e.__toESM(s);function c({type:e=`default`,children:t,defaultValue:r,value:s,onChange:c,defaultOpen:f,open:p,onOpenChange:m,colors:h,typography:g,options:_,triggerProps:v,containerProps:y,optionProps:b,...x}){let S=(0,o.useRef)(null),[C,w]=(0,o.useState)(f??!1),[T,E]=(0,o.useState)(r??(e===`checkbox`?[]:``));return(0,o.useEffect)(()=>{let e=e=>{S.current&&S.current.contains(e.target)||w(!1)};return document.addEventListener(`click`,e),()=>document.removeEventListener(`click`,e)},[C,w]),(0,a.jsx)(n.SelectContext.Provider,{value:{open:p??C,setOpen:e=>{m?.(e),w(e)},value:s??T,setValue:t=>{if(c?.(t),e!==`default`){if(e===`radio`){E(t);return}Array.isArray(T)&&T.includes(t)?E(T.filter(e=>e!==t)):E([...T,t])}},type:e,ref:S},children:(0,a.jsx)(i.Box,{ref:S,display:`inline-block`,h:`fit-content`,selectors:{"&, & *":{boxSizing:`border-box`}},styleOrder:1,styleVars:{primary:h?.primary,border:h?.border,inputBackground:h?.inputBackground,base10:h?.base10,title:h?.title,selectDisabled:h?.selectDisabled,primaryBg:h?.primaryBg,inputDisabledBackground:h?.inputDisabledBackground,inputDisabledText:h?.inputDisabledText},typography:g,...x,children:_?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(l,{...v,children:t}),(0,a.jsx)(u,{...y,children:_?.map(e=>(0,o.createElement)(d,{...b,...e,key:`option-`+e.value},e.label??e.value))})]}):t})})}function l({className:e,children:r,asChild:c,...l}){let{open:u,setOpen:d}=n.useSelect(),f=()=>{d(!u)};if(c){let e=o.Children.only(r),t=e.type;return(0,a.jsx)(t,{"aria-expanded":u,"aria-label":`Select toggle`,onClick:f,...e.props})}return(0,a.jsx)(t.Button,{"aria-expanded":u,"aria-label":`Select toggle`,className:(0,s.default)((0,i.css)({borderRadius:`8px`,styleOrder:2}),e),onClick:f,...l,children:r})}function u({children:e,showConfirmButton:r,confirmButtonText:o=`완료`,x:s=0,y:c=0,...l}){let{open:u,setOpen:d,type:f,ref:p}=n.useSelect();return u?(0,a.jsxs)(i.VStack,{ref:e=>{if(!p.current||!e)return;let t=p.current,n=()=>{let{height:n,x:r,y:i,top:a,left:o}=t.getBoundingClientRect(),l=e.offsetHeight+a+window.scrollY+n+c>document.documentElement.scrollHeight,u=e.offsetWidth+o+window.scrollX+s>document.documentElement.scrollWidth;l?e.style.bottom=`${window.innerHeight-i+10}px`:e.style.top=`${i+n+10+c}px`,u?e.style.left=`${Math.max(r-e.offsetWidth+t.offsetWidth,0)+s}px`:e.style.left=`${r+s}px`};return n(),window.addEventListener(`scroll`,n,!0),window.addEventListener(`resize`,n),()=>{window.removeEventListener(`scroll`,n,!0),window.removeEventListener(`resize`,n)}},"aria-label":`Select container`,bg:`var(--inputBg, light-dark(#FFF,#2E2E2E))`,border:`1px solid var(--border, light-dark(#E4E4E4,#434343))`,borderRadius:`8px`,bottom:`-4px`,boxShadow:`0 2px 2px 0 var(--base10, light-dark(#0000001A,#FFFFFF1A))`,boxSize:`fit-content`,gap:`6px`,minW:`232px`,p:`10px`,pos:`fixed`,styleOrder:1,userSelect:`none`,zIndex:1,...l,children:[e,r&&f===`checkbox`&&(0,a.jsx)(i.Flex,{justifyContent:`end`,w:`100%`,children:(0,a.jsx)(t.Button,{"aria-label":`Select confirm button`,className:(0,i.css)({textAlign:`end`,bg:`var(--primary, light-dark(#674DC7, #8163E1))`,borderRadius:`8px`,w:`fit-content`,px:`30px`,py:`10px`,color:`#FFF`,typography:`buttonS`}),onClick:()=>d(!1),variant:`primary`,children:o})})]}):null}function d({disabled:e,onClick:t,children:o,value:s,showCheck:c=!0,...l}){let{setOpen:u,setValue:d,value:f,type:p}=n.useSelect(),m=()=>{p!==`checkbox`&&u(!1)},h=(e,n)=>{if(t){t(e,n);return}typeof e==`string`&&d(e),m()},g={default:!1,radio:f===s,checkbox:Array.isArray(f)&&s&&f.includes(s)}[p],_=!e&&!(p===`radio`&&g);return(0,a.jsxs)(i.Flex,{_hover:_&&{bg:`var(--primaryBg, light-dark(#F4F3FA, #F4F3FA0D))`},alignItems:`center`,"aria-label":`Select option`,borderRadius:`6px`,color:e?`var(--selectDisabled, light-dark(#C4C5D1, #45464D))`:g?`var(--primary, light-dark(#674DC7, #8163E1)`:`var(--title, light-dark(#1A1A1A,#FAFAFA))`,cursor:_?`pointer`:`default`,"data-value":s,fontWeight:g?`700`:`400`,gap:{checkbox:`10px`,radio:`6px`,default:`0`}[p],h:`40px`,onClick:e?void 0:e=>h(s,e),px:`10px`,styleOrder:1,transition:`background-color 0.1s ease-in-out`,...l,children:[c&&{checkbox:(0,a.jsx)(i.Box,{bg:e?`var(--inputDisabledBackground, light-dark(#F0F0F3, #414244))`:g?`var(--primary, light-dark(#674DC7, #8163E1)`:`var(--border, light-dark(#E4E4E4, #434343))`,borderRadius:`4px`,boxSize:`18px`,pos:`relative`,transition:`background-color 0.1s ease-in-out`,children:g&&(0,a.jsx)(r.IconCheck,{className:(0,i.css)({color:e?`var(--inputDisabledText, light-dark(#E5E5E5, #373737))`:`#FFF`,position:`absolute`,top:`55%`,left:`50%`,transform:`translate(-50%, -50%)`})})}),radio:(0,a.jsx)(a.Fragment,{children:g&&(0,a.jsx)(i.Box,{borderRadius:`4px`,boxSize:`18px`,pos:`relative`,transition:`background-color 0.1s ease-in-out`,children:(0,a.jsx)(r.IconCheck,{className:(0,i.css)({position:`absolute`,top:`55%`,left:`50%`,transform:`translate(-50%, -50%)`,color:`inherit`})})})}),default:null}[p],o]})}function f({...e}){return(0,a.jsx)(i.Box,{bg:`var(--border, light-dark(#E4E4E4,#434343)`,h:`1px`,styleOrder:1,w:`100%`,...e})}exports.Select=c,exports.SelectContainer=u,exports.SelectDivider=f,exports.SelectOption=d,exports.SelectTrigger=l;