@witchcraft/editor 0.0.4 → 0.0.5

package/dist/runtime/pm/features/Highlight/types.js

@@ -1,2 +0,0 @@
-import { PluginKey } from "@tiptap/pm/state";
-export const highlightPluginKey = new PluginKey("highlightPluginKey");

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

@@ -1,35 +0,0 @@
-import type { Dispatch, Extension } from "@tiptap/core";
-import { type EditorState } from "@tiptap/pm/state";
-declare module "@tiptap/core" {
-    interface Commands<ReturnType> {
-        historyExtended: {
-            /**
-             * Set the functions needed to forward history commands.
-             *
-             * Set to null to disable. Should be set to null before destroying the editor.
-             */
-            setHistoryRedirect: (redirectState?: () => EditorState | undefined, redirectDispatch?: Dispatch) => ReturnType;
-        };
-    }
-}
-declare module "@tiptap/extension-history" {
-    interface HistoryOptions {
-        /**
-         * If set, undo and redo will be forwarded to the editor this function returns instead of the current one. This makes handling embedded editors easier.
-         *
-         * This is a function so as to make it easier to always get the latest state.
-         */
-        redirectState?: () => EditorState | undefined;
-        /**
-         * Required if redirectState is set. Tells the extension how to forward the transactions.
-         */
-        redirectDispatch?: Dispatch;
-    }
-}
-export declare const filterKey = "filterForHistoryForwarding";
-/**
-    * Extends the existing history extension to allow for forwarding of history for embedded editors.
-    *
-    * The embedded editor node view will take care of
-    */
-export declare const History: Extension<any, any>;

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

@@ -1,63 +0,0 @@
-import TipTapHistoryExtension from "@tiptap/extension-history";
-import { history, redo, undo } from "@tiptap/pm/history";
-import { Plugin, PluginKey } from "@tiptap/pm/state";
-export const filterKey = "filterForHistoryForwarding";
-export const History = TipTapHistoryExtension.extend({
-  name: "history",
-  addOptions() {
-    return {
-      depth: 100,
-      newGroupDelay: 500,
-      redirectState: void 0,
-      redirectDispatch: void 0
-    };
-  },
-  addCommands() {
-    return {
-      undo: () => ({ state, dispatch, tr }) => {
-        const redirectState = this.options.redirectState?.();
-        const redirectDispatch = dispatch && this.options.redirectDispatch;
-        if (redirectState) {
-          if (dispatch) {
-            tr.setMeta(filterKey, true);
-          }
-          return undo(redirectState, redirectDispatch);
-        } else {
-          return undo(state, dispatch);
-        }
-      },
-      redo: () => ({ state, dispatch, tr }) => {
-        const redirectState = this.options.redirectState?.();
-        const redirectDispatch = this.options.redirectDispatch;
-        if (redirectState) {
-          tr.setMeta(filterKey, true);
-          redo(redirectState, redirectDispatch);
-          return true;
-        } else {
-          return redo(state, dispatch);
-        }
-      },
-      setHistoryRedirect: (redirectState, redirectDispatch) => ({ dispatch }) => {
-        if (dispatch) {
-          this.options.redirectState = redirectState;
-          this.options.redirectDispatch = redirectDispatch;
-        }
-        return true;
-      }
-    };
-  },
-  addProseMirrorPlugins() {
-    return [
-      history(this.options),
-      new Plugin({
-        key: new PluginKey("history-forwarding"),
-        filterTransaction: (transaction) => {
-          if (transaction.getMeta(filterKey)) {
-            return false;
-          }
-          return true;
-        }
-      })
-    ];
-  }
-});

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

@@ -1,21 +0,0 @@
-import { Node } from "@tiptap/core";
-import type { IframeNodeOptions } from "./types.js";
-declare module "@tiptap/core" {
-    interface Commands<ReturnType> {
-        iframe: {
-            /**
-             * Add an iframe
-             */
-            setIframe: (options: {
-                src: string;
-            }) => ReturnType;
-            /**
-             * Set the options for the iframe plugin, such as the default HTMLAttributes and the url handlers.
-             */
-            setIframeOptions: (options: IframeNodeOptions) => ReturnType;
-            openExternalLink: (url: string) => ReturnType;
-        };
-    }
-}
-export declare const Iframe: Node<IframeNodeOptions, any>;
-export type NodeIframeName = "iframe";

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

@@ -1,127 +0,0 @@
-import { mergeAttributes, Node, nodePasteRule } from "@tiptap/core";
-import { VueNodeViewRenderer } from "@tiptap/vue-3";
-import IframeNodeView from "./components/IframeNodeView.vue";
-import { defaultAllow, InstagramSourceParser, VimeoSourceParser, YoutubeSourceParser } from "./IframeParsers.js";
-export const Iframe = Node.create({
-  name: "iframe",
-  group: "block",
-  atom: true,
-  addOptions() {
-    return {
-      HTMLAttributes: {},
-      handlers: {
-        youtube: new YoutubeSourceParser(),
-        instagram: new InstagramSourceParser(),
-        vimeo: new VimeoSourceParser()
-      }
-    };
-  },
-  addAttributes() {
-    return {
-      src: {
-        default: null
-      },
-      frameborder: {
-        default: 0
-      },
-      allow: defaultAllow,
-      aspectRatio: {
-        default: 16 / 9
-      }
-    };
-  },
-  parseHTML() {
-    return [{
-      tag: "iframe",
-      getAttrs: (element) => {
-        const src = element.getAttribute("src");
-        if (!src) {
-          return false;
-        }
-        for (const value of Object.values(this.options.handlers)) {
-          if (value.matchUrl?.test(src)) {
-            const attrs = value.parseAttributes(element);
-            if (attrs) {
-              return {
-                ...attrs,
-                src: value.cleanUrl(src)
-              };
-            }
-          }
-        }
-        return { src };
-      }
-    }];
-  },
-  // eslint-disable-next-line @typescript-eslint/naming-convention
-  renderHTML({ HTMLAttributes }) {
-    return [
-      "div",
-      mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, {
-        class: `
-					iframe-wrapper
-					group/embed
-					relative
-					w-[99%]
-					max-w-[var(--pm-max-embed-width)]
-					${HTMLAttributes?.class ?? this.options.HTMLAttributes?.class ?? ""}
-				`
-      }),
-      [
-        "iframe",
-        { class: "w-full aspect-video" }
-      ]
-    ];
-  },
-  addPasteRules() {
-    return [
-      nodePasteRule({
-        find: (text) => {
-          for (const [key, value] of Object.entries(this.options.handlers)) {
-            if (!value.matchUrl) continue;
-            const res = text.match(value.matchUrl);
-            if (res) {
-              return [
-                {
-                  ...res,
-                  text,
-                  index: 0,
-                  type: key
-                }
-              ];
-            }
-          }
-          return null;
-        },
-        type: this.type,
-        getAttributes: (match) => {
-          for (const value of Object.values(this.options.handlers)) {
-            if (value.matchUrl && match[0].match(value.matchUrl)) {
-              return {
-                ...value.defaultAttributes,
-                src: value.cleanUrl(match[0])
-              };
-            }
-          }
-          return false;
-        }
-      })
-    ];
-  },
-  addNodeView() {
-    return VueNodeViewRenderer(IframeNodeView);
-  },
-  addCommands() {
-    return {
-      setIframe: (options) => ({ tr, dispatch }) => {
-        const { selection } = tr;
-        const node = this.type.create(options);
-        if (dispatch) {
-          tr.replaceRangeWith(selection.from, selection.to, node);
-        }
-        return true;
-      },
-      setIframeOptions: (options) => ({ commands }) => commands.updateAttributes(this.name, options)
-    };
-  }
-});

package/dist/runtime/pm/features/Iframe/IframeParsers.d.ts

@@ -1,37 +0,0 @@
-export declare const defaultAllow: string;
-export declare function addDefaultQueryParams(parsedUrl: URL, defaultQueryParams: Record<string, any>): string;
-export declare function getAspectRatio(element: HTMLElement, defaultRatio?: number): number | undefined;
-type DefaultAttributes = Record<string, any> & {
-    aspectRatio: number;
-};
-export interface IframeSourceParser {
-    defaultAttributes: DefaultAttributes;
-    defaultQueryParams: Record<string, any>;
-    parseAttributes: (element: HTMLElement) => Record<string, any> | false;
-    cleanUrl: (url: string) => string;
-    matchUrl?: RegExp;
-}
-export declare class DefaultSourceParser implements IframeSourceParser {
-    cache: Map<string, any>;
-    defaultAttributes: DefaultAttributes;
-    defaultQueryParams: Record<string, any>;
-    parseAttributes(element: HTMLElement): Record<string, any> | false;
-    cleanUrl(url: string): string;
-}
-export declare class YoutubeSourceParser extends DefaultSourceParser implements IframeSourceParser {
-    defaultAttributes: DefaultAttributes;
-    defaultQueryParams: Record<string, any>;
-    matchUrl: RegExp;
-}
-export declare class InstagramSourceParser extends DefaultSourceParser implements IframeSourceParser {
-    defaultAttributes: DefaultAttributes;
-    defaultQueryParams: Record<string, any>;
-    cleanUrl(url: string): string;
-    matchUrl: RegExp;
-}
-export declare class VimeoSourceParser extends DefaultSourceParser implements IframeSourceParser {
-    defaultAttributes: DefaultAttributes;
-    matchUrl: RegExp;
-    cleanUrl(url: string): string;
-}
-export {};

package/dist/runtime/pm/features/Iframe/IframeParsers.js

@@ -1,88 +0,0 @@
-export const defaultAllow = ["fullscreen", "accelerometer", "autoplay", "clipboard-write", "encrypted-media", "gyroscope", "picture-in-picture", "web-share"].join(";");
-export function addDefaultQueryParams(parsedUrl, defaultQueryParams) {
-  for (const [key, value] of Object.entries(defaultQueryParams)) {
-    if (!parsedUrl.searchParams.has(key)) {
-      parsedUrl.searchParams.set(key, value);
-    }
-  }
-  return parsedUrl.toString();
-}
-export function getAspectRatio(element, defaultRatio = 16 / 9) {
-  const width = element.getAttribute("width");
-  const height = element.getAttribute("height");
-  const w = width ? Number.parseInt(width, 10) : null;
-  const h = height ? Number.parseInt(height, 10) : null;
-  if (typeof w === "number" && typeof h === "number") {
-    return w / h;
-  }
-  return defaultRatio;
-}
-export class DefaultSourceParser {
-  cache = /* @__PURE__ */ new Map();
-  defaultAttributes = {
-    aspectRatio: 16 / 9
-  };
-  defaultQueryParams = {};
-  parseAttributes(element) {
-    const src = element.getAttribute("src");
-    const allow = element.getAttribute("allow");
-    const aspectRatio = getAspectRatio(element, this.defaultAttributes.aspectRatio);
-    if (!src) return false;
-    return {
-      src,
-      allow,
-      aspectRatio
-    };
-  }
-  cleanUrl(url) {
-    const parsedUrl = new URL(url);
-    addDefaultQueryParams(parsedUrl, this.defaultQueryParams);
-    return parsedUrl.toString();
-  }
-}
-export class YoutubeSourceParser extends DefaultSourceParser {
-  defaultAttributes = {
-    allow: defaultAllow,
-    referrerpolicy: "strict-origin-when-cross-origin",
-    allowfullscreen: "true",
-    aspectRatio: 16 / 9
-  };
-  defaultQueryParams = {
-    controls: 1
-  };
-  matchUrl = /^((?:https?:\/\/)?(?:www.)?(?:youtube.com|youtu.be.com)[^ ]*)$/g;
-}
-export class InstagramSourceParser extends DefaultSourceParser {
-  defaultAttributes = {
-    aspectRatio: 9 / 12
-  };
-  defaultQueryParams = {};
-  cleanUrl(url) {
-    const parsedUrl = new URL(url);
-    addDefaultQueryParams(parsedUrl, this.defaultQueryParams);
-    if (parsedUrl.pathname.includes("/embed")) {
-      return parsedUrl.toString();
-    } else {
-      parsedUrl.pathname += parsedUrl.pathname.endsWith("/") ? "embed" : "/embed";
-      return parsedUrl.toString();
-    }
-  }
-  matchUrl = /^((?:https?:\/\/)?(?:www.)?instagram.com\/p[^ ]*)$/g;
-}
-export class VimeoSourceParser extends DefaultSourceParser {
-  defaultAttributes = {
-    aspectRatio: 16 / 9,
-    allow: ["autoplay", "fullscreen", "picture-in-picture"].join(";")
-  };
-  matchUrl = /^((?:https?:\/\/)?(?:www.)?(?:player.)?vimeo.com\/[^ ]*)$/g;
-  cleanUrl(url) {
-    const parsedUrl = new URL(url);
-    addDefaultQueryParams(parsedUrl, this.defaultQueryParams);
-    if (parsedUrl.pathname.includes("/video") && parsedUrl.hostname.includes("player.vimeo.com")) {
-      return parsedUrl.toString();
-    } else {
-      parsedUrl.pathname = `/video${parsedUrl.pathname}`;
-      return new URL(parsedUrl.pathname, "https://player.vimeo.com/video").toString();
-    }
-  }
-}

package/dist/runtime/pm/features/Iframe/components/IframeNodeView.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;

package/dist/runtime/pm/features/Iframe/components/IframeNodeView.vue

@@ -1,79 +0,0 @@
-<template>
-<node-view-wrapper
-	:class="twMerge(`
-		frame-wrapper
-		group/embed
-		relative
-		max-w-[var(--pmMaxEmbedWidth)]
-		max-h-[var(--pmMaxEmbedHeight,_var(--pmMaxEmbedWidth))]
-	`)"
-	:style="`aspect-ratio: ${node.attrs.aspectRatio}`"
->
-	<div
-		contenteditable="false"
-		class="
-			absolute
-			top-1
-			right-1
-			rounded-sm
-			bg-neutral-400/70
-			border-neutral-200
-			dark:bg-neutral-700/70
-			dark:border-neutral-700
-			p-1
-			flex
-			gap-1
-			opacity-0
-			group-hover/embed:opacity-100
-			transition-opacity
-		"
-	>
-		<WButton
-			:border="false"
-			@click="deleteNode();
-  editor.commands.focus()"
-		>
-			<WIcon><i-fa-solid-trash/></WIcon>
-		</WButton>
-		<WButton
-			:border="false"
-			@click="copy(node.attrs.src)"
-		>
-			<WIcon><i-fa-solid-copy/></WIcon>
-		</WButton>
-		<WButton
-			:border="false"
-			@click="openLink"
-		>
-			<WIcon><i-fa-solid-external-link-alt class="w-[1.25em]"/></WIcon>
-		</WButton>
-	</div>
-	<node-view-content
-		as="iframe"
-		:class="twMerge(
-  `
-		w-full
-		`,
-  node.attrs.class
-)"
-		:style="`aspect-ratio: ${node.attrs.aspectRatio}`"
-		v-bind="node.attrs"
-	/>
-	{{ Object.keys(node.attrs) }}
-</node-view-wrapper>
-</template>
-
-<script setup>
-import { NodeViewContent, nodeViewProps, NodeViewWrapper } from "@tiptap/vue-3";
-import WIcon from "@witchcraft/ui/components/Icon";
-import WButton from "@witchcraft/ui/components/LibButton";
-import { copy } from "@witchcraft/ui/helpers/copy";
-import { twMerge } from "tailwind-merge";
-import IFaSolidCopy from "~icons/fa-solid/copy";
-import IFaSolidExternalLinkAlt from "~icons/fa-solid/external-link-alt";
-import IFaSolidTrash from "~icons/fa-solid/trash";
-const props = defineProps(nodeViewProps);
-function openLink() {
-  props.editor.commands.openExternalLink(props.node.attrs.src);
-}
-</script>

package/dist/runtime/pm/features/Iframe/components/IframeNodeView.vue.d.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;

package/dist/runtime/pm/features/Iframe/types.d.ts

@@ -1,5 +0,0 @@
-import type { IframeSourceParser } from "./IframeParsers.js";
-import type { HTMLAttributesOptions } from "../../../types/index.js";
-export interface IframeNodeOptions extends HTMLAttributesOptions {
-    handlers: Record<string, IframeSourceParser>;
-}

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

@@ -1,2 +0,0 @@
-import type { Extension } from "@tiptap/core";
-export declare const Image: Extension<any, any>;

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

@@ -1,13 +0,0 @@
-import TipTapImage from "@tiptap/extension-image";
-export const Image = TipTapImage.configure({
-  HTMLAttributes: {
-    class: `
-			rounded-xs
-			block h-auto max-w-full 
-			[&.ProseMirror-selectednode]:outline
-			[&.ProseMirror-selectednode]:outline-offset-0
-			[&.ProseMirror-selectednode]:outline-accent-500
-		`
-  },
-  allowBase64: true
-});