{"version":3,"file":"FloatingComposerController-z3al33Dz.cjs","names":[],"sources":["../src/components/Comments/FloatingComposer.tsx","../src/components/Comments/FloatingComposerController.tsx"],"sourcesContent":["import { mergeCSSClasses } from \"@blocknote/core\";\nimport { CommentsExtension } from \"@blocknote/core/comments\";\n\nimport { useComponentsContext } from \"../../editor/ComponentsContext.js\";\nimport { useCreateBlockNote } from \"../../hooks/useCreateBlockNote.js\";\nimport { useExtension } from \"../../hooks/useExtension.js\";\nimport { useDictionary } from \"../../i18n/dictionary.js\";\nimport { CommentEditor } from \"./CommentEditor.js\";\nimport { defaultCommentEditorSchema } from \"./defaultCommentEditorSchema.js\";\n\n/**\n * The FloatingComposer component displays a comment editor \"floating\" card.\n *\n * It's used when the user highlights a parts of the document to create a new comment / thread.\n */\nexport function FloatingComposer() {\n  const comments = useExtension(CommentsExtension);\n\n  const Components = useComponentsContext()!;\n  const dict = useDictionary();\n\n  const newCommentEditor = useCreateBlockNote({\n    trailingBlock: false,\n    dictionary: {\n      ...dict,\n      placeholders: {\n        emptyDocument: dict.placeholders.new_comment,\n      },\n    },\n    schema: comments.commentEditorSchema || defaultCommentEditorSchema,\n  });\n\n  return (\n    <Components.Comments.Card className={\"bn-thread\"}>\n      <CommentEditor\n        autoFocus={true}\n        editable={true}\n        editor={newCommentEditor}\n        actions={({ isEmpty }) => (\n          <Components.Generic.Toolbar.Root\n            className={mergeCSSClasses(\n              \"bn-action-toolbar\",\n              \"bn-comment-actions\",\n            )}\n            variant=\"action-toolbar\"\n          >\n            <Components.Generic.Toolbar.Button\n              className={\"bn-button\"}\n              mainTooltip=\"Save\"\n              variant=\"compact\"\n              isDisabled={isEmpty}\n              onClick={async () => {\n                // (later) For REST API, we should implement a loading state and error state\n                await comments.createThread({\n                  initialComment: {\n                    body: newCommentEditor.document,\n                  },\n                });\n                comments.stopPendingComment();\n              }}\n            >\n              Save\n            </Components.Generic.Toolbar.Button>\n          </Components.Generic.Toolbar.Root>\n        )}\n      />\n    </Components.Comments.Card>\n  );\n}\n","import {\n  BlockSchema,\n  DefaultBlockSchema,\n  DefaultInlineContentSchema,\n  DefaultStyleSchema,\n  InlineContentSchema,\n  StyleSchema,\n} from \"@blocknote/core\";\nimport { CommentsExtension } from \"@blocknote/core/comments\";\nimport { flip, offset, shift } from \"@floating-ui/react\";\nimport { ComponentProps, FC, useMemo } from \"react\";\n\nimport { useBlockNoteEditor } from \"../../hooks/useBlockNoteEditor.js\";\nimport { useEditorState } from \"../../hooks/useEditorState.js\";\nimport { useExtension, useExtensionState } from \"../../hooks/useExtension.js\";\nimport { FloatingUIOptions } from \"../Popovers/FloatingUIOptions.js\";\nimport { PositionPopover } from \"../Popovers/PositionPopover.js\";\nimport { FloatingComposer } from \"./FloatingComposer.js\";\n\nexport default function FloatingComposerController<\n  B extends BlockSchema = DefaultBlockSchema,\n  I extends InlineContentSchema = DefaultInlineContentSchema,\n  S extends StyleSchema = DefaultStyleSchema,\n>(props: {\n  floatingComposer?: FC<ComponentProps<typeof FloatingComposer>>;\n  floatingUIOptions?: FloatingUIOptions;\n}) {\n  const editor = useBlockNoteEditor<B, I, S>();\n\n  const comments = useExtension(CommentsExtension);\n\n  const pendingComment = useExtensionState(CommentsExtension, {\n    editor,\n    selector: (state) => state.pendingComment,\n  });\n\n  const position = useEditorState({\n    editor,\n    selector: ({ editor }) =>\n      pendingComment\n        ? {\n            from: editor.prosemirrorState.selection.from,\n            to: editor.prosemirrorState.selection.to,\n          }\n        : undefined,\n  });\n\n  const floatingUIOptions = useMemo<FloatingUIOptions>(\n    () => ({\n      ...props.floatingUIOptions,\n      useFloatingOptions: {\n        open: !!pendingComment,\n        // Needed as hooks like `useDismiss` call `onOpenChange` to change the\n        // open state.\n        onOpenChange: (open) => {\n          if (!open) {\n            comments.stopPendingComment();\n            editor.focus();\n          }\n        },\n        placement: \"bottom\",\n        middleware: [offset(10), shift(), flip()],\n        ...props.floatingUIOptions?.useFloatingOptions,\n      },\n      focusManagerProps: {\n        disabled: false,\n      },\n      elementProps: {\n        style: {\n          zIndex: 60,\n        },\n        ...props.floatingUIOptions?.elementProps,\n      },\n    }),\n    [comments, editor, pendingComment, props.floatingUIOptions],\n  );\n\n  // nice to have improvements would be:\n  // - transition transform property so composer box animates when remote document is changed\n  // - fade out on close\n\n  const Component = props.floatingComposer || FloatingComposer;\n\n  return (\n    <PositionPopover position={position} {...floatingUIOptions}>\n      <Component />\n    </PositionPopover>\n  );\n}\n"],"mappings":"sNAeA,SAAgB,GAAmB,CACjC,IAAM,EAAW,EAAA,EAAa,EAAA,kBAAkB,CAE1C,EAAa,EAAA,GAAsB,CACnC,EAAO,EAAA,GAAe,CAEtB,EAAmB,EAAA,EAAmB,CAC1C,cAAe,GACf,WAAY,CACV,GAAG,EACH,aAAc,CACZ,cAAe,EAAK,aAAa,YAClC,CACF,CACD,OAAQ,EAAS,qBAAuB,EAAA,EACzC,CAAC,CAEF,OACE,EAAA,EAAA,KAAC,EAAW,SAAS,KAArB,CAA0B,UAAW,sBACnC,EAAA,EAAA,KAAC,EAAA,EAAD,CACE,UAAW,GACX,SAAU,GACV,OAAQ,EACR,SAAU,CAAE,cACV,EAAA,EAAA,KAAC,EAAW,QAAQ,QAAQ,KAA5B,CACE,WAAA,EAAA,EAAA,iBACE,oBACA,qBACD,CACD,QAAQ,2BAER,EAAA,EAAA,KAAC,EAAW,QAAQ,QAAQ,OAA5B,CACE,UAAW,YACX,YAAY,OACZ,QAAQ,UACR,WAAY,EACZ,QAAS,SAAY,CAEnB,MAAM,EAAS,aAAa,CAC1B,eAAgB,CACd,KAAM,EAAiB,SACxB,CACF,CAAC,CACF,EAAS,oBAAoB,WAEhC,OAEmC,CAAA,CACJ,CAAA,CAEpC,CAAA,CACuB,CAAA,4BC/C/B,SAAwB,EAItB,EAGC,CACD,IAAM,EAAS,EAAA,GAA6B,CAEtC,EAAW,EAAA,EAAa,EAAA,kBAAkB,CAE1C,EAAiB,EAAA,EAAkB,EAAA,kBAAmB,CAC1D,SACA,SAAW,GAAU,EAAM,eAC5B,CAAC,CAEI,EAAW,EAAA,EAAe,CAC9B,SACA,UAAW,CAAE,YACX,EACI,CACE,KAAM,EAAO,iBAAiB,UAAU,KACxC,GAAI,EAAO,iBAAiB,UAAU,GACvC,CACD,IAAA,GACP,CAAC,CAEI,GAAA,EAAA,EAAA,cACG,CACL,GAAG,EAAM,kBACT,mBAAoB,CAClB,KAAM,CAAC,CAAC,EAGR,aAAe,GAAS,CACjB,IACH,EAAS,oBAAoB,CAC7B,EAAO,OAAO,GAGlB,UAAW,SACX,WAAY,cAAQ,GAAG,cAAS,aAAQ,CAAC,CACzC,GAAG,EAAM,mBAAmB,mBAC7B,CACD,kBAAmB,CACjB,SAAU,GACX,CACD,aAAc,CACZ,MAAO,CACL,OAAQ,GACT,CACD,GAAG,EAAM,mBAAmB,aAC7B,CACF,EACD,CAAC,EAAU,EAAQ,EAAgB,EAAM,kBAAkB,CAC5D,CAMK,EAAY,EAAM,kBAAoB,EAE5C,OACE,EAAA,EAAA,KAAC,EAAA,EAAD,CAA2B,WAAU,GAAI,YACvC,EAAA,EAAA,KAAC,EAAD,EAAa,CAAA,CACG,CAAA"}