@devup-ui/components 0.1.44 → 0.1.45

package/dist/components/Select/index.cjs

@@ -1 +1 @@
-"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;
+"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,1);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;

package/dist/components/Stepper/index.cjs

@@ -1 +1 @@
-"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../Button/index.cjs`),n=require(`../Input/index.cjs`),r=require(`./IconMinus.cjs`),i=require(`./IconPlus.cjs`);let a=require(`@devup-ui/react`),o=require(`react/jsx-runtime`),s=require(`react`),c=require(`clsx`);c=e.__toESM(c);var l=(0,s.createContext)(null),u=()=>{let e=(0,s.useContext)(l);if(!e)throw Error(`useStepper must be used within a StepperProvider`);return e};function d({children:e,defaultValue:t,value:n,onValueChange:r,min:i=0,max:a=100,type:c=`input`}){let[u,d]=(0,s.useState)(t??0);return(0,o.jsx)(l.Provider,{value:{value:n??u,setValue:e=>{let t=Math.min(Math.max(e,i),a);if(r){r(t);return}d(t)},min:i,max:a,type:c},children:e})}function f(e){return(0,o.jsx)(a.Flex,{alignItems:`center`,gap:`8px`,styleOrder:1,...e})}function p({...e}){let{value:n,setValue:i,min:s}=u(),c=n<=s;return(0,o.jsx)(t.Button,{"aria-label":`Decrease button`,className:(0,a.css)({p:`0`,boxSize:`28px`,borderRadius:`4px`}),disabled:c,onClick:()=>i(n-1),...e,children:(0,o.jsx)(r.IconMinus,{className:(0,a.css)({color:c?`var(--base10, light-dark(#0000001A,#FFFFFF1A))`:`var(--text, light-dark(#272727, #F6F6F6))`})})})}function m({...e}){let{value:n,setValue:r,max:s}=u(),c=n>=s;return(0,o.jsx)(t.Button,{"aria-label":`Increase button`,className:(0,a.css)({p:`0`,boxSize:`28px`,borderRadius:`4px`,selectors:{"&>div>div":{}}}),disabled:c,onClick:()=>r(n+1),...e,children:(0,o.jsx)(i.IconPlus,{className:(0,a.css)({color:c?`var(--base10, light-dark(#0000001A,#FFFFFF1A))`:`var(--text, light-dark(#272727, #F6F6F6))`})})})}function h({className:e,...t}){let{value:r,setValue:i,type:s}=u(),l=(0,a.css)({p:`0`,border:`none`,w:`fit-content`,h:`fit-content`,styleOrder:3}),d=s===`input`,f=d?n.Input:`div`;return d&&Object.assign(t,{allowClear:!1}),(0,o.jsx)(f,{"aria-label":`Stepper value`,className:(0,c.default)((0,a.css)({styleOrder:2,w:`60px`,textAlign:`center`,borderRadius:`6px`,selectors:{"&::-webkit-outer-spin-button, &::-webkit-inner-spin-button":{display:`none`}}}),!d&&l,e),dangerouslySetInnerHTML:d?void 0:{__html:Number(r).toString()},"data-value":r,onChange:e=>{i(Number(e.target.value))},readOnly:!d,type:`number`,value:r.toString(),...t})}exports.Stepper=d,exports.StepperContainer=f,exports.StepperDecreaseButton=p,exports.StepperIncreaseButton=m,exports.StepperInput=h,exports.useStepper=u;
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../Button/index.cjs`),n=require(`../Input/index.cjs`),r=require(`./IconMinus.cjs`),i=require(`./IconPlus.cjs`);let a=require(`@devup-ui/react`),o=require(`react/jsx-runtime`),s=require(`react`),c=require(`clsx`);c=e.__toESM(c,1);var l=(0,s.createContext)(null),u=()=>{let e=(0,s.useContext)(l);if(!e)throw Error(`useStepper must be used within a StepperProvider`);return e};function d({children:e,defaultValue:t,value:n,onValueChange:r,min:i=0,max:a=100,type:c=`input`}){let[u,d]=(0,s.useState)(t??0);return(0,o.jsx)(l.Provider,{value:{value:n??u,setValue:e=>{let t=Math.min(Math.max(e,i),a);if(r){r(t);return}d(t)},min:i,max:a,type:c},children:e})}function f(e){return(0,o.jsx)(a.Flex,{alignItems:`center`,gap:`8px`,styleOrder:1,...e})}function p({...e}){let{value:n,setValue:i,min:s}=u(),c=n<=s;return(0,o.jsx)(t.Button,{"aria-label":`Decrease button`,className:(0,a.css)({p:`0`,boxSize:`28px`,borderRadius:`4px`}),disabled:c,onClick:()=>i(n-1),...e,children:(0,o.jsx)(r.IconMinus,{className:(0,a.css)({color:c?`var(--base10, light-dark(#0000001A,#FFFFFF1A))`:`var(--text, light-dark(#272727, #F6F6F6))`})})})}function m({...e}){let{value:n,setValue:r,max:s}=u(),c=n>=s;return(0,o.jsx)(t.Button,{"aria-label":`Increase button`,className:(0,a.css)({p:`0`,boxSize:`28px`,borderRadius:`4px`,selectors:{"&>div>div":{}}}),disabled:c,onClick:()=>r(n+1),...e,children:(0,o.jsx)(i.IconPlus,{className:(0,a.css)({color:c?`var(--base10, light-dark(#0000001A,#FFFFFF1A))`:`var(--text, light-dark(#272727, #F6F6F6))`})})})}function h({className:e,...t}){let{value:r,setValue:i,type:s}=u(),l=(0,a.css)({p:`0`,border:`none`,w:`fit-content`,h:`fit-content`,styleOrder:3}),d=s===`input`,f=d?n.Input:`div`;return d&&Object.assign(t,{allowClear:!1}),(0,o.jsx)(f,{"aria-label":`Stepper value`,className:(0,c.default)((0,a.css)({styleOrder:2,w:`60px`,textAlign:`center`,borderRadius:`6px`,selectors:{"&::-webkit-outer-spin-button, &::-webkit-inner-spin-button":{display:`none`}}}),!d&&l,e),dangerouslySetInnerHTML:d?void 0:{__html:Number(r).toString()},"data-value":r,onChange:e=>{i(Number(e.target.value))},readOnly:!d,type:`number`,value:r.toString(),...t})}exports.Stepper=d,exports.StepperContainer=f,exports.StepperDecreaseButton=p,exports.StepperIncreaseButton=m,exports.StepperInput=h,exports.useStepper=u;

package/package.json

@@ -16,7 +16,7 @@
     "css-in-js-framework",
     "react"
   ],
-  "version": "0.1.44",
+  "version": "0.1.45",
   "type": "module",
   "scripts": {
     "lint": "eslint",
@@ -43,12 +43,12 @@
   ],
   "types": "./dist/index.d.ts",
   "dependencies": {
-    "@devup-ui/react": "^1.0.35",
-    "react": "^19.2.4",
+    "@devup-ui/react": "^1.0.36",
+    "react": "^19.2.6",
     "clsx": "^2.1"
   },
   "devDependencies": {
-    "@devup-ui/vite-plugin": "^1.0.58",
+    "@devup-ui/vite-plugin": "^1.0.59",
     "@storybook/addon-docs": "^10.3",
     "@storybook/addon-onboarding": "^10.3",
     "@storybook/react-vite": "^10.3",
@@ -58,10 +58,10 @@
     "storybook": "^10.3",
     "typescript": "^6.0",
     "vite": "^8.0",
-    "vite-plugin-dts": "^4.5"
+    "vite-plugin-dts": "^5.0"
   },
   "peerDependencies": {
-    "@devup-ui/react": "^1.0.35",
+    "@devup-ui/react": "^1.0.36",
     "react": "*"
   }
 }