@use-kona/editor 0.1.12 → 0.1.14

package/dist/core/createEditable.d.ts

@@ -1,4 +1,4 @@
-import { Editor } from 'slate';
+import { type Editor } from 'slate';
 import type { IPlugin } from '../types';
 type Props = {
     readOnly?: boolean;

package/dist/core/createEditor.d.ts

@@ -1,2 +1,4 @@
 import type { IPlugin } from '../types';
-export declare const createEditor: (plugins: IPlugin[]) => () => import("slate").BaseEditor & import("slate-react").ReactEditor;
+export declare const createEditor: (plugins: IPlugin[]) => () => import("slate").BaseEditor & import("slate-react").ReactEditor & {
+    getCommands: <T extends IPlugin>(plugin: new () => T) => T["commands"];
+};

package/dist/core/createEditor.js

@@ -3,33 +3,16 @@ import { withHistory } from "slate-history";
 import { withReact } from "slate-react";
 const createEditor_createEditor = (plugins)=>()=>{
         const baseEditor = withHistory(withReact(createEditor()));
+        const pluginsMap = new Map();
         const editorWithPlugins = plugins.reduce((editor, plugin)=>{
             if (plugin.init) return plugin.init(editor);
             return editor;
         }, baseEditor);
         const { isInline, isVoid, normalizeNode, deleteFragment, deleteBackward, deleteForward } = editorWithPlugins;
-        editorWithPlugins.normalizeNode = (entry)=>{
-            const [node, path] = entry;
-            const lastElement = editorWithPlugins.children[editorWithPlugins.children.length - 1];
-            if (!lastElement || 'paragraph' !== lastElement.type) {
-                const paragraph = {
-                    type: 'paragraph',
-                    children: [
-                        {
-                            text: ''
-                        }
-                    ]
-                };
-                Transforms.insertNodes(editorWithPlugins, paragraph, {
-                    at: [
-                        editorWithPlugins.children.length
-                    ]
-                });
-            }
-            return normalizeNode([
-                node,
-                path
-            ]);
+        editorWithPlugins.getCommands = (plugin)=>{
+            const pluginInstance = pluginsMap.get(plugin);
+            if (!pluginInstance) throw new Error(`Plugin ${plugin.name} not found`);
+            return pluginInstance.commands;
         };
         editorWithPlugins.isVoid = (element)=>{
             const result = plugins.reduce((result, plugin)=>{
@@ -150,17 +133,21 @@ const createEditor_createEditor = (plugins)=>()=>{
                     const plugin = plugins.find((plugin)=>plugin.blocks?.find((b)=>b.type === node.type));
                     if (plugin) {
                         const match = plugin.blocks?.find((b)=>b.type === node.type);
-                        const result = match?.onBeforeDelete ? await match.onBeforeDelete([
-                            node
-                        ]) : true;
-                        if (!result) return;
-                        Transforms.removeNodes(editorWithPlugins, {
-                            at: path,
-                            match: (n)=>n.type === node.type
-                        });
-                        match?.onDelete?.([
-                            node
-                        ]);
+                        const hasOnBeforeDelete = match?.onBeforeDelete;
+                        if (!hasOnBeforeDelete) return void deleteFragment(options);
+                        {
+                            const result = await match.onBeforeDelete([
+                                node
+                            ]);
+                            if (!result) return;
+                            Transforms.removeNodes(editorWithPlugins, {
+                                at: path,
+                                match: (n)=>n.type === node.type
+                            });
+                            match?.onDelete?.([
+                                node
+                            ]);
+                        }
                     } else Transforms.removeNodes(editorWithPlugins, {
                         at: path,
                         match: (n)=>n.type === node.type

package/dist/elements/BaseElement.d.ts

@@ -1,2 +1,2 @@
-import { RenderElementProps } from 'slate-react';
+import type { RenderElementProps } from 'slate-react';
 export declare const BaseElement: (props: RenderElementProps) => import("react/jsx-runtime").JSX.Element;

package/dist/plugins/AttachmentsPlugin/types.d.ts

@@ -1,6 +1,6 @@
-import { Editor } from 'slate';
-import { RenderElementProps } from 'slate-react';
-import { ReactNode } from 'react';
+import type { Editor } from 'slate';
+import type { RenderElementProps } from 'slate-react';
+import type { ReactNode } from 'react';
 export type Options = {
     onDragEnter?: () => void;
     onDragLeave?: () => void;

package/dist/plugins/BreaksPlugin/BreaksPlugin.d.ts

@@ -7,7 +7,9 @@ type Options = {
 export declare class BreaksPlugin implements IPlugin {
     private options;
     constructor(options: Options);
-    init(editor: Editor): import("slate").BaseEditor & import("slate-react").ReactEditor;
+    init(editor: Editor): import("slate").BaseEditor & import("slate-react").ReactEditor & {
+        getCommands: <T extends IPlugin>(plugin: new () => T) => T["commands"];
+    };
     handlers: {
         onKeyDown: (event: KeyboardEvent, editor: Editor) => void;
     };

package/dist/plugins/CodeBlockPlugin/utils.d.ts

@@ -2,7 +2,7 @@
  * Copied from prism-react-renderer repo
  * https://github.com/FormidableLabs/prism-react-renderer/blob/master/src/utils/normalizeTokens.js
  * */
-import Prism from 'prismjs';
+import type Prism from 'prismjs';
 type PrismToken = Prism.Token;
 type Token = {
     types: string[];

package/dist/plugins/HeadingsPlugin/HeadingsPlugin.d.ts

@@ -1,4 +1,4 @@
-import { Descendant, Editor } from 'slate';
+import { type Descendant, Editor } from 'slate';
 import type { RenderElementProps } from 'slate-react';
 import type { IPlugin } from '../../types';
 export declare class HeadingsPlugin implements IPlugin {

package/dist/plugins/LinksPlugin/LinksPlugin.d.ts

@@ -6,7 +6,9 @@ export declare class LinksPlugin implements IPlugin {
     private options;
     static LINK_TYPE: string;
     constructor(options: Options);
-    init(editor: Editor): import("slate").BaseEditor & import("slate-react").ReactEditor;
+    init(editor: Editor): import("slate").BaseEditor & import("slate-react").ReactEditor & {
+        getCommands: <T extends IPlugin>(plugin: new () => T) => T["commands"];
+    };
     blocks: {
         isInline: boolean;
         type: string;

package/dist/plugins/LinksPlugin/index.d.ts

@@ -1,2 +1,2 @@
 export { LinksPlugin } from './LinksPlugin';
-export { type OptionsMethods } from './types';
+export type { OptionsMethods } from './types';

package/dist/plugins/LinksPlugin/types.d.ts

@@ -1,6 +1,6 @@
-import { LINK_ELEMENT } from './constants';
-import { Editor } from 'slate';
-import { ReactNode } from 'react';
+import type { LINK_ELEMENT } from './constants';
+import type { Editor } from 'slate';
+import type { ReactNode } from 'react';
 export type LinkElement = {
     type: typeof LINK_ELEMENT;
     url: string;

package/dist/plugins/ListsPlugin/ListsPlugin.d.ts

@@ -13,7 +13,9 @@ export declare class ListsPlugin implements IPlugin {
     static NUMBERED_LIST_ELEMENT: string;
     static LIST_ITEM_ELEMENT: string;
     constructor(options?: Options);
-    init: (editor: Editor) => import("slate").BaseEditor & import("slate-react").ReactEditor;
+    init: (editor: Editor) => import("slate").BaseEditor & import("slate-react").ReactEditor & {
+        getCommands: <T extends IPlugin>(plugin: new () => T) => T["commands"];
+    };
     blocks: {
         type: string;
         render: (props: RenderElementProps) => import("react/jsx-runtime").JSX.Element;
@@ -23,6 +25,10 @@ export declare class ListsPlugin implements IPlugin {
     handlers: {
         onKeyDown: (event: KeyboardEvent, editor: Editor) => true | undefined;
     };
+    commands: {
+        toggleBulletedList: () => (editor: Editor) => void;
+        toggleNumberedList: () => (editor: Editor) => void;
+    };
     static isListActive: (editor: Editor, type: string) => boolean;
     static isBulletedListActive: (editor: Editor) => boolean;
     static isNumberedListActive: (editor: Editor) => boolean;

package/dist/plugins/ListsPlugin/ListsPlugin.js

@@ -196,6 +196,10 @@ class ListsPlugin {
             }
         }
     };
+    commands = {
+        toggleBulletedList: ()=>(editor)=>ListsPlugin.toggleList(editor, ListsPlugin.BULLETED_LIST_ELEMENT),
+        toggleNumberedList: ()=>(editor)=>ListsPlugin.toggleList(editor, ListsPlugin.NUMBERED_LIST_ELEMENT)
+    };
     static isListActive = (editor, type)=>{
         const { selection } = editor;
         if (!selection) return false;

package/dist/plugins/MenuPlugin/Menu.d.ts

@@ -1,2 +1,2 @@
-import { Options } from './types';
+import type { Options } from './types';
 export declare const Menu: (props: Options) => import("react/jsx-runtime").JSX.Element;

package/dist/plugins/MenuPlugin/MenuPlugin.d.ts

@@ -3,5 +3,5 @@ import type { Options } from './types';
 export declare class MenuPlugin implements IPlugin {
     private options;
     constructor(options: Options);
-    ui: (params: UiParams) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | null | undefined;
+    ui: (params: UiParams) => string | number | bigint | boolean | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
 }

package/dist/plugins/MenuPlugin/types.d.ts

@@ -1,4 +1,4 @@
-import { UiParams } from '../../types';
+import type { UiParams } from '../../types';
 export type Options = {
     renderMenu: (props: UiParams) => React.ReactNode;
 };

package/dist/plugins/NodeIdPlugin/NodeIdPlugin.d.ts

@@ -10,6 +10,8 @@ type Options = {
 export declare class NodeIdPlugin implements IPlugin<Editor, NodeIdBlock> {
     private options;
     constructor(options: Options);
-    init(editor: Editor): import("slate").BaseEditor & import("slate-react").ReactEditor;
+    init(editor: Editor): import("slate").BaseEditor & import("slate-react").ReactEditor & {
+        getCommands: <T extends IPlugin>(plugin: new () => T) => T["commands"];
+    };
 }
 export {};

package/dist/plugins/NodeIdPlugin/NodeIdPlugin.js

@@ -1,8 +1,11 @@
 import { Element, Node, Text } from "slate";
 const assignId = (node, generateId)=>{
     if (Element.isElement(node)) try {
+        if (node.nodeId) return;
         node.nodeId = generateId();
-        node.children.forEach((n)=>assignId(n, generateId));
+        node.children.forEach((n)=>{
+            assignId(n, generateId);
+        });
     } catch  {}
 };
 class NodeIdPlugin {

package/dist/plugins/ShortcutsPlugin/ShortcutsPlugin.d.ts

@@ -19,6 +19,8 @@ export type ChangeMatch = {
 export declare class ShortcutsPlugin implements IPlugin {
     private options;
     constructor(options: Options);
-    init(editor: Editor): import("slate").BaseEditor & import("slate-react").ReactEditor;
+    init(editor: Editor): import("slate").BaseEditor & import("slate-react").ReactEditor & {
+        getCommands: <T extends IPlugin>(plugin: new () => T) => T["commands"];
+    };
 }
 export {};

package/dist/plugins/TableOfContentsPlugin/TableOfContentsPlugin.d.ts

@@ -12,7 +12,9 @@ export declare class TableOfContentsPlugin implements IPlugin {
         headings: NodeEntry<CustomElement>[];
     }>;
     constructor(options: Options);
-    init(editor: Editor): import("slate").BaseEditor & ReactEditor;
+    init(editor: Editor): import("slate").BaseEditor & ReactEditor & {
+        getCommands: <T extends IPlugin>(plugin: new () => T) => T["commands"];
+    };
     ui(params: UiParams): import("react/jsx-runtime").JSX.Element;
 }
 export {};

package/dist/types.d.ts

@@ -15,6 +15,9 @@ export interface IPlugin<TEditor extends Editor = Editor, TBlock extends CustomE
         onPaste?: (event: ClipboardEvent, editor: Editor) => void;
     };
     decorate?: (entry: NodeEntry) => DecoratedRange[];
+    commands?: {
+        [key: string]: (editor: TEditor, ...args: any[]) => void;
+    };
     ui?: (params: UiParams) => ReactNode;
 }
 export type Block<TEditor extends Editor = Editor, TBlock extends CustomElement = CustomElement> = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@use-kona/editor",
-  "version": "0.1.12",
+  "version": "0.1.14",
   "type": "module",
   "exports": {
     ".": "./src/index.ts"
@@ -21,7 +21,6 @@
     "test": "vitest run"
   },
   "devDependencies": {
-    "@biomejs/biome": "2.0.0",
     "@rsbuild/core": "~1.4.0",
     "@rsbuild/plugin-react": "^1.3.2",
     "@rslib/core": "^0.10.4",

package/src/core/createEditable.tsx

@@ -9,10 +9,10 @@ import React, {
   useCallback,
 } from 'react';
 import {
-  DecoratedRange,
-  Descendant,
-  Editor,
-  NodeEntry,
+  type DecoratedRange,
+  type Descendant,
+  type Editor,
+  type NodeEntry,
   Transforms,
 } from 'slate';
 import {

package/src/core/createEditor.ts

@@ -14,6 +14,8 @@ import type { Block, IPlugin } from '../types';
 export const createEditor = (plugins: IPlugin[]) => () => {
   const baseEditor = withHistory(withReact(createBaseEditor()));
 
+  const pluginsMap = new Map<new () => IPlugin, IPlugin>();
+
   const editorWithPlugins = plugins.reduce<Editor>((editor, plugin) => {
     if (plugin.init) {
       return plugin.init(editor);
@@ -31,22 +33,14 @@ export const createEditor = (plugins: IPlugin[]) => () => {
     deleteForward,
   } = editorWithPlugins;
 
-  editorWithPlugins.normalizeNode = (entry) => {
-    const [node, path] = entry;
-
-    const lastElement =
-      editorWithPlugins.children[editorWithPlugins.children.length - 1];
-    if (!lastElement || (lastElement as CustomElement).type !== 'paragraph') {
-      const paragraph = {
-        type: 'paragraph',
-        children: [{ text: '' }],
-      };
-      Transforms.insertNodes(editorWithPlugins, paragraph, {
-        at: [editorWithPlugins.children.length],
-      });
+  editorWithPlugins.getCommands = (plugin: new () => IPlugin) => {
+    const pluginInstance = pluginsMap.get(plugin);
+
+    if (!pluginInstance) {
+      throw new Error(`Plugin ${plugin.name} not found`);
     }
 
-    return normalizeNode([node, path]);
+    return pluginInstance.commands;
   };
 
   editorWithPlugins.isVoid = (element) => {
@@ -201,16 +195,18 @@ export const createEditor = (plugins: IPlugin[]) => () => {
     const nodes = Array.from(
       Editor.nodes<CustomElement>(editorWithPlugins, {
         at: selection,
-        match: (n) =>
-          !Editor.isEditor(n) &&
-          Editor.isBlock(editorWithPlugins, n as CustomElement),
+        match: (n) => {
+          return (
+            !Editor.isEditor(n) &&
+            Editor.isBlock(editorWithPlugins, n as CustomElement)
+          );
+        },
         reverse: true,
         mode: 'highest',
         voids: true,
       }),
     );
 
-
     for (const entry of nodes) {
       const [node, path] = entry;
 
@@ -222,18 +218,26 @@ export const createEditor = (plugins: IPlugin[]) => () => {
         const plugin = plugins.find((plugin) =>
           plugin.blocks?.find((b) => b.type === node.type),
         );
+
         if (plugin) {
           const match = plugin.blocks?.find((b) => b.type === node.type);
-          const result = match?.onBeforeDelete
-            ? await match.onBeforeDelete([node])
-            : true;
-          if (result) {
-            Transforms.removeNodes(editorWithPlugins, {
-              at: path,
-              match: (n) => (n as CustomElement).type === node.type,
-            });
-            match?.onDelete?.([node]);
+
+          const hasOnBeforeDelete = match?.onBeforeDelete;
+
+          if (hasOnBeforeDelete) {
+            const result = await match.onBeforeDelete!([node]);
+
+            if (result) {
+              Transforms.removeNodes(editorWithPlugins, {
+                at: path,
+                match: (n) => (n as CustomElement).type === node.type,
+              });
+              match?.onDelete?.([node]);
+            } else {
+              return;
+            }
           } else {
+            deleteFragment(options);
             return;
           }
         } else {

package/src/elements/BaseElement.tsx

@@ -1,4 +1,4 @@
-import { RenderElementProps } from 'slate-react';
+import type { RenderElementProps } from 'slate-react';
 
 export const BaseElement = (props: RenderElementProps) => {
   return <p {...props.attributes}>{props.children}</p>;

package/src/plugins/AttachmentsPlugin/types.ts

@@ -1,6 +1,6 @@
-import { Editor } from 'slate';
-import { RenderElementProps } from 'slate-react';
-import { ReactNode } from 'react';
+import type { Editor } from 'slate';
+import type { RenderElementProps } from 'slate-react';
+import type { ReactNode } from 'react';
 
 export type Options = {
   onDragEnter?: () => void;

package/src/plugins/CodeBlockPlugin/utils.ts

@@ -3,7 +3,7 @@
  * https://github.com/FormidableLabs/prism-react-renderer/blob/master/src/utils/normalizeTokens.js
  * */
 
-import Prism from 'prismjs'
+import type Prism from 'prismjs'
 
 type PrismToken = Prism.Token
 type Token = {

package/src/plugins/HeadingsPlugin/HeadingsPlugin.tsx

@@ -1,4 +1,4 @@
-import { Descendant, Editor, Element, Transforms } from 'slate';
+import { type Descendant, Editor, Element, Transforms } from 'slate';
 import { jsx } from 'slate-hyperscript';
 import type { RenderElementProps } from 'slate-react';
 import type { IPlugin } from '../../types';

package/src/plugins/LinksPlugin/index.ts

@@ -1,2 +1,2 @@
 export { LinksPlugin } from './LinksPlugin';
-export { type OptionsMethods } from './types';
+export type { OptionsMethods } from './types';

package/src/plugins/LinksPlugin/types.ts

@@ -1,6 +1,6 @@
-import { LINK_ELEMENT } from './constants';
-import { Editor } from 'slate';
-import { ReactNode } from 'react';
+import type { LINK_ELEMENT } from './constants';
+import type { Editor } from 'slate';
+import type { ReactNode } from 'react';
 
 export type LinkElement = {
   type: typeof LINK_ELEMENT;

package/src/plugins/ListsPlugin/ListsPlugin.spec.tsx

@@ -4,7 +4,7 @@
 import {
   createHyperscript,
   createText,
-  HyperscriptShorthands,
+  type HyperscriptShorthands,
 } from 'slate-hyperscript';
 import { describe, expect, it } from 'vitest';
 import { createEditor } from '../../core/createEditor';

package/src/plugins/ListsPlugin/ListsPlugin.tsx

@@ -328,6 +328,15 @@ export class ListsPlugin implements IPlugin {
     },
   };
 
+  commands = {
+    toggleBulletedList: () => (editor: Editor) => {
+      return ListsPlugin.toggleList(editor, ListsPlugin.BULLETED_LIST_ELEMENT);
+    },
+    toggleNumberedList: () => (editor: Editor) => {
+      return ListsPlugin.toggleList(editor, ListsPlugin.NUMBERED_LIST_ELEMENT);
+    },
+  };
+
   static isListActive = (editor: Editor, type: string) => {
     const { selection } = editor;
 

package/src/plugins/MenuPlugin/Menu.tsx

@@ -1,5 +1,5 @@
 import { useReadOnly, useSlate } from 'slate-react';
-import { Options } from './types';
+import type { Options } from './types';
 
 export const Menu = (props: Options) => {
   const editor = useSlate();

package/src/plugins/MenuPlugin/types.ts

@@ -1,4 +1,4 @@
-import { UiParams } from '../../types';
+import type { UiParams } from '../../types';
 
 export type Options = {
   renderMenu: (props: UiParams) => React.ReactNode;

package/src/plugins/NodeIdPlugin/NodeIdPlugin.ts

@@ -9,8 +9,14 @@ type NodeIdBlock = CustomElement & {
 const assignId = (node: Node, generateId: () => string) => {
   if (Element.isElement(node)) {
     try {
+      if ((node as NodeIdBlock).nodeId) {
+        return;
+      }
+
       (node as NodeIdBlock).nodeId = generateId();
-      node.children.forEach((n) => assignId(n, generateId));
+      node.children.forEach((n) => {
+        assignId(n, generateId);
+      });
     } catch {}
   }
 };

package/src/types.ts

@@ -1,5 +1,11 @@
 import type { KeyboardEvent, ReactElement, ReactNode } from 'react';
-import type {DecoratedRange, Descendant, Editor, NodeEntry, NodeMatch} from 'slate';
+import type {
+  DecoratedRange,
+  Descendant,
+  Editor,
+  NodeEntry,
+  NodeMatch,
+} from 'slate';
 import type { RenderElementProps, RenderLeafProps } from 'slate-react';
 import type { CustomElement, CustomText } from '../types';
 
@@ -24,6 +30,10 @@ export interface IPlugin<
 
   decorate?: (entry: NodeEntry) => DecoratedRange[];
 
+  commands?: {
+    [key: string]: (editor: TEditor, ...args: any[]) => void;
+  };
+
   ui?: (params: UiParams) => ReactNode;
 }