@wishket/design-system 1.16.2 → 1.16.4

package/dist/Components/Navigations/TextTab/TextTab.parts.js

@@ -1,9 +1,10 @@
-"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useContext as r,createContext as n,useRef as a,Children as o,useState as s,useEffect as l}from"react";import{twMerge as i,twJoin as c}from"tailwind-merge";import{Typography as u}from"../../Base/Typography/Typography.js";import{Box as d}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";import{SystemIcon as m}from"../../DataDisplays/SystemIcon/SystemIcon.js";import"../../DataDisplays/SystemIcon/SystemIcon.constants.js";import{CountBadge as f}from"../../DataDisplays/CountBadge/CountBadge.js";function b(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function p(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){b(e,t,r[t])}))}return e}function y(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const g=/*#__PURE__*/n({barColor:"bg-w-gray-900",activeTab:0,currentActiveTab:0,isFit:!0,hasPadding:!1,isFull:!1,handleTabClick:e=>{}}),h=({children:t,currentActiveTab:r=0,isFit:n=!0,hasPadding:a=!1,isFull:o=!1,barColor:i="bg-w-gray-900",onChange:c})=>{const[u,d]=s(r);return l((()=>{r!==u&&d(r);
+"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useContext as r,createContext as n,useRef as a,Children as o,useState as s,useEffect as l}from"react";import{twMerge as i,twJoin as c}from"tailwind-merge";import{Typography as u}from"../../Base/Typography/Typography.js";import{Box as d}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";import{SystemIcon as m}from"../../DataDisplays/SystemIcon/SystemIcon.js";import"../../DataDisplays/SystemIcon/SystemIcon.constants.js";import{CountBadge as f}from"../../DataDisplays/CountBadge/CountBadge.js";import{Divider as b}from"../../DataDisplays/Divider/Divider.js";function p(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function y(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){p(e,t,r[t])}))}return e}function g(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const h=/*#__PURE__*/n({barColor:"bg-w-gray-900",activeTab:0,currentActiveTab:0,isFit:!0,hasPadding:!1,isFull:!1,handleTabClick:e=>{}}),x=({children:t,currentActiveTab:r=0,isFit:n=!0,hasPadding:a=!1,isFull:o=!1,barColor:i="bg-w-gray-900",onChange:c})=>{const[u,d]=s(r);return l((()=>{r!==u&&d(r);
 // eslint-disable-next-line react-hooks/exhaustive-deps
-}),[r]),/*#__PURE__*/e(g.Provider,{value:{barColor:i,activeTab:u,currentActiveTab:r,isFit:n,hasPadding:a,handleTabClick:e=>{e!==u&&(null==c||c(e),d(e))},isFull:o},children:t})},x=({children:n,className:u})=>{const{activeTab:m,hasPadding:f,isFull:b,barColor:p}=r(g),y=a([]),h=a(null),x=a(null),w=o.toArray(n),[v,j]=s(!1),[O,T]=s(!1),[P,N]=s({x:0,scrollLeft:0});return l((()=>{if(!y.current[m]||!h.current)return;const e=y.current[m],t=h.current,r=x.current;if(e&&t&&r){const{offsetLeft:n,offsetWidth:a}=e,{scrollLeft:o,clientWidth:s}=r;t.style.width=`${a}px`,t.style.transform=`translateX(${n}px)`;if(!(o<=n&&o+s>=n+a)){const t=setTimeout((()=>{e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})}),0);return()=>clearTimeout(t)}}}),[m]),l((()=>(document.addEventListener("resize",(()=>{if(x.current){const e=x.current.scrollWidth>x.current.clientWidth;j(e)}})),()=>{document.removeEventListener("resize",(()=>{}))})),[]),/*#__PURE__*/e(d,{ref:x,className:c("block w-full touch-pan-x items-start overflow-x-scroll scrollbar-hide",v&&"scrollbar-list",f&&"px-9",u),"data-testid":"design-system-textTab--container",onMouseDown:e=>{x.current&&(T(!0),N({x:e.pageX,scrollLeft:x.current.scrollLeft}))},onMouseMove:e=>{if(!O||!x.current)return;e.preventDefault();const t=e.pageX-P.x;x.current.scrollLeft=P.scrollLeft-t},onMouseUp:()=>{T(!1)},onMouseLeave:()=>{T(!1)},children:/*#__PURE__*/t(d,{className:i("relative w-full border-b border-w-gray-200",v&&"w-max"),"data-testid":"design-system-textTab--inner-container",children:[
-/*#__PURE__*/e(d,{className:i("inline-flex w-max gap-10",b&&"w-full gap-0"),children:w.map(((t,r)=>/*#__PURE__*/e(d,{className:i(b&&"w-full"),ref:e=>{y.current[r]=e},children:t},r)))}),
-/*#__PURE__*/e("span",{ref:h,"data-testid":`design-system-textTab--underbar-${m}`,className:c("absolute bottom-0 left-0 h-0.5 rounded-t-lg transition-all duration-300 ease-out",p)})]})})},w=({children:n,index:a,className:o,disabled:s=!1,badgeNumber:l,iconName:c,href:b})=>{const{isFit:h,handleTabClick:x,activeTab:w,isFull:v}=r(g),j=a===w,O={tabIndex:0,"data-testid":`design-system-textTab--item-${a}`,className:i("group flex w-max cursor-pointer items-center rounded-xl hover:font-medium",s&&"cursor-not-allowed",v&&"w-full",o),onClick:()=>{!s&&x(a)}},T=/*#__PURE__*/t(d,{className:i("relative flex w-full select-none flex-row items-center justify-center gap-2 py-4 font-normal text-w-gray-600 group-hover:text-w-gray-900",!h&&"px-[33.5px]",v&&"w-full px-0",j&&"font-medium text-w-gray-900"),children:[c&&/*#__PURE__*/e(d,{className:"flex size-4 flex-shrink-0 items-center justify-center",children:/*#__PURE__*/e(m,{name:c,className:i("size-4 text-w-gray-600 group-hover:text-w-gray-900",j&&"text-w-gray-900")})}),
-/*#__PURE__*/e(u,{variant:"body1",className:"relative",children:n}),void 0!==l&&/*#__PURE__*/e(f,{text:l,showZero:!0,className:"relative",variant:"gray"})]});return b?/*#__PURE__*/e("a",y(p({href:b},O),{children:T})):/*#__PURE__*/e(d,y(p({},O),{children:T}))},v=({children:t,index:n})=>{const{activeTab:a}=r(g);return a===n&&/*#__PURE__*/e(d,{"data-testid":"design-system-textTab--content",children:t})};
+}),[r]),/*#__PURE__*/e(h.Provider,{value:{barColor:i,activeTab:u,currentActiveTab:r,isFit:n,hasPadding:a,handleTabClick:e=>{e!==u&&(null==c||c(e),d(e))},isFull:o},children:t})},w=({children:n,className:u})=>{const{activeTab:m,hasPadding:f,isFull:p,barColor:y}=r(h),g=a([]),x=a(null),w=a(null),v=o.toArray(n),[j,O]=s(!1),[T,D]=s(!1),[N,P]=s({x:0,scrollLeft:0});return l((()=>{if(!g.current[m]||!x.current)return;const e=g.current[m],t=x.current,r=w.current;if(e&&t&&r){const{offsetLeft:n,offsetWidth:a}=e,{scrollLeft:o,clientWidth:s}=r;t.style.width=`${a}px`,t.style.transform=`translateX(${n}px)`;if(!(o<=n&&o+s>=n+a)){const t=setTimeout((()=>{e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})}),0);return()=>clearTimeout(t)}}}),[m]),l((()=>(document.addEventListener("resize",(()=>{if(w.current){const e=w.current.scrollWidth>w.current.clientWidth;O(e)}})),()=>{document.removeEventListener("resize",(()=>{}))})),[]),/*#__PURE__*/t(d,{ref:w,className:c("block w-full touch-pan-x items-start overflow-x-scroll scrollbar-hide",j&&"scrollbar-list",f&&"relative px-9",u),"data-testid":"design-system-textTab--container",onMouseDown:e=>{w.current&&(D(!0),P({x:e.pageX,scrollLeft:w.current.scrollLeft}))},onMouseMove:e=>{if(!T||!w.current)return;e.preventDefault();const t=e.pageX-N.x;w.current.scrollLeft=N.scrollLeft-t},onMouseUp:()=>{D(!1)},onMouseLeave:()=>{D(!1)},children:[
+/*#__PURE__*/t(d,{className:i("relative w-full border-b border-w-gray-200",j&&"w-max"),"data-testid":"design-system-textTab--inner-container",children:[
+/*#__PURE__*/e(d,{className:i("inline-flex w-max gap-10",p&&"w-full gap-0"),children:v.map(((t,r)=>/*#__PURE__*/e(d,{className:i(p&&"w-full"),ref:e=>{g.current[r]=e},children:t},r)))}),
+/*#__PURE__*/e("span",{ref:x,"data-testid":`design-system-textTab--underbar-${m}`,className:c("absolute bottom-0 left-0 h-0.5 rounded-t-lg transition-all duration-300 ease-out",y)})]}),f&&/*#__PURE__*/e(b,{className:"absolute bottom-px left-0 h-px w-full"})]})},v=({children:n,index:a,className:o,disabled:s=!1,badgeNumber:l,iconName:c,href:b})=>{const{isFit:p,handleTabClick:x,activeTab:w,isFull:v}=r(h),j=a===w,O={tabIndex:0,"data-testid":`design-system-textTab--item-${a}`,className:i("group flex w-max cursor-pointer items-center rounded-xl hover:font-medium",s&&"cursor-not-allowed",v&&"w-full",o),onClick:()=>{!s&&x(a)}},T=/*#__PURE__*/t(d,{className:i("relative flex w-full select-none flex-row items-center justify-center gap-2 py-4 font-normal text-w-gray-600 group-hover:text-w-gray-900",!p&&"px-[33.5px]",v&&"w-full px-0",j&&"font-medium text-w-gray-900"),children:[c&&/*#__PURE__*/e(d,{className:"flex size-4 flex-shrink-0 items-center justify-center",children:/*#__PURE__*/e(m,{name:c,className:i("size-4 text-w-gray-600 group-hover:text-w-gray-900",j&&"text-w-gray-900")})}),
+/*#__PURE__*/e(u,{variant:"body1",className:"relative",children:n}),void 0!==l&&/*#__PURE__*/e(f,{text:l,showZero:!0,className:"relative",variant:"gray"})]});return b?/*#__PURE__*/e("a",g(y({href:b},O),{children:T})):/*#__PURE__*/e(d,g(y({},O),{children:T}))},j=({children:t,index:n})=>{const{activeTab:a}=r(h);return a===n&&/*#__PURE__*/e(d,{"data-testid":"design-system-textTab--content",children:t})};
 /**
  * TextTab의 Root 컴포넌트입니다.
  * TextTab의 상태를 관리합니다.
@@ -26,4 +27,4 @@
  *   <TextTab.Panel index={0}>첫 번째 패널 내용</TextTab.Panel>
  *   <TextTab.Panel index={1}>두 번째 패널 내용</TextTab.Panel>
  * </TextTab.Root>
- */export{v as Panel,h as Root,w as Tab,x as Tabs};
+ */export{j as Panel,x as Root,v as Tab,w as Tabs};

package/dist/Components/Utils/BottomModalContainer/BottomModalContainer.d.ts

@@ -2,6 +2,7 @@ import { PropsWithChildren } from 'react';
 export interface BottomModalContainerProps extends PropsWithChildren {
     onClose: () => void;
     isFixedHeight?: boolean;
+    className?: string;
 }
-declare const BottomModalContainer: ({ children, onClose, isFixedHeight, }: BottomModalContainerProps) => import("react/jsx-runtime").JSX.Element;
+declare const BottomModalContainer: ({ children, onClose, isFixedHeight, className, }: BottomModalContainerProps) => import("react/jsx-runtime").JSX.Element;
 export { BottomModalContainer };

package/dist/Components/Utils/BottomModalContainer/BottomModalContainer.js

@@ -1,3 +1,3 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{twJoin as o}from"tailwind-merge";import{Box as r}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";import{useBottomModalContainer as s}from"./useBottomModalContainer.js";const a=({children:a,onClose:l,isFixedHeight:n=!0})=>{const{containerRef:i,currentTranslate:d}=s({onClose:l});/*#__PURE__*/
-return e(r,{ref:i,style:{transform:`translateY(${d}px)`},className:o("z-30 w-full rounded-t-3xl bg-w-white",n?"h-[60dvh]":"h-fit"),"data-testid":"design-system--bottom-modal-container",children:[
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{twJoin as o}from"tailwind-merge";import{Box as r}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";import{useBottomModalContainer as s}from"./useBottomModalContainer.js";const a=({children:a,onClose:l,isFixedHeight:n=!0,className:i})=>{const{containerRef:m,currentTranslate:d}=s({onClose:l});/*#__PURE__*/
+return e(r,{ref:m,style:{transform:`translateY(${d}px)`},className:o("z-30 w-full rounded-t-3xl bg-w-white",n?"h-[60dvh]":"h-fit",i),"data-testid":"design-system--bottom-modal-container",children:[
 /*#__PURE__*/t(r,{className:"flex items-center justify-center pb-5 pt-2","data-testid":"design-system--bottom-modal-container-header",id:"bottom-modal-header",children:/*#__PURE__*/t(r,{className:"h-1 w-8 rounded-full bg-w-gray-200"})}),a]})};export{a as BottomModalContainer};

package/dist/Components/Utils/FullModalContainer/FullModalContainer.d.ts

@@ -1,3 +1,6 @@
 import { PropsWithChildren } from 'react';
-declare const FullModalContainer: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
+interface FullModalContainerProps extends PropsWithChildren {
+    className?: string;
+}
+declare const FullModalContainer: ({ children, className, }: FullModalContainerProps) => import("react/jsx-runtime").JSX.Element;
 export { FullModalContainer };

package/dist/Components/Utils/FullModalContainer/FullModalContainer.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import"tailwind-merge";import{Box as t}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";const o=({children:o})=>/*#__PURE__*/e(t,{"data-testid":"design-system--full-modal-container",className:"h-dvh w-dvw overflow-auto bg-w-white",children:o});export{o as FullModalContainer};
+import{jsx as e}from"react/jsx-runtime";import{twMerge as o}from"tailwind-merge";import{Box as t}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";const s=({children:s,className:a})=>/*#__PURE__*/e(t,{"data-testid":"design-system--full-modal-container",className:o("h-dvh w-dvw overflow-auto bg-w-white",a),children:s});export{s as FullModalContainer};

package/dist/Components/Utils/Modal/Modal.d.ts

@@ -10,6 +10,7 @@ export interface ModalProps extends PropsWithChildren {
     isFixedHeight?: boolean;
     isPreventScroll?: boolean;
     needCleanup?: boolean;
+    className?: string;
     onClose?: () => void;
 }
 /**
@@ -26,6 +27,7 @@ export interface ModalProps extends PropsWithChildren {
  * @param {boolean} [props.isFixedHeight] - 바텀 시트 모달의 고정 높이 사용 여부를 결정합니다
  * @param {boolean} [props.isPreventScroll=true] - 모달 외부 스크롤 방지 여부를 결정합니다
  * @param {boolean} [props.needCleanup=true] - 모달이 닫힐 때 Portal 정리 여부를 결정합니다
+ * @param {string} [props.className] - 모달 컨테이너에 적용될 클래스 이름입니다
  * @param {() => void} [props.onClose] - 모달이 닫힐 때 실행될 콜백 함수입니다
  * @param {React.ReactNode} props.children - 모달 내부에 표시될 컨텐츠입니다
  *
@@ -45,5 +47,5 @@ export interface ModalProps extends PropsWithChildren {
  *   <div>바텀 시트 내용</div>
  * </Modal>
  */
-declare const Modal: ({ isOpen, rootId, variant, size, overflow, isBackgroundBlack, isFixedHeight, isPreventScroll, onClose, needCleanup, children, }: ModalProps) => import("react/jsx-runtime").JSX.Element;
+declare const Modal: ({ isOpen, rootId, variant, size, overflow, isBackgroundBlack, isFixedHeight, isPreventScroll, className, onClose, needCleanup, children, }: ModalProps) => import("react/jsx-runtime").JSX.Element;
 export { Modal };

package/dist/Components/Utils/Modal/Modal.js

@@ -1,4 +1,4 @@
-import{jsx as o,jsxs as e}from"react/jsx-runtime";import{BackDropLiftContainer as l}from"../BackDropLiftContainer/BackDropLiftContainer.js";import{BottomModalContainer as r}from"../BottomModalContainer/BottomModalContainer.js";import{FullModalContainer as t}from"../FullModalContainer/FullModalContainer.js";import{ModalContainer as i}from"../ModalContainer/ModalContainer.js";import{Portal as n}from"../Portal/Portal.js";import"tailwind-merge";import{Box as a}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";
+import{jsx as o,jsxs as e}from"react/jsx-runtime";import{twMerge as l}from"tailwind-merge";import{BackDropLiftContainer as t}from"../BackDropLiftContainer/BackDropLiftContainer.js";import{BottomModalContainer as r}from"../BottomModalContainer/BottomModalContainer.js";import{FullModalContainer as i}from"../FullModalContainer/FullModalContainer.js";import{ModalContainer as a}from"../ModalContainer/ModalContainer.js";import{Portal as n}from"../Portal/Portal.js";import{Box as s}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";
 /**
  * 모달 창을 표시하는 컴포넌트입니다.
  *
@@ -13,6 +13,7 @@ import{jsx as o,jsxs as e}from"react/jsx-runtime";import{BackDropLiftContainer a
  * @param {boolean} [props.isFixedHeight] - 바텀 시트 모달의 고정 높이 사용 여부를 결정합니다
  * @param {boolean} [props.isPreventScroll=true] - 모달 외부 스크롤 방지 여부를 결정합니다
  * @param {boolean} [props.needCleanup=true] - 모달이 닫힐 때 Portal 정리 여부를 결정합니다
+ * @param {string} [props.className] - 모달 컨테이너에 적용될 클래스 이름입니다
  * @param {() => void} [props.onClose] - 모달이 닫힐 때 실행될 콜백 함수입니다
  * @param {React.ReactNode} props.children - 모달 내부에 표시될 컨텐츠입니다
  *
@@ -31,5 +32,5 @@ import{jsx as o,jsxs as e}from"react/jsx-runtime";import{BackDropLiftContainer a
  * <Modal isOpen={isOpen} variant="bottom" onClose={handleClose}>
  *   <div>바텀 시트 내용</div>
  * </Modal>
- */const s=({isOpen:s,rootId:d,variant:m="default",size:u="md",overflow:c="auto",isBackgroundBlack:f=!0,isFixedHeight:p,isPreventScroll:B=!0,onClose:C,needCleanup:h=!0,children:j})=>{const x="bottom"===m,F="full"===m;/*#__PURE__*/
-return o(n,{rootId:d,needCleanup:h&&!d,children:/*#__PURE__*/e(l,{isOpen:s,onClose:C,testId:"design-system--modal",isBackgroundBlack:f,isPreventScroll:B,isBottomSheet:x,isFullSize:"full"===u,children:["default"===m&&/*#__PURE__*/o(a,{className:"full"===u?"w-full px-5":"",children:/*#__PURE__*/o(i,{size:u,overflow:c,children:j})}),F&&/*#__PURE__*/o(t,{children:j}),x&&C&&/*#__PURE__*/o(r,{onClose:C,isFixedHeight:p,children:j})]})})};export{s as Modal};
+ */const d=({isOpen:d,rootId:m,variant:c="default",size:u="md",overflow:f="auto",isBackgroundBlack:p=!0,isFixedHeight:B,isPreventScroll:C=!0,className:h,onClose:j,needCleanup:x=!0,children:g})=>{const F="bottom"===c,k="full"===c;/*#__PURE__*/
+return o(n,{rootId:m,needCleanup:x&&!m,children:/*#__PURE__*/e(t,{isOpen:d,onClose:j,testId:"design-system--modal",isBackgroundBlack:p,isPreventScroll:C,isBottomSheet:F,isFullSize:"full"===u,children:["default"===c&&/*#__PURE__*/o(s,{"data-testid":"design-system--modal-container--box",className:l("full"===u&&"w-full px-5",h),children:/*#__PURE__*/o(a,{size:u,overflow:f,children:g})}),k&&/*#__PURE__*/o(i,{className:h,children:g}),F&&j&&/*#__PURE__*/o(r,{onClose:j,isFixedHeight:B,className:h,children:g})]})})};export{d as Modal};

package/dist/cjs/Components/Navigations/TextTab/TextTab.parts.js

@@ -1,4 +1,4 @@
-"use client";"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("tailwind-merge"),s=require("../../Base/Typography/Typography.js"),n=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");var a=require("../../DataDisplays/SystemIcon/SystemIcon.js");require("../../DataDisplays/SystemIcon/SystemIcon.constants.js");var o=require("../../DataDisplays/CountBadge/CountBadge.js");function l(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function i(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},s=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(s=s.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),s.forEach((function(t){l(e,t,r[t])}))}return e}function c(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const u=/*#__PURE__*/t.createContext({barColor:"bg-w-gray-900",activeTab:0,currentActiveTab:0,isFit:!0,hasPadding:!1,isFull:!1,handleTabClick:e=>{}});
+"use client";"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("tailwind-merge"),s=require("../../Base/Typography/Typography.js"),a=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");var n=require("../../DataDisplays/SystemIcon/SystemIcon.js");require("../../DataDisplays/SystemIcon/SystemIcon.constants.js");var o=require("../../DataDisplays/CountBadge/CountBadge.js"),l=require("../../DataDisplays/Divider/Divider.js");function i(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function c(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},s=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(s=s.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),s.forEach((function(t){i(e,t,r[t])}))}return e}function u(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const d=/*#__PURE__*/t.createContext({barColor:"bg-w-gray-900",activeTab:0,currentActiveTab:0,isFit:!0,hasPadding:!1,isFull:!1,handleTabClick:e=>{}});
 /**
  * TextTab의 Root 컴포넌트입니다.
  * TextTab의 상태를 관리합니다.
@@ -21,9 +21,10 @@
  *   <TextTab.Panel index={0}>첫 번째 패널 내용</TextTab.Panel>
  *   <TextTab.Panel index={1}>두 번째 패널 내용</TextTab.Panel>
  * </TextTab.Root>
- */exports.Panel=({children:r,index:s})=>{const{activeTab:a}=t.useContext(u);return a===s&&/*#__PURE__*/e.jsx(n.Box,{"data-testid":"design-system-textTab--content",children:r})},exports.Root=({children:r,currentActiveTab:s=0,isFit:n=!0,hasPadding:a=!1,isFull:o=!1,barColor:l="bg-w-gray-900",onChange:i})=>{const[c,d]=t.useState(s);return t.useEffect((()=>{s!==c&&d(s);
+ */exports.Panel=({children:r,index:s})=>{const{activeTab:n}=t.useContext(d);return n===s&&/*#__PURE__*/e.jsx(a.Box,{"data-testid":"design-system-textTab--content",children:r})},exports.Root=({children:r,currentActiveTab:s=0,isFit:a=!0,hasPadding:n=!1,isFull:o=!1,barColor:l="bg-w-gray-900",onChange:i})=>{const[c,u]=t.useState(s);return t.useEffect((()=>{s!==c&&u(s);
 // eslint-disable-next-line react-hooks/exhaustive-deps
-}),[s]),/*#__PURE__*/e.jsx(u.Provider,{value:{barColor:l,activeTab:c,currentActiveTab:s,isFit:n,hasPadding:a,handleTabClick:e=>{e!==c&&(null==i||i(e),d(e))},isFull:o},children:r})},exports.Tab=({children:l,index:d,className:f,disabled:x=!1,badgeNumber:b,iconName:m,href:y})=>{const{isFit:g,handleTabClick:p,activeTab:h,isFull:w}=t.useContext(u),j=d===h,v={tabIndex:0,"data-testid":`design-system-textTab--item-${d}`,className:r.twMerge("group flex w-max cursor-pointer items-center rounded-xl hover:font-medium",x&&"cursor-not-allowed",w&&"w-full",f),onClick:()=>{!x&&p(d)}},T=/*#__PURE__*/e.jsxs(n.Box,{className:r.twMerge("relative flex w-full select-none flex-row items-center justify-center gap-2 py-4 font-normal text-w-gray-600 group-hover:text-w-gray-900",!g&&"px-[33.5px]",w&&"w-full px-0",j&&"font-medium text-w-gray-900"),children:[m&&/*#__PURE__*/e.jsx(n.Box,{className:"flex size-4 flex-shrink-0 items-center justify-center",children:/*#__PURE__*/e.jsx(a.SystemIcon,{name:m,className:r.twMerge("size-4 text-w-gray-600 group-hover:text-w-gray-900",j&&"text-w-gray-900")})}),
-/*#__PURE__*/e.jsx(s.Typography,{variant:"body1",className:"relative",children:l}),void 0!==b&&/*#__PURE__*/e.jsx(o.CountBadge,{text:b,showZero:!0,className:"relative",variant:"gray"})]});return y?/*#__PURE__*/e.jsx("a",c(i({href:y},v),{children:T})):/*#__PURE__*/e.jsx(n.Box,c(i({},v),{children:T}))},exports.Tabs=({children:s,className:a})=>{const{activeTab:o,hasPadding:l,isFull:i,barColor:c}=t.useContext(u),d=t.useRef([]),f=t.useRef(null),x=t.useRef(null),b=t.Children.toArray(s),[m,y]=t.useState(!1),[g,p]=t.useState(!1),[h,w]=t.useState({x:0,scrollLeft:0});return t.useEffect((()=>{if(!d.current[o]||!f.current)return;const e=d.current[o],t=f.current,r=x.current;if(e&&t&&r){const{offsetLeft:s,offsetWidth:n}=e,{scrollLeft:a,clientWidth:o}=r;t.style.width=`${n}px`,t.style.transform=`translateX(${s}px)`;if(!(a<=s&&a+o>=s+n)){const t=setTimeout((()=>{e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})}),0);return()=>clearTimeout(t)}}}),[o]),t.useEffect((()=>(document.addEventListener("resize",(()=>{if(x.current){const e=x.current.scrollWidth>x.current.clientWidth;y(e)}})),()=>{document.removeEventListener("resize",(()=>{}))})),[]),/*#__PURE__*/e.jsx(n.Box,{ref:x,className:r.twJoin("block w-full touch-pan-x items-start overflow-x-scroll scrollbar-hide",m&&"scrollbar-list",l&&"px-9",a),"data-testid":"design-system-textTab--container",onMouseDown:e=>{x.current&&(p(!0),w({x:e.pageX,scrollLeft:x.current.scrollLeft}))},onMouseMove:e=>{if(!g||!x.current)return;e.preventDefault();const t=e.pageX-h.x;x.current.scrollLeft=h.scrollLeft-t},onMouseUp:()=>{p(!1)},onMouseLeave:()=>{p(!1)},children:/*#__PURE__*/e.jsxs(n.Box,{className:r.twMerge("relative w-full border-b border-w-gray-200",m&&"w-max"),"data-testid":"design-system-textTab--inner-container",children:[
-/*#__PURE__*/e.jsx(n.Box,{className:r.twMerge("inline-flex w-max gap-10",i&&"w-full gap-0"),children:b.map(((t,s)=>/*#__PURE__*/e.jsx(n.Box,{className:r.twMerge(i&&"w-full"),ref:e=>{d.current[s]=e},children:t},s)))}),
-/*#__PURE__*/e.jsx("span",{ref:f,"data-testid":`design-system-textTab--underbar-${o}`,className:r.twJoin("absolute bottom-0 left-0 h-0.5 rounded-t-lg transition-all duration-300 ease-out",c)})]})})};
+}),[s]),/*#__PURE__*/e.jsx(d.Provider,{value:{barColor:l,activeTab:c,currentActiveTab:s,isFit:a,hasPadding:n,handleTabClick:e=>{e!==c&&(null==i||i(e),u(e))},isFull:o},children:r})},exports.Tab=({children:l,index:i,className:f,disabled:x=!1,badgeNumber:b,iconName:m,href:y})=>{const{isFit:p,handleTabClick:g,activeTab:h,isFull:w}=t.useContext(d),v=i===h,j={tabIndex:0,"data-testid":`design-system-textTab--item-${i}`,className:r.twMerge("group flex w-max cursor-pointer items-center rounded-xl hover:font-medium",x&&"cursor-not-allowed",w&&"w-full",f),onClick:()=>{!x&&g(i)}},T=/*#__PURE__*/e.jsxs(a.Box,{className:r.twMerge("relative flex w-full select-none flex-row items-center justify-center gap-2 py-4 font-normal text-w-gray-600 group-hover:text-w-gray-900",!p&&"px-[33.5px]",w&&"w-full px-0",v&&"font-medium text-w-gray-900"),children:[m&&/*#__PURE__*/e.jsx(a.Box,{className:"flex size-4 flex-shrink-0 items-center justify-center",children:/*#__PURE__*/e.jsx(n.SystemIcon,{name:m,className:r.twMerge("size-4 text-w-gray-600 group-hover:text-w-gray-900",v&&"text-w-gray-900")})}),
+/*#__PURE__*/e.jsx(s.Typography,{variant:"body1",className:"relative",children:l}),void 0!==b&&/*#__PURE__*/e.jsx(o.CountBadge,{text:b,showZero:!0,className:"relative",variant:"gray"})]});return y?/*#__PURE__*/e.jsx("a",u(c({href:y},j),{children:T})):/*#__PURE__*/e.jsx(a.Box,u(c({},j),{children:T}))},exports.Tabs=({children:s,className:n})=>{const{activeTab:o,hasPadding:i,isFull:c,barColor:u}=t.useContext(d),f=t.useRef([]),x=t.useRef(null),b=t.useRef(null),m=t.Children.toArray(s),[y,p]=t.useState(!1),[g,h]=t.useState(!1),[w,v]=t.useState({x:0,scrollLeft:0});return t.useEffect((()=>{if(!f.current[o]||!x.current)return;const e=f.current[o],t=x.current,r=b.current;if(e&&t&&r){const{offsetLeft:s,offsetWidth:a}=e,{scrollLeft:n,clientWidth:o}=r;t.style.width=`${a}px`,t.style.transform=`translateX(${s}px)`;if(!(n<=s&&n+o>=s+a)){const t=setTimeout((()=>{e.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})}),0);return()=>clearTimeout(t)}}}),[o]),t.useEffect((()=>(document.addEventListener("resize",(()=>{if(b.current){const e=b.current.scrollWidth>b.current.clientWidth;p(e)}})),()=>{document.removeEventListener("resize",(()=>{}))})),[]),/*#__PURE__*/e.jsxs(a.Box,{ref:b,className:r.twJoin("block w-full touch-pan-x items-start overflow-x-scroll scrollbar-hide",y&&"scrollbar-list",i&&"relative px-9",n),"data-testid":"design-system-textTab--container",onMouseDown:e=>{b.current&&(h(!0),v({x:e.pageX,scrollLeft:b.current.scrollLeft}))},onMouseMove:e=>{if(!g||!b.current)return;e.preventDefault();const t=e.pageX-w.x;b.current.scrollLeft=w.scrollLeft-t},onMouseUp:()=>{h(!1)},onMouseLeave:()=>{h(!1)},children:[
+/*#__PURE__*/e.jsxs(a.Box,{className:r.twMerge("relative w-full border-b border-w-gray-200",y&&"w-max"),"data-testid":"design-system-textTab--inner-container",children:[
+/*#__PURE__*/e.jsx(a.Box,{className:r.twMerge("inline-flex w-max gap-10",c&&"w-full gap-0"),children:m.map(((t,s)=>/*#__PURE__*/e.jsx(a.Box,{className:r.twMerge(c&&"w-full"),ref:e=>{f.current[s]=e},children:t},s)))}),
+/*#__PURE__*/e.jsx("span",{ref:x,"data-testid":`design-system-textTab--underbar-${o}`,className:r.twJoin("absolute bottom-0 left-0 h-0.5 rounded-t-lg transition-all duration-300 ease-out",u)})]}),i&&/*#__PURE__*/e.jsx(l.Divider,{className:"absolute bottom-px left-0 h-px w-full"})]})};

package/dist/cjs/Components/Utils/BottomModalContainer/BottomModalContainer.js

@@ -1,3 +1,3 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),r=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");var o=require("./useBottomModalContainer.js");exports.BottomModalContainer=({children:s,onClose:a,isFixedHeight:n=!0})=>{const{containerRef:i,currentTranslate:l}=o.useBottomModalContainer({onClose:a});/*#__PURE__*/
-return e.jsxs(r.Box,{ref:i,style:{transform:`translateY(${l}px)`},className:t.twJoin("z-30 w-full rounded-t-3xl bg-w-white",n?"h-[60dvh]":"h-fit"),"data-testid":"design-system--bottom-modal-container",children:[
-/*#__PURE__*/e.jsx(r.Box,{className:"flex items-center justify-center pb-5 pt-2","data-testid":"design-system--bottom-modal-container-header",id:"bottom-modal-header",children:/*#__PURE__*/e.jsx(r.Box,{className:"h-1 w-8 rounded-full bg-w-gray-200"})}),s]})};
+"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),s=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");var r=require("./useBottomModalContainer.js");exports.BottomModalContainer=({children:o,onClose:a,isFixedHeight:n=!0,className:i})=>{const{containerRef:l,currentTranslate:d}=r.useBottomModalContainer({onClose:a});/*#__PURE__*/
+return e.jsxs(s.Box,{ref:l,style:{transform:`translateY(${d}px)`},className:t.twJoin("z-30 w-full rounded-t-3xl bg-w-white",n?"h-[60dvh]":"h-fit",i),"data-testid":"design-system--bottom-modal-container",children:[
+/*#__PURE__*/e.jsx(s.Box,{className:"flex items-center justify-center pb-5 pt-2","data-testid":"design-system--bottom-modal-container-header",id:"bottom-modal-header",children:/*#__PURE__*/e.jsx(s.Box,{className:"h-1 w-8 rounded-full bg-w-gray-200"})}),o]})};

package/dist/cjs/Components/Utils/FullModalContainer/FullModalContainer.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime");require("tailwind-merge");var r=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");exports.FullModalContainer=({children:a})=>/*#__PURE__*/e.jsx(r.Box,{"data-testid":"design-system--full-modal-container",className:"h-dvh w-dvw overflow-auto bg-w-white",children:a});
+"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),s=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");exports.FullModalContainer=({children:a,className:l})=>/*#__PURE__*/e.jsx(s.Box,{"data-testid":"design-system--full-modal-container",className:r.twMerge("h-dvh w-dvw overflow-auto bg-w-white",l),children:a});

package/dist/cjs/Components/Utils/Modal/Modal.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),o=require("../BackDropLiftContainer/BackDropLiftContainer.js"),r=require("../BottomModalContainer/BottomModalContainer.js"),l=require("../FullModalContainer/FullModalContainer.js"),i=require("../ModalContainer/ModalContainer.js"),t=require("../Portal/Portal.js");require("tailwind-merge");var a=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");exports.Modal=({isOpen:n,rootId:s,variant:d="default",size:u="md",overflow:c="auto",isBackgroundBlack:B=!0,isFixedHeight:C,isPreventScroll:j=!0,onClose:x,needCleanup:f=!0,children:m})=>{const h="bottom"===d,M="full"===d,p="default"===d,q=f&&!s;/*#__PURE__*/
-return e.jsx(t.Portal,{rootId:s,needCleanup:q,children:/*#__PURE__*/e.jsxs(o.BackDropLiftContainer,{isOpen:n,onClose:x,testId:"design-system--modal",isBackgroundBlack:B,isPreventScroll:j,isBottomSheet:h,isFullSize:"full"===u,children:[p&&/*#__PURE__*/e.jsx(a.Box,{className:"full"===u?"w-full px-5":"",children:/*#__PURE__*/e.jsx(i.ModalContainer,{size:u,overflow:c,children:m})}),M&&/*#__PURE__*/e.jsx(l.FullModalContainer,{children:m}),h&&x&&/*#__PURE__*/e.jsx(r.BottomModalContainer,{onClose:x,isFixedHeight:C,children:m})]})})};
+"use strict";var e=require("react/jsx-runtime"),o=require("tailwind-merge"),l=require("../BackDropLiftContainer/BackDropLiftContainer.js"),r=require("../BottomModalContainer/BottomModalContainer.js"),a=require("../FullModalContainer/FullModalContainer.js"),t=require("../ModalContainer/ModalContainer.js"),i=require("../Portal/Portal.js"),s=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");exports.Modal=({isOpen:n,rootId:d,variant:u="default",size:c="md",overflow:B="auto",isBackgroundBlack:C=!0,isFixedHeight:m,isPreventScroll:x=!0,className:j,onClose:f,needCleanup:M=!0,children:h})=>{const p="bottom"===u,q="full"===u,g="default"===u,F=M&&!d;/*#__PURE__*/
+return e.jsx(i.Portal,{rootId:d,needCleanup:F,children:/*#__PURE__*/e.jsxs(l.BackDropLiftContainer,{isOpen:n,onClose:f,testId:"design-system--modal",isBackgroundBlack:C,isPreventScroll:x,isBottomSheet:p,isFullSize:"full"===c,children:[g&&/*#__PURE__*/e.jsx(s.Box,{"data-testid":"design-system--modal-container--box",className:o.twMerge("full"===c&&"w-full px-5",j),children:/*#__PURE__*/e.jsx(t.ModalContainer,{size:c,overflow:B,children:h})}),q&&/*#__PURE__*/e.jsx(a.FullModalContainer,{className:j,children:h}),p&&f&&/*#__PURE__*/e.jsx(r.BottomModalContainer,{onClose:f,isFixedHeight:m,className:j,children:h})]})})};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wishket/design-system",
-  "version": "1.16.2",
+  "version": "1.16.4",
   "type": "module",
   "description": "Wishket Design System",
   "main": "dist/index.js",