@reco-inc/upbox-ui 0.1.1

package/dist/components/tabs/Tabs.stories.d.ts

@@ -0,0 +1,41 @@
+import { StoryObj } from '@storybook/vue3-vite';
+declare const meta: {
+    title: string;
+    component: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('.').TabsProps> & Readonly<{
+            "onUpdate:modelValue"?: ((payload: string | number) => any) | undefined;
+        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            "update:modelValue": (payload: string | number) => any;
+        }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('.').TabsProps> & Readonly<{
+            "onUpdate:modelValue"?: ((payload: string | number) => any) | undefined;
+        }>, {}, {}, {}, {}, {}>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import('vue').ComponentOptionsBase<Readonly<import('.').TabsProps> & Readonly<{
+        "onUpdate:modelValue"?: ((payload: string | number) => any) | undefined;
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        "update:modelValue": (payload: string | number) => any;
+    }, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: {
+            default?(_: {}): any;
+        };
+    });
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const BoxNavy: Story;
+export declare const BoxGrey: Story;
+export declare const Round: Story;
+export declare const SmallSize: Story;
+export declare const LargeSize: Story;
+export declare const XlargeSize: Story;

package/dist/components/tabs/TabsBar.d.ts

@@ -0,0 +1,41 @@
+import { HTMLAttributes } from 'vue';
+export interface TabItem {
+    label: string;
+    value: string | number | null;
+    disabled?: boolean;
+}
+type __VLS_Props = {
+    modelValue?: string | number | null;
+    items: TabItem[];
+    variant?: "default" | "round" | "box";
+    color?: "navy" | "grey";
+    size?: "small" | "regular" | "large" | "xlarge";
+    class?: HTMLAttributes["class"];
+    /** TabsList 에 적용할 추가 class */
+    listClass?: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string | number | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | number | null) => any) | undefined;
+}>, {
+    size: "small" | "regular" | "large" | "xlarge";
+    color: "navy" | "grey";
+    variant: "default" | "round" | "box";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/tabs/TabsBar.stories.d.ts

@@ -0,0 +1,27 @@
+import { StoryObj } from '@storybook/vue3-vite';
+declare const meta: {
+    title: string;
+    component: any;
+    tags: string[];
+    argTypes: {
+        variant: {
+            control: "inline-radio";
+            options: string[];
+        };
+        color: {
+            control: "inline-radio";
+            options: string[];
+        };
+        size: {
+            control: "select";
+            options: string[];
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+/** 탭 바가 v-model 구동, 내용은 페이지가 v-if 로 렌더 (이 앱 주 패턴) */
+export declare const Default: Story;
+export declare const Variants: Story;
+/** 콘텐츠 패널까지 묶고 싶으면 slot 안에서 compound TabsContent 사용 */
+export declare const WithContent: Story;

package/dist/components/tabs/TabsContent.d.ts

@@ -0,0 +1,22 @@
+import { TabsContentProps } from 'reka-ui';
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = TabsContentProps & {
+    class?: HTMLAttributes["class"];
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/tabs/TabsList.d.ts

@@ -0,0 +1,25 @@
+import { TabsListProps as RekaTabsListProps } from 'reka-ui';
+import { TabsListProps } from '.';
+interface Props extends RekaTabsListProps, TabsListProps {
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    size: "small" | "regular" | "large" | "xlarge";
+    color: "navy" | "grey";
+    variant: "default" | "round" | "box";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/tabs/TabsTrigger.d.ts

@@ -0,0 +1,25 @@
+import { TabsTriggerProps as RekaTabsTriggerProps } from 'reka-ui';
+import { TabsTriggerProps } from '.';
+interface Props extends RekaTabsTriggerProps, TabsTriggerProps {
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    size: "small" | "regular" | "large" | "xlarge";
+    color: "navy" | "grey";
+    variant: "default" | "round" | "box";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/tabs/index.d.ts

@@ -0,0 +1,45 @@
+import { VariantProps } from 'class-variance-authority';
+import { Component } from 'vue';
+export { default as Tabs } from './Tabs';
+export { default as TabsBar } from './TabsBar';
+export type { TabItem } from './TabsBar';
+export { default as TabsContent } from './TabsContent';
+export { default as TabsList } from './TabsList';
+export { default as TabsTrigger } from './TabsTrigger';
+export interface TabsProps {
+    defaultValue?: string | number;
+    modelValue?: string | number;
+    orientation?: "horizontal" | "vertical";
+    dir?: "ltr" | "rtl";
+    activationMode?: "manual" | "automatic";
+    unmountOnHide?: boolean;
+    asChild?: boolean;
+    as?: string | Component;
+}
+export interface TabsEmits {
+    "update:modelValue": [payload: string | number];
+}
+export declare const tabsListVariants: (props?: ({
+    variant?: "box" | "default" | "round" | null | undefined;
+    color?: "navy" | "grey" | null | undefined;
+    size?: "small" | "large" | "regular" | "xlarge" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const tabsTriggerVariants: (props?: ({
+    variant?: "box" | "default" | "round" | null | undefined;
+    color?: "navy" | "grey" | null | undefined;
+    size?: "small" | "large" | "regular" | "xlarge" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export type TabsListVariants = VariantProps<typeof tabsListVariants>;
+export type TabsTriggerVariants = VariantProps<typeof tabsTriggerVariants>;
+export interface TabsListProps {
+    variant?: "default" | "round" | "box";
+    color?: "navy" | "grey";
+    size?: "small" | "regular" | "large" | "xlarge";
+    class?: string;
+}
+export interface TabsTriggerProps {
+    variant?: "default" | "round" | "box";
+    color?: "navy" | "grey";
+    size?: "small" | "regular" | "large" | "xlarge";
+    class?: string;
+}

package/dist/components/tag/Tag.d.ts

@@ -0,0 +1,27 @@
+import { TagProps } from '.';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        badge?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<TagProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    close: () => any;
+}, string, import('vue').PublicProps, Readonly<TagProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {
+    size: "3xsmall" | "2xsmall" | "xsmall" | "small";
+    state: "enabled" | "disabled" | "error";
+    closable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/tag/Tag.stories.d.ts

@@ -0,0 +1,66 @@
+import { StoryObj } from '@storybook/vue3-vite';
+declare const meta: {
+    title: string;
+    component: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('.').TagProps> & Readonly<{
+            onClose?: (() => any) | undefined;
+        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            close: () => any;
+        }, import('vue').PublicProps, {
+            size: "3xsmall" | "2xsmall" | "xsmall" | "small";
+            state: "enabled" | "disabled" | "error";
+            closable: boolean;
+        }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('.').TagProps> & Readonly<{
+            onClose?: (() => any) | undefined;
+        }>, {}, {}, {}, {}, {
+            size: "3xsmall" | "2xsmall" | "xsmall" | "small";
+            state: "enabled" | "disabled" | "error";
+            closable: boolean;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import('vue').ComponentOptionsBase<Readonly<import('.').TagProps> & Readonly<{
+        onClose?: (() => any) | undefined;
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        close: () => any;
+    }, string, {
+        size: "3xsmall" | "2xsmall" | "xsmall" | "small";
+        state: "enabled" | "disabled" | "error";
+        closable: boolean;
+    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: {
+            badge?(_: {}): any;
+            default?(_: {}): any;
+        };
+    });
+    tags: string[];
+    argTypes: {
+        state: {
+            control: "select";
+            options: string[];
+        };
+        size: {
+            control: "select";
+            options: string[];
+        };
+        closable: {
+            control: "boolean";
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const States: Story;
+export declare const Closable: Story;
+export declare const Sizes: Story;
+export declare const WithBadge: Story;
+export declare const Matrix: Story;

package/dist/components/tag/index.d.ts

@@ -0,0 +1,14 @@
+import { VariantProps } from 'class-variance-authority';
+export { default as Tag } from './Tag';
+export declare const tagVariants: (props?: ({
+    state?: "disabled" | "error" | "enabled" | null | undefined;
+    size?: "small" | "3xsmall" | "2xsmall" | "xsmall" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export type TagVariants = VariantProps<typeof tagVariants>;
+export interface TagProps {
+    state?: "enabled" | "disabled" | "error";
+    size?: "3xsmall" | "2xsmall" | "xsmall" | "small";
+    closable?: boolean;
+    class?: string;
+}
+export declare const tagCloseIconSize: Record<NonNullable<TagVariants["size"]>, string>;

package/dist/components/text-button/TextButton.d.ts

@@ -0,0 +1,32 @@
+export interface TextButtonProps {
+    /** information: 임시 — Figma 미정의 파란 텍스트 링크 톤 */
+    variant?: 'destructive' | 'secondary' | 'information';
+    size?: '2xsmall' | 'xsmall' | 'small';
+    disabled?: boolean;
+    class?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLButtonElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<TextButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<TextButtonProps> & Readonly<{
+    onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+    disabled: boolean;
+    size: "2xsmall" | "xsmall" | "small";
+    variant: "destructive" | "secondary" | "information";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLButtonElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/text-button/TextButton.stories.d.ts

@@ -0,0 +1,67 @@
+import { StoryObj } from '@storybook/vue3-vite';
+declare const meta: {
+    title: string;
+    component: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./TextButton').TextButtonProps> & Readonly<{
+            onClick?: ((event: MouseEvent) => any) | undefined;
+        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            click: (event: MouseEvent) => any;
+        }, import('vue').PublicProps, {
+            disabled: boolean;
+            size: "2xsmall" | "xsmall" | "small";
+            variant: "destructive" | "secondary" | "information";
+        }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLButtonElement, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('./TextButton').TextButtonProps> & Readonly<{
+            onClick?: ((event: MouseEvent) => any) | undefined;
+        }>, {}, {}, {}, {}, {
+            disabled: boolean;
+            size: "2xsmall" | "xsmall" | "small";
+            variant: "destructive" | "secondary" | "information";
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import('vue').ComponentOptionsBase<Readonly<import('./TextButton').TextButtonProps> & Readonly<{
+        onClick?: ((event: MouseEvent) => any) | undefined;
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        click: (event: MouseEvent) => any;
+    }, string, {
+        disabled: boolean;
+        size: "2xsmall" | "xsmall" | "small";
+        variant: "destructive" | "secondary" | "information";
+    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: {
+            default?(_: {}): any;
+        };
+    });
+    tags: string[];
+    args: {
+        onClick: import('storybook/test').Mock<(...args: any[]) => any>;
+    };
+    argTypes: {
+        variant: {
+            control: "select";
+            options: string[];
+        };
+        size: {
+            control: "select";
+            options: string[];
+        };
+        disabled: {
+            control: "boolean";
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Variants: Story;
+export declare const Sizes: Story;
+export declare const WithIcons: Story;
+export declare const Disabled: Story;

package/dist/components/text-button/index.d.ts

@@ -0,0 +1,7 @@
+import { VariantProps } from 'class-variance-authority';
+export { default as TextButton } from './TextButton';
+export declare const textButtonVariants: (props?: ({
+    variant?: "destructive" | "secondary" | "information" | null | undefined;
+    size?: "small" | "2xsmall" | "xsmall" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export type TextButtonVariants = VariantProps<typeof textButtonVariants>;

package/dist/components/text-field/TextField.d.ts

@@ -0,0 +1,47 @@
+import { HTMLAttributes } from 'vue';
+export interface TextFieldProps {
+    variant?: "default" | "filled" | "bottomline";
+    size?: "small" | "regular" | "large";
+    error?: boolean;
+    modelValue?: string | number;
+    defaultValue?: string | number;
+    class?: HTMLAttributes["class"];
+    clearable?: boolean;
+    password?: boolean;
+    maxLength?: number;
+    byteMode?: boolean;
+    disabled?: boolean;
+    readonly?: boolean;
+    placeholder?: string;
+    type?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<TextFieldProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:modelValue": (payload: string | number) => any;
+}, string, import('vue').PublicProps, Readonly<TextFieldProps> & Readonly<{
+    "onUpdate:modelValue"?: ((payload: string | number) => any) | undefined;
+}>, {
+    disabled: boolean;
+    type: string;
+    size: "small" | "regular" | "large";
+    variant: "default" | "filled" | "bottomline";
+    readonly: boolean;
+    clearable: boolean;
+    password: boolean;
+    byteMode: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/text-field/TextField.stories.d.ts

@@ -0,0 +1,123 @@
+import { StoryObj } from '@storybook/vue3-vite';
+declare const meta: {
+    title: string;
+    component: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./TextField').TextFieldProps> & Readonly<{
+            "onUpdate:modelValue"?: ((payload: string | number) => any) | undefined;
+        }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+            "update:modelValue": (payload: string | number) => any;
+        }, import('vue').PublicProps, {
+            disabled: boolean;
+            type: string;
+            size: "small" | "regular" | "large";
+            variant: "default" | "filled" | "bottomline";
+            readonly: boolean;
+            clearable: boolean;
+            password: boolean;
+            byteMode: boolean;
+        }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('./TextField').TextFieldProps> & Readonly<{
+            "onUpdate:modelValue"?: ((payload: string | number) => any) | undefined;
+        }>, {}, {}, {}, {}, {
+            disabled: boolean;
+            type: string;
+            size: "small" | "regular" | "large";
+            variant: "default" | "filled" | "bottomline";
+            readonly: boolean;
+            clearable: boolean;
+            password: boolean;
+            byteMode: boolean;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import('vue').ComponentOptionsBase<Readonly<import('./TextField').TextFieldProps> & Readonly<{
+        "onUpdate:modelValue"?: ((payload: string | number) => any) | undefined;
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+        "update:modelValue": (payload: string | number) => any;
+    }, string, {
+        disabled: boolean;
+        type: string;
+        size: "small" | "regular" | "large";
+        variant: "default" | "filled" | "bottomline";
+        readonly: boolean;
+        clearable: boolean;
+        password: boolean;
+        byteMode: boolean;
+    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: {
+            default?(_: {}): any;
+        };
+    });
+    tags: string[];
+    argTypes: {
+        variant: {
+            control: "select";
+            options: string[];
+        };
+        size: {
+            control: "select";
+            options: string[];
+        };
+        error: {
+            control: "boolean";
+        };
+        disabled: {
+            control: "boolean";
+        };
+        readonly: {
+            control: "boolean";
+        };
+        clearable: {
+            control: "boolean";
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Variants: Story;
+export declare const Sizes: Story;
+export declare const ErrorState: Story;
+/**
+ * - 드래그, 포커싱, 입력 모두 불가능함
+ * - 서버에 전달도 안됨
+ */
+export declare const Disabled: Story;
+/**
+ * - readonly 속성은 드래그, 포커싱은 가능
+ * - 대신 입력 불가능함
+ * - 서버에 값도 전달되는 속성임
+ */
+export declare const ReadOnly: Story;
+/**
+ * - 눈 표시 있음. 눈 누르면 비밀번호 토글됨
+ * - type=password, 네이티브만
+ *
+ */
+export declare const Password: Story;
+/**
+ * - 지우기 버튼 누르면 값 지워짐
+ */
+export declare const Clearable: Story;
+/**
+ * - `<InputIcon>` 를 활용
+ * - 아이콘 크기는 `<TextField>` 의 크기에 맞춰서 자동 조정됨
+ */
+export declare const WithSuffixIcon: Story;
+/**
+ * - `<TextFieldCount>` 를 활용
+ * - count 는 `<TextField>` 에서 관리함 (maxLength, byteMode 등을 provide 함~)
+ */
+export declare const WithCount: Story;
+/**
+ * - `<TextFieldUnit>` 를 활용
+ * - Unit 은 아무거나 넣어주면 됨~
+ */
+export declare const WithUnit: Story;

package/dist/components/text-field/TextFieldCount.d.ts

@@ -0,0 +1,12 @@
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = {
+    /**
+     * 부모 `TextField` 밖에서 쓸 때만. `TextField` 자식이면 `TextField`의 model·`maxLength`·`byteMode`가 우선
+     */
+    current?: number;
+    maxLength?: number;
+    byteMode?: boolean;
+    class?: HTMLAttributes["class"];
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
+export default _default;

package/dist/components/text-field/TextFieldUnit.d.ts

@@ -0,0 +1,21 @@
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = {
+    class?: HTMLAttributes["class"];
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLSpanElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};