@wishket/design-system 0.0.0-20261102064708 → 0.0.0-20261102065002

package/dist/Components/DataDisplays/SystemIcon/SystemIcon.d.ts

@@ -17,7 +17,7 @@ import { SystemIconProps } from './SystemIcon.types';
  * // 커스텀 클래스와 함께 사용
  * <SystemIcon
  *   name="medium_check"
- *   className="text-primary-500"
+ *   className="text-blue-500"
  *   solid={true}
  * />
  *

package/dist/Components/DataDisplays/SystemIcon/SystemIcon.js

@@ -17,7 +17,7 @@ import{jsx as t}from"react/jsx-runtime";import{twMerge as e}from"tailwind-merge"
  * // 커스텀 클래스와 함께 사용
  * <SystemIcon
  *   name="medium_check"
- *   className="text-primary-500"
+ *   className="text-blue-500"
  *   solid={true}
  * />
  *

package/dist/Components/Feedbacks/LoadingIndicator/LoadingIndicator.js

@@ -17,8 +17,8 @@ import{jsx as e,jsxs as t}from"react/jsx-runtime";import{twMerge as i}from"tailw
  * // 고정 위치에 큰 크기로 표시
  * <LoadingIndicator isFixed size="lg" />
  *
- * // 어두운 배경 위에서는 흰색 (색은 className 이 아니라 variant 로)
- * <LoadingIndicator variant="white" />
+ * // 커스텀 클래스 적용
+ * <LoadingIndicator className="text-blue-500" />
  *
  */const n={primary:"text-primary",white:"text-w-white",gray:"text-w-gray-400"},o=({variant:o="primary",isFixed:s=!1,size:c="md",ariaLabel:d="로딩 중",className:m})=>{const{width:u,height:p,viewBox:x,circle:h,r:g}=a[c],y=n[o];/*#__PURE__*/
 return e(r,{role:"status","aria-live":"polite","aria-label":d,"aria-busy":"true",className:i("top-1/2 left-1/2 aspect-square -translate-x-1/2 -translate-y-1/2",s?"fixed":"absolute",l(c)),children:/*#__PURE__*/t("svg",{xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true","data-testid":"loading-indicator-svg",width:u,height:p,viewBox:x,fill:"none",className:i(y,m),children:[

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

@@ -1,6 +1,6 @@
 import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import{Typography as r}from"../../Base/Typography/Typography.js";import"../../Base/Layouts/Box/Box.js";import"tailwind-merge";import"../../Base/Layouts/FullBleed/FullBleed.js";
 // return A ~ Z
-const i=Array.from({length:26},((e,t)=>String.fromCharCode(65+t))),l=({onIndexClick:t})=>/*#__PURE__*/e("ul",{className:"bg-w-gray-10 flex flex-col gap-0.5 rounded-l-xl p-[3px] text-center",children:i.map((a=>/*#__PURE__*/e("li",{className:"size-3.5 cursor-pointer",onClick:()=>null==t?void 0:t(a),children:/*#__PURE__*/e(r,{variant:"caption11",className:"text-w-gray-400",children:a})},a)))}),n=({iconUrl:t})=>/*#__PURE__*/e("img",{src:t,alt:"icon",width:24,height:24,className:"rounded-full border"}),s=({text:i,isInputItem:l,inputValue:n})=>{const s=i.slice(0,null==n?void 0:n.length),o=i.slice(null==n?void 0:n.length);/*#__PURE__*/
+const i=Array.from({length:26},((e,t)=>String.fromCharCode(65+t))),l=({onIndexClick:t})=>/*#__PURE__*/e("ul",{className:"bg-w-gray-10 flex flex-col gap-0.5 rounded-l-xl p-[3px] text-center",children:i.map((a=>/*#__PURE__*/e("li",{className:"size-3.5 cursor-pointer",onClick:()=>null==t?void 0:t(a),children:/*#__PURE__*/e(r,{variant:"caption11",className:"text-gray-400",children:a})},a)))}),n=({iconUrl:t})=>/*#__PURE__*/e("img",{src:t,alt:"icon",width:24,height:24,className:"rounded-full border"}),s=({text:i,isInputItem:l,inputValue:n})=>{const s=i.slice(0,null==n?void 0:n.length),o=i.slice(null==n?void 0:n.length);/*#__PURE__*/
 return e(t,{children:l?/*#__PURE__*/a(t,{children:[
 /*#__PURE__*/a(r,{variant:"body16",className:"text-primary-500 font-medium","data-testid":"design-system-list-item-text",children:["‘",i,"’"]}),
 /*#__PURE__*/e(r,{variant:"body16",className:"text-w-gray-600",children:"입력"})]}):/*#__PURE__*/e(r,{variant:"body16",className:"text-w-gray-600","data-testid":"design-system-list-item-text",children:n?/*#__PURE__*/a(t,{children:[

package/dist/Components/Inputs/Calendar/Calendar.js

@@ -57,8 +57,7 @@
 }),[F]),/*#__PURE__*/e(n,{className:s("relative h-fit w-fit select-none",N),"data-testid":"design-system-calendar--container",children:[
 /*#__PURE__*/a(n,{className:"cursor-pointer",children:/*#__PURE__*/e(l,{isFocused:F,isError:C,isDisabled:j,testId:"design-system-calendar--trigger",onClick:S,className:$,children:[
 /*#__PURE__*/a(i,{name:"medium_calendar",className:j||!w?"text-w-gray-300":"text-w-gray-400"}),
-/*#__PURE__*/a(o,{variant:"body16",className:s("text-w-gray-600 min-w-[178px]",!w&&"text-w-gray-300",// 비활성: 값은 gray-300, 플레이스홀더는 gray-200 (Input.tsx 와 같은 규칙)
-j&&(w?"text-w-gray-300":"text-w-gray-200")),"data-testid":"design-system-calendar--selected-date",children:w?`${E} ${_} ${q}`:b})]})}),F&&/*#__PURE__*/a("div",{className:"fixed top-0 left-0 z-10 h-screen w-screen bg-transparent",onClick:S}),F&&/*#__PURE__*/e(n,{"data-testid":"design-system-calendar--content",className:s("border-w-gray-200 bg-w-white shadow-graymedium absolute top-[54px] z-30 flex w-[350px] flex-col gap-4 rounded-xl border px-[15px] py-[23px]",B),children:[
+/*#__PURE__*/a(o,{variant:"body16",className:s("text-w-gray-600 min-w-[178px]",!w&&"text-w-gray-300",j&&"text-w-gray-300"),"data-testid":"design-system-calendar--selected-date",children:w?`${E} ${_} ${q}`:b})]})}),F&&/*#__PURE__*/a("div",{className:"fixed top-0 left-0 z-10 h-screen w-screen bg-transparent",onClick:S}),F&&/*#__PURE__*/e(n,{"data-testid":"design-system-calendar--content",className:s("border-w-gray-200 bg-w-white shadow-graymedium absolute top-[54px] z-30 flex w-[350px] flex-col gap-4 rounded-xl border px-[15px] py-[23px]",B),children:[
 /*#__PURE__*/a(d,{visibleDate:L,onChange:e=>{k(e)}}),
 /*#__PURE__*/a(c,{}),
 /*#__PURE__*/a(n,{className:"grid w-full grid-cols-7 place-content-center place-items-center gap-1",children:H.map(((e,t)=>{const r=!(!e||!w)&&h(e,z);return e?/*#__PURE__*/a(m,{date:e,selected:r,disabled:u(e,v,A),onChange:J},`${e.year}-${e.month}-${e.date}`):/*#__PURE__*/a(m,{disabled:!0},t)}))})]})]})};export{f as Calendar};

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

@@ -1,7 +1,7 @@
 import{jsxs as e,jsx as t}from"react/jsx-runtime";import{twMerge as a}from"tailwind-merge";import"../../DataDisplays/Avatar/Avatar.js";import{Typography as r}from"../../Base/Typography/Typography.js";import{Box as l}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";import"react";import{SystemIcon as s}from"../../DataDisplays/SystemIcon/SystemIcon.js";import"../../DataDisplays/SystemIcon/SystemIcon.constants.js";import"../../../constants/colors/colors.js";import"../../DataDisplays/Accordion/Accordion.js";import{getKoreanTimeString as n}from"./Calendar.utils.js";import{dayMap as o}from"./Calendar.constants.js";const i=()=>{const e=Array.from(o.values());/*#__PURE__*/
 return t(l,{className:"grid w-full grid-cols-7 place-items-center gap-1",children:e.map((e=>/*#__PURE__*/t(l,{className:"flex h-5 items-center justify-center",children:/*#__PURE__*/t(r,{variant:"body13",className:"text-w-gray-500 leading-normal",children:e})},e)))})},m=({visibleDate:a,onChange:o})=>{const i=1===(null==a?void 0:a.month),m=12===(null==a?void 0:a.month),{year:c,month:d}=a&&n(a);/*#__PURE__*/
 return e(l,{className:"flex h-[50px] w-full gap-4",children:[
-/*#__PURE__*/t(l,{"data-testid":"design-system-calendar--to-prev-month",className:"text-w-gray-600 size-6 cursor-pointer",onClick:()=>{i?null==o||o({year:a.year-1,month:12,date:1}):null==o||o({year:a.year,month:a.month-1,date:1})},children:/*#__PURE__*/t(s,{name:"large_arrow_left",className:"text-w-gray-600"})}),
-/*#__PURE__*/e(r,{variant:"subTitle18",className:"text-w-gray-900 h-fit w-full text-center leading-normal",children:[c," ",d]}),
-/*#__PURE__*/t(l,{"data-testid":"design-system-calendar--to-next-month",className:"text-w-gray-600 size-6 cursor-pointer",onClick:()=>{m?null==o||o({year:a.year+1,month:1,date:1}):null==o||o({year:a.year,month:a.month+1,date:1})},children:/*#__PURE__*/t(s,{name:"large_arrow_right",className:"text-w-gray-600"})})]})},c=({selected:e,date:s,disabled:n=!1,onChange:o})=>{const i=1===String(null==s?void 0:s.date).length?`0${null==s?void 0:s.date}`:null==s?void 0:s.date;/*#__PURE__*/
+/*#__PURE__*/t(l,{"data-testid":"design-system-calendar--to-prev-month",className:"size-6 cursor-pointer text-gray-600",onClick:()=>{i?null==o||o({year:a.year-1,month:12,date:1}):null==o||o({year:a.year,month:a.month-1,date:1})},children:/*#__PURE__*/t(s,{name:"large_arrow_left",className:"text-gray-600"})}),
+/*#__PURE__*/e(r,{variant:"subTitle18",className:"h-fit w-full text-center leading-normal text-gray-900",children:[c," ",d]}),
+/*#__PURE__*/t(l,{"data-testid":"design-system-calendar--to-next-month",className:"size-6 cursor-pointer text-gray-600",onClick:()=>{m?null==o||o({year:a.year+1,month:1,date:1}):null==o||o({year:a.year,month:a.month+1,date:1})},children:/*#__PURE__*/t(s,{name:"large_arrow_right",className:"text-gray-600"})})]})},c=({selected:e,date:s,disabled:n=!1,onChange:o})=>{const i=1===String(null==s?void 0:s.date).length?`0${null==s?void 0:s.date}`:null==s?void 0:s.date;/*#__PURE__*/
 return t(l,{className:a("bg-w-white flex aspect-square w-full max-w-[42px] cursor-pointer items-center justify-center rounded-full p-2 text-center",!n&&!e&&"hover:bg-primary-10",e&&"bg-primary",n&&"cursor-default"),onClick:()=>{n||null==o||o(s)},children:/*#__PURE__*/t(r,{variant:"body16",className:a("text-w-gray-900",e&&"text-w-white",n&&"text-w-gray-300"),children:i})})};export{c as DateBox,m as SelectHeader,i as WeekHeader};

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

@@ -36,7 +36,7 @@ export interface InputChipProps extends PropsWithChildren {
  * </InputChip>
  *
  * // 커스텀 스타일이 적용된 칩
- * <InputChip className="bg-primary-50">
+ * <InputChip className="bg-blue-100">
  *   커스텀 스타일 태그
  * </InputChip>
  * ```

package/dist/Components/Inputs/InputChip/InputChip.js

@@ -21,7 +21,7 @@
  * </InputChip>
  *
  * // 커스텀 스타일이 적용된 칩
- * <InputChip className="bg-primary-50">
+ * <InputChip className="bg-blue-100">
  *   커스텀 스타일 태그
  * </InputChip>
  * ```

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

@@ -7,8 +7,6 @@ export interface SegmentedControlProps {
     selectedValue: string;
     size?: SegmentedControlSize;
     name?: string;
-    /** 스크린 리더가 읽는 그룹 이름 — 무엇을 고르는지 적는다 (예: '기간') */
-    ariaLabel?: string;
     onChange: (value: string) => void;
 }
 /**
@@ -18,8 +16,7 @@ export interface SegmentedControlProps {
  * @param {'sm' | 'md'} [props.size='md'] - 세그먼트 컨트롤 크기
  * @param {Array<{key: string, name: string}>} props.valueList - 선택 가능한 옵션들의 배열 ({key, name}[])
  * @param {string} props.selectedValue - 현재 선택된 옵션의 key 값
- * @param {string} [props.name='segmented-control'] - 라디오 그룹의 name 속성
- * @param {string} [props.ariaLabel='segmented control'] - 스크린 리더가 읽는 그룹 이름. 무엇을 고르는지 적습니다 (예: '기간')
+ * @param {string} [props.name] - 라디오 그룹의 name 속성. 생략하면 인스턴스마다 다른 값을 만든다(`useId`) — 폼으로 값을 보낼 때는 직접 준다
  * @param {(value: string) => void} props.onChange - 선택 값이 변경될 때 호출되는 콜백 함수
  *
  * @example
@@ -41,5 +38,5 @@ export interface SegmentedControlProps {
  * );
  * ```
  */
-declare const SegmentedControl: ({ valueList, selectedValue, size, name, ariaLabel, onChange, }: SegmentedControlProps) => import("react/jsx-runtime").JSX.Element;
+declare const SegmentedControl: ({ valueList, selectedValue, size, name: nameProp, onChange, }: SegmentedControlProps) => import("react/jsx-runtime").JSX.Element;
 export { SegmentedControl };

package/dist/Components/Inputs/SegmentedControl/SegmentedControl.js

@@ -1,4 +1,4 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{twJoin as r}from"tailwind-merge";import{Typography as a}from"../../Base/Typography/Typography.js";import{Box as o}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useId as r}from"react";import{twJoin as a}from"tailwind-merge";import{Typography as o}from"../../Base/Typography/Typography.js";import{Box as l}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";
 /**
  * 여러 옵션 중 하나를 선택할 수 있는 세그먼트 컨트롤 컴포넌트입니다.
  *
@@ -6,8 +6,7 @@ import{jsx as e,jsxs as t}from"react/jsx-runtime";import{twJoin as r}from"tailwi
  * @param {'sm' | 'md'} [props.size='md'] - 세그먼트 컨트롤 크기
  * @param {Array<{key: string, name: string}>} props.valueList - 선택 가능한 옵션들의 배열 ({key, name}[])
  * @param {string} props.selectedValue - 현재 선택된 옵션의 key 값
- * @param {string} [props.name='segmented-control'] - 라디오 그룹의 name 속성
- * @param {string} [props.ariaLabel='segmented control'] - 스크린 리더가 읽는 그룹 이름. 무엇을 고르는지 적습니다 (예: '기간')
+ * @param {string} [props.name] - 라디오 그룹의 name 속성. 생략하면 인스턴스마다 다른 값을 만든다(`useId`) — 폼으로 값을 보낼 때는 직접 준다
  * @param {(value: string) => void} props.onChange - 선택 값이 변경될 때 호출되는 콜백 함수
  *
  * @example
@@ -28,8 +27,10 @@ import{jsx as e,jsxs as t}from"react/jsx-runtime";import{twJoin as r}from"tailwi
  *   />
  * );
  * ```
- */const l=({valueList:l,selectedValue:s,size:n="md",name:d="segmented-control",ariaLabel:m="segmented control",onChange:i})=>{const p={sm:{selected:"px-[15px] py-[7px]",unselected:"px-4 py-2"},md:{selected:"px-[15px] py-[11px]",unselected:"px-4 py-3"}};/*#__PURE__*/
-return e(o,{className:"flex w-full overflow-hidden rounded-xl",role:"radiogroup","aria-label":m,"data-testid":"design-system--segmented-control",children:l.map(((o,m)=>{const c=0===m,y=m===l.length-1,u=s===o.key,x=u&&"sm"===n;/*#__PURE__*/
-return t("label",{className:r("relative cursor-pointer text-center select-none",u?"border border-primary bg-primary-10 text-primary":"bg-w-gray-50 text-w-gray-300",u?p[n].selected:p[n].unselected,c&&"rounded-l-xl",y&&"rounded-r-xl"),"data-testid":"design-system--segmented-control-item",children:[
-/*#__PURE__*/e("input",{type:"radio",name:d,value:o.key,checked:u,"aria-checked":u,onChange:e=>i(e.target.value),className:"absolute h-0 w-0 opacity-0"}),
-/*#__PURE__*/e(a,{variant:"md"===n?"body16":"body14",className:r(x?"font-medium":"font-normal"),children:o.name})]},o.key)}))})};export{l as SegmentedControl};
+ */const s=({valueList:s,selectedValue:n,size:d="md",name:m,onChange:i})=>{
+// 고정 기본값('segmented-control')이면 한 화면의 여러 인스턴스가 한 라디오 묶음이 됐다 (#1318)
+const p=r(),c=null!=m?m:p,u={sm:{selected:"px-[15px] py-[7px]",unselected:"px-4 py-2"},md:{selected:"px-[15px] py-[11px]",unselected:"px-4 py-3"}};/*#__PURE__*/
+return e(l,{className:"flex w-full overflow-hidden rounded-xl",role:"radiogroup","aria-label":"segmented control","data-testid":"design-system--segmented-control",children:s.map(((r,l)=>{const m=0===l,p=l===s.length-1,y=n===r.key,x=y&&"sm"===d;/*#__PURE__*/
+return t("label",{className:a("relative cursor-pointer text-center select-none",y?"border border-primary bg-primary-10 text-primary":"bg-w-gray-50 text-w-gray-300",y?u[d].selected:u[d].unselected,m&&"rounded-l-xl",p&&"rounded-r-xl"),"data-testid":"design-system--segmented-control-item",children:[
+/*#__PURE__*/e("input",{type:"radio",name:c,value:r.key,checked:y,"aria-checked":y,onChange:e=>i(e.target.value),className:"absolute h-0 w-0 opacity-0"}),
+/*#__PURE__*/e(o,{variant:"md"===d?"body16":"body14",className:a(x?"font-medium":"font-normal"),children:r.name})]},r.key)}))})};export{s as SegmentedControl};

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

@@ -19,7 +19,8 @@ export interface TextareaProps extends ComponentProps<'textarea'> {
  * @param {boolean} [props.resize=false] - 크기 조절 가능 여부를 설정합니다
  * @param {string} [props.supportText] - 도움말 텍스트를 표시합니다
  * @param {string} [props.errorText] - 에러 메시지를 표시합니다
- * @param {boolean} [props.isLengthVisible=false] - 글자 수 표시 여부를 설정합니다
+ * @param {boolean} [props.isLengthVisible] - 글자 수(`maxLength`) 표시. `true` 면 항상 보이고, `false` 면 숨긴다.
+ *   생략하면 기존처럼 `supportText` · 오류 문구가 있을 때 함께 보인다
  * @param {React.ComponentProps<'textarea'>} props.textareaProps - textarea 엘리먼트의 기본 속성들
  *
  * @example

package/dist/Components/Inputs/Textarea/Textarea.js

@@ -1,4 +1,4 @@
-"use client";import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as r}from"react";import{twMerge as o,twJoin as n}from"tailwind-merge";import"../../Base/Typography/Typography.js";import{Box as a}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";import"../../DataDisplays/Avatar/Avatar.js";import{SystemIcon as s}from"../../DataDisplays/SystemIcon/SystemIcon.js";import"../../DataDisplays/SystemIcon/SystemIcon.constants.js";import"../../../constants/colors/colors.js";import"../../DataDisplays/Accordion/Accordion.js";import{TextFieldContainer as l}from"../TextFieldContainer/TextFieldContainer.js";import{SupportTextContainer as i}from"../SupportTextContainer/SupportTextContainer.js";function c(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function m(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),o.forEach((function(t){c(e,t,r[t])}))}return e}function p(e,t){if(null==e)return{};var r,o,n=function(e,t){if(null==e)return{};var r,o,n={},a=Object.keys(e);for(o=0;o<a.length;o++)r=a[o],t.indexOf(r)>=0||(n[r]=e[r]);return n}
+"use client";import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as r}from"react";import{twMerge as o,twJoin as n}from"tailwind-merge";import"../../Base/Typography/Typography.js";import{Box as a}from"../../Base/Layouts/Box/Box.js";import"../../Base/Layouts/FullBleed/FullBleed.js";import"../../DataDisplays/Avatar/Avatar.js";import{SystemIcon as s}from"../../DataDisplays/SystemIcon/SystemIcon.js";import"../../DataDisplays/SystemIcon/SystemIcon.constants.js";import"../../../constants/colors/colors.js";import"../../DataDisplays/Accordion/Accordion.js";import{TextFieldContainer as i}from"../TextFieldContainer/TextFieldContainer.js";import{SupportTextContainer as l}from"../SupportTextContainer/SupportTextContainer.js";function m(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function c(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),o.forEach((function(t){m(e,t,r[t])}))}return e}function p(e,t){if(null==e)return{};var r,o,n=function(e,t){if(null==e)return{};var r,o,n={},a=Object.keys(e);for(o=0;o<a.length;o++)r=a[o],t.indexOf(r)>=0||(n[r]=e[r]);return n}
 /**
  * 사용자가 여러 줄의 텍스트를 입력할 수 있는 textarea 컴포넌트입니다.
  *
@@ -8,7 +8,8 @@
  * @param {boolean} [props.resize=false] - 크기 조절 가능 여부를 설정합니다
  * @param {string} [props.supportText] - 도움말 텍스트를 표시합니다
  * @param {string} [props.errorText] - 에러 메시지를 표시합니다
- * @param {boolean} [props.isLengthVisible=false] - 글자 수 표시 여부를 설정합니다
+ * @param {boolean} [props.isLengthVisible] - 글자 수(`maxLength`) 표시. `true` 면 항상 보이고, `false` 면 숨긴다.
+ *   생략하면 기존처럼 `supportText` · 오류 문구가 있을 때 함께 보인다
  * @param {React.ComponentProps<'textarea'>} props.textareaProps - textarea 엘리먼트의 기본 속성들
  *
  * @example
@@ -41,8 +42,7 @@
  *   />
  * </div>
  * ```
- */(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(o=0;o<a.length;o++)r=a[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}const u=c=>{var{isError:u=!1,size:f="md",resize:d=!1,isLengthVisible:y=!1,supportText:g,errorText:x,maxLength:h,value:b,disabled:j,name:w,onChange:O,onBlur:v}=c,S=p(c,["isError","size","resize","isLengthVisible","supportText","errorText","maxLength","value","disabled","name","onChange","onBlur"]);const[T,B]=r(!1),D=u||g||y;/*#__PURE__*/
+ */(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(o=0;o<a.length;o++)r=a[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}const u=m=>{var{isError:u=!1,size:f="md",resize:d=!1,isLengthVisible:y,supportText:g,errorText:x,maxLength:h,value:b,disabled:j,name:v,onChange:O,onBlur:w}=m,S=p(m,["isError","size","resize","isLengthVisible","supportText","errorText","maxLength","value","disabled","name","onChange","onBlur"]);const[T,B]=r(!1),D=u||g||y,z=!1===y?void 0:h;/*#__PURE__*/
 return e(a,{"data-testid":"design-system-textarea",className:o("flex w-full flex-col gap-2","full"===f?"h-full":"h-fit"),children:[
-/*#__PURE__*/e(l,{isDisabled:j,isError:u,isFocused:T,isTextarea:!0,className:n("full"===f&&"h-full"),children:[
-/*#__PURE__*/t("textarea",m({"data-testid":"design-system-textarea--textarea",className:o("scrollbar-list tracking-default placeholder:tracking-default text-w-gray-600 placeholder:text-w-gray-300 w-full overflow-y-scroll py-[11px] pl-4 font-[inherit] font-normal outline-hidden placeholder:font-[inherit]","sm"===f?"min-h-[118px]":"md"===f?"min-h-[238px]":"lg"===f?"min-h-[358px]":"full"===f?"min-h-full":void 0,d?"resize-y":"resize-none",// 비활성 글자색은 Input.tsx 와 같게 (값 gray-300 · 플레이스홀더 gray-200)
-j&&"text-w-gray-300 placeholder:text-w-gray-200 cursor-not-allowed resize-none"),name:w,value:b,disabled:j,onChange:O,maxLength:h,onFocus:e=>{B(!0)},onBlur:e=>{B(!1),v&&v(e)}},S)),d&&/*#__PURE__*/t(s,{name:"small_resizer",className:"text-w-gray-400 absolute right-[5px] bottom-[5px]",testId:"design-system-textarea--resize-icon"})]}),D&&/*#__PURE__*/t(i,{errorMessage:x,supportMessage:g,currentLength:(null==b?void 0:b.toString().length)||0,maxLength:h})]})};export{u as Textarea};
+/*#__PURE__*/e(i,{isDisabled:j,isError:u,isFocused:T,isTextarea:!0,className:n("full"===f&&"h-full"),children:[
+/*#__PURE__*/t("textarea",c({"data-testid":"design-system-textarea--textarea",className:o("scrollbar-list tracking-default placeholder:tracking-default text-w-gray-600 placeholder:text-w-gray-300 w-full overflow-y-scroll py-[11px] pl-4 font-[inherit] font-normal outline-hidden placeholder:font-[inherit]","sm"===f?"min-h-[118px]":"md"===f?"min-h-[238px]":"lg"===f?"min-h-[358px]":"full"===f?"min-h-full":void 0,d?"resize-y":"resize-none",j&&"resize-none"),name:v,value:b,disabled:j,onChange:O,maxLength:h,onFocus:e=>{B(!0)},onBlur:e=>{B(!1),w&&w(e)}},S)),d&&/*#__PURE__*/t(s,{name:"small_resizer",className:"text-w-gray-400 absolute right-[5px] bottom-[5px]",testId:"design-system-textarea--resize-icon"})]}),D&&/*#__PURE__*/t(l,{errorMessage:x,supportMessage:g,currentLength:(null==b?void 0:b.toString().length)||0,maxLength:z})]})};export{u as Textarea};

package/dist/ai/tokens.json

@@ -1,6 +1,6 @@
 {
   "$comment": "빌드 산출물이다. 손으로 고치지 않는다 — scripts/generate-ai-tokens.mjs 가 만든다.",
-  "version": "0.0.0-20261102064708",
+  "version": "0.0.0-20261102065002",
   "generatedFrom": [
     "dist/constants/colors/colors.js",
     "tailwind.config.js",

package/dist/cjs/Components/DataDisplays/SystemIcon/SystemIcon.js

@@ -17,7 +17,7 @@
  * // 커스텀 클래스와 함께 사용
  * <SystemIcon
  *   name="medium_check"
- *   className="text-primary-500"
+ *   className="text-blue-500"
  *   solid={true}
  * />
  *

package/dist/cjs/Components/Feedbacks/LoadingIndicator/LoadingIndicator.js

@@ -17,8 +17,8 @@
  * // 고정 위치에 큰 크기로 표시
  * <LoadingIndicator isFixed size="lg" />
  *
- * // 어두운 배경 위에서는 흰색 (색은 className 이 아니라 variant 로)
- * <LoadingIndicator variant="white" />
+ * // 커스텀 클래스 적용
+ * <LoadingIndicator className="text-blue-500" />
  *
  */
 const a={primary:"text-primary",white:"text-w-white",gray:"text-w-gray-400"};exports.LoadingIndicator=({variant:s="primary",isFixed:n=!1,size:l="md",ariaLabel:c="로딩 중",className:o})=>{const{width:u,height:d,viewBox:x,circle:g,r:m}=t.SIZES[l],h=a[s];/*#__PURE__*/

package/dist/cjs/Components/Inputs/AutoCompleteList/AutoCompleteList.parts.js

@@ -1,6 +1,6 @@
 "use strict";var e=require("react/jsx-runtime"),r=require("../../Base/Typography/Typography.js");require("../../Base/Layouts/Box/Box.js"),require("tailwind-merge"),require("../../Base/Layouts/FullBleed/FullBleed.js");
 // return A ~ Z
-const t=Array.from({length:26},((e,r)=>String.fromCharCode(65+r)));exports.CountSection=({count:t})=>/*#__PURE__*/e.jsx(r.Typography,{variant:"body16",className:"text-w-gray-400",children:t}),exports.INDEXES=t,exports.Icon=({iconUrl:r})=>/*#__PURE__*/e.jsx("img",{src:r,alt:"icon",width:24,height:24,className:"rounded-full border"}),exports.IndexBar=({onIndexClick:a})=>/*#__PURE__*/e.jsx("ul",{className:"bg-w-gray-10 flex flex-col gap-0.5 rounded-l-xl p-[3px] text-center",children:t.map((t=>/*#__PURE__*/e.jsx("li",{className:"size-3.5 cursor-pointer",onClick:()=>null==a?void 0:a(t),children:/*#__PURE__*/e.jsx(r.Typography,{variant:"caption11",className:"text-w-gray-400",children:t})},t)))}),exports.TextSection=({text:t,isInputItem:a,inputValue:s})=>{const i=t.slice(0,null==s?void 0:s.length),l=t.slice(null==s?void 0:s.length);/*#__PURE__*/
+const t=Array.from({length:26},((e,r)=>String.fromCharCode(65+r)));exports.CountSection=({count:t})=>/*#__PURE__*/e.jsx(r.Typography,{variant:"body16",className:"text-w-gray-400",children:t}),exports.INDEXES=t,exports.Icon=({iconUrl:r})=>/*#__PURE__*/e.jsx("img",{src:r,alt:"icon",width:24,height:24,className:"rounded-full border"}),exports.IndexBar=({onIndexClick:a})=>/*#__PURE__*/e.jsx("ul",{className:"bg-w-gray-10 flex flex-col gap-0.5 rounded-l-xl p-[3px] text-center",children:t.map((t=>/*#__PURE__*/e.jsx("li",{className:"size-3.5 cursor-pointer",onClick:()=>null==a?void 0:a(t),children:/*#__PURE__*/e.jsx(r.Typography,{variant:"caption11",className:"text-gray-400",children:t})},t)))}),exports.TextSection=({text:t,isInputItem:a,inputValue:s})=>{const i=t.slice(0,null==s?void 0:s.length),l=t.slice(null==s?void 0:s.length);/*#__PURE__*/
 return e.jsx(e.Fragment,{children:a?/*#__PURE__*/e.jsxs(e.Fragment,{children:[
 /*#__PURE__*/e.jsxs(r.Typography,{variant:"body16",className:"text-primary-500 font-medium","data-testid":"design-system-list-item-text",children:["‘",t,"’"]}),
 /*#__PURE__*/e.jsx(r.Typography,{variant:"body16",className:"text-w-gray-600",children:"입력"})]}):/*#__PURE__*/e.jsx(r.Typography,{variant:"body16",className:"text-w-gray-600","data-testid":"design-system-list-item-text",children:s?/*#__PURE__*/e.jsxs(e.Fragment,{children:[

package/dist/cjs/Components/Inputs/Calendar/Calendar.js

@@ -1,10 +1,9 @@
-"use client";"use strict";var e=require("react/jsx-runtime"),a=require("react"),t=require("tailwind-merge");require("../../DataDisplays/Avatar/Avatar.js");var r=require("../../Base/Typography/Typography.js"),s=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"),require("../../../constants/colors/colors.js"),require("../../DataDisplays/Accordion/Accordion.js");var i=require("../TextFieldContainer/TextFieldContainer.js"),l=require("./Calendar.parts.js"),d=require("./Calendar.utils.js");exports.Calendar=({defaultDate:o,selected:c,onChange:g,disabled:x,placeholder:u,isError:m,className:y,triggerClassName:p,dropdownClassName:j,minDate:D,maxDate:h})=>{const[w,f]=a.useState(!1),q=()=>{x||f((e=>!e))},B=o?d.generateDate(o):d.today,[C,b]=a.useState(c?d.generateDate(c):B),N=c?d.generateDate(c):B,{year:S,month:v,date:$}=d.getKoreanTimeString(N),{dateList:T}=d.getMonthDate(C.year,C.month),F=[...Array.from({length:T[0].day},(()=>null)),...T],I=e=>{if(c&&d.isSameDate(e,N))return;if(d.isDateOutOfRange(e,D,h))return;const a=`${e.year}-${e.month}-${e.date}`;null==g||g(a),f(!1)};return a.useEffect((()=>{!w&&c&&b(d.generateDate(c));
+"use client";"use strict";var e=require("react/jsx-runtime"),a=require("react"),t=require("tailwind-merge");require("../../DataDisplays/Avatar/Avatar.js");var r=require("../../Base/Typography/Typography.js"),s=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"),require("../../../constants/colors/colors.js"),require("../../DataDisplays/Accordion/Accordion.js");var i=require("../TextFieldContainer/TextFieldContainer.js"),l=require("./Calendar.parts.js"),d=require("./Calendar.utils.js");exports.Calendar=({defaultDate:o,selected:c,onChange:g,disabled:u,placeholder:x,isError:m,className:y,triggerClassName:p,dropdownClassName:j,minDate:D,maxDate:h})=>{const[w,f]=a.useState(!1),q=()=>{u||f((e=>!e))},B=o?d.generateDate(o):d.today,[C,b]=a.useState(c?d.generateDate(c):B),N=c?d.generateDate(c):B,{year:S,month:v,date:$}=d.getKoreanTimeString(N),{dateList:T}=d.getMonthDate(C.year,C.month),F=[...Array.from({length:T[0].day},(()=>null)),...T],I=e=>{if(c&&d.isSameDate(e,N))return;if(d.isDateOutOfRange(e,D,h))return;const a=`${e.year}-${e.month}-${e.date}`;null==g||g(a),f(!1)};return a.useEffect((()=>{!w&&c&&b(d.generateDate(c));
 // eslint-disable-next-line react-hooks/exhaustive-deps
 }),[w]),/*#__PURE__*/e.jsxs(s.Box,{className:t.twMerge("relative h-fit w-fit select-none",y),"data-testid":"design-system-calendar--container",children:[
-/*#__PURE__*/e.jsx(s.Box,{className:"cursor-pointer",children:/*#__PURE__*/e.jsxs(i.TextFieldContainer,{isFocused:w,isError:m,isDisabled:x,testId:"design-system-calendar--trigger",onClick:q,className:p,children:[
-/*#__PURE__*/e.jsx(n.SystemIcon,{name:"medium_calendar",className:x||!c?"text-w-gray-300":"text-w-gray-400"}),
-/*#__PURE__*/e.jsx(r.Typography,{variant:"body16",className:t.twMerge("text-w-gray-600 min-w-[178px]",!c&&"text-w-gray-300",// 비활성: 값은 gray-300, 플레이스홀더는 gray-200 (Input.tsx 와 같은 규칙)
-x&&(c?"text-w-gray-300":"text-w-gray-200")),"data-testid":"design-system-calendar--selected-date",children:c?`${S} ${v} ${$}`:u})]})}),w&&/*#__PURE__*/e.jsx("div",{className:"fixed top-0 left-0 z-10 h-screen w-screen bg-transparent",onClick:q}),w&&/*#__PURE__*/e.jsxs(s.Box,{"data-testid":"design-system-calendar--content",className:t.twMerge("border-w-gray-200 bg-w-white shadow-graymedium absolute top-[54px] z-30 flex w-[350px] flex-col gap-4 rounded-xl border px-[15px] py-[23px]",j),children:[
+/*#__PURE__*/e.jsx(s.Box,{className:"cursor-pointer",children:/*#__PURE__*/e.jsxs(i.TextFieldContainer,{isFocused:w,isError:m,isDisabled:u,testId:"design-system-calendar--trigger",onClick:q,className:p,children:[
+/*#__PURE__*/e.jsx(n.SystemIcon,{name:"medium_calendar",className:u||!c?"text-w-gray-300":"text-w-gray-400"}),
+/*#__PURE__*/e.jsx(r.Typography,{variant:"body16",className:t.twMerge("text-w-gray-600 min-w-[178px]",!c&&"text-w-gray-300",u&&"text-w-gray-300"),"data-testid":"design-system-calendar--selected-date",children:c?`${S} ${v} ${$}`:x})]})}),w&&/*#__PURE__*/e.jsx("div",{className:"fixed top-0 left-0 z-10 h-screen w-screen bg-transparent",onClick:q}),w&&/*#__PURE__*/e.jsxs(s.Box,{"data-testid":"design-system-calendar--content",className:t.twMerge("border-w-gray-200 bg-w-white shadow-graymedium absolute top-[54px] z-30 flex w-[350px] flex-col gap-4 rounded-xl border px-[15px] py-[23px]",j),children:[
 /*#__PURE__*/e.jsx(l.SelectHeader,{visibleDate:C,onChange:e=>{b(e)}}),
 /*#__PURE__*/e.jsx(l.WeekHeader,{}),
 /*#__PURE__*/e.jsx(s.Box,{className:"grid w-full grid-cols-7 place-content-center place-items-center gap-1",children:F.map(((a,t)=>{const r=!(!a||!c)&&d.isSameDate(a,N);return a?/*#__PURE__*/e.jsx(l.DateBox,{date:a,selected:r,disabled:d.isDateOutOfRange(a,D,h),onChange:I},`${a.year}-${a.month}-${a.date}`):/*#__PURE__*/e.jsx(l.DateBox,{disabled:!0},t)}))})]})]})};

package/dist/cjs/Components/Inputs/Calendar/Calendar.parts.js

@@ -1,7 +1,7 @@
 "use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge");require("../../DataDisplays/Avatar/Avatar.js");var a=require("../../Base/Typography/Typography.js"),t=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js"),require("react");var s=require("../../DataDisplays/SystemIcon/SystemIcon.js");require("../../DataDisplays/SystemIcon/SystemIcon.constants.js"),require("../../../constants/colors/colors.js"),require("../../DataDisplays/Accordion/Accordion.js");var l=require("./Calendar.utils.js"),n=require("./Calendar.constants.js");exports.DateBox=({selected:s,date:l,disabled:n=!1,onChange:o})=>{const i=1===String(null==l?void 0:l.date).length?`0${null==l?void 0:l.date}`:null==l?void 0:l.date;/*#__PURE__*/
 return e.jsx(t.Box,{className:r.twMerge("bg-w-white flex aspect-square w-full max-w-[42px] cursor-pointer items-center justify-center rounded-full p-2 text-center",!n&&!s&&"hover:bg-primary-10",s&&"bg-primary",n&&"cursor-default"),onClick:()=>{n||null==o||o(l)},children:/*#__PURE__*/e.jsx(a.Typography,{variant:"body16",className:r.twMerge("text-w-gray-900",s&&"text-w-white",n&&"text-w-gray-300"),children:i})})},exports.SelectHeader=({visibleDate:r,onChange:n})=>{const o=1===(null==r?void 0:r.month),i=12===(null==r?void 0:r.month),{year:c,month:d}=r&&l.getKoreanTimeString(r);/*#__PURE__*/
 return e.jsxs(t.Box,{className:"flex h-[50px] w-full gap-4",children:[
-/*#__PURE__*/e.jsx(t.Box,{"data-testid":"design-system-calendar--to-prev-month",className:"text-w-gray-600 size-6 cursor-pointer",onClick:()=>{o?null==n||n({year:r.year-1,month:12,date:1}):null==n||n({year:r.year,month:r.month-1,date:1})},children:/*#__PURE__*/e.jsx(s.SystemIcon,{name:"large_arrow_left",className:"text-w-gray-600"})}),
-/*#__PURE__*/e.jsxs(a.Typography,{variant:"subTitle18",className:"text-w-gray-900 h-fit w-full text-center leading-normal",children:[c," ",d]}),
-/*#__PURE__*/e.jsx(t.Box,{"data-testid":"design-system-calendar--to-next-month",className:"text-w-gray-600 size-6 cursor-pointer",onClick:()=>{i?null==n||n({year:r.year+1,month:1,date:1}):null==n||n({year:r.year,month:r.month+1,date:1})},children:/*#__PURE__*/e.jsx(s.SystemIcon,{name:"large_arrow_right",className:"text-w-gray-600"})})]})},exports.WeekHeader=()=>{const r=Array.from(n.dayMap.values());/*#__PURE__*/
+/*#__PURE__*/e.jsx(t.Box,{"data-testid":"design-system-calendar--to-prev-month",className:"size-6 cursor-pointer text-gray-600",onClick:()=>{o?null==n||n({year:r.year-1,month:12,date:1}):null==n||n({year:r.year,month:r.month-1,date:1})},children:/*#__PURE__*/e.jsx(s.SystemIcon,{name:"large_arrow_left",className:"text-gray-600"})}),
+/*#__PURE__*/e.jsxs(a.Typography,{variant:"subTitle18",className:"h-fit w-full text-center leading-normal text-gray-900",children:[c," ",d]}),
+/*#__PURE__*/e.jsx(t.Box,{"data-testid":"design-system-calendar--to-next-month",className:"size-6 cursor-pointer text-gray-600",onClick:()=>{i?null==n||n({year:r.year+1,month:1,date:1}):null==n||n({year:r.year,month:r.month+1,date:1})},children:/*#__PURE__*/e.jsx(s.SystemIcon,{name:"large_arrow_right",className:"text-gray-600"})})]})},exports.WeekHeader=()=>{const r=Array.from(n.dayMap.values());/*#__PURE__*/
 return e.jsx(t.Box,{className:"grid w-full grid-cols-7 place-items-center gap-1",children:r.map((r=>/*#__PURE__*/e.jsx(t.Box,{className:"flex h-5 items-center justify-center",children:/*#__PURE__*/e.jsx(a.Typography,{variant:"body13",className:"text-w-gray-500 leading-normal",children:r})},r)))})};

package/dist/cjs/Components/Inputs/InputChip/InputChip.js

@@ -21,7 +21,7 @@
  * </InputChip>
  *
  * // 커스텀 스타일이 적용된 칩
- * <InputChip className="bg-primary-50">
+ * <InputChip className="bg-blue-100">
  *   커스텀 스타일 태그
  * </InputChip>
  * ```

package/dist/cjs/Components/Inputs/SegmentedControl/SegmentedControl.js

@@ -1,5 +1,7 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("tailwind-merge"),t=require("../../Base/Typography/Typography.js"),a=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");exports.SegmentedControl=({valueList:s,selectedValue:l,size:n="md",name:o="segmented-control",ariaLabel:d="segmented control",onChange:i})=>{const c={sm:{selected:"px-[15px] py-[7px]",unselected:"px-4 py-2"},md:{selected:"px-[15px] py-[11px]",unselected:"px-4 py-3"}};/*#__PURE__*/
-return e.jsx(a.Box,{className:"flex w-full overflow-hidden rounded-xl",role:"radiogroup","aria-label":d,"data-testid":"design-system--segmented-control",children:s.map(((a,d)=>{const m=0===d,u=d===s.length-1,p=l===a.key,y=p&&"sm"===n;/*#__PURE__*/
-return e.jsxs("label",{className:r.twJoin("relative cursor-pointer text-center select-none",p?"border border-primary bg-primary-10 text-primary":"bg-w-gray-50 text-w-gray-300",p?c[n].selected:c[n].unselected,m&&"rounded-l-xl",u&&"rounded-r-xl"),"data-testid":"design-system--segmented-control-item",children:[
-/*#__PURE__*/e.jsx("input",{type:"radio",name:o,value:a.key,checked:p,"aria-checked":p,onChange:e=>i(e.target.value),className:"absolute h-0 w-0 opacity-0"}),
-/*#__PURE__*/e.jsx(t.Typography,{variant:"md"===n?"body16":"body14",className:r.twJoin(y?"font-medium":"font-normal"),children:a.name})]},a.key)}))})};
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("tailwind-merge"),a=require("../../Base/Typography/Typography.js"),s=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js");exports.SegmentedControl=({valueList:l,selectedValue:n,size:d="md",name:o,onChange:i})=>{
+// 고정 기본값('segmented-control')이면 한 화면의 여러 인스턴스가 한 라디오 묶음이 됐다 (#1318)
+const u=r.useId(),c=null!=o?o:u,m={sm:{selected:"px-[15px] py-[7px]",unselected:"px-4 py-2"},md:{selected:"px-[15px] py-[11px]",unselected:"px-4 py-3"}};/*#__PURE__*/
+return e.jsx(s.Box,{className:"flex w-full overflow-hidden rounded-xl",role:"radiogroup","aria-label":"segmented control","data-testid":"design-system--segmented-control",children:l.map(((r,s)=>{const o=0===s,u=s===l.length-1,p=n===r.key,y=p&&"sm"===d;/*#__PURE__*/
+return e.jsxs("label",{className:t.twJoin("relative cursor-pointer text-center select-none",p?"border border-primary bg-primary-10 text-primary":"bg-w-gray-50 text-w-gray-300",p?m[d].selected:m[d].unselected,o&&"rounded-l-xl",u&&"rounded-r-xl"),"data-testid":"design-system--segmented-control-item",children:[
+/*#__PURE__*/e.jsx("input",{type:"radio",name:c,value:r.key,checked:p,"aria-checked":p,onChange:e=>i(e.target.value),className:"absolute h-0 w-0 opacity-0"}),
+/*#__PURE__*/e.jsx(a.Typography,{variant:"md"===d?"body16":"body14",className:t.twJoin(y?"font-medium":"font-normal"),children:r.name})]},r.key)}))})};

package/dist/cjs/Components/Inputs/Textarea/Textarea.js

@@ -1,4 +1,4 @@
-"use client";"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("tailwind-merge");require("../../Base/Typography/Typography.js");var n=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js");var a=require("../../DataDisplays/SystemIcon/SystemIcon.js");require("../../DataDisplays/SystemIcon/SystemIcon.constants.js"),require("../../../constants/colors/colors.js"),require("../../DataDisplays/Accordion/Accordion.js");var s=require("../TextFieldContainer/TextFieldContainer.js"),o=require("../SupportTextContainer/SupportTextContainer.js");function l(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function i(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){l(e,r,t[r])}))}return e}function u(e,r){if(null==e)return{};var t,n,a=function(e,r){if(null==e)return{};var t,n,a={},s=Object.keys(e);for(n=0;n<s.length;n++)t=s[n],r.indexOf(t)>=0||(a[t]=e[t]);return a}
+"use client";"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("tailwind-merge");require("../../Base/Typography/Typography.js");var n=require("../../Base/Layouts/Box/Box.js");require("../../Base/Layouts/FullBleed/FullBleed.js"),require("../../DataDisplays/Avatar/Avatar.js");var a=require("../../DataDisplays/SystemIcon/SystemIcon.js");require("../../DataDisplays/SystemIcon/SystemIcon.constants.js"),require("../../../constants/colors/colors.js"),require("../../DataDisplays/Accordion/Accordion.js");var s=require("../TextFieldContainer/TextFieldContainer.js"),i=require("../SupportTextContainer/SupportTextContainer.js");function o(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function l(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){o(e,r,t[r])}))}return e}function u(e,r){if(null==e)return{};var t,n,a=function(e,r){if(null==e)return{};var t,n,a={},s=Object.keys(e);for(n=0;n<s.length;n++)t=s[n],r.indexOf(t)>=0||(a[t]=e[t]);return a}
 /**
  * 사용자가 여러 줄의 텍스트를 입력할 수 있는 textarea 컴포넌트입니다.
  *
@@ -8,7 +8,8 @@
  * @param {boolean} [props.resize=false] - 크기 조절 가능 여부를 설정합니다
  * @param {string} [props.supportText] - 도움말 텍스트를 표시합니다
  * @param {string} [props.errorText] - 에러 메시지를 표시합니다
- * @param {boolean} [props.isLengthVisible=false] - 글자 수 표시 여부를 설정합니다
+ * @param {boolean} [props.isLengthVisible] - 글자 수(`maxLength`) 표시. `true` 면 항상 보이고, `false` 면 숨긴다.
+ *   생략하면 기존처럼 `supportText` · 오류 문구가 있을 때 함께 보인다
  * @param {React.ComponentProps<'textarea'>} props.textareaProps - textarea 엘리먼트의 기본 속성들
  *
  * @example
@@ -41,8 +42,7 @@
  *   />
  * </div>
  * ```
- */(e,r);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(n=0;n<s.length;n++)t=s[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}exports.Textarea=l=>{var{isError:c=!1,size:p="md",resize:x=!1,isLengthVisible:d=!1,supportText:g,errorText:y,maxLength:m,value:f,disabled:h,name:b,onChange:j,onBlur:v}=l,w=u(l,["isError","size","resize","isLengthVisible","supportText","errorText","maxLength","value","disabled","name","onChange","onBlur"]);const[O,S]=r.useState(!1),T=c||g||d;/*#__PURE__*/
+ */(e,r);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(n=0;n<s.length;n++)t=s[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}exports.Textarea=o=>{var{isError:c=!1,size:p="md",resize:x=!1,isLengthVisible:d,supportText:g,errorText:m,maxLength:y,value:f,disabled:h,name:b,onChange:j,onBlur:v}=o,w=u(o,["isError","size","resize","isLengthVisible","supportText","errorText","maxLength","value","disabled","name","onChange","onBlur"]);const[O,S]=r.useState(!1),T=c||g||d,q=!1===d?void 0:y;/*#__PURE__*/
 return e.jsxs(n.Box,{"data-testid":"design-system-textarea",className:t.twMerge("flex w-full flex-col gap-2","full"===p?"h-full":"h-fit"),children:[
 /*#__PURE__*/e.jsxs(s.TextFieldContainer,{isDisabled:h,isError:c,isFocused:O,isTextarea:!0,className:t.twJoin("full"===p&&"h-full"),children:[
-/*#__PURE__*/e.jsx("textarea",i({"data-testid":"design-system-textarea--textarea",className:t.twMerge("scrollbar-list tracking-default placeholder:tracking-default text-w-gray-600 placeholder:text-w-gray-300 w-full overflow-y-scroll py-[11px] pl-4 font-[inherit] font-normal outline-hidden placeholder:font-[inherit]","sm"===p?"min-h-[118px]":"md"===p?"min-h-[238px]":"lg"===p?"min-h-[358px]":"full"===p?"min-h-full":void 0,x?"resize-y":"resize-none",// 비활성 글자색은 Input.tsx 와 같게 (값 gray-300 · 플레이스홀더 gray-200)
-h&&"text-w-gray-300 placeholder:text-w-gray-200 cursor-not-allowed resize-none"),name:b,value:f,disabled:h,onChange:j,maxLength:m,onFocus:e=>{S(!0)},onBlur:e=>{S(!1),v&&v(e)}},w)),x&&/*#__PURE__*/e.jsx(a.SystemIcon,{name:"small_resizer",className:"text-w-gray-400 absolute right-[5px] bottom-[5px]",testId:"design-system-textarea--resize-icon"})]}),T&&/*#__PURE__*/e.jsx(o.SupportTextContainer,{errorMessage:y,supportMessage:g,currentLength:(null==f?void 0:f.toString().length)||0,maxLength:m})]})};
+/*#__PURE__*/e.jsx("textarea",l({"data-testid":"design-system-textarea--textarea",className:t.twMerge("scrollbar-list tracking-default placeholder:tracking-default text-w-gray-600 placeholder:text-w-gray-300 w-full overflow-y-scroll py-[11px] pl-4 font-[inherit] font-normal outline-hidden placeholder:font-[inherit]","sm"===p?"min-h-[118px]":"md"===p?"min-h-[238px]":"lg"===p?"min-h-[358px]":"full"===p?"min-h-full":void 0,x?"resize-y":"resize-none",h&&"resize-none"),name:b,value:f,disabled:h,onChange:j,maxLength:y,onFocus:e=>{S(!0)},onBlur:e=>{S(!1),v&&v(e)}},w)),x&&/*#__PURE__*/e.jsx(a.SystemIcon,{name:"small_resizer",className:"text-w-gray-400 absolute right-[5px] bottom-[5px]",testId:"design-system-textarea--resize-icon"})]}),T&&/*#__PURE__*/e.jsx(i.SupportTextContainer,{errorMessage:m,supportMessage:g,currentLength:(null==f?void 0:f.toString().length)||0,maxLength:q})]})};

package/package.json

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