@loword/loword-design-system 0.0.11 → 0.0.13

package/dist/components/LDEditor/LDEditor.js

@@ -1,8 +1,9 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { AlignCenter, AlignJustify, AlignLeft, AlignRight, Bold, ChevronDown, Image as ImageIcon, Italic, Link2, List, ListOrdered, Redo, Strikethrough, Underline, Undo, Unlink, } from 'lucide-react';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { useEditorState } from '@tiptap/react';
+import { BubbleMenu } from '@tiptap/react/menus';
 import EditorBase, { useEditorContext } from './EditorBase.js';
 import { createEditorExtensions } from './extensions.js';
 import cn from '../../utils/cn.js';
@@ -42,7 +43,16 @@ const LDEditor = ({ content, onChange, className, handleImageUpload, }) => {
 };
 const EditorToolbar = ({ handleImageUpload, }) => {
     const [linkUrl, setLinkUrl] = useState('');
+    const [isMobile, setIsMobile] = useState(false);
     const { editor } = useEditorContext();
+    // 모바일(<768px)에서는 인라인 서식을 버블 메뉴로 옮기고 상단 툴바는 슬림하게.
+    useEffect(() => {
+        const mql = window.matchMedia('(max-width: 767px)');
+        const sync = () => setIsMobile(mql.matches);
+        sync();
+        mql.addEventListener('change', sync);
+        return () => mql.removeEventListener('change', sync);
+    }, []);
     const state = useEditorState({
         editor,
         selector: ({ editor }) => {
@@ -105,58 +115,88 @@ const EditorToolbar = ({ handleImageUpload, }) => {
     };
     if (!editor || !state)
         return null;
-    return (_jsxs(EditorBase.Toolbar, { className: "gap-5 px-4 py-3 rounded-t-md border border-neutral200", children: [_jsx(EditorBase.Toolbar.Dropdown, { className: "bg-white border border-neutral200 rounded-lg shadow-lg min-w-[120px]", trigger: ({ toggle }) => (_jsx(EditorBase.Toolbar.LDButton, { onClick: toggle, className: cn(iconBtn, 'flex items-center gap-5 px-2'), children: _jsx("span", { className: "whitespace-nowrap min-w-10", children: state.headingLevel ? `제목 ${state.headingLevel}` : '본문' }) })), children: ({ close }) => HEADINGS.map(({ label, level }) => (_jsx("button", { type: "button", onClick: (e) => {
-                        e.preventDefault();
-                        if (level === 0)
-                            editor.chain().focus().setParagraph().run();
-                        else
-                            editor.chain().focus().toggleHeading({ level }).run();
-                        close();
-                    }, className: "w-full px-3 py-2 cursor-pointer text-left text-sm hover:bg-mono100 first:rounded-t-lg last:rounded-b-lg", children: label }, level))) }), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleBold().run(), className: cn(iconBtn, state.isBold && activeBtn), children: _jsx(Bold, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleItalic().run(), className: cn(iconBtn, state.isItalic && activeBtn), children: _jsx(Italic, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleUnderline().run(), className: cn(iconBtn, state.isUnderline && activeBtn), children: _jsx(Underline, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleStrike().run(), className: cn(iconBtn, state.isStrike && activeBtn), children: _jsx(Strikethrough, { className: "w-5 h-5" }) }), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.Dropdown, { className: "border border-neutral200 bg-white rounded-lg shadow-lg min-w-[100px]", trigger: ({ toggle }) => (_jsxs(EditorBase.Toolbar.LDButton, { onClick: toggle, className: cn(iconBtn, 'flex items-center gap-1 px-2'), children: [_jsx("span", { className: "text-sm whitespace-nowrap", children: state.fontSize }), _jsx(ChevronDown, { className: "w-4 h-4" })] })), children: ({ close }) => FONT_SIZES.map((size) => (_jsx("button", { type: "button", onClick: (e) => {
-                        e.preventDefault();
-                        editor.chain().focus().setFontSize(size).run();
-                        close();
-                    }, className: "w-full px-3 py-2 cursor-pointer text-left text-sm hover:bg-mono100 first:rounded-t-lg last:rounded-b-lg", children: size }, size))) }), _jsx(EditorBase.Toolbar.Dropdown, { className: "bg-white border border-neutral200 rounded-lg shadow-lg min-w-[140px]", trigger: ({ toggle }) => (_jsxs(EditorBase.Toolbar.LDButton, { onClick: toggle, className: cn(iconBtn, 'flex items-center gap-2 px-2'), children: [_jsx("span", { className: "w-4 h-4 rounded-full", style: { backgroundColor: state.color } }), state.color, _jsx(ChevronDown, { className: "w-4 h-4" })] })), children: ({ close }) => COLORS.map((color) => (_jsxs("button", { type: "button", onClick: (e) => {
-                        e.preventDefault();
-                        editor.chain().focus().setColor(color.value).run();
-                        close();
-                    }, className: "flex items-center gap-2 w-full px-3 py-2 cursor-pointer text-left text-sm hover:bg-mono100 first:rounded-t-lg last:rounded-b-lg", children: [_jsx("span", { className: "w-4 h-4 rounded-full", style: { backgroundColor: color.value } }), _jsx("span", { children: color.label })] }, color.value))) }), _jsx(LDDivider, {}), ['left', 'center', 'right', 'justify'].map((align) => {
-                const Icon = {
-                    left: AlignLeft,
-                    center: AlignCenter,
-                    right: AlignRight,
-                    justify: AlignJustify,
-                }[align];
-                return (_jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().setTextAlign(align).run(), className: cn(iconBtn, state.align[align] && activeBtn), children: _jsx(Icon, { className: "w-5 h-5" }) }, align));
-            }), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleBulletList().run(), className: cn(iconBtn, state.isBulletList && activeBtn), children: _jsx(List, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleOrderedList().run(), className: cn(iconBtn, state.isOrderedList && activeBtn), children: _jsx(ListOrdered, { className: "w-5 h-5" }) }), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.LDButton, { disabled: !state.canUndo, onClick: () => editor.chain().focus().undo().run(), className: iconBtn, children: _jsx(Undo, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { disabled: !state.canRedo, onClick: () => editor.chain().focus().redo().run(), className: iconBtn, children: _jsx(Redo, { className: "w-5 h-5" }) }), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.Dropdown, { className: "bg-white border border-neutral200 rounded-lg shadow-lg p-3 min-w-[280px]", trigger: ({ toggle }) => (_jsx(EditorBase.Toolbar.LDButton, { onClick: () => {
-                        setLinkUrl(editor.getAttributes('link').href || '');
-                        toggle();
-                    }, className: cn(iconBtn, state.isLink && activeBtn), children: _jsx(Link2, { className: "w-5 h-5" }) })), children: ({ close }) => {
-                    const applyLink = () => {
-                        const chain = editor.chain().focus().extendMarkRange('link');
-                        if (linkUrl === '') {
-                            chain.unsetLink().run();
-                        }
-                        else {
-                            const url = /^https?:\/\//.test(linkUrl)
-                                ? linkUrl
-                                : `https://${linkUrl}`;
-                            chain.setLink({ href: url }).run();
-                        }
-                        setLinkUrl('');
-                        close();
-                    };
-                    return (_jsxs(_Fragment, { children: [_jsx("input", { type: "text", autoFocus: true, placeholder: "URL\uC744 \uC785\uB825\uD558\uC138\uC694", value: linkUrl, onChange: (e) => setLinkUrl(e.target.value), onKeyDown: (e) => e.key === 'Enter' && applyLink(), className: "w-full px-3 py-2 border border-neutral200 rounded-lg text-sm outline-none transition duration-300 focus:border-blue-500" }), _jsxs("div", { className: "flex gap-2 mt-2", children: [_jsx("button", { type: "button", onClick: (e) => {
-                                            e.preventDefault();
-                                            applyLink();
-                                        }, className: "flex-1 px-3 py-1.5 bg-blue-500 text-white rounded-lg text-sm transition duration-300 hover:bg-blue-600", children: "\uC801\uC6A9" }), _jsx("button", { type: "button", onClick: (e) => {
-                                            e.preventDefault();
-                                            setLinkUrl('');
-                                            close();
-                                        }, className: "px-3 py-1.5 border border-neutral200 rounded-lg text-sm transition duration-300 hover:bg-mono100", children: "\uCDE8\uC18C" })] })] }));
-                } }), _jsx(EditorBase.Toolbar.LDButton, { disabled: !state.isLink, onClick: () => editor.chain().focus().unsetLink().run(), className: iconBtn, children: _jsx(Unlink, { className: "w-5 h-5" }) }), _jsx(LDDivider, {}), _jsxs("label", { className: cn(iconBtn, 'relative'), children: [_jsx(ImageIcon, { className: "w-5 h-5" }), _jsx("input", { type: "file", accept: "image/*", className: "absolute inset-0 w-full h-full opacity-0 cursor-pointer", onChange: (e) => {
-                            handleImageUploadAction(e.target.files);
-                            e.target.value = '';
-                        } })] })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs(EditorBase.Toolbar, { className: "gap-5 px-4 py-3 rounded-t-md border border-neutral200", children: [_jsx(EditorBase.Toolbar.Dropdown, { className: "bg-white border border-neutral200 rounded-lg shadow-lg min-w-[120px]", trigger: ({ toggle }) => (_jsx(EditorBase.Toolbar.LDButton, { onClick: toggle, className: cn(iconBtn, 'flex items-center gap-5 px-2'), children: _jsx("span", { className: "whitespace-nowrap min-w-10", children: state.headingLevel ? `제목 ${state.headingLevel}` : '본문' }) })), children: ({ close }) => HEADINGS.map(({ label, level }) => (_jsx("button", { type: "button", onClick: (e) => {
+                                e.preventDefault();
+                                if (level === 0)
+                                    editor.chain().focus().setParagraph().run();
+                                else
+                                    editor.chain().focus().toggleHeading({ level }).run();
+                                close();
+                            }, className: "w-full px-3 py-2 cursor-pointer text-left text-sm hover:bg-mono100 first:rounded-t-lg last:rounded-b-lg", children: label }, level))) }), !isMobile && (_jsxs(_Fragment, { children: [_jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleBold().run(), className: cn(iconBtn, state.isBold && activeBtn), children: _jsx(Bold, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleItalic().run(), className: cn(iconBtn, state.isItalic && activeBtn), children: _jsx(Italic, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleUnderline().run(), className: cn(iconBtn, state.isUnderline && activeBtn), children: _jsx(Underline, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleStrike().run(), className: cn(iconBtn, state.isStrike && activeBtn), children: _jsx(Strikethrough, { className: "w-5 h-5" }) }), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.Dropdown, { className: "border border-neutral200 bg-white rounded-lg shadow-lg min-w-[100px]", trigger: ({ toggle }) => (_jsxs(EditorBase.Toolbar.LDButton, { onClick: toggle, className: cn(iconBtn, 'flex items-center gap-1 px-2'), children: [_jsx("span", { className: "text-sm whitespace-nowrap", children: state.fontSize }), _jsx(ChevronDown, { className: "w-4 h-4" })] })), children: ({ close }) => FONT_SIZES.map((size) => (_jsx("button", { type: "button", onClick: (e) => {
+                                        e.preventDefault();
+                                        editor.chain().focus().setFontSize(size).run();
+                                        close();
+                                    }, className: "w-full px-3 py-2 cursor-pointer text-left text-sm hover:bg-mono100 first:rounded-t-lg last:rounded-b-lg", children: size }, size))) }), _jsx(EditorBase.Toolbar.Dropdown, { className: "bg-white border border-neutral200 rounded-lg shadow-lg min-w-[140px]", trigger: ({ toggle }) => (_jsxs(EditorBase.Toolbar.LDButton, { onClick: toggle, className: cn(iconBtn, 'flex items-center gap-2 px-2'), children: [_jsx("span", { className: "w-4 h-4 rounded-full", style: { backgroundColor: state.color } }), state.color, _jsx(ChevronDown, { className: "w-4 h-4" })] })), children: ({ close }) => COLORS.map((color) => (_jsxs("button", { type: "button", onClick: (e) => {
+                                        e.preventDefault();
+                                        editor.chain().focus().setColor(color.value).run();
+                                        close();
+                                    }, className: "flex items-center gap-2 w-full px-3 py-2 cursor-pointer text-left text-sm hover:bg-mono100 first:rounded-t-lg last:rounded-b-lg", children: [_jsx("span", { className: "w-4 h-4 rounded-full", style: { backgroundColor: color.value } }), _jsx("span", { children: color.label })] }, color.value))) }), _jsx(LDDivider, {}), ['left', 'center', 'right', 'justify'].map((align) => {
+                                const Icon = {
+                                    left: AlignLeft,
+                                    center: AlignCenter,
+                                    right: AlignRight,
+                                    justify: AlignJustify,
+                                }[align];
+                                return (_jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().setTextAlign(align).run(), className: cn(iconBtn, state.align[align] && activeBtn), children: _jsx(Icon, { className: "w-5 h-5" }) }, align));
+                            })] })), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleBulletList().run(), className: cn(iconBtn, state.isBulletList && activeBtn), children: _jsx(List, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleOrderedList().run(), className: cn(iconBtn, state.isOrderedList && activeBtn), children: _jsx(ListOrdered, { className: "w-5 h-5" }) }), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.LDButton, { disabled: !state.canUndo, onClick: () => editor.chain().focus().undo().run(), className: iconBtn, children: _jsx(Undo, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { disabled: !state.canRedo, onClick: () => editor.chain().focus().redo().run(), className: iconBtn, children: _jsx(Redo, { className: "w-5 h-5" }) }), !isMobile && (_jsxs(_Fragment, { children: [_jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.Dropdown, { className: "bg-white border border-neutral200 rounded-lg shadow-lg p-3 min-w-[280px]", trigger: ({ toggle }) => (_jsx(EditorBase.Toolbar.LDButton, { onClick: () => {
+                                        setLinkUrl(editor.getAttributes('link').href || '');
+                                        toggle();
+                                    }, className: cn(iconBtn, state.isLink && activeBtn), children: _jsx(Link2, { className: "w-5 h-5" }) })), children: ({ close }) => {
+                                    const applyLink = () => {
+                                        const chain = editor.chain().focus().extendMarkRange('link');
+                                        if (linkUrl === '') {
+                                            chain.unsetLink().run();
+                                        }
+                                        else {
+                                            const url = /^https?:\/\//.test(linkUrl)
+                                                ? linkUrl
+                                                : `https://${linkUrl}`;
+                                            chain.setLink({ href: url }).run();
+                                        }
+                                        setLinkUrl('');
+                                        close();
+                                    };
+                                    return (_jsxs(_Fragment, { children: [_jsx("input", { type: "text", autoFocus: true, placeholder: "URL\uC744 \uC785\uB825\uD558\uC138\uC694", value: linkUrl, onChange: (e) => setLinkUrl(e.target.value), onKeyDown: (e) => e.key === 'Enter' && applyLink(), className: "w-full px-3 py-2 border border-neutral200 rounded-lg text-sm outline-none transition duration-300 focus:border-blue-500" }), _jsxs("div", { className: "flex gap-2 mt-2", children: [_jsx("button", { type: "button", onClick: (e) => {
+                                                            e.preventDefault();
+                                                            applyLink();
+                                                        }, className: "flex-1 px-3 py-1.5 bg-blue-500 text-white rounded-lg text-sm transition duration-300 hover:bg-blue-600", children: "\uC801\uC6A9" }), _jsx("button", { type: "button", onClick: (e) => {
+                                                            e.preventDefault();
+                                                            setLinkUrl('');
+                                                            close();
+                                                        }, className: "px-3 py-1.5 border border-neutral200 rounded-lg text-sm transition duration-300 hover:bg-mono100", children: "\uCDE8\uC18C" })] })] }));
+                                } }), _jsx(EditorBase.Toolbar.LDButton, { disabled: !state.isLink, onClick: () => editor.chain().focus().unsetLink().run(), className: iconBtn, children: _jsx(Unlink, { className: "w-5 h-5" }) })] })), _jsx(LDDivider, {}), _jsxs("label", { className: cn(iconBtn, 'relative'), children: [_jsx(ImageIcon, { className: "w-5 h-5" }), _jsx("input", { type: "file", accept: "image/*", className: "absolute inset-0 w-full h-full opacity-0 cursor-pointer", onChange: (e) => {
+                                    handleImageUploadAction(e.target.files);
+                                    e.target.value = '';
+                                } })] })] }), isMobile && (_jsxs(BubbleMenu, { editor: editor, className: "flex items-center gap-1 rounded-lg border border-neutral200 bg-white p-1 shadow-lg", children: [_jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleBold().run(), className: cn(iconBtn, state.isBold && activeBtn), children: _jsx(Bold, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleItalic().run(), className: cn(iconBtn, state.isItalic && activeBtn), children: _jsx(Italic, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleUnderline().run(), className: cn(iconBtn, state.isUnderline && activeBtn), children: _jsx(Underline, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleStrike().run(), className: cn(iconBtn, state.isStrike && activeBtn), children: _jsx(Strikethrough, { className: "w-5 h-5" }) }), _jsx(EditorBase.Toolbar.Dropdown, { className: "bg-white border border-neutral200 rounded-lg shadow-lg min-w-[140px]", trigger: ({ toggle }) => (_jsxs(EditorBase.Toolbar.LDButton, { onClick: toggle, className: cn(iconBtn, 'flex items-center gap-1 px-2'), children: [_jsx("span", { className: "w-4 h-4 rounded-full", style: { backgroundColor: state.color } }), _jsx(ChevronDown, { className: "w-4 h-4" })] })), children: ({ close }) => COLORS.map((color) => (_jsxs("button", { type: "button", onClick: (e) => {
+                                e.preventDefault();
+                                editor.chain().focus().setColor(color.value).run();
+                                close();
+                            }, className: "flex items-center gap-2 w-full px-3 py-2 cursor-pointer text-left text-sm hover:bg-mono100 first:rounded-t-lg last:rounded-b-lg", children: [_jsx("span", { className: "w-4 h-4 rounded-full", style: { backgroundColor: color.value } }), _jsx("span", { children: color.label })] }, color.value))) }), _jsx(EditorBase.Toolbar.Dropdown, { className: "bg-white border border-neutral200 rounded-lg shadow-lg p-3 min-w-[240px]", trigger: ({ toggle }) => (_jsx(EditorBase.Toolbar.LDButton, { onClick: () => {
+                                setLinkUrl(editor.getAttributes('link').href || '');
+                                toggle();
+                            }, className: cn(iconBtn, state.isLink && activeBtn), children: _jsx(Link2, { className: "w-5 h-5" }) })), children: ({ close }) => {
+                            const applyLink = () => {
+                                const chain = editor.chain().focus().extendMarkRange('link');
+                                if (linkUrl === '') {
+                                    chain.unsetLink().run();
+                                }
+                                else {
+                                    const url = /^https?:\/\//.test(linkUrl)
+                                        ? linkUrl
+                                        : `https://${linkUrl}`;
+                                    chain.setLink({ href: url }).run();
+                                }
+                                setLinkUrl('');
+                                close();
+                            };
+                            return (_jsxs(_Fragment, { children: [_jsx("input", { type: "text", autoFocus: true, placeholder: "URL\uC744 \uC785\uB825\uD558\uC138\uC694", value: linkUrl, onChange: (e) => setLinkUrl(e.target.value), onKeyDown: (e) => e.key === 'Enter' && applyLink(), className: "w-full px-3 py-2 border border-neutral200 rounded-lg text-sm outline-none transition duration-300 focus:border-blue-500" }), _jsxs("div", { className: "flex gap-2 mt-2", children: [_jsx("button", { type: "button", onClick: (e) => {
+                                                    e.preventDefault();
+                                                    applyLink();
+                                                }, className: "flex-1 px-3 py-1.5 bg-blue-500 text-white rounded-lg text-sm transition duration-300 hover:bg-blue-600", children: "\uC801\uC6A9" }), _jsx("button", { type: "button", onClick: (e) => {
+                                                    e.preventDefault();
+                                                    setLinkUrl('');
+                                                    close();
+                                                }, className: "px-3 py-1.5 border border-neutral200 rounded-lg text-sm transition duration-300 hover:bg-mono100", children: "\uCDE8\uC18C" })] })] }));
+                        } })] }))] }));
 };
 export default LDEditor;

package/dist/components/LDEmpty/EmptyBase.d.ts

@@ -0,0 +1,19 @@
+import { HTMLAttributes, ReactNode, Ref } from 'react';
+interface RootProps extends HTMLAttributes<HTMLDivElement> {
+    children?: ReactNode;
+    ref?: Ref<HTMLDivElement>;
+}
+interface ImageProps {
+    children?: ReactNode;
+}
+interface DescriptionProps {
+    description?: string;
+    className?: string;
+}
+export declare const EmptyBase: {
+    Root: ({ ref, children, className, ...props }: RootProps) => import("react/jsx-runtime").JSX.Element;
+    Image: ({ children }: ImageProps) => import("react/jsx-runtime").JSX.Element;
+    Description: ({ description, className }: DescriptionProps) => import("react/jsx-runtime").JSX.Element | null;
+};
+export default EmptyBase;
+//# sourceMappingURL=EmptyBase.d.ts.map

package/dist/components/LDEmpty/EmptyBase.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDEmpty/EmptyBase.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEvD,UAAU,SAAU,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAUD,UAAU,UAAU;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD,UAAU,gBAAgB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAQD,eAAO,MAAM,SAAS;mDA3BgC,SAAS;0BAYlC,UAAU;8CASU,gBAAgB;CAUhE,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/components/LDEmpty/EmptyBase.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const Root = ({ ref, children, className, ...props }) => {
+    return (_jsx("div", { ref: ref, className: className, ...props, children: children }));
+};
+const Image = ({ children }) => {
+    return _jsx("div", { "aria-hidden": "true", children: children });
+};
+const Description = ({ description, className }) => {
+    if (!description)
+        return null;
+    return _jsx("span", { className: className, children: description });
+};
+export const EmptyBase = {
+    Root,
+    Image,
+    Description,
+};
+export default EmptyBase;

package/dist/components/LDEmpty/LDEmpty.d.ts

@@ -0,0 +1,35 @@
+import { CSSProperties, ReactNode } from 'react';
+export type EmptySize = 'small' | 'medium' | 'large';
+type EmptyDirection = 'col' | 'row';
+export interface LDEmptyProps {
+    /**
+     * 표시할 이미지/아이콘입니다. 생략하면 기본 빈 상태 일러스트가 렌더링됩니다.
+     */
+    image?: ReactNode;
+    /**
+     * 이미지 아래 표시할 설명 텍스트입니다. (기본값: 'No Data')
+     */
+    description?: string;
+    /**
+     * 이미지 크기와 설명 타이포그래피 스케일을 결정합니다. (기본값: 'medium')
+     */
+    size?: EmptySize;
+    /**
+     * 이미지/텍스트 정렬 방향을 결정합니다. (기본값: 'col')
+     */
+    direction?: EmptyDirection;
+    /**
+     * 추가적인 스타일 클래스를 지정합니다.
+     */
+    className?: string;
+    /**
+     * 인라인 스타일을 지정합니다. Root 엘리먼트에 그대로 전달됩니다.
+     */
+    style?: CSSProperties;
+}
+/**
+ * 데이터가 없을 때 표시하는 빈 상태 컴포넌트입니다.
+ */
+declare const LDEmpty: ({ image, description, size, direction, className, style, }: LDEmptyProps) => import("react/jsx-runtime").JSX.Element;
+export default LDEmpty;
+//# sourceMappingURL=LDEmpty.d.ts.map

package/dist/components/LDEmpty/LDEmpty.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LDEmpty.d.ts","sourceRoot":"","sources":["../../../src/components/LDEmpty/LDEmpty.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIjD,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AACrD,KAAK,cAAc,GAAG,KAAK,GAAG,KAAK,CAAC;AA6CpC,MAAM,WAAW,YAAY;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED;;GAEG;AACH,QAAA,MAAM,OAAO,GAAI,4DAOd,YAAY,4CAqBd,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/LDEmpty/LDEmpty.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import cn from '../../utils/cn.js';
+import EmptyBase from './EmptyBase.js';
+const GAP_CLASS_MAP = {
+    small: 'gap-xs',
+    medium: 'gap-sm',
+    large: 'gap-md',
+};
+const IMAGE_WIDTH_MAP = {
+    small: 48,
+    medium: 64,
+    large: 92,
+};
+const DESCRIPTION_CLASS_MAP = {
+    small: 'display12',
+    medium: 'display14',
+    large: 'display16',
+};
+// antd Empty.PRESENTED_IMAGE_SIMPLE(viewBox 0 0 64 41) 포팅, 색상만 loword mono 토큰으로 치환
+const DefaultEmptyImage = ({ width }) => {
+    const height = (width * 41) / 64;
+    return (_jsx("svg", { width: width, height: height, viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: _jsxs("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [_jsx("ellipse", { className: "fill-mono100", cx: "32", cy: "33", rx: "32", ry: "7" }), _jsxs("g", { className: "stroke-mono300", fillRule: "nonzero", children: [_jsx("path", { d: "M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" }), _jsx("path", { className: "fill-mono50", d: "M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z" })] })] }) }));
+};
+/**
+ * 데이터가 없을 때 표시하는 빈 상태 컴포넌트입니다.
+ */
+const LDEmpty = ({ image, description = 'No Data', size = 'medium', direction = 'col', className, style, }) => {
+    return (_jsxs(EmptyBase.Root, { className: cn('flex items-center justify-center', direction === 'col' && 'flex-col', direction === 'row' && 'flex-row', GAP_CLASS_MAP[size], className), style: style, children: [_jsx(EmptyBase.Image, { children: image ?? _jsx(DefaultEmptyImage, { width: IMAGE_WIDTH_MAP[size] }) }), _jsx(EmptyBase.Description, { description: description, className: cn('text-neutral500', DESCRIPTION_CLASS_MAP[size]) })] }));
+};
+export default LDEmpty;

package/dist/components/LDFileUpload/FileUploadBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploadBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/FileUploadBase.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,QAAQ,EACR,KAAK,SAAS,EACd,cAAc,EAIf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAmB,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAiB,EAAE,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAEpE,OAAO,EAIL,KAAK,EAKN,MAAM,kBAAkB,CAAC;AAI1B,MAAM,WAAW,qBAAqB;IACpC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,UAAU,qBAAqB;IAC7B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,QAAQ,EAAE,KAAK,EAAE,CAAC;IAClB,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAC/C,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,qBAAqB,CAAC;CACpC;AAID,eAAO,MAAM,oBAAoB,6BAUhC,CAAC;AAEF,UAAU,SAAS;IACjB,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;IACvB,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;IACpD,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAqCD,UAAU,UAAW,SAAQ,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAChE,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA8HD,UAAU,cAAc;IACtB,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiQD,eAAO,MAAM,cAAc;wKA3ZxB,SAAS;uCA+BT,UAAU;sBA6HY,cAAc;yBAgOX;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE;CAoCjD,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"FileUploadBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/FileUploadBase.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,QAAQ,EACR,KAAK,SAAS,EACd,cAAc,EAIf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAmB,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAiB,EAAE,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAEpE,OAAO,EAIL,KAAK,EAKN,MAAM,kBAAkB,CAAC;AAI1B,MAAM,WAAW,qBAAqB;IACpC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,UAAU,qBAAqB;IAC7B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,QAAQ,EAAE,KAAK,EAAE,CAAC;IAClB,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAC/C,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,qBAAqB,CAAC;CACpC;AAID,eAAO,MAAM,oBAAoB,6BAUhC,CAAC;AAEF,UAAU,SAAS;IACjB,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;IACvB,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC;IACpD,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAqCD,UAAU,UAAW,SAAQ,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAChE,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA8HD,UAAU,cAAc;IACtB,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAyQD,eAAO,MAAM,cAAc;wKAnaxB,SAAS;uCA+BT,UAAU;sBA6HY,cAAc;yBAwOX;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE;CAoCjD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/LDFileUpload/FileUploadBase.js

@@ -87,9 +87,9 @@ const Input = ({ type = 'default', label = '파일 선택', ...props }) => {
     };
     const fileInput = (_jsx("input", { type: "file", multiple: maxFileCount > 1, onClick: (e) => (e.currentTarget.value = ''), onChange: (e) => handleFile(e), disabled: disabled, className: "sr-only" }));
     if (type === 'image') {
-        return (_jsxs("label", { className: cn('border-3 border-dotted rounded-xl border-neutral100 bg-neutral50 text-neutral500', 'size-21 flex justify-center items-center ld-transition', disabled
+        return (_jsxs("label", { className: cn('outline-3 -outline-offset-3 outline-dotted rounded-xl outline-neutral100 bg-neutral50 text-neutral500', 'size-21 flex justify-center items-center ld-transition', disabled
                 ? 'opacity-50 cursor-not-allowed'
-                : 'hover:bg-neutral-100 hover:border-neutral200 hover:cursor-pointer hover:text-neutral600', props.className, classNames?.input), children: [renderIcon(_jsx(Images, {}), 'size-6'), fileInput] }));
+                : 'hover:bg-neutral-100 hover:outline-neutral200 hover:cursor-pointer hover:text-neutral600', props.className, classNames?.input), children: [renderIcon(_jsx(Images, {}), 'size-6'), fileInput] }));
     }
     return (_jsxs(LDButton, { as: "label", ...props, className: cn(props.className, classNames?.input), disabled: disabled, children: [label, fileInput] }));
 };
@@ -150,7 +150,7 @@ const CardList = (props) => {
         }
     };
     if (props.type === 'image') {
-        const cards = fileList.map((file, idx) => (_jsxs("label", { className: cn('relative block size-21 overflow-hidden rounded-[21px]', disabled
+        const cards = fileList.map((file, idx) => (_jsxs("label", { className: cn('group relative block size-21 overflow-hidden rounded-[21px] outline-3 -outline-offset-3 outline-neutral200', disabled
                 ? 'cursor-not-allowed'
                 : readOnly
                     ? 'cursor-default'
@@ -166,15 +166,15 @@ const CardList = (props) => {
                     next[idx] = false;
                     return next;
                 });
-            }, children: [_jsx("img", { src: file?.src, alt: file?.fileName, className: "size-full object-cover" }), _jsx("input", { type: "file", onClick: (e) => (e.currentTarget.value = ''), onChange: (e) => handleFile(e, idx), disabled: locked, className: "sr-only" }), _jsx(LDButton, { onClick: async (e) => {
+            }, children: [_jsx("img", { src: file?.src, alt: file?.fileName, className: "size-full object-cover" }), _jsx("span", { className: cn('pointer-events-none absolute inset-0 opacity-0 ld-transition', !locked && 'bg-black/25 group-hover:opacity-100') }), _jsx("input", { type: "file", onClick: (e) => (e.currentTarget.value = ''), onChange: (e) => handleFile(e, idx), disabled: locked, className: "sr-only" }), _jsx(LDButton, { onClick: async (e) => {
                         e.preventDefault();
                         e.stopPropagation();
                         await handleDeleteFile(idx);
                     }, disabled: locked, variant: "ghost", leftIcon: _jsx(Trash2, {}), color: "neutral", className: cn('text-neutral700 absolute top-2 right-2 rounded-sm bg-neutral-100 px-0 flex justify-center items-center min-w-0 h-5 w-5 ld-transition', hoveredList[idx] && !locked ? 'opacity-100' : 'opacity-0') })] }, `${file.fileName}_${idx}`)));
         if (fileList.length <= 1) {
-            return (_jsx("div", { className: cn('flex flex-row gap-sm', props.className), children: cards }));
+            return (_jsx("div", { className: cn('flex flex-row gap-sm w-full h-full', props.className), children: cards }));
         }
-        return (_jsx(LDCarousel, { className: cn(props.className, classNames?.cardList), slideSize: "auto", gap: 8, showArrows: false, showDots: false, slides: cards }));
+        return (_jsx(LDCarousel, { className: cn(props.className, classNames?.cardList), slidesPerView: "auto", gap: 8, arrowPosition: "none", showDots: false, slides: cards }));
     }
     return (_jsx("div", { className: cn('flex flex-col gap-sm w-full', classNames?.cardList), children: fileList.map((file, idx) => (_jsxs("label", { className: cn('w-full flex flex-row justify-between items-center px-4 py-3 bg-neutral50 rounded-lg', disabled
                 ? 'cursor-not-allowed'

package/dist/components/LDFileUpload/LDFileUpload.d.ts

@@ -1,5 +1,6 @@
 import { TMimeType } from '../../constants/file.js';
 import { IFile } from '../../utils/file.js';
+import { Dispatch, SetStateAction } from 'react';
 interface ILDFileUploadProps {
     recommendedSize?: {
         width: number;
@@ -12,6 +13,8 @@ interface ILDFileUploadProps {
     isExistDescription?: boolean;
     disabled?: boolean;
     readOnly?: boolean;
+    fileList: IFile[];
+    setFileList: Dispatch<SetStateAction<IFile[]>>;
 }
 declare const LDFileUpload: (props: ILDFileUploadProps) => import("react/jsx-runtime").JSX.Element;
 export default LDFileUpload;

package/dist/components/LDFileUpload/LDFileUpload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDFileUpload.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/LDFileUpload.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAGzC,UAAU,kBAAkB;IAC1B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,YAAY,GAAI,OAAO,kBAAkB,4CA2B9C,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"LDFileUpload.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/LDFileUpload.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEjD,UAAU,kBAAkB;IAC1B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,KAAK,EAAE,CAAC;IAClB,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;CAChD;AAED,QAAA,MAAM,YAAY,GAAI,OAAO,kBAAkB,4CAyB9C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/LDFileUpload/LDFileUpload.js

@@ -1,10 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import FileUploadBase from '../../components/LDFileUpload/FileUploadBase.js';
-import { useState } from 'react';
 const LDFileUpload = (props) => {
-    const [fileList, setFileList] = useState([]);
-    return (_jsxs(FileUploadBase.Root, { fileList: fileList, setFileList: setFileList, maxSize: props.maxSize, allowedExtensions: props.allowedExtensions, recommendedSize: props.recommendedSize ?? { width: 1200, height: 800 }, maxFileCount: 1, onChangeFile: props.onChangeFile, onDeleteFile: props.onDeleteFile, classNames: {
+    return (_jsxs(FileUploadBase.Root, { fileList: props.fileList, setFileList: props.setFileList, maxSize: props.maxSize, allowedExtensions: props.allowedExtensions, recommendedSize: props.recommendedSize ?? { width: 1200, height: 800 }, maxFileCount: 1, onChangeFile: props.onChangeFile, onDeleteFile: props.onDeleteFile, classNames: {
             root: 'flex flex-col gap-sm ld-transition',
-        }, disabled: props.disabled, readOnly: props.readOnly, children: [fileList[0]?.src ? (_jsx(FileUploadBase.CardList, {})) : (_jsx(FileUploadBase.Input, { className: "w-fit" })), props.isExistDescription && _jsx(FileUploadBase.Description, {})] }));
+        }, disabled: props.disabled, readOnly: props.readOnly, children: [props.fileList[0]?.src ? (_jsx(FileUploadBase.CardList, {})) : (_jsx(FileUploadBase.Input, { className: "w-fit" })), props.isExistDescription && _jsx(FileUploadBase.Description, {})] }));
 };
 export default LDFileUpload;

package/dist/components/LDFileUpload/LDFileUploadList.d.ts

@@ -1,5 +1,6 @@
 import { TMimeType } from '../../constants/file.js';
 import { IFile } from '../../utils/file.js';
+import { Dispatch, SetStateAction } from 'react';
 interface ILDFileUploadListProps {
     recommendedSize?: {
         width: number;
@@ -13,6 +14,8 @@ interface ILDFileUploadListProps {
     isExistDescription?: boolean;
     disabled?: boolean;
     readOnly?: boolean;
+    fileList: IFile[];
+    setFileList: Dispatch<SetStateAction<IFile[]>>;
 }
 declare const LDFileUploadList: (props: ILDFileUploadListProps) => import("react/jsx-runtime").JSX.Element;
 export default LDFileUploadList;

package/dist/components/LDFileUpload/LDFileUploadList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDFileUploadList.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/LDFileUploadList.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAGzC,UAAU,sBAAsB;IAC9B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,gBAAgB,GAAI,OAAO,sBAAsB,4CA0BtD,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"LDFileUploadList.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/LDFileUploadList.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAE3D,UAAU,sBAAsB;IAC9B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,KAAK,EAAE,CAAC;IAClB,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;CAChD;AAED,QAAA,MAAM,gBAAgB,GAAI,OAAO,sBAAsB,4CAwBtD,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/LDFileUpload/LDFileUploadList.js

@@ -1,8 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import FileUploadBase from '../../components/LDFileUpload/FileUploadBase.js';
-import { useState } from 'react';
 const LDFileUploadList = (props) => {
-    const [fileList, setFileList] = useState([]);
-    return (_jsxs(FileUploadBase.Root, { fileList: fileList, setFileList: setFileList, maxSize: props.maxSize, allowedExtensions: props.allowedExtensions, recommendedSize: props.recommendedSize ?? { width: 1200, height: 800 }, maxFileCount: props.maxFileCount, onChangeFile: props.onChangeFile, onDeleteFile: props.onDeleteFile, classNames: { root: 'flex flex-col gap-sm ld-transition' }, disabled: props.disabled, readOnly: props.readOnly, children: [fileList.length < props.maxFileCount && !props.disabled && (_jsx(FileUploadBase.Input, { className: "w-fit" })), props.isExistDescription && _jsx(FileUploadBase.Description, {}), _jsx("div", { className: "flex flex-row gap-sm", children: fileList.length > 0 && _jsx(FileUploadBase.CardList, {}) })] }));
+    return (_jsxs(FileUploadBase.Root, { fileList: props.fileList, setFileList: props.setFileList, maxSize: props.maxSize, allowedExtensions: props.allowedExtensions, recommendedSize: props.recommendedSize ?? { width: 1200, height: 800 }, maxFileCount: props.maxFileCount, onChangeFile: props.onChangeFile, onDeleteFile: props.onDeleteFile, classNames: { root: 'flex flex-col gap-sm ld-transition' }, disabled: props.disabled, readOnly: props.readOnly, children: [props.fileList.length < props.maxFileCount && !props.disabled && (_jsx(FileUploadBase.Input, { className: "w-fit" })), props.isExistDescription && _jsx(FileUploadBase.Description, {}), _jsx("div", { className: "flex flex-row gap-sm", children: props.fileList.length > 0 && _jsx(FileUploadBase.CardList, {}) })] }));
 };
 export default LDFileUploadList;

package/dist/components/LDFileUpload/LDImageUpload.d.ts

@@ -1,6 +1,7 @@
 import { IFileUploadClassNames } from '../../components/LDFileUpload/FileUploadBase.js';
 import { TMimeType } from '../../constants/file.js';
 import { IFile } from '../../utils/file.js';
+import { Dispatch, SetStateAction } from 'react';
 interface ILDImageUploadProps {
     recommendedSize?: {
         width: number;
@@ -14,6 +15,8 @@ interface ILDImageUploadProps {
     disabled?: boolean;
     readOnly?: boolean;
     classNames?: IFileUploadClassNames;
+    fileList: IFile[];
+    setFileList: Dispatch<SetStateAction<IFile[]>>;
 }
 declare const LDImageUpload: (props: ILDImageUploadProps) => import("react/jsx-runtime").JSX.Element;
 export default LDImageUpload;

package/dist/components/LDFileUpload/LDImageUpload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDImageUpload.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/LDImageUpload.tsx"],"names":[],"mappings":"AAAA,OAAuB,EACrB,qBAAqB,EACtB,MAAM,8CAA8C,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAIzC,UAAU,mBAAmB;IAC3B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,qBAAqB,CAAC;CACpC;AAED,QAAA,MAAM,aAAa,GAAI,OAAO,mBAAmB,4CA4BhD,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"LDImageUpload.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/LDImageUpload.tsx"],"names":[],"mappings":"AAAA,OAAuB,EACrB,qBAAqB,EACtB,MAAM,8CAA8C,CAAC;AACtD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAG3D,UAAU,mBAAmB;IAC3B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,QAAQ,EAAE,KAAK,EAAE,CAAC;IAClB,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;CAChD;AAED,QAAA,MAAM,aAAa,GAAI,OAAO,mBAAmB,4CA0BhD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/LDFileUpload/LDImageUpload.js

@@ -1,12 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import FileUploadBase from '../../components/LDFileUpload/FileUploadBase.js';
-import { useState } from 'react';
 import cn from '../../utils/cn.js';
 const LDImageUpload = (props) => {
-    const [fileList, setFileList] = useState([]);
-    return (_jsxs(FileUploadBase.Root, { fileList: fileList, setFileList: setFileList, maxSize: props.maxSize, allowedExtensions: props.allowedExtensions, recommendedSize: props.recommendedSize ?? { width: 1200, height: 800 }, maxFileCount: 1, onChangeFile: props.onChangeFile, onDeleteFile: props.onDeleteFile, classNames: {
+    return (_jsxs(FileUploadBase.Root, { fileList: props.fileList, setFileList: props.setFileList, maxSize: props.maxSize, allowedExtensions: props.allowedExtensions, recommendedSize: props.recommendedSize ?? { width: 1200, height: 800 }, maxFileCount: 1, onChangeFile: props.onChangeFile, onDeleteFile: props.onDeleteFile, classNames: {
             ...props.classNames,
             root: cn('flex flex-col gap-sm ld-transition', props.classNames?.root),
-        }, disabled: props.disabled, readOnly: props.readOnly, children: [fileList[0]?.src ? (_jsx(FileUploadBase.CardList, { type: "image" })) : (_jsx(FileUploadBase.Input, { type: "image" })), props.isExistDescription && _jsx(FileUploadBase.Description, {})] }));
+        }, disabled: props.disabled, readOnly: props.readOnly, children: [props.fileList[0]?.src ? (_jsx(FileUploadBase.CardList, { type: "image" })) : (_jsx(FileUploadBase.Input, { type: "image" })), props.isExistDescription && _jsx(FileUploadBase.Description, {})] }));
 };
 export default LDImageUpload;

package/dist/components/LDFileUpload/LDImageUploadList.d.ts

@@ -1,5 +1,6 @@
 import { TMimeType } from '../../constants/file.js';
 import { IFile } from '../../utils/file.js';
+import { Dispatch, SetStateAction } from 'react';
 interface ILDImageUploadListProps {
     recommendedSize?: {
         width: number;
@@ -13,6 +14,8 @@ interface ILDImageUploadListProps {
     isExistDescription?: boolean;
     disabled?: boolean;
     readOnly?: boolean;
+    fileList: IFile[];
+    setFileList: Dispatch<SetStateAction<IFile[]>>;
 }
 declare const LDImageUploadList: (props: ILDImageUploadListProps) => import("react/jsx-runtime").JSX.Element;
 export default LDImageUploadList;

package/dist/components/LDFileUpload/LDImageUploadList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDImageUploadList.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/LDImageUploadList.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAGzC,UAAU,uBAAuB;IAC/B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,QAAA,MAAM,iBAAiB,GAAI,OAAO,uBAAuB,4CA0BxD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"LDImageUploadList.d.ts","sourceRoot":"","sources":["../../../src/components/LDFileUpload/LDImageUploadList.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAE3D,UAAU,uBAAuB;IAC/B,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,EAAE,SAAS,EAAE,CAAC;IAC/B,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvD,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;IAChD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,KAAK,EAAE,CAAC;IAClB,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;CAChD;AAED,QAAA,MAAM,iBAAiB,GAAI,OAAO,uBAAuB,4CAwBxD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/LDFileUpload/LDImageUploadList.js

@@ -1,8 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import FileUploadBase from '../../components/LDFileUpload/FileUploadBase.js';
-import { useState } from 'react';
 const LDImageUploadList = (props) => {
-    const [fileList, setFileList] = useState([]);
-    return (_jsxs(FileUploadBase.Root, { fileList: fileList, setFileList: setFileList, maxSize: props.maxSize, allowedExtensions: props.allowedExtensions, recommendedSize: props.recommendedSize ?? { width: 1200, height: 800 }, maxFileCount: props.maxFileCount, onChangeFile: props.onChangeFile, onDeleteFile: props.onDeleteFile, classNames: { root: 'flex flex-col gap-sm ld-transition' }, disabled: props.disabled, readOnly: props.readOnly, children: [_jsxs("div", { className: "flex flex-row gap-sm", children: [fileList.length > 0 && _jsx(FileUploadBase.CardList, { type: "image" }), fileList.length < props.maxFileCount && !props.disabled && (_jsx(FileUploadBase.Input, { type: "image" }))] }), props.isExistDescription && _jsx(FileUploadBase.Description, {})] }));
+    return (_jsxs(FileUploadBase.Root, { fileList: props.fileList, setFileList: props.setFileList, maxSize: props.maxSize, allowedExtensions: props.allowedExtensions, recommendedSize: props.recommendedSize ?? { width: 1200, height: 800 }, maxFileCount: props.maxFileCount, onChangeFile: props.onChangeFile, onDeleteFile: props.onDeleteFile, classNames: { root: 'flex flex-col gap-sm ld-transition' }, disabled: props.disabled, readOnly: props.readOnly, children: [_jsxs("div", { className: "flex flex-row gap-sm w-full h-full", children: [props.fileList.length > 0 && _jsx(FileUploadBase.CardList, { type: "image" }), props.fileList.length < props.maxFileCount && !props.disabled && (_jsx(FileUploadBase.Input, { type: "image" }))] }), props.isExistDescription && _jsx(FileUploadBase.Description, {})] }));
 };
 export default LDImageUploadList;

package/dist/components/LDInput/InputBase.d.ts

@@ -4,19 +4,21 @@ interface RootProps {
     className?: string;
     style?: React.CSSProperties;
     children?: ReactNode;
+    ref?: Ref<HTMLDivElement>;
 }
 interface FieldProps extends InputHTMLAttributes<HTMLInputElement> {
     ref?: Ref<HTMLInputElement>;
 }
 interface AddonProps {
-    position?: 'left' | 'right';
     className?: string;
+    style?: React.CSSProperties;
     children?: ReactNode;
+    ref?: Ref<HTMLSpanElement>;
 }
 export declare const InputBase: {
-    Root: ({ block, className, style, children }: RootProps) => import("react/jsx-runtime").JSX.Element;
+    Root: ({ block, className, style, children, ref, }: RootProps) => import("react/jsx-runtime").JSX.Element;
     Field: ({ ref, ...props }: FieldProps) => import("react/jsx-runtime").JSX.Element;
-    Addon: ({ position, className, children }: AddonProps) => import("react/jsx-runtime").JSX.Element;
+    Addon: ({ className, style, children, ref }: AddonProps) => import("react/jsx-runtime").JSX.Element;
 };
 export default InputBase;
 //# sourceMappingURL=InputBase.d.ts.map

package/dist/components/LDInput/InputBase.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDInput/InputBase.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,mBAAmB,EAAE,KAAK,SAAS,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAI3E,UAAU,SAAS;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAcD,UAAU,UAAW,SAAQ,mBAAmB,CAAC,gBAAgB,CAAC;IAChE,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAOD,UAAU,UAAU;IAClB,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAgBD,eAAO,MAAM,SAAS;kDAzCuC,SAAS;+BAgBpC,UAAU;+CAWgB,UAAU;CAkBrE,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"InputBase.d.ts","sourceRoot":"","sources":["../../../src/components/LDInput/InputBase.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,mBAAmB,EAAE,KAAK,SAAS,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAI3E,UAAU,SAAS;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAyBD,UAAU,UAAW,SAAQ,mBAAmB,CAAC,gBAAgB,CAAC;IAChE,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAOD,UAAU,UAAU;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,GAAG,CAAC,EAAE,GAAG,CAAC,eAAe,CAAC,CAAC;CAC5B;AAcD,eAAO,MAAM,SAAS;wDA7CnB,SAAS;+BAqBsB,UAAU;iDAYQ,UAAU;CAgB7D,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/components/LDInput/InputBase.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import cn from '../../utils/cn.js';
-const Root = ({ block = false, className, style, children }) => {
-    return (_jsx("div", { style: style, className: cn('relative flex group', block && 'w-full', className), children: children }));
+const Root = ({ block = false, className, style, children, ref, }) => {
+    return (_jsx("div", { ref: ref, style: style, className: cn('relative flex items-center group', block && 'w-full', className), children: children }));
 };
 const Field = ({ ref, ...props }) => {
     return _jsx("input", { ref: ref, ...props });
 };
-const Addon = ({ position = 'right', className, children }) => {
-    return (_jsx("span", { className: cn('absolute top-1/2 -translate-y-1/2 flex items-center', position === 'left' ? 'left-0' : 'right-0', className), children: children }));
+const Addon = ({ className, style, children, ref }) => {
+    return (_jsx("span", { ref: ref, style: style, className: cn('flex items-center', className), children: children }));
 };
 export const InputBase = {
     Root,

package/dist/components/LDInput/LDFormInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDFormInput.d.ts","sourceRoot":"","sources":["../../../src/components/LDInput/LDFormInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAML,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAgB,EACd,KAAK,YAAY,EAGlB,MAAM,WAAW,CAAC;AAQnB,UAAU,gBAAiB,SAAQ,IAAI,CACrC,YAAY,EACZ,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,QAAQ,CACzC;IACC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAYD,QAAA,MAAM,WAAW,GAAI,sJAclB,gBAAgB,4CAiGlB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"LDFormInput.d.ts","sourceRoot":"","sources":["../../../src/components/LDInput/LDFormInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAU,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAgB,EACd,KAAK,YAAY,EAGlB,MAAM,WAAW,CAAC;AAQnB,UAAU,gBAAiB,SAAQ,IAAI,CACrC,YAAY,EACZ,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,QAAQ,CACzC;IACC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,WAAW,GAAI,sJAclB,gBAAgB,4CA+ElB,CAAC;AAEF,eAAe,WAAW,CAAC"}