@blocknote/react
Version:
A "Notion-style" block-based extensible text editor built on top of Prosemirror and Tiptap.
1 lines • 9.49 MB
Source Map (JSON)
{"version":3,"file":"blocknote-react.cjs","sources":["../src/editor/BlockNoteContext.ts","../src/hooks/useBlockNoteEditor.ts","../src/hooks/useEditorSelectionChange.ts","../src/hooks/useEditorSelectionBoundingBox.ts","../src/hooks/useUIElementPositioning.ts","../src/hooks/useUIPluginState.ts","../src/editor/ComponentsContext.tsx","../src/hooks/useCreateBlockNote.tsx","../src/i18n/dictionary.ts","../src/hooks/useEditorChange.ts","../src/components/Comments/CommentEditor.tsx","../src/components/Comments/schema.ts","../src/components/Comments/FloatingComposer.tsx","../src/components/Comments/FloatingComposerController.tsx","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.1.0/node_modules/react-icons/lib/iconContext.mjs","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.1.0/node_modules/react-icons/lib/iconBase.mjs","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.1.0/node_modules/react-icons/ri/index.mjs","../src/components/Comments/EmojiMartPicker.tsx","../src/components/Comments/EmojiPicker.tsx","../src/components/Comments/useUsers.ts","../src/components/Comments/ReactionBadge.tsx","../src/components/Comments/Comment.tsx","../src/components/Comments/Comments.tsx","../src/components/Comments/Thread.tsx","../src/components/Comments/useThreads.ts","../src/components/Comments/FloatingThreadController.tsx","../src/components/FilePanel/DefaultTabs/EmbedTab.tsx","../src/components/FilePanel/DefaultTabs/UploadTab.tsx","../src/components/FilePanel/FilePanel.tsx","../src/components/FilePanel/FilePanelController.tsx","../../../node_modules/.pnpm/@floating-ui+react@0.26.28_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/@floating-ui/react/dist/floating-ui.react.utils.mjs","../src/hooks/useEditorContentOrSelectionChange.ts","../src/util/mergeRefs.ts","../src/hooks/useSelectedBlocks.ts","../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.1.0/node_modules/react-icons/ai/index.mjs","../src/components/SideMenu/DefaultButtons/AddBlockButton.tsx","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.1.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/hooks/useExtendButtonsPositioning.ts","../src/components/TableHandles/hooks/useTableHandlesPositioning.ts","../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/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/FileBlockContent/useResolveUrl.tsx","../src/blocks/FileBlockContent/helpers/toExternalHTML/FigureWithCaption.tsx","../src/hooks/useOnUploadEnd.ts","../src/hooks/useOnUploadStart.ts","../src/hooks/useUploadLoading.ts","../src/blocks/FileBlockContent/helpers/render/AddFileButton.tsx","../src/blocks/FileBlockContent/helpers/render/FileNameWithIcon.tsx","../src/blocks/FileBlockContent/helpers/render/FileBlockWrapper.tsx","../src/blocks/FileBlockContent/helpers/toExternalHTML/LinkWithCaption.tsx","../src/blocks/AudioBlockContent/AudioBlockContent.tsx","../src/blocks/FileBlockContent/FileBlockContent.tsx","../src/blocks/FileBlockContent/helpers/render/ResizableFileBlockWrapper.tsx","../src/blocks/ImageBlockContent/ImageBlockContent.tsx","../../../node_modules/.pnpm/react-icons@5.5.0_react@19.1.0/node_modules/react-icons/tb/index.mjs","../src/blocks/PageBreakBlockContent/getPageBreakReactSlashMenuItems.tsx","../src/blocks/VideoBlockContent/VideoBlockContent.tsx","../src/blocks/ToggleWrapper/ToggleWrapper.tsx","../src/components/FormattingToolbar/ExperimentalMobileFormattingToolbarController.tsx","../src/components/Comments/ThreadsSidebar.tsx","../src/hooks/useActiveStyles.ts","../src/hooks/useEditorForceUpdate.tsx","../src/hooks/useFocusWithin.ts","../src/schema/ReactInlineContentSpec.tsx","../src/schema/markviews/CoreMarkView.ts","../src/schema/markviews/ReactMarkViewRenderer.tsx","../src/schema/ReactStyleSpec.tsx","../src/util/elementOverflow.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 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 type { BlockNoteEditor } from \"@blocknote/core\";\nimport { useEffect } from \"react\";\nimport { useBlockNoteContext } from \"../editor/BlockNoteContext.js\";\n\nexport function useEditorSelectionChange(\n callback: () => void,\n editor?: BlockNoteEditor<any, any, any>,\n includeSelectionChangedByRemote?: boolean,\n) {\n const editorContext = useBlockNoteContext();\n if (!editor) {\n editor = editorContext?.editor;\n }\n\n useEffect(() => {\n if (!editor) {\n throw new Error(\n \"'editor' is required, either from BlockNoteContext or as a function argument\",\n );\n }\n return editor.onSelectionChange(callback, includeSelectionChangedByRemote);\n }, [callback, editor, includeSelectionChangedByRemote]);\n}\n","import type { BlockNoteEditor } from \"@blocknote/core\";\nimport { useCallback, useEffect, useState } from \"react\";\nimport { useBlockNoteEditor } from \"./useBlockNoteEditor.js\";\nimport { useEditorSelectionChange } from \"./useEditorSelectionChange.js\";\n\nexport function useEditorSelectionBoundingBox(\n enabled?: boolean,\n editor?: BlockNoteEditor<any, any, any>,\n) {\n const ctxEditor = useBlockNoteEditor();\n editor = editor || ctxEditor;\n\n const [boundingBox, setBoundingBox] = useState(() => {\n if (!enabled) {\n return undefined;\n }\n\n return editor.getSelectionBoundingBox();\n });\n\n const cb = useCallback(() => {\n if (!enabled) {\n return;\n }\n\n const selection = editor.getSelectionBoundingBox();\n\n setBoundingBox(selection);\n }, [editor, enabled]);\n\n useEditorSelectionChange(cb, editor, true);\n\n // initial value when `enabled` changes\n useEffect(() => {\n if (!enabled) {\n setBoundingBox(undefined);\n } else {\n setBoundingBox(editor.getSelectionBoundingBox());\n }\n }, [enabled, editor]);\n\n return boundingBox;\n}\n","import {\n useDismiss,\n UseDismissProps,\n useFloating,\n UseFloatingOptions,\n useInteractions,\n useTransitionStyles,\n VirtualElement,\n} from \"@floating-ui/react\";\nimport { useEffect, useMemo } from \"react\";\n\ntype ReferencePos = DOMRect | HTMLElement | VirtualElement | null;\n\nfunction isVirtualElement(element: ReferencePos): element is VirtualElement {\n return (element as VirtualElement).getBoundingClientRect !== undefined;\n}\n\ntype UIElementPosition = {\n isMounted: boolean;\n ref: (node: HTMLElement | null) => void;\n style: React.CSSProperties;\n getFloatingProps: ReturnType<typeof useInteractions>[\"getFloatingProps\"];\n getReferenceProps: ReturnType<typeof useInteractions>[\"getReferenceProps\"];\n setReference: ReturnType<typeof useFloating>[\"refs\"][\"setReference\"];\n isPositioned: boolean;\n};\n\nexport function useUIElementPositioning(\n show: boolean,\n referencePos: DOMRect | HTMLElement | VirtualElement | null,\n zIndex: number,\n options?: Partial<\n UseFloatingOptions & { canDismiss: boolean | UseDismissProps }\n >,\n): UIElementPosition {\n const { refs, update, context, floatingStyles, isPositioned } = useFloating({\n open: show,\n ...options,\n });\n const { isMounted, styles } = useTransitionStyles(context);\n\n const dismissOptions =\n typeof options?.canDismiss === \"object\"\n ? options.canDismiss\n : {\n enabled: options?.canDismiss,\n };\n // handle \"escape\" and other dismiss events, these will add some listeners to\n // getFloatingProps which need to be attached to the floating element\n const dismiss = useDismiss(context, dismissOptions);\n\n const { getReferenceProps, getFloatingProps } = useInteractions([dismiss]);\n\n useEffect(() => {\n update();\n }, [referencePos, update]);\n\n useEffect(() => {\n // Will be null on initial render when used in UI component controllers.\n if (referencePos === null) {\n return;\n }\n\n if (referencePos instanceof HTMLElement) {\n refs.setReference(referencePos);\n } else if (isVirtualElement(referencePos)) {\n refs.setReference(referencePos);\n } else {\n refs.setReference({\n getBoundingClientRect: () => referencePos,\n });\n }\n }, [referencePos, refs]);\n\n return useMemo(() => {\n return {\n isMounted,\n ref: refs.setFloating,\n setReference: refs.setReference,\n style: {\n display: \"flex\",\n ...styles,\n ...floatingStyles,\n zIndex: zIndex,\n },\n getFloatingProps,\n getReferenceProps,\n isPositioned,\n };\n }, [\n isPositioned,\n floatingStyles,\n isMounted,\n refs.setFloating,\n refs.setReference,\n styles,\n zIndex,\n getFloatingProps,\n getReferenceProps,\n ]);\n}\n","import { useEffect, useState } from \"react\";\n\nexport function useUIPluginState<State>(\n onUpdate: (callback: (state: State) => void) => void,\n): State | undefined {\n const [state, setState] = useState<State>();\n\n useEffect(() => {\n return onUpdate((state) => {\n setState({ ...state });\n });\n }, [onUpdate]);\n\n return state;\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 };\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 opened?: boolean;\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 BlockNoteEditorOptions,\n BlockSchema,\n DefaultBlockSchema,\n DefaultInlineContentSchema,\n DefaultStyleSchema,\n InlineContentSchema,\n StyleSchema,\n} from \"@blocknote/core\";\nimport { DependencyList, useMemo } from \"react\";\n\n/**\n * Main hook for importing a BlockNote editor into a React project\n *\n * TODO: document in docs\n */\nexport const useCreateBlockNote = <\n BSchema extends BlockSchema = DefaultBlockSchema,\n ISchema extends InlineContentSchema = DefaultInlineContentSchema,\n SSchema extends StyleSchema = DefaultStyleSchema,\n>(\n options: Partial<BlockNoteEditorOptions<BSchema, ISchema, SSchema>> = {},\n deps: DependencyList = [],\n) => {\n return useMemo(() => {\n const editor = BlockNoteEditor.create<BSchema, ISchema, SSchema>(options);\n if (window) {\n // for testing / dev purposes\n (window as any).ProseMirror = editor._tiptapEditor;\n }\n return editor;\n }, deps); //eslint-disable-line react-hooks/exhaustive-deps\n};\n\n/**\n * @deprecated use useCreateBlockNote instead\n */\nexport const useBlockNote = useCreateBlockNote;\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 type { BlockNoteEditor } from \"@blocknote/core\";\nimport { useEffect } from \"react\";\nimport { useBlockNoteContext } from \"../editor/BlockNoteContext.js\";\n\nexport function useEditorChange(\n callback: Parameters<BlockNoteEditor<any, any, any>[\"onChange\"]>[0],\n editor?: BlockNoteEditor<any, any, any>,\n) {\n const editorContext = useBlockNoteContext();\n if (!editor) {\n editor = editorContext?.editor;\n }\n\n useEffect(() => {\n if (!editor) {\n throw new Error(\n \"'editor' is required, either from BlockNoteContext or as a function argument\",\n );\n }\n\n return editor.onChange(callback);\n }, [callback, editor]);\n}\n","import { BlockNoteEditor } from \"@blocknote/core\";\nimport { FC, useCallback, useEffect, useState } from \"react\";\nimport { useComponentsContext } from \"../../editor/ComponentsContext.js\";\nimport { useEditorChange } from \"../../hooks/useEditorChange.js\";\nimport { schema } from \"./schema.js\";\n\n/**\n * The CommentEditor component displays an editor for creating or editing a comment.\n * Currently, we also use the non-editable version for displaying a comment.\n *\n * It's used:\n * - to create a new comment (FloatingComposer.tsx)\n * - As the last item in a Thread, to compose a reply (Thread.tsx)\n * - To edit or display an existing comment (Comment.tsx)\n *\n */\nexport const CommentEditor = (props: {\n autoFocus?: boolean;\n editable: boolean;\n actions?: FC<{\n isFocused: boolean;\n isEmpty: boolean;\n }>;\n editor: BlockNoteEditor<\n typeof schema.blockSchema,\n typeof schema.inlineContentSchema,\n typeof schema.styleSchema\n >;\n}) => {\n const [isFocused, setIsFocused] = useState(false);\n const [isEmpty, setIsEmpty] = useState(props.editor.isEmpty);\n\n const components = useComponentsContext()!;\n\n useEditorChange(() => {\n setIsEmpty(props.editor.isEmpty);\n }, props.editor);\n\n const onFocus = useCallback(() => {\n setIsFocused(true);\n }, []);\n\n const onBlur = useCallback(() => {\n setIsFocused(false);\n }, []);\n\n // When we click the edit button on a comment, we also want to focus the\n // comment editor\n useEffect(() => {\n if (props.editable && props.autoFocus) {\n props.editor.focus();\n }\n }, [props.autoFocus, props.editable, props.editor]);\n\n return (\n <>\n <components.Comments.Editor\n autoFocus={props.autoFocus}\n className=\"bn-comment-editor\"\n editor={props.editor}\n onFocus={onFocus}\n onBlur={onBlur}\n editable={props.editable}\n />\n {props.actions && (\n <div className={\"bn-comment-actions-wrapper\"}>\n <props.actions isFocused={isFocused} isEmpty={isEmpty} />\n </div>\n )}\n </>\n );\n};\n","import {\n BlockNoteSchema,\n createBlockSpecFromStronglyTypedTiptapNode,\n createStronglyTypedTiptapNode,\n defaultBlockSpecs,\n defaultStyleSpecs,\n} from \"@blocknote/core\";\n\n// this is quite convoluted. we'll clean this up when we make\n// it easier to extend / customize the default blocks\nconst paragraph = createBlockSpecFromStronglyTypedTiptapNode(\n createStronglyTypedTiptapNode<\"paragraph\", \"inline*\">(\n defaultBlockSpecs.paragraph.implementation.node.config as any,\n ),\n // disable default props on paragraph (such as textalignment and colors)\n {},\n);\n\n// remove textColor, backgroundColor from styleSpecs\nconst { textColor, backgroundColor, ...styleSpecs } = defaultStyleSpecs;\n\n// the schema to use for comments\nexport const schema = BlockNoteSchema.create({\n blockSpecs: {\n paragraph,\n },\n styleSpecs,\n});\n","import { mergeCSSClasses } from \"@blocknote/core\";\n\nimport { useComponentsContext } from \"../../editor/ComponentsContext.js\";\nimport { useBlockNoteEditor } from \"../../hooks/useBlockNoteEditor.js\";\nimport { useCreateBlockNote } from \"../../hooks/useCreateBlockNote.js\";\nimport { useDictionary } from \"../../i18n/dictionary.js\";\nimport { CommentEditor } from \"./CommentEditor.js\";\nimport { schema } from \"./schema.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 editor = useBlockNoteEditor();\n\n if (!editor.comments) {\n throw new Error(\"Comments plugin not found\");\n }\n\n const comments = editor.comments;\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,\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 { UseFloatingOptions, flip, offset, shift } from \"@floating-ui/react\";\nimport { ComponentProps, FC, useEffect } from \"react\";\n\nimport { useBlockNoteEditor } from \"../../hooks/useBlockNoteEditor.js\";\nimport { useEditorSelectionBoundingBox } from \"../../hooks/useEditorSelectionBoundingBox.js\";\nimport { useUIElementPositioning } from \"../../hooks/useUIElementPositioning.js\";\nimport { useUIPluginState } from \"../../hooks/useUIPluginState.js\";\nimport { FloatingComposer } from \"./FloatingComposer.js\";\n\nexport const 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 floatingOptions?: Partial<UseFloatingOptions>;\n}) => {\n const editor = useBlockNoteEditor<B, I, S>();\n\n if (!editor.comments) {\n throw new Error(\n \"FloatingComposerController can only be used when BlockNote editor has enabled comments\",\n );\n }\n\n const comments = editor.comments;\n useEffect(() => {\n const offUpdate = comments.onUpdate((state) =>\n editor.setForceSelectionVisible(state.pendingComment),\n );\n\n return () => offUpdate();\n }, [comments, editor]);\n\n const state = useUIPluginState(comments.onUpdate.bind(comments));\n\n // the reference position is updated automatically when the selection moves,\n // this can happen when the document is updated by a remote user\n const referencePos = useEditorSelectionBoundingBox(state?.pendingComment);\n\n const { isMounted, ref, style, getFloatingProps } = useUIElementPositioning(\n state?.pendingComment || false,\n referencePos || null,\n 5000,\n {\n placement: \"bottom\",\n middleware: [offset(10), shift(), flip()],\n onOpenChange: (open) => {\n if (!open) {\n comments.stopPendingComment();\n editor.focus();\n }\n },\n ...props.floatingOptions,\n },\n );\n\n if (!isMounted || !state) {\n return null;\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 <div ref={ref} style={style} {...getFloatingProps()}>\n <Component />\n </div>\n );\n};\n","import React from \"react\";\nexport var DefaultContext = {\n color: undefined,\n size: undefined,\n className: undefined,\n style: undefined,\n attr: undefined\n};\nexport var IconContext = React.createContext && /*#__PURE__*/React.createContext(DefaultContext);","var _excluded = [\"attr\", \"size\", \"title\"];\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == typeof i ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != typeof i) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nimport React from \"react\";\nimport { IconContext, DefaultContext } from \"./iconContext.mjs\";\nfunction Tree2Element(tree) {\n return tree && tree.map((node, i) => /*#__PURE__*/React.createElement(node.tag, _objectSpread({\n key: i\n }, node.attr), Tree2Element(node.child)));\n}\nexport function GenIcon(data) {\n return props => /*#__PURE__*/React.createElement(IconBase, _extends({\n attr: _objectSpread({}, data.attr)\n }, props), Tree2Element(data.child));\n}\nexport function IconBase(props) {\n var elem = conf => {\n var {\n attr,\n size,\n title\n } = props,\n svgProps = _objectWithoutProperties(props, _excluded);\n var computedSize = size || conf.size || \"1em\";\n var className;\n if (conf.className) className = conf.className;\n if (props.className) className = (className ? className + \" \" : \"\") + props.className;\n return /*#__PURE__*/React.createElement(\"svg\", _extends({\n stroke: \"currentColor\",\n fill: \"currentColor\",\n strokeWidth: \"0\"\n }, conf.attr, attr, svgProps, {\n className: className,\n style: _objectSpread(_objectSpread({\n color: props.color || conf.color\n }, conf.style), props.style),\n height: computedSize,\n width: computedSize,\n xmlns: \"http://www.w3.org/2000/svg\"\n }), title && /*#__PURE__*/React.createElement(\"title\", null, title), props.children);\n };\n return IconContext !== undefined ? /*#__PURE__*/React.createElement(IconContext.Consumer, null, conf => elem(conf)) : elem(DefaultContext);\n}","// THIS FILE IS AUTO GENERATED\nimport { GenIcon } from '../lib/index.mjs';\nexport function RiArrowDownBoxFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M4 3C3.44772 3 3 3.44772 3 4V20C3 20.5523 3.44772 21 4 21H20C20.5523 21 21 20.5523 21 20V4C21 3.44772 20.5523 3 20 3H4ZM11.9996 17.656L6.0498 11.7062H10.9996V6.34229H12.9996V11.7062H17.9493L11.9996 17.656Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownBoxLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M20 3H4C3.44772 3 3 3.44772 3 4V20C3 20.5523 3.44772 21 4 21H20C20.5523 21 21 20.5523 21 20V4C21 3.44772 20.5523 3 20 3ZM5 19V5H19V19H5ZM11.0005 6.34375V13.829L7.75789 10.5864L6.34367 12.0006L12.0005 17.6575L17.6574 12.0006L16.2432 10.5864L13.0005 13.829V6.34375H11.0005Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownCircleFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 2C17.52 2 22 6.48 22 12C22 17.52 17.52 22 12 22C6.48 22 2 17.52 2 12C2 6.48 6.48 2 12 2ZM13 12V8H11V12H8L12 16L16 12H13Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownCircleLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 2C17.52 2 22 6.48 22 12C22 17.52 17.52 22 12 22C6.48 22 2 17.52 2 12C2 6.48 6.48 2 12 2ZM12 20C16.42 20 20 16.42 20 12C20 7.58 16.42 4 12 4C7.58 4 4 7.58 4 12C4 16.42 7.58 20 12 20ZM13 12H16L12 16L8 12H11V8H13V12Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownDoubleFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 19.1642L18.2071 12.9571L16.7929 11.5429L12 16.3358L7.20712 11.5429L5.79291 12.9571L12 19.1642ZM12 13.5143L18.2071 7.30722L16.7929 5.89301L12 10.6859L7.20712 5.89301L5.79291 7.30722L12 13.5143Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownDoubleLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 19.1642L18.2071 12.9571L16.7929 11.5429L12 16.3358L7.20712 11.5429L5.79291 12.9571L12 19.1642ZM12 13.5143L18.2071 7.30722L16.7929 5.89301L12 10.6859L7.20712 5.89301L5.79291 7.30722L12 13.5143Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M13 12H20L12 20L4 12H11V4H13V12Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M13.0001 16.1716L18.3641 10.8076L19.7783 12.2218L12.0001 20L4.22192 12.2218L5.63614 10.8076L11.0001 16.1716V4H13.0001V16.1716Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownSFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 16L6 10H18L12 16Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownSLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownWideFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 15.6315L20.9679 10.8838L20.0321 9.11619L12 13.3685L3.96788 9.11619L3.0321 10.8838L12 15.6315Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDownWideLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 15.6315L20.9679 10.8838L20.0321 9.11619L12 13.3685L3.96788 9.11619L3.0321 10.8838L12 15.6315Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDropDownFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 14L8 10H16L12 14Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDropDownLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 15.0006L7.75732 10.758L9.17154 9.34375L12 12.1722L14.8284 9.34375L16.2426 10.758L12 15.0006Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDropLeftFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M9 12L13 8V16L9 12Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDropLeftLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M11.8284 12.0005L14.6569 14.8289L13.2426 16.2431L9 12.0005L13.2426 7.75781L14.6569 9.17203L11.8284 12.0005Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDropRightFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M14 12L10 16V8L14 12Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDropRightLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12.1717 12.0005L9.34326 9.17203L10.7575 7.75781L15.0001 12.0005L10.7575 16.2431L9.34326 14.8289L12.1717 12.0005Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDropUpFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 10L16 14H8L12 10Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowDropUpLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 11.8284L9.17154 14.6569L7.75732 13.2426L12 9L16.2426 13.2426L14.8284 14.6569L12 11.8284Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowGoBackFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M8 7V11L2 6L8 1V5H13C17.4183 5 21 8.58172 21 13C21 17.4183 17.4183 21 13 21H4V19H13C16.3137 19 19 16.3137 19 13C19 9.68629 16.3137 7 13 7H8Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowGoBackLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M5.82843 6.99955L8.36396 9.53509L6.94975 10.9493L2 5.99955L6.94975 1.0498L8.36396 2.46402L5.82843 4.99955H13C17.4183 4.99955 21 8.58127 21 12.9996C21 17.4178 17.4183 20.9996 13 20.9996H4V18.9996H13C16.3137 18.9996 19 16.3133 19 12.9996C19 9.68584 16.3137 6.99955 13 6.99955H5.82843Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowGoForwardFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M16 7H11C7.68629 7 5 9.68629 5 13C5 16.3137 7.68629 19 11 19H20V21H11C6.58172 21 3 17.4183 3 13C3 8.58172 6.58172 5 11 5H16V1L22 6L16 11V7Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowGoForwardLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M18.1716 6.99955H11C7.68629 6.99955 5 9.68584 5 12.9996C5 16.3133 7.68629 18.9996 11 18.9996H20V20.9996H11C6.58172 20.9996 3 17.4178 3 12.9996C3 8.58127 6.58172 4.99955 11 4.99955H18.1716L15.636 2.46402L17.0503 1.0498L22 5.99955L17.0503 10.9493L15.636 9.53509L18.1716 6.99955Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowLeftBoxFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M4 3C3.44772 3 3 3.44772 3 4V20C3 20.5523 3.44772 21 4 21H20C20.5523 21 21 20.5523 21 20V4C21 3.44772 20.5523 3 20 3H4ZM6.34277 11.9996L12.2925 6.0498V10.9996H17.6565V12.9996H12.2925V17.9493L6.34277 11.9996Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowLeftBoxLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M20 3H4C3.44772 3 3 3.44772 3 4V20C3 20.5523 3.44772 21 4 21H20C20.5523 21 21 20.5523 21 20V4C21 3.44772 20.5523 3 20 3ZM5 19V5H19V19H5ZM6.3436 12.001L12.0005 6.34412L13.4147 7.75834L10.172 11.001H17.6573V13.001H10.172L13.4147 16.2436L12.0005 17.6578L6.3436 12.001Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowLeftCircleFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 2C17.52 2 22 6.48 22 12C22 17.52 17.52 22 12 22C6.48 22 2 17.52 2 12C2 6.48 6.48 2 12 2ZM12 11V8L8 12L12 16V13H16V11H12Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowLeftCircleLine (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M12 2C17.52 2 22 6.48 22 12C22 17.52 17.52 22 12 22C6.48 22 2 17.52 2 12C2 6.48 6.48 2 12 2ZM12 20C16.42 20 20 16.42 20 12C20 7.58 16.42 4 12 4C7.58 4 4 7.58 4 12C4 16.42 7.58 20 12 20ZM12 11H16V13H12V16L8 12L12 8V11Z\"},\"child\":[]}]})(props);\n};\nexport function RiArrowLeftDoubleFill (props) {\n return GenIcon({\"tag\":\"svg\",\"attr\":{\"viewBox\":\"0 0 24 24\",\"fill\":\"currentColor\"},\"child\":[{\"tag\":\"path\",\"attr\":{\"d\":\"M4.83582 12L11.0429 18.2071L12.4571 16.7929L7.66424 12L12.4571 7.20712L11.0429 5.79291L4.83582 12ZM10.4857 12L16.6928 18.2071L18.107 16.7929L13.3141 12L18.107 7.20712L16.6928 5.79291L10.4857 12Z\"},\"child\":[]