payload-richtext-tiptap 0.0.157 → 0.0.158
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/fields/TiptapEditor/features/menus/TextMenu/TextMenu.d.ts.map +1 -1
- package/dist/src/fields/TiptapEditor/features/menus/TextMenu/TextMenu.js +16 -5
- package/dist/src/fields/TiptapEditor/features/menus/TextMenu/TextMenu.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextMenu.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/features/menus/TextMenu/TextMenu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,MAAM,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"TextMenu.d.ts","sourceRoot":"","sources":["../../../../../../../src/fields/TiptapEditor/features/menus/TextMenu/TextMenu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,MAAM,EAAE,MAAM,eAAe,CAAC;AA0CnD,MAAM,MAAM,aAAa,GAAG;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,GAAG,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,QAAQ,oBAAqB,aAAa,gCA2NtD,CAAC"}
|
|
@@ -29,18 +29,23 @@ export const TextMenu = ({ editor, dir })=>{
|
|
|
29
29
|
const [openAi, setOpenAi] = useState(false);
|
|
30
30
|
return /*#__PURE__*/ _jsx(BubbleMenu, {
|
|
31
31
|
tippyOptions: {
|
|
32
|
-
placement: "
|
|
33
|
-
popperOptions: {
|
|
34
|
-
placement: "auto"
|
|
35
|
-
},
|
|
32
|
+
placement: "top-start",
|
|
36
33
|
onHide: ()=>{
|
|
37
34
|
setOpenAi(false);
|
|
35
|
+
},
|
|
36
|
+
popperOptions: {
|
|
37
|
+
modifiers: [
|
|
38
|
+
{
|
|
39
|
+
name: "flip",
|
|
40
|
+
enabled: false
|
|
41
|
+
}
|
|
42
|
+
]
|
|
38
43
|
}
|
|
39
44
|
},
|
|
40
45
|
editor: editor,
|
|
41
46
|
pluginKey: "textMenu",
|
|
42
47
|
shouldShow: states.shouldShow,
|
|
43
|
-
updateDelay:
|
|
48
|
+
updateDelay: 200,
|
|
44
49
|
children: openAi ? /*#__PURE__*/ _jsx(AIEditorPanel, {
|
|
45
50
|
editor: editor,
|
|
46
51
|
onOpenChange: (value)=>{
|
|
@@ -48,6 +53,12 @@ export const TextMenu = ({ editor, dir })=>{
|
|
|
48
53
|
}
|
|
49
54
|
}) : /*#__PURE__*/ _jsxs(Toolbar.Wrapper, {
|
|
50
55
|
children: [
|
|
56
|
+
/*#__PURE__*/ _jsx(Toolbar.Button, {
|
|
57
|
+
className: "text-purple-500 hover:text-purple-600 active:text-purple-600 dark:text-purple-400 dark:hover:text-purple-300 dark:active:text-purple-400",
|
|
58
|
+
activeClassname: "text-purple-600 hover:text-purple-600 dark:text-purple-400 dark:hover:text-purple-200",
|
|
59
|
+
onClick: ()=>setOpenAi(true),
|
|
60
|
+
children: "1"
|
|
61
|
+
}),
|
|
51
62
|
/*#__PURE__*/ _jsxs(Toolbar.Button, {
|
|
52
63
|
className: "text-purple-500 hover:text-purple-600 active:text-purple-600 dark:text-purple-400 dark:hover:text-purple-300 dark:active:text-purple-400",
|
|
53
64
|
activeClassname: "text-purple-600 hover:text-purple-600 dark:text-purple-400 dark:hover:text-purple-200",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/features/menus/TextMenu/TextMenu.tsx"],"sourcesContent":["import * as Popover from \"@radix-ui/react-popover\";\r\nimport { BubbleMenu, Editor } from \"@tiptap/react\";\r\nimport {\r\n AlignCenter,\r\n AlignJustify,\r\n AlignLeft,\r\n AlignRight,\r\n Bold,\r\n Highlighter,\r\n Italic,\r\n MoveVertical,\r\n Palette,\r\n RemoveFormatting,\r\n Sparkles,\r\n Strikethrough,\r\n Subscript,\r\n Superscript,\r\n Underline,\r\n} from \"lucide-react\";\r\nimport { memo, useState } from \"react\";\r\nimport { AIEditorPanel } from \"../../panels/AIEditorPanel/AIEditorPanel.js\";\r\nimport { ColorPicker } from \"../../panels/index.js\";\r\nimport { Icon } from \"../../ui/Icon.js\";\r\nimport { Surface } from \"../../ui/Surface.js\";\r\nimport { Toolbar } from \"../../ui/Toolbar.js\";\r\nimport { ContentTypePicker } from \"./components/ContentTypePicker.js\";\r\nimport { EditLinkPopover } from \"./components/EditLinkPopover.js\";\r\n// import { FontFamilyPicker } from \"./components/FontFamilyPicker.js\";\r\nimport { FontSizePicker } from \"./components/FontSizePicker.js\";\r\nimport { useTextmenuCommands } from \"./hooks/useTextmenuCommands.js\";\r\nimport { useTextmenuContentTypes } from \"./hooks/useTextmenuContentTypes.js\";\r\nimport { useTextmenuStates } from \"./hooks/useTextmenuStates.js\";\r\nimport i18next from \"i18next\";\r\n\r\n// We memorize the button so each button is not rerendered\r\n// on every editor state change\r\nconst MemoButton = memo(Toolbar.Button);\r\nconst MemoColorPicker = memo(ColorPicker);\r\n// const MemoFontFamilyPicker = memo(FontFamilyPicker);\r\nconst MemoFontSizePicker = memo(FontSizePicker);\r\nconst MemoContentTypePicker = memo(ContentTypePicker);\r\n\r\nexport type TextMenuProps = {\r\n editor: Editor;\r\n dir: \"rtl\" | \"ltr\" | \"auto\";\r\n};\r\n\r\nexport const TextMenu = ({ editor, dir }: TextMenuProps) => {\r\n const commands = useTextmenuCommands(editor);\r\n const states = useTextmenuStates(editor);\r\n const blockOptions = useTextmenuContentTypes(editor);\r\n const [openAi, setOpenAi] = useState(false);\r\n\r\n return (\r\n <BubbleMenu\r\n tippyOptions={{\r\n placement: \"auto\",\r\n popperOptions: {\r\n placement: \"auto\",\r\n },\r\n onHide: () => {\r\n setOpenAi(false);\r\n },\r\n }}\r\n editor={editor}\r\n pluginKey=\"textMenu\"\r\n shouldShow={states.shouldShow}\r\n updateDelay={100}\r\n >\r\n {openAi ? (\r\n <AIEditorPanel\r\n editor={editor}\r\n onOpenChange={(value) => {\r\n setOpenAi(value);\r\n }}\r\n />\r\n ) : (\r\n <Toolbar.Wrapper>\r\n <Toolbar.Button\r\n className=\"text-purple-500 hover:text-purple-600 active:text-purple-600 dark:text-purple-400 dark:hover:text-purple-300 dark:active:text-purple-400\"\r\n activeClassname=\"text-purple-600 hover:text-purple-600 dark:text-purple-400 dark:hover:text-purple-200\"\r\n onClick={() => setOpenAi(true)}\r\n >\r\n <Icon icon={Sparkles} className=\"mr-1\" />\r\n {i18next.t(\"aiTools\") || \"AI Tools\"}\r\n\r\n <span className=\"text-xs ml-1 px-2 py-1 bg-purple-100 text-purple-700 rounded-full dark:bg-purple-700 dark:text-purple-100 align-baseline\">\r\n Beta\r\n </span>\r\n </Toolbar.Button>\r\n <Toolbar.Divider />\r\n\r\n <MemoContentTypePicker options={blockOptions} />\r\n {/* <MemoFontFamilyPicker\r\n onChange={commands.onSetFont}\r\n value={states.currentFont || \"\"}\r\n /> */}\r\n {/* <MemoFontSizePicker\r\n onChange={commands.onSetFontSize}\r\n value={states.currentSize || \"\"}\r\n /> */}\r\n <Toolbar.Divider />\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"boldText\") || \"Bold\"}\r\n tooltipShortcut={[\"Mod\", \"B\"]}\r\n onClick={commands.onBold}\r\n active={states.isBold}\r\n >\r\n <Icon icon={Bold} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"italicText\") || \"Italic\"}\r\n tooltipShortcut={[\"Mod\", \"I\"]}\r\n onClick={commands.onItalic}\r\n active={states.isItalic}\r\n >\r\n <Icon icon={Italic} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"underlineText\") || \"Underline\"}\r\n tooltipShortcut={[\"Mod\", \"U\"]}\r\n onClick={commands.onUnderline}\r\n active={states.isUnderline}\r\n >\r\n <Icon icon={Underline} />\r\n </MemoButton>\r\n\r\n <EditLinkPopover onSetLink={commands.onLink} />\r\n {/* <Popover.Root>\r\n <Popover.Trigger asChild>\r\n <MemoButton\r\n type=\"button\"\r\n active={!!states.currentHighlight}\r\n tooltip={i18next.t(\"highlightText\", \"Highlight text\")}\r\n >\r\n <Icon icon={Highlighter} />\r\n </MemoButton>\r\n </Popover.Trigger>\r\n <Popover.Content side=\"top\" sideOffset={8} asChild>\r\n <Surface className=\"p-1\">\r\n <MemoColorPicker\r\n color={states.currentHighlight}\r\n onChange={commands.onChangeHighlight}\r\n onClear={commands.onClearHighlight}\r\n />\r\n </Surface>\r\n </Popover.Content>\r\n </Popover.Root> */}\r\n {/* <Popover.Root>\r\n <Popover.Trigger asChild>\r\n <MemoButton\r\n type=\"button\"\r\n active={!!states.currentColor}\r\n tooltip={i18next.t(\"textColor\") || \"Text color\"}\r\n >\r\n <Icon icon={Palette} />\r\n </MemoButton>\r\n </Popover.Trigger>\r\n <Popover.Content side=\"top\" sideOffset={8} asChild>\r\n <Surface className=\"p-1\">\r\n <MemoColorPicker\r\n color={states.currentColor}\r\n onChange={commands.onChangeColor}\r\n onClear={commands.onClearColor}\r\n />\r\n </Surface>\r\n </Popover.Content>\r\n </Popover.Root> */}\r\n <Popover.Root>\r\n <Popover.Trigger asChild>\r\n <MemoButton type=\"button\" tooltip={i18next.t(\"moreOptions\", \"More options\")}>\r\n <Icon icon={MoveVertical} />\r\n </MemoButton>\r\n </Popover.Trigger>\r\n <Popover.Content side=\"top\" asChild>\r\n <Toolbar.Wrapper>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"subscript\", \"Subscript\")}\r\n tooltipShortcut={[\"Mod\", \".\"]}\r\n onClick={commands.onSubscript}\r\n active={states.isSubscript}\r\n >\r\n <Icon icon={Subscript} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"superscript\", \"Superscript\")}\r\n tooltipShortcut={[\"Mod\", \",\"]}\r\n onClick={commands.onSuperscript}\r\n active={states.isSuperscript}\r\n >\r\n <Icon icon={Superscript} />\r\n </MemoButton>\r\n <Toolbar.Divider />\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"alignLeft\") || \"Align left\"}\r\n tooltipShortcut={[\"Shift\", \"Mod\", \"L\"]}\r\n onClick={commands.onAlignLeft}\r\n active={states.isAlignLeft}\r\n >\r\n <Icon icon={AlignLeft} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"alignCenter\") || \"Align center\"}\r\n tooltipShortcut={[\"Shift\", \"Mod\", \"E\"]}\r\n onClick={commands.onAlignCenter}\r\n active={states.isAlignCenter}\r\n >\r\n <Icon icon={AlignCenter} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"alignRight\", \"Align right\")}\r\n tooltipShortcut={[\"Shift\", \"Mod\", \"R\"]}\r\n onClick={commands.onAlignRight}\r\n active={states.isAlignRight}\r\n >\r\n <Icon icon={AlignRight} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"alignJustify\") || \"Justify\"}\r\n tooltipShortcut={[\"Shift\", \"Mod\", \"J\"]}\r\n onClick={commands.onAlignJustify}\r\n active={states.isAlignJustify}\r\n >\r\n <Icon icon={AlignJustify} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"strikethrough\", \"Strikethrough\")}\r\n tooltipShortcut={[\"Mod\", \"Shift\", \"S\"]}\r\n onClick={commands.onStrike}\r\n active={states.isStrike}\r\n >\r\n <Icon icon={Strikethrough} />\r\n </MemoButton>\r\n\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"clearFormatting\") || \"Clear Formatting\"}\r\n onClick={commands.onClearFormatting}\r\n >\r\n <Icon icon={RemoveFormatting} />\r\n </MemoButton>\r\n </Toolbar.Wrapper>\r\n </Popover.Content>\r\n </Popover.Root>\r\n </Toolbar.Wrapper>\r\n )}\r\n </BubbleMenu>\r\n );\r\n};\r\n"],"names":["Popover","BubbleMenu","AlignCenter","AlignJustify","AlignLeft","AlignRight","Bold","Italic","MoveVertical","RemoveFormatting","Sparkles","Strikethrough","Subscript","Superscript","Underline","memo","useState","AIEditorPanel","ColorPicker","Icon","Toolbar","ContentTypePicker","EditLinkPopover","FontSizePicker","useTextmenuCommands","useTextmenuContentTypes","useTextmenuStates","i18next","MemoButton","Button","MemoColorPicker","MemoFontSizePicker","MemoContentTypePicker","TextMenu","editor","dir","commands","states","blockOptions","openAi","setOpenAi","tippyOptions","placement","popperOptions","onHide","pluginKey","shouldShow","updateDelay","onOpenChange","value","Wrapper","className","activeClassname","onClick","icon","t","span","Divider","options","type","tooltip","tooltipShortcut","onBold","active","isBold","onItalic","isItalic","onUnderline","isUnderline","onSetLink","onLink","Root","Trigger","asChild","Content","side","onSubscript","isSubscript","onSuperscript","isSuperscript","onAlignLeft","isAlignLeft","onAlignCenter","isAlignCenter","onAlignRight","isAlignRight","onAlignJustify","isAlignJustify","onStrike","isStrike","onClearFormatting"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/fields/TiptapEditor/features/menus/TextMenu/TextMenu.tsx"],"sourcesContent":["import * as Popover from \"@radix-ui/react-popover\";\r\nimport { BubbleMenu, Editor } from \"@tiptap/react\";\r\n\r\nimport {\r\n AlignCenter,\r\n AlignJustify,\r\n AlignLeft,\r\n AlignRight,\r\n Bold,\r\n Highlighter,\r\n Italic,\r\n MoveVertical,\r\n Palette,\r\n RemoveFormatting,\r\n Sparkles,\r\n Strikethrough,\r\n Subscript,\r\n Superscript,\r\n Underline,\r\n} from \"lucide-react\";\r\nimport { memo, useState } from \"react\";\r\nimport { AIEditorPanel } from \"../../panels/AIEditorPanel/AIEditorPanel.js\";\r\nimport { ColorPicker } from \"../../panels/index.js\";\r\nimport { Icon } from \"../../ui/Icon.js\";\r\nimport { Surface } from \"../../ui/Surface.js\";\r\nimport { Toolbar } from \"../../ui/Toolbar.js\";\r\nimport { ContentTypePicker } from \"./components/ContentTypePicker.js\";\r\nimport { EditLinkPopover } from \"./components/EditLinkPopover.js\";\r\n// import { FontFamilyPicker } from \"./components/FontFamilyPicker.js\";\r\nimport { FontSizePicker } from \"./components/FontSizePicker.js\";\r\nimport { useTextmenuCommands } from \"./hooks/useTextmenuCommands.js\";\r\nimport { useTextmenuContentTypes } from \"./hooks/useTextmenuContentTypes.js\";\r\nimport { useTextmenuStates } from \"./hooks/useTextmenuStates.js\";\r\nimport i18next from \"i18next\";\r\n\r\n// We memorize the button so each button is not rerendered\r\n// on every editor state change\r\nconst MemoButton = memo(Toolbar.Button);\r\nconst MemoColorPicker = memo(ColorPicker);\r\n// const MemoFontFamilyPicker = memo(FontFamilyPicker);\r\nconst MemoFontSizePicker = memo(FontSizePicker);\r\nconst MemoContentTypePicker = memo(ContentTypePicker);\r\n\r\nexport type TextMenuProps = {\r\n editor: Editor;\r\n dir: \"rtl\" | \"ltr\" | \"auto\";\r\n};\r\n\r\nexport const TextMenu = ({ editor, dir }: TextMenuProps) => {\r\n const commands = useTextmenuCommands(editor);\r\n const states = useTextmenuStates(editor);\r\n const blockOptions = useTextmenuContentTypes(editor);\r\n const [openAi, setOpenAi] = useState(false);\r\n\r\n return (\r\n <BubbleMenu\r\n tippyOptions={{\r\n placement: \"top-start\",\r\n onHide: () => {\r\n setOpenAi(false);\r\n },\r\n popperOptions: {\r\n modifiers: [{ name: \"flip\", enabled: false }],\r\n },\r\n }}\r\n editor={editor}\r\n pluginKey=\"textMenu\"\r\n shouldShow={states.shouldShow}\r\n updateDelay={200}\r\n >\r\n {openAi ? (\r\n <AIEditorPanel\r\n editor={editor}\r\n onOpenChange={(value) => {\r\n setOpenAi(value);\r\n }}\r\n />\r\n ) : (\r\n <Toolbar.Wrapper>\r\n <Toolbar.Button\r\n className=\"text-purple-500 hover:text-purple-600 active:text-purple-600 dark:text-purple-400 dark:hover:text-purple-300 dark:active:text-purple-400\"\r\n activeClassname=\"text-purple-600 hover:text-purple-600 dark:text-purple-400 dark:hover:text-purple-200\"\r\n onClick={() => setOpenAi(true)}\r\n >\r\n 1\r\n </Toolbar.Button>\r\n <Toolbar.Button\r\n className=\"text-purple-500 hover:text-purple-600 active:text-purple-600 dark:text-purple-400 dark:hover:text-purple-300 dark:active:text-purple-400\"\r\n activeClassname=\"text-purple-600 hover:text-purple-600 dark:text-purple-400 dark:hover:text-purple-200\"\r\n onClick={() => setOpenAi(true)}\r\n >\r\n <Icon icon={Sparkles} className=\"mr-1\" />\r\n {i18next.t(\"aiTools\") || \"AI Tools\"}\r\n\r\n <span className=\"text-xs ml-1 px-2 py-1 bg-purple-100 text-purple-700 rounded-full dark:bg-purple-700 dark:text-purple-100 align-baseline\">\r\n Beta\r\n </span>\r\n </Toolbar.Button>\r\n <Toolbar.Divider />\r\n <MemoContentTypePicker options={blockOptions} />\r\n {/* <MemoFontFamilyPicker\r\n onChange={commands.onSetFont}\r\n value={states.currentFont || \"\"}\r\n /> */}\r\n {/* <MemoFontSizePicker\r\n onChange={commands.onSetFontSize}\r\n value={states.currentSize || \"\"}\r\n /> */}\r\n <Toolbar.Divider />\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"boldText\") || \"Bold\"}\r\n tooltipShortcut={[\"Mod\", \"B\"]}\r\n onClick={commands.onBold}\r\n active={states.isBold}\r\n >\r\n <Icon icon={Bold} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"italicText\") || \"Italic\"}\r\n tooltipShortcut={[\"Mod\", \"I\"]}\r\n onClick={commands.onItalic}\r\n active={states.isItalic}\r\n >\r\n <Icon icon={Italic} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"underlineText\") || \"Underline\"}\r\n tooltipShortcut={[\"Mod\", \"U\"]}\r\n onClick={commands.onUnderline}\r\n active={states.isUnderline}\r\n >\r\n <Icon icon={Underline} />\r\n </MemoButton>\r\n <EditLinkPopover onSetLink={commands.onLink} />\r\n {/* <Popover.Root>\r\n <Popover.Trigger asChild>\r\n <MemoButton\r\n type=\"button\"\r\n active={!!states.currentHighlight}\r\n tooltip={i18next.t(\"highlightText\", \"Highlight text\")}\r\n >\r\n <Icon icon={Highlighter} />\r\n </MemoButton>\r\n </Popover.Trigger>\r\n <Popover.Content side=\"top\" sideOffset={8} asChild>\r\n <Surface className=\"p-1\">\r\n <MemoColorPicker\r\n color={states.currentHighlight}\r\n onChange={commands.onChangeHighlight}\r\n onClear={commands.onClearHighlight}\r\n />\r\n </Surface>\r\n </Popover.Content>\r\n </Popover.Root> */}\r\n {/* <Popover.Root>\r\n <Popover.Trigger asChild>\r\n <MemoButton\r\n type=\"button\"\r\n active={!!states.currentColor}\r\n tooltip={i18next.t(\"textColor\") || \"Text color\"}\r\n >\r\n <Icon icon={Palette} />\r\n </MemoButton>\r\n </Popover.Trigger>\r\n <Popover.Content side=\"top\" sideOffset={8} asChild>\r\n <Surface className=\"p-1\">\r\n <MemoColorPicker\r\n color={states.currentColor}\r\n onChange={commands.onChangeColor}\r\n onClear={commands.onClearColor}\r\n />\r\n </Surface>\r\n </Popover.Content>\r\n </Popover.Root> */}\r\n <Popover.Root>\r\n <Popover.Trigger asChild>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"moreOptions\", \"More options\")}\r\n >\r\n <Icon icon={MoveVertical} />\r\n </MemoButton>\r\n </Popover.Trigger>\r\n <Popover.Content side=\"top\" asChild>\r\n <Toolbar.Wrapper>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"subscript\", \"Subscript\")}\r\n tooltipShortcut={[\"Mod\", \".\"]}\r\n onClick={commands.onSubscript}\r\n active={states.isSubscript}\r\n >\r\n <Icon icon={Subscript} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"superscript\", \"Superscript\")}\r\n tooltipShortcut={[\"Mod\", \",\"]}\r\n onClick={commands.onSuperscript}\r\n active={states.isSuperscript}\r\n >\r\n <Icon icon={Superscript} />\r\n </MemoButton>\r\n <Toolbar.Divider />\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"alignLeft\") || \"Align left\"}\r\n tooltipShortcut={[\"Shift\", \"Mod\", \"L\"]}\r\n onClick={commands.onAlignLeft}\r\n active={states.isAlignLeft}\r\n >\r\n <Icon icon={AlignLeft} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"alignCenter\") || \"Align center\"}\r\n tooltipShortcut={[\"Shift\", \"Mod\", \"E\"]}\r\n onClick={commands.onAlignCenter}\r\n active={states.isAlignCenter}\r\n >\r\n <Icon icon={AlignCenter} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"alignRight\", \"Align right\")}\r\n tooltipShortcut={[\"Shift\", \"Mod\", \"R\"]}\r\n onClick={commands.onAlignRight}\r\n active={states.isAlignRight}\r\n >\r\n <Icon icon={AlignRight} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"alignJustify\") || \"Justify\"}\r\n tooltipShortcut={[\"Shift\", \"Mod\", \"J\"]}\r\n onClick={commands.onAlignJustify}\r\n active={states.isAlignJustify}\r\n >\r\n <Icon icon={AlignJustify} />\r\n </MemoButton>\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"strikethrough\", \"Strikethrough\")}\r\n tooltipShortcut={[\"Mod\", \"Shift\", \"S\"]}\r\n onClick={commands.onStrike}\r\n active={states.isStrike}\r\n >\r\n <Icon icon={Strikethrough} />\r\n </MemoButton>\r\n\r\n <MemoButton\r\n type=\"button\"\r\n tooltip={i18next.t(\"clearFormatting\") || \"Clear Formatting\"}\r\n onClick={commands.onClearFormatting}\r\n >\r\n <Icon icon={RemoveFormatting} />\r\n </MemoButton>\r\n </Toolbar.Wrapper>\r\n </Popover.Content>\r\n </Popover.Root>\r\n </Toolbar.Wrapper>\r\n )}\r\n </BubbleMenu>\r\n );\r\n};\r\n"],"names":["Popover","BubbleMenu","AlignCenter","AlignJustify","AlignLeft","AlignRight","Bold","Italic","MoveVertical","RemoveFormatting","Sparkles","Strikethrough","Subscript","Superscript","Underline","memo","useState","AIEditorPanel","ColorPicker","Icon","Toolbar","ContentTypePicker","EditLinkPopover","FontSizePicker","useTextmenuCommands","useTextmenuContentTypes","useTextmenuStates","i18next","MemoButton","Button","MemoColorPicker","MemoFontSizePicker","MemoContentTypePicker","TextMenu","editor","dir","commands","states","blockOptions","openAi","setOpenAi","tippyOptions","placement","onHide","popperOptions","modifiers","name","enabled","pluginKey","shouldShow","updateDelay","onOpenChange","value","Wrapper","className","activeClassname","onClick","icon","t","span","Divider","options","type","tooltip","tooltipShortcut","onBold","active","isBold","onItalic","isItalic","onUnderline","isUnderline","onSetLink","onLink","Root","Trigger","asChild","Content","side","onSubscript","isSubscript","onSuperscript","isSuperscript","onAlignLeft","isAlignLeft","onAlignCenter","isAlignCenter","onAlignRight","isAlignRight","onAlignJustify","isAlignJustify","onStrike","isStrike","onClearFormatting"],"mappings":"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"}
|