@loword/loword-design-system 0.4.1 → 0.5.0

package/dist/components/LDDatePicker/LDDatePicker.js

@@ -16,7 +16,7 @@ const variantColorClasses = {
     filled: {
         neutral: 'bg-neutral50 text-neutral900 border-none outline-2 outline-transparent outline-solid -outline-offset-2 focus-within:bg-tintBlue focus-within:outline-lb500',
         point: 'bg-tintBlue text-neutral900 border-none outline-2 outline-transparent outline-solid -outline-offset-2 focus-within:outline-lb500',
-        danger: 'bg-tintRed text-neutral900 border-none outline-2 outline-transparent outline-solid -outline-offset-2 focus-within:outline-danger600',
+        danger: 'bg-tintRed text-neutral900 border-none outline-2 outline-danger600 outline-solid -outline-offset-2',
     },
     outline: {
         neutral: 'bg-transparent text-neutral900 border-none outline-2 outline-neutral100 outline-solid -outline-offset-2 focus-within:outline-lb500',

package/dist/components/LDDateRangePicker/LDDateRangePicker.js

@@ -23,7 +23,7 @@ const variantColorClasses = {
     filled: {
         neutral: 'bg-neutral50 text-neutral900 border-none outline-2 outline-transparent outline-solid -outline-offset-2 focus-within:bg-tintBlue focus-within:outline-lb500',
         point: 'bg-tintBlue text-neutral900 border-none outline-2 outline-transparent outline-solid -outline-offset-2 focus-within:outline-lb500',
-        danger: 'bg-tintRed text-neutral900 border-none outline-2 outline-transparent outline-solid -outline-offset-2 focus-within:outline-danger600',
+        danger: 'bg-tintRed text-neutral900 border-none outline-2 outline-danger600 outline-solid -outline-offset-2',
     },
     outline: {
         neutral: 'bg-transparent text-neutral900 border-none outline-2 outline-neutral100 outline-solid -outline-offset-2 focus-within:outline-lb500',

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

@@ -1 +1 @@
-{"version":3,"file":"LDEditor.d.ts","sourceRoot":"","sources":["../../../src/components/LDEditor/LDEditor.tsx"],"names":[],"mappings":"AA4EA,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE;QAC7B,UAAU,EAAE,MAAM,CAAC;QACnB,QAAQ,EAAE,MAAM,CAAC;KAClB,KAAK,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;CAC9B;AAED,QAAA,MAAM,QAAQ,GAAI,sDAKf,aAAa,4CAYf,CAAC;AAyjBF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"LDEditor.d.ts","sourceRoot":"","sources":["../../../src/components/LDEditor/LDEditor.tsx"],"names":[],"mappings":"AA8IA,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE;QAC7B,UAAU,EAAE,MAAM,CAAC;QACnB,QAAQ,EAAE,MAAM,CAAC;KAClB,KAAK,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;CAC9B;AAED,QAAA,MAAM,QAAQ,GAAI,sDAKf,aAAa,4CAYf,CAAC;AAwmBF,eAAe,QAAQ,CAAC"}

package/dist/components/LDEditor/LDEditor.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEditorState } from '@tiptap/react';
 import { BubbleMenu } from '@tiptap/react/menus';
-import { AlignCenter, AlignJustify, AlignLeft, AlignRight, Bold, ChevronDown, Image as ImageIcon, Italic, Link2, List, ListOrdered, Redo, Strikethrough, Underline, Undo, Unlink, } from 'lucide-react';
+import { AlignCenter, AlignJustify, AlignLeft, AlignRight, Bold, ChevronDown, Image as ImageIcon, Italic, Link2, List, ListOrdered, Redo, Strikethrough, Table as TableIcon, Underline, Undo, Unlink, } from 'lucide-react';
 import { useEffect, useState } from 'react';
 import EditorBase, { useEditorContext } from '../../components/LDEditor/EditorBase.js';
 import { createEditorExtensions } from '../../components/LDEditor/extensions.js';
@@ -35,6 +35,40 @@ const HEADINGS = [
     { label: '제목 2', level: 2 },
     { label: '제목 3', level: 3 },
 ];
+const TABLE_GRID_MAX = 5;
+const TABLE_ACTIONS = [
+    { label: '위에 행 추가', run: (e) => e.chain().focus().addRowBefore().run() },
+    { label: '아래 행 추가', run: (e) => e.chain().focus().addRowAfter().run() },
+    {
+        label: '왼쪽 열 추가',
+        run: (e) => e.chain().focus().addColumnBefore().run(),
+    },
+    {
+        label: '오른쪽 열 추가',
+        run: (e) => e.chain().focus().addColumnAfter().run(),
+    },
+    { label: '행 삭제', run: (e) => e.chain().focus().deleteRow().run() },
+    { label: '열 삭제', run: (e) => e.chain().focus().deleteColumn().run() },
+    {
+        label: '헤더 행 토글',
+        run: (e) => e.chain().focus().toggleHeaderRow().run(),
+    },
+    { label: '표 삭제', run: (e) => e.chain().focus().deleteTable().run() },
+];
+// 삽입할 표 크기를 호버(키보드는 포커스)로 고르는 5x5 그리드.
+// Dropdown의 children은 렌더 콜백이라 훅을 쓸 수 없어 별도 컴포넌트로 뺀다.
+const TableGridPicker = ({ onSelect, }) => {
+    const [size, setSize] = useState({ rows: 0, cols: 0 });
+    return (_jsxs("div", { className: "p-2", children: [_jsx("div", { className: "grid grid-cols-5 gap-1", children: Array.from({ length: TABLE_GRID_MAX * TABLE_GRID_MAX }, (_, index) => {
+                    const rows = Math.floor(index / TABLE_GRID_MAX) + 1;
+                    const cols = (index % TABLE_GRID_MAX) + 1;
+                    const filled = rows <= size.rows && cols <= size.cols;
+                    return (_jsx("button", { type: "button", "aria-label": `${rows}행 ${cols}열 표 삽입`, onMouseEnter: () => setSize({ rows, cols }), onFocus: () => setSize({ rows, cols }), onClick: (event) => {
+                            event.preventDefault();
+                            onSelect(rows, cols);
+                        }, className: cn('size-5 cursor-pointer rounded-xs border border-neutral200', filled && 'border-blue-500 bg-blue-100') }, index));
+                }) }), _jsx("p", { className: "mt-2 text-center text-sm", children: size.rows ? `${size.rows} x ${size.cols}` : '크기 선택' })] }));
+};
 const iconBtn = 'p-1 rounded-lg cursor-pointer transition hover:bg-mono100 disabled:opacity-30 disabled:cursor-not-allowed';
 const activeBtn = 'bg-mono100';
 const LDDivider = () => _jsx("div", { className: "mx-1 h-6 w-px bg-neutral200" });
@@ -77,6 +111,7 @@ const EditorToolbar = ({ handleImageUpload, }) => {
                 canUndo: editor.can().undo(),
                 canRedo: editor.can().redo(),
                 isLink: editor.isActive('link'),
+                isTable: editor.isActive('table'),
                 hasSelection: !editor.state.selection.empty,
             };
         },
@@ -175,7 +210,18 @@ const EditorToolbar = ({ handleImageUpload, }) => {
                                                             setLinkUrl('');
                                                             close();
                                                         }, className: "rounded-lg border border-neutral200 px-3 py-1.5 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, "aria-label": "\uB9C1\uD06C \uD574\uC81C", children: _jsx(Unlink, { className: "size-5" }) })] })), _jsx(LDDivider, {}), _jsxs("label", { className: cn(iconBtn, 'relative'), children: [_jsx(ImageIcon, { className: "size-5" }), _jsx("input", { type: "file", accept: "image/*", "aria-label": "\uC774\uBBF8\uC9C0 \uC5C5\uB85C\uB4DC", className: "absolute inset-0 size-full cursor-pointer opacity-0", onChange: (e) => {
+                                } }), _jsx(EditorBase.Toolbar.LDButton, { disabled: !state.isLink, onClick: () => editor.chain().focus().unsetLink().run(), className: iconBtn, "aria-label": "\uB9C1\uD06C \uD574\uC81C", children: _jsx(Unlink, { className: "size-5" }) })] })), _jsx(LDDivider, {}), _jsx(EditorBase.Toolbar.Dropdown, { className: "min-w-40 rounded-lg border border-neutral200 bg-white shadow-lg", trigger: ({ toggle }) => (_jsx(EditorBase.Toolbar.LDButton, { "aria-label": "\uD45C", onClick: toggle, className: cn(iconBtn, state.isTable && activeBtn), children: _jsx(TableIcon, { className: "size-5" }) })), children: ({ close }) => state.isTable ? (_jsx("div", { children: TABLE_ACTIONS.map(({ label, run }) => (_jsx("button", { type: "button", onClick: (e) => {
+                                    e.preventDefault();
+                                    run(editor);
+                                    close();
+                                }, className: "w-full cursor-pointer px-3 py-2 text-left text-sm first:rounded-t-lg last:rounded-b-lg hover:bg-mono100", children: label }, label))) })) : (_jsx(TableGridPicker, { onSelect: (rows, cols) => {
+                                editor
+                                    .chain()
+                                    .focus()
+                                    .insertTable({ rows, cols, withHeaderRow: true })
+                                    .run();
+                                close();
+                            } })) }), _jsxs("label", { className: cn(iconBtn, 'relative'), children: [_jsx(ImageIcon, { className: "size-5" }), _jsx("input", { type: "file", accept: "image/*", "aria-label": "\uC774\uBBF8\uC9C0 \uC5C5\uB85C\uB4DC", className: "absolute inset-0 size-full cursor-pointer opacity-0", 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), "aria-label": "\uAD75\uAC8C", children: _jsx(Bold, { className: "size-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleItalic().run(), className: cn(iconBtn, state.isItalic && activeBtn), "aria-label": "\uAE30\uC6B8\uC784", children: _jsx(Italic, { className: "size-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleUnderline().run(), className: cn(iconBtn, state.isUnderline && activeBtn), "aria-label": "\uBC11\uC904", children: _jsx(Underline, { className: "size-5" }) }), _jsx(EditorBase.Toolbar.LDButton, { onClick: () => editor.chain().focus().toggleStrike().run(), className: cn(iconBtn, state.isStrike && activeBtn), "aria-label": "\uCDE8\uC18C\uC120", children: _jsx(Strikethrough, { className: "size-5" }) }), _jsx(EditorBase.Toolbar.Dropdown, { className: "min-w-35 rounded-lg border border-neutral200 bg-white shadow-lg", trigger: ({ toggle }) => (_jsxs(EditorBase.Toolbar.LDButton, { onClick: toggle, className: cn(iconBtn, 'flex items-center gap-1 px-2'), "aria-label": "\uAE00\uC790 \uC0C9", children: [_jsx("span", { className: "size-4 rounded-full", style: { backgroundColor: state.color } }), _jsx(ChevronDown, { className: "size-4" })] })), children: ({ close }) => COLORS.map((color) => (_jsxs("button", { type: "button", onClick: (e) => {

package/dist/components/LDEditor/LDViewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDViewer.d.ts","sourceRoot":"","sources":["../../../src/components/LDEditor/LDViewer.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,QAAQ,GAAI,wBAAwB,aAAa,4CAQtD,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"LDViewer.d.ts","sourceRoot":"","sources":["../../../src/components/LDEditor/LDViewer.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,QAAQ,GAAI,wBAAwB,aAAa,4CAWtD,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/components/LDEditor/LDViewer.js

@@ -4,6 +4,9 @@ import EditorBase from '../../components/LDEditor/EditorBase.js';
 import { createEditorExtensions } from '../../components/LDEditor/extensions.js';
 import cn from '../../utils/cn.js';
 const LDViewer = ({ content, className }) => {
-    return (_jsx(EditorBase.LDViewer, { extensions: createEditorExtensions({ resizableImage: false }), content: content, className: cn('prose prose-lg w-full max-w-none', className) }));
+    return (_jsx(EditorBase.LDViewer, { extensions: createEditorExtensions({
+            resizableImage: false,
+            resizableTable: false,
+        }), content: content, className: cn('prose prose-lg w-full max-w-none', className) }));
 };
 export default LDViewer;

package/dist/components/LDEditor/extensions.d.ts

@@ -1,6 +1,7 @@
 import type { Extensions } from '@tiptap/react';
 export interface EditorExtensionOptions {
     resizableImage?: boolean;
+    resizableTable?: boolean;
 }
-export declare const createEditorExtensions: ({ resizableImage, }?: EditorExtensionOptions) => Extensions;
+export declare const createEditorExtensions: ({ resizableImage, resizableTable, }?: EditorExtensionOptions) => Extensions;
 //# sourceMappingURL=extensions.d.ts.map

package/dist/components/LDEditor/extensions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"extensions.d.ts","sourceRoot":"","sources":["../../../src/components/LDEditor/extensions.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAGhD,MAAM,WAAW,sBAAsB;IACrC,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,eAAO,MAAM,sBAAsB,GAAI,sBAEpC,sBAA2B,KAAG,UA+BhC,CAAC"}
+{"version":3,"file":"extensions.d.ts","sourceRoot":"","sources":["../../../src/components/LDEditor/extensions.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAGhD,MAAM,WAAW,sBAAsB;IACrC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,eAAO,MAAM,sBAAsB,GAAI,sCAGpC,sBAA2B,KAAG,UAwChC,CAAC"}

package/dist/components/LDEditor/extensions.js

@@ -1,8 +1,9 @@
 import Image from '@tiptap/extension-image';
+import { TableKit } from '@tiptap/extension-table';
 import TextAlign from '@tiptap/extension-text-align';
 import { Color, FontSize, TextStyle } from '@tiptap/extension-text-style';
 import StarterKit from '@tiptap/starter-kit';
-export const createEditorExtensions = ({ resizableImage = true, } = {}) => [
+export const createEditorExtensions = ({ resizableImage = true, resizableTable = true, } = {}) => [
     // link·underline은 StarterKit에 포함돼 있다. 따로 등록하면 중복 경고가 난다.
     StarterKit.configure({
         heading: {
@@ -33,4 +34,13 @@ export const createEditorExtensions = ({ resizableImage = true, } = {}) => [
             }
             : false,
     }),
+    TableKit.configure({
+        table: {
+            resizable: resizableTable,
+            // 리사이즈로 표가 컨테이너보다 넓어질 수 있다. 래퍼가 있어야 가로 스크롤을
+            // 표에만 줄 수 있다. 편집 모드에서는 TableView가 항상 래퍼를 만들지만
+            // 읽기 전용(LDViewer)에서는 이 옵션이 있어야 생긴다.
+            renderWrapper: true,
+        },
+    }),
 ];

package/dist/components/LDModal/LDModal.d.ts

@@ -22,6 +22,8 @@ export interface LDModalOptions<T = undefined> {
     icon?: 'success' | 'fail';
     /** 스크롤 동작 (LDModalView와 동일) */
     scrollBehavior?: 'inside' | 'outside';
+    /** 오버레이(모달 바깥) 클릭으로 닫기 허용 여부 */
+    closeOnOverlayClick?: boolean;
     /** 모달 패널에 적용할 추가 CSS 클래스 */
     className?: string;
     /** 모달 패널 인라인 스타일 (자유 width/height 등) */

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

@@ -1 +1 @@
-{"version":3,"file":"LDModal.d.ts","sourceRoot":"","sources":["../../../src/components/LDModal/LDModal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAoB,MAAM,OAAO,CAAC;AAG7E,OAAoB,EAElB,KAAK,SAAS,EACd,gBAAgB,EACjB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAE7C,MAAM,WAAW,cAAc,CAAC,CAAC,GAAG,SAAS;IAC3C,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,IAAI,CAAA;KAAE,KAAK,SAAS,CAAC,CAAC;IAC9E,OAAO,CAAC,EAAE;QACR,KAAK,EAAE,CAAC,CAAC;QACT,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,CAAC,EAAE,MAAM,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;QACzD,KAAK,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;QACvC,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,GAAG,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,CAAC;KAC1D,EAAE,CAAC;IACJ,eAAe;IACf,gBAAgB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IACpC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC1B,+BAA+B;IAC/B,cAAc,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACtC,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;IACjD,UAAU,CAAC,EAAE,gBAAgB,CAAC;CAC/B;AAED,QAAA,MAAM,OAAO,GAAI,CAAC,GAAG,SAAS,EAC5B,SAAS,cAAc,CAAC,CAAC,CAAC,KACzB,OAAO,CAAC,CAAC,GAAG,SAAS,CA2EvB,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"LDModal.d.ts","sourceRoot":"","sources":["../../../src/components/LDModal/LDModal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAoB,MAAM,OAAO,CAAC;AAG7E,OAAoB,EAElB,KAAK,SAAS,EACd,gBAAgB,EACjB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAE7C,MAAM,WAAW,cAAc,CAAC,CAAC,GAAG,SAAS;IAC3C,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,IAAI,CAAA;KAAE,KAAK,SAAS,CAAC,CAAC;IAC9E,OAAO,CAAC,EAAE;QACR,KAAK,EAAE,CAAC,CAAC;QACT,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,CAAC,EAAE,MAAM,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;QACzD,KAAK,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;QACvC,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,GAAG,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,CAAC;KAC1D,EAAE,CAAC;IACJ,eAAe;IACf,gBAAgB,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IACpC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC1B,+BAA+B;IAC/B,cAAc,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACtC,gCAAgC;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;IACjD,UAAU,CAAC,EAAE,gBAAgB,CAAC;CAC/B;AAED,QAAA,MAAM,OAAO,GAAI,CAAC,GAAG,SAAS,EAC5B,SAAS,cAAc,CAAC,CAAC,CAAC,KACzB,OAAO,CAAC,CAAC,GAAG,SAAS,CA4EvB,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/LDModal/LDModal.js

@@ -50,7 +50,7 @@ const LDModal = (options) => {
             return (_jsx(LDModalView, { open: open, onOpenChange: (next) => {
                     if (!next)
                         close(undefined);
-                }, name: options.name, title: options.title, description: options.description, size: options.size, icon: options.icon, scrollBehavior: options.scrollBehavior, style: options.style, buttons: list ? { direction: options.buttonsDirection, list } : undefined, classNames: options.classNames, children: content }));
+                }, name: options.name, title: options.title, description: options.description, size: options.size, icon: options.icon, scrollBehavior: options.scrollBehavior, closeOnOverlayClick: options.closeOnOverlayClick, style: options.style, buttons: list ? { direction: options.buttonsDirection, list } : undefined, classNames: options.classNames, children: content }));
         };
         root.render(_jsx(ModalHost, {}));
     });

package/dist/components/LDModal/LDModalView.d.ts

@@ -50,12 +50,14 @@ export interface LDModalViewProps {
     buttons?: ModalButtons;
     /** 스크롤 동작 */
     scrollBehavior?: 'inside' | 'outside';
+    /** 오버레이(모달 바깥) 클릭으로 닫기 허용 여부 */
+    closeOnOverlayClick?: boolean;
     /** 인라인 스타일 (모달 패널에 적용) */
     style?: React.CSSProperties;
     /** 버튼 클릭 시 해당 버튼의 value를 전달하는 콜백 */
     onButtonClick?: (value: unknown) => void;
     classNames?: TModalClassNames;
 }
-declare const LDModalView: ({ open, defaultOpen, onOpenChange, name, title, description, children, size, icon, buttons, scrollBehavior, classNames, style, onButtonClick, }: LDModalViewProps) => import("react/jsx-runtime").JSX.Element;
+declare const LDModalView: ({ open, defaultOpen, onOpenChange, name, title, description, children, size, icon, buttons, scrollBehavior, closeOnOverlayClick, classNames, style, onButtonClick, }: LDModalViewProps) => import("react/jsx-runtime").JSX.Element;
 export default LDModalView;
 //# sourceMappingURL=LDModalView.d.ts.map

package/dist/components/LDModal/LDModalView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LDModalView.d.ts","sourceRoot":"","sources":["../../../src/components/LDModal/LDModalView.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAU,MAAM,OAAO,CAAC;AAK/C,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAI7C,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC,CAAC;AAE9E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,YAAY;IAC3B,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC7B,IAAI,CAAC,EAAE,WAAW,EAAE,CAAC;CACtB;AAED,MAAM,WAAW,WAAW,CAAC,CAAC,GAAG,OAAO;IACtC,aAAa;IACb,KAAK,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,KAAK,EAAE,CAAC,CAAC;IACT,gBAAgB;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;IACzD,eAAe;IACf,KAAK,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;IACvC,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,GAAG,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,CAAC;CAC1D;AAED,MAAM,WAAW,gBAAgB;IAC/B,yBAAyB;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,0BAA0B;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yBAAyB;IACzB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,2BAA2B;IAC3B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,YAAY;IACZ,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gBAAgB;IAChB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,aAAa;IACb,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gBAAgB;IAChB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,2BAA2B;IAC3B,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC1B,eAAe;IACf,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,aAAa;IACb,cAAc,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACtC,0BAA0B;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,oCAAoC;IACpC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,UAAU,CAAC,EAAE,gBAAgB,CAAC;CAC/B;AA6CD,QAAA,MAAM,WAAW,GAAI,iJAelB,gBAAgB,4CAkLlB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"LDModalView.d.ts","sourceRoot":"","sources":["../../../src/components/LDModal/LDModalView.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAU,MAAM,OAAO,CAAC;AAK/C,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAI7C,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC,CAAC;AAE9E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,YAAY;IAC3B,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC7B,IAAI,CAAC,EAAE,WAAW,EAAE,CAAC;CACtB;AAED,MAAM,WAAW,WAAW,CAAC,CAAC,GAAG,OAAO;IACtC,aAAa;IACb,KAAK,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,KAAK,EAAE,CAAC,CAAC;IACT,gBAAgB;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;IACzD,eAAe;IACf,KAAK,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAC;IACvC,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,GAAG,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,CAAC;CAC1D;AAED,MAAM,WAAW,gBAAgB;IAC/B,yBAAyB;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,0BAA0B;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yBAAyB;IACzB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,2BAA2B;IAC3B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,YAAY;IACZ,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gBAAgB;IAChB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,aAAa;IACb,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gBAAgB;IAChB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,2BAA2B;IAC3B,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC1B,eAAe;IACf,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,aAAa;IACb,cAAc,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IACtC,gCAAgC;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,0BAA0B;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,oCAAoC;IACpC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,UAAU,CAAC,EAAE,gBAAgB,CAAC;CAC/B;AA6CD,QAAA,MAAM,WAAW,GAAI,sKAgBlB,gBAAgB,4CAsLlB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/LDModal/LDModalView.js

@@ -42,7 +42,7 @@ const statusIconSizeClasses = {
     large: 'size-12.5',
     xlarge: 'size-12.5',
 };
-const LDModalView = ({ open, defaultOpen, onOpenChange, name, title, description, children, size = 'small', icon, buttons, scrollBehavior = 'inside', classNames, style, onButtonClick, }) => {
+const LDModalView = ({ open, defaultOpen, onOpenChange, name, title, description, children, size = 'small', icon, buttons, scrollBehavior = 'inside', closeOnOverlayClick = true, classNames, style, onButtonClick, }) => {
     const overlayRef = useRef(false);
     const hasHeader = name || title || description || icon;
     const handleClick = async (button) => {
@@ -57,8 +57,9 @@ const LDModalView = ({ open, defaultOpen, onOpenChange, name, title, description
     return (_jsxs(ModalBase.Root, { open: open, defaultOpen: defaultOpen, onOpenChange: onOpenChange, children: [_jsx(ModalBase.Overlay, { className: classNames?.overlay }), _jsx(ModalBase.Content, { className: cn({
                     ['top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2']: scrollBehavior === 'inside',
                     ['inset-0 flex items-start justify-center overflow-y-auto py-20']: scrollBehavior === 'outside',
-                }, classNames?.content), onMouseDown: (e) => (overlayRef.current = e.target === e.currentTarget), onClick: (e) => {
-                    if (scrollBehavior === 'outside' &&
+                }, classNames?.content), onPointerDownOutside: closeOnOverlayClick ? undefined : (e) => e.preventDefault(), onMouseDown: (e) => (overlayRef.current = e.target === e.currentTarget), onClick: (e) => {
+                    if (closeOnOverlayClick &&
+                        scrollBehavior === 'outside' &&
                         e.target === e.currentTarget &&
                         overlayRef.current)
                         onOpenChange?.(false);

package/dist/constants/file.d.ts

@@ -21,6 +21,7 @@ export declare const FILE_EXTENSIONS: {
     readonly 'image/tiff': "tiff";
     readonly 'image/webp': "webp";
     readonly 'image/x-icon': "ico";
+    readonly 'image/vnd.microsoft.icon': "ico";
     readonly 'image/heic': "heic";
     readonly 'image/heif': "heif";
     readonly 'application/pdf': "pdf";
@@ -37,7 +38,7 @@ export declare const FILE_EXTENSIONS: {
 export type TMimeType = keyof typeof FILE_EXTENSIONS;
 export type TFileExtension = (typeof FILE_EXTENSIONS)[TMimeType];
 export declare const SUPPORTED_FILE_MIME_TYPES: TMimeType[];
-export declare const SUPPORTED_IMAGE_MIME_TYPES: ("image/avif" | "image/apng" | "image/bmp" | "image/gif" | "image/jpg" | "image/jpeg" | "image/pjpeg" | "image/png" | "image/svg+xml" | "image/tiff" | "image/webp" | "image/x-icon" | "image/heic" | "image/heif" | "application/pdf" | "text/plain" | "text/csv" | "application/msword" | "application/vnd.openxmlformats-officedocument.wordprocessingml.document" | "application/vnd.ms-excel" | "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" | "application/json" | "application/zip" | "application/x-zip-compressed")[];
+export declare const SUPPORTED_IMAGE_MIME_TYPES: ("image/avif" | "image/apng" | "image/bmp" | "image/gif" | "image/jpg" | "image/jpeg" | "image/pjpeg" | "image/png" | "image/svg+xml" | "image/tiff" | "image/webp" | "image/x-icon" | "image/vnd.microsoft.icon" | "image/heic" | "image/heif" | "application/pdf" | "text/plain" | "text/csv" | "application/msword" | "application/vnd.openxmlformats-officedocument.wordprocessingml.document" | "application/vnd.ms-excel" | "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" | "application/json" | "application/zip" | "application/x-zip-compressed")[];
 /** 에디터 툴바 이미지 업로드 허용 형식 */
 export declare const TOOLBAR_ALLOWED_EXTENSIONS: TMimeType[];
 /** 에디터 툴바 이미지 업로드 최대 용량 (5MB) */

package/dist/constants/file.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"file.d.ts","sourceRoot":"","sources":["../../src/constants/file.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc;;;;CAIjB,CAAC;AAEX,eAAO,MAAM,cAAc;;;CAGjB,CAAC;AAEX,uBAAuB;AACvB,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;CA0BlB,CAAC;AAEX,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,eAAe,CAAC;AACrD,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,SAAS,CAAC,CAAC;AAEjE,eAAO,MAAM,yBAAyB,EAEjC,SAAS,EAAE,CAAC;AAEjB,eAAO,MAAM,0BAA0B,uhBAEtC,CAAC;AAEF,2BAA2B;AAC3B,eAAO,MAAM,0BAA0B,EAAE,SAAS,EAQjD,CAAC;AAEF,iCAAiC;AACjC,eAAO,MAAM,gBAAgB,QAAwB,CAAC"}
+{"version":3,"file":"file.d.ts","sourceRoot":"","sources":["../../src/constants/file.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc;;;;CAIjB,CAAC;AAEX,eAAO,MAAM,cAAc;;;CAGjB,CAAC;AAEX,uBAAuB;AACvB,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BlB,CAAC;AAEX,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,eAAe,CAAC;AACrD,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,SAAS,CAAC,CAAC;AAEjE,eAAO,MAAM,yBAAyB,EAEjC,SAAS,EAAE,CAAC;AAEjB,eAAO,MAAM,0BAA0B,ojBAEtC,CAAC;AAEF,2BAA2B;AAC3B,eAAO,MAAM,0BAA0B,EAAE,SAAS,EAQjD,CAAC;AAEF,iCAAiC;AACjC,eAAO,MAAM,gBAAgB,QAAwB,CAAC"}

package/dist/constants/file.js

@@ -21,6 +21,7 @@ export const FILE_EXTENSIONS = {
     'image/tiff': 'tiff',
     'image/webp': 'webp',
     'image/x-icon': 'ico',
+    'image/vnd.microsoft.icon': 'ico',
     'image/heic': 'heic',
     'image/heif': 'heif',
     'application/pdf': 'pdf',

package/dist/index.css

@@ -9,6 +9,7 @@
       "Courier New", monospace;
     --color-red-500: oklch(63.7% 0.237 25.331);
     --color-yellow-400: oklch(85.2% 0.199 91.936);
+    --color-blue-100: oklch(93.2% 0.032 255.585);
     --color-blue-400: oklch(70.7% 0.165 254.624);
     --color-blue-500: oklch(62.3% 0.214 259.815);
     --color-blue-600: oklch(54.6% 0.245 262.881);
@@ -2018,6 +2019,9 @@
   .grid-cols-3 {
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
+  .grid-cols-5 {
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+  }
   .grid-cols-7 {
     grid-template-columns: repeat(7, minmax(0, 1fr));
   }
@@ -2361,6 +2365,9 @@
     --tw-border-style: solid;
     border-style: solid;
   }
+  .border-blue-500 {
+    border-color: var(--color-blue-500);
+  }
   .border-blue500 {
     border-color: var(--color-blue500);
   }
@@ -2439,6 +2446,9 @@
       background-color: color-mix(in oklab, var(--color-black) 40%, transparent);
     }
   }
+  .bg-blue-100 {
+    background-color: var(--color-blue-100);
+  }
   .bg-blue-500 {
     background-color: var(--color-blue-500);
   }
@@ -4845,6 +4855,13 @@
       letter-spacing: var(--tracking-display14);
     }
   }
+  .tablet-down\:display16 {
+    @media (max-width: calc(992px - 1px)) {
+      font-size: var(--text-display16);
+      line-height: var(--leading-display16);
+      letter-spacing: var(--tracking-display16);
+    }
+  }
   .\[\&_svg\]\:icon-2xs {
     & svg {
       width: var(--control-icon-2xs);
@@ -5604,6 +5621,51 @@
 .ProseMirror [data-resize-wrapper] img {
   margin: 0 !important;
 }
+.ProseMirror .tableWrapper {
+  overflow-x: auto;
+  margin: 1rem 0;
+}
+.ProseMirror table {
+  width: 100%;
+  margin: 0;
+  table-layout: fixed;
+  border-collapse: collapse;
+}
+.ProseMirror table td, .ProseMirror table th {
+  position: relative;
+  min-width: 1em;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--color-neutral200);
+  vertical-align: top;
+}
+.ProseMirror table th {
+  background: var(--color-mono100);
+  font-weight: 600;
+  text-align: left;
+}
+.ProseMirror table p {
+  margin: 0;
+}
+.ProseMirror .selectedCell::after {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background: rgba(59, 130, 246, 0.15);
+  pointer-events: none;
+  z-index: 2;
+}
+.ProseMirror .column-resize-handle {
+  position: absolute;
+  top: 0;
+  right: -2px;
+  bottom: -2px;
+  width: 4px;
+  background: #3b82f6;
+  pointer-events: none;
+}
+.ProseMirror.resize-cursor {
+  cursor: col-resize;
+}
 @layer components {
   .select-2xs {
     height: var(--control-height-2xs);

package/dist/utils/file.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"file.d.ts","sourceRoot":"","sources":["../../src/utils/file.ts"],"names":[],"mappings":"AASA,OAAO,EAAiB,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAIL,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,KAAK;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,0CAA0C;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,OAAO,GAAI,KAAK,MAAM,YACW,CAAC;AAE/C,eAAO,MAAM,YAAY,GAAI,KAAK,MAAM,YACU,CAAC;AAgCnD,eAAO,MAAM,WAAW,GAAI,UAAU,MAAM,KAAG,YAM9C,CAAC;AAEF,eAAO,MAAM,4BAA4B,GACvC,UAAU,SAAS,KAClB,cAAc,GAAG,MAEnB,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,MAAM,IAAI,KAAG,OAAO,CAAC,OAAO,CAoB1D,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,MAAM,IAAI,EAAE,SAAS,MAAM,YAExD,CAAC;AAEF,eAAO,MAAM,sBAAsB,GACjC,MAAM,IAAI,EACV,mBAAmB,SAAS,EAAE,YAG/B,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,QAAQ,MAAM,oBAS7C,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,MAAM,IAAI,KAAG,OAAO,CAAC,MAAM,CAM5D,CAAC;AAEF,eAAO,MAAM,YAAY,GAAU,MAAM,IAAI,KAAG,OAAO,CAAC,KAAK,CAa5D,CAAC"}
+{"version":3,"file":"file.d.ts","sourceRoot":"","sources":["../../src/utils/file.ts"],"names":[],"mappings":"AASA,OAAO,EAAiB,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAIL,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,KAAK;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,0CAA0C;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,OAAO,GAAI,KAAK,MAAM,YACW,CAAC;AAE/C,eAAO,MAAM,YAAY,GAAI,KAAK,MAAM,YACU,CAAC;AAgCnD,eAAO,MAAM,WAAW,GAAI,UAAU,MAAM,KAAG,YAM9C,CAAC;AAEF,eAAO,MAAM,4BAA4B,GACvC,UAAU,SAAS,KAClB,cAAc,GAAG,MAEnB,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,MAAM,IAAI,KAAG,OAAO,CAAC,OAAO,CAoB1D,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,MAAM,IAAI,EAAE,SAAS,MAAM,YAExD,CAAC;AAEF,eAAO,MAAM,sBAAsB,GACjC,MAAM,IAAI,EACV,mBAAmB,SAAS,EAAE,YAS/B,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,QAAQ,MAAM,oBAS7C,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,MAAM,IAAI,KAAG,OAAO,CAAC,MAAM,CAM5D,CAAC;AAEF,eAAO,MAAM,YAAY,GAAU,MAAM,IAAI,KAAG,OAAO,CAAC,KAAK,CAa5D,CAAC"}

package/dist/utils/file.js

@@ -63,7 +63,10 @@ export const validFileSize = (file, maxSize) => {
     return file.size <= maxSize;
 };
 export const validAllowedExtensions = (file, allowedExtensions) => {
-    return allowedExtensions.includes(file.type);
+    const mimeType = file.type;
+    return allowedExtensions.some((allowed) => allowed === mimeType ||
+        (FILE_EXTENSIONS[mimeType] === 'ico' &&
+            FILE_EXTENSIONS[allowed] === 'ico'));
 };
 export const getFileSizeUnit = (number) => {
     if (number < FILE_SIZE_UNIT.kb)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loword/loword-design-system",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "description": "로워드 디자인 시스템 컴포넌트 패키지(Tailwind v4)",
   "keywords": [
     "react",
@@ -38,6 +38,7 @@
     },
     "./theme.css": "./src/theme.css",
     "./styles.css": "./dist/index.css",
+    "./components.css": "./src/styles/components.css",
     "./*": {
       "types": "./dist/*.d.ts",
       "default": "./dist/*.js"
@@ -62,6 +63,7 @@
     "@tiptap/extension-highlight": "^3.26.0",
     "@tiptap/extension-image": "^3.26.0",
     "@tiptap/extension-link": "^3.26.0",
+    "@tiptap/extension-table": "^3.26.0",
     "@tiptap/extension-text-align": "^3.26.0",
     "@tiptap/extension-text-style": "^3.26.0",
     "@tiptap/extension-underline": "^3.26.0",
@@ -75,7 +77,7 @@
     "embla-carousel-auto-scroll": "^8.6.0",
     "embla-carousel-autoplay": "^8.6.0",
     "embla-carousel-react": "^8.6.0",
-    "next": "^15",
+    "next": "^15 || ^16",
     "react": "^19",
     "react-chartjs-2": "^5.2.0",
     "react-daum-postcode": "^4.0.0",
@@ -130,6 +132,9 @@
     "@tiptap/extension-link": {
       "optional": true
     },
+    "@tiptap/extension-table": {
+      "optional": true
+    },
     "@tiptap/extension-text-align": {
       "optional": true
     },
@@ -199,7 +204,6 @@
     "@storybook/addon-vitest": "10.5.7",
     "@storybook/nextjs-vite": "10.5.7",
     "@tailwindcss/cli": "^4.1.5",
-    "@tailwindcss/typography": "^0.5.20",
     "@tailwindcss/vite": "^4.2.2",
     "@tanstack/react-table": "^8.21.3",
     "@tiptap/core": "^3.26.0",
@@ -209,6 +213,7 @@
     "@tiptap/extension-highlight": "^3.26.0",
     "@tiptap/extension-image": "^3.26.0",
     "@tiptap/extension-link": "^3.26.0",
+    "@tiptap/extension-table": "^3.26.0",
     "@tiptap/extension-text-align": "^3.26.0",
     "@tiptap/extension-text-style": "^3.26.0",
     "@tiptap/extension-underline": "^3.26.0",
@@ -261,6 +266,7 @@
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
+    "@tailwindcss/typography": "^0.5.20",
     "clsx": "^2.1.1",
     "lucide-react": "^0.536.0",
     "react-hook-form": "^7.62.0",

package/src/styles/components/editor.css

@@ -165,3 +165,65 @@
 .ProseMirror [data-resize-wrapper] img {
   margin: 0 !important;
 }
+
+/* 표
+   prose 기본 표는 가로줄만 그어 에디터에서 셀 경계가 보이지 않는다. 격자 테두리로 덮는다.
+   @layer 밖(=무레이어)이라 utilities 레이어의 prose보다 우선한다. */
+.ProseMirror .tableWrapper {
+  overflow-x: auto;
+  margin: 1rem 0;
+}
+
+.ProseMirror table {
+  width: 100%;
+  margin: 0;
+  /* 열 너비 리사이즈(colgroup width)가 반영되려면 fixed여야 한다. */
+  table-layout: fixed;
+  border-collapse: collapse;
+}
+
+.ProseMirror table td,
+.ProseMirror table th {
+  /* 열 리사이즈 핸들의 위치 기준 */
+  position: relative;
+  min-width: 1em;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--color-neutral200);
+  vertical-align: top;
+}
+
+.ProseMirror table th {
+  background: var(--color-mono100);
+  font-weight: 600;
+  text-align: left;
+}
+
+/* 셀 안 문단은 prose의 블록 여백을 쓰지 않는다 — 셀 높이가 과하게 늘어난다. */
+.ProseMirror table p {
+  margin: 0;
+}
+
+/* 드래그로 여러 셀을 선택했을 때 */
+.ProseMirror .selectedCell::after {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background: rgba(59, 130, 246, 0.15);
+  pointer-events: none;
+  z-index: 2;
+}
+
+/* 열 너비 리사이즈 핸들 (셀 오른쪽 경계) */
+.ProseMirror .column-resize-handle {
+  position: absolute;
+  top: 0;
+  right: -2px;
+  bottom: -2px;
+  width: 4px;
+  background: #3b82f6;
+  pointer-events: none;
+}
+
+.ProseMirror.resize-cursor {
+  cursor: col-resize;
+}

package/src/styles/components.css

@@ -0,0 +1,24 @@
+/**
+ * components.css — 소비처의 Tailwind 컴파일러가 직접 처리하는 raw 컴포넌트 스타일 진입점.
+ *
+ * `theme.css`(토큰·유틸 정의)의 짝이다. 둘을 함께 import 하면 컴파일된
+ * dist/index.css(styles.css) 없이도 LDS 를 전부 쓸 수 있다.
+ *
+ *   @import 'tailwindcss';
+ *   @import '@loword/loword-design-system/theme.css';
+ *   @import '@loword/loword-design-system/components.css';
+ *   @source '<...>/node_modules/@loword/loword-design-system/dist';
+ *
+ * styles.css 와 함께 쓰지 않는다 — 같은 유틸이 정적 사본으로 중복 출력되고, 그 사본이
+ * 소비처가 생성한 변형 유틸(`tablet-down:display16` 등)보다 뒤에 놓여 오버라이드를 막는다.
+ *
+ * 주의:
+ * - `@import 'tailwindcss'`를 넣지 않는다. 소비처가 이미 import 하므로 중복되면 충돌난다.
+ * - 토큰·유틸 정의는 포함하지 않는다 — theme.css 가 담당한다.
+ * - `@source` 로 dist 를 스캔해야 컴포넌트가 쓰는 클래스가 tree-shaking 되지 않는다.
+ */
+@import './components/index.css';
+@import './slider.css';
+@import './carousel.css';
+
+@plugin '@tailwindcss/typography';