@witchcraft/editor 0.0.3 → 0.0.5

package/dist/runtime/pm/features/DocumentApi/utils/copyMeta.js

@@ -1,6 +0,0 @@
-import { keys } from "@alanscodelog/utils/keys";
-export function copyMeta(from, to) {
-  for (const key of keys(from.meta)) {
-    to.setMeta(key, from.getMeta(key));
-  }
-}

package/dist/runtime/pm/features/DocumentApi/utils/getEmbedJson.d.ts

@@ -1 +0,0 @@
-export declare function getEmbedJson(nodeWanted: Record<string, any> | undefined): Record<string, any> | undefined;

package/dist/runtime/pm/features/DocumentApi/utils/getEmbedJson.js

@@ -1,14 +0,0 @@
-export function getEmbedJson(nodeWanted) {
-  if (nodeWanted) {
-    return {
-      type: "doc",
-      content: [
-        {
-          type: "list",
-          content: [nodeWanted]
-        }
-      ]
-    };
-  }
-  return void 0;
-}

package/dist/runtime/pm/features/DocumentApi/utils/getEmbedNodeFromDoc.d.ts

@@ -1 +0,0 @@
-export declare function getEmbedNodeFromDoc(json: Record<string, any>, subId: string | undefined): Record<string, any> | undefined;

package/dist/runtime/pm/features/DocumentApi/utils/getEmbedNodeFromDoc.js

@@ -1,14 +0,0 @@
-import { walk } from "@alanscodelog/utils/walk";
-export function getEmbedNodeFromDoc(json, subId) {
-  if (!subId) return;
-  let nodeWanted;
-  walk(json.content, (el) => {
-    if (!nodeWanted && el && el.type === "item") {
-      if (el.attrs.blockId === subId) {
-        nodeWanted = el;
-      }
-    }
-    return el;
-  }, { before: true });
-  return nodeWanted;
-}

package/dist/runtime/pm/features/DocumentApi/utils/getStateEmbedRange.d.ts

@@ -1,9 +0,0 @@
-import type { Node } from "@tiptap/pm/model";
-import type { BlockId } from "../types.js.js";
-export declare function getStateEmbedRange(doc: Node, blockId: BlockId): {
-    start: number;
-    end: number;
-} | {
-    start: undefined;
-    end: undefined;
-};

package/dist/runtime/pm/features/DocumentApi/utils/getStateEmbedRange.js

@@ -1,19 +0,0 @@
-export function getStateEmbedRange(doc, blockId) {
-  const id = blockId.blockId;
-  let start;
-  let end;
-  doc.nodesBetween(0, doc.content.size, (node, pos) => {
-    if (start === void 0 && node.type.name === "item" && node.attrs.blockId === id) {
-      start = pos;
-      end = pos + node.nodeSize;
-      return false;
-    }
-    if (start !== void 0) return false;
-    return true;
-  });
-  if (start === void 0 || end === void 0) {
-    return { start: void 0, end: void 0 };
-  } else {
-    return { start, end };
-  }
-}

package/dist/runtime/pm/features/DocumentApi/utils/isEmbedId.d.ts

@@ -1,2 +0,0 @@
-import type { EmbedId, MaybeEmbedId } from "../types.js.js";
-export declare function isEmbedId(embedId: MaybeEmbedId): embedId is EmbedId;

package/dist/runtime/pm/features/DocumentApi/utils/isEmbedId.js

@@ -1,3 +0,0 @@
-export function isEmbedId(embedId) {
-  return embedId.docId !== void 0;
-}

package/dist/runtime/pm/features/EmbeddedDocument/Embedded.d.ts

@@ -1,24 +0,0 @@
-import { Extension } from "@tiptap/core";
-import type { EmbeddedDocumentNodeOptions } from "./types.js.js";
-declare module "@tiptap/core" {
-    interface Commands<ReturnType> {
-        embeddedCommandRedirect: {
-            embeddedCommandRedirect: (commandName: string, args: any) => ReturnType;
-        };
-    }
-}
-/**
-    * This is for "internal" use by the embedded editor only.
-    *
-    * It should not be registered by the root editor or the documentApi.
-    *
-    * It provides some additional communication between the embedded editor and the root editor.
-    *
-    * See {@link EmbeddedDocumentNodeOptions.embeddedBlockCommandRedirect} for more info.
-    *
-    * See also {@link redirectFromEmbedded} for creating redirectable commands.
-    *
-    * This extension should always be configured with the root editor and the getPos function from the embedded node view.
-    *
-    */
-export declare const Embedded: Extension<EmbeddedDocumentNodeOptions, any>;

package/dist/runtime/pm/features/EmbeddedDocument/Embedded.js

@@ -1,73 +0,0 @@
-import { Extension } from "@tiptap/core";
-import { TextSelection } from "@tiptap/pm/state";
-export const Embedded = Extension.create({
-  name: "embedded",
-  addOptions() {
-    return {
-      embeddedBlockCommandRedirect: void 0,
-      getPos: void 0,
-      rootEditor: void 0,
-      getEmbedId: void 0
-    };
-  },
-  addCommands() {
-    if (!this.options.rootEditor) {
-      throw new Error("Embedded: Extension must be configured with the root editor.");
-    }
-    if (!this.options.getPos) {
-      throw new Error("Embedded: Extension must be configured with the getPos function.");
-    }
-    if (!this.options.getEmbedId) {
-      throw new Error("Embedded: Extension must be configured with the getEmbedId function.");
-    }
-    const { rootEditor, getPos, getEmbedId } = this.options;
-    return {
-      embeddedCommandRedirect: (commandName, args) => ({ editor, dispatch }) => {
-        const embedId = getEmbedId();
-        const nodePos = getPos();
-        if (this.options.embeddedBlockCommandRedirect) {
-          const res = this.options.embeddedBlockCommandRedirect(commandName, args, { editor, rootEditor, nodePos, embedId, dispatch });
-          if (res !== void 0) return res;
-        }
-        switch (commandName) {
-          case "insertFile":
-            return rootEditor.commands.insertFile(args[0], nodePos);
-          case "splitItem":
-            if (!nodePos) return false;
-            return rootEditor.commands.command(({ tr, commands, state, dispatch: dispatch2 }) => {
-              const from = nodePos;
-              const schema = state.schema;
-              if (schema.nodes.item) {
-                if (!dispatch2) return true;
-                const node = schema.nodes.item.createAndFill();
-                if (!node) return false;
-                tr.insert(from + 1, node);
-                tr.setSelection(TextSelection.create(tr.doc, from + 3));
-                commands.focus();
-                return true;
-              }
-              return false;
-            });
-          case "indentItem":
-            if (!nodePos) return false;
-            return rootEditor.commands.command(() => {
-              rootEditor.commands.indentItem(nodePos);
-              rootEditor.commands.setNodeSelection(nodePos + 2);
-              return true;
-            });
-          case "unindentItem":
-            if (!nodePos) return false;
-            return rootEditor.commands.command(() => {
-              rootEditor.commands.unindentItem(nodePos);
-              rootEditor.commands.setNodeSelection(nodePos - 2);
-              return true;
-            });
-          default:
-            console.warn(`No redirect handler found for command ${commandName}`);
-            break;
-        }
-        return false;
-      }
-    };
-  }
-});

package/dist/runtime/pm/features/EmbeddedDocument/EmbeddedDocument.d.ts

@@ -1,23 +0,0 @@
-import { Node } from "@tiptap/core";
-import type { HTMLAttributesOptions } from "../../../types/index.js.js";
-declare module "@tiptap/core" {
-    interface Commands<ReturnType> {
-        embeddedDocument: {};
-    }
-}
-/**
- * Extension that adds support for embedded documents.
- *
- * Must be used with the provided `History` extension instead of the normal one.
- *
- * The node view provides `isEmbedded` and `isDeepEmbedded` for any child component instances.
- *
- * If using a custom editor wrapper, you will need to:
- *
- * - Provide the custom editor wrapper component with the {@link embeddedEditorComponentInjectionKey} injection key. The component should expose the tiptap editor instance with `defineExpose` as the `editor` property.
- * - Provide the document api by creating an instance of the {@link DocumentApi} class and providing it with the {@link documentApiInjectionKey}.
- * - Provide a ref to it's document's id with the {@link parentEditorIdInjectionKey} if it's using ids to load documents so that the EmbeddedNodeview can detect circular embeds and avoid rendering them.
- * - Add the class `editor-is-embedded-block` to the editor wrapper (it must be the immediate parent of view.dom) so commands such as enter can check if they should act differently. See {@link isEmbeddedBlock}.
- */
-export declare const EmbeddedDocument: Node<HTMLAttributesOptions, any>;
-export type NodeEmbeddedDocumentName = "embeddedDoc";

package/dist/runtime/pm/features/EmbeddedDocument/EmbeddedDocument.js

@@ -1,70 +0,0 @@
-import { isBlank } from "@alanscodelog/utils/isBlank";
-import { mergeAttributes, Node } from "@tiptap/core";
-import { VueNodeViewRenderer } from "@tiptap/vue-3";
-import EmbeddedNodeView from "./components/EmbeddedNodeView.vue";
-import { isValidId } from "../Blocks/utils/isValidId.js";
-export const EmbeddedDocument = Node.create({
-  name: "embeddedDoc",
-  group: "block",
-  draggable: false,
-  atom: true,
-  // defining: true,
-  addNodeView() {
-    return VueNodeViewRenderer(EmbeddedNodeView, {
-      stopEvent() {
-        return true;
-      },
-      ignoreMutation() {
-        return true;
-      }
-    });
-  },
-  addOptions() {
-    return {
-      HTMLAttributes: {
-        default: {}
-      }
-    };
-  },
-  addAttributes() {
-    return {
-      embedId: {
-        default: { docId: void 0, blockId: void 0 }
-      }
-    };
-  },
-  parseHTML() {
-    return [{
-      tag: `div[type=${this.name}]`,
-      getAttrs: (element) => {
-        const docId = element.getAttribute("embeddocid");
-        if (docId === void 0 || docId === null) {
-          return false;
-        }
-        if (isBlank(docId) || !isValidId(docId)) {
-          return { embedId: { docId: void 0, blockId: void 0 } };
-        }
-        const blockId = element.getAttribute("embedblockid");
-        return {
-          embedId: {
-            docId: isBlank(docId) || !isValidId(docId) ? void 0 : docId,
-            blockId
-          }
-        };
-      }
-    }];
-  },
-  // eslint-disable-next-line @typescript-eslint/naming-convention
-  renderHTML({ HTMLAttributes }) {
-    const mergedHTMLAttributes = mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, {
-      embeddocid: HTMLAttributes.embedId.docId ?? "",
-      embedblockid: HTMLAttributes.embedId.blockId,
-      type: this.name
-    });
-    delete mergedHTMLAttributes.embedId;
-    return [
-      "div",
-      mergedHTMLAttributes
-    ];
-  }
-});

package/dist/runtime/pm/features/EmbeddedDocument/components/EmbeddedDocumentPicker.d.vue.ts

@@ -1,14 +0,0 @@
-import { type MaybeEmbedId } from "../../DocumentApi/types.js.js";
-type __VLS_Props = {
-    embedId: MaybeEmbedId;
-    /** We need this, otherwise prosemirror? gets in an infinite loop because the component is not actually displayed? I think... Chrome debugger freezes completely. */
-    isShown: boolean;
-};
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    cancel: () => any;
-    submit: (embedId: MaybeEmbedId) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onCancel?: (() => any) | undefined;
-    onSubmit?: ((embedId: MaybeEmbedId) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/runtime/pm/features/EmbeddedDocument/components/EmbeddedDocumentPicker.vue

@@ -1,171 +0,0 @@
-<template>
-<!-- v-if is to prevent styles from existing/getting applied to other documents when the popup is hidden, and also not having v-if on the editor causes problems with prosemirror -->
-<div
-	v-if="isShown"
-	class="
-		embedded-document-picker
-		w-[calc(100dvw-var(--spacing-20))]
-		max-h-[calc(100dvh-var(--spacing-20))]
-		overflow-auto
-		bg-neutral-100
-		dark:bg-neutral-900
-		p-2
-		rounded-sm
-		flex-1
-		flex
-		flex-col
-		gap-2
-	"
->
-	<component
-		:is="'style'"
-	>
-		.embedded-document-picker li[blockid="{{ newEmbedId.blockId }}"]:not(:has(li:hover)):after {
-		border-color: rgb(var(--color-accent-500));
-		}
-		.embedded-document-picker li[blockid="{{ newEmbedId.blockId }}"]:has(li:hover):after {
-		border-color: rgb(var(--color-accent-500)/50%);
-		}
-	</component>
-	<!-- @vue-expect-error -->
-	<WSimpleInput
-		placeholder="Change document."
-		suggestions-class="max-h-[200px] overflow-y-auto"
-		:suggestions="searchSuggestions"
-		:suggestion-label="(suggestion) => suggestion.title"
-		:restrict-to-suggestions="false"
-		ref="inputComponent"
-		v-model="searchString"
-		@submit="pickDocId"
-	>
-		<!-- @vue-expect-error -->
-		<template
-			v-if="searchLoading"
-			#right
-		>
-			<WIcon><i-line-md-loading-loop/></WIcon>
-		</template>
-		<!-- @vue-expect-error -->
-		<template #suggestion-item="{ item }">
-			{{ item.title }}
-		</template>
-	</WSimpleInput>
-	<WCheckbox v-model="embedFullDocument">
-		Embed Full Document
-	</WCheckbox>
-	<div
-		v-if="!embedFullDocument && newEmbedId.docId"
-		class="border border-neutral-500 rounded-sm"
-	>
-		<div class="bg-neutral-200 dark:bg-neutral-800 rounded-t-sm p-1">
-			Pick a block to embed:
-		</div>
-		<div
-			class="
-			flex-1
-			[&_li]:after:rounded-sm
-			[&_li]:after:border-2
-			[&_li]:after:border-transparent
-			[&_li]:after:content-['']
-			[&_li]:after:absolute
-			[&_li]:after:inset-[-3px]
-			[&_li]:after:transition-all
-			[&_li]:cursor-pointer
-			[&_li]:after:pointer-events-none
-			[&_li:hover:not(:has(li:hover))]:after:content-['']
-			[&_li:hover:not(:has(li:hover))]:after:border-accent-500
-			[&_li:hover:not(:has(li:hover))]:after:bg-accent-500/30
-			[&_li:hover:not(:has(li:hover))]:after:pointer-events-none
-			[&_li:hover:not(:has(li:hover))]:pointer-events-all
-			[&_a]:pointer-events-none
-			overflow-y-auto
-			p-2
-		"
-			@pointerdown.prevent
-			@pointerup.prevent="pickBlockId"
-		>
-			<!-- @vue-expect-error -->
-			<Editor
-				:is-embedded="true"
-				:doc-id="newEmbedId.docId"
-				:editor-options="{ editable: false }"
-			/>
-		</div>
-	</div>
-	<div class="flex flex-row no-wrap gap-2 justify-end">
-		<!-- @vue-expect-error -->
-		<WButton
-			color="danger"
-			@click="emit('cancel')"
-		>
-			Cancel
-		</WButton>
-		<!-- @vue-expect-error -->
-		<WButton
-			color="ok"
-			@click="submit"
-		>
-			Submit
-		</WButton>
-	</div>
-</div>
-</template>
-
-<script setup>
-import WIcon from "@witchcraft/ui/components/Icon";
-import WButton from "@witchcraft/ui/components/LibButton";
-import WCheckbox from "@witchcraft/ui/components/LibCheckbox";
-import WSimpleInput from "@witchcraft/ui/components/LibSimpleInput";
-import { inject, nextTick, provide, ref, toRef, watch } from "vue";
-import ILineMdLoadingLoop from "~icons/line-md/loading-loop";
-import Editor from "../../../../components/Editor.vue";
-import { documentApiInjectionKey } from "../../DocumentApi/types.js";
-import { isDeepEmbeddedInjectionKey } from "../types.js";
-const props = defineProps({
-  embedId: { type: Object, required: true },
-  isShown: { type: Boolean, required: true }
-});
-const emit = defineEmits(["submit", "cancel"]);
-const embedId = toRef(props, "embedId");
-const newEmbedId = ref({ ...props.embedId });
-const documentApi = inject(documentApiInjectionKey);
-provide(isDeepEmbeddedInjectionKey, true);
-function pickBlockId(e) {
-  const el = e.target;
-  const item = el.closest(".item-content");
-  const id = item?.getAttribute("blockid");
-  if (id) {
-    newEmbedId.value.blockId = id;
-  }
-}
-const justPicked = ref(false);
-const inputComponent = ref(null);
-const searchString = ref("");
-const searchLoading = ref(false);
-const searchSuggestions = ref([]);
-watch(searchString, async (newVal) => {
-  if (justPicked.value) return;
-  searchLoading.value = true;
-  inputComponent.value?.suggestionsComponent?.suggestions.close();
-  searchSuggestions.value = await documentApi.getSuggestions(newVal);
-  inputComponent.value?.suggestionsComponent?.suggestions.open();
-  searchLoading.value = false;
-}, { immediate: true });
-function pickDocId(_val, suggestion) {
-  if (suggestion?.docId) {
-    newEmbedId.value.docId = suggestion.docId;
-    justPicked.value = true;
-    nextTick(() => {
-      justPicked.value = false;
-    });
-  }
-}
-const embedFullDocument = ref(embedId.value.blockId === void 0);
-function submit() {
-  if (embedFullDocument.value) {
-    emit("submit", { ...newEmbedId.value, blockId: void 0 });
-  } else {
-    emit("submit", newEmbedId.value);
-  }
-}
-</script>

package/dist/runtime/pm/features/EmbeddedDocument/components/EmbeddedDocumentPicker.vue.d.ts

@@ -1,14 +0,0 @@
-import { type MaybeEmbedId } from "../../DocumentApi/types.js.js";
-type __VLS_Props = {
-    embedId: MaybeEmbedId;
-    /** We need this, otherwise prosemirror? gets in an infinite loop because the component is not actually displayed? I think... Chrome debugger freezes completely. */
-    isShown: boolean;
-};
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    cancel: () => any;
-    submit: (embedId: MaybeEmbedId) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onCancel?: (() => any) | undefined;
-    onSubmit?: ((embedId: MaybeEmbedId) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-export default _default;

package/dist/runtime/pm/features/EmbeddedDocument/components/EmbeddedNodeView.d.vue.ts

@@ -1,92 +0,0 @@
-declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    editor: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["editor"]>;
-        required: true;
-    };
-    node: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["node"]>;
-        required: true;
-    };
-    decorations: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["decorations"]>;
-        required: true;
-    };
-    selected: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["selected"]>;
-        required: true;
-    };
-    extension: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["extension"]>;
-        required: true;
-    };
-    getPos: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["getPos"]>;
-        required: true;
-    };
-    updateAttributes: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["updateAttributes"]>;
-        required: true;
-    };
-    deleteNode: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["deleteNode"]>;
-        required: true;
-    };
-    view: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["view"]>;
-        required: true;
-    };
-    innerDecorations: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["innerDecorations"]>;
-        required: true;
-    };
-    HTMLAttributes: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["HTMLAttributes"]>;
-        required: true;
-    };
-}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    editor: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["editor"]>;
-        required: true;
-    };
-    node: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["node"]>;
-        required: true;
-    };
-    decorations: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["decorations"]>;
-        required: true;
-    };
-    selected: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["selected"]>;
-        required: true;
-    };
-    extension: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["extension"]>;
-        required: true;
-    };
-    getPos: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["getPos"]>;
-        required: true;
-    };
-    updateAttributes: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["updateAttributes"]>;
-        required: true;
-    };
-    deleteNode: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["deleteNode"]>;
-        required: true;
-    };
-    view: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["view"]>;
-        required: true;
-    };
-    innerDecorations: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["innerDecorations"]>;
-        required: true;
-    };
-    HTMLAttributes: {
-        type: import("vue").PropType<import("@tiptap/core").NodeViewProps["HTMLAttributes"]>;
-        required: true;
-    };
-}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export default _default;