@likelion-design/ui 1.0.23 → 1.0.25

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import React from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 
 type ButtonSize = "xlarge" | "large" | "medium" | "small";
 type ButtonColor = "primary" | "neutral" | "secondary";
@@ -25,7 +25,7 @@ interface ActionButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonEl
     suffixIcon?: React.ReactNode;
 }
 /** ActionButton 컴포넌트는 사용자가 어떠한 액션을 트리거하거나 이벤트를 실행할 때 사용한다. */
-declare const ActionButton: ({ size, color, type, htmlType, label, prefixIcon, suffixIcon, loading, className, disabled, ...props }: ActionButtonProps) => react_jsx_runtime.JSX.Element;
+declare const ActionButton: React.ForwardRefExoticComponent<ActionButtonProps & React.RefAttributes<HTMLButtonElement>>;
 
 type IconButtonSize = "xlarge" | "large" | "medium" | "small";
 /** 버튼 색상. solid/outline: primary | neutral | secondary. weak: primary | neutral-dark | neutral-light */
@@ -51,7 +51,7 @@ interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElem
     styles?: Partial<Record<IconButtonSlot, React.CSSProperties>>;
 }
 /** IconButton 컴포넌트는 텍스트 레이블 없이 아이콘만으로 액션을 전달하는 버튼 컴포넌트이다. */
-declare const IconButton: ({ size, color, type, icon, className, disabled, htmlType, style: propsStyle, styles, ...props }: IconButtonProps) => react_jsx_runtime.JSX.Element;
+declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
 
 type TabType = "round" | "text";
 type TabSize = "large" | "medium";
@@ -74,7 +74,7 @@ interface TabProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "
     disabled?: boolean;
 }
 /** Tab 컴포넌트는 사용자가 여러 옵션 중 하나를 선택할 때 사용하는 탭 컴포넌트이다. */
-declare const Tab: ({ type, size, badge, label, mode, className, selected, disabled, onClick, ...props }: TabProps) => react_jsx_runtime.JSX.Element;
+declare const Tab: React.ForwardRefExoticComponent<TabProps & React.RefAttributes<HTMLButtonElement>>;
 interface TabItem {
     /** 탭 식별 값 */
     value: string;
@@ -204,10 +204,7 @@ declare const ChipGroup: {
     ({ value: valueProp, defaultValue, onChange, multiple, type, size, variant, showCheck, disabled, items, children, className, ...rest }: ChipGroupProps): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
-declare const Chip: {
-    ({ type, size, variant, value, onChange, checked: checkedProp, defaultChecked, selectedValue, selectedValues, label, prefixIcon, suffixIcon, showCheck, showClose, onClose, className, disabled, onClick, ...props }: ChipProps): react_jsx_runtime.JSX.Element;
-    displayName: string;
-} & {
+declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLButtonElement>> & {
     Group: {
         ({ value: valueProp, defaultValue, onChange, multiple, type, size, variant, showCheck, disabled, items, children, className, ...rest }: ChipGroupProps): react_jsx_runtime.JSX.Element;
         displayName: string;
@@ -234,7 +231,7 @@ interface DialogActionItem {
     /** 클릭 시 다이얼로그 닫기 여부 (기본값: true) */
     closeOnClick?: boolean;
 }
-interface DialogProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title" | "content"> {
+interface DialogProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
     open?: boolean;
     onClose?: () => void;
     /** 오버레이 클릭 시 닫기 여부 (기본값: true) */
@@ -257,8 +254,8 @@ interface DialogProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"
     actionItems?: DialogActionItem[];
     /** actionItems 사용 시 버튼 레이아웃 */
     footerLayout?: DialogFooterLayout;
-    /** 커스텀 컨텐츠 (헤더/푸터 없이 내용만 렌더링할 때 사용) */
-    content?: React.ReactNode;
+    /** 다이얼로그 너비 (미지정 시 기본 고정 너비 사용) */
+    width?: number | string;
     className?: string;
     children?: React.ReactNode;
 }
@@ -282,7 +279,10 @@ interface DialogButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonEl
     /** 클릭 시 다이얼로그 닫기 여부 (기본값: false - 명시적으로 닫아야 함) */
     closeOnClick?: boolean;
 }
-declare const Dialog: (({ open, onClose, closeOnOverlayClick, closeOnEsc, withClose, variant, align, title, description, icon, actionItems, footerLayout, content, className, children, ...props }: DialogProps) => React.ReactPortal | null) & {
+declare const Dialog: {
+    ({ open, onClose, closeOnOverlayClick, closeOnEsc, withClose, variant, align, title, description, icon, actionItems, footerLayout, width, className, children, ...props }: DialogProps): React.ReactPortal | null;
+    displayName: string;
+} & {
     Header: ({ title, icon, className, children, ...props }: DialogHeaderProps) => react_jsx_runtime.JSX.Element;
     Body: ({ className, children, ...props }: DialogBodyProps) => react_jsx_runtime.JSX.Element;
     Footer: ({ layout, className, children, ...props }: DialogFooterProps) => react_jsx_runtime.JSX.Element;
@@ -296,17 +296,16 @@ interface DialogOptions {
     description?: React.ReactNode;
     icon?: React.ReactNode;
     buttons?: DialogActionItem[];
-    content?: React.ReactNode;
     onClose?: () => void;
     closeOnOverlayClick?: boolean;
     closeOnEsc?: boolean;
     withClose?: boolean;
 }
-interface AlertOptions extends Omit<DialogOptions, "buttons" | "content"> {
+interface AlertOptions extends Omit<DialogOptions, "buttons"> {
     confirmLabel?: string;
     onConfirm?: () => void | Promise<void>;
 }
-interface ConfirmOptions extends Omit<DialogOptions, "buttons" | "content"> {
+interface ConfirmOptions extends Omit<DialogOptions, "buttons"> {
     confirmLabel?: string;
     cancelLabel?: string;
     onConfirm?: () => void | Promise<void>;
@@ -354,287 +353,7 @@ interface TextProps extends React.HTMLAttributes<HTMLElement> {
     children: React.ReactNode;
 }
 /** Text 컴포넌트는 텍스트 스타일을 일관되게 적용하는 컴포넌트입니다. */
-declare const Text: ({ variant, decoration, as, children, className, ...props }: TextProps) => React.DOMElement<{
-    defaultChecked?: boolean | undefined;
-    defaultValue?: string | number | readonly string[] | undefined;
-    suppressContentEditableWarning?: boolean | undefined;
-    suppressHydrationWarning?: boolean | undefined;
-    accessKey?: string | undefined;
-    autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {});
-    autoFocus?: boolean | undefined;
-    contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
-    contextMenu?: string | undefined;
-    dir?: string | undefined;
-    draggable?: (boolean | "true" | "false") | undefined;
-    enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
-    hidden?: boolean | undefined;
-    id?: string | undefined;
-    lang?: string | undefined;
-    nonce?: string | undefined;
-    slot?: string | undefined;
-    spellCheck?: (boolean | "true" | "false") | undefined;
-    style?: React.CSSProperties | undefined;
-    tabIndex?: number | undefined;
-    title?: string | undefined;
-    translate?: "yes" | "no" | undefined;
-    radioGroup?: string | undefined;
-    role?: React.AriaRole | undefined;
-    about?: string | undefined;
-    content?: string | undefined;
-    datatype?: string | undefined;
-    inlist?: any;
-    prefix?: string | undefined;
-    property?: string | undefined;
-    rel?: string | undefined;
-    resource?: string | undefined;
-    rev?: string | undefined;
-    typeof?: string | undefined;
-    vocab?: string | undefined;
-    autoCorrect?: string | undefined;
-    autoSave?: string | undefined;
-    color?: string | undefined;
-    itemProp?: string | undefined;
-    itemScope?: boolean | undefined;
-    itemType?: string | undefined;
-    itemID?: string | undefined;
-    itemRef?: string | undefined;
-    results?: number | undefined;
-    security?: string | undefined;
-    unselectable?: "on" | "off" | undefined;
-    popover?: "" | "auto" | "manual" | "hint" | undefined;
-    popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
-    popoverTarget?: string | undefined;
-    inert?: boolean | undefined;
-    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
-    is?: string | undefined;
-    exportparts?: string | undefined;
-    part?: string | undefined;
-    "aria-activedescendant"?: string | undefined;
-    "aria-atomic"?: (boolean | "true" | "false") | undefined;
-    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
-    "aria-braillelabel"?: string | undefined;
-    "aria-brailleroledescription"?: string | undefined;
-    "aria-busy"?: (boolean | "true" | "false") | undefined;
-    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
-    "aria-colcount"?: number | undefined;
-    "aria-colindex"?: number | undefined;
-    "aria-colindextext"?: string | undefined;
-    "aria-colspan"?: number | undefined;
-    "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
-    "aria-describedby"?: string | undefined;
-    "aria-description"?: string | undefined;
-    "aria-details"?: string | undefined;
-    "aria-disabled"?: (boolean | "true" | "false") | undefined;
-    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
-    "aria-errormessage"?: string | undefined;
-    "aria-expanded"?: (boolean | "true" | "false") | undefined;
-    "aria-flowto"?: string | undefined;
-    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
-    "aria-hidden"?: (boolean | "true" | "false") | undefined;
-    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
-    "aria-keyshortcuts"?: string | undefined;
-    "aria-label"?: string | undefined;
-    "aria-labelledby"?: string | undefined;
-    "aria-level"?: number | undefined;
-    "aria-live"?: "off" | "assertive" | "polite" | undefined;
-    "aria-modal"?: (boolean | "true" | "false") | undefined;
-    "aria-multiline"?: (boolean | "true" | "false") | undefined;
-    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
-    "aria-orientation"?: "horizontal" | "vertical" | undefined;
-    "aria-owns"?: string | undefined;
-    "aria-placeholder"?: string | undefined;
-    "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
-    "aria-readonly"?: (boolean | "true" | "false") | undefined;
-    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
-    "aria-required"?: (boolean | "true" | "false") | undefined;
-    "aria-roledescription"?: string | undefined;
-    "aria-rowcount"?: number | undefined;
-    "aria-rowindex"?: number | undefined;
-    "aria-rowindextext"?: string | undefined;
-    "aria-rowspan"?: number | undefined;
-    "aria-selected"?: (boolean | "true" | "false") | undefined;
-    "aria-setsize"?: number | undefined;
-    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
-    "aria-valuemax"?: number | undefined;
-    "aria-valuemin"?: number | undefined;
-    "aria-valuenow"?: number | undefined;
-    "aria-valuetext"?: string | undefined;
-    dangerouslySetInnerHTML?: {
-        __html: string | TrustedHTML;
-    } | undefined;
-    onCopy?: React.ClipboardEventHandler<HTMLElement> | undefined;
-    onCopyCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
-    onCut?: React.ClipboardEventHandler<HTMLElement> | undefined;
-    onCutCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
-    onPaste?: React.ClipboardEventHandler<HTMLElement> | undefined;
-    onPasteCapture?: React.ClipboardEventHandler<HTMLElement> | undefined;
-    onCompositionEnd?: React.CompositionEventHandler<HTMLElement> | undefined;
-    onCompositionEndCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
-    onCompositionStart?: React.CompositionEventHandler<HTMLElement> | undefined;
-    onCompositionStartCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
-    onCompositionUpdate?: React.CompositionEventHandler<HTMLElement> | undefined;
-    onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLElement> | undefined;
-    onFocus?: React.FocusEventHandler<HTMLElement> | undefined;
-    onFocusCapture?: React.FocusEventHandler<HTMLElement> | undefined;
-    onBlur?: React.FocusEventHandler<HTMLElement> | undefined;
-    onBlurCapture?: React.FocusEventHandler<HTMLElement> | undefined;
-    onChange?: React.FormEventHandler<HTMLElement> | undefined;
-    onChangeCapture?: React.FormEventHandler<HTMLElement> | undefined;
-    onBeforeInput?: React.InputEventHandler<HTMLElement> | undefined;
-    onBeforeInputCapture?: React.FormEventHandler<HTMLElement> | undefined;
-    onInput?: React.FormEventHandler<HTMLElement> | undefined;
-    onInputCapture?: React.FormEventHandler<HTMLElement> | undefined;
-    onReset?: React.FormEventHandler<HTMLElement> | undefined;
-    onResetCapture?: React.FormEventHandler<HTMLElement> | undefined;
-    onSubmit?: React.FormEventHandler<HTMLElement> | undefined;
-    onSubmitCapture?: React.FormEventHandler<HTMLElement> | undefined;
-    onInvalid?: React.FormEventHandler<HTMLElement> | undefined;
-    onInvalidCapture?: React.FormEventHandler<HTMLElement> | undefined;
-    onLoad?: React.ReactEventHandler<HTMLElement> | undefined;
-    onLoadCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onError?: React.ReactEventHandler<HTMLElement> | undefined;
-    onErrorCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onKeyDown?: React.KeyboardEventHandler<HTMLElement> | undefined;
-    onKeyDownCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
-    onKeyPress?: React.KeyboardEventHandler<HTMLElement> | undefined;
-    onKeyPressCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
-    onKeyUp?: React.KeyboardEventHandler<HTMLElement> | undefined;
-    onKeyUpCapture?: React.KeyboardEventHandler<HTMLElement> | undefined;
-    onAbort?: React.ReactEventHandler<HTMLElement> | undefined;
-    onAbortCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onCanPlay?: React.ReactEventHandler<HTMLElement> | undefined;
-    onCanPlayCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onCanPlayThrough?: React.ReactEventHandler<HTMLElement> | undefined;
-    onCanPlayThroughCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onDurationChange?: React.ReactEventHandler<HTMLElement> | undefined;
-    onDurationChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onEmptied?: React.ReactEventHandler<HTMLElement> | undefined;
-    onEmptiedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onEncrypted?: React.ReactEventHandler<HTMLElement> | undefined;
-    onEncryptedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onEnded?: React.ReactEventHandler<HTMLElement> | undefined;
-    onEndedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onLoadedData?: React.ReactEventHandler<HTMLElement> | undefined;
-    onLoadedDataCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onLoadedMetadata?: React.ReactEventHandler<HTMLElement> | undefined;
-    onLoadedMetadataCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onLoadStart?: React.ReactEventHandler<HTMLElement> | undefined;
-    onLoadStartCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onPause?: React.ReactEventHandler<HTMLElement> | undefined;
-    onPauseCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onPlay?: React.ReactEventHandler<HTMLElement> | undefined;
-    onPlayCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onPlaying?: React.ReactEventHandler<HTMLElement> | undefined;
-    onPlayingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onProgress?: React.ReactEventHandler<HTMLElement> | undefined;
-    onProgressCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onRateChange?: React.ReactEventHandler<HTMLElement> | undefined;
-    onRateChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onSeeked?: React.ReactEventHandler<HTMLElement> | undefined;
-    onSeekedCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onSeeking?: React.ReactEventHandler<HTMLElement> | undefined;
-    onSeekingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onStalled?: React.ReactEventHandler<HTMLElement> | undefined;
-    onStalledCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onSuspend?: React.ReactEventHandler<HTMLElement> | undefined;
-    onSuspendCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onTimeUpdate?: React.ReactEventHandler<HTMLElement> | undefined;
-    onTimeUpdateCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onVolumeChange?: React.ReactEventHandler<HTMLElement> | undefined;
-    onVolumeChangeCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onWaiting?: React.ReactEventHandler<HTMLElement> | undefined;
-    onWaitingCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onAuxClick?: React.MouseEventHandler<HTMLElement> | undefined;
-    onAuxClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onClick?: React.MouseEventHandler<HTMLElement> | undefined;
-    onClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onContextMenu?: React.MouseEventHandler<HTMLElement> | undefined;
-    onContextMenuCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onDoubleClick?: React.MouseEventHandler<HTMLElement> | undefined;
-    onDoubleClickCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onDrag?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragCapture?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragEnd?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragEndCapture?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragEnter?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragEnterCapture?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragExit?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragExitCapture?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragLeave?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragLeaveCapture?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragOver?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragOverCapture?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragStart?: React.DragEventHandler<HTMLElement> | undefined;
-    onDragStartCapture?: React.DragEventHandler<HTMLElement> | undefined;
-    onDrop?: React.DragEventHandler<HTMLElement> | undefined;
-    onDropCapture?: React.DragEventHandler<HTMLElement> | undefined;
-    onMouseDown?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseDownCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseEnter?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseLeave?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseMove?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseMoveCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseOut?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseOutCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseOver?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseOverCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseUp?: React.MouseEventHandler<HTMLElement> | undefined;
-    onMouseUpCapture?: React.MouseEventHandler<HTMLElement> | undefined;
-    onSelect?: React.ReactEventHandler<HTMLElement> | undefined;
-    onSelectCapture?: React.ReactEventHandler<HTMLElement> | undefined;
-    onTouchCancel?: React.TouchEventHandler<HTMLElement> | undefined;
-    onTouchCancelCapture?: React.TouchEventHandler<HTMLElement> | undefined;
-    onTouchEnd?: React.TouchEventHandler<HTMLElement> | undefined;
-    onTouchEndCapture?: React.TouchEventHandler<HTMLElement> | undefined;
-    onTouchMove?: React.TouchEventHandler<HTMLElement> | undefined;
-    onTouchMoveCapture?: React.TouchEventHandler<HTMLElement> | undefined;
-    onTouchStart?: React.TouchEventHandler<HTMLElement> | undefined;
-    onTouchStartCapture?: React.TouchEventHandler<HTMLElement> | undefined;
-    onPointerDown?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerDownCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerMove?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerMoveCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerUp?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerUpCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerCancel?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerCancelCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerEnter?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerLeave?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerOver?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerOverCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerOut?: React.PointerEventHandler<HTMLElement> | undefined;
-    onPointerOutCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onGotPointerCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onLostPointerCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLElement> | undefined;
-    onScroll?: React.UIEventHandler<HTMLElement> | undefined;
-    onScrollCapture?: React.UIEventHandler<HTMLElement> | undefined;
-    onScrollEnd?: React.UIEventHandler<HTMLElement> | undefined;
-    onScrollEndCapture?: React.UIEventHandler<HTMLElement> | undefined;
-    onWheel?: React.WheelEventHandler<HTMLElement> | undefined;
-    onWheelCapture?: React.WheelEventHandler<HTMLElement> | undefined;
-    onAnimationStart?: React.AnimationEventHandler<HTMLElement> | undefined;
-    onAnimationStartCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
-    onAnimationEnd?: React.AnimationEventHandler<HTMLElement> | undefined;
-    onAnimationEndCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
-    onAnimationIteration?: React.AnimationEventHandler<HTMLElement> | undefined;
-    onAnimationIterationCapture?: React.AnimationEventHandler<HTMLElement> | undefined;
-    onToggle?: React.ToggleEventHandler<HTMLElement> | undefined;
-    onBeforeToggle?: React.ToggleEventHandler<HTMLElement> | undefined;
-    onTransitionCancel?: React.TransitionEventHandler<HTMLElement> | undefined;
-    onTransitionCancelCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
-    onTransitionEnd?: React.TransitionEventHandler<HTMLElement> | undefined;
-    onTransitionEndCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
-    onTransitionRun?: React.TransitionEventHandler<HTMLElement> | undefined;
-    onTransitionRunCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
-    onTransitionStart?: React.TransitionEventHandler<HTMLElement> | undefined;
-    onTransitionStartCapture?: React.TransitionEventHandler<HTMLElement> | undefined;
-    className: string;
-}, Element>;
+declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLElement>>;
 
 interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "onChange"> {
     /** Checkbox 라벨 */
@@ -820,6 +539,8 @@ interface SelectHeaderProps {
     placeholder?: string;
     /** 비활성화 상태 */
     disabled?: boolean;
+    /** 읽기 전용 (값은 표시되지만 변경 불가) */
+    readOnly?: boolean;
     /** 에러 상태 */
     error?: boolean;
     /** Help text (도움말 텍스트) */
@@ -867,7 +588,7 @@ interface SelectHeaderProps {
 }
 /** SelectHeader 컴포넌트는 선택된 값을 표시하고 드롭다운을 여는 헤더 컴포넌트다. items를 주면 클릭 시 메뉴가 열린다. */
 declare const SelectHeader: {
-    ({ type, title, required, value: valueProp, placeholder, disabled, error, description, accentIcon, onClick, onClear, prefixIcon, icon, className, id, items, defaultValue, onChange, multiple, showClear, wrapperClassName, wrapperStyle, width, size, menuItemTextProps, menuSuffixIcon, menuClassName, menuStyle, menuMaxRows, }: SelectHeaderProps): react_jsx_runtime.JSX.Element;
+    ({ type, title, required, value: valueProp, placeholder, disabled, readOnly, error, description, accentIcon, onClick, onClear, prefixIcon, icon, className, id, items, defaultValue, onChange, multiple, showClear, wrapperClassName, wrapperStyle, width, size, menuItemTextProps, menuSuffixIcon, menuClassName, menuStyle, menuMaxRows, }: SelectHeaderProps): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 
@@ -890,6 +611,8 @@ type SelectBoxSpecificProps = {
     size?: SelectBoxSize;
     /** 비활성화 */
     disabled?: boolean;
+    /** 읽기 전용 (값은 표시되지만 변경 불가) */
+    readOnly?: boolean;
     /** 에러 상태 */
     error?: boolean;
     /** 성공 상태 */
@@ -923,7 +646,7 @@ type SelectBoxSpecificProps = {
     width?: string | number;
 };
 /** SelectHeader에서 SelectBox가 오버라이드하는 props 제외 */
-type SelectHeaderPassThrough = Omit<SelectHeaderProps, "type" | "size" | "title" | "disabled" | "error" | "description" | "accentIcon" | "icon" | "prefixIcon" | "wrapperClassName" | "menuClassName" | "menuStyle" | "style" | "className" | "width"> & {
+type SelectHeaderPassThrough = Omit<SelectHeaderProps, "type" | "size" | "title" | "disabled" | "readOnly" | "error" | "description" | "accentIcon" | "icon" | "prefixIcon" | "wrapperClassName" | "menuClassName" | "menuStyle" | "style" | "className" | "width"> & {
     /** SelectHeader 타입 (outlined | underlined) */
     headerType?: SelectHeaderType;
 };
@@ -939,7 +662,7 @@ type SelectMenuPassThrough = {
 type SelectBoxProps = SelectBoxSpecificProps & SelectHeaderPassThrough & SelectMenuPassThrough;
 /** SelectBox는 SelectHeader와 SelectMenu를 하나로 통합한 컴포넌트로, 미리 정의된 목록에서 항목을 선택하도록 돕습니다. */
 declare const SelectBox: {
-    ({ size, disabled, error, success, loading, label, required, placeholder, items, value, defaultValue, onChange, multiple, description, prefixIcon, className, style, classNames, styles, width, headerType, onClear, showClear, wrapperStyle, onClick, id, itemTextProps, suffixIcon, maxRows, ...restHeaderProps }: SelectBoxProps): react_jsx_runtime.JSX.Element;
+    ({ size, disabled, readOnly, error, success, loading, label, required, placeholder, items, value, defaultValue, onChange, multiple, description, prefixIcon, className, style, classNames, styles, width, headerType, onClear, showClear, wrapperStyle, onClick, id, itemTextProps, suffixIcon, maxRows, ...restHeaderProps }: SelectBoxProps): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 
@@ -1037,7 +760,7 @@ interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
     maxValue?: number;
 }
 /** Badge 컴포넌트는 알림 카운트, 상태 등을 시각적으로 표현하는 원형 라벨 컴포넌트다. */
-declare const Badge: ({ type, variant, value, maxValue, className, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;
 
 type TagType = "solid" | "outline" | "weak";
 type TagSize = "medium" | "small";
@@ -1057,7 +780,7 @@ interface TagProps extends React.HTMLAttributes<HTMLSpanElement> {
     suffixIcon?: React.ReactNode;
 }
 /** Tag 컴포넌트는 콘텐츠의 속성, 상태, 카테고리를 시각적으로 표현하는 읽기 전용 라벨 컴포넌트다. */
-declare const Tag: ({ type, size, state, label, prefixIcon, suffixIcon, className, ...props }: TagProps) => react_jsx_runtime.JSX.Element;
+declare const Tag: React.ForwardRefExoticComponent<TagProps & React.RefAttributes<HTMLSpanElement>>;
 
 type TooltipPosition = "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
 type TooltipType = "word" | "sentence";
@@ -1096,7 +819,10 @@ interface TooltipProps {
     className?: string;
 }
 /** Tooltip 컴포넌트는 사용자에게 추가 정보나 설명을 제공하는 작은 팝오버입니다. */
-declare const Tooltip: ({ label, type, prefixIcon, onClose, direction, withArrow, opened: openedProp, defaultOpened, disabled, width, offset, withinPortal, openDelay, closeDelay, children, className, }: TooltipProps) => react_jsx_runtime.JSX.Element;
+declare const Tooltip: {
+    ({ label, type, prefixIcon, onClose, direction, withArrow, opened: openedProp, defaultOpened, disabled, width, offset, withinPortal, openDelay, closeDelay, children, className, }: TooltipProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
 
 type ToastSize = "medium" | "small";
 type ToastState = "default" | "error" | "warning" | "success" | "information";
@@ -1125,7 +851,10 @@ interface ToastProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "style">
     style?: React.CSSProperties;
 }
 /** Toast 컴포넌트는 화면에 짧은 시간 동안 나타났다가 자동으로 사라지는 경량 알림 컴포넌트다. */
-declare const Toast: (props: ToastProps) => react_jsx_runtime.JSX.Element;
+declare const Toast: {
+    (props: ToastProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
 interface ToastOptions {
     /** Toast 상태 */
     state?: ToastState;
@@ -1363,6 +1092,8 @@ type ManagedDateInputProps = "type" | "value" | "startDate" | "endDate" | "onCli
 type DatePickerBaseProps = {
     /** 비활성화 */
     disabled?: boolean;
+    /** 읽기 전용 (값은 표시되지만 변경 불가) */
+    readOnly?: boolean;
     /** 에러 상태 */
     error?: boolean;
     /** 도움말 텍스트 */
@@ -1536,7 +1267,7 @@ interface TextFieldAreaProps extends TextFieldBaseProps, Omit<React.TextareaHTML
 }
 type TextFieldProps = TextFieldInputProps | TextFieldAreaProps;
 /** TextField 컴포넌트는 사용자로부터 텍스트 입력을 받는 폼 컴포넌트입니다. input과 textarea를 통합합니다. */
-declare const TextField: (props: TextFieldProps) => react_jsx_runtime.JSX.Element;
+declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
 
 type LogoType = "likelion-eng" | "likelion-kr" | "bootcamp" | "symbol" | "favicon" | "og-image";
 type LogoColor = "primary" | "black" | "white";
@@ -1555,7 +1286,10 @@ interface LogoProps extends React.HTMLAttributes<HTMLDivElement> {
  * Logo 컴포넌트는 브랜드 아이덴티티를 표현하는 로고 컴포넌트다.
  * `size` 외에 `className` 또는 `style`로 너비/높이를 직접 지정할 수 있다.
  */
-declare const Logo: ({ type, color, size, service, className, style, ...props }: LogoProps) => react_jsx_runtime.JSX.Element;
+declare const Logo: {
+    ({ type, color, size, service, className, style, ...props }: LogoProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
 
 interface BreakpointContextType {
     isMobile?: boolean;