@machinerd/js-module 0.9.0 → 0.11.0

package/README.md

@@ -2,110 +2,152 @@
 
 React용 공용 UI·훅·유틸·API 클라이언트 패키지입니다.
 
-**현재 버전:** `0.6` (`package.json`의 `version` 필드와 동일합니다. 배포 전에는 해당 값을 확인하세요.)
-
-**Peer dependency:** `react`, `react-dom` — `^18.3.1` 또는 `^19.0.0`
-
 ---
 
 ## 설치
 
 ```bash
 pnpm add @machinerd/js-module
-npm install @machinerd/js-module
-yarn add @machinerd/js-module
 ```
 
-컴포넌트를 사용한다면 CSS도 함께 import 해야 합니다.
+`npm` / `yarn`도 동일합니다. 사용하는 UI에 맞는 peer dependency는 소비하는 앱에 설치해야 합니다. 아래 표를 참고하세요.
 
-```js
-import '@machinerd/js-module/styles/index.css';
-```
+---
+
+## CSS
 
-에디터(Tiptap)를 쓸 때만 아래를 추가로 넣습니다.
+유틸·훅·프로바이더만 쓰면 CSS는 필요 없습니다. `komc:` 유틸이나 `[data-komc]`가 있는 UI를 쓰면 스타일을 import 해야 합니다.
+
+| 파일 | 필요할 때 |
+| --- | --- |
+| `@machinerd/js-module/styles/index.css` | 공통 UI (버튼, 다이얼로그, 캐러셀 등) |
+| `@machinerd/js-module/styles/admin.css` | 어드민 필드·토큰·`form-field` |
+| `@machinerd/js-module/styles/editor.css` | 에디터 콘텐츠 스타일 |
 
 ```js
+import '@machinerd/js-module/styles/index.css';
+import '@machinerd/js-module/styles/admin.css';
 import '@machinerd/js-module/styles/editor.css';
 ```
 
----
+클래스는 `komc:` prefix이고, 공통 UI 리셋·토큰은 `[data-komc]` 안에만 적용됩니다. 호스트 앱의 Tailwind와 겹치지 않습니다. `editor.css`는 TipTap이 붙이는 `.tiptap`에 바로 걸립니다. `data-komc`나 `editor-wrapper`는 필요 없습니다. 필드 크롬까지 쓰려면 `admin.css`를 같이 넣습니다. 노드 호버·선택 링은 `.komc-node-frame`에, 드래그는 `data-drag-handle`에 걸립니다.
 
-## API 클라이언트 (`@machinerd/js-module`)
+---
 
-```ts
-import ApiClient, { type ApiConfig } from '@machinerd/js-module';
+## 에디터
 
-const client = new ApiClient({
-  apiEndpoint: 'https://api.example.com',
-  cdnEndpoint: 'https://cdn.example.com',
-});
+`Loader`와 노드·익스텐션은 엔트리가 나뉘어 있습니다. 서버에서 스키마만 쓸 때는 노드/익스텐션을 직접 import 하면 됩니다.
 
-await client.login(/* ... */);
-client.cdnMedia('path/to/key');
+```js
+import { Loader } from '@machinerd/js-module/editor';
+import { CustomHeading } from '@machinerd/js-module/editor/nodes/custom-heading';
+import { Align } from '@machinerd/js-module/editor/extensions/align';
 ```
 
----
-
-## Providers
+이미지 노드에 호스트 메뉴를 붙이려면 `plugins`에 컴포넌트를 넣습니다. `NodeSize` / `NodeResizer`는 기본 플러그인이라 같이 넣지 않아도 됩니다. 크기 입력의 최소·최댓값은 `size`로 넘기고, `plugins`에 `nodeSize()`를 또 넣으면 오버레이가 두 번 뜹니다. 메뉴는 NodeView 안에서 렌더되고, `useNodeView()`로 `updateAttributes` / `node` / `deleteNode`를 씁니다.
 
-**`Image`·`useSubsetImage` 등 CDN 경로를 다루는 UI·훅**은 내부에서 `useApiClient()`로 **`ApiClient` 인스턴스**에 접근합니다.
+```js
+import { MenuWrapper, useNodeView } from '@machinerd/js-module/editor/nodes/menu-wrapper';
+import type { SubsetImageAttrs } from '@machinerd/js-module/editor/nodes/subset-image';
 
-```tsx
-import { ApiClientProvider } from '@machinerd/js-module/providers';
+function ImageMenu() {
+  const { node, updateAttributes, deleteNode } =
+    useNodeView<SubsetImageAttrs>();
 
-export function App({ children }: { children: React.ReactNode }) {
   return (
-    <ApiClientProvider
-      config={{
-        apiEndpoint: 'https://api.example.com',
-        cdnEndpoint: 'https://cdn.example.com',
-      }}
-    >
-      {children}
-    </ApiClientProvider>
+    <MenuWrapper>
+      <MenuWrapper.Item
+        onClick={() => updateAttributes({ alt: node.attrs.alt })}
+      />
+      <MenuWrapper.Item onClick={deleteNode} />
+    </MenuWrapper>
   );
 }
-```
-
----
 
-## UI 컴포넌트 (`@machinerd/js-module/ui/common`)
-
-```tsx
-import {
-  Button,
-  ...Other
-} from '@machinerd/js-module/ui/common';
-import { Carousel } from '@machinerd/js-module/ui/carousel';
-...Other
-
-import '@machinerd/js-module/styles/index.css';
+new Loader().mediaset({
+  subsetImage: {
+    size: { maxWidth: 829 },
+    plugins: [ImageMenu],
+  },
+  basicImage: { plugins: [ImageMenu] },
+});
 ```
 
+| 엔트리 | 내용 |
+| --- | --- |
+| `@machinerd/js-module/editor` | `Loader` |
+| `@machinerd/js-module/editor/nodes/basic-image` | `BasicImage` |
+| `@machinerd/js-module/editor/nodes/subset-image` | `SubsetImage`, `SubsetImageAttrs` |
+| `@machinerd/js-module/editor/nodes/custom-heading` | `CustomHeading` |
+| `@machinerd/js-module/editor/nodes/table` | `Table`, `TableRow`, `TableCell`, `TableHeader` |
+| `@machinerd/js-module/editor/nodes/tabs` | `Tabs`, `TabTitle`, `TabContent` |
+| `@machinerd/js-module/editor/nodes/menu-wrapper` | `MenuWrapper`, `useNodeView` |
+| `@machinerd/js-module/editor/nodes/node-view-context` | `useNodeView`, `PluginNodeView`, `withNodeViewChrome` |
+| `@machinerd/js-module/editor/nodes/node-resize` | `NodeResizer`, `NodeResizerPlugin` |
+| `@machinerd/js-module/editor/nodes/node-size` | `NodeSize`, `NodeSizePlugin`, `nodeSize` |
+| `@machinerd/js-module/editor/extensions/align` | `Align` |
+| `@machinerd/js-module/editor/extensions/table-resize` | `TableResize` |
+| `@machinerd/js-module/editor/extensions/table-controls` | `TableControls` |
+
 ---
 
-## 로컬 개발·다른 프로젝트에서 검증
+## Peer dependency
+
+`react` / `react-dom`만 필수입니다. 나머지는 해당 엔트리를 쓸 때만 설치하면 됩니다.
+
+| 패키지 | 버전 | 필수 | 사용처 |
+| --- | --- | --- | --- |
+| `react` | `^18.3.1` 또는 `^19.0.0` | 예 | 전체 |
+| `react-dom` | `^18.3.1` 또는 `^19.0.0` | 예 | 전체 |
+| `@fortawesome/fontawesome-svg-core` | `^6.0.0` 또는 `^7.0.0` | 아니오 | 어드민 필드 아이콘 타입 |
+| `@fortawesome/react-fontawesome` | `^3.0.0` | 아니오 | 어드민 필드 아이콘 렌더 |
+| `@floating-ui/react` | `^0.27.0` | 아니오 | `ui/dropdown` |
+| `@dnd-kit/core` | `^6.0.0` | 아니오 | `ui/dnd`, video/source/file/series/sns/image-list 필드 |
+| `@dnd-kit/modifiers` | `^9.0.0` | 아니오 | `ui/dnd` |
+| `@dnd-kit/sortable` | `^10.0.0` | 아니오 | `ui/dnd`, video/source/file/series/sns/image-list 필드 |
+| `@dnd-kit/utilities` | `^3.0.0` | 아니오 | `ui/dnd`, video/source/file/series/sns/image-list 필드 |
+| `embla-carousel` | `^8.0.0` | 아니오 | `ui/carousel` |
+| `embla-carousel-react` | `^8.0.0` | 아니오 | `ui/carousel` |
+| `motion` | `^13.0.0` | 아니오 | `ui/motion-dialog`, `ui/radius-handler` |
+| `notistack` | `^3.0.0` | 아니오 | `hooks/use-snackbar`, `providers/noti-stack` |
+| `react-dropzone` | `>=14.0.0 <21.0.0` | 아니오 | `ui/admin/dropzone-field` |
+| `react-hook-form` | `^7.0.0` | 아니오 | `ui/admin/with-extra-field` |
+| `react-select` | `^5.0.0` | 아니오 | `ui/admin/select-field`, `ui/admin/source-field`, `ui/admin/sns-field`, `ui/admin/async-select-field`, `ui/admin/country-select` |
+| `react-select-async-paginate` | `^0.7.0` | 아니오 | `ui/admin/async-select-field`, `ui/admin/country-select` |
+| `@tailwindcss/typography` | `^0.5.0` | 아니오 | `styles/editor.css` |
+| `@tiptap/core` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-color` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-details` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-document` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-heading` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-image` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-list` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-paragraph` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-table` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-text` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-text-style` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extension-youtube` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/extensions` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/pm` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/react` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/starter-kit` | `^3.0.0` | 아니오 | 에디터 |
+| `@tiptap/suggestion` | `^3.0.0` | 아니오 | 에디터 |
 
-### 1. 이 저장소에서 빌드
+---
 
-```bash
-pnpm install
-pnpm build
-```
+## 로컬 개발
 
-### 2. tarball로 다른 프로젝트에 넣기 (`pnpm pack`)
+- 패키지 매니저는 `pnpm`입니다 (`packageManager`: `pnpm@10.25.0`).
+- 소비하는 앱은 `dist`를 봅니다. 코드를 바꾼 뒤에는 이 저장소에서 다시 빌드해야 합니다.
+- UI 루트에는 `data-komc`가 있어야 리셋·토큰이 적용됩니다. 라이브러리 컴포넌트가 대부분 붙여 둡니다.
+- 다른 프로젝트에서 확인하려면 빌드 후 tarball을 넣습니다.
 
 ```bash
 pnpm pack
-```
-
-소비하는 프로젝트에서:
-
-```bash
 pnpm add /절대/또는/상대/경로/machinerd-js-module-[VERSION].tgz
 ```
 
-또는 `package.json`에:
+`package.json`에는 이렇게 적어도 됩니다.
 
 ```json
 {
@@ -114,3 +156,30 @@ pnpm add /절대/또는/상대/경로/machinerd-js-module-[VERSION].tgz
   }
 }
 ```
+
+---
+
+## 빌드
+
+```bash
+pnpm install
+pnpm build
+```
+
+`pnpm build`는 JS(`tsdown`)와 CSS(`index` / `admin` / `editor`)를 `dist`에 만듭니다. 배포 전에만 쓰려면 `pnpm build:pack`으로 빌드와 `pack`을 한 번에 할 수 있습니다.
+
+---
+
+## 테스트
+
+단위 테스트 스크립트는 아직 없습니다. 지금은 아래를 쓰면 됩니다.
+
+```bash
+pnpm lint
+pnpm build:tsc
+pnpm storybook
+```
+
+- `lint` — ESLint
+- `build:tsc` — 타입 체크
+- `storybook` — `http://localhost:6006`에서 UI 확인

package/dist/align-CdK8Ar2w.mjs

@@ -0,0 +1 @@
+import{Extension as e,isNodeSelection as t}from"@tiptap/core";const n=e.create({name:`align`,addOptions(){return{types:[`paragraph`,`heading`],defaultAlign:`left`}},addGlobalAttributes(){return[{types:this.options.types,attributes:{align:{default:this.options.defaultAlign,parseHTML:e=>e.getAttribute(`data-align`)??this.options.defaultAlign,renderHTML:e=>!e.align||e.align===this.options.defaultAlign?{}:{"data-align":e.align}}}}]},addCommands(){return{setAlign:e=>({editor:n,commands:r})=>{let{selection:i}=n.state;if(t(i)){let t=i.node;if(this.options.types.includes(t.type.name))return r.updateAttributes(t.type.name,{align:e})}let{$from:a}=i;for(let t=a.depth;t>=0;t--){let n=a.node(t);if(this.options.types.includes(n.type.name))return r.updateAttributes(n.type.name,{align:e})}return!1},unsetAlign:()=>({editor:e,commands:n})=>{let{selection:r}=e.state;if(t(r)){let e=r.node;if(this.options.types.includes(e.type.name))return n.updateAttributes(e.type.name,{align:this.options.defaultAlign})}let{$from:i}=r;for(let e=i.depth;e>=0;e--){let t=i.node(e);if(this.options.types.includes(t.type.name))return n.updateAttributes(t.type.name,{align:this.options.defaultAlign})}return!1}}}});export{n as t};

package/dist/align-Dp4avXIm.cjs

@@ -0,0 +1 @@
+const e=require(`./chunk-Bmb41Sf3.cjs`);let t=require(`@tiptap/core`);const n=t.Extension.create({name:`align`,addOptions(){return{types:[`paragraph`,`heading`],defaultAlign:`left`}},addGlobalAttributes(){return[{types:this.options.types,attributes:{align:{default:this.options.defaultAlign,parseHTML:e=>e.getAttribute(`data-align`)??this.options.defaultAlign,renderHTML:e=>!e.align||e.align===this.options.defaultAlign?{}:{"data-align":e.align}}}}]},addCommands(){return{setAlign:e=>({editor:n,commands:r})=>{let{selection:i}=n.state;if((0,t.isNodeSelection)(i)){let t=i.node;if(this.options.types.includes(t.type.name))return r.updateAttributes(t.type.name,{align:e})}let{$from:a}=i;for(let t=a.depth;t>=0;t--){let n=a.node(t);if(this.options.types.includes(n.type.name))return r.updateAttributes(n.type.name,{align:e})}return!1},unsetAlign:()=>({editor:e,commands:n})=>{let{selection:r}=e.state;if((0,t.isNodeSelection)(r)){let e=r.node;if(this.options.types.includes(e.type.name))return n.updateAttributes(e.type.name,{align:this.options.defaultAlign})}let{$from:i}=r;for(let e=i.depth;e>=0;e--){let t=i.node(e);if(this.options.types.includes(t.type.name))return n.updateAttributes(t.type.name,{align:this.options.defaultAlign})}return!1}}}});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return n}});

package/dist/{api-client-C3o2pO0q.cjs → api-client-BXH8Rm-J.cjs}

@@ -1 +1 @@
-const e=require(`./chunk-Bmb41Sf3.cjs`),t=require(`./src-6KfzqI9Z.cjs`);let n=require(`react`),r=require(`react/jsx-runtime`);const i=(0,n.createContext)(null);function a({children:e,config:a}){let{apiEndpoint:o,cdnEndpoint:s}=a,c=(0,n.useMemo)(()=>new t.t({apiEndpoint:o,cdnEndpoint:s}),[o,s]);return(0,r.jsx)(i.Provider,{value:c,children:e})}function o(){let e=(0,n.useContext)(i);if(!e)throw Error(`ApiClient not found`);return e}Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});
+const e=require(`./chunk-Bmb41Sf3.cjs`),t=require(`./src-Dz1mULYA.cjs`);let n=require(`react`),r=require(`react/jsx-runtime`);const i=(0,n.createContext)(null);function a({children:e,config:a}){let{apiEndpoint:o,cdnEndpoint:s}=a,c=(0,n.useMemo)(()=>new t.t({apiEndpoint:o,cdnEndpoint:s}),[o,s]);return(0,r.jsx)(i.Provider,{value:c,children:e})}function o(){let e=(0,n.useContext)(i);if(!e)throw Error(`ApiClient not found`);return e}Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});

package/dist/{api-client-C0sbSOQf.mjs → api-client-xK3Ua3Gr.mjs}

@@ -1 +1 @@
-import{t as e}from"./src-CIMlbgv1.mjs";import{createContext as t,useContext as n,useMemo as r}from"react";import{jsx as i}from"react/jsx-runtime";const a=t(null);function o({children:t,config:n}){let{apiEndpoint:o,cdnEndpoint:s}=n,c=r(()=>new e({apiEndpoint:o,cdnEndpoint:s}),[o,s]);return i(a.Provider,{value:c,children:t})}function s(){let e=n(a);if(!e)throw Error(`ApiClient not found`);return e}export{s as n,o as t};
+import{t as e}from"./src-BB55dPBE.mjs";import{createContext as t,useContext as n,useMemo as r}from"react";import{jsx as i}from"react/jsx-runtime";const a=t(null);function o({children:t,config:n}){let{apiEndpoint:o,cdnEndpoint:s}=n,c=r(()=>new e({apiEndpoint:o,cdnEndpoint:s}),[o,s]);return i(a.Provider,{value:c,children:t})}function s(){let e=n(a);if(!e)throw Error(`ApiClient not found`);return e}export{s as n,o as t};

package/dist/basic-image-D26zahpC.mjs

@@ -0,0 +1 @@
+import{o as e}from"./subset-image-DnZ2TqZY.mjs";import{mergeAttributes as t}from"@tiptap/core";import n from"@tiptap/extension-image";const r=n.extend({group:`block`,atom:!0,draggable:!0,addOptions(){return{...this.parent?.(),plugins:[],size:{}}},parseHTML(){return[{tag:`img`}]},renderHTML({HTMLAttributes:e}){return[`img`,t(e)]},addAttributes(){return{...this.parent?.(),src:{default:``},alt:{default:``},width:{default:400},height:{default:400},imagePosition:{default:`left`},imageRadius:{default:0},originalWidth:{default:1280}}},addNodeView(){return e(this.options.plugins,this.options.size)}});export{r as t};

package/dist/basic-image-Wl0IBgOX.cjs

@@ -0,0 +1 @@
+const e=require(`./chunk-Bmb41Sf3.cjs`),t=require(`./subset-image-AaZA0RuB.cjs`);let n=require(`@tiptap/core`),r=require(`@tiptap/extension-image`);r=e.t(r);const i=r.default.extend({group:`block`,atom:!0,draggable:!0,addOptions(){return{...this.parent?.(),plugins:[],size:{}}},parseHTML(){return[{tag:`img`}]},renderHTML({HTMLAttributes:e}){return[`img`,(0,n.mergeAttributes)(e)]},addAttributes(){return{...this.parent?.(),src:{default:``},alt:{default:``},width:{default:400},height:{default:400},imagePosition:{default:`left`},imageRadius:{default:0},originalWidth:{default:1280}}},addNodeView(){return t.o(this.options.plugins,this.options.size)}});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return i}});

package/dist/country-flag-8HG6HZPi.cjs

@@ -0,0 +1 @@
+const e=require(`./chunk-Bmb41Sf3.cjs`);let t=require(`react`),n=require(`react/jsx-runtime`),r=require(`lodash-es`);const i=`https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.4.3/flags/4x3/`,a=({countryCode:e,...i})=>{let a=(0,t.useMemo)(()=>`https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.4.3/flags/4x3/`+(0,r.lowerCase)(e)+`.svg`,[e]),o=e=>{e.currentTarget.remove()};return(0,n.jsx)(`img`,{"data-komc":!0,width:`34px`,height:`24px`,src:a,alt:e,...i,onError:o})};Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});

package/dist/country-flag-Bypgu_rR.mjs

@@ -0,0 +1 @@
+import{useMemo as e}from"react";import{jsx as t}from"react/jsx-runtime";import{lowerCase as n}from"lodash-es";const r=({countryCode:r,...i})=>{let a=e(()=>`https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.4.3/flags/4x3/`+n(r)+`.svg`,[r]),o=e=>{e.currentTarget.remove()};return t(`img`,{"data-komc":!0,width:`34px`,height:`24px`,src:a,alt:r,...i,onError:o})};export{r as t};

package/dist/custom-heading-By14y5ug.cjs

@@ -0,0 +1 @@
+const e=require(`./chunk-Bmb41Sf3.cjs`);let t=require(`@tiptap/extension-heading`);t=e.t(t);const n=t.default.extend({addAttributes(){return{...this.parent?.(),class:{default:null,parseHTML:e=>e.getAttribute(`class`),renderHTML:e=>e.class?{class:e.class}:{}}}}});Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return n}});

package/dist/custom-heading-eGRLcDQZ.mjs

@@ -0,0 +1 @@
+import e from"@tiptap/extension-heading";const t=e.extend({addAttributes(){return{...this.parent?.(),class:{default:null,parseHTML:e=>e.getAttribute(`class`),renderHTML:e=>e.class?{class:e.class}:{}}}}});export{t};

package/dist/dnd-CeWNVM-V.mjs

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import{useSortable as t}from"@dnd-kit/sortable";import{CSS as n}from"@dnd-kit/utilities";function r({id:r,render:i}){let{attributes:a,listeners:o,setNodeRef:s,transform:c,transition:l,isDragging:u}=t({id:r});return e(`div`,{ref:s,"data-komc":!0,style:{width:`100%`,zIndex:u?`100`:`auto`,opacity:u?.7:1,transform:n.Translate.toString(c),transition:l},children:i(a,o)})}export{r as t};

package/dist/dnd-DHNRwFj8.cjs

@@ -0,0 +1 @@
+const e=require(`./chunk-Bmb41Sf3.cjs`);let t=require(`react/jsx-runtime`),n=require(`@dnd-kit/sortable`),r=require(`@dnd-kit/utilities`);function i({id:e,render:i}){let{attributes:a,listeners:o,setNodeRef:s,transform:c,transition:l,isDragging:u}=(0,n.useSortable)({id:e});return(0,t.jsx)(`div`,{ref:s,"data-komc":!0,style:{width:`100%`,zIndex:u?`100`:`auto`,opacity:u?.7:1,transform:r.CSS.Translate.toString(c),transition:l},children:i(a,o)})}Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return i}});

package/dist/editor/extensions/align/index.cjs

@@ -0,0 +1 @@
+const e=require(`../../../align-Dp4avXIm.cjs`);exports.Align=e.t;

package/dist/editor/extensions/align/index.d.cts

@@ -0,0 +1,2 @@
+import { n as AlignType, t as Align } from "../../../index-BxqkZ148.cjs";
+export { Align, AlignType };

package/dist/editor/extensions/align/index.d.mts

@@ -0,0 +1,2 @@
+import { n as AlignType, t as Align } from "../../../index-D5uh7klO.mjs";
+export { Align, AlignType };

package/dist/editor/extensions/align/index.mjs

@@ -0,0 +1 @@
+import{t as e}from"../../../align-CdK8Ar2w.mjs";export{e as Align};

package/dist/editor/extensions/table-controls/index.cjs

@@ -0,0 +1 @@
+const e=require(`../../../table-controls-CQmqnc4R.cjs`);exports.TableControls=e.t;

package/dist/editor/extensions/table-controls/index.d.cts

@@ -0,0 +1,2 @@
+import { n as TableControls, r as TableControlsStorage, t as ActiveControl } from "../../../index-Dhkwd0rJ.cjs";
+export { ActiveControl, TableControls, TableControlsStorage };

package/dist/editor/extensions/table-controls/index.d.mts

@@ -0,0 +1,2 @@
+import { n as TableControls, r as TableControlsStorage, t as ActiveControl } from "../../../index-Cxc49Lmr.mjs";
+export { ActiveControl, TableControls, TableControlsStorage };

package/dist/editor/extensions/table-controls/index.mjs

@@ -0,0 +1 @@
+import{t as e}from"../../../table-controls-CpCGiLvR.mjs";export{e as TableControls};

package/dist/editor/extensions/table-resize/index.cjs

@@ -0,0 +1 @@
+const e=require(`../../../table-resize-DI2Pf2Mi.cjs`);exports.TableResize=e.t;

package/dist/editor/extensions/table-resize/index.d.cts

@@ -0,0 +1,2 @@
+import { t as TableResize } from "../../../index-D0Uuydfo.cjs";
+export { TableResize };

package/dist/editor/extensions/table-resize/index.d.mts

@@ -0,0 +1,2 @@
+import { t as TableResize } from "../../../index-aA4ojwuQ.mjs";
+export { TableResize };

package/dist/editor/extensions/table-resize/index.mjs

@@ -0,0 +1 @@
+import{t as e}from"../../../table-resize-w9EsReKV.mjs";export{e as TableResize};

package/dist/editor/index.cjs

@@ -1 +1 @@
-"use client";const e=require(`../chunk-Bmb41Sf3.cjs`),t=require(`../common-D4sUwkFd.cjs`),n=require(`../format-DEuImTYJ.cjs`);require(`../ui-Bs9PP9eC.cjs`),require(`../button-ChX3XGbR.cjs`);const r=require(`../skeleton-B5ZccRFX.cjs`),i=require(`../use-drag-resize-DeDqPC4h.cjs`);let a=require(`react`);a=e.t(a);let o=require(`@tiptap/react`),s=require(`react/jsx-runtime`),c=require(`clsx`);c=e.t(c);let l=require(`class-variance-authority`);const u=(0,a.createContext)(null);function d({editor:e,children:t}){let n=(0,a.useMemo)(()=>({editor:e}),[e]);return(0,s.jsx)(u.Provider,{value:n,children:t})}function f(){let e=(0,a.useContext)(u);if(!e)throw Error(`useEditorContext must be used within EditorProvider`);return e}function p(){let{editor:e}=f();if(!e)throw Error(`Editor is not available`);return e}function m(){return f().editor}const h=(0,a.forwardRef)(({plugins:e,editorRef:t,editorClassName:n=``,value:i,className:l,onChange:u,immediatelyRender:f=!0,content:p,editorProps:m,onCreate:h,onUpdate:g,..._},v)=>{let y=m?.attributes&&typeof m.attributes==`object`?m.attributes:void 0,b=(0,o.useEditor)({immediatelyRender:f,..._,content:p??i??``,editorProps:{...m,attributes:{...y,class:(0,c.default)(n,y&&`class`in y&&y.class)}},onCreate:e=>{t&&(t.current=e.editor),h?.(e)},onUpdate:e=>{u?.(e.editor.getHTML(),e.editor),g?.(e)}});return(0,a.useEffect)(()=>{if(t)return t.current=b??null,()=>{t.current===b&&(t.current=null)}},[b,t]),(0,a.useEffect)(()=>{!b||typeof i!=`string`||b.isDestroyed||b.isFocused||b.getHTML()!==i&&b.commands.setContent(i,{emitUpdate:!1})},[b,i]),(0,s.jsx)(d,{editor:b,children:(0,s.jsxs)(`div`,{"data-komc":!0,className:`komc:relative`,children:[b&&e,(0,s.jsx)(`div`,{ref:v,"data-komc":!0,className:(0,c.default)(`komc:@container/komc-editor editor-wrapper`,`komc:w-full komc:h-auto komc:relative`,`komc:border-[0.6px] komc:border-neutral-300`,`komc:transition-all komc:duration-200 komc:ease-in-out`,`komc:focus-within:border-blue-500 komc:focus-within:ring-4`,l),children:b?(0,s.jsx)(o.EditorContent,{editor:b}):(0,s.jsx)(r.t,{className:`komc:w-full komc:min-h-25`})})]})})}),g=(0,l.cva)(t.n(`komc:group komc:relative komc:after:pointer-events-none`,`komc:after:transition-opacity komc:after:duration-200 komc:after:ease-in-out`,`komc:after:content-[""] komc:after:rounded-(--node-radius)`,`komc:after:absolute komc:after:-inset-1.5 komc:after:z-1`),{variants:{selected:{true:`komc:after:bg-[#2383E2]/14 komc:after:opacity-100`,false:`komc:after:opacity-0`},hoverable:{true:t.n(`komc:*:data-komc-node-clip:transition-opacity`,`komc:*:data-komc-node-clip:duration-200`,`komc:*:data-komc-node-clip:ease-in-out`,`komc:*:data-komc-node-clip:outline-gray-700`,`komc:*:data-komc-node-clip:-outline-offset-1`,`komc:*:data-komc-node-clip:outline-0`,`komc:hover:*:data-komc-node-clip:opacity-70`,`komc:*:data-komc-node-clip:opacity-100`,`komc:hover:z-1`),false:``},draggable:{true:`komc:cursor-grab komc:active:cursor-grabbing komc:touch-none`,false:`komc:select-none`}},defaultVariants:{selected:!1,hoverable:!1,draggable:!1},compoundVariants:[{selected:!0,hoverable:!0,class:`komc:*:data-komc-node-clip:outline-none`},{selected:!1,hoverable:!0,class:`komc:hover:*:data-komc-node-clip:outline-3`}]}),_=(0,a.forwardRef)(({selected:e,hoverable:n,draggable:r,radius:i=0,overlay:a,className:o,style:c,children:l,...u},d)=>(0,s.jsxs)(`div`,{ref:d,style:{"--node-radius":`${i}%`,...c},className:t.n(g({selected:e,hoverable:n,draggable:r}),o),...u,"data-drag-handle":r?``:void 0,children:[(0,s.jsx)(`div`,{"data-komc-node-clip":``,className:`komc:w-full komc:h-full komc:relative komc:overflow-hidden`,style:{borderRadius:`${i}%`},children:l}),a!=null&&(0,s.jsx)(`div`,{className:`komc:absolute komc:inset-0 komc:z-2 komc:pointer-events-none komc:**:pointer-events-auto`,onPointerDown:e=>e.stopPropagation(),children:a})]}));_.displayName=`NodeFrame`;const v={width:i.t.DEFAULT_WIDTH,height:i.t.DEFAULT_HEIGHT};function y(e,t,r,i,a){return n.t({min:v,max:{width:a,height:1/0},width:e,height:t,type:r,currentRatio:i})}function b({width:e=0,height:n=0,maxWidth:r,edit:i,onEditChange:o,onChange:c}){let l=i!==void 0,[u,d]=(0,a.useState)(!1),f=l?i:u,[p,m]=(0,a.useState)(e),[h,g]=(0,a.useState)(n),[_,b]=(0,a.useState)(null),w=(0,a.useRef)(e&&n?e/n:1),T=e=>{l||d(e),o?.(e)},E=()=>{f||(T(!0),e&&n&&(w.current=e/n))},D=e=>{if(!/^[0-9]*$/.test(e.target.value))return;let{width:t,height:n,result:i}=y(Number(e.target.value),h,`width`,w.current,r);m(t),g(n),b(i)},O=e=>{if(!/^[0-9]*$/.test(e.target.value))return;let{width:t,height:n,result:i}=y(p,Number(e.target.value),`height`,w.current,r);m(t),g(n),b(i)},k=()=>{_||p<v.width||p>r||h<v.height||(T(!1),c?.({width:p,height:h}))};return(0,a.useEffect)(()=>{m(e),g(n),e&&n&&(w.current=e/n);let{result:t}=y(e,n,`width`,w.current,r),{result:i}=y(e,n,`height`,w.current,r);b(t||i||null)},[e,n,f,r]),(0,s.jsxs)(`div`,{className:t.n(`komc:flex komc:flex-col komc:justify-center komc:items-center`,`komc:text-base komc:text-center komc:text-black komc:absolute`,f?`komc:opacity-100 komc:-inset-1.5 komc:bg-white/60 komc:z-20`:t.n(`komc:z-10 komc:opacity-0 komc:group-hover:opacity-100`,`komc:top-1/2 komc:-translate-y-1/2 komc:left-1/2 komc:-translate-x-1/2`)),children:[!f&&(0,s.jsx)(`button`,{type:`button`,className:`komc:absolute komc:inset-0 komc:cursor-pointer`,onClick:E,"aria-label":`노드 크기 수정`}),(0,s.jsxs)(`div`,{className:t.n(`komc:flex komc:flex-row komc:justify-center komc:items-center komc:gap-x-1 komc:relative`,!f&&`komc:cursor-pointer`),children:[(0,s.jsx)(`div`,{className:`komc:inline komc:relative`,children:(0,s.jsx)(x,{shouldFocus:f,value:p,onChange:D,disabled:!f})}),(0,s.jsx)(`span`,{children:`x`}),(0,s.jsx)(`div`,{className:`komc:inline komc:relative`,children:(0,s.jsx)(x,{value:h,onChange:O,disabled:!f})}),f&&_&&(0,s.jsx)(`span`,{className:`komc:flex komc:shrink-0 komc:justify-center komc:items-center komc:w-5 komc:h-5 komc:ml-1 komc:text-red-600`,"aria-label":`입력값이 허용 범위를 벗어났습니다`,children:(0,s.jsx)(C,{})}),f&&!_&&(0,s.jsx)(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),k()},className:t.n(`komc:flex komc:shrink-0 komc:justify-center komc:items-center`,`komc:w-5 komc:h-5 komc:ml-1 komc:rounded`,`komc:bg-blue-500 komc:text-white komc:hover:bg-blue-600 komc:cursor-pointer`),children:(0,s.jsx)(S,{})})]})]})}function x({shouldFocus:e,value:t,onChange:n,disabled:r}){let[i,o]=(0,a.useState)(30),c=(0,a.useRef)(null),l=(0,a.useRef)(null);return(0,a.useEffect)(()=>{c.current&&o(c.current.offsetWidth||30)},[t]),(0,a.useEffect)(()=>{!r&&e&&l.current&&l.current.focus()},[r,e]),(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(`span`,{ref:c,"aria-hidden":`true`,className:`komc:absolute komc:invisible komc:whitespace-pre komc:text-base komc:pointer-events-none`,children:t||` `}),(0,s.jsx)(`input`,{ref:l,type:`text`,inputMode:`numeric`,maxLength:5,value:t,onChange:n,disabled:r,className:`komc:text-center komc:text-base komc:outline-none komc:bg-transparent komc:disabled:pointer-events-none`,style:{width:`${i+8}px`}})]})}function S(){return(0,s.jsx)(`svg`,{viewBox:`0 0 16 16`,width:`12`,height:`12`,fill:`none`,"aria-hidden":`true`,children:(0,s.jsx)(`path`,{d:`M3.5 8.5 6.5 11.5 12.5 4.5`,stroke:`currentColor`,strokeWidth:`1.8`,strokeLinecap:`round`,strokeLinejoin:`round`})})}function C(){return(0,s.jsxs)(`svg`,{viewBox:`0 0 16 16`,width:`16`,height:`16`,"aria-hidden":`true`,children:[(0,s.jsx)(`circle`,{cx:`8`,cy:`8`,r:`7`,fill:`currentColor`}),(0,s.jsx)(`path`,{d:`M8 4.5v5`,stroke:`white`,strokeWidth:`1.6`,strokeLinecap:`round`}),(0,s.jsx)(`circle`,{cx:`8`,cy:`11.5`,r:`0.9`,fill:`white`})]})}const w=(0,l.cva)(t.n(`komc:flex komc:justify-center komc:items-center komc:absolute komc:z-50`,`komc:transition-all komc:duration-200 komc:ease-in-out`,`komc:opacity-0 komc:group-hover:opacity-100`),{variants:{direction:{left:`komc:-left-1 komc:cursor-ew-resize komc:top-1/2 komc:-translate-y-1/2`,right:`komc:-right-1 komc:cursor-ew-resize komc:top-1/2 komc:-translate-y-1/2`,top:`komc:-top-1 komc:cursor-ns-resize komc:left-1/2 komc:-translate-x-1/2`,bottom:`komc:-bottom-1 komc:cursor-ns-resize komc:left-1/2 komc:-translate-x-1/2`,"top-left":`komc:-top-1 komc:left-1 komc:cursor-nw-resize`,"top-right":`komc:-top-1 komc:right-1 komc:cursor-ne-resize`,"bottom-left":`komc:-bottom-1 komc:left-1 komc:cursor-sw-resize`,"bottom-right":`komc:-bottom-1 komc:right-1 komc:cursor-se-resize`}},defaultVariants:{direction:`left`}}),T=(0,l.cva)(`komc:flex komc:justify-center komc:items-center komc:group/resize`,{variants:{direction:{left:`komc:w-6 komc:h-14 komc:*:w-1.5 komc:*:h-full`,right:`komc:w-6 komc:h-14 komc:*:w-1.5 komc:*:h-full`,top:`komc:w-14 komc:h-6 komc:*:w-full komc:*:h-1.5`,bottom:`komc:w-14 komc:h-6 komc:*:w-full komc:*:h-1.5`,"top-left":`komc:w-14 komc:h-6 komc:*:w-full komc:*:h-1.5`,"top-right":`komc:w-14 komc:h-6 komc:*:w-full komc:*:h-1.5`,"bottom-left":`komc:w-14 komc:h-6 komc:*:w-full komc:*:h-1.5`,"bottom-right":`komc:w-14 komc:h-6 komc:*:w-full komc:*:h-1.5`}},defaultVariants:{direction:`left`}});function E({directions:e,limitSize:t={width:!0,height:!1},...n}){let{getHandleProps:r,isResizing:a}=i.n({...n,limitSize:t});return(0,s.jsx)(s.Fragment,{children:e.map(e=>(0,s.jsx)(D,{direction:e,isResizing:a,...r(e)},e))})}const D=(0,a.memo)(function({direction:e,isResizing:n,style:r,...i}){return(0,s.jsx)(`div`,{className:t.n(w({direction:e}),n&&`komc:opacity-100`),children:(0,s.jsx)(`div`,{className:T({direction:e}),draggable:!1,onDragStart:e=>e.preventDefault(),style:r,...i,children:(0,s.jsx)(`div`,{className:`komc:border komc:border-white komc:bg-black/40 komc:rounded-full komc:group-hover/resize:bg-blue-500/50`})})})});exports.Editor=h,exports.EditorProvider=d,exports.NodeFrame=_,exports.NodeResizer=E,exports.NodeSize=b,exports.useEditorContext=f,exports.useOptionalEditor=m,exports.useRequiredEditor=p;
+"use client";const e=require(`../chunk-Bmb41Sf3.cjs`);require(`../src-Dz1mULYA.cjs`);const t=require(`../align-Dp4avXIm.cjs`),n=require(`../table-controls-CQmqnc4R.cjs`),r=require(`../table-resize-DI2Pf2Mi.cjs`);require(`../file-DeZ1OKdy.cjs`),require(`../api-client-BXH8Rm-J.cjs`),require(`../use-subset-image-BUurDItP.cjs`),require(`../skeleton-7P1IZD3G.cjs`),require(`../image-kIL2PjTS.cjs`),require(`../editor-DvLUotoh.cjs`),require(`../node-view-context-YTl_1gGD.cjs`),require(`../use-drag-resize-BO3zANv3.cjs`),require(`../node-resize-dantnBzP.cjs`),require(`../node-size-BQQGo7t7.cjs`);const i=require(`../subset-image-AaZA0RuB.cjs`),a=require(`../basic-image-Wl0IBgOX.cjs`),o=require(`../custom-heading-By14y5ug.cjs`);require(`../subset-image-P2NQM0-3.cjs`);const s=require(`../table-DmwOZtdl.cjs`),c=require(`../tabs-DiryrHZ7.cjs`);let l=require(`@tiptap/extension-text-style`),u=require(`@tiptap/extension-details`);u=e.t(u);let d=require(`@tiptap/extension-youtube`);d=e.t(d);let f=require(`@tiptap/starter-kit`);f=e.t(f);const p=(e,t)=>t?e.configure(t):e;var m=class{#e=[];#t=new Set;textset(e={}){return this.#t.has(`text`)?this:(this.#t.add(`text`),this.#e.push(l.TextStyleKit.configure({color:{types:[`textStyle`,`listItem`]},...e.textStyleKit}),f.default.configure({bulletList:{keepMarks:!0,keepAttributes:!1},orderedList:{keepMarks:!0,keepAttributes:!1},link:{openOnClick:!1,autolink:!0,defaultProtocol:`https`},heading:!1,...e.starterKit}),o.t.configure({levels:[1,2,3],...e.customHeading})),this)}mediaset(e={}){return this.#t.has(`media`)?this:(this.#t.add(`media`),this.#e.push(p(a.t,e.basicImage),p(i.r,e.subsetImage),d.default.configure({controls:!1,nocookie:!0,width:480,height:320,...e.youtube})),this)}tableset(e={}){return this.#t.has(`table`)?this:(this.#t.add(`table`),this.#e.push(s.t.configure({resizable:!0,...e.table}),p(s.i,e.tableRow),p(s.n,e.tableCell),p(s.r,e.tableHeader),p(r.t,e.tableResize),p(n.t,e.tableControls)),this)}layoutset(e={}){return this.#t.has(`layout`)?this:(this.#t.add(`layout`),this.#e.push(p(c.o,e.tabs),p(c.a,e.tabTitle),p(c.i,e.tabContent),t.t.configure({types:[`paragraph`,`heading`],defaultAlign:`left`,...e.align}),u.default.configure({persist:!0,HTMLAttributes:{class:`details`},...e.details}),p(u.DetailsContent,e.detailsContent),p(u.DetailsSummary,e.detailsSummary)),this)}otherset(e=[]){return this.#e.push(...e),this}init(){return[...this.#e]}};exports.Loader=m;

package/dist/editor/index.d.cts

@@ -1,80 +1,58 @@
-import { o as UseDragResizeProps, r as ResizeDirection } from "../use-drag-resize-DEgcua2U.cjs";
-import * as react0 from "react";
-import React, { ComponentProps, ReactNode } from "react";
-import { Editor as Editor$1, UseEditorOptions } from "@tiptap/react";
-import * as class_variance_authority_types0 from "class-variance-authority/types";
-import { VariantProps } from "class-variance-authority";
-import * as react_jsx_runtime12 from "react/jsx-runtime";
-import { Editor as Editor$2 } from "@tiptap/core";
+import { t as Align } from "../index-BxqkZ148.cjs";
+import { n as TableControls } from "../index-Dhkwd0rJ.cjs";
+import { t as TableResize } from "../index-D0Uuydfo.cjs";
+import "../index-DvEtYdm4.cjs";
+import "../index-BMZtFPh-.cjs";
+import { t as BasicImage } from "../index-D-NPxMFr.cjs";
+import { t as CustomHeading } from "../index-BT7Y7xkm.cjs";
+import { r as SubsetImage } from "../index-BD2sHM7a.cjs";
+import { i as TableRow, n as TableCell, r as TableHeader, t as Table } from "../index-DTtrJ-ei.cjs";
+import { c as TabTitle, l as Tabs, s as TabContent } from "../index-DEolXbf5.cjs";
+import { Extensions } from "@tiptap/core";
+import { TextStyleKit } from "@tiptap/extension-text-style";
+import Details, { DetailsContent, DetailsSummary } from "@tiptap/extension-details";
+import Youtube from "@tiptap/extension-youtube";
+import StarterKit from "@tiptap/starter-kit";
 
-//#region src/editor/editor.d.ts
-interface Props extends UseEditorOptions {
-  plugins?: React.ReactNode;
-  editorRef?: React.MutableRefObject<Editor$1 | null>;
-  editorClassName?: string;
-  value?: string | null;
-  className?: string;
-  onChange?: (value: string, context: Editor$1) => void;
+//#region src/editor/loader.d.ts
+type Config<T> = T extends {
+  configure: (options?: infer O) => unknown;
+} ? O : never;
+interface TextSetOptions {
+  textStyleKit?: Config<typeof TextStyleKit>;
+  starterKit?: Config<typeof StarterKit>;
+  customHeading?: Config<typeof CustomHeading>;
 }
-declare const Editor: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
-//#endregion
-//#region src/editor/node-frame.d.ts
-declare const classes: (props?: ({
-  selected?: boolean | null | undefined;
-  hoverable?: boolean | null | undefined;
-  draggable?: boolean | null | undefined;
-} & class_variance_authority_types0.ClassProp) | undefined) => string;
-type NodeFrameProps = ComponentProps<'div'> & VariantProps<typeof classes> & {
-  radius?: number;
-  overlay?: ReactNode;
-};
-declare const NodeFrame: react0.ForwardRefExoticComponent<Omit<NodeFrameProps, "ref"> & react0.RefAttributes<HTMLDivElement>>;
-//#endregion
-//#region src/editor/node-size.d.ts
-interface NodeSizeProps {
-  width?: number;
-  height?: number;
-  maxWidth: number;
-  edit?: boolean;
-  onEditChange?: (edit: boolean) => void;
-  onChange?: (size: {
-    width: number;
-    height: number;
-  }) => void;
+interface MediaSetOptions {
+  basicImage?: Config<typeof BasicImage>;
+  subsetImage?: Config<typeof SubsetImage>;
+  youtube?: Config<typeof Youtube>;
 }
-declare function NodeSize({
-  width,
-  height,
-  maxWidth,
-  edit,
-  onEditChange,
-  onChange
-}: NodeSizeProps): react_jsx_runtime12.JSX.Element;
-//#endregion
-//#region src/editor/node-resizer.d.ts
-interface NodeResizerProps extends UseDragResizeProps {
-  directions: ResizeDirection[];
+interface TableSetOptions {
+  table?: Config<typeof Table>;
+  tableRow?: Config<typeof TableRow>;
+  tableCell?: Config<typeof TableCell>;
+  tableHeader?: Config<typeof TableHeader>;
+  tableResize?: Config<typeof TableResize>;
+  tableControls?: Config<typeof TableControls>;
 }
-declare function NodeResizer({
-  directions,
-  limitSize,
-  ...props
-}: NodeResizerProps): react_jsx_runtime12.JSX.Element;
-//#endregion
-//#region src/editor/provider.d.ts
-interface EditorContextValue {
-  editor: Editor$2 | null;
+interface LayoutSetOptions {
+  tabs?: Config<typeof Tabs>;
+  tabTitle?: Config<typeof TabTitle>;
+  tabContent?: Config<typeof TabContent>;
+  align?: Config<typeof Align>;
+  details?: Config<typeof Details>;
+  detailsContent?: Config<typeof DetailsContent>;
+  detailsSummary?: Config<typeof DetailsSummary>;
 }
-interface EditorProviderProps {
-  editor: Editor$2 | null;
-  children: ReactNode;
+declare class Loader {
+  #private;
+  textset(options?: TextSetOptions): this;
+  mediaset(options?: MediaSetOptions): this;
+  tableset(options?: TableSetOptions): this;
+  layoutset(options?: LayoutSetOptions): this;
+  otherset(extensions?: Extensions): this;
+  init(): Extensions;
 }
-declare function EditorProvider({
-  editor,
-  children
-}: EditorProviderProps): react_jsx_runtime12.JSX.Element;
-declare function useEditorContext(): EditorContextValue;
-declare function useRequiredEditor(): Editor$2;
-declare function useOptionalEditor(): Editor$2 | null;
 //#endregion
-export { Editor, EditorProvider, NodeFrame, NodeFrameProps, NodeResizer, NodeResizerProps, NodeSize, NodeSizeProps, useEditorContext, useOptionalEditor, useRequiredEditor };
+export { type LayoutSetOptions, Loader, type MediaSetOptions, type TableSetOptions, type TextSetOptions };