sykpcomposer 0.0.282 → 0.0.284

package/dist/{InlineImageComponent-5acc89ab.js.map → InlineImageComponent-cae01293.js.map}

@@ -1 +1 @@
-{"version":3,"file":"InlineImageComponent-5acc89ab.js","sources":["../src/components/ui/Select.tsx","../src/components/nodes/InlineImageComponent.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport './Select.css';\n\nimport * as React from 'react';\n\ntype SelectIntrinsicProps = JSX.IntrinsicElements['select'];\ninterface SelectProps extends SelectIntrinsicProps {\n  label: string;\n}\n\nexport default function Select({\n  children,\n  label,\n  className,\n  ...other\n}: SelectProps): JSX.Element {\n  return (\n    <div className=\"Input__wrapper\">\n      <label style={{marginTop: '-1em'}} className=\"Input__label\">\n        {label}\n      </label>\n      <select {...other} className={className || 'select'}>\n        {children}\n      </select>\n    </div>\n  );\n}\n","import type { Position } from \"./InlineImageNode\";\nimport type { BaseSelection, LexicalEditor, NodeKey } from \"lexical\";\n\nimport \"./InlineImageNode.css\";\n\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport LexicalErrorBoundary from \"@lexical/react/LexicalErrorBoundary\";\nimport { LexicalNestedComposer } from \"@lexical/react/LexicalNestedComposer\";\nimport { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\nimport { useLexicalNodeSelection } from \"@lexical/react/useLexicalNodeSelection\";\nimport { mergeRegister } from \"@lexical/utils\";\nimport {\n  $getNodeByKey,\n  $getSelection,\n  $isNodeSelection,\n  $setSelection,\n  CLICK_COMMAND,\n  COMMAND_PRIORITY_LOW,\n  DRAGSTART_COMMAND,\n  KEY_BACKSPACE_COMMAND,\n  KEY_DELETE_COMMAND,\n  KEY_ENTER_COMMAND,\n  KEY_ESCAPE_COMMAND,\n  SELECTION_CHANGE_COMMAND,\n} from \"lexical\";\nimport * as React from \"react\";\nimport { Suspense, useCallback, useEffect, useRef, useState } from \"react\";\n\nimport useModal from \"../hooks/useModal\";\nimport Button from \"../ui/Button\";\nimport ContentEditable from \"../ui/ContentEditable\";\nimport { DialogActions } from \"../ui/Dialog\";\nimport Placeholder from \"../ui/Placeholder\";\nimport Select from \"../ui/Select\";\nimport TextInput from \"../ui/TextInput\";\nimport { $isInlineImageNode, InlineImageNode } from \"./InlineImageNode\";\n\nconst imageCache = new Set();\n\nfunction useSuspenseImage(src: string) {\n  if (!imageCache.has(src)) {\n    throw new Promise((resolve) => {\n      const img = new Image();\n      img.src = src;\n      img.onload = () => {\n        imageCache.add(src);\n        resolve(null);\n      };\n    });\n  }\n}\n\nfunction LazyImage({\n  altText,\n  className,\n  imageRef,\n  src,\n  width,\n  height,\n  position,\n}: {\n  altText: string;\n  className: string | null;\n  height: \"inherit\" | number;\n  imageRef: { current: null | HTMLImageElement };\n  src: string;\n  width: \"inherit\" | number;\n  position: Position;\n}): JSX.Element {\n  useSuspenseImage(src);\n  return (\n    <img\n      className={className || undefined}\n      src={src}\n      alt={altText}\n      ref={imageRef}\n      data-position={position}\n      style={{\n        display: \"block\",\n        height,\n        width,\n      }}\n      draggable=\"false\"\n    />\n  );\n}\n\nexport function UpdateInlineImageDialog({\n  activeEditor,\n  nodeKey,\n  onClose,\n}: {\n  activeEditor: LexicalEditor;\n  nodeKey: NodeKey;\n  onClose: () => void;\n}): JSX.Element {\n  const editorState = activeEditor.getEditorState();\n  const node = editorState.read(\n    () => $getNodeByKey(nodeKey) as InlineImageNode\n  );\n  const [altText, setAltText] = useState(node.getAltText());\n  const [showCaption, setShowCaption] = useState(node.getShowCaption());\n  const [position, setPosition] = useState<Position>(node.getPosition());\n\n  const handleShowCaptionChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    setShowCaption(e.target.checked);\n  };\n\n  const handlePositionChange = (e: React.ChangeEvent<HTMLSelectElement>) => {\n    setPosition(e.target.value as Position);\n  };\n\n  const handleOnConfirm = () => {\n    const payload = { altText, position, showCaption };\n    if (node) {\n      activeEditor.update(() => {\n        node.update(payload);\n      });\n    }\n    onClose();\n  };\n\n  return (\n    <>\n      <div style={{ marginBottom: \"1em\" }}>\n        <TextInput\n          label=\"Alt Text\"\n          placeholder=\"Descriptive alternative text\"\n          onChange={setAltText}\n          value={altText}\n          data-test-id=\"image-modal-alt-text-input\"\n        />\n      </div>\n\n      <Select\n        style={{ marginBottom: \"1em\", width: \"208px\" }}\n        value={position}\n        label=\"Position\"\n        name=\"position\"\n        id=\"position-select\"\n        onChange={handlePositionChange}\n      >\n        <option value=\"left\">Left</option>\n        <option value=\"right\">Right</option>\n        <option value=\"full\">Full Width</option>\n      </Select>\n\n      <div className=\"Input__wrapper\">\n        <input\n          id=\"caption\"\n          type=\"checkbox\"\n          checked={showCaption}\n          onChange={handleShowCaptionChange}\n        />\n        <label htmlFor=\"caption\">Show Caption</label>\n      </div>\n\n      <DialogActions>\n        <Button\n          data-test-id=\"image-modal-file-upload-btn\"\n          onClick={() => handleOnConfirm()}\n        >\n          Confirm\n        </Button>\n      </DialogActions>\n    </>\n  );\n}\n\nexport default function InlineImageComponent({\n  src,\n  altText,\n  nodeKey,\n  width,\n  height,\n  showCaption,\n  caption,\n  position,\n}: {\n  altText: string;\n  caption: LexicalEditor;\n  height: \"inherit\" | number;\n  nodeKey: NodeKey;\n  showCaption: boolean;\n  src: string;\n  width: \"inherit\" | number;\n  position: Position;\n}): JSX.Element {\n  const [modal, showModal] = useModal();\n  const imageRef = useRef<null | HTMLImageElement>(null);\n  const buttonRef = useRef<HTMLButtonElement | null>(null);\n  const [isSelected, setSelected, clearSelection] =\n    useLexicalNodeSelection(nodeKey);\n  const [editor] = useLexicalComposerContext();\n  const [selection, setSelection] = useState<BaseSelection | null>(null);\n  const activeEditorRef = useRef<LexicalEditor | null>(null);\n\n  const onDelete = useCallback(\n    (payload: KeyboardEvent) => {\n      if (isSelected && $isNodeSelection($getSelection())) {\n        const event: KeyboardEvent = payload;\n        event.preventDefault();\n        const node = $getNodeByKey(nodeKey);\n        if ($isInlineImageNode(node)) {\n          node.remove();\n          return true;\n        }\n      }\n      return false;\n    },\n    [isSelected, nodeKey]\n  );\n\n  const onEnter = useCallback(\n    (event: KeyboardEvent) => {\n      const latestSelection = $getSelection();\n      const buttonElem = buttonRef.current;\n      if (\n        isSelected &&\n        $isNodeSelection(latestSelection) &&\n        latestSelection.getNodes().length === 1\n      ) {\n        if (showCaption) {\n          // Move focus into nested editor\n          $setSelection(null);\n          event.preventDefault();\n          caption.focus();\n          return true;\n        } else if (\n          buttonElem !== null &&\n          buttonElem !== document.activeElement\n        ) {\n          event.preventDefault();\n          buttonElem.focus();\n          return true;\n        }\n      }\n      return false;\n    },\n    [caption, isSelected, showCaption]\n  );\n\n  const onEscape = useCallback(\n    (event: KeyboardEvent) => {\n      if (\n        activeEditorRef.current === caption ||\n        buttonRef.current === event.target\n      ) {\n        $setSelection(null);\n        editor.update(() => {\n          setSelected(true);\n          const parentRootElement = editor.getRootElement();\n          if (parentRootElement !== null) {\n            parentRootElement.focus();\n          }\n        });\n        return true;\n      }\n      return false;\n    },\n    [caption, editor, setSelected]\n  );\n\n  useEffect(() => {\n    let isMounted = true;\n    const unregister = mergeRegister(\n      editor.registerUpdateListener(({ editorState }) => {\n        if (isMounted) {\n          setSelection(editorState.read(() => $getSelection()));\n        }\n      }),\n      editor.registerCommand(\n        SELECTION_CHANGE_COMMAND,\n        (_, activeEditor) => {\n          activeEditorRef.current = activeEditor;\n          return false;\n        },\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand<MouseEvent>(\n        CLICK_COMMAND,\n        (payload) => {\n          const event = payload;\n          if (event.target === imageRef.current) {\n            if (event.shiftKey) {\n              setSelected(!isSelected);\n            } else {\n              clearSelection();\n              setSelected(true);\n            }\n            return true;\n          }\n\n          return false;\n        },\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand(\n        DRAGSTART_COMMAND,\n        (event) => {\n          if (event.target === imageRef.current) {\n            // TODO This is just a temporary workaround for FF to behave like other browsers.\n            // Ideally, this handles drag & drop too (and all browsers).\n            event.preventDefault();\n            return true;\n          }\n          return false;\n        },\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand(\n        KEY_DELETE_COMMAND,\n        onDelete,\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand(\n        KEY_BACKSPACE_COMMAND,\n        onDelete,\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand(KEY_ENTER_COMMAND, onEnter, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_ESCAPE_COMMAND, onEscape, COMMAND_PRIORITY_LOW)\n    );\n    return () => {\n      isMounted = false;\n      unregister();\n    };\n  }, [\n    clearSelection,\n    editor,\n    isSelected,\n    nodeKey,\n    onDelete,\n    onEnter,\n    onEscape,\n    setSelected,\n  ]);\n\n  const draggable = isSelected && $isNodeSelection(selection);\n  const isFocused = isSelected;\n  return (\n    <Suspense fallback={null}>\n      <>\n        <div draggable={draggable}>\n          <button\n            className=\"image-edit-button\"\n            ref={buttonRef}\n            onClick={() => {\n              showModal(\"Update Inline Image\", (onClose) => (\n                <UpdateInlineImageDialog\n                  activeEditor={editor}\n                  nodeKey={nodeKey}\n                  onClose={onClose}\n                />\n              ));\n            }}\n          >\n            Edit\n          </button>\n          <LazyImage\n            className={\n              isFocused\n                ? `focused ${$isNodeSelection(selection) ? \"draggable\" : \"\"}`\n                : null\n            }\n            src={src}\n            altText={altText}\n            imageRef={imageRef}\n            width={width}\n            height={height}\n            position={position}\n          />\n        </div>\n        {showCaption && (\n          <div className=\"image-caption-container\">\n            <LexicalNestedComposer initialEditor={caption}>\n              <RichTextPlugin\n                contentEditable={\n                  <ContentEditable className=\"InlineImageNode__contentEditable\" />\n                }\n                placeholder={\n                  <Placeholder className=\"InlineImageNode__placeholder\">\n                    Enter a caption...\n                  </Placeholder>\n                }\n                ErrorBoundary={LexicalErrorBoundary}\n              />\n            </LexicalNestedComposer>\n          </div>\n        )}\n      </>\n      {modal}\n    </Suspense>\n  );\n}\n"],"names":["Select","children","label","className","other","jsxs","jsx","imageCache","useSuspenseImage","src","resolve","img","LazyImage","altText","imageRef","width","height","position","UpdateInlineImageDialog","activeEditor","nodeKey","onClose","node","$getNodeByKey","setAltText","useState","showCaption","setShowCaption","setPosition","handleShowCaptionChange","e","handlePositionChange","handleOnConfirm","payload","Fragment","TextInput","DialogActions","Button","InlineImageComponent","caption","modal","showModal","useModal","useRef","buttonRef","isSelected","setSelected","clearSelection","useLexicalNodeSelection","editor","useLexicalComposerContext","selection","setSelection","activeEditorRef","onDelete","useCallback","$isNodeSelection","$getSelection","$isInlineImageNode","onEnter","event","latestSelection","buttonElem","$setSelection","onEscape","parentRootElement","useEffect","isMounted","unregister","mergeRegister","editorState","SELECTION_CHANGE_COMMAND","_","COMMAND_PRIORITY_LOW","CLICK_COMMAND","DRAGSTART_COMMAND","KEY_DELETE_COMMAND","KEY_BACKSPACE_COMMAND","KEY_ENTER_COMMAND","KEY_ESCAPE_COMMAND","draggable","isFocused","Suspense","LexicalNestedComposer","RichTextPlugin","ContentEditable","Placeholder","LexicalErrorBoundary"],"mappings":"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"}
+{"version":3,"file":"InlineImageComponent-cae01293.js","sources":["../src/components/ui/Select.tsx","../src/components/nodes/InlineImageComponent.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport './Select.css';\n\nimport * as React from 'react';\n\ntype SelectIntrinsicProps = JSX.IntrinsicElements['select'];\ninterface SelectProps extends SelectIntrinsicProps {\n  label: string;\n}\n\nexport default function Select({\n  children,\n  label,\n  className,\n  ...other\n}: SelectProps): JSX.Element {\n  return (\n    <div className=\"Input__wrapper\">\n      <label style={{marginTop: '-1em'}} className=\"Input__label\">\n        {label}\n      </label>\n      <select {...other} className={className || 'select'}>\n        {children}\n      </select>\n    </div>\n  );\n}\n","import type { Position } from \"./InlineImageNode\";\nimport type { BaseSelection, LexicalEditor, NodeKey } from \"lexical\";\n\nimport \"./InlineImageNode.css\";\n\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport LexicalErrorBoundary from \"@lexical/react/LexicalErrorBoundary\";\nimport { LexicalNestedComposer } from \"@lexical/react/LexicalNestedComposer\";\nimport { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\nimport { useLexicalNodeSelection } from \"@lexical/react/useLexicalNodeSelection\";\nimport { mergeRegister } from \"@lexical/utils\";\nimport {\n  $getNodeByKey,\n  $getSelection,\n  $isNodeSelection,\n  $setSelection,\n  CLICK_COMMAND,\n  COMMAND_PRIORITY_LOW,\n  DRAGSTART_COMMAND,\n  KEY_BACKSPACE_COMMAND,\n  KEY_DELETE_COMMAND,\n  KEY_ENTER_COMMAND,\n  KEY_ESCAPE_COMMAND,\n  SELECTION_CHANGE_COMMAND,\n} from \"lexical\";\nimport * as React from \"react\";\nimport { Suspense, useCallback, useEffect, useRef, useState } from \"react\";\n\nimport useModal from \"../hooks/useModal\";\nimport Button from \"../ui/Button\";\nimport ContentEditable from \"../ui/ContentEditable\";\nimport { DialogActions } from \"../ui/Dialog\";\nimport Placeholder from \"../ui/Placeholder\";\nimport Select from \"../ui/Select\";\nimport TextInput from \"../ui/TextInput\";\nimport { $isInlineImageNode, InlineImageNode } from \"./InlineImageNode\";\n\nconst imageCache = new Set();\n\nfunction useSuspenseImage(src: string) {\n  if (!imageCache.has(src)) {\n    throw new Promise((resolve) => {\n      const img = new Image();\n      img.src = src;\n      img.onload = () => {\n        imageCache.add(src);\n        resolve(null);\n      };\n    });\n  }\n}\n\nfunction LazyImage({\n  altText,\n  className,\n  imageRef,\n  src,\n  width,\n  height,\n  position,\n}: {\n  altText: string;\n  className: string | null;\n  height: \"inherit\" | number;\n  imageRef: { current: null | HTMLImageElement };\n  src: string;\n  width: \"inherit\" | number;\n  position: Position;\n}): JSX.Element {\n  useSuspenseImage(src);\n  return (\n    <img\n      className={className || undefined}\n      src={src}\n      alt={altText}\n      ref={imageRef}\n      data-position={position}\n      style={{\n        display: \"block\",\n        height,\n        width,\n      }}\n      draggable=\"false\"\n    />\n  );\n}\n\nexport function UpdateInlineImageDialog({\n  activeEditor,\n  nodeKey,\n  onClose,\n}: {\n  activeEditor: LexicalEditor;\n  nodeKey: NodeKey;\n  onClose: () => void;\n}): JSX.Element {\n  const editorState = activeEditor.getEditorState();\n  const node = editorState.read(\n    () => $getNodeByKey(nodeKey) as InlineImageNode\n  );\n  const [altText, setAltText] = useState(node.getAltText());\n  const [showCaption, setShowCaption] = useState(node.getShowCaption());\n  const [position, setPosition] = useState<Position>(node.getPosition());\n\n  const handleShowCaptionChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    setShowCaption(e.target.checked);\n  };\n\n  const handlePositionChange = (e: React.ChangeEvent<HTMLSelectElement>) => {\n    setPosition(e.target.value as Position);\n  };\n\n  const handleOnConfirm = () => {\n    const payload = { altText, position, showCaption };\n    if (node) {\n      activeEditor.update(() => {\n        node.update(payload);\n      });\n    }\n    onClose();\n  };\n\n  return (\n    <>\n      <div style={{ marginBottom: \"1em\" }}>\n        <TextInput\n          label=\"Alt Text\"\n          placeholder=\"Descriptive alternative text\"\n          onChange={setAltText}\n          value={altText}\n          data-test-id=\"image-modal-alt-text-input\"\n        />\n      </div>\n\n      <Select\n        style={{ marginBottom: \"1em\", width: \"208px\" }}\n        value={position}\n        label=\"Position\"\n        name=\"position\"\n        id=\"position-select\"\n        onChange={handlePositionChange}\n      >\n        <option value=\"left\">Left</option>\n        <option value=\"right\">Right</option>\n        <option value=\"full\">Full Width</option>\n      </Select>\n\n      <div className=\"Input__wrapper\">\n        <input\n          id=\"caption\"\n          type=\"checkbox\"\n          checked={showCaption}\n          onChange={handleShowCaptionChange}\n        />\n        <label htmlFor=\"caption\">Show Caption</label>\n      </div>\n\n      <DialogActions>\n        <Button\n          data-test-id=\"image-modal-file-upload-btn\"\n          onClick={() => handleOnConfirm()}\n        >\n          Confirm\n        </Button>\n      </DialogActions>\n    </>\n  );\n}\n\nexport default function InlineImageComponent({\n  src,\n  altText,\n  nodeKey,\n  width,\n  height,\n  showCaption,\n  caption,\n  position,\n}: {\n  altText: string;\n  caption: LexicalEditor;\n  height: \"inherit\" | number;\n  nodeKey: NodeKey;\n  showCaption: boolean;\n  src: string;\n  width: \"inherit\" | number;\n  position: Position;\n}): JSX.Element {\n  const [modal, showModal] = useModal();\n  const imageRef = useRef<null | HTMLImageElement>(null);\n  const buttonRef = useRef<HTMLButtonElement | null>(null);\n  const [isSelected, setSelected, clearSelection] =\n    useLexicalNodeSelection(nodeKey);\n  const [editor] = useLexicalComposerContext();\n  const [selection, setSelection] = useState<BaseSelection | null>(null);\n  const activeEditorRef = useRef<LexicalEditor | null>(null);\n\n  const onDelete = useCallback(\n    (payload: KeyboardEvent) => {\n      if (isSelected && $isNodeSelection($getSelection())) {\n        const event: KeyboardEvent = payload;\n        event.preventDefault();\n        const node = $getNodeByKey(nodeKey);\n        if ($isInlineImageNode(node)) {\n          node.remove();\n          return true;\n        }\n      }\n      return false;\n    },\n    [isSelected, nodeKey]\n  );\n\n  const onEnter = useCallback(\n    (event: KeyboardEvent) => {\n      const latestSelection = $getSelection();\n      const buttonElem = buttonRef.current;\n      if (\n        isSelected &&\n        $isNodeSelection(latestSelection) &&\n        latestSelection.getNodes().length === 1\n      ) {\n        if (showCaption) {\n          // Move focus into nested editor\n          $setSelection(null);\n          event.preventDefault();\n          caption.focus();\n          return true;\n        } else if (\n          buttonElem !== null &&\n          buttonElem !== document.activeElement\n        ) {\n          event.preventDefault();\n          buttonElem.focus();\n          return true;\n        }\n      }\n      return false;\n    },\n    [caption, isSelected, showCaption]\n  );\n\n  const onEscape = useCallback(\n    (event: KeyboardEvent) => {\n      if (\n        activeEditorRef.current === caption ||\n        buttonRef.current === event.target\n      ) {\n        $setSelection(null);\n        editor.update(() => {\n          setSelected(true);\n          const parentRootElement = editor.getRootElement();\n          if (parentRootElement !== null) {\n            parentRootElement.focus();\n          }\n        });\n        return true;\n      }\n      return false;\n    },\n    [caption, editor, setSelected]\n  );\n\n  useEffect(() => {\n    let isMounted = true;\n    const unregister = mergeRegister(\n      editor.registerUpdateListener(({ editorState }) => {\n        if (isMounted) {\n          setSelection(editorState.read(() => $getSelection()));\n        }\n      }),\n      editor.registerCommand(\n        SELECTION_CHANGE_COMMAND,\n        (_, activeEditor) => {\n          activeEditorRef.current = activeEditor;\n          return false;\n        },\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand<MouseEvent>(\n        CLICK_COMMAND,\n        (payload) => {\n          const event = payload;\n          if (event.target === imageRef.current) {\n            if (event.shiftKey) {\n              setSelected(!isSelected);\n            } else {\n              clearSelection();\n              setSelected(true);\n            }\n            return true;\n          }\n\n          return false;\n        },\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand(\n        DRAGSTART_COMMAND,\n        (event) => {\n          if (event.target === imageRef.current) {\n            // TODO This is just a temporary workaround for FF to behave like other browsers.\n            // Ideally, this handles drag & drop too (and all browsers).\n            event.preventDefault();\n            return true;\n          }\n          return false;\n        },\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand(\n        KEY_DELETE_COMMAND,\n        onDelete,\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand(\n        KEY_BACKSPACE_COMMAND,\n        onDelete,\n        COMMAND_PRIORITY_LOW\n      ),\n      editor.registerCommand(KEY_ENTER_COMMAND, onEnter, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_ESCAPE_COMMAND, onEscape, COMMAND_PRIORITY_LOW)\n    );\n    return () => {\n      isMounted = false;\n      unregister();\n    };\n  }, [\n    clearSelection,\n    editor,\n    isSelected,\n    nodeKey,\n    onDelete,\n    onEnter,\n    onEscape,\n    setSelected,\n  ]);\n\n  const draggable = isSelected && $isNodeSelection(selection);\n  const isFocused = isSelected;\n  return (\n    <Suspense fallback={null}>\n      <>\n        <div draggable={draggable}>\n          <button\n            className=\"image-edit-button\"\n            ref={buttonRef}\n            onClick={() => {\n              showModal(\"Update Inline Image\", (onClose) => (\n                <UpdateInlineImageDialog\n                  activeEditor={editor}\n                  nodeKey={nodeKey}\n                  onClose={onClose}\n                />\n              ));\n            }}\n          >\n            Edit\n          </button>\n          <LazyImage\n            className={\n              isFocused\n                ? `focused ${$isNodeSelection(selection) ? \"draggable\" : \"\"}`\n                : null\n            }\n            src={src}\n            altText={altText}\n            imageRef={imageRef}\n            width={width}\n            height={height}\n            position={position}\n          />\n        </div>\n        {showCaption && (\n          <div className=\"image-caption-container\">\n            <LexicalNestedComposer initialEditor={caption}>\n              <RichTextPlugin\n                contentEditable={\n                  <ContentEditable className=\"InlineImageNode__contentEditable\" />\n                }\n                placeholder={\n                  <Placeholder className=\"InlineImageNode__placeholder\">\n                    Enter a caption...\n                  </Placeholder>\n                }\n                ErrorBoundary={LexicalErrorBoundary}\n              />\n            </LexicalNestedComposer>\n          </div>\n        )}\n      </>\n      {modal}\n    </Suspense>\n  );\n}\n"],"names":["Select","children","label","className","other","jsxs","jsx","imageCache","useSuspenseImage","src","resolve","img","LazyImage","altText","imageRef","width","height","position","UpdateInlineImageDialog","activeEditor","nodeKey","onClose","node","$getNodeByKey","setAltText","useState","showCaption","setShowCaption","setPosition","handleShowCaptionChange","e","handlePositionChange","handleOnConfirm","payload","Fragment","TextInput","DialogActions","Button","InlineImageComponent","caption","modal","showModal","useModal","useRef","buttonRef","isSelected","setSelected","clearSelection","useLexicalNodeSelection","editor","useLexicalComposerContext","selection","setSelection","activeEditorRef","onDelete","useCallback","$isNodeSelection","$getSelection","$isInlineImageNode","onEnter","event","latestSelection","buttonElem","$setSelection","onEscape","parentRootElement","useEffect","isMounted","unregister","mergeRegister","editorState","SELECTION_CHANGE_COMMAND","_","COMMAND_PRIORITY_LOW","CLICK_COMMAND","DRAGSTART_COMMAND","KEY_DELETE_COMMAND","KEY_BACKSPACE_COMMAND","KEY_ENTER_COMMAND","KEY_ESCAPE_COMMAND","draggable","isFocused","Suspense","LexicalNestedComposer","RichTextPlugin","ContentEditable","Placeholder","LexicalErrorBoundary"],"mappings":"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"}

package/dist/LexicalNestedComposer.prod-55127c87.js

@@ -0,0 +1,68 @@
+import { j as u, p as j, q as h, s as y, v as k } from "./index-08ecac4a.js";
+import { useRef as C, useContext as O, useMemo as P, useEffect as m } from "react";
+function N({
+  className: e,
+  style: t
+}) {
+  return /* @__PURE__ */ u.jsx(
+    j,
+    {
+      className: e || "ContentEditable__root",
+      style: t
+    }
+  );
+}
+function R({
+  children: e,
+  className: t
+}) {
+  return /* @__PURE__ */ u.jsx("div", { className: t || "Placeholder__root", children: e });
+}
+function D(e) {
+  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
+}
+var K = D(function(e) {
+  const t = new URLSearchParams();
+  t.append("code", e);
+  for (let o = 1; o < arguments.length; o++)
+    t.append("v", arguments[o]);
+  throw Error(`Minified Lexical error #${e}; visit https://lexical.dev/docs/error?${t} for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`);
+});
+function _(e) {
+  const t = e.transform();
+  return t !== null ? /* @__PURE__ */ new Set([t]) : /* @__PURE__ */ new Set();
+}
+function S({ initialEditor: e, children: t, initialNodes: o, initialTheme: g, skipCollabChecks: v }) {
+  const p = C(!1), i = O(h);
+  i == null && K(9);
+  const [s, { getTheme: x }] = i, b = P(() => {
+    const l = g || x() || void 0, E = y(i, l);
+    if (l !== void 0 && (e._config.theme = l), e._parentEditor = s, o)
+      for (let n of o) {
+        let a = null, r = null;
+        if (typeof n != "function") {
+          const d = n;
+          n = d.replace, a = d.with, r = d.withKlass || null;
+        }
+        const f = e._nodes.get(n.getType());
+        e._nodes.set(n.getType(), { exportDOM: f ? f.exportDOM : void 0, klass: n, replace: a, replaceWithKlass: r, transforms: _(n) });
+      }
+    else {
+      const n = e._nodes = new Map(s._nodes);
+      for (const [a, r] of n)
+        e._nodes.set(a, { exportDOM: r.exportDOM, klass: r.klass, replace: r.replace, replaceWithKlass: r.replaceWithKlass, transforms: _(r.klass) });
+    }
+    return e._config.namespace = s._config.namespace, e._editable = s._editable, [e, E];
+  }, []), { isCollabActive: w, yjsDocMap: M } = k(), c = v || p.current || M.has(e.getKey());
+  return m(() => {
+    c && (p.current = !0);
+  }, [c]), m(() => s.registerEditableListener((l) => {
+    e.setEditable(l);
+  }), [e, s]), u.jsx(h.Provider, { value: b, children: !w || c ? t : null });
+}
+export {
+  N as L,
+  R as P,
+  S as d
+};
+//# sourceMappingURL=LexicalNestedComposer.prod-55127c87.js.map

package/dist/LexicalNestedComposer.prod-55127c87.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LexicalNestedComposer.prod-55127c87.js","sources":["../src/components/ui/ContentEditable.tsx","../src/components/ui/Placeholder.tsx","../node_modules/@lexical/react/LexicalNestedComposer.prod.mjs"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport './ContentEditable.css';\n\nimport {ContentEditable} from '@lexical/react/LexicalContentEditable';\nimport * as React from 'react';\n\nexport default function LexicalContentEditable({\n  className,\n  style,\n}: {\n  className?: string;\n  style?: React.CSSProperties;\n}): JSX.Element {\n  return (\n    <ContentEditable\n      className={className || 'ContentEditable__root'}\n      style={style}\n    />\n  );\n}\n","/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport './Placeholder.css';\n\nimport * as React from 'react';\nimport {ReactNode} from 'react';\n\nexport default function Placeholder({\n  children,\n  className,\n}: {\n  children: ReactNode;\n  className?: string;\n}): JSX.Element {\n  return <div className={className || 'Placeholder__root'}>{children}</div>;\n}\n","/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport{useCollaborationContext as e}from\"@lexical/react/LexicalCollaborationContext\";import{LexicalComposerContext as t,createLexicalComposerContext as r}from\"@lexical/react/LexicalComposerContext\";import{useRef as o,useContext as n,useMemo as l,useEffect as i}from\"react\";import{jsx as a}from\"react/jsx-runtime\";function s(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,\"default\")?e.default:e}var c=s((function(e){const t=new URLSearchParams;t.append(\"code\",e);for(let e=1;e<arguments.length;e++)t.append(\"v\",arguments[e]);throw Error(`Minified Lexical error #${e}; visit https://lexical.dev/docs/error?${t} for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`)}));function p(e){const t=e.transform();return null!==t?new Set([t]):new Set}function d({initialEditor:s,children:d,initialNodes:f,initialTheme:u,skipCollabChecks:m}){const h=o(!1),x=n(t);null==x&&c(9);const[_,{getTheme:g}]=x,v=l((()=>{const e=u||g()||void 0,t=r(x,e);if(void 0!==e&&(s._config.theme=e),s._parentEditor=_,f)for(let e of f){let t=null,r=null;if(\"function\"!=typeof e){const o=e;e=o.replace,t=o.with,r=o.withKlass||null}const o=s._nodes.get(e.getType());s._nodes.set(e.getType(),{exportDOM:o?o.exportDOM:void 0,klass:e,replace:t,replaceWithKlass:r,transforms:p(e)})}else{const e=s._nodes=new Map(_._nodes);for(const[t,r]of e)s._nodes.set(t,{exportDOM:r.exportDOM,klass:r.klass,replace:r.replace,replaceWithKlass:r.replaceWithKlass,transforms:p(r.klass)})}return s._config.namespace=_._config.namespace,s._editable=_._editable,[s,t]}),[]),{isCollabActive:w,yjsDocMap:b}=e(),M=m||h.current||b.has(s.getKey());return i((()=>{M&&(h.current=!0)}),[M]),i((()=>_.registerEditableListener((e=>{s.setEditable(e)}))),[s,_]),a(t.Provider,{value:v,children:!w||M?d:null})}export{d as LexicalNestedComposer};\n"],"names":["LexicalContentEditable","className","style","jsx","ContentEditable","Placeholder","children","s","c","e","p","d","f","u","m","h","o","x","n","t","_","g","v","l","r","b","M","i","a"],"mappings":"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","x_google_ignoreList":[2]}