@wishket/design-system 1.7.0 → 1.9.0

package/dist/Components/DataDisplays/SystemIcon/Icons/Small/SmallCat.js

@@ -1 +1 @@
-"use strict";var r=require("react/jsx-runtime");module.exports=function(t){var C=t.testId,t=t.className;return r.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none","data-testid":C,className:t,children:[r.jsxs("g",{clipPath:"url(#clip0_9258_9310)",children:[r.jsx("path",{d:"M10.7487 9.0463H10.7507L10.7406 9.03213C10.6717 8.9248 10.5948 8.82557 10.5097 8.73444L8.73979 6.44205C8.34895 5.95603 7.75155 5.64417 7.07923 5.64417C7.0529 5.64417 7.02657 5.64619 7.00025 5.64822C6.97392 5.64822 6.94759 5.64417 6.92127 5.64417C6.24894 5.64417 5.65154 5.95603 5.2607 6.44205L3.49078 8.73444C3.40573 8.82759 3.32877 8.92682 3.25992 9.03213L3.24979 9.0463C3.24979 9.0463 3.24979 9.0463 3.25182 9.0463C3.04729 9.37437 2.92578 9.75913 2.92578 10.1743C2.92578 11.3508 3.8796 12.3047 5.05617 12.3047C5.30728 12.3047 5.54624 12.2581 5.77102 12.1791V12.1811C5.77102 12.1811 6.28134 12.0009 7.00025 12.013C7.71915 12.0009 8.22947 12.1811 8.22947 12.1811C8.22947 12.1811 8.22947 12.1811 8.22947 12.1791C8.45223 12.2581 8.69322 12.3047 8.94433 12.3047C10.1209 12.3047 11.0747 11.3508 11.0747 10.1743C11.0747 9.75913 10.9532 9.37234 10.7487 9.0463Z",fill:"currentColor",stroke:"currentColor"}),r.jsx("path",{d:"M5.66078 5.15935C6.4565 4.94002 6.86956 3.92049 6.58336 2.88218C6.29716 1.84386 5.4201 1.17993 4.62438 1.39926C3.82865 1.61859 3.4156 2.63811 3.7018 3.67643C3.98799 4.71475 4.86506 5.37867 5.66078 5.15935Z",fill:"currentColor",stroke:"currentColor"}),r.jsx("path",{d:"M3.24444 7.64064C3.95925 7.22795 4.10217 6.13725 3.56365 5.2045C3.02513 4.27176 2.0091 3.85018 1.29428 4.26288C0.579471 4.67557 0.436557 5.76627 0.975077 6.69902C1.5136 7.63176 2.52963 8.05334 3.24444 7.64064Z",fill:"currentColor",stroke:"currentColor"}),r.jsx("path",{d:"M10.2997 3.67428C10.5859 2.63596 10.1728 1.61644 9.37709 1.39711C8.58137 1.17778 7.7043 1.84171 7.41811 2.88003C7.13191 3.91835 7.54496 4.93787 8.34068 5.1572C9.13641 5.37653 10.0135 4.7126 10.2997 3.67428Z",fill:"currentColor",stroke:"currentColor"}),r.jsx("path",{d:"M13.0248 6.69747C13.5633 5.76473 13.4204 4.67403 12.7056 4.26134C11.9908 3.84864 10.9748 4.27022 10.4363 5.20296C9.89774 6.13571 10.0407 7.2264 10.7555 7.6391C11.4703 8.0518 12.4863 7.63022 13.0248 6.69747Z",fill:"currentColor",stroke:"currentColor"})]}),r.jsx("defs",{children:r.jsx("clipPath",{id:"clip0_9258_9310",children:r.jsx("rect",{width:"14",height:"14",fill:"white"})})})]})};
+"use strict";var C=require("react/jsx-runtime");module.exports=function(l){var r=l.testId,l=l.className;return C.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none","data-testid":r,className:l,children:[C.jsxs("g",{clipPath:"url(#clip0_9258_9310)",children:[C.jsx("path",{d:"M10.7487 9.0463H10.7507L10.7406 9.03213C10.6717 8.9248 10.5948 8.82557 10.5097 8.73444L8.73979 6.44205C8.34895 5.95603 7.75155 5.64417 7.07923 5.64417C7.0529 5.64417 7.02657 5.64619 7.00025 5.64822C6.97392 5.64822 6.94759 5.64417 6.92127 5.64417C6.24894 5.64417 5.65154 5.95603 5.2607 6.44205L3.49078 8.73444C3.40573 8.82759 3.32877 8.92682 3.25992 9.03213L3.24979 9.0463C3.24979 9.0463 3.24979 9.0463 3.25182 9.0463C3.04729 9.37437 2.92578 9.75913 2.92578 10.1743C2.92578 11.3508 3.8796 12.3047 5.05617 12.3047C5.30728 12.3047 5.54624 12.2581 5.77102 12.1791V12.1811C5.77102 12.1811 6.28134 12.0009 7.00025 12.013C7.71915 12.0009 8.22947 12.1811 8.22947 12.1811C8.22947 12.1811 8.22947 12.1811 8.22947 12.1791C8.45223 12.2581 8.69322 12.3047 8.94433 12.3047C10.1209 12.3047 11.0747 11.3508 11.0747 10.1743C11.0747 9.75913 10.9532 9.37234 10.7487 9.0463Z",fill:"currentColor"}),C.jsx("path",{d:"M5.66078 5.15935C6.4565 4.94002 6.86956 3.92049 6.58336 2.88218C6.29716 1.84386 5.4201 1.17993 4.62438 1.39926C3.82865 1.61859 3.4156 2.63811 3.7018 3.67643C3.98799 4.71475 4.86506 5.37867 5.66078 5.15935Z",fill:"currentColor"}),C.jsx("path",{d:"M3.24444 7.64064C3.95925 7.22795 4.10217 6.13725 3.56365 5.2045C3.02513 4.27176 2.0091 3.85018 1.29428 4.26288C0.579471 4.67557 0.436557 5.76627 0.975077 6.69902C1.5136 7.63176 2.52963 8.05334 3.24444 7.64064Z",fill:"currentColor"}),C.jsx("path",{d:"M10.2997 3.67428C10.5859 2.63596 10.1728 1.61644 9.37709 1.39711C8.58137 1.17778 7.7043 1.84171 7.41811 2.88003C7.13191 3.91835 7.54496 4.93787 8.34068 5.1572C9.13641 5.37653 10.0135 4.7126 10.2997 3.67428Z",fill:"currentColor"}),C.jsx("path",{d:"M13.0248 6.69747C13.5633 5.76473 13.4204 4.67403 12.7056 4.26134C11.9908 3.84864 10.9748 4.27022 10.4363 5.20296C9.89774 6.13571 10.0407 7.2264 10.7555 7.6391C11.4703 8.0518 12.4863 7.63022 13.0248 6.69747Z",fill:"currentColor"})]}),C.jsx("defs",{children:C.jsx("clipPath",{id:"clip0_9258_9310",children:C.jsx("rect",{width:"14",height:"14",fill:"white"})})})]})};

package/dist/Components/DataDisplays/SystemIcon/Icons/Small/SmallPlay.js

@@ -1 +1 @@
-"use strict";var t=require("react/jsx-runtime");module.exports=function(e){var s=e.testId,r=e.className,e=e.solid;return t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none","data-testid":s,className:r,children:e?t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",children:t.jsx("path",{d:"M6.3496 1.69167L11.1471 4.95493C11.1753 4.97414 11.2018 4.99514 11.2264 5.0177C11.8469 5.48124 12.2 6.22679 12.2 7.00706C12.2 7.82411 11.8128 8.60309 11.1369 9.06006L6.33427 12.3177C5.96687 12.564 5.53886 12.7 5.10005 12.7C4.71017 12.7 4.32244 12.5901 3.97341 12.3861L3.96664 12.3821C3.22634 11.9381 2.80005 11.138 2.80005 10.2629V3.74208C2.80005 2.87815 3.22472 2.06797 3.96667 1.62297C4.70867 1.17794 5.61812 1.18551 6.3496 1.69167Z",fill:"#212121",stroke:"currentColor"})}):t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",children:t.jsx("path",{d:"M10.7533 5.5337L5.95333 2.26872C5.45556 1.92312 4.84222 1.91403 4.32667 2.22325C3.81111 2.53246 3.5 3.10543 3.5 3.74205V10.2629C3.5 10.9086 3.81111 11.4725 4.32667 11.7817C4.57556 11.9272 4.84222 12 5.1 12C5.39333 12 5.68667 11.9091 5.94444 11.7363L10.7444 8.48037C11.2156 8.16206 11.5 7.60728 11.5 7.00703C11.5 6.40679 11.2156 5.85201 10.7444 5.5337H10.7533Z",stroke:"currentColor",strokeWidth:"1.4",strokeMiterlimit:"10",strokeLinejoin:"round"})})})};
+"use strict";var t=require("react/jsx-runtime");module.exports=function(e){var s=e.testId,i=e.className,e=e.solid;return t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none","data-testid":s,className:i,children:e?t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",children:t.jsx("path",{d:"M6.3496 1.69167L11.1471 4.95493C11.1753 4.97414 11.2018 4.99514 11.2264 5.0177C11.8469 5.48124 12.2 6.22679 12.2 7.00706C12.2 7.82411 11.8128 8.60309 11.1369 9.06006L6.33427 12.3177C5.96687 12.564 5.53886 12.7 5.10005 12.7C4.71017 12.7 4.32244 12.5901 3.97341 12.3861L3.96664 12.3821C3.22634 11.9381 2.80005 11.138 2.80005 10.2629V3.74208C2.80005 2.87815 3.22472 2.06797 3.96667 1.62297C4.70867 1.17794 5.61812 1.18551 6.3496 1.69167Z",fill:"currentColor"})}):t.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",children:t.jsx("path",{d:"M10.7533 5.5337L5.95333 2.26872C5.45556 1.92312 4.84222 1.91403 4.32667 2.22325C3.81111 2.53246 3.5 3.10543 3.5 3.74205V10.2629C3.5 10.9086 3.81111 11.4725 4.32667 11.7817C4.57556 11.9272 4.84222 12 5.1 12C5.39333 12 5.68667 11.9091 5.94444 11.7363L10.7444 8.48037C11.2156 8.16206 11.5 7.60728 11.5 7.00703C11.5 6.40679 11.2156 5.85201 10.7444 5.5337H10.7533Z",stroke:"currentColor",strokeWidth:"1.4",strokeMiterlimit:"10",strokeLinejoin:"round"})})})};

package/dist/Components/Feedbacks/MessageBar/MessageBar.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),s=require("tailwind-merge"),r=require("../../Base/Typography/Typography.js"),t=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../../_virtual/_tslib.js"),require("react"),require("@wishket/yogokit"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/ProductIcon/ProductIcon.js")),a=(require("../../DataDisplays/SystemIcon/Icons/Medium/MediumBell.js"),require("../../Inputs/AutoCompleteList/AutoCompleteList.parts.js"),require("../../Inputs/Input/Input.js"),require("../../Inputs/Input/PasswordInput.js"),require("../../Inputs/Input/LableInput.js"),require("../../Inputs/Input/InputTypeSelector.js"),require("../../Inputs/Button/Button.js"));require("../../Inputs/Calendar/Calendar.utils.js"),require("../../Inputs/Checkbox/Checkbox.js"),require("../../Inputs/ChoiceChip/ChoiceChip.js"),require("../../Inputs/Radio/Radio.js"),require("../../Inputs/TextField/TextField.js"),require("../../Inputs/CommentArea/CommentArea.js"),require("../../Inputs/MultiColumnList/MultiColumnList.parts.js"),require("../../Inputs/FilterChip/FilterChip.js"),module.exports=function(u){var n=u.variant,n=void 0===n?"primary":n,l=u.icon,o=u.title,p=u.text,d=u.buttonName,u=u.onClick;return e.jsxs(t,{"data-testid":"design-system-message-bar",className:s.twMerge("flex w-full items-center gap-5 rounded-2xl border px-8 py-5","primary"===n&&"border-primary-100 bg-primary-10","white"===n&&"border-w-gray-200 bg-white"),children:[e.jsx(t,{className:"shrink-0","data-testid":"design-system-message-bar--icon",children:e.jsx(i,{name:l,size:"medium"})}),e.jsxs(t,{className:"flex w-full flex-col gap-1",children:[o&&e.jsx(r,{variant:"subTitle2",className:"font-medium text-w-gray-900","data-testid":"design-system-message-bar--title",children:o}),e.jsx(r,{variant:"body2",className:"text-w-gray-600","data-testid":"design-system-message-bar--text",children:p})]}),d&&u&&e.jsx(a,{variant:"outlined",size:"sm",className:"shrink-0",onClick:u,"data-testid":"design-system-message-bar--button",children:d})]})};
+"use strict";var e=require("react/jsx-runtime"),s=require("tailwind-merge"),r=require("../../Base/Typography/Typography.js"),t=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../../_virtual/_tslib.js"),require("react"),require("@wishket/yogokit"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/ProductIcon/ProductIcon.js")),a=(require("../../DataDisplays/SystemIcon/Icons/Medium/MediumBell.js"),require("../../Inputs/AutoCompleteList/AutoCompleteList.parts.js"),require("../../Inputs/Input/Input.js"),require("../../Inputs/Input/PasswordInput.js"),require("../../Inputs/Input/LableInput.js"),require("../../Inputs/Input/InputTypeSelector.js"),require("../../Inputs/Button/Button.js"));require("../../Inputs/Calendar/Calendar.utils.js"),require("../../Inputs/Checkbox/Checkbox.js"),require("../../Inputs/ChoiceChip/ChoiceChip.js"),require("../../Inputs/Radio/Radio.js"),require("../../Inputs/TextField/TextField.js"),require("../../Inputs/CommentArea/CommentArea.js"),require("../../Inputs/MultiColumnList/MultiColumnList.parts.js"),require("../../Inputs/FilterChip/FilterChip.js"),module.exports=function(u){var n=u.variant,n=void 0===n?"primary":n,l=u.icon,o=u.title,p=u.text,d=u.buttonName,u=u.onClick;return e.jsxs(t,{"data-testid":"design-system-message-bar",className:s.twMerge("flex w-full items-center gap-5 rounded-2xl border px-8 py-5","primary"===n&&"border-primary-100 bg-primary-10","white"===n&&"border-w-gray-200 bg-white"),children:[e.jsx(t,{className:"shrink-0","data-testid":"design-system-message-bar--icon",children:e.jsx(i,{name:l,size:"medium"})}),e.jsxs(t,{className:"flex w-full flex-col gap-1",children:[o&&e.jsx(r,{variant:"subTitle2",className:"font-medium text-w-gray-900","data-testid":"design-system-message-bar--title",children:o}),e.jsx(r,{variant:"body1",className:"text-w-gray-600","data-testid":"design-system-message-bar--text",children:p})]}),d&&u&&e.jsx(a,{variant:"outlined",size:"sm",className:"shrink-0",onClick:u,"data-testid":"design-system-message-bar--button",children:d})]})};

package/dist/Components/Inputs/Button/Button.d.ts

@@ -11,6 +11,7 @@ import { ButtonProps } from './Button.types';
  * @param {function} [props.onClick] - 클릭 이벤트 핸들러
  * @param {'sm' | 'md' | 'lg'} [props.size='md'] - 버튼 크기
  * @param {'outlined' | 'solid' | 'outline_filled'} [props.variant='outlined'] - 버튼 스타일 변형
+ * @param {'primary' | 'gray'} [props.color='primary'] - 버튼 색상, outlined 일 때에만 적용 가능
  * @param {boolean} [props.rounded=false] - 둥근 모서리 적용 여부
  * @param {React.ReactNode} [props.leadingIcon] - 버튼 앞쪽 아이콘
  * @param {boolean} [props.isLeadingIconSolid=false] - 앞쪽 아이콘 solid 스타일 적용 여부
@@ -46,5 +47,5 @@ import { ButtonProps } from './Button.types';
  *   알림
  * </Button>
  */
-declare const Button: ({ type, ref, disabled, children, className, onClick, size, variant, rounded, leadingIcon, isLeadingIconSolid, trailingIcon, isTrailingIconSolid, badgeNumber, needThrottle, ...rest }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const Button: ({ type, ref, disabled, children, className, onClick, size, variant, color, rounded, leadingIcon, isLeadingIconSolid, trailingIcon, isTrailingIconSolid, badgeNumber, needThrottle, ...rest }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
 export default Button;

package/dist/Components/Inputs/Button/Button.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var i=require("../../../_virtual/_tslib.js"),e=require("react/jsx-runtime"),n=require("react"),r=require("./Button.parts.js");module.exports=function(o){var t=o.type,t=void 0===t?"button":t,d=o.ref,a=o.disabled,a=void 0!==a&&a,l=o.children,c=o.className,u=o.onClick,s=o.size,s=void 0===s?"md":s,v=o.variant,v=void 0===v?"outlined":v,g=o.rounded,g=void 0!==g&&g,f=o.leadingIcon,I=o.isLeadingIconSolid,I=void 0!==I&&I,b=o.trailingIcon,m=o.isTrailingIconSolid,m=void 0!==m&&m,T=o.badgeNumber,T=void 0===T?"":T,p=o.needThrottle,p=void 0!==p&&p,o=i.__rest(o,["type","ref","disabled","children","className","onClick","size","variant","rounded","leadingIcon","isLeadingIconSolid","trailingIcon","isTrailingIconSolid","badgeNumber","needThrottle"]),N=n.useRef(void 0);return n.useEffect(function(){return function(){N&&clearTimeout(N.current)}},[N]),e.jsx(r.ButtonContainer,i.__assign({ref:d,size:s,type:t,disabled:a,rounded:g,variant:v,className:c,onClick:p?function(i){i.preventDefault(),N.current||(null!=u&&u(i),N.current=setTimeout(function(){N.current=void 0},300))}:u,leadingIcon:f,isLeadingIconSolid:I,trailingIcon:b,isTrailingIconSolid:m,badgeNumber:T},o,{children:l}))};
+"use strict";var i=require("../../../_virtual/_tslib.js"),e=require("react/jsx-runtime"),n=require("react"),r=require("./Button.parts.js");module.exports=function(o){var t=o.type,t=void 0===t?"button":t,d=o.ref,a=o.disabled,a=void 0!==a&&a,l=o.children,c=o.className,u=o.onClick,s=o.size,s=void 0===s?"md":s,v=o.variant,v=void 0===v?"outlined":v,g=o.color,g=void 0===g?"primary":g,f=o.rounded,f=void 0!==f&&f,m=o.leadingIcon,I=o.isLeadingIconSolid,I=void 0!==I&&I,b=o.trailingIcon,p=o.isTrailingIconSolid,p=void 0!==p&&p,T=o.badgeNumber,T=void 0===T?"":T,N=o.needThrottle,N=void 0!==N&&N,o=i.__rest(o,["type","ref","disabled","children","className","onClick","size","variant","color","rounded","leadingIcon","isLeadingIconSolid","trailingIcon","isTrailingIconSolid","badgeNumber","needThrottle"]),S=n.useRef(void 0);return n.useEffect(function(){return function(){S&&clearTimeout(S.current)}},[S]),e.jsx(r.ButtonContainer,i.__assign({ref:d,size:s,type:t,disabled:a,rounded:f,color:g,variant:v,className:c,onClick:N?function(i){i.preventDefault(),S.current||(null!=u&&u(i),S.current=setTimeout(function(){S.current=void 0},300))}:u,leadingIcon:m,isLeadingIconSolid:I,trailingIcon:b,isTrailingIconSolid:p,badgeNumber:T},o,{children:l}))};

package/dist/Components/Inputs/Button/Button.parts.d.ts

@@ -1,2 +1,2 @@
 import { ButtonProps } from './Button.types';
-export declare const ButtonContainer: ({ rounded, size, type, variant, children, leadingIcon, isLeadingIconSolid, trailingIcon, isTrailingIconSolid, badgeNumber, className, disabled, onClick, ...rest }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ButtonContainer: ({ rounded, size, type, variant, color, children, leadingIcon, isLeadingIconSolid, trailingIcon, isTrailingIconSolid, badgeNumber, className, disabled, onClick, ...rest }: ButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Components/Inputs/Button/Button.parts.js

@@ -1 +1 @@
-"use strict";var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),i=require("tailwind-merge"),a=(require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/CountBadge/CountBadge.js")),s=(require("../../Base/Layouts/Box/Box.js"),require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));exports.ButtonContainer=function(t){function o(){return"solid"===p&&h?"text-w-white":"outline_filled"===p&&h||h?"text-primary-100":"solid"===p?"text-w-white":"text-primary-500"}var l=t.rounded,n=t.size,d=t.type,p=t.variant,x=t.children,g=t.leadingIcon,u=t.isLeadingIconSolid,u=void 0!==u&&u,b=t.trailingIcon,m=t.isTrailingIconSolid,m=void 0!==m&&m,c=t.badgeNumber,c=void 0===c?"":c,y=t.className,h=t.disabled,v=t.onClick,t=e.__rest(t,["rounded","size","type","variant","children","leadingIcon","isLeadingIconSolid","trailingIcon","isTrailingIconSolid","badgeNumber","className","disabled","onClick"]);return r.jsxs("button",e.__assign({className:i.twMerge("box-border flex w-fit cursor-pointer items-center justify-center border","outlined"===p&&l?"rounded-full":"rounded-xl","sm"===n?"h-[36px] text-sm leading-6 gap-x-1":"lg"===n?"h-[60px] text-[20px] leading-[30px] gap-x-2":"h-[50px] text-base leading-[26px] gap-x-1.5",(l="solid"===p,"sm"===n?l?"px-3":"px-[11px]":"lg"===n?l?"px-6":"px-[23px]":l?"px-4":"px-[15px]"),o(),"solid"===p?"bg-primary-500 border-0 hover:bg-primary-700":"outline_filled"===p?"bg-primary-10 border-primary-200 hover:border-primary-500":"bg-w-white border-w-gray-200 hover:border-primary-500",h&&"cursor-not-allowed",h&&("solid"===p?"bg-primary-100 border-0 hover:bg-primary-100 hover:border-primary-100":"outline_filled"===p?"bg-primary-10 border-primary-200 hover:border-primary-200":"bg-w-white border-w-gray-200 hover:border-w-gray-200"),y),onClick:v,disabled:h,type:d},t,{children:[g&&r.jsx(s,{name:g,solid:u,testId:"design-system-button--leading-icon",className:i.twMerge("flex-shrink-0","sm"===n?"size-[14px]":"size-4",o())}),x,b&&r.jsx(s,{name:b,solid:m,testId:"design-system-button--trailing-icon",className:i.twMerge("flex-shrink-0","sm"===n?"size-[14px]":"size-4",o())}),c&&r.jsx(a,{text:c,className:"relative flex-shrink-0"})]}))};
+"use strict";var r=require("../../../_virtual/_tslib.js"),e=require("react/jsx-runtime"),i=require("tailwind-merge"),a=(require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/CountBadge/CountBadge.js")),t=(require("../../Base/Layouts/Box/Box.js"),require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));exports.ButtonContainer=function(s){function o(){if(h){if("solid"===p)return"text-w-white";if("outline_filled"===p)return"text-primary-100";if("primary"===g)return"text-primary-100";if("gray"===g)return"text-w-gray-300"}return"solid"===p?"text-w-white":"outline_filled"===p||"primary"===g?"text-primary-500":"text-w-gray-600"}var l=s.rounded,n=s.size,d=s.type,p=s.variant,g=s.color,u=s.children,x=s.leadingIcon,m=s.isLeadingIconSolid,m=void 0!==m&&m,y=s.trailingIcon,b=s.isTrailingIconSolid,b=void 0!==b&&b,c=s.badgeNumber,c=void 0===c?"":c,w=s.className,h=s.disabled,v=s.onClick,s=r.__rest(s,["rounded","size","type","variant","color","children","leadingIcon","isLeadingIconSolid","trailingIcon","isTrailingIconSolid","badgeNumber","className","disabled","onClick"]);return e.jsxs("button",r.__assign({className:i.twMerge("box-border flex w-fit cursor-pointer items-center justify-center border","outlined"===p&&l?"rounded-full":"rounded-xl","sm"===n?"h-[36px] text-sm leading-6 gap-x-1":"lg"===n?"h-[60px] text-[20px] leading-[30px] gap-x-2":"h-[50px] text-base leading-[26px] gap-x-1.5",(l="solid"===p,"sm"===n?l?"px-3":"px-[11px]":"lg"===n?l?"px-6":"px-[23px]":l?"px-4":"px-[15px]"),o(),"solid"===p?"bg-primary-500 border-0 hover:bg-primary-700":"outline_filled"===p?"bg-primary-10 border-primary-200 hover:border-primary-500":"primary"===g?"bg-w-white border-w-gray-200 hover:border-primary-500":"bg-w-white border-w-gray-200 hover:border-w-gray-400",h&&"cursor-not-allowed",h&&("solid"===p?"bg-primary-100 border-0 hover:bg-primary-100 hover:border-primary-100":"outline_filled"===p?"bg-primary-10 border-primary-200 hover:border-primary-200":"bg-w-white border-w-gray-200 hover:border-w-gray-200"),w),onClick:v,disabled:h,type:d},s,{children:[x&&e.jsx(t,{name:x,solid:m,testId:"design-system-button--leading-icon",className:i.twMerge("flex-shrink-0","sm"===n?"size-[14px]":"size-4",o())}),u,y&&e.jsx(t,{name:y,solid:b,testId:"design-system-button--trailing-icon",className:i.twMerge("flex-shrink-0","sm"===n?"size-[14px]":"size-4",o())}),c&&e.jsx(a,{text:c,className:"relative flex-shrink-0"})]}))};

package/dist/Components/Inputs/Button/Button.types.d.ts

@@ -2,9 +2,11 @@ import { ComponentPropsWithRef } from 'react';
 import { SystemIconName } from '../../DataDisplays/SystemIcon';
 type ButtonSizeType = 'sm' | 'md' | 'lg';
 type ButtonVariantType = 'outlined' | 'solid' | 'outline_filled';
+type ButtonColorType = 'primary' | 'gray';
 export interface ButtonProps extends ComponentPropsWithRef<'button'> {
     size?: ButtonSizeType;
     variant?: ButtonVariantType;
+    color?: ButtonColorType;
     rounded?: boolean;
     leadingIcon?: SystemIconName;
     isLeadingIconSolid?: boolean;

package/dist/Components/Inputs/Checkbox/Checkbox.parts.js

@@ -1 +1 @@
-"use strict";var r=require("react/jsx-runtime"),e=require("tailwind-merge"),t="text-w-white group-hover:text-w-white",o="text-w-gray-200 group-hover:text-w-gray-200",s="stroke-dasharray-[16] stroke-dashoffset-[16] animate-checkbox-check",a=function(a){var i=a.checked,d=a.isError,a=a.disabled;return r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",i&&t,d&&a&&o,!i&&"text-transparent",a&&(!d&&i?t:"text-transparent")),style:{strokeDasharray:i?"16":"0",strokeDashoffset:i?"16":"0"},children:r.jsx("path",{d:"M1 3.8L4 7L9 1",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",className:i?s:""})})},i=function(a){var i=a.checked,d=a.isError,a=a.disabled;return r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",i&&t,d&&a&&o,!i&&"text-w-gray-200 group-hover:text-w-primary",d&&!i&&"text-w-red-500 group-hover:text-w-red-500",a&&(!d&&i?t:o)),style:{strokeDasharray:i?"16":"0",strokeDashoffset:i?"16":"0"},children:r.jsx("path",{d:"M1 3.8L4 7L9 1",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",className:i?s:""})})},d=function(t){var o=t.role,s=t.className,a=t.checked,i=t.disabled,t=t.isError,d="text-w-gray-100";return r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",role:o,className:e.twMerge("cursor-pointer",i&&"cursor-not-allowed",t?i?d:"text-w-red-500":i?a?"text-primary-100":d:a?"text-primary":"text-w-gray-200",s),"data-testid":"design-system--sub-checkbox",children:r.jsx("path",{d:"M4 8.76667L7.75004 12.5L14.0001 5.5",stroke:"currentColor",strokeWidth:"1.4",strokeLinecap:"round",strokeLinejoin:"round"})})};exports.CheckboxButton=function(t){var o=t.type,s=t.disabled,n=t.checked,n=void 0!==n&&n,c=t.isError,l=t.isFocused,t=t.className,w="circle"===o?"rounded-full":"rounded";return"sub"===o?r.jsx(d,{role:"checkbox-button",className:t,checked:n,disabled:s,isError:c}):r.jsxs("div",{className:e.twMerge("group relative m-px box-border size-4 cursor-pointer border",w,s?n?c?"bg-w-gray-50 border-w-gray-200 cursor-not-allowed":"bg-primary-100 border-primary-100 cursor-not-allowed":"border-w-gray-200 bg-w-gray-50 cursor-not-allowed":l&&!c?n?"bg-primary-500 border-primary-500":"border-primary-500 bg-w-white":c?n?"border-w-red-500 bg-w-red-500":"border-w-red-500 bg-w-white":n?"bg-primary-500 border-primary-500":"group-hover:border-primary-500 border-w-gray-200 bg-white",t),role:"checkbox-button",children:["box"===o&&r.jsx(a,{checked:n,isError:c,disabled:s}),"circle"===o&&r.jsx(i,{checked:n,isError:c,disabled:s})]})};
+"use strict";var r=require("react/jsx-runtime"),e=require("tailwind-merge"),t="text-w-white group-hover:text-w-white",o="text-w-gray-200 group-hover:text-w-gray-200",s="stroke-dasharray-[16] stroke-dashoffset-[16] animate-checkbox-check",a=function(a){var i=a.checked,d=a.isError,a=a.disabled;return r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",i&&t,d&&a&&o,!i&&"text-transparent",a&&(!d&&i?t:"text-transparent")),style:{strokeDasharray:i?"16":"0",strokeDashoffset:i?"16":"0"},children:r.jsx("path",{d:"M1 3.8L4 7L9 1",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",className:i?s:""})})},i=function(a){var i=a.checked,d=a.isError,a=a.disabled;return r.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:e.twMerge("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",i&&t,d&&a&&o,!i&&"text-w-gray-200 group-hover:text-w-primary",d&&!i&&"text-w-red-500 group-hover:text-w-red-500",a&&(!d&&i?t:o)),style:{strokeDasharray:i?"16":"0",strokeDashoffset:i?"16":"0"},children:r.jsx("path",{d:"M1 3.8L4 7L9 1",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round",className:i?s:""})})},d=function(t){var o=t.role,s=t.className,a=t.checked,i=t.disabled,t=t.isError,d="text-w-gray-100";return r.jsx("svg",{width:"18",height:"18",viewBox:"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",role:o,className:e.twMerge("cursor-pointer",i&&"cursor-not-allowed",t?i?d:"text-w-red-500":i?a?"text-primary-100":d:a?"text-primary":"text-w-gray-200",s),"data-testid":"design-system--sub-checkbox",children:r.jsx("path",{d:"M4 8.76667L7.75004 12.5L14.0001 5.5",stroke:"currentColor",strokeWidth:"1.4",strokeLinecap:"round",strokeLinejoin:"round"})})};exports.CheckboxButton=function(t){var o=t.type,o=void 0===o?"box":o,s=t.disabled,n=t.checked,n=void 0!==n&&n,c=t.isError,l=t.isFocused,t=t.className,w="circle"===o?"rounded-full":"rounded";return"sub"===o?r.jsx(d,{role:"checkbox-button",className:t,checked:n,disabled:s,isError:c}):r.jsxs("div",{className:e.twMerge("group relative box-border cursor-pointer border",{box:"size-4 m-px",circle:"size-[18px]"}[o],w,s?n?c?"bg-w-gray-50 border-w-gray-200 cursor-not-allowed":"bg-primary-100 border-primary-100 cursor-not-allowed":"border-w-gray-200 bg-w-gray-50 cursor-not-allowed":l&&!c?n?"bg-primary-500 border-primary-500":"border-primary-500 bg-w-white":c?n?"border-w-red-500 bg-w-red-500":"border-w-red-500 bg-w-white":n?"bg-primary-500 border-primary-500":"group-hover:border-primary-500 border-w-gray-200 bg-white",t),role:"checkbox-button",children:["box"===o&&r.jsx(a,{checked:n,isError:c,disabled:s}),"circle"===o&&r.jsx(i,{checked:n,isError:c,disabled:s})]})};

package/dist/Components/Inputs/CheckboxListItem/CheckboxListItem.d.ts

@@ -4,6 +4,7 @@ import { CheckboxType } from '../../Inputs/Checkbox/Checkbox.types';
 export interface CheckboxListItemProps extends CheckboxStatus, ComponentPropsWithRef<'input'> {
     label?: string;
     description?: string;
+    errorMessage?: string;
     CheckboxClassName?: string;
     type?: CheckboxType;
 }
@@ -14,6 +15,7 @@ export interface CheckboxListItemProps extends CheckboxStatus, ComponentPropsWit
  * @param {Object} props
  * @param {string} [props.label] - 체크박스 옆에 표시될 라벨 텍스트
  * @param {string} [props.description] - 라벨 아래에 표시될 설명 텍스트
+ * @param {string} [props.errorMessage] - 체크박스 오류 메시지
  * @param {string} [props.CheckboxClassName] - 체크박스에 적용될 커스텀 클래스
  * @param {CheckboxType} [props.type='box'] - 체크박스 타입 ('box' | 'circle' | 'sub')
  * @param {boolean} [props.checked] - 체크박스의 선택 상태
@@ -41,7 +43,7 @@ export interface CheckboxListItemProps extends CheckboxStatus, ComponentPropsWit
  * <CheckboxListItem
  *   label="필수 선택 항목"
  *   isError={true}
- *   description="이 항목은 필수로 선택해야 합니다."
+ *   errorMessage="이 항목은 필수로 선택해야 합니다."
  * />
  *
  * // 원형 체크박스
@@ -50,5 +52,5 @@ export interface CheckboxListItemProps extends CheckboxStatus, ComponentPropsWit
  *   type="circle"
  * />
  */
-declare const CheckboxListItem: ({ label, description, type, checked, disabled, isError, className, CheckboxClassName, onChange, children, ...rest }: CheckboxListItemProps) => import("react/jsx-runtime").JSX.Element;
+declare const CheckboxListItem: ({ label, description, type, checked, disabled, isError, errorMessage, className, CheckboxClassName, onChange, children, ...rest }: CheckboxListItemProps) => import("react/jsx-runtime").JSX.Element;
 export default CheckboxListItem;

package/dist/Components/Inputs/CheckboxListItem/CheckboxListItem.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("../../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),i=require("tailwind-merge"),r=require("../../Base/Typography/Typography.js"),a=require("../../Base/Layouts/Box/Box.js"),t=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../Checkbox/Checkbox.js")),c=function(r){var a=r.children,t=r.disabled,c=r.hasDescription,l=r.className,r=e.__rest(r,["children","disabled","hasDescription","className"]);return s.jsx("label",e.__assign({className:i.twMerge("grid h-min grid-cols-checkbox-list-item-container grid-rows-checkbox-list-item-container gap-x-3 grid-areas-checkbox-list-item-container",c?"gap-y-0.5":"gap-y-0",t?"cursor-not-allowed":"cursor-pointer",l)},r,{children:a}))};module.exports=function(l){var d=l.label,o=l.description,n=l.type,n=void 0===n?"box":n,h=l.checked,m=l.disabled,m=void 0!==m&&m,x=l.isError,x=void 0!==x&&x,b=l.className,g=l.CheckboxClassName,u=l.onChange,p=l.children,l=e.__rest(l,["label","description","type","checked","disabled","isError","className","CheckboxClassName","onChange","children"]);return s.jsxs(c,{"data-testid":"design-system-checkboxList--item",disabled:m,hasDescription:!!o,className:i.twMerge("group",b),children:[s.jsx(a,{className:"cursor-pointer pt-1 grid-in-checkbox",children:s.jsx(t,e.__assign({checked:h,isError:x,disabled:m,onChange:u,className:g,type:n},l))}),s.jsxs(a,{className:"flex w-full items-center grid-in-label","data-testid":"design-system-checkboxList--item-label-root",children:[d&&s.jsx(r,{variant:"body1",className:i.twJoin("w-full whitespace-normal break-words",m?"text-w-gray-300":"text-w-gray-900"),"data-testid":"design-system-checkboxList--item-label",children:d}),p]}),o&&s.jsx(a,{className:"flex items-center grid-in-description",children:s.jsx(r,{variant:"body2",className:m?"text-w-gray-300":"text-w-gray-600","data-testid":"design-system-checkboxList--item-description",children:o})})]})};
+"use strict";var e=require("../../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),r=require("tailwind-merge"),i=require("../../Base/Typography/Typography.js"),a=require("../../Base/Layouts/Box/Box.js"),t=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../Checkbox/Checkbox.js")),c=function(i){var a=i.children,t=i.disabled,c=i.hasDescription,l=i.className,i=e.__rest(i,["children","disabled","hasDescription","className"]);return s.jsx("label",e.__assign({className:r.twMerge("grid h-min grid-cols-checkbox-list-item-container grid-rows-checkbox-list-item-container gap-x-3 grid-areas-checkbox-list-item-container",c?"gap-y-0.5":"gap-y-0",t?"cursor-not-allowed":"cursor-pointer",l)},i,{children:a}))};module.exports=function(l){var d=l.label,o=l.description,n=l.type,n=void 0===n?"box":n,h=l.checked,m=l.disabled,m=void 0!==m&&m,x=l.isError,x=void 0!==x&&x,g=l.errorMessage,b=l.className,u=l.CheckboxClassName,p=l.onChange,y=l.children,l=e.__rest(l,["label","description","type","checked","disabled","isError","errorMessage","className","CheckboxClassName","onChange","children"]);return s.jsxs(c,{"data-testid":"design-system-checkboxList--item",disabled:m,hasDescription:!!o,className:r.twMerge("group",b),children:[s.jsx(a,{className:"cursor-pointer pt-1 grid-in-checkbox",children:s.jsx(t,e.__assign({checked:h,isError:x,disabled:m,onChange:p,className:u,type:n},l))}),s.jsxs(a,{className:"flex w-full items-center grid-in-label","data-testid":"design-system-checkboxList--item-label-root",children:[d&&s.jsx(i,{variant:"body1",className:r.twJoin("w-full whitespace-normal break-words",m?"text-w-gray-300":"text-w-gray-900"),"data-testid":"design-system-checkboxList--item-label",children:d}),y]}),x&&g&&s.jsx(a,{className:"flex items-center grid-in-error",children:s.jsx(i,{variant:"body2",className:"text-w-red-500","data-testid":"design-system-checkboxList--item-error",children:g})}),o&&s.jsx(a,{className:"flex items-center grid-in-description",children:s.jsx(i,{variant:"body2",className:m?"text-w-gray-300":"text-w-gray-600","data-testid":"design-system-checkboxList--item-description",children:o})})]})};

package/dist/Components/Inputs/CommentArea/CommentArea.d.ts

@@ -1,7 +1,7 @@
 import { ComponentPropsWithRef, ReactNode } from 'react';
 interface InformationBoxProps {
     imgUrl?: string;
-    username?: string;
+    userId?: string;
 }
 export interface CommentAreaProps extends ComponentPropsWithRef<'textarea'>, InformationBoxProps {
     isReply?: boolean;

package/dist/Components/Inputs/CommentArea/CommentArea.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("../../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),a=require("react"),r=require("tailwind-merge"),t=require("../../Base/Typography/Typography.js"),l=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js")),n=(require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),c=require("../../DataDisplays/Divider/Divider.js"),o=require("../Button/Button.js"),d=require("../Checkbox/Checkbox.js"),m=function(e){var a=e.username,e=e.imgUrl;return s.jsxs(l,{className:"flex items-center gap-2",children:[s.jsx(i,{imgUrl:void 0===e?"":e}),s.jsx(t,{variant:"body1",className:"w-full font-medium text-w-gray-600",children:a})]})},u=function(e){e=e.guideText;return s.jsx(l,{className:"w-full bg-w-gray-10 px-4 py-2 text-w-gray-500",children:s.jsx("ul",{className:"flex flex-col gap-0.5 typo-body2",children:"string"==typeof e?s.jsx("li",{className:'before:mr-2 before:inline-flex before:items-center before:justify-center before:content-["•"]',children:e}):s.jsx(s.Fragment,{children:null==e?void 0:e.map(function(e){return s.jsx("li",{className:'before:mr-2 before:inline-flex before:items-center before:justify-center before:content-["•"]',children:e},e)})})})})},x=a.forwardRef(function(a,i){var x=a.imgUrl,g=a.username,f=a.isReply,y=a.guideText,p=a.buttonName,j=a.isSelected,h=a.optionMessage,b=a.cancelButtonName,b=void 0===b?"취소":b,w=a.onClose,N=a.onSubmit,v=a.onCheck,a=e.__rest(a,["imgUrl","username","isReply","guideText","buttonName","isSelected","optionMessage","cancelButtonName","onClose","onSubmit","onCheck"]),k=a.value,q=a.className,C=a.disabled,B=a.spellCheck,B=void 0!==B&&B,D=a.children,a=e.__rest(a,["value","className","disabled","spellCheck","children"]),_=""===k.trim(),_=!g||_||C;return s.jsxs(l,{"data-testid":"design-system-commentArea--full-container",className:r.twMerge("flex w-full items-start gap-4",q),children:[f&&s.jsx(n,{name:"medium_reply",className:"shrink-0 text-w-gray-400"}),s.jsxs(l,{"data-testid":"design-system-commentArea--container",className:"w-full rounded-xl border border-w-gray-200 bg-w-white",children:[s.jsx(l,{className:"flex w-full flex-col gap-2 px-4 py-3",children:D?s.jsx(l,{className:"h-[98px]",children:D}):s.jsxs(s.Fragment,{children:[g&&s.jsx(m,{imgUrl:x,username:g}),s.jsx("textarea",e.__assign({"data-testid":"design-system-commentArea",ref:i,value:k,spellCheck:B,disabled:C||!g,className:"h-[63px] w-full resize-none border-none bg-transparent tracking-default text-w-gray-900 outline-none placeholder:font-normal placeholder:text-w-gray-300 placeholder:typo-body1"},a))]})}),y&&s.jsx(l,{"data-testid":"design-system-commentArea--guide-message",className:"w-full bg-w-gray-10 px-4 py-2 text-w-gray-500",children:s.jsx(u,{guideText:y})}),s.jsx(c,{}),s.jsxs(l,{"data-testid":"design-system-commentArea--buttons",className:r.twMerge("flex w-full items-center justify-end px-4 py-3",h&&"justify-between"),children:[h&&s.jsxs("label",{className:"flex items-center gap-3",children:[s.jsx(d,{checked:j,onChange:v,disabled:C||!g}),s.jsx(t,{variant:"body1",className:"leading-none text-w-gray-900",children:h})]}),s.jsxs(l,{className:"flex w-fit shrink-0 items-center gap-3",children:[f&&s.jsx(o,{size:"sm",onClick:w,children:b}),s.jsx(o,{variant:"solid",size:"sm",disabled:_,onClick:N,children:p})]})]})]})]})});x.displayName="CommentArea",module.exports=x;
+"use strict";var e=require("../../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),r=require("react"),a=require("tailwind-merge"),t=require("../../Base/Typography/Typography.js"),l=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js")),n=(require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),o=require("../../DataDisplays/Divider/Divider.js"),c=require("../Button/Button.js"),d=require("../CheckboxListItem/CheckboxListItem.js"),m=function(e){var r=e.userId,e=e.imgUrl;return s.jsxs(l,{className:"flex items-center gap-2",children:[s.jsx(i,{imgUrl:void 0===e?"":e,size:"sm"}),s.jsx(t,{variant:"body1",className:"w-full font-medium text-w-gray-600",children:r})]})},u=function(e){e=e.guideText;return s.jsx(l,{className:"w-full bg-w-gray-10 text-w-gray-500",children:s.jsx("ul",{className:"flex flex-col gap-0.5 typo-body2",children:"string"==typeof e?s.jsx("li",{className:'before:mr-2 before:inline-flex before:items-center before:justify-center before:content-["•"]',children:e}):s.jsx(s.Fragment,{children:null==e?void 0:e.map(function(e){return s.jsx("li",{className:'before:mr-2 before:inline-flex before:items-center before:justify-center before:content-["•"]',children:e},e)})})})})},x=r.forwardRef(function(r,t){var i=r.imgUrl,x=r.userId,g=r.isReply,f=r.guideText,y=r.buttonName,j=r.isSelected,p=r.optionMessage,h=r.cancelButtonName,h=void 0===h?"취소":h,b=r.onClose,w=r.onSubmit,N=r.onCheck,r=e.__rest(r,["imgUrl","userId","isReply","guideText","buttonName","isSelected","optionMessage","cancelButtonName","onClose","onSubmit","onCheck"]),v=r.value,k=r.className,q=r.disabled,C=r.spellCheck,C=void 0!==C&&C,B=r.children,r=e.__rest(r,["value","className","disabled","spellCheck","children"]),D=""===v.trim(),D=!x||D||q,_=x&&p;return s.jsxs(l,{"data-testid":"design-system-commentArea--full-container",className:a.twMerge("flex w-full items-start gap-4",k),children:[g&&s.jsx(n,{name:"medium_reply",className:"shrink-0 text-w-gray-400"}),s.jsxs(l,{"data-testid":"design-system-commentArea--container",className:"w-full rounded-xl border border-w-gray-200 bg-w-white",children:[s.jsx(l,{className:"flex w-full flex-col gap-2 px-4 py-3",children:B?s.jsx(l,{className:"h-[98px]",children:B}):s.jsxs(s.Fragment,{children:[x&&s.jsx(m,{imgUrl:i,userId:x}),s.jsx("textarea",e.__assign({"data-testid":"design-system-commentArea",ref:t,value:v,spellCheck:C,disabled:q||!x,className:"h-[63px] w-full resize-none border-none bg-transparent tracking-default text-w-gray-900 outline-none placeholder:font-normal placeholder:text-w-gray-300 placeholder:typo-body1"},r))]})}),f&&s.jsx(l,{"data-testid":"design-system-commentArea--guide-message",className:"w-full bg-w-gray-10 px-4 py-2 text-w-gray-500",children:s.jsx(u,{guideText:f})}),s.jsx(o,{}),s.jsxs(l,{"data-testid":"design-system-commentArea--buttons",className:a.twMerge("flex w-full items-center justify-end px-4 py-3",_&&"justify-between"),children:[_&&s.jsx(d,{label:p,checked:j,onChange:N,disabled:q||!x}),s.jsxs(l,{className:"flex w-fit shrink-0 items-center gap-3",children:[g&&s.jsx(c,{size:"sm",onClick:b,color:"gray",children:h}),s.jsx(c,{variant:"solid",size:"sm",disabled:D,onClick:w,children:y})]})]})]})]})});x.displayName="CommentArea",module.exports=x;

package/dist/Components/Inputs/FilterList/FilterList.d.ts

@@ -8,6 +8,7 @@ export interface FilterListProps {
     title: string;
     buttonName: string;
     data: FilterItem[];
+    name?: string;
     className?: string;
     selectedValues?: string[];
     isAllSelected?: boolean;
@@ -25,14 +26,15 @@ export interface FilterListProps {
  * @param {object} props
  * @param {string} props.title - 필터 목록의 제목
  * @param {string} props.buttonName - 적용 버튼에 표시될 텍스트 (기본값: '적용하기')
+ * @param {string} [props.name] - 필터 목록의 이름
  * @param {FilterItem[]} props.data - 필터 항목 배열
  * @param {string} [props.className] - 컴포넌트에 적용할 추가 클래스명
  * @param {string[]} [props.selectedValues] - 선택된 필터 값들의 배열
  * @param {boolean} [props.isAllSelected] - 전체 선택 여부
  * @param {boolean} [props.isViewOnly] - 선택한 항목만 보기 모드 여부
- * @param {() => void} [props.onSelectAll] - 전체 선택 버튼 클릭 시 호출될 함수
+ * @param {() => void} [props.onSelectAll] - 전체 선택 버튼 클릭 시 호출될 함수, 존재할 때 전체선택 버튼 노출됨
  * @param {() => void} [props.onReset] - 초기화 버튼 클릭 시 호출될 함수
- * @param {() => void} [props.onViewOnly] - 선택한 항목만 보기 토글 시 호출될 함수
+ * @param {() => void} [props.onViewOnly] - 선택한 항목만 보기 토글 시 호출될 함수, 존재할 때 선택한 카테고리만 보기 CheckboxListItem 노출됨
  * @param {() => void} [props.onSubmit] - 적용 버튼 클릭 시 호출될 함수
  *
  * @example
@@ -47,6 +49,7 @@ export interface FilterListProps {
  *
  * <FilterList
  *   title="필터"
+ *   name="filter"
  *   buttonName="적용하기"
  *   data={filterItems}
  *   selectedValues={['category1']}
@@ -56,5 +59,5 @@ export interface FilterListProps {
  * />
  * ```
  */
-declare const FilterList: ({ title, buttonName, onSelectAll, isAllSelected, isViewOnly, data, className, selectedValues, onReset, onViewOnly, onSubmit, }: FilterListProps) => import("react/jsx-runtime").JSX.Element;
+declare const FilterList: ({ title, buttonName, name, onSelectAll, isAllSelected, isViewOnly, data, className, selectedValues, onReset, onViewOnly, onSubmit, }: FilterListProps) => import("react/jsx-runtime").JSX.Element;
 export default FilterList;

package/dist/Components/Inputs/IconButton/IconButton.d.ts

@@ -14,6 +14,7 @@ export interface IconButtonProps extends ComponentProps<'button'> {
  *   - 'md': 50px
  *   - 'lg': 60px
  * @param {boolean} [props.outline=false] - 외곽선 스타일 적용 여부를 지정합니다
+ * @param {boolean} [props.disabled=false] - 버튼 비활성화 여부를 지정합니다
  * @param {React.ReactNode} props.children - 버튼 내부에 표시될 아이콘 컴포넌트
  * @param {string} [props.className] - 추가적인 CSS 클래스
  * @param {function} [props.onClick] - 클릭 이벤트 핸들러
@@ -34,5 +35,5 @@ export interface IconButtonProps extends ComponentProps<'button'> {
  *   <Icon name="menu" />
  * </IconButton>
  */
-declare const IconButton: ({ size, outline, children, onClick, className, ...rest }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const IconButton: ({ size, outline, children, onClick, className, disabled, ...rest }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
 export default IconButton;

package/dist/Components/Inputs/IconButton/IconButton.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),i=require("react"),n=require("tailwind-merge"),r=require("../../Base/Layouts/Box/Box.js");module.exports=function(s){var u=s.size,u=void 0===u?"md":u,l=s.outline,l=void 0!==l&&l,a=s.children,o=s.onClick,c=s.className,s=e.__rest(s,["size","outline","children","onClick","className"]),d=i.useState(!1),m=d[0],f=d[1],p=i.useRef(null);return i.useEffect(function(){return function(){p.current&&clearTimeout(p.current)}},[]),t.jsxs("button",e.__assign({"data-testid":"design-system-icon-button",type:"button",className:n.twMerge("relative flex cursor-pointer items-center justify-center rounded-xl border bg-transparent","sm"===u?"size-6 rounded-lg":"md"===u?"size-9":"lg"===u?"size-[50px]":void 0,l?"border-w-gray-200 overflow-hidden":"border-transparent",c),onClick:function(e){null!=o&&o(e),f(!0),p.current&&clearTimeout(p.current),p.current=setTimeout(function(){f(!1)},300)}},s,{children:[m&&t.jsx(r,{"data-testid":"design-system-icon-button--ripple",className:n.twMerge("absolute h-full w-full bg-w-gray-500 bg-opacity-10",l&&"sm"===u?"animate-[rippleOutlineSmall_0.3s_ease-in-out_infinite]":l?"animate-[rippleOutline_0.3s_ease-in-out_infinite]":"animate-[ripple_0.3s_ease-in-out_infinite]")}),t.jsx(r,{"data-testid":"design-system-icon-button--icon",className:"absolute flex h-full w-full items-center justify-center",children:a})]}))};
+"use strict";var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),i=require("react"),r=require("tailwind-merge"),n=require("../../Base/Layouts/Box/Box.js");module.exports=function(s){var l=s.size,l=void 0===l?"md":l,u=s.outline,u=void 0!==u&&u,a=s.children,o=s.onClick,c=s.className,d=s.disabled,s=e.__rest(s,["size","outline","children","onClick","className","disabled"]),m=i.useState(!1),f=m[0],b=m[1],p=i.useRef(null);return i.useEffect(function(){return function(){p.current&&clearTimeout(p.current)}},[]),t.jsxs("button",e.__assign({"data-testid":"design-system-icon-button",type:"button",className:r.twMerge("relative flex items-center justify-center rounded-xl border bg-transparent",d?"cursor-not-allowed":"cursor-pointer","sm"===l?"size-6 rounded-lg":"md"===l?"size-9":"lg"===l?"size-[50px]":void 0,u?"border-w-gray-200 overflow-hidden":"border-transparent",c),onClick:function(e){null!=o&&o(e),b(!0),p.current&&clearTimeout(p.current),p.current=setTimeout(function(){b(!1)},300)},disabled:d},s,{children:[f&&t.jsx(n,{"data-testid":"design-system-icon-button--ripple",className:r.twMerge("absolute h-full w-full bg-w-gray-500 bg-opacity-10",u&&"sm"===l?"animate-[rippleOutlineSmall_0.3s_ease-in-out_infinite]":u?"animate-[rippleOutline_0.3s_ease-in-out_infinite]":"animate-[ripple_0.3s_ease-in-out_infinite]")}),t.jsx(n,{"data-testid":"design-system-icon-button--icon",className:"absolute flex h-full w-full items-center justify-center",children:a})]}))};

package/dist/Components/Inputs/IconButtonDropdown/IconButtonDropdown.d.ts

@@ -5,6 +5,7 @@ export type Item = {
     leadingIcon?: SystemIconName;
 };
 export interface IconButtonDropdownProps {
+    disabled?: boolean;
     icon: SystemIconName;
     size?: 'sm' | 'md' | 'lg';
     align?: 'left' | 'right';
@@ -20,6 +21,7 @@ export interface IconButtonDropdownProps {
  *
  * @param {Object} props
  * @param {SystemIconName} props.icon - 버튼에 표시될 아이콘
+ * @param {boolean} [props.disabled=false] - 버튼 비활성화 여부를 지정합니다
  * @param {('sm'|'md'|'lg')} [props.size='sm'] - 버튼의 크기
  * @param {('left'|'right')} [props.align='left'] - 드롭다운 목록의 정렬 방향
  * @param {Item[]} props.items - 드롭다운 목록에 표시될 항목들 ({key, value, leadingIcon}[])
@@ -43,5 +45,5 @@ export interface IconButtonDropdownProps {
  * />
  * ```
  */
-declare const IconButtonDropdown: ({ icon, items, selectedItem, onItemClick, size, align, }: IconButtonDropdownProps) => import("react/jsx-runtime").JSX.Element;
+declare const IconButtonDropdown: ({ icon, items, selectedItem, onItemClick, size, align, disabled, }: IconButtonDropdownProps) => import("react/jsx-runtime").JSX.Element;
 export default IconButtonDropdown;

package/dist/Components/Inputs/IconButtonDropdown/IconButtonDropdown.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),s=(require("../../DataDisplays/Avatar/Avatar.js"),require("../../../_virtual/_tslib.js"),require("../../Base/Layouts/Box/Box.js"),require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),i=require("../IconButton/IconButton.js"),n=require("../List/List.js"),o=require("../../../hooks/useDropdown.js");module.exports=function(r){var l=r.icon,a=r.items,u=r.selectedItem,d=r.onItemClick,c=r.size,c=void 0===c?"sm":c,r=r.align,r=void 0===r?"left":r,d=o({items:a,onItemClick:d}),m=d.isListOpen,j=d.ref,y=d.focusedIndex,v=d.handleItemClick,x=d.toggleListOpen,d=d.handleKeyDown;return e.jsxs("div",{"data-testid":"design-system-icon-button-dropdown",className:"relative w-fit outline-none",ref:j,onKeyDown:d,tabIndex:0,children:[e.jsx(i,{onClick:x,size:c,className:"outline-none",children:e.jsx(s,{name:l})}),m&&e.jsx("div",{"data-testid":"design-system-icon-button-dropdown--list-container",className:t.twJoin("absolute -bottom-2 z-40 translate-y-full transform transition-all","right"===r?"right-0":"left-0 "),children:e.jsx(n.Root,{className:"max-h-full min-w-40 overflow-y-visible",children:a.map(function(t,s){return e.jsx(n.Item,{text:t.value,leadingIcon:t.leadingIcon,onClick:function(){return v(t)},selected:t.key===(null==u?void 0:u.key),isFocused:s===y},t.key)})})})]})};
+"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),s=(require("../../DataDisplays/Avatar/Avatar.js"),require("../../../_virtual/_tslib.js"),require("../../Base/Layouts/Box/Box.js"),require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),i=require("../IconButton/IconButton.js"),n=require("../List/List.js"),a=require("../../../hooks/useDropdown.js");module.exports=function(o){var l=o.icon,r=o.items,d=o.selectedItem,u=o.onItemClick,c=o.size,c=void 0===c?"sm":c,m=o.align,m=void 0===m?"left":m,o=o.disabled,o=void 0!==o&&o,u=a({items:r,onItemClick:u}),y=u.isListOpen,j=u.ref,v=u.focusedIndex,x=u.handleItemClick,f=u.toggleListOpen,u=u.handleKeyDown;return e.jsxs("div",{"data-testid":"design-system-icon-button-dropdown",className:"relative w-fit outline-none",ref:j,onKeyDown:u,tabIndex:0,children:[e.jsx(i,{onClick:f,size:c,className:"outline-none",disabled:o,children:e.jsx(s,{name:l,className:t.twJoin(o&&"text-w-gray-300")})}),y&&e.jsx("div",{"data-testid":"design-system-icon-button-dropdown--list-container",className:t.twJoin("absolute -bottom-2 z-40 translate-y-full transform transition-all","right"===m?"right-0":"left-0 "),children:e.jsx(n.Root,{className:"max-h-full min-w-40 overflow-y-visible",children:r.map(function(t,s){return e.jsx(n.Item,{text:t.value,leadingIcon:t.leadingIcon,onClick:function(){return x(t)},selected:t.key===(null==d?void 0:d.key),isFocused:s===v},t.key)})})})]})};

package/dist/Components/Inputs/SearchField/SearchField.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("../../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),r=require("react"),t=(require("tailwind-merge"),require("../../Base/Layouts/Box/Box.js")),a=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),i=require("../TextButtonDropdown/TextButtonDropdown.js"),n=require("../TextFieldContainer/TextFieldContainer.js"),l=require("../Input/Input.js");require("../Input/PasswordInput.js"),require("../Input/LableInput.js"),require("../Input/InputTypeSelector.js"),module.exports=function(u){u.type;var o=u.onSearch,c=(u.className,u.disabled),d=u.spellCheck,p=u.onFocus,j=u.onBlur,m=u.filters,u=e.__rest(u,["type","onSearch","className","disabled","spellCheck","onFocus","onBlur","filters"]),x=r.useState(!1),q=x[0],h=x[1];return s.jsx("form",{onSubmit:function(e){e.preventDefault(),o()},"data-testid":"design-system-search-field",children:s.jsx("label",{className:"cursor-text",children:s.jsxs(n,{isFocused:q,isDisabled:c,className:"overflow-visible",children:[!!m&&s.jsx(t,{className:"shrink-0",children:s.jsx(i,e.__assign({},m))}),s.jsx(l,e.__assign({onFocus:function(e){h(!0),null!=p&&p(e)},onBlur:function(e){h(!1),null!=j&&j(e)},spellCheck:d||!1,disabled:c},u)),s.jsx("button",{type:"submit",className:"shrink-0",children:s.jsx(a,{name:"medium_search",className:"pointer-events-none text-w-gray-600"})})]})})})};
+"use strict";var e=require("../../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),t=require("react"),r=require("tailwind-merge"),a=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),n=require("../TextButtonDropdown/TextButtonDropdown.js"),l=require("../TextFieldContainer/TextFieldContainer.js"),u=require("../Input/Input.js");require("../Input/PasswordInput.js"),require("../Input/LableInput.js"),require("../Input/InputTypeSelector.js"),module.exports=function(o){o.type;var d=o.onSearch,c=(o.className,o.disabled),m=o.spellCheck,p=o.onFocus,j=o.onBlur,b=o.filters,o=e.__rest(o,["type","onSearch","className","disabled","spellCheck","onFocus","onBlur","filters"]),x=t.useState(!1),h=x[0],y=x[1];return s.jsx("form",{onSubmit:function(e){e.preventDefault(),d()},"data-testid":"design-system-search-field",children:s.jsx("label",{className:"cursor-text",children:s.jsxs(l,{isFocused:h,isDisabled:c,className:"overflow-visible",children:[!!b&&s.jsx(a,{className:"shrink-0",children:s.jsx(n,e.__assign({disabled:c},b))}),s.jsx(u,e.__assign({onFocus:function(e){y(!0),null!=p&&p(e)},onBlur:function(e){y(!1),null!=j&&j(e)},spellCheck:m||!1,disabled:c},o)),s.jsx("button",{type:"submit",className:"shrink-0","data-testid":"design-system-search-field--submit-button",disabled:c,children:s.jsx(i,{testId:"design-system-search-field--submit-button-icon",name:"medium_search",className:r.twMerge("pointer-events-none text-w-gray-600",c&&"text-w-gray-300")})})]})})})};

package/dist/Components/Inputs/TextButtonDropdown/TextButtonDropdown.d.ts

@@ -7,6 +7,7 @@ import { TextButtonDropdownProps } from './TextButtonDropdown.types';
  * @param {{key: string, value: string, leadingIcon?: React.ReactNode}} props.selectedItem - 현재 선택된 항목 ({key, value, leadingIcon}[])
  * @param {(item: {key: string, value: string, leadingIcon?: React.ReactNode}) => void} props.onItemClick - 항목 클릭 시 실행될 콜백 함수 (item: {key, value, leadingIcon} => void)
  * @param {boolean} [props.alignRight=false] - 드롭다운 메뉴를 오른쪽 정렬할지 여부
+ * @param {boolean} [props.disabled=false] - 드롭다운 메뉴를 비활성화할지 여부
  *
  * @example
  * const items = [
@@ -23,8 +24,9 @@ import { TextButtonDropdownProps } from './TextButtonDropdown.types';
  *     selectedItem={selected}
  *     onItemClick={setSelected}
  *     alignRight={false}
+ *     disabled={item.length === 0}
  *   />
  * );
  */
-declare const TextButtonDropdown: ({ items, selectedItem, onItemClick, alignRight, }: TextButtonDropdownProps) => import("react/jsx-runtime").JSX.Element;
+declare const TextButtonDropdown: ({ items, selectedItem, onItemClick, alignRight, disabled, }: TextButtonDropdownProps) => import("react/jsx-runtime").JSX.Element;
 export default TextButtonDropdown;

package/dist/Components/Inputs/TextButtonDropdown/TextButtonDropdown.js

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),n=require("../List/List.js"),i=require("../../../hooks/useDropdown.js"),s=require("./TextButtonDropdown.parts.js");module.exports=function(o){var l=o.items,r=o.selectedItem,a=o.onItemClick,o=o.alignRight,o=void 0!==o&&o,a=i({items:l,onItemClick:a}),d=a.isListOpen,u=a.ref,c=a.focusedIndex,m=a.handleItemClick,x=a.toggleListOpen,a=a.handleKeyDown;return e.jsxs("div",{"data-testid":"design-system-text-button-dropdown",className:"relative flex w-fit flex-col gap-1 outline-none",ref:u,onKeyDown:a,tabIndex:0,children:[e.jsx(s.TextButton,{value:r.value,"data-testid":"design-system-text-button-dropdown--textButton",isListOpen:d,onClick:x}),d&&e.jsx("div",{className:t.twJoin("absolute -bottom-2 z-40 translate-y-full transform transition-all",o?"right-0":"left-0 "),children:e.jsx(n.Root,{className:"max-h-full min-w-40 overflow-y-visible",children:l.map(function(t,i){return e.jsx(n.Item,{text:t.value,leadingIcon:t.leadingIcon,onClick:function(){return m(t)},selected:t.key===(null==r?void 0:r.key),isFocused:i===c},t.key)})})})]})};
+"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),i=require("../List/List.js"),n=require("../../../hooks/useDropdown.js"),s=require("./TextButtonDropdown.parts.js");module.exports=function(o){var l=o.items,d=o.selectedItem,r=o.onItemClick,a=o.alignRight,a=void 0!==a&&a,o=o.disabled,o=void 0!==o&&o,r=n({items:l,onItemClick:r}),u=r.isListOpen,c=r.ref,m=r.focusedIndex,x=r.handleItemClick,f=r.toggleListOpen,r=r.handleKeyDown;return e.jsxs("div",{"data-testid":"design-system-text-button-dropdown",className:"relative flex w-fit flex-col gap-1 outline-none",ref:c,onKeyDown:r,tabIndex:0,children:[e.jsx(s.TextButton,{disabled:o,value:d.value,"data-testid":"design-system-text-button-dropdown--textButton",isListOpen:u,onClick:f}),u&&e.jsx("div",{className:t.twJoin("absolute -bottom-2 z-40 translate-y-full transform transition-all",a?"right-0":"left-0 "),"data-testid":"design-system-text-button-dropdown--list",children:e.jsx(i.Root,{className:"max-h-full min-w-40 overflow-y-visible",children:l.map(function(t,n){return e.jsx(i.Item,{text:t.value,leadingIcon:t.leadingIcon,onClick:function(){return x(t)},selected:t.key===(null==d?void 0:d.key),isFocused:n===m},t.key)})})})]})};

package/dist/Components/Inputs/TextButtonDropdown/TextButtonDropdown.parts.d.ts

@@ -4,5 +4,5 @@ interface TextButtonProps extends ComponentProps<'button'> {
     value: Item['value'];
     isListOpen: boolean;
 }
-export declare const TextButton: ({ value, isListOpen, ...rest }: TextButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TextButton: ({ value, isListOpen, disabled, className, ...rest }: TextButtonProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/Components/Inputs/TextButtonDropdown/TextButtonDropdown.parts.js

@@ -1 +1 @@
-"use strict";var e=require("../../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),r=require("tailwind-merge"),s=(require("../../DataDisplays/Avatar/Avatar.js"),require("../../Base/Typography/Typography.js")),t=(require("../../Base/Layouts/Box/Box.js"),require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));exports.TextButton=function(i){var n=i.value,u=i.isListOpen,i=e.__rest(i,["value","isListOpen"]);return a.jsxs("button",e.__assign({type:"button",className:"flex items-center gap-2 outline-none"},i,{children:[a.jsx(s,{variant:"body1",className:"text-w-gray-600",children:n}),a.jsx("span",{className:r.twJoin("transition-transform duration-300",u&&"rotate-180"),children:a.jsx(t,{name:"medium_arrow_down",className:"text-w-gray-600"})})]}))};
+"use strict";var e=require("../../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),r=require("tailwind-merge"),s=(require("../../DataDisplays/Avatar/Avatar.js"),require("../../Base/Typography/Typography.js")),t=(require("../../Base/Layouts/Box/Box.js"),require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Label/Label.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));exports.TextButton=function(i){var l=i.value,n=i.isListOpen,o=i.disabled,u=i.className,i=e.__rest(i,["value","isListOpen","disabled","className"]);return a.jsxs("button",e.__assign({type:"button",className:r.twMerge("flex items-center gap-2 outline-none",o?"cursor-not-allowed":"cursor-pointer",u),disabled:o},i,{children:[a.jsx(s,{variant:"body1",className:r.twMerge("text-w-gray-600",o&&"text-w-gray-300"),children:l}),a.jsx("span",{className:r.twJoin("transition-transform duration-300",n&&"rotate-180"),children:a.jsx(t,{name:"medium_arrow_down",className:r.twMerge("text-w-gray-600",o&&"text-w-gray-300")})})]}))};

package/dist/Components/Inputs/TextButtonDropdown/TextButtonDropdown.types.d.ts

@@ -5,6 +5,7 @@ export type Item = {
     leadingIcon?: SystemIconName;
 };
 export interface TextButtonDropdownProps {
+    disabled?: boolean;
     items: Item[];
     selectedItem: Item;
     onItemClick: (item: Item) => void;

package/dist/Components/Inputs/TextFieldContainer/TextFieldContainer.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),s=require("../../Base/Typography/Typography.js"),a=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../../_virtual/_tslib.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));module.exports=function(t){var l=t.children,o=t.className,n=t.leadingIcon,d=t.trailingIcon,c=t.isLeadingIconSolid,u=t.isTrailingIconSolid,y=t.measure,g=t.isFocused,m=t.isDisabled,x=t.isError,p=t.onClick,w=t.isTextarea,b=t.isAutoComplete,t=t.testId;return e.jsxs(a,{className:r.twMerge("group flex w-full items-center gap-3 overflow-hidden rounded-xl border bg-w-white px-4 py-[11px]",m?"border-w-gray-200":x?"border-w-red-500":g?"border-primary":"border-w-gray-200 hover:border-primary",m&&"cursor-not-allowed bg-w-gray-10",w&&"relative p-0",b&&"flex-wrap",o),"data-testid":t||"design-system--text-field-container",onClick:p,children:[n&&e.jsx(i,{name:n,solid:c,className:"shrink-0 text-w-gray-600",testId:"design-system--text-field-container-leading-icon"}),l,y&&e.jsx(s,{variant:"body1",className:"w-fit shrink-0 text-w-gray-400",children:y}),d&&e.jsx(i,{name:d,solid:u,className:"shrink-0 text-w-gray-600",testId:"design-system--text-field-container-trailing-icon"})]})};
+"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),a=require("../../Base/Typography/Typography.js"),s=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/Label/Label.js"),require("../../../_virtual/_tslib.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));module.exports=function(t){var l=t.children,o=t.className,n=t.leadingIcon,d=t.trailingIcon,g=t.isLeadingIconSolid,c=t.isTrailingIconSolid,y=t.measure,u=t.isFocused,x=t.isDisabled,w=t.isError,m=t.onClick,p=t.isTextarea,b=t.isAutoComplete,t=t.testId;return e.jsxs(s,{className:r.twMerge("group flex w-full items-center gap-3 overflow-hidden rounded-xl border  px-4 py-[11px]",x?"border-w-gray-200":w?"border-w-red-500":u?"border-primary":"border-w-gray-200 hover:border-primary",x?"bg-w-gray-10":"bg-w-white",x&&"cursor-not-allowed",p&&"relative p-0",b&&"flex-wrap",o),"data-testid":t||"design-system--text-field-container",onClick:m,children:[n&&e.jsx(i,{name:n,solid:g,className:r.twMerge("shrink-0 text-w-gray-600",x&&"text-w-gray-300"),testId:"design-system--text-field-container-leading-icon"}),l,y&&e.jsx(a,{variant:"body1",className:r.twMerge("w-fit shrink-0 text-w-gray-400",x&&"text-w-gray-300"),children:y}),d&&e.jsx(i,{name:d,solid:c,className:r.twMerge("shrink-0 text-w-gray-600",x&&"text-w-gray-300"),testId:"design-system--text-field-container-trailing-icon"})]})};

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

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("tailwind-merge"),a=require("../../Base/Typography/Typography.js"),n=require("../../Base/Layouts/Box/Box.js"),i=(require("../../Base/Layouts/FullBleed/FullBleed.js"),r.createContext({activeTab:0,currentActiveTab:0,handleTabClick:function(e){}}));exports.Panel=function(t){var a=t.children,t=t.index;return r.useContext(i).activeTab===t&&e.jsx(n,{"data-testid":"design-system-boxTab--content",children:a})},exports.Root=function(t){var n=t.children,a=t.currentActiveTab,l=void 0===a?0:a,s=t.onChange,a=r.useState(l),t=a[0],c=a[1];return r.useEffect(function(){c(l)},[l]),e.jsx(i.Provider,{value:{activeTab:t,currentActiveTab:l,handleTabClick:function(e){null!=s&&s(e),c(e)}},children:n})},exports.Tab=function(l){var s=l.children,c=l.index,o=l.className,d=l.isFirst,u=l.isLast,l=l.disabled,x=void 0!==l&&l,l=r.useContext(i),b=l.handleTabClick,l=l.activeTab,l=c===l;return e.jsx(n,{tabIndex:0,"data-testid":"design-system-boxTab--item-".concat(c),className:t.twMerge("group flex w-full cursor-pointer items-center border border-w-gray-200 bg-w-white px-6 py-4","relative","-ml-px",l&&"z-[1] border-primary bg-primary-10",d&&"ml-0 rounded-l-xl",u&&"rounded-r-xl",x&&"cursor-not-allowed border-w-gray-200 bg-w-gray-10",o),onClick:function(){x||b(c)},children:e.jsx(n,{className:t.twMerge("relative flex w-full flex-row items-center justify-center font-normal text-w-gray-600",l&&"font-medium text-primary"),children:e.jsx(a,{variant:"body1",className:"relative",children:s})})})},exports.Tabs=function(a){var i=a.children,a=a.className,l=r.Children.toArray(i);return e.jsx(n,{className:t.twJoin("relative block w-full",a),"data-testid":"design-system-boxTab--container",children:e.jsx(n,{children:e.jsx(n,{className:t.twMerge("inline-flex w-full"),children:l.map(function(t,n){t=r.cloneElement(t,{isFirst:0===n,isLast:n===l.length-1});return e.jsx(r.Fragment,{children:t},n)})})})})};
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("tailwind-merge"),a=require("../../Base/Typography/Typography.js"),i=require("../../Base/Layouts/Box/Box.js"),n=(require("../../Base/Layouts/FullBleed/FullBleed.js"),r.createContext({activeTab:0,currentActiveTab:0,handleTabClick:function(e){}}));exports.Panel=function(t){var a=t.children,t=t.index;return r.useContext(n).activeTab===t&&e.jsx(i,{"data-testid":"design-system-boxTab--content",children:a})},exports.Root=function(t){var i=t.children,a=t.currentActiveTab,s=void 0===a?0:a,l=t.onChange,a=r.useState(s),t=a[0],c=a[1];return r.useEffect(function(){c(s)},[s]),e.jsx(n.Provider,{value:{activeTab:t,currentActiveTab:s,handleTabClick:function(e){null!=l&&l(e),c(e)}},children:i})},exports.Tab=function(s){var l=s.children,c=s.index,o=s.className,d=s.isFirst,u=s.isLast,s=s.disabled,x=void 0!==s&&s,s=r.useContext(n),b=s.handleTabClick,s=s.activeTab,s=c===s;return e.jsx(i,{tabIndex:0,"data-testid":"design-system-boxTab--item-".concat(c),className:t.twMerge("group flex w-full cursor-pointer items-center border border-w-gray-200 bg-w-white px-6 py-4 hover:bg-w-gray-10","relative","-ml-px",s&&"z-[1] border-primary bg-primary-10 hover:bg-primary-10",d&&"ml-0 rounded-l-xl",u&&"rounded-r-xl",o),onClick:function(){x||b(c)},children:e.jsx(i,{className:t.twMerge("relative flex w-full flex-row items-center justify-center font-normal text-w-gray-600",s&&"font-medium text-primary"),children:e.jsx(a,{variant:"body1",className:"relative",children:l})})})},exports.Tabs=function(a){var n=a.children,a=a.className,s=r.Children.toArray(n);return e.jsx(i,{className:t.twJoin("relative block w-full",a),"data-testid":"design-system-boxTab--container",children:e.jsx(i,{children:e.jsx(i,{className:t.twMerge("inline-flex w-full"),children:s.map(function(t,i){t=r.cloneElement(t,{isFirst:0===i,isLast:i===s.length-1});return e.jsx(r.Fragment,{children:t},i)})})})})};

package/dist/Components/Navigations/Menu/Menu.d.ts

@@ -1,16 +1,20 @@
 import { ReactNode } from 'react';
-import { SystemIconName } from '../../DataDisplays';
+import { MediumSystemIconName, SmallSystemIconName } from '../../DataDisplays/SystemIcon';
+import { Item } from '../../Inputs/IconButtonDropdown/IconButtonDropdown';
 export interface MenuProps {
     type?: 'main' | 'sub';
     variant?: 'white' | 'gray';
     name: string;
     badgeCount?: string;
     isSelected?: boolean;
-    leadingIcon?: SystemIconName;
-    trailingIcon?: SystemIconName;
+    leadingIcon?: MediumSystemIconName;
+    iconButtonName?: SmallSystemIconName;
     onClick: () => void;
     onOptionClick?: () => void;
     children?: ReactNode;
+    items?: Item[];
+    selectedItem?: Item;
+    onItemClick?: (item: Item) => void;
 }
 /**
  * 메뉴 컴포넌트는 네비게이션에서 사용되는 클릭 가능한 항목을 표시합니다.
@@ -21,11 +25,14 @@ export interface MenuProps {
  * @param {string} props.name - 메뉴에 표시될 텍스트
  * @param {string} [props.badgeCount] - 메뉴 항목에 표시될 뱃지 숫자
  * @param {boolean} [props.isSelected=false] - 메뉴 선택 상태
- * @param {SystemIconName} [props.leadingIcon] - 메뉴 앞쪽에 표시될 아이콘
- * @param {SystemIconName} [props.trailingIcon] - 메뉴 뒤쪽에 표시될 아이콘
+ * @param {SystemIconName} [props.leadingIcon] - 메뉴 앞쪽에 표시될 아이콘(medium 사이즈)
+ * @param {SystemIconName} [props.iconButtonName] - IconButtonDropdown 아이콘(small 사이즈)
  * @param {() => void} props.onClick - 메뉴 클릭 시 실행될 함수
- * @param {() => void} [props.onOptionClick] - 후행 아이콘 클릭 시 실행될 함수
- * @param {ReactNode} [props.children] - 메뉴 내부에 표시될 자식 요소
+ * @param {() => void} [props.onOptionClick] - 후행 아이콘 클릭 시 실행될 함수 (IconButtonDropdown이 아닌 IconButton으로만 사용 시 필요)
+ * @param {ReactNode} [props.children] - 메뉴 내부에 표시될 자식 요소 (IconButtonDropdown 컴포넌트 사용 시 필요, trailingIcon과 함께 사용하지 않도록 주의 필요)
+ * @param {Item[]} [props.items] - IconButtonDropdown 컴포넌트 사용 시 필요 {key: number, value: string}[]
+ * @param {Item} [props.selectedItem] - IconButtonDropdown 컴포넌트 사용 시 필요 {key: number, value: string}
+ * @param {(item: Item) => void} [props.onItemClick] - IconButtonDropdown 컴포넌트 사용 시 필요 (item: Item) => {}
  *
  * @example
  * // 기본 메뉴
@@ -43,15 +50,25 @@ export interface MenuProps {
  *   onClick={() => console.log('서브 메뉴 클릭')}
  * />
  *
- * // 선택된 상태의 옵션 메뉴
+ * // IconButtonDropdown과 함께 사용시
+ * <Menu
+ *   name="메뉴"
+ *   onClick={() => console.log('메뉴 클릭')}
+ *   iconButtonName="small_more_options"
+ *   items={items}
+ *   selectedItem={selectedItem}
+ *   onItemClick={onItemClick}
+ * />
+ *
+ * // 드롭다운이 필요하지 않은 옵션 메뉴(ex. 버튼 클릭 시 모달 오픈))
  * <Menu
  *   variant="gray"
  *   name="옵션 메뉴"
  *   isSelected={true}
- *   trailingIcon="more"
+ *   iconButtonName="small_more_options"
  *   onClick={() => console.log('메뉴 클릭')}
- *   onOptionClick={() => console.log('옵션 클릭')}
+ *   onOptionClick={() => console.log('옵션 클릭', '모달 오픈')}
  * />
  */
-declare const Menu: ({ type, variant, name, isSelected, badgeCount, leadingIcon, trailingIcon, children, onClick, onOptionClick, }: MenuProps) => import("react/jsx-runtime").JSX.Element;
+declare const Menu: ({ type, variant, name, isSelected, badgeCount, leadingIcon, iconButtonName, onClick, onOptionClick, items, selectedItem, onItemClick, }: MenuProps) => import("react/jsx-runtime").JSX.Element;
 export default Menu;

package/dist/Components/Navigations/Menu/Menu.js

@@ -1 +1 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),a=(require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/CountBadge/CountBadge.js")),t=require("../../Base/Typography/Typography.js"),i=require("../../Base/Layouts/Box/Box.js"),s=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Label/Label.js"),require("../../../_virtual/_tslib.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js"));module.exports=function(n){var o,l,g=n.type,g=void 0===g?"main":g,u=n.variant,u=void 0===u?"white":u,y=n.name,d=n.isSelected,d=void 0!==d&&d,m=n.badgeCount,c=n.leadingIcon,p=n.trailingIcon,w=n.children,h=n.onClick,x=n.onOptionClick,n=!w&&p&&x;return e.jsxs(i,{"data-testid":"design-system-menu",className:(o=u,l=d,g="sub"===g?"pl-12":"",l={white:r.twJoin("bg-w-white hover:bg-w-gray-50",l&&"bg-primary-10 text-primary hover:bg-primary-10"),gray:r.twJoin("bg-w-gray-50 hover:bg-w-gray-100",l&&"bg-w-gray-100  hover:bg-w-gray-100")},r.twMerge("flex w-full cursor-pointer items-center gap-2 rounded-xl px-4 py-3 text-w-gray-900",g,l[o])),onClick:h,children:[c&&e.jsx(s,{testId:"design-system-menu-leading-icon",name:c,className:r.twJoin("white"===u&&d&&"text-primary")}),e.jsx(t,{"data-testid":"design-system-menu-name",variant:"body1",className:"w-full select-none",children:y}),m&&e.jsx(a,{variant:"white"!==u?"white_gray":d?"primary":"gray",text:m,className:"relative",showZero:!0}),w,n&&e.jsx(i,{onClick:function(e){e.stopPropagation(),x()},children:e.jsx(s,{testId:"design-system-menu-trailing-icon",name:p,className:"cursor-pointer"})})]})};
+"use strict";var e=require("react/jsx-runtime"),t=require("tailwind-merge"),r=(require("../../DataDisplays/Avatar/Avatar.js"),require("../../DataDisplays/CountBadge/CountBadge.js")),s=require("../../Base/Typography/Typography.js"),i=require("../../Base/Layouts/Box/Box.js"),n=(require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Label/Label.js"),require("../../../_virtual/_tslib.js"),require("../../DataDisplays/SystemIcon/SystemIcon.js")),a=(require("react"),require("@wishket/yogokit"),require("../../Inputs/AutoCompleteList/AutoCompleteList.parts.js"),require("../../Inputs/Input/Input.js"),require("../../Inputs/Input/PasswordInput.js"),require("../../Inputs/Input/LableInput.js"),require("../../Inputs/Input/InputTypeSelector.js"),require("../../Inputs/Calendar/Calendar.utils.js"),require("../../Inputs/Checkbox/Checkbox.js"),require("../../Inputs/ChoiceChip/ChoiceChip.js"),require("../../Inputs/IconButton/IconButton.js")),u=(require("../../Inputs/Radio/Radio.js"),require("../../Inputs/TextField/TextField.js"),require("../../Inputs/CommentArea/CommentArea.js"),require("../../Inputs/IconButtonDropdown/IconButtonDropdown.js"));require("../../Inputs/MultiColumnList/MultiColumnList.parts.js"),require("../../Inputs/FilterChip/FilterChip.js"),module.exports=function(o){var l,p,m=o.type,m=void 0===m?"main":m,c=o.variant,c=void 0===c?"white":c,d=o.name,I=o.isSelected,I=void 0!==I&&I,y=o.badgeCount,g=o.leadingIcon,j=o.iconButtonName,q=o.onClick,h=o.onOptionClick,w=o.items,C=o.selectedItem,o=o.onItemClick,x=!!(j&&w&&o&&C),b=!!j&&!!h;return e.jsxs(i,{"data-testid":"design-system-menu",className:(l=c,p=I,m="sub"===m?"pl-12":"",p={white:t.twJoin("bg-w-white hover:bg-w-gray-50",p&&"bg-primary-10 text-primary hover:bg-primary-10"),gray:t.twJoin("bg-w-gray-50 hover:bg-w-gray-100",p&&"bg-w-gray-100  hover:bg-w-gray-100")},t.twMerge("flex w-full cursor-pointer items-center gap-2 rounded-xl px-4 py-3 text-w-gray-900",m,p[l])),onClick:q,children:[g&&e.jsx(n,{testId:"design-system-menu-leading-icon",name:g,className:t.twJoin("white"===c&&I&&"text-primary")}),e.jsx(s,{"data-testid":"design-system-menu-name",variant:"body1",className:"w-full select-none",children:d}),y&&e.jsx(r,{variant:"white"!==c?"white_gray":I?"primary":"gray",text:y,className:"relative",showZero:!0}),x&&e.jsx(u,{size:"sm",icon:j,items:w,selectedItem:C,onItemClick:o}),b&&e.jsx(a,{size:"sm",className:"shrink-0",onClick:function(e){e.stopPropagation(),h()},children:e.jsx(n,{name:j})})]})};

package/dist/config/tailwind.config.js

@@ -88,8 +88,8 @@ module.exports = {
         'default-desktop': [
           'content content content content content content content content content content content content',
         ],
-        'checkbox-list-item-container': ['checkbox label', '. description'],
-        'radio-list-item-container': ['radio label', '. description'],
+        'checkbox-list-item-container': ['checkbox label', '. error','. description'],
+        'radio-list-item-container': ['radio label','. error', '. description'],
       },
       gridTemplateRows: {
         'checkbox-list-item-container': 'min-content min-content',

package/package.json

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