@witchcraft/editor 0.0.7 → 0.0.8

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "witchcraftEditor",
   "configKey": "witchcraftEditor",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/runtime/components/CodeBlockThemePicker.vue

@@ -40,7 +40,6 @@ const codeBlocksTheme = defineModel("codeBlocksTheme", { type: String, ...{ requ
 				gap-2
 			"
 		>
-			<!-- @vue-expect-error -->
 			<ComboboxInput
 				class="
 					bg-inherit

package/dist/runtime/components/Commands.vue

@@ -46,7 +46,7 @@ import { pretty } from "@alanscodelog/utils";
 import WButton from "@witchcraft/ui/components/LibButton";
 import { twMerge } from "tailwind-merge";
 const props = defineProps({
-  editor: { type: null, required: true },
+  editor: { type: Object, required: true },
   commands: { type: Array, required: true }
 });
 function handlePointerDown($event, command, args) {

package/dist/runtime/components/Editor.vue

@@ -27,7 +27,6 @@
 	v-bind="$attrs"
 >
 	<!-- The class `is-embedded-block` is not needed internally, but is added for consistency in case it might be useful. -->
-	<!-- @vue-expect-error -->
 	<editor-content
 		:editor="editor"
 		spellcheck="false"
@@ -80,7 +79,7 @@ import MarkMenuManager from "../pm/features/Menus/components/MarkMenuManager.vue
 import { extensions } from "../pm/schema.js";
 import { menusInjectionKey } from "../types/index.js";
 const props = defineProps({
-  content: { type: null, required: false, default: void 0 },
+  content: { type: [String, Object, Array, null], required: false, default: void 0 },
   docId: { type: String, required: false, default: void 0 },
   documentApi: { type: null, required: false, default: void 0 },
   linkOptions: { type: Object, required: false, default: void 0 },

package/dist/runtime/composables/useEditor.d.ts

@@ -4,6 +4,6 @@ import { Editor } from "@tiptap/vue-3";
  * Unline tiptap's useEditor, this does not auto-mount the editor. Instead the returned `recreate` function must be called manually. This was built with the use of {@link useContentEditor} in mind.
  */
 export declare const useEditor: (options?: Partial<EditorOptions>) => {
-    editor: import("@vue/reactivity").ShallowRef<Editor | undefined, Editor | undefined>;
+    editor: import("vue").ShallowRef<Editor | undefined, Editor | undefined>;
     recreate: (modifyOptions?: (options: Partial<EditorOptions>) => Partial<EditorOptions>) => void;
 };

package/dist/runtime/demo/App.vue

@@ -1,6 +1,5 @@
 <template>
 <WRoot class="items-center py-4">
-	<!-- @vue-expect-error use unhead in a real app -->
 	<style>
 		{{ codeBlocksThemeCss.join("\n") }}
 	</style>

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

@@ -1,5 +1,5 @@
 import { Node } from "@tiptap/core";
-export declare const Blockquote: Node<import("@tiptap/extension-blockquote", { with: { "resolution-mode": "require" } }).BlockquoteOptions, any>;
+export declare const Blockquote: Node<import("@tiptap/extension-blockquote").BlockquoteOptions, any>;
 export type NodeBlockquoteName = "blockquote";
 export declare const Cite: Node<any, any>;
 export type NodeCiteName = "cite";

package/dist/runtime/pm/features/Blocks/components/DragTreeHandle.d.vue.ts

@@ -0,0 +1,26 @@
+/**
+ * 	Multipurpose drag handle + collapse indicator.
+ *
+ * 	This is incredibly useful for making a compact draggable tree view.
+ *
+ * 	The collapse indicator has a default height, but it should be set manually. For example `[&>.collapse-indicator]:h-[...]`
+ *
+ * 	The component only emits a few events, it does not handle the dragging itself or what actually happens on any clicks/input.
+ */
+interface Props {
+    hasChildren: boolean;
+    passedDragThreshold: boolean;
+    hideChildren: boolean;
+}
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    collapseIndicatorClick: (event: MouseEvent) => any;
+    grabHandlePassiveTouchStart: (event: TouchEvent) => any;
+    grabHandlePointerDown: (event: PointerEvent) => any;
+    grabHandleContextMenu: (event: PointerEvent) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onCollapseIndicatorClick?: ((event: MouseEvent) => any) | undefined;
+    onGrabHandlePassiveTouchStart?: ((event: TouchEvent) => any) | undefined;
+    onGrabHandlePointerDown?: ((event: PointerEvent) => any) | undefined;
+    onGrabHandleContextMenu?: ((event: PointerEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/pm/features/Blocks/components/DragTreeHandle.vue

@@ -100,7 +100,7 @@
 </template>
 
 <script>
-export default {};
+
 </script>
 
 <script setup>

package/dist/runtime/pm/features/Blocks/components/DragTreeHandle.vue.d.ts

@@ -0,0 +1,26 @@
+/**
+ * 	Multipurpose drag handle + collapse indicator.
+ *
+ * 	This is incredibly useful for making a compact draggable tree view.
+ *
+ * 	The collapse indicator has a default height, but it should be set manually. For example `[&>.collapse-indicator]:h-[...]`
+ *
+ * 	The component only emits a few events, it does not handle the dragging itself or what actually happens on any clicks/input.
+ */
+interface Props {
+    hasChildren: boolean;
+    passedDragThreshold: boolean;
+    hideChildren: boolean;
+}
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    collapseIndicatorClick: (event: MouseEvent) => any;
+    grabHandlePassiveTouchStart: (event: TouchEvent) => any;
+    grabHandlePointerDown: (event: PointerEvent) => any;
+    grabHandleContextMenu: (event: PointerEvent) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    onCollapseIndicatorClick?: ((event: MouseEvent) => any) | undefined;
+    onGrabHandlePassiveTouchStart?: ((event: TouchEvent) => any) | undefined;
+    onGrabHandlePointerDown?: ((event: PointerEvent) => any) | undefined;
+    onGrabHandleContextMenu?: ((event: PointerEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/pm/features/Blocks/components/ItemMenu.vue

@@ -1,5 +1,4 @@
 <template>
-<!-- @vue-expect-error -->
 <WPopup
 	:model-value="menu.opened"
 	:preferred-horizontal="['left-most']"
@@ -33,7 +32,7 @@ import { popupVerticalPositioner } from "../../CommandsMenus/utils/popupVertical
 import { itemMenuPluginKey } from "../types.js";
 import { createItemMenuCommandExecuter } from "../utils/createItemMenuCommandExecuter.js";
 const props = defineProps({
-  editor: { type: null, required: true }
+  editor: { type: Object, required: true }
 });
 const menu = ref({ opened: false, id: void 0 });
 const popup = ref();

package/dist/runtime/pm/features/Blocks/components/ItemNodeView.vue

@@ -7,7 +7,6 @@
 	--pmNodeTypeMargin
 	--pmDragDropIndicatorHeight
 -->
-<!-- @vue-expect-error role is a valid attribute -->
 <node-view-wrapper
 	:class="twMerge(
   `

package/dist/runtime/pm/features/Blocks/components/defaultItemMenu.d.ts

@@ -1,5 +1,5 @@
-export declare const defaultItemMenu: (import("../types.ts").ItemMenuCommand | {
+export declare const defaultItemMenu: (import("../types.js").ItemMenuCommand | {
     type: "group";
     title: string;
-    variations: import("../types.ts").ItemMenuCommand[];
+    variations: import("../types.js").ItemMenuCommand[];
 })[];

package/dist/runtime/pm/features/Blocks/composables/useNodeStates.d.ts

@@ -2,6 +2,6 @@ import type { Node } from "@tiptap/pm/model";
 export declare function useNodeStates(props: {
     node: Node;
 }): {
-    counterStyle: import("@vue/reactivity").ComputedRef<string>;
-    nodeState: import("@vue/reactivity").ComputedRef<import("../types.js").StatefulNodeStateEntry<string> | undefined>;
+    counterStyle: import("vue").ComputedRef<string>;
+    nodeState: import("vue").ComputedRef<import("../types.js").StatefulNodeStateEntry<string> | undefined>;
 };

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

@@ -12,5 +12,5 @@ export declare const lowlightInstance: {
     };
     registered: (aliasOrName: string) => boolean;
 };
-export declare const CodeBlock: import("@tiptap/core").Node<import("@tiptap/extension-code-block-lowlight", { with: { "resolution-mode": "require" } }).CodeBlockLowlightOptions, any>;
+export declare const CodeBlock: import("@tiptap/core").Node<import("@tiptap/extension-code-block-lowlight").CodeBlockLowlightOptions, any>;
 export type NodeCodeBlockName = "codeBlock";

package/dist/runtime/pm/features/CodeBlock/components/CodeBlockView.vue

@@ -38,7 +38,6 @@
 		/>
 	</div>
 
-	<!-- @vue-expect-error -->
 	<node-view-content
 		:class="twMerge(
   `

package/dist/runtime/pm/features/CodeBlock/composables/useHighlightJsTheme.d.ts

@@ -30,8 +30,8 @@ export declare function useHighlightJsTheme({ defaultTheme, darkLightBgs, additi
     theme: Ref<string, string>;
     knownThemes: Ref<string[], string[]>;
     loadTheme: (themeName: string) => Promise<undefined | Error>;
-    isDark: import("@vue/reactivity").ComputedRef<boolean>;
-    backgroundColor: import("@vue/reactivity").ComputedRef<string>;
-    themeCss: import("@vue/reactivity").ComputedRef<string[]>;
+    isDark: import("vue").ComputedRef<boolean>;
+    backgroundColor: import("vue").ComputedRef<string>;
+    themeCss: import("vue").ComputedRef<string[]>;
     rawThemeCss: Ref<string, string>;
 };

package/dist/runtime/pm/features/CommandsMenus/components/CommandBar.vue

@@ -52,7 +52,7 @@
 <script setup>
 import CommandBarItem from "./CommandBarItem.vue";
 defineProps({
-  editor: { type: null, required: true },
+  editor: { type: Object, required: true },
   commands: { type: Array, required: true }
 });
 </script>

package/dist/runtime/pm/features/CommandsMenus/components/CommandBarItem.vue

@@ -29,7 +29,7 @@ import { commandExecuterInjectionKey } from "../types.js";
 import { defaultCommandExecuter } from "../utils/defaultCommandExecutor";
 const props = defineProps({
   item: { type: null, required: true },
-  editor: { type: null, required: true }
+  editor: { type: Object, required: true }
 });
 const emit = defineEmits(["close"]);
 const executer = inject(commandExecuterInjectionKey, defaultCommandExecuter);

package/dist/runtime/pm/features/CommandsMenus/components/CommandMenuGroup.vue

@@ -10,7 +10,6 @@
 		:item="item"
 		v-extract-root-el="(_) => el = _"
 	/>
-	<!-- @vue-expect-error -->
 	<WPopup
 		:model-value="showSubMenu"
 		:preferred-horizontal="['right-most']"

package/dist/runtime/pm/features/CommandsMenus/icons/HighlightIcon.vue

@@ -32,7 +32,7 @@ import { computed } from "vue";
 import FaSolidHighlighter from "~icons/lucide/highlighter";
 import { highlightPluginKey } from "../../Highlight/types.js";
 const props = defineProps({
-  editor: { type: null, required: true },
+  editor: { type: Object, required: true },
   colorSlot: { type: null, required: false }
 });
 const color = computed(() => {

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

@@ -84,7 +84,6 @@
 			@pointerdown.prevent
 			@pointerup.prevent="pickBlockId"
 		>
-			<!-- @vue-expect-error -->
 			<Editor
 				:is-embedded="true"
 				:doc-id="newEmbedId.docId"

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

@@ -1,5 +1,4 @@
 <template>
-<!-- @vue-expect-error -->
 <node-view-wrapper
 	:class="`
 		group/embedded-doc

package/dist/runtime/pm/features/FileLoader/components/FileLoaderNodeView.vue

@@ -1,5 +1,4 @@
 <template>
-<!-- @vue-expect-error contenteditable exists -->
 <node-view-wrapper
 	:class="twMerge(
   `

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

@@ -2,4 +2,4 @@
  * Extends the tiptap hard break extension to set the linebreakReplacement option (which tiptap does not expose).
  * This option tells prosemirror that when converting between blocks that can/can't show whitespace, it should use this node type to represent line breaks in node types that don't display them.
  */
-export declare const HardBreak: import("@tiptap/core").Node<import("@tiptap/extension-hard-break", { with: { "resolution-mode": "require" } }).HardBreakOptions, any>;
+export declare const HardBreak: import("@tiptap/core").Node<import("@tiptap/extension-hard-break").HardBreakOptions, any>;

package/dist/runtime/pm/features/Link/components/BubbleMenuExternalLink.vue

@@ -83,7 +83,7 @@ import iFaSolidExternalLinkAlt from "~icons/fa-solid/external-link-alt";
 import iIcRoundLink from "~icons/ic/round-link";
 import iIcRoundShortText from "~icons/ic/round-short-text";
 const props = defineProps({
-  editor: { type: null, required: true },
+  editor: { type: Object, required: true },
   linkSuggestions: { type: Array, required: false },
   linkMark: { type: null, required: true },
   isChanged: { type: Boolean, required: true }

package/dist/runtime/pm/features/Link/components/BubbleMenuInternalLink.vue

@@ -56,7 +56,7 @@ import { ref, watch } from "vue";
 import BubbleMenuLinkActions from "./BubbleMenuLinkActions.vue";
 import iIcRoundLink from "~icons/ic/round-link";
 const props = defineProps({
-  editor: { type: null, required: true },
+  editor: { type: Object, required: true },
   linkSuggestions: { type: Array, required: false },
   linkMark: { type: null, required: true },
   isChanged: { type: Boolean, required: true },

package/dist/runtime/pm/features/Link/components/BubbleMenuLink.vue

@@ -53,7 +53,7 @@ import { getMarkPosition } from "../../../utils/getMarkPosition.js";
 import { getMarksInSelection } from "../../../utils/getMarksInSelection.js";
 import { linkMenuPluginKey } from "../types.js";
 const props = defineProps({
-  editor: { type: null, required: true },
+  editor: { type: Object, required: true },
   linkSuggestions: { type: Array, required: false },
   internalLinkSuggestions: { type: Array, required: false },
   getLinkSuggestions: { type: Function, required: false },

package/dist/runtime/pm/features/Menus/components/MarkMenuManager.vue

@@ -47,7 +47,7 @@ import {
 import { findUpwards } from "../../../utils/findUpwards.js";
 import { menusInjectionKey, menusPluginKey } from "../types.js";
 const props = defineProps({
-  editor: { type: null, required: true }
+  editor: { type: Object, required: true }
 });
 const menus = inject(menusInjectionKey, ref({}));
 const activeMarkMenu = ref();

package/dist/runtime/pm/features/Tables/index.d.ts

@@ -1,8 +1,8 @@
-export declare const TableRow: import("@tiptap/core").Node<import("@tiptap/extension-table", { with: { "resolution-mode": "require" } }).TableRowOptions, any>;
-export declare const TableCell: import("@tiptap/core").Node<import("@tiptap/extension-table", { with: { "resolution-mode": "require" } }).TableCellOptions, any>;
-export declare const TableHeader: import("@tiptap/core").Node<import("@tiptap/extension-table", { with: { "resolution-mode": "require" } }).TableHeaderOptions, any>;
-export declare const Table: import("@tiptap/core").Node<import("@tiptap/extension-table", { with: { "resolution-mode": "require" } }).TableOptions, any>;
-export declare const TableExtensions: (import("@tiptap/core").Node<import("@tiptap/extension-table", { with: { "resolution-mode": "require" } }).TableRowOptions, any> | import("@tiptap/core").Node<import("@tiptap/extension-table", { with: { "resolution-mode": "require" } }).TableOptions, any>)[];
+export declare const TableRow: import("@tiptap/core").Node<import("@tiptap/extension-table").TableRowOptions, any>;
+export declare const TableCell: import("@tiptap/core").Node<import("@tiptap/extension-table").TableCellOptions, any>;
+export declare const TableHeader: import("@tiptap/core").Node<import("@tiptap/extension-table").TableHeaderOptions, any>;
+export declare const Table: import("@tiptap/core").Node<import("@tiptap/extension-table").TableOptions, any>;
+export declare const TableExtensions: (import("@tiptap/core").Node<import("@tiptap/extension-table").TableRowOptions, any> | import("@tiptap/core").Node<import("@tiptap/extension-table").TableOptions, any>)[];
 export type NodeTableName = "table";
 export type NodeTableRowName = "tableRow";
 export type NodeTableCellName = "tableCell";

package/dist/runtime/pm/testSchema.d.ts

@@ -1,5 +1,5 @@
 import type { Schema } from "@tiptap/pm/model";
 import { type NodeFileLoaderName } from "./features/FileLoader/FileLoader.js";
 import { type schema as baseSchema } from "./schema.js";
-export declare const testExtensions: (import("@tiptap/core").AnyExtension | import("@tiptap/core").Node<import("./features/FileLoader/types.ts").FileLoaderExtensionOptions, any>)[];
+export declare const testExtensions: (import("@tiptap/core").AnyExtension | import("@tiptap/core").Node<import("./features/FileLoader/types.js").FileLoaderExtensionOptions, any>)[];
 export declare const testSchema: typeof baseSchema & Schema<NodeFileLoaderName & "itemNoId">;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@witchcraft/editor",
   "description": "Block base prosemirror editor with partial/full editable document embeds, infinite embeds, and document uploads.",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "main": "./dist/runtime/main.lib.js",
   "type": "module",
   "sideEffects": false,

package/src/module.ts

@@ -89,6 +89,7 @@ export default defineNuxtModule<ModuleOptions>({
 		nuxt.options.build.transpile.push("@tiptap/pm")
 
 		nuxt.hook("vite:extendConfig", config => {
+			// @ts-expect-error - optimizeDeps is now readonly but also possibly undefined :/
 			config.optimizeDeps ??= {}
 			config.optimizeDeps.exclude ??= []
 			// causes issues with the import.meta.globs here

package/src/runtime/components/CodeBlockThemePicker.vue

@@ -42,7 +42,6 @@ const codeBlocksTheme = defineModel<string>("codeBlocksTheme", { required: true
 				gap-2
 			"
 		>
-			<!-- @vue-expect-error -->
 			<ComboboxInput
 				class="
 					bg-inherit

package/src/runtime/components/Editor.vue

@@ -26,7 +26,6 @@
 	v-bind="$attrs"
 >
 	<!-- The class `is-embedded-block` is not needed internally, but is added for consistency in case it might be useful. -->
-	<!-- @vue-expect-error -->
 	<editor-content
 		:editor="editor! as any"
 		spellcheck="false"

package/src/runtime/demo/App.vue

@@ -1,6 +1,5 @@
 <template>
 <WRoot class="items-center py-4">
-	<!-- @vue-expect-error use unhead in a real app -->
 	<style>
 		{{ codeBlocksThemeCss.join("\n") }}
 	</style>

package/src/runtime/pm/features/Blocks/components/DragTreeHandle.vue

@@ -107,7 +107,11 @@
  *
  * 	The component only emits a few events, it does not handle the dragging itself or what actually happens on any clicks/input.
  */
-export default { }
+interface Props {
+	hasChildren: boolean
+	passedDragThreshold: boolean
+	hideChildren: boolean
+}
 </script>
 
 <script setup lang="ts">
@@ -118,11 +122,6 @@ import { onMounted, onUnmounted, ref, useAttrs } from "vue"
 defineOptions({
 	name: "DragTreeHandle"
 })
-interface Props {
-	hasChildren: boolean
-	passedDragThreshold: boolean
-	hideChildren: boolean
-}
 
 const $attrs = useAttrs()
 defineProps<Props>()

package/src/runtime/pm/features/Blocks/components/ItemMenu.vue

@@ -1,5 +1,4 @@
 <template>
-<!-- @vue-expect-error -->
 <WPopup
 	:model-value="menu.opened"
 	:preferred-horizontal="['left-most']"

package/src/runtime/pm/features/Blocks/components/ItemNodeView.vue

@@ -12,7 +12,6 @@
 	--pmNodeTypeMargin
 	--pmDragDropIndicatorHeight
 -->
-<!-- @vue-expect-error role is a valid attribute -->
 <node-view-wrapper
 	:class="twMerge(`
 		group/item

package/src/runtime/pm/features/CodeBlock/components/CodeBlockView.vue

@@ -44,7 +44,6 @@
 		/>
 	</div>
 
-	<!-- @vue-expect-error -->
 	<node-view-content
 		:class="twMerge(`
 			hljs

package/src/runtime/pm/features/CommandsMenus/components/CommandMenuGroup.vue

@@ -8,7 +8,6 @@
 		:item="item"
 		v-extract-root-el="(_: any) => el = _"
 	/>
-	<!-- @vue-expect-error -->
 	<WPopup
 		:model-value="showSubMenu"
 		:preferred-horizontal="['right-most']"

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

@@ -84,7 +84,6 @@
 			@pointerdown.prevent
 			@pointerup.prevent="pickBlockId"
 		>
-			<!-- @vue-expect-error -->
 			<Editor
 				:is-embedded="true"
 				:doc-id="newEmbedId.docId"

package/src/runtime/pm/features/EmbeddedDocument/components/EmbeddedNodeView.vue

@@ -1,5 +1,4 @@
 <template>
-<!-- @vue-expect-error -->
 <node-view-wrapper
 	:class="`
 		group/embedded-doc

package/src/runtime/pm/features/FileLoader/components/FileLoaderNodeView.vue

@@ -1,5 +1,4 @@
 <template>
-<!-- @vue-expect-error contenteditable exists -->
 <node-view-wrapper
 	:class="twMerge(`
 		group/file-loader