@moda-editor/core 0.1.3 → 0.1.5

package/dist/conformance/index.js

@@ -0,0 +1,28 @@
+import { describe } from "vitest";
+import { editorBaseSpec } from "./editor-base.js";
+import { editorCodeblockSpec } from "./editor-codeblock.js";
+import { editorImeSpec } from "./editor-ime.js";
+import { editorInputSpec } from "./editor-input.js";
+import { editorNodeviewSpec } from "./editor-nodeview.js";
+import { editorOverlaySpec } from "./editor-overlay.js";
+/**
+ * 에디터 어댑터 공통 DOM 계약 — 5개 렌더러가 같은 구조를 출력한다:
+ *   .me-root > .me-editor[contenteditable][data-me-path=""]
+ *     > [data-me-path="0"], [data-me-path="1"] … 블록 엘리먼트
+ * 트랜잭션 디스패치 → DOM 갱신, destroy → 정리까지 검증한다.
+ *
+ * 스펙 본체는 섹션별 모듈에 나뉘어 있다 — 각 `editor*Spec()`은
+ * 이 describe 안에서 it 블록을 등록하는 함수다.
+ */
+export function runEditorConformance(label, mount) {
+    describe(`${label} 에디터 렌더 계약`, () => {
+        editorBaseSpec(mount);
+        editorNodeviewSpec(mount);
+        editorInputSpec(mount);
+        editorCodeblockSpec(mount);
+        editorImeSpec(mount);
+        editorOverlaySpec(mount);
+    });
+}
+export { runWidgetConformance } from "./widget.js";
+//# sourceMappingURL=index.js.map

package/dist/conformance/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/conformance/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAClC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGxD;;;;;;;;GAQG;AACH,MAAM,UAAU,oBAAoB,CAClC,KAAa,EACb,KAA6B;IAE7B,QAAQ,CAAC,GAAG,KAAK,YAAY,EAAE,GAAG,EAAE;QAClC,cAAc,CAAC,KAAK,CAAC,CAAC;QACtB,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC1B,eAAe,CAAC,KAAK,CAAC,CAAC;QACvB,mBAAmB,CAAC,KAAK,CAAC,CAAC;QAC3B,aAAa,CAAC,KAAK,CAAC,CAAC;QACrB,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,CAAC,CAAC;AACL,CAAC;AAQD,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC"}

package/dist/conformance/types.d.ts

@@ -0,0 +1,51 @@
+import type { Editor } from "../editor/editor.js";
+/**
+ * 어댑터 공통 렌더 계약 (conformance) 스펙.
+ *
+ * 5개 렌더러(React/Vue3/Vue2/Svelte/mountWidget)가 같은 UI를 각각 구현한다.
+ * 기능 추가 시 한쪽이 빠지는 회귀를 막기 위해, 동일한 옵션에 대한 DOM
+ * 계약을 여기에 한 번만 선언하고 각 어댑터의 vitest가 자기 마운트 함수를
+ * 주입해 실행한다.
+ *
+ *   runWidgetConformance("vue3", async (opts) => {
+ *     const el = document.createElement("div");
+ *     const app = createApp(WidgetView, opts);
+ *     app.mount(el);
+ *     return { el, flush: nextTick, destroy: () => app.unmount() };
+ *   });
+ *
+ * 새 기능을 추가할 때는 여기에 계약(선택자 + 상호작용 + 기대 DOM)을 추가한다 —
+ * 그러면 5개 렌더러 전부에서 자동으로 검증된다.
+ */
+/** 스펙이 사용하는 고정 픽스처 항목 */
+export interface ConformanceItem {
+    id: number;
+    label: string;
+}
+/** 어댑터 마운트 결과 — 스펙이 상호작용/단언하는 대상 */
+export interface MountedWidgetHandle {
+    /** 컴포넌트가 렌더된 컨테이너 (마운트 직후 1차 렌더 완료 상태) */
+    el: HTMLElement;
+    /**
+     * DOM 반영 대기. 액션(입력 등) 후 호출된다.
+     * vue/svelte은 nextTick/tick, react는 act, vanilla는 생략 가능.
+     */
+    flush?: () => void | Promise<void>;
+    destroy(): void;
+}
+/** 각 어댑터가 구현하는 마운트 함수 — opts를 자기 props/옵션으로 번역한다 */
+export type ConformanceMount = (opts: {
+    items: ConformanceItem[];
+    getItemText?: (item: ConformanceItem) => string;
+}) => MountedWidgetHandle | Promise<MountedWidgetHandle>;
+/** 에디터 어댑터 마운트 함수 — editor를 자기 props로 번역한다 */
+export type EditorConformanceMount = (opts: {
+    editor: Editor;
+    /**
+     * nodeViews[타입]이 truthy면 그 타입의 표준 컨포먼스 뷰를 등록한다 —
+     * 어댑터는 자기 프레임워크의 컴포넌트로 번역하고, 그 컴포넌트는
+     * `.me-custom-view` 클래스에 `node.attrs.label`을 출력해야 한다.
+     */
+    nodeViews?: Record<string, unknown>;
+}) => MountedWidgetHandle | Promise<MountedWidgetHandle>;
+//# sourceMappingURL=types.d.ts.map

package/dist/conformance/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/conformance/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAElD;;;;;;;;;;;;;;;;;GAiBG;AAEH,yBAAyB;AACzB,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,oCAAoC;AACpC,MAAM,WAAW,mBAAmB;IAClC,0CAA0C;IAC1C,EAAE,EAAE,WAAW,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACnC,OAAO,IAAI,IAAI,CAAC;CACjB;AAED,oDAAoD;AACpD,MAAM,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE;IACpC,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,MAAM,CAAC;CACjD,KAAK,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;AAEzD,8CAA8C;AAC9C,MAAM,MAAM,sBAAsB,GAAG,CAAC,IAAI,EAAE;IAC1C,MAAM,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACrC,KAAK,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC"}

package/dist/conformance/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/conformance/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/conformance/types.ts"],"names":[],"mappings":""}

package/dist/conformance/widget.d.ts

@@ -0,0 +1,3 @@
+import type { ConformanceMount } from "./types.js";
+export declare function runWidgetConformance(label: string, mount: ConformanceMount): void;
+//# sourceMappingURL=widget.d.ts.map

package/dist/conformance/widget.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"widget.d.ts","sourceRoot":"","sources":["../../src/conformance/widget.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAmBpE,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,gBAAgB,GACtB,IAAI,CAqCN"}

package/dist/conformance/widget.js

@@ -0,0 +1,49 @@
+import { describe, expect, it } from "vitest";
+/** 마운트 헬퍼 — 매 테스트마다 새 픽스처+새 인스턴스 */
+async function mountSpecWidget(mount) {
+    const items = [
+        { id: 1, label: "사과" },
+        { id: 2, label: "바나나" },
+        { id: 3, label: "사과파이" },
+    ];
+    const m = await mount({
+        items,
+        getItemText: (i) => i.label,
+    });
+    const flush = async () => {
+        await m.flush?.();
+    };
+    return { ...m, items, flush };
+}
+export function runWidgetConformance(label, mount) {
+    describe(`${label} 렌더 계약`, () => {
+        it("검색 입력·목록·카운터를 렌더한다", async () => {
+            const { el, destroy } = await mountSpecWidget(mount);
+            expect(el.querySelector(".me-search")).toBeTruthy();
+            expect(el.querySelectorAll(".me-item").length).toBe(3);
+            expect(el.querySelector(".me-count")?.textContent).toContain("3");
+            destroy();
+        });
+        it("검색 입력에 타이핑하면 목록이 필터된다", async () => {
+            const { el, flush, destroy } = await mountSpecWidget(mount);
+            const input = el.querySelector(".me-search");
+            // React의 controlled input은 .value 직접 대입을 추적하지 못한다 —
+            // 네이티브 setter로 우회해 input 이벤트가 실제 타이핑처럼 보이게 한다
+            const setValue = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value").set;
+            setValue.call(input, "사과");
+            input.dispatchEvent(new Event("input", { bubbles: true }));
+            await flush();
+            // Vue2는 보간 주변에 공백을 렌더한다 — trim으로 렌더러 편차를 흡수
+            const labels = [...el.querySelectorAll(".me-item")].map((n) => n.textContent?.trim());
+            expect(labels).toEqual(["사과", "사과파이"]);
+            expect(el.querySelector(".me-count")?.textContent).toContain("2");
+            destroy();
+        });
+        it("destroy 후 루트를 제거한다", async () => {
+            const { el, destroy } = await mountSpecWidget(mount);
+            destroy();
+            expect(el.querySelector(".me-list")).toBeNull();
+        });
+    });
+}
+//# sourceMappingURL=widget.js.map

package/dist/conformance/widget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"widget.js","sourceRoot":"","sources":["../../src/conformance/widget.ts"],"names":[],"mappings":"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"}

package/dist/conformance.d.ts

@@ -1,59 +1,2 @@
-import type { Editor } from "./editor/editor.js";
-/**
- * 어댑터 공통 렌더 계약 (conformance) 스펙.
- *
- * 5개 렌더러(React/Vue3/Vue2/Svelte/mountWidget)가 같은 UI를 각각 구현한다.
- * 기능 추가 시 한쪽이 빠지는 회귀를 막기 위해, 동일한 옵션에 대한 DOM
- * 계약을 여기에 한 번만 선언하고 각 어댑터의 vitest가 자기 마운트 함수를
- * 주입해 실행한다.
- *
- *   runWidgetConformance("vue3", async (opts) => {
- *     const el = document.createElement("div");
- *     const app = createApp(WidgetView, opts);
- *     app.mount(el);
- *     return { el, flush: nextTick, destroy: () => app.unmount() };
- *   });
- *
- * 새 기능을 추가할 때는 여기에 계약(선택자 + 상호작용 + 기대 DOM)을 추가한다 —
- * 그러면 5개 렌더러 전부에서 자동으로 검증된다.
- */
-/** 스펙이 사용하는 고정 픽스처 항목 */
-export interface ConformanceItem {
-    id: number;
-    label: string;
-}
-/** 어댑터 마운트 결과 — 스펙이 상호작용/단언하는 대상 */
-export interface MountedWidgetHandle {
-    /** 컴포넌트가 렌더된 컨테이너 (마운트 직후 1차 렌더 완료 상태) */
-    el: HTMLElement;
-    /**
-     * DOM 반영 대기. 액션(입력 등) 후 호출된다.
-     * vue/svelte은 nextTick/tick, react는 act, vanilla는 생략 가능.
-     */
-    flush?: () => void | Promise<void>;
-    destroy(): void;
-}
-/** 각 어댑터가 구현하는 마운트 함수 — opts를 자기 props/옵션으로 번역한다 */
-export type ConformanceMount = (opts: {
-    items: ConformanceItem[];
-    getItemText?: (item: ConformanceItem) => string;
-}) => MountedWidgetHandle | Promise<MountedWidgetHandle>;
-export declare function runWidgetConformance(label: string, mount: ConformanceMount): void;
-/** 에디터 어댑터 마운트 함수 — editor를 자기 props로 번역한다 */
-export type EditorConformanceMount = (opts: {
-    editor: Editor;
-    /**
-     * nodeViews[타입]이 truthy면 그 타입의 표준 컨포먼스 뷰를 등록한다 —
-     * 어댑터는 자기 프레임워크의 컴포넌트로 번역하고, 그 컴포넌트는
-     * `.me-custom-view` 클래스에 `node.attrs.label`을 출력해야 한다.
-     */
-    nodeViews?: Record<string, unknown>;
-}) => MountedWidgetHandle | Promise<MountedWidgetHandle>;
-/**
- * 에디터 어댑터 공통 DOM 계약 — 5개 렌더러가 같은 구조를 출력한다:
- *   .me-root > .me-editor[contenteditable][data-me-path=""]
- *     > [data-me-path="0"], [data-me-path="1"] … 블록 엘리먼트
- * 트랜잭션 디스패치 → DOM 갱신, destroy → 정리까지 검증한다.
- */
-export declare function runEditorConformance(label: string, mount: EditorConformanceMount): void;
+export * from "./conformance/index.js";
 //# sourceMappingURL=conformance.d.ts.map

package/dist/conformance.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conformance.d.ts","sourceRoot":"","sources":["../src/conformance.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAQjD;;;;;;;;;;;;;;;;;GAiBG;AAEH,yBAAyB;AACzB,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,oCAAoC;AACpC,MAAM,WAAW,mBAAmB;IAClC,0CAA0C;IAC1C,EAAE,EAAE,WAAW,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACnC,OAAO,IAAI,IAAI,CAAC;CACjB;AAED,oDAAoD;AACpD,MAAM,MAAM,gBAAgB,GAAG,CAAC,IAAI,EAAE;IACpC,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,MAAM,CAAC;CACjD,KAAK,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;AAmBzD,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,gBAAgB,GACtB,IAAI,CAqCN;AAID,8CAA8C;AAC9C,MAAM,MAAM,sBAAsB,GAAG,CAAC,IAAI,EAAE;IAC1C,MAAM,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACrC,KAAK,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC;AAczD;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,sBAAsB,GAC5B,IAAI,CAyzDN"}
+{"version":3,"file":"conformance.d.ts","sourceRoot":"","sources":["../src/conformance.ts"],"names":[],"mappings":"AAEA,cAAc,wBAAwB,CAAC"}