@stesura/react-prosemirror 3.2.11-stesura.1

package/dist/esm/decorations/viewDecorations.js

@@ -0,0 +1,155 @@
+import { DecorationSet } from "prosemirror-view";
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const none = [], noSpec = {};
+const empty = DecorationSet.empty;
+// An abstraction that allows the code dealing with decorations to
+// treat multiple DecorationSet objects as if it were a single object
+// with (a subset of) the same interface.
+let DecorationGroup = class DecorationGroup {
+    members;
+    constructor(members){
+        this.members = members;
+    }
+    map(mapping, doc) {
+        const mappedDecos = this.members.map((member)=>member.map(mapping, doc, noSpec));
+        return DecorationGroup.from(mappedDecos);
+    }
+    forChild(offset, child) {
+        if (child.isLeaf) return DecorationSet.empty;
+        let found = [];
+        for(let i = 0; i < this.members.length; i++){
+            const result = this.members[i].forChild(offset, child);
+            if (result == empty) continue;
+            if (result instanceof DecorationGroup) found = found.concat(result.members);
+            else found.push(result);
+        }
+        return DecorationGroup.from(found);
+    }
+    eq(other) {
+        if (!(other instanceof DecorationGroup) || other.members.length != this.members.length) return false;
+        for(let i = 0; i < this.members.length; i++)if (!this.members[i].eq(other.members[i])) return false;
+        return true;
+    }
+    locals(node) {
+        let result, sorted = true;
+        for(let i = 0; i < this.members.length; i++){
+            const locals = this.members[i].localsInner(node);
+            if (!locals.length) continue;
+            if (!result) {
+                result = locals;
+            } else {
+                if (sorted) {
+                    result = result.slice();
+                    sorted = false;
+                }
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                for(let j = 0; j < locals.length; j++)result.push(locals[j]);
+            }
+        }
+        return result ? removeOverlap(sorted ? result : result.sort(byPos)) : none;
+    }
+    // Create a group for the given array of decoration sets, or return
+    // a single set when possible.
+    static from(members) {
+        switch(members.length){
+            case 0:
+                return empty;
+            case 1:
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                return members[0];
+            default:
+                return new DecorationGroup(members.every((m)=>m instanceof DecorationSet) ? members : members.reduce((r, m)=>r.concat(m instanceof DecorationSet ? m : m.members), []));
+        }
+    }
+    forEachSet(f) {
+        for(let i = 0; i < this.members.length; i++)// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        this.members[i].forEachSet(f);
+    }
+};
+// Used to sort decorations so that ones with a low start position
+// come first, and within a set with the same start position, those
+// with an smaller end position come first.
+function byPos(a, b) {
+    return a.from - b.from || a.to - b.to;
+}
+// Scan a sorted array of decorations for partially overlapping spans,
+// and split those so that only fully overlapping spans are left (to
+// make subsequent rendering easier). Will return the input array if
+// no partially overlapping spans are found (the common case).
+function removeOverlap(spans) {
+    let working = spans;
+    for(let i = 0; i < working.length - 1; i++){
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        const span = working[i];
+        if (span.from != span.to) for(let j = i + 1; j < working.length; j++){
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            const next = working[j];
+            if (next.from == span.from) {
+                if (next.to != span.to) {
+                    if (working == spans) working = spans.slice();
+                    // Followed by a partially overlapping larger span. Split that
+                    // span.
+                    working[j] = next.copy(next.from, span.to);
+                    insertAhead(working, j + 1, next.copy(span.to, next.to));
+                }
+                continue;
+            } else {
+                if (next.from < span.to) {
+                    if (working == spans) working = spans.slice();
+                    // The end of this one overlaps with a subsequent span. Split
+                    // this one.
+                    working[i] = span.copy(span.from, next.from);
+                    insertAhead(working, j, span.copy(next.from, span.to));
+                }
+                break;
+            }
+        }
+    }
+    return working;
+}
+function insertAhead(array, i, deco) {
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    while(i < array.length && byPos(deco, array[i]) > 0)i++;
+    array.splice(i, 0, deco);
+}
+const ViewDecorationsCache = new WeakMap();
+/**
+ * Produces the DecorationSource for the current state, based
+ * on the decorations editor prop.
+ *
+ * The return value of this function is memoized; if it is to
+ * return an equivalent value to the last time it was called for
+ * a given EditorView, it will return exactly that previous value.
+ *
+ * This makes it safe to call in a React render function, even
+ * if its result is used in a dependencies array for a hook.
+ */ export function viewDecorations(view) {
+    const found = [];
+    view.someProp("decorations", (f)=>{
+        const result = f(view.state);
+        if (result && result != empty) found.push(result);
+    });
+    const previous = ViewDecorationsCache.get(view);
+    if (!previous) {
+        const result = DecorationGroup.from(found);
+        ViewDecorationsCache.set(view, result);
+        return result;
+    }
+    let numPrevious = 0;
+    let areSetsEqual = true;
+    previous.forEachSet((set)=>{
+        const next = found[numPrevious++];
+        if (next !== set) {
+            areSetsEqual = false;
+        }
+    });
+    if (numPrevious !== found.length) {
+        areSetsEqual = false;
+    }
+    if (!areSetsEqual) {
+        const result = DecorationGroup.from(found);
+        ViewDecorationsCache.set(view, result);
+        return result;
+    }
+    return previous;
+}

package/dist/esm/dom.js

@@ -0,0 +1,110 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */ /* eslint-disable @typescript-eslint/no-non-null-assertion */ export const domIndex = function(node) {
+    for(let index = 0;; index++){
+        node = node.previousSibling;
+        if (!node) return index;
+    }
+};
+export const parentNode = function(node) {
+    const parent = node.assignedSlot || node.parentNode;
+    return parent && parent.nodeType == 11 ? parent.host : parent;
+};
+let reusedRange = null;
+// Note that this will always return the same range, because DOM range
+// objects are every expensive, and keep slowing down subsequent DOM
+// updates, for some reason.
+export const textRange = function(node, from, to) {
+    const range = reusedRange || (reusedRange = document.createRange());
+    range.setEnd(node, to == null ? node.nodeValue.length : to);
+    range.setStart(node, from || 0);
+    return range;
+};
+// Scans forward and backward through DOM positions equivalent to the
+// given one to see if the two are in the same place (i.e. after a
+// text node vs at the end of that text node)
+export const isEquivalentPosition = function(node, off, targetNode, targetOff) {
+    return targetNode && (scanFor(node, off, targetNode, targetOff, -1) || scanFor(node, off, targetNode, targetOff, 1));
+};
+const atomElements = /^(img|br|input|textarea|hr)$/i;
+function scanFor(node, off, targetNode, targetOff, dir) {
+    for(;;){
+        if (node == targetNode && off == targetOff) return true;
+        if (off == (dir < 0 ? 0 : nodeSize(node))) {
+            const parent = node.parentNode;
+            if (!parent || parent.nodeType != 1 || hasBlockDesc(node) || atomElements.test(node.nodeName) || node.contentEditable == "false") return false;
+            off = domIndex(node) + (dir < 0 ? 0 : 1);
+            node = parent;
+        } else if (node.nodeType == 1) {
+            const child = node.childNodes[off + (dir < 0 ? -1 : 0)];
+            if (child.nodeType == 1 && child.contentEditable == "false") {
+                if (child.pmViewDesc?.ignoreForSelection) off += dir;
+                else return false;
+            } else {
+                node = child;
+                off = dir < 0 ? nodeSize(node) : 0;
+            }
+        } else {
+            return false;
+        }
+    }
+}
+export function nodeSize(node) {
+    return node.nodeType == 3 ? node.nodeValue.length : node.childNodes.length;
+}
+export function isOnEdge(node, offset, parent) {
+    for(let atStart = offset == 0, atEnd = offset == nodeSize(node); atStart || atEnd;){
+        if (node == parent) return true;
+        const index = domIndex(node);
+        node = node.parentNode;
+        if (!node) return false;
+        atStart = atStart && index == 0;
+        atEnd = atEnd && index == nodeSize(node);
+    }
+    return false;
+}
+export function hasBlockDesc(dom) {
+    let desc;
+    for(let cur = dom; cur; cur = cur.parentNode)if (desc = cur.pmViewDesc) break;
+    return desc && desc.node && desc.node.isBlock && (desc.dom == dom || desc.contentDOM == dom);
+}
+// Work around Chrome issue https://bugs.chromium.org/p/chromium/issues/detail?id=447523
+// (isCollapsed inappropriately returns true in shadow dom)
+export const selectionCollapsed = function(domSel) {
+    return domSel.focusNode && isEquivalentPosition(domSel.focusNode, domSel.focusOffset, domSel.anchorNode, domSel.anchorOffset);
+};
+export function keyEvent(keyCode, key) {
+    const event = document.createEvent("Event");
+    event.initEvent("keydown", true, true);
+    event.keyCode = keyCode;
+    event.key = event.code = key;
+    return event;
+}
+export function deepActiveElement(doc) {
+    let elt = doc.activeElement;
+    while(elt && elt.shadowRoot)elt = elt.shadowRoot.activeElement;
+    return elt;
+}
+export function caretFromPoint(doc, x, y) {
+    if (doc.caretPositionFromPoint) {
+        try {
+            // Firefox throws for this call in hard-to-predict circumstances (#994)
+            const pos = doc.caretPositionFromPoint(x, y);
+            // Clip the offset, because Chrome will return a text offset
+            // into <input> nodes, which can't be treated as a regular DOM
+            // offset
+            if (pos) return {
+                node: pos.offsetNode,
+                offset: Math.min(nodeSize(pos.offsetNode), pos.offset)
+            };
+        } catch (_) {
+        // pass
+        }
+    }
+    if (doc.caretRangeFromPoint) {
+        const range = doc.caretRangeFromPoint(x, y);
+        if (range) return {
+            node: range.startContainer,
+            offset: Math.min(nodeSize(range.startContainer), range.startOffset)
+        };
+    }
+    return;
+}

package/dist/esm/findDOMNode.js

@@ -0,0 +1,31 @@
+//@ts-expect-error This module isn't typed
+import { findCurrentHostFiber } from "react-reconciler/reflection.js";
+// https://github.com/facebook/react/blob/main/packages/shared/ReactInstanceMap.js#L18
+export function getInstance(key) {
+    return key._reactInternals;
+}
+// https://github.com/facebook/react/blob/main/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js#L322
+function getPublicInstance(instance) {
+    return instance;
+}
+// https://github.com/facebook/react/blob/main/packages/react-reconciler/src/ReactFiberReconciler.js#L153
+function findHostInstance(component) {
+    const fiber = getInstance(component);
+    if (fiber === undefined) {
+        if (typeof component.render === "function") {
+            throw new Error("Unable to find node on an unmounted component.");
+        } else {
+            const keys = Object.keys(component).join(",");
+            throw new Error(`Argument appears to not be a ReactComponent. Keys: ${keys}`);
+        }
+    }
+    const hostFiber = findCurrentHostFiber(fiber);
+    if (hostFiber === null) {
+        return null;
+    }
+    return getPublicInstance(hostFiber.stateNode);
+}
+// https://github.com/facebook/react/blob/main/packages/react-dom/src/client/ReactDOMClient.js#L43
+export function findDOMNode(componentOrElement) {
+    return findHostInstance(componentOrElement);
+}

package/dist/esm/hooks/useClientLayoutEffect.js

@@ -0,0 +1,9 @@
+import { useLayoutEffect } from "react";
+export function useClientLayoutEffect() {
+    for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
+        args[_key] = arguments[_key];
+    }
+    if (typeof document === "undefined") return;
+    // eslint-disable-next-line react-hooks/rules-of-hooks, react-hooks/exhaustive-deps
+    useLayoutEffect(...args);
+}

package/dist/esm/hooks/useComponentEventListeners.js

@@ -0,0 +1,87 @@
+/* Copyright (c) The New York Times Company */ import { useCallback, useLayoutEffect, useMemo, useState } from "react";
+import { unstable_batchedUpdates as batch } from "react-dom";
+/**
+ * Produces a plugin that can be used with ProseMirror to handle DOM
+ * events at the EditorView.dom element.
+ *
+ * - `reactEventsPlugin` is a ProseMirror plugin for handling DOM events
+ * at the EditorView.dom element. It should be passed to `useEditorView`,
+ * along with any other plugins.
+ *
+ * - `registerEventListener` and `unregisterEventListener` should be
+ * passed to `EditorContext.Provider`.
+ *
+ * @privateRemarks
+ *
+ * This hook uses a combination of mutable and immutable updates to give
+ * us precise control over when we re-create the event listeners.
+ *
+ * The hook has a mutable reference to the set of handlers for each
+ * event type, but the set of event types is static. This means that we
+ * need to produce a new handleDOMEVents record whenever a new event type is
+ * registered. We avoid producing a new record in any other
+ * scenario to avoid the performance overhead of re-registering the event
+ * listeners in the EditorView.
+ *
+ * To accomplish this, we shallowly clone the registry whenever a new event
+ * type is registered.
+ */ export function useComponentEventListeners(handleDOMEventsProp) {
+    const [registry, setRegistry] = useState(new Map());
+    const registerEventListener = useCallback((eventType, handler)=>{
+        const handlers = registry.get(eventType) ?? [];
+        handlers.unshift(handler);
+        if (!registry.has(eventType)) {
+            registry.set(eventType, handlers);
+            setRegistry(new Map(registry));
+        }
+    }, [
+        registry
+    ]);
+    const unregisterEventListener = useCallback((eventType, handler)=>{
+        const handlers = registry.get(eventType);
+        handlers?.splice(handlers.indexOf(handler), 1);
+    }, [
+        registry
+    ]);
+    useLayoutEffect(()=>{
+        if (!handleDOMEventsProp) return;
+        for (const [eventType, handler] of Object.entries(handleDOMEventsProp)){
+            if (!handler) return;
+            registerEventListener(eventType, handler);
+        }
+        return ()=>{
+            for (const [eventType, handler] of Object.entries(handleDOMEventsProp)){
+                if (!handler) return;
+                unregisterEventListener(eventType, handler);
+            }
+        };
+    }, [
+        handleDOMEventsProp,
+        registerEventListener,
+        unregisterEventListener
+    ]);
+    const handleDOMEvents = useMemo(()=>{
+        const domEventHandlers = {};
+        for (const [eventType, handlers] of registry.entries()){
+            function handleEvent(view, event) {
+                for (const handler of handlers){
+                    let handled = false;
+                    batch(()=>{
+                        handled = !!handler(view, event);
+                    });
+                    if (handled || event.defaultPrevented) return true;
+                }
+                return false;
+            }
+            domEventHandlers[eventType] = handleEvent;
+        }
+        return domEventHandlers;
+    }, [
+        registry
+    ]);
+    return {
+        registerEventListener,
+        unregisterEventListener,
+        handleDOMEvents
+    };
+}

package/dist/esm/hooks/useEditor.js

@@ -0,0 +1,128 @@
+import { useCallback, useMemo, useRef, useState } from "react";
+import { flushSync } from "react-dom";
+import { ReactEditorView } from "../ReactEditorView.js";
+import { StaticEditorView } from "../StaticEditorView.js";
+import { EMPTY_STATE } from "../constants.js";
+import { createRenderStore } from "../contexts/RenderStoreContext.js";
+import { beforeInputPlugin } from "../plugins/beforeInputPlugin.js";
+import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
+import { useComponentEventListeners } from "./useComponentEventListeners.js";
+import { useEffectEvent } from "./useEffectEvent.js";
+import { useForceUpdate } from "./useForceUpdate.js";
+let didWarnValueDefaultValue = false;
+/**
+ * Creates, mounts, and manages a ProseMirror `EditorView`.
+ *
+ * All state and props updates are executed in a layout effect.
+ * To ensure that the EditorState and EditorView are never out of
+ * sync, it's important that the EditorView produced by this hook
+ * is only accessed through the `useEditorViewEvent` and
+ * `useEditorViewLayoutEffect` hooks.
+ */ export function useEditor(mount, options) {
+    if (process.env.NODE_ENV !== "production") {
+        if (options.defaultState !== undefined && options.state !== undefined && !didWarnValueDefaultValue) {
+            console.error("A component contains a ProseMirror editor with both state and defaultState props. " + "ProseMirror editors must be either controlled or uncontrolled " + "(specify either the state prop, or the defaultState prop, but not both). " + "Decide between using a controlled or uncontrolled ProseMirror editor " + "and remove one of these props. More info: " + "https://reactjs.org/link/controlled-components");
+            didWarnValueDefaultValue = true;
+        }
+    }
+    const flushSyncRef = useRef(true);
+    const forceUpdate = useForceUpdate();
+    const defaultState = options.defaultState ?? EMPTY_STATE;
+    const [_state, setState] = useState(defaultState);
+    const state = options.state ?? _state;
+    const [renderStore] = useState(createRenderStore);
+    const { handleDOMEvents, registerEventListener, unregisterEventListener } = useComponentEventListeners(options.handleDOMEvents);
+    const plugins = useMemo(()=>[
+            ...options.plugins ?? [],
+            beforeInputPlugin()
+        ], [
+        options.plugins
+    ]);
+    const dispatchTransaction = useCallback(function dispatchTransaction(tr) {
+        const async = tr.getMeta("async");
+        if (flushSyncRef.current && !async) {
+            flushSync(()=>{
+                if (!options.state) {
+                    setState((s)=>s.apply(tr));
+                }
+                if (options.dispatchTransaction) {
+                    options.dispatchTransaction.call(this, tr);
+                }
+                if (options.stableContexts) {
+                    renderStore.announce();
+                }
+            });
+            renderStore.announced = false;
+        } else {
+            if (!options.state) {
+                setState((s)=>s.apply(tr));
+            }
+            if (options.dispatchTransaction) {
+                options.dispatchTransaction.call(this, tr);
+            }
+        }
+    }, [
+        options.dispatchTransaction,
+        options.state,
+        options.stableContexts,
+        renderStore
+    ]);
+    const directEditorProps = {
+        ...options,
+        state,
+        plugins,
+        dispatchTransaction,
+        handleDOMEvents
+    };
+    const [view, setView] = useState(()=>{
+        return new StaticEditorView(directEditorProps);
+    });
+    const createEditorView = useEffectEvent((mount)=>{
+        if (mount && !options.static) {
+            const view = new ReactEditorView({
+                mount
+            }, directEditorProps);
+            view.dom.addEventListener("compositionend", forceUpdate);
+            return view;
+        }
+        return new StaticEditorView(directEditorProps);
+    });
+    useClientLayoutEffect(()=>{
+        const view = createEditorView(mount);
+        setView(view);
+        return ()=>{
+            view.destroy();
+        };
+    }, [
+        createEditorView,
+        mount
+    ]);
+    useClientLayoutEffect(()=>{
+        // Ensure that the EditorView hasn't been destroyed before
+        // running effects. Running effects will reattach selection
+        // change listeners if the EditorView has been destroyed.
+        if (view instanceof ReactEditorView && !view.isDestroyed && view.domSelection()) {
+            flushSyncRef.current = false;
+            view.commitPendingEffects();
+            flushSyncRef.current = true;
+        }
+    });
+    view.update(directEditorProps);
+    const editor = useMemo(()=>({
+            view,
+            flushSyncRef,
+            registerEventListener,
+            unregisterEventListener,
+            isStatic: options.static ?? false
+        }), [
+        options.static,
+        registerEventListener,
+        unregisterEventListener,
+        view
+    ]);
+    return {
+        editor,
+        state,
+        renderStore: options.stableContexts ? renderStore : null
+    };
+}

package/dist/esm/hooks/useEditorEffect.js

@@ -0,0 +1,46 @@
+/* Copyright (c) The New York Times Company */ import { useContext } from "react";
+import { ReactEditorView } from "../ReactEditorView.js";
+import { EditorContext } from "../contexts/EditorContext.js";
+import { useLayoutGroupEffect } from "./useLayoutGroupEffect.js";
+/**
+ * Registers a layout effect to run after the EditorView has
+ * been updated with the latest EditorState and Decorations.
+ *
+ * Effects can take an EditorView instance as an argument.
+ * This hook should be used to execute layout effects that
+ * depend on the EditorView, such as for positioning DOM
+ * nodes based on ProseMirror positions.
+ *
+ * Layout effects registered with this hook still fire
+ * synchronously after all DOM mutations, but they do so
+ * _after_ the EditorView has been updated, even when the
+ * EditorView lives in an ancestor component.
+ *
+ * This hook can only be used in a component that is mounted
+ * as a child of the TiptapEditorView component, including
+ * React node view components.
+ */ export function useEditorEffect(effect, dependencies) {
+    const { view, flushSyncRef } = useContext(EditorContext);
+    // The rules of hooks want `effect` to be included in the
+    // dependency list, but dependency issues for `effect` will
+    // be caught by the linter at the call-site for
+    // `useEditorViewLayoutEffect`.
+    // Note: we specifically don't want to re-run the effect
+    // every time it changes, because it will most likely
+    // be defined inline and run on every re-render.
+    useLayoutGroupEffect(()=>{
+        if (view instanceof ReactEditorView) {
+            flushSyncRef.current = false;
+            const result = effect(view);
+            flushSyncRef.current = true;
+            return result;
+        }
+    }, // The rules of hooks want to be able to statically
+    // verify the dependencies for the effect, but this will
+    // have already happened at the call-site.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    dependencies && [
+        view,
+        ...dependencies
+    ]);
+}

package/dist/esm/hooks/useEditorEventCallback.js

@@ -0,0 +1,38 @@
+/* Copyright (c) The New York Times Company */ import { useCallback, useContext, useRef } from "react";
+import { ReactEditorView } from "../ReactEditorView.js";
+import { EditorContext } from "../contexts/EditorContext.js";
+import { useEditorEffect } from "./useEditorEffect.js";
+function assertIsReactEditorView(view) {
+    if (view instanceof ReactEditorView) {
+        return;
+    }
+    throw new DOMException("ProseMirror document is not mounted", "InvalidStateError");
+}
+/**
+ * Returns a stable function reference to be used as an
+ * event handler callback.
+ *
+ * The callback will be called with the EditorView instance
+ * as its first argument.
+ *
+ * This hook can only be used in a component that is mounted
+ * as a child of the TiptapEditorView component, including
+ * React node view components.
+ */ export function useEditorEventCallback(callback) {
+    const ref = useRef(callback);
+    const { view } = useContext(EditorContext);
+    useEditorEffect(()=>{
+        ref.current = callback;
+    }, [
+        callback
+    ]);
+    return useCallback(function() {
+        for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
+            args[_key] = arguments[_key];
+        }
+        assertIsReactEditorView(view);
+        return ref.current.call(this, view, ...args);
+    }, [
+        view
+    ]);
+}

package/dist/esm/hooks/useEditorEventListener.js

@@ -0,0 +1,28 @@
+/* Copyright (c) The New York Times Company */ import { useCallback, useContext, useRef } from "react";
+import { EditorContext } from "../contexts/EditorContext.js";
+import { useEditorEffect } from "./useEditorEffect.js";
+/**
+ * Attaches an event listener at the `EditorView`'s DOM node. See
+ * [the ProseMirror docs](https://prosemirror.net/docs/ref/#view.EditorProps.handleDOMEvents)
+ * for more details.
+ */ export function useEditorEventListener(eventType, handler) {
+    const { registerEventListener, unregisterEventListener } = useContext(EditorContext);
+    const ref = useRef(handler);
+    useEditorEffect(()=>{
+        ref.current = handler;
+    }, [
+        handler
+    ]);
+    const eventHandler = useCallback(function(view, event) {
+        return ref.current.call(this, view, event);
+    }, []);
+    useEditorEffect(()=>{
+        registerEventListener(eventType, eventHandler);
+        return ()=>unregisterEventListener(eventType, eventHandler);
+    }, [
+        eventHandler,
+        eventType,
+        registerEventListener,
+        unregisterEventListener
+    ]);
+}

package/dist/esm/hooks/useEditorState.js

@@ -0,0 +1,10 @@
+/* Copyright (c) The New York Times Company */ import { useContext } from "react";
+import { EditorStateContext } from "../contexts/EditorStateContext.js";
+import { useRenderStore } from "../contexts/RenderStoreContext.js";
+/**
+ * Provides access to the current EditorState value.
+ */ export function useEditorState() {
+    const editorState = useContext(EditorStateContext);
+    const store = useRenderStore();
+    return store?.state ?? editorState;
+}

package/dist/esm/hooks/useEditorStateSelector.js

@@ -0,0 +1,14 @@
+import { useContext, useSyncExternalStore } from "react";
+import { EditorStateStoreContext } from "../contexts/EditorStateStoreContext.js";
+/**
+ * Select a piece of the EditorState, a la Redux’s
+ * `useSelector`.
+ *
+ * This hook will only trigger a re-render of the
+ * consuming component if the return value of the selector
+ * changes.
+ */ export function useEditorStateSelector(selector) {
+    const store = useContext(EditorStateStoreContext);
+    const getSnapshot = ()=>selector(store.getState());
+    return useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
+}