@wishket/design-system 1.15.0 → 1.15.1

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

@@ -1,6 +1,6 @@
 "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);
 // 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||v)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,v]),/*#__PURE__*/e(d,{ref:x,className:c("block w-full touch-pan-x items-start overflow-x-scroll scrollbar-list",f&&"px-9",O?"cursor-grabbing":"cursor-grab",u),"data-testid":"design-system-textTab--container",onTouchStart:()=>{j(!0)},onTouchEnd:()=>{j(!1)},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:"relative w-max border-b border-w-gray-200","data-testid":"design-system-textTab--inner-container",children:[
+}),[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})};

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"),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");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"),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=>{}});
 /**
  * TextTab의 Root 컴포넌트입니다.
  * TextTab의 상태를 관리합니다.
@@ -21,9 +21,9 @@
  *   <TextTab.Panel index={0}>첫 번째 패널 내용</TextTab.Panel>
  *   <TextTab.Panel index={1}>두 번째 패널 내용</TextTab.Panel>
  * </TextTab.Root>
- */exports.Panel=({children:r,index:s})=>{const{activeTab:n}=t.useContext(u);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,d]=t.useState(s);return t.useEffect((()=>{s!==c&&d(s);
+ */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);
 // eslint-disable-next-line react-hooks/exhaustive-deps
-}),[s]),/*#__PURE__*/e.jsx(u.Provider,{value:{barColor:l,activeTab:c,currentActiveTab:s,isFit:a,hasPadding:n,handleTabClick:e=>{e!==c&&(null==i||i(e),d(e))},isFull:o},children:r})},exports.Tab=({children:l,index:d,className:x,disabled:f=!1,badgeNumber:b,iconName:g,href:y})=>{const{isFit:m,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",f&&"cursor-not-allowed",w&&"w-full",x),onClick:()=>{!f&&p(d)}},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",!m&&"px-[33.5px]",w&&"w-full px-0",j&&"font-medium text-w-gray-900"),children:[g&&/*#__PURE__*/e.jsx(a.Box,{className:"flex size-4 flex-shrink-0 items-center justify-center",children:/*#__PURE__*/e.jsx(n.SystemIcon,{name:g,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(a.Box,c(i({},v),{children:T}))},exports.Tabs=({children:s,className:n})=>{const{activeTab:o,hasPadding:l,isFull:i,barColor:c}=t.useContext(u),d=t.useRef([]),x=t.useRef(null),f=t.useRef(null),b=t.Children.toArray(s),[g,y]=t.useState(!1),[m,p]=t.useState(!1),[h,w]=t.useState({x:0,scrollLeft:0});return t.useEffect((()=>{if(!d.current[o]||!x.current||g)return;const e=d.current[o],t=x.current,r=f.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,g]),/*#__PURE__*/e.jsx(a.Box,{ref:f,className:r.twJoin("block w-full touch-pan-x items-start overflow-x-scroll scrollbar-list",l&&"px-9",m?"cursor-grabbing":"cursor-grab",n),"data-testid":"design-system-textTab--container",onTouchStart:()=>{y(!0)},onTouchEnd:()=>{y(!1)},onMouseDown:e=>{f.current&&(p(!0),w({x:e.pageX,scrollLeft:f.current.scrollLeft}))},onMouseMove:e=>{if(!m||!f.current)return;e.preventDefault();const t=e.pageX-h.x;f.current.scrollLeft=h.scrollLeft-t},onMouseUp:()=>{p(!1)},onMouseLeave:()=>{p(!1)},children:/*#__PURE__*/e.jsxs(a.Box,{className:"relative w-max border-b border-w-gray-200","data-testid":"design-system-textTab--inner-container",children:[
-/*#__PURE__*/e.jsx(a.Box,{className:r.twMerge("inline-flex w-max gap-10",i&&"w-full gap-0"),children:b.map(((t,s)=>/*#__PURE__*/e.jsx(a.Box,{className:r.twMerge(i&&"w-full"),ref:e=>{d.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",c)})]})})};
+}),[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)})]})})};

package/package.json

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