@lofcz/platejs-tabbable 52.0.11

package/LICENSE

@@ -0,0 +1,24 @@
+The MIT License (MIT)
+
+Copyright (c) Ziad Beyens, Dylan Schiemann, Joe Anderson, Felix Feng
+
+Unless otherwise specified in a LICENSE file within an individual package directory,
+this license applies to all files in this repository outside of those package directories.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1,12 @@
+# Plate tabbable plugin
+
+This package programmatically corrects the tab order for tabbable elements inside the editor
+
+## Documentation
+
+Check out
+[Tabbable](https://platejs.org/docs/tabbable).
+
+## License
+
+[MIT](../../LICENSE)

package/dist/findTabDestination-VIYSr_9z.js

@@ -0,0 +1,70 @@
+import { KEYS, PathApi, createTSlatePlugin } from "platejs";
+
+//#region src/lib/BaseTabbablePlugin.ts
+const BaseTabbablePlugin = createTSlatePlugin({
+	key: KEYS.tabbable,
+	options: {
+		globalEventListener: false,
+		insertTabbableEntries: () => [],
+		query: () => true
+	}
+}).extend(({ editor }) => ({ options: { isTabbable: (tabbableEntry) => editor.api.isVoid(tabbableEntry.slateNode) } }));
+
+//#endregion
+//#region src/lib/findTabDestination.ts
+const findTabDestination = (editor, { activeTabbableEntry, direction, tabbableEntries }) => {
+	if (activeTabbableEntry) {
+		const nextTabbableEntry$1 = tabbableEntries[tabbableEntries.indexOf(activeTabbableEntry) + (direction === "forward" ? 1 : -1)];
+		/**
+		* If the next tabbable entry originated from the same path as the active
+		* tabbable entry, focus it.
+		*
+		* Examples of when this is true:
+		*
+		* - We're inside a void node and there is an additional tabbable inside the
+		*   same void node.
+		* - We're inside a popover containing multiple tabbable elements all anchored
+		*   to the same slate node, and there is an additional tabbable inside the
+		*   same popover.
+		*
+		* Examples of when this is false:
+		*
+		* - We're inside a void node and the next tabbable is outside the void node.
+		* - We're in the last tabbable element of a popover.
+		* - There is no next tabbable element.
+		*/
+		if (nextTabbableEntry$1 && PathApi.equals(activeTabbableEntry.path, nextTabbableEntry$1.path)) return {
+			domNode: nextTabbableEntry$1.domNode,
+			type: "dom-node"
+		};
+		/**
+		* Otherwise, return the focus to the editor. If we're moving forward, focus
+		* the first point after the active tabbable's path. If we're moving
+		* backward, focus the point of the active tabbable's path. TODO: Let a
+		* tabbable entry specify custom before and after points.
+		*/
+		if (direction === "forward") {
+			const pointAfter = editor.api.after(activeTabbableEntry.path);
+			if (!pointAfter) return null;
+			return {
+				path: pointAfter.path,
+				type: "path"
+			};
+		}
+		return {
+			path: editor.api.point(activeTabbableEntry.path).path,
+			type: "path"
+		};
+	}
+	const selectionPath = editor.selection?.anchor?.path || [];
+	const nextTabbableEntry = direction === "forward" ? tabbableEntries.find((entry) => !PathApi.isBefore(entry.path, selectionPath)) : [...tabbableEntries].reverse().find((entry) => PathApi.isBefore(entry.path, selectionPath));
+	if (nextTabbableEntry) return {
+		domNode: nextTabbableEntry.domNode,
+		type: "dom-node"
+	};
+	return null;
+};
+
+//#endregion
+export { BaseTabbablePlugin as n, findTabDestination as t };
+//# sourceMappingURL=findTabDestination-VIYSr_9z.js.map

package/dist/findTabDestination-VIYSr_9z.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"findTabDestination-VIYSr_9z.js","names":["PluginConfig","createTSlatePlugin","KEYS","TabbableEntry","TabblableConfig","globalEventListener","insertTabbableEntries","event","KeyboardEvent","isTabbable","entry","query","BaseTabbablePlugin","key","tabbable","options","extend","editor","tabbableEntry","api","isVoid","slateNode","SlateEditor","PathApi","TabbableEntry","TabDestination","FindTabDestinationOptions","activeTabbableEntry","direction","tabbableEntries","findTabDestination","editor","activeTabbableEntryIndex","indexOf","nextTabbableEntryIndex","nextTabbableEntry","equals","path","domNode","type","pointAfter","api","after","point","selectionPath","selection","anchor","find","entry","isBefore","reverse"],"sources":["../src/lib/BaseTabbablePlugin.ts","../src/lib/findTabDestination.ts"],"sourcesContent":["import { type PluginConfig, createTSlatePlugin, KEYS } from 'platejs';\n\nimport type { TabbableEntry } from './types';\n\nexport type TabblableConfig = PluginConfig<\n  'tabbable',\n  {\n    /**\n     * When true, the plugin will add its event listener to the document instead\n     * of the editor, allowing it to capture events from outside the editor.\n     *\n     * @default: false\n     */\n    globalEventListener?: boolean;\n    /**\n     * Add additional tabbables to the list of tabbables. Useful for adding\n     * tabbables that are not contained within the editor. Ignores\n     * `isTabbable`.\n     *\n     * @default: () => []\n     */\n    insertTabbableEntries?: (event: KeyboardEvent) => TabbableEntry[];\n    /**\n     * Determine whether an element should be included in the tabbable list.\n     *\n     * @default: (editor, tabbableEntry) => editor.api.isVoid(tabbableEntry.slateNode)\n     */\n    isTabbable?: (entry: TabbableEntry) => boolean;\n    /**\n     * Dynamically enable or disable the plugin.\n     *\n     * @default: () => true\n     */\n    query?: (event: KeyboardEvent) => boolean;\n  }\n>;\n\nexport const BaseTabbablePlugin = createTSlatePlugin<TabblableConfig>({\n  key: KEYS.tabbable,\n  options: {\n    globalEventListener: false,\n    insertTabbableEntries: () => [],\n    query: () => true,\n  },\n}).extend(({ editor }) => ({\n  options: {\n    isTabbable: (tabbableEntry) => editor.api.isVoid(tabbableEntry.slateNode),\n  },\n}));\n","import { type SlateEditor, PathApi } from 'platejs';\n\nimport type { TabbableEntry, TabDestination } from './types';\n\nexport type FindTabDestinationOptions = {\n  activeTabbableEntry: TabbableEntry | null;\n  direction: 'backward' | 'forward';\n  tabbableEntries: TabbableEntry[];\n};\n\nexport const findTabDestination = (\n  editor: SlateEditor,\n  { activeTabbableEntry, direction, tabbableEntries }: FindTabDestinationOptions\n): TabDestination | null => {\n  // Case 1: A tabbable entry was active before tab was pressed\n  if (activeTabbableEntry) {\n    // Find the next tabbable entry after the active one\n    const activeTabbableEntryIndex =\n      tabbableEntries.indexOf(activeTabbableEntry);\n    const nextTabbableEntryIndex =\n      activeTabbableEntryIndex + (direction === 'forward' ? 1 : -1);\n    const nextTabbableEntry = tabbableEntries[nextTabbableEntryIndex];\n\n    /**\n     * If the next tabbable entry originated from the same path as the active\n     * tabbable entry, focus it.\n     *\n     * Examples of when this is true:\n     *\n     * - We're inside a void node and there is an additional tabbable inside the\n     *   same void node.\n     * - We're inside a popover containing multiple tabbable elements all anchored\n     *   to the same slate node, and there is an additional tabbable inside the\n     *   same popover.\n     *\n     * Examples of when this is false:\n     *\n     * - We're inside a void node and the next tabbable is outside the void node.\n     * - We're in the last tabbable element of a popover.\n     * - There is no next tabbable element.\n     */\n    if (\n      nextTabbableEntry &&\n      PathApi.equals(activeTabbableEntry.path, nextTabbableEntry.path)\n    ) {\n      return {\n        domNode: nextTabbableEntry.domNode,\n        type: 'dom-node',\n      };\n    }\n    /**\n     * Otherwise, return the focus to the editor. If we're moving forward, focus\n     * the first point after the active tabbable's path. If we're moving\n     * backward, focus the point of the active tabbable's path. TODO: Let a\n     * tabbable entry specify custom before and after points.\n     */\n    if (direction === 'forward') {\n      const pointAfter = editor.api.after(activeTabbableEntry.path);\n\n      if (!pointAfter) return null;\n\n      return {\n        path: pointAfter.path,\n        type: 'path',\n      };\n    }\n\n    return {\n      path: editor.api.point(activeTabbableEntry.path)!.path,\n      type: 'path',\n    };\n  }\n\n  // Case 2: No tabbable entry was active before tab was pressed\n\n  const selectionPath = editor.selection?.anchor?.path || [];\n\n  // Find the first tabbable entry after the selection\n  const nextTabbableEntry =\n    direction === 'forward'\n      ? tabbableEntries.find(\n          (entry) => !PathApi.isBefore(entry.path, selectionPath)\n        )\n      : [...tabbableEntries]\n          .reverse()\n          .find((entry) => PathApi.isBefore(entry.path, selectionPath));\n\n  // If it exists, focus it\n  if (nextTabbableEntry) {\n    return {\n      domNode: nextTabbableEntry.domNode,\n      type: 'dom-node',\n    };\n  }\n\n  // Otherwise, use the default behaviour\n  return null;\n};\n"],"mappings":";;;AAqCA,MAAaY,qBAAqBX,mBAAoC;CACpEY,KAAKX,KAAKY;CACVC,SAAS;EACPV,qBAAqB;EACrBC,6BAA6B,EAAE;EAC/BK,aAAa;EACf;CACD,CAAC,CAACK,QAAQ,EAAEC,cAAc,EACzBF,SAAS,EACPN,aAAaS,kBAAkBD,OAAOE,IAAIC,OAAOF,cAAcG,UAAS,EAC1E,EACD,EAAE;;;;ACtCH,MAAaS,sBACXC,QACA,EAAEJ,qBAAqBC,WAAWC,sBACR;AAE1B,KAAIF,qBAAqB;EAMvB,MAAMQ,sBAAoBN,gBAHxBA,gBAAgBI,QAAQN,oBAAoB,IAEhBC,cAAc,YAAY,IAAI;;;;;;;;;;;;;;;;;;;AAqB5D,MACEO,uBACAZ,QAAQa,OAAOT,oBAAoBU,MAAMF,oBAAkBE,KAAK,CAEhE,QAAO;GACLC,SAASH,oBAAkBG;GAC3BC,MAAM;GACP;;;;;;;AAQH,MAAIX,cAAc,WAAW;GAC3B,MAAMY,aAAaT,OAAOU,IAAIC,MAAMf,oBAAoBU,KAAK;AAE7D,OAAI,CAACG,WAAY,QAAO;AAExB,UAAO;IACLH,MAAMG,WAAWH;IACjBE,MAAM;IACP;;AAGH,SAAO;GACLF,MAAMN,OAAOU,IAAIE,MAAMhB,oBAAoBU,KAAK,CAAEA;GAClDE,MAAM;GACP;;CAKH,MAAMK,gBAAgBb,OAAOc,WAAWC,QAAQT,QAAQ,EAAE;CAG1D,MAAMF,oBACJP,cAAc,YACVC,gBAAgBkB,MACbC,UAAU,CAACzB,QAAQ0B,SAASD,MAAMX,MAAMO,cAC3C,CAAC,GACD,CAAC,GAAGf,gBAAgB,CACjBqB,SAAS,CACTH,MAAMC,UAAUzB,QAAQ0B,SAASD,MAAMX,MAAMO,cAAc,CAAC;AAGrE,KAAIT,kBACF,QAAO;EACLG,SAASH,kBAAkBG;EAC3BC,MAAM;EACP;AAIH,QAAO"}

package/dist/index.d.ts

@@ -0,0 +1,64 @@
+import { Path, PluginConfig, SlateEditor, TElement } from "platejs";
+
+//#region src/lib/types.d.ts
+type TabbableEntry = {
+  domNode: HTMLElement;
+  path: Path;
+  slateNode: TElement;
+};
+type TabDestination = TabDestinationDOMNode | TabDestinationPath;
+type TabDestinationDOMNode = {
+  domNode: HTMLElement;
+  type: 'dom-node';
+};
+type TabDestinationPath = {
+  path: Path;
+  type: 'path';
+};
+//#endregion
+//#region src/lib/BaseTabbablePlugin.d.ts
+type TabblableConfig = PluginConfig<'tabbable', {
+  /**
+   * When true, the plugin will add its event listener to the document instead
+   * of the editor, allowing it to capture events from outside the editor.
+   *
+   * @default: false
+   */
+  globalEventListener?: boolean;
+  /**
+   * Add additional tabbables to the list of tabbables. Useful for adding
+   * tabbables that are not contained within the editor. Ignores
+   * `isTabbable`.
+   *
+   * @default: () => []
+   */
+  insertTabbableEntries?: (event: KeyboardEvent) => TabbableEntry[];
+  /**
+   * Determine whether an element should be included in the tabbable list.
+   *
+   * @default: (editor, tabbableEntry) => editor.api.isVoid(tabbableEntry.slateNode)
+   */
+  isTabbable?: (entry: TabbableEntry) => boolean;
+  /**
+   * Dynamically enable or disable the plugin.
+   *
+   * @default: () => true
+   */
+  query?: (event: KeyboardEvent) => boolean;
+}>;
+declare const BaseTabbablePlugin: any;
+//#endregion
+//#region src/lib/findTabDestination.d.ts
+type FindTabDestinationOptions = {
+  activeTabbableEntry: TabbableEntry | null;
+  direction: 'backward' | 'forward';
+  tabbableEntries: TabbableEntry[];
+};
+declare const findTabDestination: (editor: SlateEditor, {
+  activeTabbableEntry,
+  direction,
+  tabbableEntries
+}: FindTabDestinationOptions) => TabDestination | null;
+//#endregion
+export { BaseTabbablePlugin, FindTabDestinationOptions, TabDestination, TabDestinationDOMNode, TabDestinationPath, TabbableEntry, TabblableConfig, findTabDestination };
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../src/lib/types.ts","../src/lib/BaseTabbablePlugin.ts","../src/lib/findTabDestination.ts"],"sourcesContent":[],"mappings":";;;KAEY,aAAA;WACD;EADC,IAAA,EAEJ,IAFI;EACD,SAAA,EAEE,QAFF;CACH;AACK,KAGD,cAAA,GAAiB,qBAHhB,GAGwC,kBAHxC;AAAQ,KAKT,qBAAA,GALS;EAGT,OAAA,EAGD,WAHe;EAEd,IAAA,EAAA,UAAA;AAKZ,CAAA;KAAY,kBAAA;QACJ;;ACZR,CAAA;;;KAAY,eAAA,GAAkB;EDFlB;;;;;AAMZ;EAEY,mBAAA,CAAA,EAAA,OAAqB;EAKrB;;;;ACXZ;;;EAuByB,qBAAA,CAAA,EAAA,CAAA,KAAA,EANW,aAMX,EAAA,GAN6B,aAM7B,EAAA;EAML;;;AAIpB;;uBAVyB;;ACvBzB;AAMA;;;EAEE,KAAA,CAAA,EAAA,CAAA,KAAA,EDqBkB,aCrBlB,EAAA,GAAA,OAAA;CAAA,CAAA;AAAqD,cDyB1C,kBCzB0C,EAAA,GAAA;;;KAR3C,yBAAA;EFFA,mBAAa,EEGF,aFHE,GAAA,IAAA;EACd,SAAA,EAAA,UAAA,GAAA,SAAA;EACH,eAAA,EEGW,aFHX,EAAA;CACK;AAAQ,cEKR,kBFLQ,EAAA,CAAA,MAAA,EEMX,WFNW,EAAA;EAAA,mBAAA;EAAA,SAAA;EAAA;AAAA,CAAA,EEOkC,yBFPlC,EAAA,GEQlB,cFRkB,GAAA,IAAA"}

package/dist/index.js

@@ -0,0 +1,3 @@
+import { n as BaseTabbablePlugin, t as findTabDestination } from "./findTabDestination-VIYSr_9z.js";
+
+export { BaseTabbablePlugin, findTabDestination };

package/dist/react/index.d.ts

@@ -0,0 +1,8 @@
+//#region src/react/TabbableEffects.d.ts
+declare function TabbableEffects(): null;
+//#endregion
+//#region src/react/TabbablePlugin.d.ts
+declare const TabbablePlugin: any;
+//#endregion
+export { TabbableEffects, TabbablePlugin };
+//# sourceMappingURL=index.d.ts.map

package/dist/react/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/react/TabbableEffects.tsx","../../src/react/TabbablePlugin.tsx"],"sourcesContent":[],"mappings":";iBAWgB,eAAA,CAAA;;;cCNH"}

package/dist/react/index.js

@@ -0,0 +1,101 @@
+import { n as BaseTabbablePlugin, t as findTabDestination } from "../findTabDestination-VIYSr_9z.js";
+import { PathApi } from "platejs";
+import { c } from "react-compiler-runtime";
+import React from "react";
+import { toPlatePlugin, useEditorReadOnly, useEditorRef } from "platejs/react";
+import { tabbable } from "tabbable";
+
+//#region src/react/TabbableEffects.tsx
+function TabbableEffects() {
+	const $ = c(4);
+	const editor = useEditorRef();
+	const readOnly = useEditorReadOnly();
+	let t0;
+	let t1;
+	if ($[0] !== editor || $[1] !== readOnly) {
+		t0 = () => {
+			if (readOnly) return;
+			const { globalEventListener, insertTabbableEntries, isTabbable, query } = editor.getOptions(BaseTabbablePlugin);
+			const editorDOMNode = editor.api.toDOMNode(editor);
+			if (!editorDOMNode) return;
+			const handler = (event) => {
+				if (event.key !== "Tab" || event.defaultPrevented || !query?.(event)) return;
+				const insertedTabbableEntries = insertTabbableEntries?.(event);
+				if (globalEventListener && event.target && ![editorDOMNode, ...insertedTabbableEntries.map(_temp)].some((container) => container.contains(event.target))) return;
+				const tabbableDOMNodes = tabbable(editorDOMNode);
+				const defaultTabbableEntries = tabbableDOMNodes.map((domNode_0) => {
+					const slateNode = editor.api.toSlateNode(domNode_0);
+					if (!slateNode) return null;
+					return {
+						domNode: domNode_0,
+						path: editor.api.findPath(slateNode),
+						slateNode
+					};
+				}).filter((entry) => entry && isTabbable?.(entry));
+				const tabbableEntries = [...insertedTabbableEntries, ...defaultTabbableEntries].sort(_temp2);
+				const { activeElement } = document;
+				const tabDestination = findTabDestination(editor, {
+					activeTabbableEntry: (activeElement && tabbableEntries.find((entry_0) => entry_0.domNode === activeElement)) ?? null,
+					direction: event.shiftKey ? "backward" : "forward",
+					tabbableEntries
+				});
+				if (tabDestination) {
+					event.preventDefault();
+					bb76: switch (tabDestination.type) {
+						case "dom-node":
+							tabDestination.domNode.focus();
+							break bb76;
+						case "path": editor.tf.focus({ at: {
+							anchor: {
+								offset: 0,
+								path: tabDestination.path
+							},
+							focus: {
+								offset: 0,
+								path: tabDestination.path
+							}
+						} });
+					}
+					return;
+				}
+				tabbableDOMNodes.forEach(_temp3);
+			};
+			const eventListenerNode = globalEventListener ? document.body : editorDOMNode;
+			eventListenerNode.addEventListener("keydown", handler, true);
+			return () => eventListenerNode.removeEventListener("keydown", handler, true);
+		};
+		t1 = [readOnly, editor];
+		$[0] = editor;
+		$[1] = readOnly;
+		$[2] = t0;
+		$[3] = t1;
+	} else {
+		t0 = $[2];
+		t1 = $[3];
+	}
+	React.useEffect(t0, t1);
+	return null;
+}
+function _temp3(domNode_1) {
+	const oldTabIndex = domNode_1.getAttribute("tabindex");
+	domNode_1.setAttribute("tabindex", "-1");
+	setTimeout(() => {
+		if (oldTabIndex) domNode_1.setAttribute("tabindex", oldTabIndex);
+		else domNode_1.removeAttribute("tabindex");
+	}, 0);
+}
+function _temp2(a, b) {
+	return PathApi.compare(a.path, b.path);
+}
+function _temp(t0) {
+	const { domNode } = t0;
+	return domNode;
+}
+
+//#endregion
+//#region src/react/TabbablePlugin.tsx
+const TabbablePlugin = toPlatePlugin(BaseTabbablePlugin, { render: { afterEditable: TabbableEffects } });
+
+//#endregion
+export { TabbableEffects, TabbablePlugin };
+//# sourceMappingURL=index.js.map

package/dist/react/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","PathApi","useEditorReadOnly","useEditorRef","tabbable","TabbableEntry","BaseTabbablePlugin","findTabDestination","TabbableEffects","$","_c","editor","readOnly","t0","t1","globalEventListener","insertTabbableEntries","isTabbable","query","getOptions","editorDOMNode","api","toDOMNode","handler","event","key","defaultPrevented","insertedTabbableEntries","target","map","_temp","some","container","contains","Node","tabbableDOMNodes","HTMLElement","defaultTabbableEntries","domNode_0","slateNode","toSlateNode","domNode","path","findPath","filter","entry","tabbableEntries","sort","_temp2","activeElement","document","activeTabbableEntry","find","entry_0","tabDestination","direction","shiftKey","preventDefault","bb76","type","focus","tf","at","anchor","offset","forEach","_temp3","eventListenerNode","body","addEventListener","removeEventListener","useEffect","domNode_1","oldTabIndex","getAttribute","setAttribute","setTimeout","removeAttribute","a","b","compare","toPlatePlugin","BaseTabbablePlugin","TabbableEffects","TabbablePlugin","render","afterEditable"],"sources":["../../src/react/TabbableEffects.tsx","../../src/react/TabbablePlugin.tsx"],"sourcesContent":["import React from 'react';\n\nimport { PathApi } from 'platejs';\nimport { useEditorReadOnly, useEditorRef } from 'platejs/react';\nimport { tabbable } from 'tabbable';\n\nimport type { TabbableEntry } from '../lib/types';\n\nimport { BaseTabbablePlugin } from '../lib/BaseTabbablePlugin';\nimport { findTabDestination } from '../lib/findTabDestination';\n\nexport function TabbableEffects() {\n  const editor = useEditorRef();\n  const readOnly = useEditorReadOnly();\n\n  React.useEffect(() => {\n    if (readOnly) return;\n\n    const { globalEventListener, insertTabbableEntries, isTabbable, query } =\n      editor.getOptions(BaseTabbablePlugin);\n\n    const editorDOMNode = editor.api.toDOMNode(editor);\n\n    if (!editorDOMNode) return;\n\n    const handler = (event: KeyboardEvent) => {\n      // Check if the keydown is a tab key that should be handled\n      if (event.key !== 'Tab' || event.defaultPrevented || !query?.(event)) {\n        return;\n      }\n\n      /**\n       * Get the list of additional tabbable entries specified in the plugin\n       * options\n       */\n      const insertedTabbableEntries = insertTabbableEntries?.(\n        event\n      ) as TabbableEntry[];\n\n      /**\n       * Global event listener only. Do not handle the tab event if the keydown\n       * was sent to an element other than the editor or one of the additional\n       * tabbable elements.\n       */\n      if (\n        globalEventListener &&\n        event.target &&\n        ![\n          editorDOMNode,\n          ...insertedTabbableEntries.map(({ domNode }) => domNode),\n        ].some((container) => container.contains(event.target as Node))\n      ) {\n        return;\n      }\n\n      // Get all tabbable DOM nodes in the editor\n      const tabbableDOMNodes = tabbable(editorDOMNode) as HTMLElement[];\n\n      /**\n       * Construct a tabbable entry for each tabbable Slate node, filtered by\n       * the `isTabbable` option (defaulting to only void nodes).\n       */\n      const defaultTabbableEntries = tabbableDOMNodes\n        .map((domNode) => {\n          const slateNode = editor.api.toSlateNode(domNode);\n\n          if (!slateNode) return null;\n\n          return {\n            domNode,\n            path: editor.api.findPath(slateNode),\n            slateNode,\n          } as TabbableEntry;\n        })\n        .filter((entry) => entry && isTabbable?.(entry)) as TabbableEntry[];\n\n      /**\n       * The list of all tabbable entries. Sorting by path ensures a consistent\n       * tab order.\n       */\n      const tabbableEntries = [\n        ...insertedTabbableEntries,\n        ...defaultTabbableEntries,\n      ].sort((a, b) => PathApi.compare(a.path, b.path));\n\n      /**\n       * TODO: Refactor everything ABOVE this line into a util function and test\n       * separately\n       */\n\n      // Check if any tabbable entry is the active element\n      const { activeElement } = document;\n      const activeTabbableEntry =\n        (activeElement &&\n          tabbableEntries.find((entry) => entry.domNode === activeElement)) ??\n        null;\n\n      // Find the next Slate node or DOM node to focus\n      const tabDestination = findTabDestination(editor, {\n        activeTabbableEntry,\n        direction: event.shiftKey ? 'backward' : 'forward',\n        tabbableEntries,\n      });\n\n      if (tabDestination) {\n        event.preventDefault();\n\n        switch (tabDestination.type) {\n          case 'dom-node': {\n            tabDestination.domNode.focus();\n\n            break;\n          }\n          case 'path': {\n            editor.tf.focus({\n              at: {\n                anchor: { offset: 0, path: tabDestination.path },\n                focus: { offset: 0, path: tabDestination.path },\n              },\n            });\n\n            break;\n          }\n        }\n\n        return;\n      }\n\n      /**\n       * There was no tab destination, so let the browser handle the tab event.\n       * We don't want the browser to focus anything that could have been\n       * focused by us, so we make make all tabbable DOM nodes in the editor\n       * unfocusable. This ensures that the focus exits the editor cleanly.\n       */\n      tabbableDOMNodes.forEach((domNode) => {\n        const oldTabIndex = domNode.getAttribute('tabindex');\n        domNode.setAttribute('tabindex', '-1');\n\n        setTimeout(() => {\n          if (oldTabIndex) {\n            domNode.setAttribute('tabindex', oldTabIndex);\n          } else {\n            domNode.removeAttribute('tabindex');\n          }\n        }, 0);\n      });\n    };\n\n    const eventListenerNode = globalEventListener\n      ? document.body\n      : editorDOMNode;\n\n    eventListenerNode.addEventListener('keydown', handler, true);\n\n    return () =>\n      eventListenerNode.removeEventListener('keydown', handler, true);\n  }, [readOnly, editor]);\n\n  return null;\n}\n","import { toPlatePlugin } from 'platejs/react';\n\nimport { BaseTabbablePlugin } from '../lib/BaseTabbablePlugin';\nimport { TabbableEffects } from './TabbableEffects';\n\nexport const TabbablePlugin = toPlatePlugin(BaseTabbablePlugin, {\n  render: { afterEditable: TabbableEffects },\n});\n"],"mappings":"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"}

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@lofcz/platejs-tabbable",
+  "version": "52.0.11",
+  "description": "Tab into and out of void nodes and other elements",
+  "keywords": [
+    "plate",
+    "plugin",
+    "slate"
+  ],
+  "homepage": "https://platejs.org",
+  "bugs": {
+    "url": "https://github.com/udecode/plate/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lofcz/plate.git",
+    "directory": "packages/tabbable"
+  },
+  "license": "MIT",
+  "sideEffects": false,
+  "exports": {
+    ".": "./dist/index.js",
+    "./react": "./dist/react/index.js",
+    "./package.json": "./package.json"
+  },
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist/**/*"
+  ],
+  "dependencies": {
+    "react-compiler-runtime": "^1.0.0",
+    "tabbable": "^6.2.0"
+  },
+  "devDependencies": {
+    "@plate/scripts": "1.0.0"
+  },
+  "peerDependencies": {
+    "platejs": ">=52.0.11",
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "module": "./dist/index.js",
+  "scripts": {
+    "brl": "plate-pkg p:brl",
+    "build": "plate-pkg p:build",
+    "build:watch": "plate-pkg p:build:watch",
+    "clean": "plate-pkg p:clean",
+    "lint": "plate-pkg p:lint",
+    "lint:fix": "plate-pkg p:lint:fix",
+    "test": "plate-pkg p:test",
+    "test:watch": "plate-pkg p:test:watch",
+    "typecheck": "plate-pkg p:typecheck"
+  }
+}