@blocknote/react
Version:
A "Notion-style" block-based extensible text editor built on top of Prosemirror and Tiptap.
1 lines • 9.54 MB
Source Map (JSON)
{"version":3,"file":"blocknote-react.cjs","sources":["../src/editor/BlockNoteContext.ts","../src/editor/ComponentsContext.tsx","../src/hooks/useBlockNoteEditor.ts","../src/i18n/dictionary.ts","../src/components/FilePanel/DefaultTabs/EmbedTab.tsx","../src/components/FilePanel/DefaultTabs/UploadTab.tsx","../src/components/FilePanel/FilePanel.tsx","../src/components/Popovers/GenericPopover.tsx","../src/components/Popovers/BlockPopover.tsx","../src/hooks/useExtension.ts","../src/components/FilePanel/FilePanelController.tsx","../../../node_modules/.pnpm/fast-deep-equal@3.1.3/node_modules/fast-deep-equal/es6/react.js","../../../node_modules/.pnpm/use-sync-external-store@1.6.0_react@19.2.0/node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.production.js","../../../node_modules/.pnpm/use-sync-external-store@1.6.0_react@19.2.0/node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js","../../../node_modules/.pnpm/use-sync-external-store@1.6.0_react@19.2.0/node_modules/use-sync-external-store/shim/index.js","../../../node_modules/.pnpm/use-sync-external-store@1.6.0_react@19.2.0/node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.production.js","../../../node_modules/.pnpm/use-sync-external-store@1.6.0_react@19.2.0/node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js","../../../node_modules/.pnpm/use-sync-external-store@1.6.0_react@19.2.0/node_modules/use-sync-external-store/shim/with-selector.js","../src/hooks/useEditorState.ts","../src/components/Popovers/PositionPopover.tsx","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.2.0/node_modules/react-icons/lib/iconContext.mjs","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.2.0/node_modules/react-icons/lib/iconBase.mjs","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.2.0/node_modules/react-icons/ri/index.mjs","../src/components/FormattingToolbar/DefaultButtons/BasicTextStyleButton.tsx","../src/components/ColorPicker/ColorIcon.tsx","../src/components/ColorPicker/ColorPicker.tsx","../src/components/FormattingToolbar/DefaultButtons/ColorStyleButton.tsx","../src/components/LinkToolbar/EditLinkMenuItems.tsx","../src/components/FormattingToolbar/DefaultButtons/CreateLinkButton.tsx","../src/components/FormattingToolbar/DefaultButtons/FileCaptionButton.tsx","../src/components/FormattingToolbar/DefaultButtons/FileDeleteButton.tsx","../src/components/FormattingToolbar/DefaultButtons/FileRenameButton.tsx","../src/components/FormattingToolbar/DefaultButtons/FileReplaceButton.tsx","../src/components/FormattingToolbar/DefaultButtons/NestBlockButtons.tsx","../src/components/FormattingToolbar/DefaultSelects/BlockTypeSelect.tsx","../src/components/FormattingToolbar/DefaultButtons/AddCommentButton.tsx","../src/components/FormattingToolbar/DefaultButtons/AddTiptapCommentButton.tsx","../src/util/sanitizeUrl.ts","../src/components/FormattingToolbar/DefaultButtons/FileDownloadButton.tsx","../src/components/FormattingToolbar/DefaultButtons/FilePreviewButton.tsx","../src/components/FormattingToolbar/DefaultButtons/TableCellMergeButton.tsx","../src/components/FormattingToolbar/DefaultButtons/TextAlignButton.tsx","../src/components/FormattingToolbar/FormattingToolbar.tsx","../src/components/FormattingToolbar/FormattingToolbarController.tsx","../src/components/LinkToolbar/DefaultButtons/DeleteLinkButton.tsx","../src/components/LinkToolbar/DefaultButtons/EditLinkButton.tsx","../src/components/LinkToolbar/DefaultButtons/OpenLinkButton.tsx","../src/components/LinkToolbar/LinkToolbar.tsx","../src/components/LinkToolbar/LinkToolbarController.tsx","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.2.0/node_modules/react-icons/ai/index.mjs","../src/components/SideMenu/DefaultButtons/AddBlockButton.tsx","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.2.0/node_modules/react-icons/md/index.mjs","../src/components/SideMenu/DragHandleMenu/DefaultItems/BlockColorsItem.tsx","../src/components/SideMenu/DragHandleMenu/DefaultItems/RemoveBlockItem.tsx","../src/components/SideMenu/DragHandleMenu/DefaultItems/TableHeadersItem.tsx","../src/components/SideMenu/DragHandleMenu/DragHandleMenu.tsx","../src/components/SideMenu/DefaultButtons/DragHandleButton.tsx","../src/components/SideMenu/SideMenu.tsx","../src/components/SideMenu/SideMenuController.tsx","../src/components/SuggestionMenu/GridSuggestionMenu/getDefaultReactEmojiPickerItems.tsx","../src/components/SuggestionMenu/GridSuggestionMenu/GridSuggestionMenu.tsx","../src/components/SuggestionMenu/hooks/useCloseSuggestionMenuNoItems.ts","../src/components/SuggestionMenu/hooks/useLoadSuggestionMenuItems.ts","../src/components/SuggestionMenu/GridSuggestionMenu/hooks/useGridSuggestionMenuKeyboardNavigation.ts","../src/components/SuggestionMenu/GridSuggestionMenu/GridSuggestionMenuWrapper.tsx","../src/components/SuggestionMenu/GridSuggestionMenu/GridSuggestionMenuController.tsx","../src/components/SuggestionMenu/SuggestionMenu.tsx","../src/components/SuggestionMenu/hooks/useSuggestionMenuKeyboardHandler.ts","../src/components/SuggestionMenu/hooks/useSuggestionMenuKeyboardNavigation.ts","../src/components/SuggestionMenu/SuggestionMenuWrapper.tsx","../src/components/SuggestionMenu/getDefaultReactSlashMenuItems.tsx","../src/components/SuggestionMenu/SuggestionMenuController.tsx","../src/components/TableHandles/ExtendButton/ExtendButton.tsx","../src/components/TableHandles/TableHandleMenu/DefaultButtons/AddButton.tsx","../src/components/TableHandles/TableHandleMenu/DefaultButtons/DeleteButton.tsx","../src/components/TableHandles/TableHandleMenu/DefaultButtons/ColorPicker.tsx","../src/components/TableHandles/TableHandleMenu/DefaultButtons/TableHeaderButton.tsx","../src/components/TableHandles/TableHandleMenu/TableHandleMenu.tsx","../src/components/TableHandles/TableHandle.tsx","../src/components/TableHandles/TableCellMenu/DefaultButtons/ColorPicker.tsx","../src/components/TableHandles/TableCellMenu/DefaultButtons/SplitButton.tsx","../src/components/TableHandles/TableCellMenu/TableCellMenu.tsx","../src/components/TableHandles/TableCellButton.tsx","../src/components/TableHandles/TableHandlesController.tsx","../src/editor/BlockNoteDefaultUI.tsx","../src/hooks/useEditorChange.ts","../src/hooks/useEditorSelectionChange.ts","../src/hooks/usePrefersColorScheme.ts","../src/editor/BlockNoteViewContext.ts","../src/editor/EditorContent.tsx","../src/editor/ElementRenderer.tsx","../src/editor/BlockNoteView.tsx","../src/schema/@util/ReactRenderUtil.ts","../src/schema/ReactBlockSpec.tsx","../src/blocks/File/useResolveUrl.tsx","../src/blocks/File/helpers/toExternalHTML/FigureWithCaption.tsx","../src/hooks/useOnUploadEnd.ts","../src/hooks/useOnUploadStart.ts","../src/hooks/useUploadLoading.ts","../src/blocks/File/helpers/render/AddFileButton.tsx","../src/blocks/File/helpers/render/FileNameWithIcon.tsx","../src/blocks/File/helpers/render/FileBlockWrapper.tsx","../src/blocks/File/helpers/toExternalHTML/LinkWithCaption.tsx","../src/blocks/Audio/block.tsx","../src/blocks/File/block.tsx","../src/blocks/File/helpers/render/ResizableFileBlockWrapper.tsx","../src/blocks/Image/block.tsx","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.2.0/node_modules/react-icons/tb/index.mjs","../src/blocks/PageBreak/getPageBreakReactSlashMenuItems.tsx","../src/blocks/Video/block.tsx","../src/blocks/ToggleWrapper/ToggleWrapper.tsx","../src/components/FormattingToolbar/ExperimentalMobileFormattingToolbarController.tsx","../src/components/Popovers/TableCellPopover.tsx","../src/components/TableHandles/hooks/useExtendButtonsPositioning.ts","../src/components/TableHandles/hooks/useTableHandlesPositioning.ts","../src/hooks/useCreateBlockNote.tsx","../src/components/Comments/CommentEditor.tsx","../src/components/Comments/EmojiMartPicker.tsx","../src/components/Comments/EmojiPicker.tsx","../src/components/Comments/useUsers.ts","../src/components/Comments/ReactionBadge.tsx","../src/components/Comments/defaultCommentEditorSchema.ts","../src/components/Comments/Comment.tsx","../src/components/Comments/Comments.tsx","../src/components/Comments/FloatingComposer.tsx","../src/components/Comments/FloatingComposerController.tsx","../src/components/Comments/Thread.tsx","../src/components/Comments/useThreads.ts","../src/components/Comments/FloatingThreadController.tsx","../src/components/Comments/ThreadsSidebar.tsx","../src/hooks/useActiveStyles.ts","../src/hooks/useEditorSelectionBoundingBox.ts","../src/hooks/useFocusWithin.ts","../src/hooks/useSelectedBlocks.ts","../src/schema/ReactInlineContentSpec.tsx","../src/schema/ReactStyleSpec.tsx","../src/util/elementOverflow.ts","../src/util/mergeRefs.ts"],"sourcesContent":["import {\n BlockNoteEditor,\n BlockNoteSchema,\n BlockSchema,\n DefaultBlockSchema,\n DefaultInlineContentSchema,\n DefaultStyleSchema,\n InlineContentSchema,\n StyleSchema,\n} from \"@blocknote/core\";\nimport { createContext, useContext, useState } from \"react\";\n\nexport type BlockNoteContextValue<\n BSchema extends BlockSchema = DefaultBlockSchema,\n ISchema extends InlineContentSchema = DefaultInlineContentSchema,\n SSchema extends StyleSchema = DefaultStyleSchema,\n> = {\n setContentEditableProps?: ReturnType<typeof useState<Record<string, any>>>[1]; // copy type of setXXX from useState\n editor?: BlockNoteEditor<BSchema, ISchema, SSchema>;\n colorSchemePreference?: \"light\" | \"dark\";\n};\n\nexport const BlockNoteContext = createContext<\n BlockNoteContextValue | undefined\n>(undefined);\n\n/**\n * Get the BlockNoteContext instance from the nearest BlockNoteContext provider\n * @param _schema: optional, pass in the schema to return type-safe Context if you're using a custom schema\n */\nexport function useBlockNoteContext<\n BSchema extends BlockSchema = DefaultBlockSchema,\n ISchema extends InlineContentSchema = DefaultInlineContentSchema,\n SSchema extends StyleSchema = DefaultStyleSchema,\n>(\n _schema?: BlockNoteSchema<BSchema, ISchema, SSchema>,\n): BlockNoteContextValue<BSchema, ISchema, SSchema> | undefined {\n const context = useContext(BlockNoteContext) as any;\n\n return context;\n}\n","import {\n ChangeEvent,\n ComponentType,\n createContext,\n CSSProperties,\n HTMLInputAutoCompleteAttribute,\n KeyboardEvent,\n MouseEvent,\n ReactNode,\n useContext,\n} from \"react\";\n\nimport { BlockNoteEditor } from \"@blocknote/core\";\nimport { User } from \"@blocknote/core/comments\";\nimport { DefaultReactGridSuggestionItem } from \"../components/SuggestionMenu/GridSuggestionMenu/types.js\";\nimport { DefaultReactSuggestionItem } from \"../components/SuggestionMenu/types.js\";\n\ntype ToolbarRootType = {\n className?: string;\n children?: ReactNode;\n onMouseEnter?: () => void;\n onMouseLeave?: () => void;\n variant?: \"default\" | \"action-toolbar\";\n};\n\ntype ToolbarButtonType = {\n className?: string;\n mainTooltip?: string;\n secondaryTooltip?: string;\n icon?: ReactNode;\n onClick?: (e: MouseEvent) => void;\n isSelected?: boolean;\n isDisabled?: boolean;\n variant?: \"default\" | \"compact\";\n} & (\n | { children: ReactNode; label?: string }\n | { children?: undefined; label: string }\n);\n\ntype ToolbarSelectType = {\n className?: string;\n items: {\n text: string;\n icon: ReactNode;\n onClick: () => void;\n isSelected: boolean;\n isDisabled?: boolean;\n }[];\n isDisabled?: boolean;\n};\n\ntype MenuButtonType = {\n className?: string;\n onClick?: (e: MouseEvent) => void;\n icon?: ReactNode;\n onDragStart?: (e: React.DragEvent) => void;\n onDragEnd?: (e: React.DragEvent) => void;\n draggable?: boolean;\n} & (\n | { children: ReactNode; label?: string }\n | { children?: undefined; label: string }\n);\n\nexport type ComponentProps = {\n FormattingToolbar: {\n Root: ToolbarRootType;\n Button: ToolbarButtonType;\n Select: ToolbarSelectType;\n };\n FilePanel: {\n Root: {\n className?: string;\n tabs: {\n name: string;\n tabPanel: ReactNode;\n }[];\n openTab: string;\n setOpenTab: (name: string) => void;\n defaultOpenTab: string;\n loading: boolean;\n };\n Button: {\n className?: string;\n onClick: () => void;\n } & (\n | { children: ReactNode; label?: string }\n | { children?: undefined; label: string }\n );\n FileInput: {\n className?: string;\n accept: string;\n value: File | null;\n placeholder: string;\n onChange: (payload: File | null) => void;\n };\n TabPanel: {\n className?: string;\n children?: ReactNode;\n };\n TextInput: {\n className?: string;\n value: string;\n placeholder: string;\n onChange: (event: ChangeEvent<HTMLInputElement>) => void;\n onKeyDown: (event: KeyboardEvent) => void;\n };\n };\n LinkToolbar: {\n Root: ToolbarRootType;\n Button: ToolbarButtonType;\n Select: ToolbarSelectType;\n };\n SideMenu: {\n Root: {\n className?: string;\n children?: ReactNode;\n };\n Button: {\n className?: string;\n onClick?: (e: MouseEvent) => void;\n icon?: ReactNode;\n onDragStart?: (e: React.DragEvent) => void;\n onDragEnd?: (e: React.DragEvent) => void;\n draggable?: boolean;\n } & (\n | { children: ReactNode; label?: string }\n | { children?: undefined; label: string }\n );\n };\n SuggestionMenu: {\n Root: {\n id: string;\n className?: string;\n children?: ReactNode;\n };\n EmptyItem: {\n className?: string;\n children?: ReactNode;\n };\n Item: {\n className?: string;\n id: string;\n isSelected: boolean;\n onClick: () => void;\n item: Omit<DefaultReactSuggestionItem, \"onItemClick\">;\n };\n Label: {\n className?: string;\n children?: ReactNode;\n };\n Loader: {\n className?: string;\n };\n };\n GridSuggestionMenu: {\n Root: {\n id: string;\n columns: number;\n className?: string;\n children?: ReactNode;\n };\n EmptyItem: {\n columns: number;\n className?: string;\n children?: ReactNode;\n };\n Item: {\n className?: string;\n id: string;\n isSelected: boolean;\n onClick: () => void;\n item: DefaultReactGridSuggestionItem;\n };\n // Label: {\n // className?: string;\n // children?: ReactNode;\n // };\n Loader: {\n columns: number;\n className?: string;\n children?: ReactNode;\n };\n };\n TableHandle: {\n Root: {\n className?: string;\n draggable: boolean;\n onDragStart: (e: React.DragEvent) => void;\n onDragEnd: () => void;\n style?: CSSProperties;\n } & (\n | { children: ReactNode; label?: string }\n | { children?: undefined; label: string }\n );\n ExtendButton: {\n className?: string;\n onClick: (e: React.MouseEvent) => void;\n onMouseDown: (e: React.MouseEvent) => void;\n children: ReactNode;\n };\n };\n Comments: {\n Card: {\n className?: string;\n headerText?: string;\n selected?: boolean;\n onFocus?: (event: React.FocusEvent) => void;\n onBlur?: (event: React.FocusEvent) => void;\n tabIndex?: number;\n children?: ReactNode;\n };\n CardSection: {\n className?: string;\n children?: ReactNode;\n };\n ExpandSectionsPrompt: {\n className?: string;\n children?: ReactNode;\n };\n Editor: {\n className?: string;\n autoFocus?: boolean;\n editable: boolean;\n editor: BlockNoteEditor<any, any, any>;\n onFocus?: () => void;\n onBlur?: () => void;\n };\n Comment: {\n className?: string;\n children?: ReactNode;\n authorInfo: \"loading\" | User;\n timeString: string;\n edited: boolean;\n actions?: ReactNode;\n showActions?: boolean | \"hover\";\n emojiPickerOpen?: boolean;\n };\n };\n // TODO: We should try to make everything as generic as we can\n Generic: {\n Badge: {\n Root: {\n className?: string;\n text: string;\n icon?: ReactNode;\n isSelected?: boolean;\n mainTooltip?: string;\n secondaryTooltip?: string;\n onClick?: (event: React.MouseEvent) => void;\n onMouseEnter?: () => void;\n };\n Group: {\n className?: string;\n children: ReactNode;\n };\n };\n Form: {\n Root: {\n children?: ReactNode;\n };\n TextInput: {\n className?: string;\n name: string;\n label?: string;\n variant?: \"default\" | \"large\";\n icon: ReactNode;\n rightSection?: ReactNode;\n autoFocus?: boolean;\n placeholder?: string;\n disabled?: boolean;\n value: string;\n onKeyDown: (event: KeyboardEvent<HTMLInputElement>) => void;\n onChange: (event: ChangeEvent<HTMLInputElement>) => void;\n onSubmit?: () => void;\n autoComplete?: HTMLInputAutoCompleteAttribute;\n };\n };\n Menu: {\n Root: {\n sub?: boolean;\n onOpenChange?: (open: boolean) => void;\n position?:\n | \"top\"\n | \"right\"\n | \"bottom\"\n | \"left\"\n | `${\"top\" | \"right\" | \"bottom\" | \"left\"}-${\"start\" | \"end\"}`;\n children?: ReactNode;\n };\n Divider: {\n className?: string;\n };\n Dropdown: {\n className?: string;\n children?: ReactNode;\n sub?: boolean;\n };\n Item: {\n className?: string;\n children?: ReactNode;\n\n subTrigger?: boolean;\n icon?: ReactNode;\n checked?: boolean;\n onClick?: () => void;\n };\n Label: {\n className?: string;\n children?: ReactNode;\n };\n Trigger: {\n children?: ReactNode;\n sub?: boolean;\n };\n Button: MenuButtonType;\n };\n Popover: {\n Root: {\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n position?:\n | \"top\"\n | \"right\"\n | \"bottom\"\n | \"left\"\n | `${\"top\" | \"right\" | \"bottom\" | \"left\"}-${\"start\" | \"end\"}`;\n children?: ReactNode;\n };\n Content: {\n className?: string;\n variant: \"form-popover\" | \"panel-popover\";\n children?: ReactNode;\n };\n Trigger: {\n children?: ReactNode;\n };\n };\n Toolbar: {\n Root: ToolbarRootType;\n Button: ToolbarButtonType;\n Select: ToolbarSelectType;\n };\n };\n};\n\nexport type Components = {\n [Components in keyof Omit<ComponentProps, \"Generic\">]: {\n [Component in keyof ComponentProps[Components]]: ComponentType<\n ComponentProps[Components][Component]\n >;\n };\n} & {\n // only needed as Generic Root/etc elements are 1 level of nesting deeper\n Generic: {\n [GenericComponents in keyof ComponentProps[\"Generic\"]]: {\n [Component in keyof ComponentProps[\"Generic\"][GenericComponents]]: ComponentType<\n ComponentProps[\"Generic\"][GenericComponents][Component]\n >;\n };\n };\n};\n\nexport const ComponentsContext = createContext<Components | undefined>(\n undefined,\n);\n\nexport function useComponentsContext(): Components | undefined {\n return useContext(ComponentsContext)!;\n}\n","import {\n BlockNoteEditor,\n BlockNoteSchema,\n BlockSchema,\n DefaultBlockSchema,\n DefaultInlineContentSchema,\n DefaultStyleSchema,\n InlineContentSchema,\n StyleSchema,\n} from \"@blocknote/core\";\n\nimport { useBlockNoteContext } from \"../editor/BlockNoteContext.js\";\n\n/**\n * Get the BlockNoteEditor instance from the nearest BlockNoteContext provider\n * @param _schema: optional, pass in the schema to return type-safe BlockNoteEditor if you're using a custom schema\n */\nexport function useBlockNoteEditor<\n BSchema extends BlockSchema = DefaultBlockSchema,\n ISchema extends InlineContentSchema = DefaultInlineContentSchema,\n SSchema extends StyleSchema = DefaultStyleSchema,\n>(\n _schema?: BlockNoteSchema<BSchema, ISchema, SSchema>,\n): BlockNoteEditor<BSchema, ISchema, SSchema> {\n const context = useBlockNoteContext(_schema);\n\n if (!context?.editor) {\n throw new Error(\n \"useBlockNoteEditor was called outside of a BlockNoteContext provider or BlockNoteView component\",\n );\n }\n\n return context.editor;\n}\n","import { Dictionary } from \"@blocknote/core\";\nimport { useBlockNoteContext } from \"../editor/BlockNoteContext.js\";\n\nexport function useDictionary(): Dictionary {\n const ctx = useBlockNoteContext();\n return ctx!.editor!.dictionary;\n}\n","import {\n BlockSchema,\n DefaultBlockSchema,\n DefaultInlineContentSchema,\n DefaultStyleSchema,\n InlineContentSchema,\n StyleSchema,\n filenameFromURL,\n} from \"@blocknote/core\";\nimport { ChangeEvent, KeyboardEvent, useCallback, useState } from \"react\";\n\nimport { useComponentsContext } from \"../../../editor/ComponentsContext.js\";\nimport { useBlockNoteEditor } from \"../../../hooks/useBlockNoteEditor.js\";\nimport { useDictionary } from \"../../../i18n/dictionary.js\";\nimport { FilePanelProps } from \"../FilePanelProps.js\";\n\nexport const EmbedTab = <\n B extends BlockSchema = DefaultBlockSchema,\n I extends InlineContentSchema = DefaultInlineContentSchema,\n S extends StyleSchema = DefaultStyleSchema,\n>(\n props: FilePanelProps,\n) => {\n const Components = useComponentsContext()!;\n const dict = useDictionary();\n\n const editor = useBlockNoteEditor<B, I, S>();\n\n const block = editor.getBlock(props.blockId)!;\n\n const [currentURL, setCurrentURL] = useState<string>(\"\");\n\n const handleURLChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n setCurrentURL(event.currentTarget.value);\n },\n [],\n );\n\n const handleURLEnter = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === \"Enter\") {\n event.preventDefault();\n editor.updateBlock(block.id, {\n props: {\n name: filenameFromURL(currentURL),\n url: currentURL,\n } as any,\n });\n }\n },\n [editor, block.id, currentURL],\n );\n\n const handleURLClick = useCallback(() => {\n editor.updateBlock(block.id, {\n props: {\n name: filenameFromURL(currentURL),\n url: currentURL,\n } as any,\n });\n }, [editor, block.id, currentURL]);\n\n return (\n <Components.FilePanel.TabPanel className={\"bn-tab-panel\"}>\n <Components.FilePanel.TextInput\n className={\"bn-text-input\"}\n placeholder={dict.file_panel.embed.url_placeholder}\n value={currentURL}\n onChange={handleURLChange}\n onKeyDown={handleURLEnter}\n data-test={\"embed-input\"}\n />\n <Components.FilePanel.Button\n className={\"bn-button\"}\n onClick={handleURLClick}\n data-test=\"embed-input-button\"\n >\n {dict.file_panel.embed.embed_button[block.type] ||\n dict.file_panel.embed.embed_button[\"file\"]}\n </Components.FilePanel.Button>\n </Components.FilePanel.TabPanel>\n );\n};\n","import {\n BlockSchema,\n DefaultBlockSchema,\n DefaultInlineContentSchema,\n DefaultStyleSchema,\n InlineContentSchema,\n StyleSchema,\n} from \"@blocknote/core\";\nimport { useCallback, useEffect, useState } from \"react\";\n\nimport { useComponentsContext } from \"../../../editor/ComponentsContext.js\";\nimport { useBlockNoteEditor } from \"../../../hooks/useBlockNoteEditor.js\";\nimport { useDictionary } from \"../../../i18n/dictionary.js\";\nimport { FilePanelProps } from \"../FilePanelProps.js\";\n\nexport const UploadTab = <\n B extends BlockSchema = DefaultBlockSchema,\n I extends InlineContentSchema = DefaultInlineContentSchema,\n S extends StyleSchema = DefaultStyleSchema,\n>(\n props: FilePanelProps & {\n setLoading: (loading: boolean) => void;\n },\n) => {\n const Components = useComponentsContext()!;\n const dict = useDictionary();\n\n const { setLoading } = props;\n\n const editor = useBlockNoteEditor<B, I, S>();\n\n const block = editor.getBlock(props.blockId)!;\n\n const [uploadFailed, setUploadFailed] = useState<boolean>(false);\n\n useEffect(() => {\n if (uploadFailed) {\n setTimeout(() => {\n setUploadFailed(false);\n }, 3000);\n }\n }, [uploadFailed]);\n\n const handleFileChange = useCallback(\n (file: File | null) => {\n if (file === null) {\n return;\n }\n\n async function upload(file: File) {\n setLoading(true);\n\n if (editor.uploadFile !== undefined) {\n try {\n let updateData = await editor.uploadFile(file, props.blockId);\n if (typeof updateData === \"string\") {\n // received a url\n updateData = {\n props: {\n name: file.name,\n url: updateData,\n },\n };\n }\n editor.updateBlock(props.blockId, updateData);\n } catch (e) {\n setUploadFailed(true);\n } finally {\n setLoading(false);\n }\n }\n }\n\n upload(file);\n },\n [props.blockId, editor, setLoading],\n );\n\n const spec = editor.schema.blockSpecs[block.type];\n const accept = spec.implementation.meta?.fileBlockAccept?.length\n ? spec.implementation.meta.fileBlockAccept.join(\",\")\n : \"*/*\";\n\n return (\n <Components.FilePanel.TabPanel className={\"bn-tab-panel\"}>\n <Components.FilePanel.FileInput\n className=\"bn-file-input\"\n data-test=\"upload-input\"\n accept={accept}\n placeholder={\n dict.file_panel.upload.file_placeholder[block.type] ||\n dict.file_panel.upload.file_placeholder[\"file\"]\n }\n value={null}\n onChange={handleFileChange}\n />\n {uploadFailed && (\n <div className=\"bn-error-text\">\n {dict.file_panel.upload.upload_error}\n </div>\n )}\n </Components.FilePanel.TabPanel>\n );\n};\n","import {\n BlockSchema,\n DefaultBlockSchema,\n DefaultInlineContentSchema,\n DefaultStyleSchema,\n InlineContentSchema,\n StyleSchema,\n} from \"@blocknote/core\";\nimport { useState } from \"react\";\n\nimport {\n ComponentProps,\n useComponentsContext,\n} from \"../../editor/ComponentsContext.js\";\nimport { useBlockNoteEditor } from \"../../hooks/useBlockNoteEditor.js\";\nimport { useDictionary } from \"../../i18n/dictionary.js\";\nimport { EmbedTab } from \"./DefaultTabs/EmbedTab.js\";\nimport { UploadTab } from \"./DefaultTabs/UploadTab.js\";\nimport { FilePanelProps } from \"./FilePanelProps.js\";\n\ntype PanelProps = ComponentProps[\"FilePanel\"][\"Root\"];\n\n/**\n * By default, the FilePanel component will render with default tabs. However,\n * you can override the tabs to render by passing the `tabs` prop. You can use\n * the default tab panels in the `DefaultTabPanels` directory or make your own\n * using the `FilePanelPanel` component.\n */\nexport const FilePanel = <\n B extends BlockSchema = DefaultBlockSchema,\n I extends InlineContentSchema = DefaultInlineContentSchema,\n S extends StyleSchema = DefaultStyleSchema,\n>(\n props: FilePanelProps & Partial<Pick<PanelProps, \"defaultOpenTab\" | \"tabs\">>,\n) => {\n const Components = useComponentsContext()!;\n const dict = useDictionary();\n\n const editor = useBlockNoteEditor<B, I, S>();\n\n const [loading, setLoading] = useState<boolean>(false);\n\n const tabs: PanelProps[\"tabs\"] = props.tabs ?? [\n ...(editor.uploadFile !== undefined\n ? [\n {\n name: dict.file_panel.upload.title,\n tabPanel: (\n <UploadTab blockId={props.blockId} setLoading={setLoading} />\n ),\n },\n ]\n : []),\n {\n name: dict.file_panel.embed.title,\n tabPanel: <EmbedTab blockId={props.blockId} />,\n },\n ];\n\n const [openTab, setOpenTab] = useState<string>(\n props.defaultOpenTab || tabs[0].name,\n );\n\n return (\n <Components.FilePanel.Root\n className={\"bn-panel\"}\n defaultOpenTab={openTab}\n openTab={openTab}\n setOpenTab={setOpenTab}\n tabs={tabs}\n loading={loading}\n />\n );\n};\n","import {\n useFloating,\n useTransitionStyles,\n useDismiss,\n useInteractions,\n useMergeRefs,\n useTransitionStatus,\n autoUpdate,\n useHover,\n} from \"@floating-ui/react\";\nimport { HTMLAttributes, ReactNode, useEffect, useRef } from \"react\";\n\nimport { FloatingUIOptions } from \"./FloatingUIOptions.js\";\n\nexport type GenericPopoverReference =\n | {\n // A DOM element to use as the reference element for the popover.\n element: Element;\n // To update the popover position, `element.getReferenceBoundingRect`\n // is called. This flag caches the last result of the call while the\n // element is mounted to the DOM, so it doesn't update while the\n // popover is closing and transitioning out. Useful for if the\n // reference element unmounts, as `element.getReferenceBoundingRect`\n // would return a `DOMRect` with x, y, width, and height of 0.\n // Defaults to `true`.\n cacheMountedBoundingClientRect?: boolean;\n }\n | {\n // When no reference element is provided, this can be provided as an\n // alternative \"virtual\" element to position the popover around.\n getBoundingClientRect: () => DOMRect;\n }\n | {\n element: Element;\n cacheMountedBoundingClientRect?: boolean;\n // If both `element` and `getBoundingClientRect` are provided, uses\n // `getBoundingClientRect` to position the popover, but still treats\n // `element` as the reference element for all other purposes. When\n // `cacheMountedBoundingClientRect` is `true` or unspecified, this\n // function is not called while the reference element is not mounted.\n getBoundingClientRect: () => DOMRect;\n };\n\n// Returns a modified version of `getBoundingClientRect`, if\n// `reference.element` is passed and `reference.cacheMountedBoundingClientRect`\n// is `true` or `undefined`. In the modified version, each new result is cached\n// and returned while `reference.element` is connected to the DOM. If it is no\n// longer connected, the cache is no longer updated and the last cached result\n// is used.\n//\n// In all other cases, just returns `reference.getBoundingClientRect`, or\n// `reference.element.getBoundingClientRect` if it's not defined.\nexport function getMountedBoundingClientRectCache(\n reference: GenericPopoverReference,\n) {\n let lastBoundingClientRect = new DOMRect();\n const getBoundingClientRect =\n \"getBoundingClientRect\" in reference\n ? () => reference.getBoundingClientRect()\n : () => reference.element.getBoundingClientRect();\n\n return () => {\n if (\n \"element\" in reference &&\n (reference.cacheMountedBoundingClientRect ?? true)\n ) {\n if (reference.element.isConnected) {\n lastBoundingClientRect = getBoundingClientRect();\n }\n\n return lastBoundingClientRect;\n }\n\n return getBoundingClientRect();\n };\n}\n\nexport const GenericPopover = (\n props: FloatingUIOptions & {\n reference?: GenericPopoverReference;\n children: ReactNode;\n },\n) => {\n const { refs, floatingStyles, context } = useFloating<HTMLDivElement>({\n whileElementsMounted: autoUpdate,\n ...props.useFloatingOptions,\n });\n\n const { isMounted, styles } = useTransitionStyles(\n context,\n props.useTransitionStylesProps,\n );\n const { status } = useTransitionStatus(\n context,\n props.useTransitionStatusProps,\n );\n\n const dismiss = useDismiss(context, props.useDismissProps);\n const hover = useHover(context, { enabled: false, ...props.useHoverProps });\n // Also returns `getReferenceProps` but unused as the reference element may\n // not even be managed by React, so we may be unable to set them. Seems like\n // `refs.setReferences` attaches most of the same listeners anyway, but\n // possible both are needed.\n const { getFloatingProps } = useInteractions([dismiss, hover]);\n\n const innerHTML = useRef<string>(\"\");\n const ref = useRef<HTMLDivElement>(null);\n const mergedRefs = useMergeRefs([ref, refs.setFloating]);\n\n useEffect(() => {\n if (props.reference) {\n if (\"element\" in props.reference) {\n refs.setReference(props.reference.element);\n }\n\n refs.setPositionReference({\n getBoundingClientRect: getMountedBoundingClientRectCache(\n props.reference,\n ),\n });\n }\n }, [props.reference, refs]);\n\n // Stores the last rendered `innerHTML` of the popover while it was open. The\n // `innerHTML` is used while the popover is closing, as the React children\n // may rerender during this time, causing unwanted behaviour.\n useEffect(\n () => {\n if (status === \"initial\" || status === \"open\") {\n if (ref.current?.innerHTML) {\n innerHTML.current = ref.current.innerHTML;\n }\n }\n },\n // `props.children` is added to the deps, since it's ultimately the HTML of\n // the children that we're storing.\n [status, props.reference, props.children],\n );\n\n if (!isMounted) {\n return false;\n }\n\n const mergedProps: HTMLAttributes<HTMLDivElement> = {\n ...props.elementProps,\n style: {\n display: \"flex\",\n ...props.elementProps?.style,\n zIndex: `calc(var(--bn-ui-base-z-index) + ${props.elementProps?.style?.zIndex || 0})`,\n ...floatingStyles,\n ...styles,\n },\n ...getFloatingProps(),\n };\n\n if (status === \"close\") {\n // While the popover is closing, shows its last rendered `innerHTML` while\n // it was open, instead of the React children. This is because they may\n // rerender during this time, causing unwanted behaviour.\n //\n // When we use the `GenericPopover` for BlockNote's internal UI elements\n // this isn't a huge deal, as we only pass child components if the popover\n // should be open. So without this fix, the popover just won't transition\n // out and will instead appear to hide instantly.\n return (\n <div\n ref={mergedRefs}\n {...mergedProps}\n dangerouslySetInnerHTML={{ __html: innerHTML.current }}\n />\n );\n }\n\n return (\n <div ref={mergedRefs} {...mergedProps}>\n {props.children}\n </div>\n );\n};\n","import { getNodeById } from \"@blocknote/core\";\nimport { ReactNode, useMemo } from \"react\";\n\nimport { useBlockNoteEditor } from \"../../hooks/useBlockNoteEditor.js\";\nimport { FloatingUIOptions } from \"./FloatingUIOptions.js\";\nimport { GenericPopover, GenericPopoverReference } from \"./GenericPopover.js\";\n\nexport const BlockPopover = (\n props: FloatingUIOptions & {\n blockId: string | undefined;\n children: ReactNode;\n },\n) => {\n const { blockId, children, ...floatingUIOptions } = props;\n\n const editor = useBlockNoteEditor<any, any, any>();\n\n const reference = useMemo<GenericPopoverReference | undefined>(\n () =>\n editor.transact((tr) => {\n if (!blockId) {\n return undefined;\n }\n\n // TODO use the location API for this\n const nodePosInfo = getNodeById(blockId, tr.doc);\n if (!nodePosInfo) {\n return undefined;\n }\n\n const { node } = editor.prosemirrorView.domAtPos(\n nodePosInfo.posBeforeNode + 1,\n );\n if (!(node instanceof Element)) {\n return undefined;\n }\n\n return {\n element: node,\n };\n }),\n [editor, blockId],\n );\n\n return (\n <GenericPopover reference={reference} {...floatingUIOptions}>\n {blockId !== undefined && children}\n </GenericPopover>\n );\n};\n","import {\n BlockNoteEditor,\n createStore,\n Extension,\n ExtensionFactory,\n} from \"@blocknote/core\";\nimport { useStore } from \"@tanstack/react-store\";\nimport { useBlockNoteEditor } from \"./useBlockNoteEditor.js\";\n\ntype Store<T> = ReturnType<typeof createStore<T>>;\n\n/**\n * Use an extension instance\n */\nexport function useExtension<\n const T extends ExtensionFactory | Extension | string,\n>(\n plugin: T,\n ctx?: { editor?: BlockNoteEditor<any, any, any> },\n): T extends ExtensionFactory\n ? NonNullable<ReturnType<ReturnType<T>>>\n : T extends string\n ? Extension\n : T extends Extension\n ? T\n : never {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const editor = ctx?.editor ?? useBlockNoteEditor();\n\n const instance = editor.getExtension(plugin as any);\n\n if (!instance) {\n throw new Error(\"Extension not found\", { cause: { plugin } });\n }\n\n return instance;\n}\n\ntype ExtractStore<T> = T extends Store<infer U> ? U : never;\n\n/**\n * Use the state of an extension\n */\nexport function useExtensionState<\n T extends ExtensionFactory | Extension,\n TExtension = T extends ExtensionFactory ? ReturnType<ReturnType<T>> : T,\n TStore = TExtension extends { store: Store<any> }\n ? TExtension[\"store\"]\n : never,\n TSelected = NoInfer<ExtractStore<TStore>>,\n>(\n plugin: T,\n ctx?: {\n editor?: BlockNoteEditor<any, any, any>;\n selector?: (state: NoInfer<ExtractStore<TStore>>) => TSelected;\n },\n): TSelected {\n const { store } = useExtension(plugin, ctx);\n if (!store) {\n throw new Error(\"Store not found on plugin\", { cause: { plugin } });\n }\n return useStore<ExtractStore<TStore>, TSelected>(store, ctx?.selector as any);\n}\n","import { FilePanelExtension } from \"@blocknote/core/extensions\";\nimport { flip, offset } from \"@floating-ui/react\";\nimport { FC, useMemo } from \"react\";\n\nimport { FilePanel } from \"./FilePanel.js\";\nimport { FilePanelProps } from \"./FilePanelProps.js\";\nimport { BlockPopover } from \"../Popovers/BlockPopover.js\";\nimport { FloatingUIOptions } from \"../Popovers/FloatingUIOptions.js\";\nimport { useExtension, useExtensionState } from \"../../hooks/useExtension.js\";\nimport { useBlockNoteEditor } from \"../../hooks/useBlockNoteEditor.js\";\n\nexport const FilePanelController = (props: {\n filePanel?: FC<FilePanelProps>;\n floatingUIOptions?: FloatingUIOptions;\n}) => {\n const editor = useBlockNoteEditor<any, any, any>();\n\n const filePanel = useExtension(FilePanelExtension);\n const blockId = useExtensionState(FilePanelExtension);\n\n const floatingUIOptions = useMemo<FloatingUIOptions>(\n () => ({\n useFloatingOptions: {\n open: !!blockId,\n // Needed as hooks like `useDismiss` call `onOpenChange` to change the\n // open state.\n onOpenChange: (open, _event, reason) => {\n if (!open) {\n filePanel.closeMenu();\n }\n\n if (reason === \"escape-key\") {\n editor.focus();\n }\n },\n middleware: [offset(10), flip()],\n },\n elementProps: {\n style: {\n zIndex: 90,\n },\n },\n ...props.floatingUIOptions,\n }),\n [blockId, editor, filePanel, props.floatingUIOptions],\n );\n\n const Component = props.filePanel || FilePanel;\n\n return (\n <BlockPopover blockId={blockId} {...floatingUIOptions}>\n {blockId && <Component blockId={blockId} />}\n </BlockPopover>\n );\n};\n","'use strict';\n\n// do not edit .js files directly - edit src/index.jst\n\n\n var envHasBigInt64Array = typeof BigInt64Array !== 'undefined';\n\n\nmodule.exports = function equal(a, b) {\n if (a === b) return true;\n\n if (a && b && typeof a == 'object' && typeof b == 'object') {\n if (a.constructor !== b.constructor) return false;\n\n var length, i, keys;\n if (Array.isArray(a)) {\n length = a.length;\n if (length != b.length) return false;\n for (i = length; i-- !== 0;)\n if (!equal(a[i], b[i])) return false;\n return true;\n }\n\n\n if ((a instanceof Map) && (b instanceof Map)) {\n if (a.size !== b.size) return false;\n for (i of a.entries())\n if (!b.has(i[0])) return false;\n for (i of a.entries())\n if (!equal(i[1], b.get(i[0]))) return false;\n return true;\n }\n\n if ((a instanceof Set) && (b instanceof Set)) {\n if (a.size !== b.size) return false;\n for (i of a.entries())\n if (!b.has(i[0])) return false;\n return true;\n }\n\n if (ArrayBuffer.isView(a) && ArrayBuffer.isView(b)) {\n length = a.length;\n if (length != b.length) return false;\n for (i = length; i-- !== 0;)\n if (a[i] !== b[i]) return false;\n return true;\n }\n\n\n if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;\n if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();\n if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();\n\n keys = Object.keys(a);\n length = keys.length;\n if (length !== Object.keys(b).length) return false;\n\n for (i = length; i-- !== 0;)\n if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;\n\n for (i = length; i-- !== 0;) {\n var key = keys[i];\n\n if (key === '_owner' && a.$$typeof) {\n // React-specific: avoid traversing React elements' _owner.\n // _owner contains circular references\n // and is not needed when comparing the actual elements (and not their owners)\n continue;\n }\n\n if (!equal(a[key], b[key])) return false;\n }\n\n return true;\n }\n\n // true if both NaN, false otherwise\n return a!==a && b!==b;\n};\n","/**\n * @license React\n * use-sync-external-store-shim.production.js\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\"use strict\";\nvar React = require(\"react\");\nfunction is(x, y) {\n return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);\n}\nvar objectIs = \"function\" === typeof Object.is ? Object.is : is,\n useState = React.useState,\n useEffect = React.useEffect,\n useLayoutEffect = React.useLayoutEffect,\n useDebugValue = React.useDebugValue;\nfunction useSyncExternalStore$2(subscribe, getSnapshot) {\n var value = getSnapshot(),\n _useState = useState({ inst: { value: value, getSnapshot: getSnapshot } }),\n inst = _useState[0].inst,\n forceUpdate = _useState[1];\n useLayoutEffect(\n function () {\n inst.value = value;\n inst.getSnapshot = getSnapshot;\n checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });\n },\n [subscribe, value, getSnapshot]\n );\n useEffect(\n function () {\n checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });\n return subscribe(function () {\n checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });\n });\n },\n [subscribe]\n );\n useDebugValue(value);\n return value;\n}\nfunction checkIfSnapshotChanged(inst) {\n var latestGetSnapshot = inst.getSnapshot;\n inst = inst.value;\n try {\n var nextValue = latestGetSnapshot();\n return !objectIs(inst, nextValue);\n } catch (error) {\n return !0;\n }\n}\nfunction useSyncExternalStore$1(subscribe, getSnapshot) {\n return getSnapshot();\n}\nvar shim =\n \"undefined\" === typeof window ||\n \"undefined\" === typeof window.document ||\n \"undefined\" === typeof window.document.createElement\n ? useSyncExternalStore$1\n : useSyncExternalStore$2;\nexports.useSyncExternalStore =\n void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;\n","/**\n * @license React\n * use-sync-external-store-shim.development.js\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\"use strict\";\n\"production\" !== process.env.NODE_ENV &&\n (function () {\n function is(x, y) {\n return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);\n }\n function useSyncExternalStore$2(subscribe, getSnapshot) {\n didWarnOld18Alpha ||\n void 0 === React.startTransition ||\n ((didWarnOld18Alpha = !0),\n console.error(\n \"You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release.\"\n ));\n var value = getSnapshot();\n if (!didWarnUncachedGetSnapshot) {\n var cachedValue = getSnapshot();\n objectIs(value, cachedValue) ||\n (console.error(\n \"The result of getSnapshot should be cached to avoid an infinite loop\"\n ),\n (didWarnUncachedGetSnapshot = !0));\n }\n cachedValue = useState({\n inst: { value: value, getSnapshot: getSnapshot }\n });\n var inst = cachedValue[0].inst,\n forceUpdate = cachedValue[1];\n useLayoutEffect(\n function () {\n inst.value = value;\n inst.getSnapshot = getSnapshot;\n checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });\n },\n [subscribe, value, getSnapshot]\n );\n useEffect(\n function () {\n checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });\n return subscribe(function () {\n checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });\n });\n },\n [subscribe]\n );\n useDebugValue(value);\n return value;\n }\n function checkIfSnapshotChanged(inst) {\n var latestGetSnapshot = inst.getSnapshot;\n inst = inst.value;\n try {\n var nextValue = latestGetSnapshot();\n return !objectIs(inst, nextValue);\n } catch (error) {\n return !0;\n }\n }\n function useSyncExternalStore$1(subscribe, getSnapshot) {\n return getSnapshot();\n }\n \"undefined\" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&\n \"function\" ===\n typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart &&\n __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());\n var React = require(\"react\"),\n objectIs = \"function\" === typeof Object.is ? Object.is : is,\n useState = React.useState,\n useEffect = React.useEffect,\n useLayoutEffect = React.useLayoutEffect,\n useDebugValue = React.useDebugValue,\n didWarnOld18Alpha = !1,\n didWarnUncachedGetSnapshot = !1,\n shim =\n \"undefined\" === typeof window ||\n \"undefined\" === typeof window.document ||\n \"undefined\" === typeof window.document.createElement\n ? useSyncExternalStore$1\n : useSyncExternalStore$2;\n exports.useSyncExternalStore =\n void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;\n \"undefined\" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&\n \"function\" ===\n typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&\n __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());\n })();\n","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n module.exports = require('../cjs/use-sync-external-store-shim.production.js');\n} else {\n module.exports = require('../cjs/use-sync-external-store-shim.development.js');\n}\n","/**\n * @license React\n * use-sync-external-store-shim/with-selector.production.js\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\"use strict\";\nvar React = require(\"react\"),\n shim = require(\"use-sync-external-store/shim\");\nfunction is(x, y) {\n return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);\n}\nvar objectIs = \"function\" === typeof Object.is ? Object.is : is,\n useSyncExternalStore = shim.useSyncExternalStore,\n useRef = React.useRef,\n useEffect = React.useEffect,\n useMemo = React.useMemo,\n useDebugValue = React.useDebugValue;\nexports.useSyncExternalStoreWithSelector = function (\n subscribe,\n getSnapshot,\n getServerSnapshot,\n selector,\n isEqual\n) {\n var instRef = useRef(null);\n if (null === instRef.current) {\n var inst = { hasValue: !1, value: null };\n instRef.current = inst;\n } else inst = instRef.current;\n instRef = useMemo(\n function () {\n function memoizedSelector(nextSnapshot) {\n if (!hasMemo) {\n hasMemo = !0;\n memoizedSnapshot = nextSnapshot;\n nextSnapshot = selector(nextSnapshot);\n if (void 0 !== isEqual && inst.hasValue) {\n var currentSelection = inst.value;\n if (isEqual(currentSelection, nextSnapshot))\n return (memoizedSelection = currentSelection);\n }\n return (memoizedSelection = nextSnapshot);\n }\n currentSelection = memoizedSelection;\n if (objectIs(memoizedSnapshot, nextSnapshot)) return currentSelection;\n var nextSelection = selector(nextSnapshot);\n if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))\n return (memoizedSnapshot = nextSnapshot), currentSelection;\n memoizedSnapshot = nextSnapshot;\n return (memoizedSelection = nextSelection);\n }\n var hasMemo = !1,\n memoizedSnapshot,\n memoizedSelection,\n may