@moda-editor/vue 0.1.3 → 0.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -1
- package/dist/EditorNode.vue +17 -32
- package/dist/EditorView.vue +15 -4
- package/dist/LibView.vue +35 -0
- package/dist/conformance.test.js +1 -1
- package/dist/conformance.test.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/useEditor.d.ts.map +1 -1
- package/dist/useEditor.js.map +1 -1
- package/dist/useLib.d.ts +21 -0
- package/dist/useLib.d.ts.map +1 -0
- package/dist/useLib.js +25 -0
- package/dist/useLib.js.map +1 -0
- package/dist/useWidget.d.ts.map +1 -1
- package/dist/useWidget.js +5 -1
- package/dist/useWidget.js.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -8,5 +8,7 @@ import { WidgetView, useWidget } from "@moda-editor/vue";
|
|
|
8
8
|
import "@moda-editor/vue/styles.css";
|
|
9
9
|
const { widget } = useWidget({ items, getItemText });
|
|
10
10
|
</script>
|
|
11
|
-
<template
|
|
11
|
+
<template>
|
|
12
|
+
<WidgetView :widget="widget" :get-item-text="getItemText" />
|
|
13
|
+
</template>
|
|
12
14
|
```
|
package/dist/EditorNode.vue
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
2
|
import { computed } from "vue";
|
|
3
3
|
import type { Component } from "vue";
|
|
4
|
-
import {
|
|
4
|
+
import { planAdapterNode } from "@moda-editor/core";
|
|
5
5
|
import type { Editor, RenderNode } from "@moda-editor/core";
|
|
6
6
|
|
|
7
7
|
// 자기 참조 재귀 컴포넌트 — RenderNode 트리를 DOM으로 번역한다.
|
|
@@ -12,33 +12,24 @@ const props = defineProps<{
|
|
|
12
12
|
nodeViews?: Record<string, Component>;
|
|
13
13
|
}>();
|
|
14
14
|
|
|
15
|
-
//
|
|
16
|
-
//
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
15
|
+
// 코어 렌더 계획 — 래퍼/아울렛의 data-me-path·ce·class 계약은
|
|
16
|
+
// planAdapterNode가 결정한다 (view/adapter.ts). 컴포넌트는
|
|
17
|
+
// NodeViewProps만 받는다
|
|
18
|
+
const plan = computed(() =>
|
|
19
|
+
planAdapterNode(props.node, {
|
|
20
|
+
schema: props.editor.state.schema,
|
|
21
|
+
nodeViews: props.nodeViews,
|
|
22
|
+
}),
|
|
22
23
|
);
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
);
|
|
26
|
-
// 비-atom 노드 뷰는 편집 가능한 콘텐츠 아울렛을 받는다 — data-me-path는
|
|
27
|
-
// 래퍼가 아닌 .me-node-content가 가져 컨테이너 포인트 매핑이 맞는다
|
|
28
|
-
const editable = computed(() =>
|
|
29
|
-
nodeViewEditable(props.editor.state.schema, props.node.source.type),
|
|
30
|
-
);
|
|
31
|
-
const wrapperAttrs = computed(() => ({
|
|
32
|
-
...(editable.value ? {} : { "data-me-path": props.node.path.join(",") }),
|
|
33
|
-
class: "me-node-view",
|
|
34
|
-
contenteditable: "false",
|
|
35
|
-
}));
|
|
24
|
+
// 노드 뷰 계획으로 좁힌 뷰 — 템플릿에서 nv.*로 바로 쓴다
|
|
25
|
+
const nv = computed(() => (plan.value.kind === "nodeView" ? plan.value : null));
|
|
26
|
+
const view = computed(() => nv.value?.view as Component | undefined);
|
|
36
27
|
</script>
|
|
37
28
|
|
|
38
29
|
<template>
|
|
39
30
|
<component
|
|
40
|
-
:is="
|
|
41
|
-
v-bind="
|
|
31
|
+
:is="nv ? nv.wrapperTag : node.tag"
|
|
32
|
+
v-bind="nv ? nv.wrapperAttrs : (node.attrs ?? {})"
|
|
42
33
|
>
|
|
43
34
|
<component
|
|
44
35
|
v-if="view"
|
|
@@ -47,17 +38,11 @@ const wrapperAttrs = computed(() => ({
|
|
|
47
38
|
:editor="editor"
|
|
48
39
|
:path="node.path"
|
|
49
40
|
>
|
|
50
|
-
<template v-if="editable" #content>
|
|
41
|
+
<template v-if="nv!.editable" #content>
|
|
51
42
|
<!-- 아울렛은 노드의 toDOM 태그/속성 — codeBlock이면 <pre> -->
|
|
52
|
-
<component
|
|
53
|
-
:is="node.tag"
|
|
54
|
-
v-bind="node.attrs ?? {}"
|
|
55
|
-
class="me-node-content"
|
|
56
|
-
contenteditable="true"
|
|
57
|
-
:data-me-path="node.path.join(',')"
|
|
58
|
-
>
|
|
43
|
+
<component :is="nv!.outletTag" v-bind="nv!.outletAttrs">
|
|
59
44
|
<EditorNode
|
|
60
|
-
v-for="c in
|
|
45
|
+
v-for="c in nv!.children"
|
|
61
46
|
:key="c.path.join(',')"
|
|
62
47
|
:node="c"
|
|
63
48
|
:editor="editor"
|
package/dist/EditorView.vue
CHANGED
|
@@ -8,7 +8,11 @@ import {
|
|
|
8
8
|
watch,
|
|
9
9
|
} from "vue";
|
|
10
10
|
import type { Component, PropType } from "vue";
|
|
11
|
-
import {
|
|
11
|
+
import {
|
|
12
|
+
bindEditorInput,
|
|
13
|
+
DirtyKeyMap,
|
|
14
|
+
renderChildren,
|
|
15
|
+
} from "@moda-editor/core";
|
|
12
16
|
import type {
|
|
13
17
|
DocNode,
|
|
14
18
|
Editor,
|
|
@@ -29,12 +33,18 @@ const { state } = useEditorState(props.editor);
|
|
|
29
33
|
// doc 참조가 바뀔 때만 RenderNode 배열을 재생성 — selection-only
|
|
30
34
|
// 변경이면 같은 배열이라 자식 vnode가 그대로 스킵된다
|
|
31
35
|
let cachedDoc: DocNode | null = null;
|
|
36
|
+
let cachedDecoKey = "";
|
|
32
37
|
let cachedNodes: RenderNode[] = [];
|
|
33
38
|
const nodes = computed(() => {
|
|
34
39
|
const s = state.value;
|
|
35
|
-
|
|
40
|
+
// 데코는 pluginState(doc 밖)에서 오므로 doc 참조만으론 못 잡는다 —
|
|
41
|
+
// 직렬화 키가 바뀌면 doc이 같아도 렌더 트리를 재생성한다
|
|
42
|
+
const decos = s.decorations();
|
|
43
|
+
const decoKey = decos.length ? JSON.stringify(decos) : "";
|
|
44
|
+
if (s.doc !== cachedDoc || decoKey !== cachedDecoKey) {
|
|
36
45
|
cachedDoc = s.doc;
|
|
37
|
-
|
|
46
|
+
cachedDecoKey = decoKey;
|
|
47
|
+
cachedNodes = renderChildren(s.doc, s.schema, decos);
|
|
38
48
|
}
|
|
39
49
|
return cachedNodes;
|
|
40
50
|
});
|
|
@@ -49,7 +59,8 @@ const keyOf = (n: RenderNode): string =>
|
|
|
49
59
|
dirtyKeys.key(n.path.join(","), binding?.dirtyPaths);
|
|
50
60
|
|
|
51
61
|
onMounted(() => {
|
|
52
|
-
if (editableEl.value)
|
|
62
|
+
if (editableEl.value)
|
|
63
|
+
binding = bindEditorInput(props.editor, editableEl.value);
|
|
53
64
|
});
|
|
54
65
|
// 리렌더 후 DOM에 doc 셀렉션 복원.
|
|
55
66
|
// 셀렉션만 바뀐 디스패치(Tab 셀 이동 등)는 nodes가 같은 배열이라
|
package/dist/LibView.vue
ADDED
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
<script setup lang="ts" generic="TData extends object = RowData">
|
|
2
|
+
import { LibCore } from "@moda-lib/core";
|
|
3
|
+
import type { RowData } from "@moda-lib/core";
|
|
4
|
+
import { useLibState } from "./useLib.js";
|
|
5
|
+
|
|
6
|
+
const props = withDefaults(
|
|
7
|
+
defineProps<{
|
|
8
|
+
lib: LibCore<TData>;
|
|
9
|
+
getItemText?: (item: TData) => string;
|
|
10
|
+
searchPlaceholder?: string;
|
|
11
|
+
}>(),
|
|
12
|
+
{ searchPlaceholder: "검색…" },
|
|
13
|
+
);
|
|
14
|
+
|
|
15
|
+
const { state } = useLibState(props.lib);
|
|
16
|
+
const textOf = (item: TData) =>
|
|
17
|
+
props.getItemText?.(item) ?? String(item);
|
|
18
|
+
</script>
|
|
19
|
+
|
|
20
|
+
<template>
|
|
21
|
+
<div class="ml-root">
|
|
22
|
+
<input
|
|
23
|
+
class="ml-search"
|
|
24
|
+
:placeholder="searchPlaceholder"
|
|
25
|
+
:value="state.searchText"
|
|
26
|
+
@input="lib.setSearch(($event.target as HTMLInputElement).value)"
|
|
27
|
+
/>
|
|
28
|
+
<ul class="ml-list">
|
|
29
|
+
<li v-for="(item, i) in state.filteredItems" :key="i" class="ml-item">
|
|
30
|
+
{{ textOf(item) }}
|
|
31
|
+
</li>
|
|
32
|
+
</ul>
|
|
33
|
+
<div class="ml-count">{{ state.filteredCount }} / {{ state.totalCount }}</div>
|
|
34
|
+
</div>
|
|
35
|
+
</template>
|
package/dist/conformance.test.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { createApp, defineComponent, h, nextTick } from "vue";
|
|
2
|
-
import { runEditorConformance, runWidgetConformance } from "@moda-editor/core/conformance";
|
|
2
|
+
import { runEditorConformance, runWidgetConformance, } from "@moda-editor/core/conformance";
|
|
3
3
|
import { WidgetCore } from "@moda-editor/core";
|
|
4
4
|
import WidgetView from "./WidgetView.vue";
|
|
5
5
|
import EditorView from "./EditorView.vue";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"conformance.test.js","sourceRoot":"","sources":["../src/conformance.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAC9D,OAAO,
|
|
1
|
+
{"version":3,"file":"conformance.test.js","sourceRoot":"","sources":["../src/conformance.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAC9D,OAAO,EACL,oBAAoB,EACpB,oBAAoB,GACrB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,UAAU,MAAM,kBAAkB,CAAC;AAC1C,OAAO,UAAU,MAAM,kBAAkB,CAAC;AAE1C,uDAAuD;AACvD,MAAM,YAAY,GAAG,eAAe,CAAC;IACnC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE;IACjD,MAAM;QACJ,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAAE;YAC3C,MAAM,CACH,IAAI,CAAC,IAAyC,CAAC,KAAK,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,CACvE;YACD,sCAAsC;YACtC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,EAAE,IAAI,EAAE,CAAC;SACtC,CAAC,CAAC;IACL,CAAC;CACF,CAAC,CAAC;AAEH,uDAAuD;AACvD,oBAAoB,CAAC,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE;IAC1C,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACzC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;IAC9B,MAAM,MAAM,GAAG,IAAI,UAAU,CAAC,IAAI,CAAC,CAAC;IACpC,MAAM,GAAG,GAAG,SAAS,CAAC,UAAU,EAAE;QAChC,MAAM;QACN,WAAW,EAAE,IAAI,CAAC,WAAW;KACrB,CAAC,CAAC;IACZ,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACd,OAAO;QACL,EAAE;QACF,KAAK,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE;QACvB,OAAO,EAAE,GAAG,EAAE;YACZ,GAAG,CAAC,OAAO,EAAE,CAAC;YACd,EAAE,CAAC,MAAM,EAAE,CAAC;QACd,CAAC;KACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oDAAoD;AACpD,oBAAoB,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE;IAC3D,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACzC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;IAC9B,MAAM,KAAK,GAAG,SAAS;QACrB,CAAC,CAAC,MAAM,CAAC,WAAW,CAChB,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;aACnB,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;aAC3B,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,YAAY,CAAC,CAAC,CACjC;QACH,CAAC,CAAC,SAAS,CAAC;IACd,MAAM,GAAG,GAAG,SAAS,CAAC,UAAU,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAW,CAAC,CAAC;IACzE,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACd,OAAO;QACL,EAAE;QACF,KAAK,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE;QACvB,OAAO,EAAE,GAAG,EAAE;YACZ,GAAG,CAAC,OAAO,EAAE,CAAC;YACd,EAAE,CAAC,MAAM,EAAE,CAAC;QACd,CAAC;KACF,CAAC;AACJ,CAAC,CAAC,CAAC"}
|
package/dist/index.d.ts
CHANGED
|
@@ -7,5 +7,5 @@ export type { UseWidgetReturn } from "./useWidget.js";
|
|
|
7
7
|
export type { Widget, WidgetCoreOptions, WidgetEventHandlers, WidgetEventMap, WidgetEventType, WidgetSnapshot, RowData, } from "@moda-editor/core";
|
|
8
8
|
export { WidgetCore } from "@moda-editor/core";
|
|
9
9
|
export type { DocNode, Editor, EditorNode, EditorOptions, EditorState, Extension, InputRule, Mark, NodeViewProps, } from "@moda-editor/core";
|
|
10
|
-
export { blockRule, blockText, blockTextOffset, canRedo, canUndo, createDoc, createText, isBlockActive, isInNode, isMarkActive, leafPoint, codeBracketAt, codeCaret, codeLangOptions, codeTextAt, duplicateCodeLines, moveCodeLines, toggleCodeComment, linkHrefAt, linkRangeAt, markRule, nodeAt, normalizedRange, pointEq, starterExtensions, textSelection, } from "@moda-editor/core";
|
|
10
|
+
export { blockRule, blockText, blockTextOffset, canRedo, canUndo, createDoc, createText, isBlockActive, isInNode, isMarkActive, leafPoint, codeBracketAt, codeCaret, codeLangOptions, codeTextAt, duplicateCodeLines, moveCodeLines, toggleCodeComment, linkHrefAt, linkRangeAt, markRule, nodeAt, normalizedRange, pointEq, mentionFeature, starterExtensions, textSelection, } from "@moda-editor/core";
|
|
11
11
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAC3D,YAAY,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAC3D,YAAY,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,YAAY,EACV,MAAM,EACN,iBAAiB,EACjB,mBAAmB,EACnB,cAAc,EACd,eAAe,EACf,cAAc,EACd,OAAO,GACR,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,YAAY,EACV,OAAO,EACP,MAAM,EACN,UAAU,EACV,aAAa,EACb,WAAW,EACX,SAAS,EACT,SAAS,EACT,IAAI,EACJ,aAAa,GACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,SAAS,EACT,SAAS,EACT,eAAe,EACf,OAAO,EACP,OAAO,EACP,SAAS,EACT,UAAU,EACV,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,aAAa,EACb,SAAS,EACT,eAAe,EACf,UAAU,EACV,kBAAkB,EAClB,aAAa,EACb,iBAAiB,EACjB,UAAU,EACV,WAAW,EACX,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,iBAAiB,EACjB,aAAa,GACd,MAAM,mBAAmB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAC3D,YAAY,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAC3D,YAAY,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AACtD,YAAY,EACV,MAAM,EACN,iBAAiB,EACjB,mBAAmB,EACnB,cAAc,EACd,eAAe,EACf,cAAc,EACd,OAAO,GACR,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,YAAY,EACV,OAAO,EACP,MAAM,EACN,UAAU,EACV,aAAa,EACb,WAAW,EACX,SAAS,EACT,SAAS,EACT,IAAI,EACJ,aAAa,GACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,SAAS,EACT,SAAS,EACT,eAAe,EACf,OAAO,EACP,OAAO,EACP,SAAS,EACT,UAAU,EACV,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,aAAa,EACb,SAAS,EACT,eAAe,EACf,UAAU,EACV,kBAAkB,EAClB,aAAa,EACb,iBAAiB,EACjB,UAAU,EACV,WAAW,EACX,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,cAAc,EACd,iBAAiB,EACjB,aAAa,GACd,MAAM,mBAAmB,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -3,5 +3,5 @@ export { useEditor, useEditorState } from "./useEditor.js";
|
|
|
3
3
|
export { default as WidgetView } from "./WidgetView.vue";
|
|
4
4
|
export { useWidget, useWidgetState } from "./useWidget.js";
|
|
5
5
|
export { WidgetCore } from "@moda-editor/core";
|
|
6
|
-
export { blockRule, blockText, blockTextOffset, canRedo, canUndo, createDoc, createText, isBlockActive, isInNode, isMarkActive, leafPoint, codeBracketAt, codeCaret, codeLangOptions, codeTextAt, duplicateCodeLines, moveCodeLines, toggleCodeComment, linkHrefAt, linkRangeAt, markRule, nodeAt, normalizedRange, pointEq, starterExtensions, textSelection, } from "@moda-editor/core";
|
|
6
|
+
export { blockRule, blockText, blockTextOffset, canRedo, canUndo, createDoc, createText, isBlockActive, isInNode, isMarkActive, leafPoint, codeBracketAt, codeCaret, codeLangOptions, codeTextAt, duplicateCodeLines, moveCodeLines, toggleCodeComment, linkHrefAt, linkRangeAt, markRule, nodeAt, normalizedRange, pointEq, mentionFeature, starterExtensions, textSelection, } from "@moda-editor/core";
|
|
7
7
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAE3D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAW3D,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAY/C,OAAO,EACL,SAAS,EACT,SAAS,EACT,eAAe,EACf,OAAO,EACP,OAAO,EACP,SAAS,EACT,UAAU,EACV,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,aAAa,EACb,SAAS,EACT,eAAe,EACf,UAAU,EACV,kBAAkB,EAClB,aAAa,EACb,iBAAiB,EACjB,UAAU,EACV,WAAW,EACX,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,iBAAiB,EACjB,aAAa,GACd,MAAM,mBAAmB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAE3D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAW3D,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAY/C,OAAO,EACL,SAAS,EACT,SAAS,EACT,eAAe,EACf,OAAO,EACP,OAAO,EACP,SAAS,EACT,UAAU,EACV,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,aAAa,EACb,SAAS,EACT,eAAe,EACf,UAAU,EACV,kBAAkB,EAClB,aAAa,EACb,iBAAiB,EACjB,UAAU,EACV,WAAW,EACX,QAAQ,EACR,MAAM,EACN,eAAe,EACf,OAAO,EACP,cAAc,EACd,iBAAiB,EACjB,aAAa,GACd,MAAM,mBAAmB,CAAC"}
|
package/dist/useEditor.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useEditor.d.ts","sourceRoot":"","sources":["../src/useEditor.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEtC,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"useEditor.d.ts","sourceRoot":"","sources":["../src/useEditor.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEtC,OAAO,KAAK,EAAE,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAE5E,MAAM,WAAW,eAAe;IAC9B,uCAAuC;IACvC,MAAM,EAAE,MAAM,CAAC;IACf,yCAAyC;IACzC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/B,WAAW,IAAI,IAAI,CAAC;CACrB;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,OAAO,GAAE,aAAkB,GAAG,eAAe,CAItE;AAED,kCAAkC;AAClC,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,GAAG;IAC9C,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/B,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,CAOA"}
|
package/dist/useEditor.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useEditor.js","sourceRoot":"","sources":["../src/useEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"useEditor.js","sourceRoot":"","sources":["../src/useEditor.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAWjD;;;GAGG;AACH,MAAM,UAAU,SAAS,CAAC,UAAyB,EAAE;IACnD,MAAM,MAAM,GAAG,YAAY,CAAC,OAAO,CAAC,CAAC;IACrC,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC;IACtD,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC;AACxC,CAAC;AAED,kCAAkC;AAClC,MAAM,UAAU,cAAc,CAAC,MAAc;IAI3C,MAAM,KAAK,GAAG,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IACvC,MAAM,WAAW,GAAG,MAAM,CAAC,SAAS,CAAC,GAAG,EAAE;QACxC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;IAC7B,CAAC,CAAC,CAAC;IACH,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;IAClC,OAAO,EAAE,KAAK,EAAE,KAAgC,EAAE,WAAW,EAAE,CAAC;AAClE,CAAC"}
|
package/dist/useLib.d.ts
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { ShallowRef } from "vue";
|
|
2
|
+
import { LibCore } from "@moda-lib/core";
|
|
3
|
+
import type { LibCoreOptions, LibSnapshot, RowData } from "@moda-lib/core";
|
|
4
|
+
export interface UseLibReturn<TData extends object = RowData> {
|
|
5
|
+
/** 헤드리스 코어 — 액션 호출용 */
|
|
6
|
+
lib: LibCore<TData>;
|
|
7
|
+
/** 렌더용 스냅샷 (ShallowRef — 통째 교체 구조) */
|
|
8
|
+
state: ShallowRef<LibSnapshot<TData>>;
|
|
9
|
+
unsubscribe(): void;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Vue 3 어댑터 composable — 코어 생성 + 스냅샷을 ShallowRef로 구독.
|
|
13
|
+
* 컴포넌트/이펙트 스코프 안에서 호출하면 onScopeDispose로 자동 해제된다.
|
|
14
|
+
*/
|
|
15
|
+
export declare function useLib<TData extends object = RowData>(options: LibCoreOptions<TData>): UseLibReturn<TData>;
|
|
16
|
+
/** 외부에서 만든 LibCore의 스냅샷만 구독한다 */
|
|
17
|
+
export declare function useLibState<TData extends object = RowData>(lib: LibCore<TData>): {
|
|
18
|
+
state: ShallowRef<LibSnapshot<TData>>;
|
|
19
|
+
unsubscribe: () => void;
|
|
20
|
+
};
|
|
21
|
+
//# sourceMappingURL=useLib.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useLib.d.ts","sourceRoot":"","sources":["../src/useLib.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,KAAK,EACV,cAAc,EACd,WAAW,EACX,OAAO,EACR,MAAM,gBAAgB,CAAC;AAExB,MAAM,WAAW,YAAY,CAAC,KAAK,SAAS,MAAM,GAAG,OAAO;IAC1D,uBAAuB;IACvB,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACpB,sCAAsC;IACtC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC;IACtC,WAAW,IAAI,IAAI,CAAC;CACrB;AAED;;;GAGG;AACH,wBAAgB,MAAM,CAAC,KAAK,SAAS,MAAM,GAAG,OAAO,EACnD,OAAO,EAAE,cAAc,CAAC,KAAK,CAAC,GAC7B,YAAY,CAAC,KAAK,CAAC,CAQrB;AAED,iCAAiC;AACjC,wBAAgB,WAAW,CAAC,KAAK,SAAS,MAAM,GAAG,OAAO,EACxD,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,GAClB;IAAE,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC;IAAC,WAAW,EAAE,MAAM,IAAI,CAAA;CAAE,CAOpE"}
|
package/dist/useLib.js
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { onScopeDispose, shallowRef } from "vue";
|
|
2
|
+
import { LibCore } from "@moda-lib/core";
|
|
3
|
+
/**
|
|
4
|
+
* Vue 3 어댑터 composable — 코어 생성 + 스냅샷을 ShallowRef로 구독.
|
|
5
|
+
* 컴포넌트/이펙트 스코프 안에서 호출하면 onScopeDispose로 자동 해제된다.
|
|
6
|
+
*/
|
|
7
|
+
export function useLib(options) {
|
|
8
|
+
const lib = new LibCore(options);
|
|
9
|
+
const state = shallowRef(lib.getSnapshot());
|
|
10
|
+
const unsubscribe = lib.subscribe(() => {
|
|
11
|
+
state.value = lib.getSnapshot();
|
|
12
|
+
});
|
|
13
|
+
onScopeDispose(unsubscribe, true);
|
|
14
|
+
return { lib, state: state, unsubscribe };
|
|
15
|
+
}
|
|
16
|
+
/** 외부에서 만든 LibCore의 스냅샷만 구독한다 */
|
|
17
|
+
export function useLibState(lib) {
|
|
18
|
+
const state = shallowRef(lib.getSnapshot());
|
|
19
|
+
const unsubscribe = lib.subscribe(() => {
|
|
20
|
+
state.value = lib.getSnapshot();
|
|
21
|
+
});
|
|
22
|
+
onScopeDispose(unsubscribe, true);
|
|
23
|
+
return { state: state, unsubscribe };
|
|
24
|
+
}
|
|
25
|
+
//# sourceMappingURL=useLib.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useLib.js","sourceRoot":"","sources":["../src/useLib.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAezC;;;GAGG;AACH,MAAM,UAAU,MAAM,CACpB,OAA8B;IAE9B,MAAM,GAAG,GAAG,IAAI,OAAO,CAAQ,OAAO,CAAC,CAAC;IACxC,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC;IAC5C,MAAM,WAAW,GAAG,GAAG,CAAC,SAAS,CAAC,GAAG,EAAE;QACrC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,WAAW,EAAE,CAAC;IAClC,CAAC,CAAC,CAAC;IACH,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;IAClC,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,KAAuC,EAAE,WAAW,EAAE,CAAC;AAC9E,CAAC;AAED,iCAAiC;AACjC,MAAM,UAAU,WAAW,CACzB,GAAmB;IAEnB,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC;IAC5C,MAAM,WAAW,GAAG,GAAG,CAAC,SAAS,CAAC,GAAG,EAAE;QACrC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,WAAW,EAAE,CAAC;IAClC,CAAC,CAAC,CAAC;IACH,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;IAClC,OAAO,EAAE,KAAK,EAAE,KAAuC,EAAE,WAAW,EAAE,CAAC;AACzE,CAAC"}
|
package/dist/useWidget.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useWidget.d.ts","sourceRoot":"","sources":["../src/useWidget.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"useWidget.d.ts","sourceRoot":"","sources":["../src/useWidget.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,KAAK,EACV,iBAAiB,EACjB,cAAc,EACd,OAAO,EACR,MAAM,mBAAmB,CAAC;AAE3B,MAAM,WAAW,eAAe,CAAC,KAAK,SAAS,MAAM,GAAG,OAAO;IAC7D,uBAAuB;IACvB,MAAM,EAAE,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,sCAAsC;IACtC,KAAK,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;IACzC,WAAW,IAAI,IAAI,CAAC;CACrB;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,KAAK,SAAS,MAAM,GAAG,OAAO,EACtD,OAAO,EAAE,iBAAiB,CAAC,KAAK,CAAC,GAChC,eAAe,CAAC,KAAK,CAAC,CAYxB;AAED,oCAAoC;AACpC,wBAAgB,cAAc,CAAC,KAAK,SAAS,MAAM,GAAG,OAAO,EAC3D,MAAM,EAAE,UAAU,CAAC,KAAK,CAAC,GACxB;IAAE,KAAK,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;IAAC,WAAW,EAAE,MAAM,IAAI,CAAA;CAAE,CAOvE"}
|
package/dist/useWidget.js
CHANGED
|
@@ -11,7 +11,11 @@ export function useWidget(options) {
|
|
|
11
11
|
state.value = widget.getSnapshot();
|
|
12
12
|
});
|
|
13
13
|
onScopeDispose(unsubscribe, true);
|
|
14
|
-
return {
|
|
14
|
+
return {
|
|
15
|
+
widget,
|
|
16
|
+
state: state,
|
|
17
|
+
unsubscribe,
|
|
18
|
+
};
|
|
15
19
|
}
|
|
16
20
|
/** 외부에서 만든 WidgetCore의 스냅샷만 구독한다 */
|
|
17
21
|
export function useWidgetState(widget) {
|
package/dist/useWidget.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useWidget.js","sourceRoot":"","sources":["../src/useWidget.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"useWidget.js","sourceRoot":"","sources":["../src/useWidget.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAe/C;;;GAGG;AACH,MAAM,UAAU,SAAS,CACvB,OAAiC;IAEjC,MAAM,MAAM,GAAG,IAAI,UAAU,CAAQ,OAAO,CAAC,CAAC;IAC9C,MAAM,KAAK,GAAG,UAAU,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,CAAC;IAC/C,MAAM,WAAW,GAAG,MAAM,CAAC,SAAS,CAAC,GAAG,EAAE;QACxC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC,WAAW,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;IACH,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;IAClC,OAAO;QACL,MAAM;QACN,KAAK,EAAE,KAA0C;QACjD,WAAW;KACZ,CAAC;AACJ,CAAC;AAED,oCAAoC;AACpC,MAAM,UAAU,cAAc,CAC5B,MAAyB;IAEzB,MAAM,KAAK,GAAG,UAAU,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,CAAC;IAC/C,MAAM,WAAW,GAAG,MAAM,CAAC,SAAS,CAAC,GAAG,EAAE;QACxC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC,WAAW,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;IACH,cAAc,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;IAClC,OAAO,EAAE,KAAK,EAAE,KAA0C,EAAE,WAAW,EAAE,CAAC;AAC5E,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@moda-editor/vue",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.5",
|
|
4
4
|
"description": "Vue 3 adapter for @moda-editor — useWidget + WidgetView",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"library"
|
|
29
29
|
],
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@moda-editor/core": "0.1.
|
|
31
|
+
"@moda-editor/core": "0.1.5"
|
|
32
32
|
},
|
|
33
33
|
"peerDependencies": {
|
|
34
34
|
"vue": ">=3.3.0"
|