@stesura/react-prosemirror 3.2.11-stesura.1

package/dist/esm/hooks/useEffectEvent.js

@@ -0,0 +1,24 @@
+import { useCallback, useLayoutEffect, useRef } from "react";
+export function useEffectEvent(fn) {
+    const ref = useRef(fn);
+    // Ideally this would be a useInsertionEffect, but
+    // that was introduced in React 18 and we still
+    // support React 17. useLayoutEffect is safe
+    // here as long as the function returned by
+    // useEffectEvent isn't called in a layout effect
+    // that's defined _before_ the useEffectEvent
+    // call, and effect events are never passed
+    // to child components.
+    useLayoutEffect(()=>{
+        ref.current = fn;
+    }, [
+        fn
+    ]);
+    return useCallback(function() {
+        for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
+            args[_key] = arguments[_key];
+        }
+        const f = ref.current;
+        return f(...args);
+    }, []);
+}

package/dist/esm/hooks/useForceUpdate.js

@@ -0,0 +1,8 @@
+/* Copyright (c) The New York Times Company */ import { useReducer } from "react";
+/**
+ * Provides a function that forces an update of the
+ * component.
+ */ export function useForceUpdate() {
+    const [, forceUpdate] = useReducer((x)=>x + 1, 0);
+    return forceUpdate;
+}

package/dist/esm/hooks/useIgnoreMutation.js

@@ -0,0 +1,14 @@
+import { useContext } from "react";
+import { IgnoreMutationContext } from "../contexts/IgnoreMutationContext.js";
+import { useEditorEffect } from "./useEditorEffect.js";
+import { useEditorEventCallback } from "./useEditorEventCallback.js";
+export function useIgnoreMutation(ignoreMutation) {
+    const register = useContext(IgnoreMutationContext);
+    const ignoreMutationMemo = useEditorEventCallback(ignoreMutation);
+    useEditorEffect(()=>{
+        return register(ignoreMutationMemo);
+    }, [
+        register,
+        ignoreMutationMemo
+    ]);
+}

package/dist/esm/hooks/useIsComposingIn.js

@@ -0,0 +1,17 @@
+import { useContext, useState } from "react";
+import { GetPosContext } from "../components/nodes/NodeView.js";
+import { useEditorEventListener } from "../index.js";
+/**
+ * Returns true while an IME composition is active inside the current node.
+ */ export function useIsComposingIn() {
+    const [isComposing, setIsComposing] = useState(false);
+    const getPos = useContext(GetPosContext);
+    useEditorEventListener("compositionstart", (view)=>{
+        const compositionRoot = view.state.selection.$from.before();
+        setIsComposing(compositionRoot === getPos());
+    });
+    useEditorEventListener("compositionend", ()=>{
+        setIsComposing(false);
+    });
+    return isComposing;
+}

package/dist/esm/hooks/useIsEditorStatic.js

@@ -0,0 +1,8 @@
+import { useContext } from "react";
+import { EditorContext } from "../contexts/EditorContext.js";
+/**
+ * Returns true if the nearest ProseMirror component
+ * is rendered with the `static` prop set to `true`.
+ */ export function useIsEditorStatic() {
+    return useContext(EditorContext)?.isStatic ?? false;
+}

package/dist/esm/hooks/useIsNodeSelected.js

@@ -0,0 +1,11 @@
+import { useState } from "react";
+import { useSelectNode } from "./useSelectNode.js";
+export function useIsNodeSelected() {
+    const [isSelected, setIsSelected] = useState(false);
+    useSelectNode(()=>{
+        setIsSelected(true);
+    }, ()=>{
+        setIsSelected(false);
+    });
+    return isSelected;
+}

package/dist/esm/hooks/useLayoutGroupEffect.js

@@ -0,0 +1,10 @@
+/* Copyright (c) The New York Times Company */ import { useContext } from "react";
+import { LayoutGroupContext } from "../contexts/LayoutGroupContext.js";
+import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
+/** Registers a layout effect to run at the nearest `LayoutGroup` boundary. */ export function useLayoutGroupEffect(effect, deps) {
+    const register = useContext(LayoutGroupContext);
+    // The rule for hooks wants to statically verify the deps,
+    // but the dependencies are up to the caller, not this implementation.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useClientLayoutEffect(()=>register(effect), deps);
+}

package/dist/esm/hooks/useMarkViewDescription.js

@@ -0,0 +1,124 @@
+import { useCallback, useContext, useMemo, useRef } from "react";
+import { ReactEditorView } from "../ReactEditorView.js";
+import { ChildDescriptionsContext } from "../contexts/ChildDescriptionsContext.js";
+import { EditorContext } from "../contexts/EditorContext.js";
+import { ReactMarkViewDesc, placeViewDesc } from "../viewdesc.js";
+import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
+import { useEffectEvent } from "./useEffectEvent.js";
+export function useMarkViewDescription(getDOM, getContentDOM, constructor, props) {
+    const mountedRef = useRef(false);
+    const { view } = useContext(EditorContext);
+    const { parentRef, siblingsRef } = useContext(ChildDescriptionsContext);
+    const contentDOMRef = useRef(null);
+    const viewDescRef = useRef();
+    const childrenRef = useRef([]);
+    const create = useEffectEvent(()=>{
+        if (!(view instanceof ReactEditorView)) {
+            return;
+        }
+        const dom = getDOM();
+        if (!dom) {
+            return;
+        }
+        const { mark, inline, getPos } = props;
+        const markView = constructor(mark, view, inline);
+        if (!markView) {
+            return;
+        }
+        const parent = parentRef.current;
+        const children = childrenRef.current;
+        const contentDOM = getContentDOM(markView);
+        const viewDesc = new ReactMarkViewDesc(parent, children, getPos, mark, dom, contentDOM ?? markView.dom, markView);
+        // When create() runs after a destroy() (either here in a layout
+        // effect or in refUpdated), the inherited children still reference
+        // the just-destroyed desc. Re-parent them onto this fresh desc
+        // before any other code can observe the stale pointer.
+        for (const child of children){
+            child.parent = viewDesc;
+        }
+        contentDOMRef.current = contentDOM;
+        return viewDesc;
+    });
+    const update = useEffectEvent(()=>{
+        if (!(view instanceof ReactEditorView)) {
+            return false;
+        }
+        const viewDesc = viewDescRef.current;
+        if (!viewDesc) {
+            return false;
+        }
+        const dom = getDOM();
+        if (!dom || dom !== viewDesc.dom) {
+            return false;
+        }
+        const contentDOM = getContentDOM(viewDesc);
+        if (contentDOM !== (viewDesc.contentDOM ?? dom)) {
+            return false;
+        }
+        const { mark } = props;
+        return viewDesc.matchesMark(mark);
+    });
+    const destroy = useEffectEvent(()=>{
+        const viewDesc = viewDescRef.current;
+        if (!viewDesc) {
+            return;
+        }
+        viewDescRef.current = undefined;
+        viewDesc.destroy();
+        const siblings = siblingsRef.current;
+        if (siblings.includes(viewDesc)) {
+            const index = siblings.indexOf(viewDesc);
+            siblings.splice(index, 1);
+        }
+        contentDOMRef.current = null;
+    });
+    useClientLayoutEffect(()=>{
+        mountedRef.current = true;
+        viewDescRef.current = create();
+        return ()=>{
+            mountedRef.current = false;
+            destroy();
+        };
+    }, [
+        create,
+        destroy
+    ]);
+    const refUpdated = useCallback(()=>{
+        if (!mountedRef.current) return;
+        if (!update()) {
+            destroy();
+            viewDescRef.current = create();
+        }
+    }, [
+        create,
+        destroy,
+        update
+    ]);
+    useClientLayoutEffect(()=>{
+        if (!update()) {
+            destroy();
+            viewDescRef.current = create();
+        }
+        const viewDesc = viewDescRef.current;
+        if (!viewDesc) {
+            return;
+        }
+        const parent = parentRef.current;
+        const siblings = siblingsRef.current;
+        const children = childrenRef.current;
+        viewDesc.parent = parent;
+        placeViewDesc(siblings, viewDesc);
+        for (const child of children){
+            child.parent = viewDesc;
+        }
+    });
+    const childContextValue = useMemo(()=>({
+            parentRef: viewDescRef,
+            siblingsRef: childrenRef
+        }), []);
+    return {
+        childContextValue,
+        contentDOM: contentDOMRef.current ?? viewDescRef.current?.dom,
+        refUpdated
+    };
+}

package/dist/esm/hooks/useNodePos.js

@@ -0,0 +1,15 @@
+import { useContext } from "react";
+import { GetPosContext } from "../components/nodes/NodeView.js";
+import { useEditorState } from "./useEditorState.js";
+/**
+ * Get this node's current position in the document.
+ *
+ * Using this hook will subscribe this node to the
+ * EditorState, which means that it will be re-rendered
+ * on every EditorState update. This may have performance
+ * implications for large documents.
+ */ export function useNodePos() {
+    useEditorState();
+    const getPos = useContext(GetPosContext);
+    return getPos();
+}

package/dist/esm/hooks/useNodeViewDescription.js

@@ -0,0 +1,144 @@
+import { useCallback, useContext, useMemo, useRef } from "react";
+import { ReactEditorView } from "../ReactEditorView.js";
+import { ChildDescriptionsContext } from "../contexts/ChildDescriptionsContext.js";
+import { EditorContext } from "../contexts/EditorContext.js";
+import { ReactNodeViewDesc, placeViewDesc, sortViewDescs } from "../viewdesc.js";
+import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
+import { useEffectEvent } from "./useEffectEvent.js";
+export function useNodeViewDescription(getDOM, getContentDOM, constructor, props) {
+    const mountedRef = useRef(false);
+    const { view } = useContext(EditorContext);
+    const { parentRef, siblingsRef } = useContext(ChildDescriptionsContext);
+    const contentDOMRef = useRef(null);
+    const viewDescRef = useRef();
+    const childrenRef = useRef([]);
+    const create = useEffectEvent(()=>{
+        if (!(view instanceof ReactEditorView)) {
+            return;
+        }
+        const dom = getDOM();
+        if (!dom) {
+            return;
+        }
+        const { node, getPos, decorations, innerDecorations } = props;
+        const nodeView = constructor(node, view, getPos, decorations, innerDecorations);
+        if (!nodeView) {
+            return;
+        }
+        const parent = parentRef.current;
+        const children = childrenRef.current;
+        const contentDOM = getContentDOM(nodeView);
+        const nodeDOM = nodeView.dom;
+        const viewDesc = new ReactNodeViewDesc(parent, children, getPos, node, decorations, innerDecorations, dom, contentDOM, nodeDOM, nodeView);
+        for (const child of children){
+            child.parent = viewDesc;
+        }
+        placeViewDesc(siblingsRef.current, viewDesc);
+        contentDOMRef.current = getContentDOM(nodeView);
+        return viewDesc;
+    });
+    const update = useEffectEvent(()=>{
+        if (!(view instanceof ReactEditorView)) {
+            return false;
+        }
+        const viewDesc = viewDescRef.current;
+        if (!viewDesc) {
+            return false;
+        }
+        const dom = getDOM();
+        if (!dom || dom !== viewDesc.dom) {
+            return false;
+        }
+        const contentDOM = getContentDOM(viewDesc);
+        if (contentDOM !== viewDesc.contentDOM) {
+            return false;
+        }
+        if (!dom.contains(viewDesc.nodeDOM)) {
+            return false;
+        }
+        const { node, decorations, innerDecorations } = props;
+        return viewDesc.matchesNode(node, decorations, innerDecorations) || viewDesc.update(node, decorations, innerDecorations, view);
+    });
+    const destroy = useEffectEvent(()=>{
+        const viewDesc = viewDescRef.current;
+        if (!viewDesc) {
+            return;
+        }
+        viewDescRef.current = undefined;
+        viewDesc.destroy();
+        const siblings = siblingsRef.current;
+        if (siblings.includes(viewDesc)) {
+            const index = siblings.indexOf(viewDesc);
+            siblings.splice(index, 1);
+        }
+        contentDOMRef.current = null;
+    });
+    useClientLayoutEffect(()=>{
+        mountedRef.current = true;
+        viewDescRef.current = create();
+        return ()=>{
+            mountedRef.current = false;
+            destroy();
+        };
+    }, [
+        create,
+        destroy
+    ]);
+    const refUpdated = useCallback(()=>{
+        if (!mountedRef.current) return;
+        if (!update()) {
+            destroy();
+            viewDescRef.current = create();
+        }
+    }, [
+        create,
+        destroy,
+        update
+    ]);
+    useClientLayoutEffect(()=>{
+        if (!update()) {
+            destroy();
+            viewDescRef.current = create();
+        }
+        const viewDesc = viewDescRef.current;
+        if (!viewDesc) {
+            return;
+        }
+        if (view.dom === viewDesc.dom && view instanceof ReactEditorView) {
+            view.docView = viewDesc;
+        }
+        const parent = parentRef.current;
+        const siblings = siblingsRef.current;
+        const children = childrenRef.current;
+        viewDesc.parent = parent;
+        // In strict/concurrent mode, a node can sometimes re-render
+        // entirely on its own, without even its parent re-rendering.
+        // In this case, we will have added our view descriptions to
+        // our parent's children, but our parent has no opportunity
+        // to sort its children, because it never renders. So
+        // we always place ourselves among our siblings, too.
+        placeViewDesc(siblings, viewDesc);
+        // If a child updates, usually it will re-render and sort
+        // our children for us. But it's possible to reorder
+        // child nodes without changing their keys or node
+        // instances, in which case our children _won't_
+        // rerender. As a fallback, we do one last pass through
+        // our own child view descriptions and make sure
+        // they're ordered. This should be a cheap no-op in most cases.
+        children.sort(sortViewDescs);
+        for (const child of children){
+            child.parent = viewDesc;
+        }
+    });
+    const childContextValue = useMemo(()=>({
+            parentRef: viewDescRef,
+            siblingsRef: childrenRef
+        }), []);
+    const isMounted = useCallback(()=>mountedRef.current, []);
+    return {
+        childContextValue,
+        contentDOM: contentDOMRef.current,
+        refUpdated,
+        isMounted
+    };
+}

package/dist/esm/hooks/useReactKeys.js

@@ -0,0 +1,7 @@
+import { useContext } from "react";
+import { EditorContext } from "../contexts/EditorContext.js";
+import { reactKeysPluginKey } from "../plugins/reactKeys.js";
+export function useReactKeys() {
+    const { view } = useContext(EditorContext);
+    return reactKeysPluginKey.getState(view.state);
+}

package/dist/esm/hooks/useSelectNode.js

@@ -0,0 +1,20 @@
+import { useContext } from "react";
+import { SelectNodeContext } from "../contexts/SelectNodeContext.js";
+import { useEditorEffect } from "./useEditorEffect.js";
+import { useEditorEventCallback } from "./useEditorEventCallback.js";
+function noop() {
+// empty
+}
+export function useSelectNode(selectNode) {
+    let deselectNode = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : noop;
+    const register = useContext(SelectNodeContext);
+    const selectNodeMemo = useEditorEventCallback(selectNode);
+    const deselectNodeMemo = useEditorEventCallback(deselectNode);
+    return useEditorEffect(()=>{
+        return register(selectNodeMemo, deselectNodeMemo);
+    }, [
+        register,
+        selectNodeMemo,
+        deselectNodeMemo
+    ]);
+}

package/dist/esm/hooks/useSetDom.js

@@ -0,0 +1,47 @@
+import { useCallback, useRef } from "react";
+export function useSetDom(domRef, refUpdated, isMounted, forceUpdate) {
+    const pendingRef = useRef(false);
+    return useCallback((el)=>{
+        if (el !== null) {
+            pendingRef.current = false;
+            const changed = domRef.current !== el;
+            domRef.current = el;
+            if (changed) forceUpdate?.();
+            refUpdated();
+            return;
+        }
+        if (pendingRef.current) return;
+        pendingRef.current = true;
+        // React calls old ref callbacks with
+        // null before synchronously calling
+        // new ref callbacks with the existing
+        // element ref. We don't have any
+        // way to distinguish a call with null
+        // because the downstream callback is
+        // unstable and being replaced during render
+        // from a call with null because the referenced
+        // element has been unmounted.
+        //
+        // Since the ref callback calls are synchronous,
+        // we can queue a microtask and check
+        // whether the ref is still null at
+        // the end of this event loop task. If it
+        // is, we actually unmounted. If it's not,
+        // we already handled it in the synchronous
+        // branch above, so we just bail.
+        queueMicrotask(()=>{
+            if (!pendingRef.current) return;
+            pendingRef.current = false;
+            if (domRef.current !== null) {
+                domRef.current = null;
+                if (isMounted?.()) forceUpdate?.();
+            }
+            refUpdated();
+        });
+    }, [
+        domRef,
+        forceUpdate,
+        isMounted,
+        refUpdated
+    ]);
+}

package/dist/esm/hooks/useStopEvent.js

@@ -0,0 +1,14 @@
+import { useContext } from "react";
+import { StopEventContext } from "../contexts/StopEventContext.js";
+import { useEditorEffect } from "./useEditorEffect.js";
+import { useEditorEventCallback } from "./useEditorEventCallback.js";
+export function useStopEvent(stopEvent) {
+    const register = useContext(StopEventContext);
+    const stopEventMemo = useEditorEventCallback(stopEvent);
+    useEditorEffect(()=>{
+        return register(stopEventMemo);
+    }, [
+        register,
+        stopEventMemo
+    ]);
+}

package/dist/esm/index.js

@@ -0,0 +1,19 @@
+/* Copyright (c) The New York Times Company */ "use client";
+export { ProseMirror } from "./components/ProseMirror.js";
+export { ProseMirrorDoc } from "./components/ProseMirrorDoc.js";
+export { reorderSiblings } from "./commands/reorderSiblings.js";
+export { useIsComposingIn } from "./hooks/useIsComposingIn.js";
+export { useEditorEffect } from "./hooks/useEditorEffect.js";
+export { useEditorEventCallback } from "./hooks/useEditorEventCallback.js";
+export { useEditorEventListener } from "./hooks/useEditorEventListener.js";
+export { useEditorState } from "./hooks/useEditorState.js";
+export { useNodePos } from "./hooks/useNodePos.js";
+export { useEditorStateSelector } from "./hooks/useEditorStateSelector.js";
+export { useStopEvent } from "./hooks/useStopEvent.js";
+export { useSelectNode } from "./hooks/useSelectNode.js";
+export { useIgnoreMutation } from "./hooks/useIgnoreMutation.js";
+export { useIsEditorStatic } from "./hooks/useIsEditorStatic.js";
+export { useIsNodeSelected } from "./hooks/useIsNodeSelected.js";
+export { reactKeys } from "./plugins/reactKeys.js";
+export { widget } from "./decorations/ReactWidgetType.js";
+export { useMergedDOMRefs } from "./refs.js";