fix exports

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "svelte-slate",
 	"description": "slate svelte view layer",
-	"version": "0.1.80",
+	"version": "0.1.81",
 	"license": "(MIT OR Apache-2.0)",
 	"type": "module",
 	"author": "Nathan Faucett",
@@ -18,13 +18,22 @@
 		"rich"
 	],
 	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"module": "./dist/index.js",
+	"main": "./dist/index.js",
 	"files": [
 		"dist"
 	],
 	"exports": {
 		".": {
 			"types": "./dist/index.d.ts",
-			"svelte": "./dist/index.js"
+			"svelte": "./dist/index.js",
+			"default": "./dist/index.js"
+		},
+		"./plugins": {
+			"types": "./dist/plugins/index.d.ts",
+			"svelte": "./dist/plugins/index.js",
+			"default": "./dist/plugins/index.js"
 		}
 	},
 	"scripts": {

src/lib/components/Slate.svelte

@@ -18,34 +18,34 @@
 	export const CONTAINER_CONTEXT_KEY = createContextKey<HTMLDivElement | undefined>();
 
 	export type IEvents = {
-		onBeforeInput: svelteHTML.EventHandler<InputEvent, HTMLElement>[];
-		onKeyDown: svelteHTML.KeyboardEventHandler<HTMLElement>[];
-		onKeyUp: svelteHTML.KeyboardEventHandler<HTMLElement>[];
-		onKeyPress: svelteHTML.KeyboardEventHandler<HTMLElement>[];
-		onInput: svelteHTML.EventHandler<InputEvent, HTMLElement>[];
-		onFocus: svelteHTML.EventHandler<FocusEvent, HTMLElement>[];
-		onBlur: svelteHTML.EventHandler<FocusEvent, HTMLElement>[];
-		onClick: svelteHTML.MouseEventHandler<HTMLElement>[];
-		onCompositionEnd: svelteHTML.EventHandler<CompositionEvent, HTMLElement>[];
-		onCompositionUpdate: svelteHTML.EventHandler<CompositionEvent, HTMLElement>[];
-		onCompositionStart: svelteHTML.EventHandler<CompositionEvent, HTMLElement>[];
-		onPaste: svelteHTML.EventHandler<ClipboardEvent, HTMLElement>[];
-		onCopy: svelteHTML.EventHandler<ClipboardEvent, HTMLElement>[];
-		onCut: svelteHTML.EventHandler<ClipboardEvent, HTMLElement>[];
-		onDragOver: svelteHTML.EventHandler<DragEvent, HTMLElement>[];
-		onDragStart: svelteHTML.EventHandler<DragEvent, HTMLElement>[];
-		onDrop: svelteHTML.EventHandler<DragEvent, HTMLElement>[];
-		onDragEnd: svelteHTML.EventHandler<DragEvent, HTMLElement>[];
+		onBeforeInput: svelte.JSX.EventHandler<InputEvent, HTMLElement>[];
+		onKeyDown: svelte.JSX.KeyboardEventHandler<HTMLElement>[];
+		onKeyUp: svelte.JSX.KeyboardEventHandler<HTMLElement>[];
+		onKeyPress: svelte.JSX.KeyboardEventHandler<HTMLElement>[];
+		onInput: svelte.JSX.EventHandler<InputEvent, HTMLElement>[];
+		onFocus: svelte.JSX.EventHandler<FocusEvent, HTMLElement>[];
+		onBlur: svelte.JSX.EventHandler<FocusEvent, HTMLElement>[];
+		onClick: svelte.JSX.MouseEventHandler<HTMLElement>[];
+		onCompositionEnd: svelte.JSX.EventHandler<CompositionEvent, HTMLElement>[];
+		onCompositionUpdate: svelte.JSX.EventHandler<CompositionEvent, HTMLElement>[];
+		onCompositionStart: svelte.JSX.EventHandler<CompositionEvent, HTMLElement>[];
+		onPaste: svelte.JSX.EventHandler<ClipboardEvent, HTMLElement>[];
+		onCopy: svelte.JSX.EventHandler<ClipboardEvent, HTMLElement>[];
+		onCut: svelte.JSX.EventHandler<ClipboardEvent, HTMLElement>[];
+		onDragOver: svelte.JSX.EventHandler<DragEvent, HTMLElement>[];
+		onDragStart: svelte.JSX.EventHandler<DragEvent, HTMLElement>[];
+		onDrop: svelte.JSX.EventHandler<DragEvent, HTMLElement>[];
+		onDragEnd: svelte.JSX.EventHandler<DragEvent, HTMLElement>[];
 	};
-	export type IEventType<K extends keyof IEvents> = IEvents[K] extends svelteHTML.EventHandler<
+	export type IEventType<K extends keyof IEvents> = IEvents[K] extends svelte.JSX.EventHandler<
 		infer E
 	>[]
 		? E
 		: Event;
 
 	export function addEventListener<K extends keyof IEvents>(
 		name: K,
-		handler: svelteHTML.EventHandler<IEventType<K>, HTMLElement>,
+		handler: svelte.JSX.EventHandler<IEventType<K>, HTMLElement>,
 		onRemove?: () => void
 	) {
 		const eventsContext = getEventsContext();
@@ -142,11 +142,11 @@
 		selection = editor.selection;
 		value = editor.children;
 
-    const isValueChange = editor.operations.some(op => 'set_selection' !== op.type);
+		const isValueChange = editor.operations.some((op) => 'set_selection' !== op.type);
 
-    if (isValueChange) {
-		  dispatch('value', value);
-    }
+		if (isValueChange) {
+			dispatch('value', value);
+		}
 
 		dispatch('selection', selection);
 	}

src/lib/plugins/CodeElement.svelte

@@ -3,7 +3,7 @@
 <script lang="ts" context="module">
 	import type { Token, Grammar } from 'prismjs';
 	import { languages } from './prismjs';
-	import type { IBaseElement, IElement } from './Element.svelte';
+	import type { IBaseElement } from './Element.svelte';
 	import { createContext, createContextKey, findPath, getFromContext, isReadOnly } from '../utils';
 	import type { ISvelteEditor } from '$lib/withSvelte';
 

src/lib/plugins/Editable.svelte

@@ -19,7 +19,7 @@
 	export let spellcheck = true;
 	export let autocorrect: string = 'true';
 	export let autocapitalize: string = 'true';
-	export let onKeyDown: svelteHTML.KeyboardEventHandler<HTMLElement> = () => undefined;
+	export let onKeyDown: svelte.JSX.KeyboardEventHandler<HTMLElement> = () => undefined;
 </script>
 
 <Editable

src/lib/plugins/Hovering.svelte

@@ -52,7 +52,8 @@
 
 	export let container: HTMLElement | undefined = undefined;
 	export let ref: HTMLElement | undefined = undefined;
-	export let open: number | false = false;
+	export let open = false;
+	export let key = Date.now();
 	export let retires = 2;
 
 	$: if (container === undefined && ref) {

src/lib/plugins/HoveringToolbar.svelte

@@ -1,7 +1,7 @@
 <svelte:options immutable />
 
 <script lang="ts" context="module">
-	export function addLongPress(node: HTMLElement, threshold = 500, callback: () => void) {
+	function addLongPress(node: HTMLElement, threshold = 500, callback: () => void) {
 		let timeoutId: ReturnType<typeof setTimeout> | null = null;
 
 		function onDown() {
@@ -49,6 +49,9 @@
 
 	export let container: HTMLElement | undefined = undefined;
 	export let threshold = 500;
+	export let open = false;
+
+	let key = Date.now();
 
 	const editorContext = getEditorContext();
 	const selectionContext = getSelectionContext();
@@ -60,7 +63,6 @@
 	$: readOnly = $readOnlyContext;
 
 	let ref: HTMLElement;
-	let open: number | false = false;
 	$: if (ref) {
 		if (
 			!selection ||
@@ -81,7 +83,8 @@
 				match: (e) => !editor.hasOwnContext(e as IBaseElement)
 			});
 			if (!match) {
-				open = Date.now();
+				open = true;
+				key = Date.now();
 			}
 		}
 	}
@@ -96,6 +99,6 @@
 	}
 </script>
 
-<Hovering bind:open bind:ref {container}>
+<Hovering bind:open bind:ref {key} {container}>
 	<slot />
 </Hovering>

src/lib/plugins/ImageElement.svelte

@@ -28,13 +28,13 @@
 		}
 	}
 
-	export type ImagesOptions = {
+	export type IImagesOptions = {
 		allowPaste?: boolean;
 	};
 
 	export function withImages<T extends ISvelteEditor = ISvelteEditor>(
 		editor: T,
-		options: ImagesOptions = {}
+		options: IImagesOptions = {}
 	): T {
 		const { insertData, insertBreak } = editor;
 

src/lib/plugins/MathElement.svelte

@@ -34,7 +34,9 @@
 			if (!editor.selection || !Range.isCollapsed(editor.selection)) {
 				insertBreak();
 			} else {
-				if (Editor.isVoid(editor, Node.get(editor, Path.parent(editor.selection.anchor.path)))) {
+				if (
+					Editor.isVoid(editor, Node.get(editor, Path.parent(editor.selection.anchor.path)) as any)
+				) {
 					Editor.insertNode(editor, {
 						type: PARAGRAPH_TYPE,
 						children: [{ text: '' }]

src/lib/plugins/Slate.svelte

@@ -1,7 +1,7 @@
 <svelte:options immutable />
 
 <script lang="ts" context="module">
-	export const PLUGINS_CONTEXT_KEY = createContextKey<IPluginsContext>();
+	const PLUGINS_CONTEXT_KEY = createContextKey<IPluginsContext>();
 
 	export function getPluginsContext() {
 		return getFromContext(PLUGINS_CONTEXT_KEY);

src/lib/plugins/index.ts

@@ -0,0 +1,153 @@
+export {
+	default as BlockQuoteElement,
+	isBlockQuoteElement,
+	BLOCK_QUOTE_TYPE,
+	type IBlockQuoteElement
+} from './BlockQuoteElement.svelte';
+export {
+	default as BulletedListElement,
+	isBulletedListItemElement,
+	BULLETED_LIST_TYPE,
+	type IBulletedListItemElement
+} from './BulletedListElement.svelte';
+export {
+	default as CheckListItemElement,
+	isCheckListItemElement,
+	CHECK_LIST_ITEM_TYPE,
+	withCheckListItem,
+	insertCheckListItem,
+	type ICheckListItemElement
+} from './CheckListItemElement.svelte';
+export {
+	default as CodeEditorElement,
+	isCodeEditorElement,
+	CODE_LINE_TYPE,
+	type ICodeEditorElement
+} from './CodeEditorElement.svelte';
+export { default as CodeEditorLeaf, type ICodeEditorText } from './CodeEditorLeaf.svelte';
+export {
+	default as CodeElement,
+	isCodeElement,
+	CODE_TYPE,
+	getLanguageContext,
+	withCode,
+	insertCode,
+	type ICodeElement
+} from './CodeElement.svelte';
+export { DEFAULT_PLUGINS } from './DEFAULT_PLUGINS';
+export { default as Editable } from './Editable.svelte';
+export { default as Element, type IBaseElement, type IElement } from './Element.svelte';
+export {
+	default as Heading1Element,
+	isHeading1Element,
+	HEADING1_TYPE,
+	type IHeading1Element
+} from './Heading1Element.svelte';
+export {
+	default as Heading2Element,
+	isHeading2Element,
+	HEADING2_TYPE,
+	type IHeading2Element
+} from './Heading2Element.svelte';
+export {
+	default as Heading3Element,
+	isHeading3Element,
+	HEADING3_TYPE,
+	type IHeading3Element
+} from './Heading3Element.svelte';
+export {
+	default as Heading4Element,
+	isHeading4Element,
+	HEADING4_TYPE,
+	type IHeading4Element
+} from './Heading4Element.svelte';
+export {
+	default as Heading5Element,
+	isHeading5Element,
+	HEADING5_TYPE,
+	type IHeading5Element
+} from './Heading5Element.svelte';
+export {
+	default as Heading6Element,
+	isHeading6Element,
+	HEADING6_TYPE,
+	type IHeading6Element
+} from './Heading6Element.svelte';
+export { default as Hovering } from './Hovering.svelte';
+export { default as HoveringToolbar } from './HoveringToolbar.svelte';
+export {
+	default as ImageElement,
+	isImageElement,
+	IMAGE_TYPE,
+	isUrl,
+	withImages,
+	insertImage,
+	type IImagesOptions,
+	type IImageElement
+} from './ImageElement.svelte';
+export { default as Leaf, type IText } from './Leaf.svelte';
+export {
+	default as ListItemElement,
+	isListItemElement,
+	LIST_ITEM_TYPE,
+	withListItem,
+	type IListItemElement
+} from './ListItemElement.svelte';
+export { default as MathEditor } from './MathEditor.svelte';
+export {
+	default as MathElement,
+	isMathElement,
+	MATH_TYPE,
+	withMath,
+	insertMath,
+	type IMathElement
+} from './MathElement.svelte';
+export { default as Modal } from './Modal.svelte';
+export {
+	default as NumberedListElement,
+	isNumberedListItemElement,
+	NUMBERED_LIST_TYPE,
+	type INumberedListItemElement
+} from './NumberedListElement.svelte';
+export {
+	default as ParagraphElement,
+	isParagraphElement,
+	PARAGRAPH_TYPE,
+	type IParagraphElement
+} from './ParagraphElement.svelte';
+export {
+	default as Slate,
+	getPluginsContext,
+	isPluginWithFn,
+	type IWithFn,
+	type IPluginWithFn,
+	type IPlugin,
+	type IPlugins,
+	type IPluginsContext
+} from './Slate.svelte';
+export {
+	default as TableDataElement,
+	isTableDataElement,
+	TABLE_DATA_TYPE,
+	type ITableDataElement
+} from './TableDataElement.svelte';
+export {
+	default as TableElement,
+	isTableElement,
+	TABLE_TYPE,
+	type ITableElement
+} from './TableElement.svelte';
+export {
+	default as TableHeaderElement,
+	isTableHeaderElement,
+	TABLE_HEADER_TYPE,
+	type ITableHeaderElement
+} from './TableHeaderElement.svelte';
+export { default as TableRowChildElement } from './TableRowChildElement.svelte';
+export {
+	default as TableRowElement,
+	TABLE_ROW_TYPE,
+	isTableRowElement,
+	type ITableRowElement
+} from './TableRowElement.svelte';
+export { isMarkActive, isBlockActive, toggleBlock, toggleMark, setSelection } from './utils';