@webiny/lexical-editor 6.0.0 → 6.1.0-beta.1

package/components/ToolbarActions/FontColorAction.d.ts

@@ -1,27 +1,27 @@
 import React from "react";
-export declare const FontColorPicker: (() => JSX.Element | null) & {
-    original: () => JSX.Element | null;
+export declare const FontColorPicker: (() => React.JSX.Element | null) & {
+    original: () => React.JSX.Element | null;
     originalName: string;
     displayName: string;
 } & {
-    original: (() => JSX.Element | null) & {
-        original: () => JSX.Element | null;
+    original: (() => React.JSX.Element | null) & {
+        original: () => React.JSX.Element | null;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(() => JSX.Element | null) & {
-        original: () => JSX.Element | null;
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(() => React.JSX.Element | null) & {
+        original: () => React.JSX.Element | null;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 };
 interface FontActionColorPicker {
-    element: JSX.Element;
+    element: React.JSX.Element;
 }
-declare const FontActionColorPicker: ({ element }: FontActionColorPicker) => JSX.Element;
+declare const FontActionColorPicker: ({ element }: FontActionColorPicker) => React.JSX.Element;
 export type FontColorAction = React.ComponentType<unknown> & {
     ColorPicker: typeof FontActionColorPicker;
 };

package/components/ToolbarActions/FontColorAction.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useMemo","Compose","makeDecoratable","FontColorActionContext","$isFontColorNode","ADD_FONT_COLOR_COMMAND","ThemeColorValue","getSelectedNode","useDeriveValueFromSelection","useRichTextEditor","FontColorPicker","console","log","FontActionColorPicker","element","createElement","component","with","FontColorAction","editor","fontColor","rangeSelection","node","getColorStyle","color","onFontColorSelect","colorValue","themeColorName","dispatchCommand","context","value","applyColor","Provider","ColorPicker"],"sources":["FontColorAction.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo } from \"react\";\nimport type { LexicalCommand } from \"lexical\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport { FontColorActionContext } from \"~/context/FontColorActionContext.js\";\nimport type { FontColorPayload } from \"@webiny/lexical-nodes\";\nimport { $isFontColorNode, ADD_FONT_COLOR_COMMAND, ThemeColorValue } from \"@webiny/lexical-nodes\";\nimport { getSelectedNode } from \"~/utils/getSelectedNode.js\";\nimport { useDeriveValueFromSelection } from \"~/hooks/useCurrentSelection.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\n\nexport const FontColorPicker = makeDecoratable(\"FontColorPicker\", (): JSX.Element | null => {\n    useEffect(() => {\n        console.log(\"Default FontColorPicker, please add your own component\");\n    }, []);\n    return null;\n});\n\ninterface FontActionColorPicker {\n    element: JSX.Element;\n}\n\nconst FontActionColorPicker = ({ element }: FontActionColorPicker): JSX.Element => {\n    return <Compose component={FontColorPicker} with={() => () => element} />;\n};\n\nexport type FontColorAction = React.ComponentType<unknown> & {\n    ColorPicker: typeof FontActionColorPicker;\n};\n\nexport const FontColorAction: FontColorAction = () => {\n    const { editor } = useRichTextEditor();\n    const fontColor = useDeriveValueFromSelection(({ rangeSelection }) => {\n        if (!rangeSelection) {\n            return \"#000\";\n        }\n\n        const node = getSelectedNode(rangeSelection);\n        return $isFontColorNode(node) ? node.getColorStyle().color : \"#000\";\n    });\n\n    const onFontColorSelect = useCallback(\n        (colorValue: string, themeColorName: string | undefined) => {\n            editor.dispatchCommand<LexicalCommand<FontColorPayload>>(ADD_FONT_COLOR_COMMAND, {\n                color: new ThemeColorValue(colorValue, themeColorName)\n            });\n        },\n        []\n    );\n\n    const context = useMemo(\n        () => ({\n            value: fontColor,\n            applyColor: onFontColorSelect\n        }),\n        [onFontColorSelect, fontColor]\n    );\n\n    return (\n        <FontColorActionContext.Provider value={context}>\n            <FontColorPicker />\n        </FontColorActionContext.Provider>\n    );\n};\n\nFontColorAction.ColorPicker = FontActionColorPicker;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAE9D,SAASC,OAAO,EAAEC,eAAe,QAAQ,2BAA2B;AACpE,SAASC,sBAAsB;AAE/B,SAASC,gBAAgB,EAAEC,sBAAsB,EAAEC,eAAe,QAAQ,uBAAuB;AACjG,SAASC,eAAe;AACxB,SAASC,2BAA2B;AACpC,SAASC,iBAAiB;AAE1B,OAAO,MAAMC,eAAe,GAAGR,eAAe,CAAC,iBAAiB,EAAE,MAA0B;EACxFH,SAAS,CAAC,MAAM;IACZY,OAAO,CAACC,GAAG,CAAC,wDAAwD,CAAC;EACzE,CAAC,EAAE,EAAE,CAAC;EACN,OAAO,IAAI;AACf,CAAC,CAAC;AAMF,MAAMC,qBAAqB,GAAGA,CAAC;EAAEC;AAA+B,CAAC,KAAkB;EAC/E,oBAAOjB,KAAA,CAAAkB,aAAA,CAACd,OAAO;IAACe,SAAS,EAAEN,eAAgB;IAACO,IAAI,EAAEA,CAAA,KAAM,MAAMH;EAAQ,CAAE,CAAC;AAC7E,CAAC;AAMD,OAAO,MAAMI,eAAgC,GAAGA,CAAA,KAAM;EAClD,MAAM;IAAEC;EAAO,CAAC,GAAGV,iBAAiB,CAAC,CAAC;EACtC,MAAMW,SAAS,GAAGZ,2BAA2B,CAAC,CAAC;IAAEa;EAAe,CAAC,KAAK;IAClE,IAAI,CAACA,cAAc,EAAE;MACjB,OAAO,MAAM;IACjB;IAEA,MAAMC,IAAI,GAAGf,eAAe,CAACc,cAAc,CAAC;IAC5C,OAAOjB,gBAAgB,CAACkB,IAAI,CAAC,GAAGA,IAAI,CAACC,aAAa,CAAC,CAAC,CAACC,KAAK,GAAG,MAAM;EACvE,CAAC,CAAC;EAEF,MAAMC,iBAAiB,GAAG3B,WAAW,CACjC,CAAC4B,UAAkB,EAAEC,cAAkC,KAAK;IACxDR,MAAM,CAACS,eAAe,CAAmCvB,sBAAsB,EAAE;MAC7EmB,KAAK,EAAE,IAAIlB,eAAe,CAACoB,UAAU,EAAEC,cAAc;IACzD,CAAC,CAAC;EACN,CAAC,EACD,EACJ,CAAC;EAED,MAAME,OAAO,GAAG7B,OAAO,CACnB,OAAO;IACH8B,KAAK,EAAEV,SAAS;IAChBW,UAAU,EAAEN;EAChB,CAAC,CAAC,EACF,CAACA,iBAAiB,EAAEL,SAAS,CACjC,CAAC;EAED,oBACIvB,KAAA,CAAAkB,aAAA,CAACZ,sBAAsB,CAAC6B,QAAQ;IAACF,KAAK,EAAED;EAAQ,gBAC5ChC,KAAA,CAAAkB,aAAA,CAACL,eAAe,MAAE,CACW,CAAC;AAE1C,CAAC;AAEDQ,eAAe,CAACe,WAAW,GAAGpB,qBAAqB","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useEffect","useMemo","Compose","makeDecoratable","FontColorActionContext","$isFontColorNode","ADD_FONT_COLOR_COMMAND","ThemeColorValue","getSelectedNode","useDeriveValueFromSelection","useRichTextEditor","FontColorPicker","console","log","FontActionColorPicker","element","createElement","component","with","FontColorAction","editor","fontColor","rangeSelection","node","getColorStyle","color","onFontColorSelect","colorValue","themeColorName","dispatchCommand","context","value","applyColor","Provider","ColorPicker"],"sources":["FontColorAction.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo } from \"react\";\nimport type { LexicalCommand } from \"lexical\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport { FontColorActionContext } from \"~/context/FontColorActionContext.js\";\nimport type { FontColorPayload } from \"@webiny/lexical-nodes\";\nimport { $isFontColorNode, ADD_FONT_COLOR_COMMAND, ThemeColorValue } from \"@webiny/lexical-nodes\";\nimport { getSelectedNode } from \"~/utils/getSelectedNode.js\";\nimport { useDeriveValueFromSelection } from \"~/hooks/useCurrentSelection.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\n\nexport const FontColorPicker = makeDecoratable(\"FontColorPicker\", (): React.JSX.Element | null => {\n    useEffect(() => {\n        console.log(\"Default FontColorPicker, please add your own component\");\n    }, []);\n    return null;\n});\n\ninterface FontActionColorPicker {\n    element: React.JSX.Element;\n}\n\nconst FontActionColorPicker = ({ element }: FontActionColorPicker): React.JSX.Element => {\n    return <Compose component={FontColorPicker} with={() => () => element} />;\n};\n\nexport type FontColorAction = React.ComponentType<unknown> & {\n    ColorPicker: typeof FontActionColorPicker;\n};\n\nexport const FontColorAction: FontColorAction = () => {\n    const { editor } = useRichTextEditor();\n    const fontColor = useDeriveValueFromSelection(({ rangeSelection }) => {\n        if (!rangeSelection) {\n            return \"#000\";\n        }\n\n        const node = getSelectedNode(rangeSelection);\n        return $isFontColorNode(node) ? node.getColorStyle().color : \"#000\";\n    });\n\n    const onFontColorSelect = useCallback(\n        (colorValue: string, themeColorName: string | undefined) => {\n            editor.dispatchCommand<LexicalCommand<FontColorPayload>>(ADD_FONT_COLOR_COMMAND, {\n                color: new ThemeColorValue(colorValue, themeColorName)\n            });\n        },\n        []\n    );\n\n    const context = useMemo(\n        () => ({\n            value: fontColor,\n            applyColor: onFontColorSelect\n        }),\n        [onFontColorSelect, fontColor]\n    );\n\n    return (\n        <FontColorActionContext.Provider value={context}>\n            <FontColorPicker />\n        </FontColorActionContext.Provider>\n    );\n};\n\nFontColorAction.ColorPicker = FontActionColorPicker;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAE9D,SAASC,OAAO,EAAEC,eAAe,QAAQ,2BAA2B;AACpE,SAASC,sBAAsB;AAE/B,SAASC,gBAAgB,EAAEC,sBAAsB,EAAEC,eAAe,QAAQ,uBAAuB;AACjG,SAASC,eAAe;AACxB,SAASC,2BAA2B;AACpC,SAASC,iBAAiB;AAE1B,OAAO,MAAMC,eAAe,GAAGR,eAAe,CAAC,iBAAiB,EAAE,MAAgC;EAC9FH,SAAS,CAAC,MAAM;IACZY,OAAO,CAACC,GAAG,CAAC,wDAAwD,CAAC;EACzE,CAAC,EAAE,EAAE,CAAC;EACN,OAAO,IAAI;AACf,CAAC,CAAC;AAMF,MAAMC,qBAAqB,GAAGA,CAAC;EAAEC;AAA+B,CAAC,KAAwB;EACrF,oBAAOjB,KAAA,CAAAkB,aAAA,CAACd,OAAO;IAACe,SAAS,EAAEN,eAAgB;IAACO,IAAI,EAAEA,CAAA,KAAM,MAAMH;EAAQ,CAAE,CAAC;AAC7E,CAAC;AAMD,OAAO,MAAMI,eAAgC,GAAGA,CAAA,KAAM;EAClD,MAAM;IAAEC;EAAO,CAAC,GAAGV,iBAAiB,CAAC,CAAC;EACtC,MAAMW,SAAS,GAAGZ,2BAA2B,CAAC,CAAC;IAAEa;EAAe,CAAC,KAAK;IAClE,IAAI,CAACA,cAAc,EAAE;MACjB,OAAO,MAAM;IACjB;IAEA,MAAMC,IAAI,GAAGf,eAAe,CAACc,cAAc,CAAC;IAC5C,OAAOjB,gBAAgB,CAACkB,IAAI,CAAC,GAAGA,IAAI,CAACC,aAAa,CAAC,CAAC,CAACC,KAAK,GAAG,MAAM;EACvE,CAAC,CAAC;EAEF,MAAMC,iBAAiB,GAAG3B,WAAW,CACjC,CAAC4B,UAAkB,EAAEC,cAAkC,KAAK;IACxDR,MAAM,CAACS,eAAe,CAAmCvB,sBAAsB,EAAE;MAC7EmB,KAAK,EAAE,IAAIlB,eAAe,CAACoB,UAAU,EAAEC,cAAc;IACzD,CAAC,CAAC;EACN,CAAC,EACD,EACJ,CAAC;EAED,MAAME,OAAO,GAAG7B,OAAO,CACnB,OAAO;IACH8B,KAAK,EAAEV,SAAS;IAChBW,UAAU,EAAEN;EAChB,CAAC,CAAC,EACF,CAACA,iBAAiB,EAAEL,SAAS,CACjC,CAAC;EAED,oBACIvB,KAAA,CAAAkB,aAAA,CAACZ,sBAAsB,CAAC6B,QAAQ;IAACF,KAAK,EAAED;EAAQ,gBAC5ChC,KAAA,CAAAkB,aAAA,CAACL,eAAe,MAAE,CACW,CAAC;AAE1C,CAAC;AAEDQ,eAAe,CAACe,WAAW,GAAGpB,qBAAqB","ignoreList":[]}

package/components/ToolbarActions/TextAlignmentAction.d.ts

@@ -1,27 +1,27 @@
 import React from "react";
-export declare const BaseTextAlignmentDropDown: (() => JSX.Element | null) & {
-    original: () => JSX.Element | null;
+export declare const BaseTextAlignmentDropDown: (() => React.JSX.Element | null) & {
+    original: () => React.JSX.Element | null;
     originalName: string;
     displayName: string;
 } & {
-    original: (() => JSX.Element | null) & {
-        original: () => JSX.Element | null;
+    original: (() => React.JSX.Element | null) & {
+        original: () => React.JSX.Element | null;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(() => JSX.Element | null) & {
-        original: () => JSX.Element | null;
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(() => React.JSX.Element | null) & {
+        original: () => React.JSX.Element | null;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 };
 interface TextAlignmentActionDropdownProps {
-    element: JSX.Element;
+    element: React.JSX.Element;
 }
-declare const TextAlignmentActionDropDown: ({ element }: TextAlignmentActionDropdownProps) => JSX.Element;
+declare const TextAlignmentActionDropDown: ({ element }: TextAlignmentActionDropdownProps) => React.JSX.Element;
 export type TextAlignmentAction = React.ComponentType<unknown> & {
     TextAlignmentDropDown: typeof TextAlignmentActionDropDown;
 };

package/components/ToolbarActions/TextAlignmentAction.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useMemo","FORMAT_ELEMENT_COMMAND","INDENT_CONTENT_COMMAND","OUTDENT_CONTENT_COMMAND","Compose","makeDecoratable","TextAlignmentActionContext","useDeriveValueFromSelection","getSelectedNode","useRichTextEditor","BaseTextAlignmentDropDown","console","log","TextAlignmentActionDropDown","element","createElement","component","with","TextAlignmentAction","editor","alignmentValue","rangeSelection","node","getParent","getFormatType","applyTextAlignment","value","dispatchCommand","outdentText","undefined","indentText","context","Provider","TextAlignmentDropDown"],"sources":["TextAlignmentAction.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport type { ElementFormatType } from \"lexical\";\nimport { FORMAT_ELEMENT_COMMAND, INDENT_CONTENT_COMMAND, OUTDENT_CONTENT_COMMAND } from \"lexical\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport { TextAlignmentActionContext } from \"~/context/TextAlignmentActionContextProps.js\";\nimport { useDeriveValueFromSelection } from \"~/hooks/useCurrentSelection.js\";\nimport { getSelectedNode } from \"~/utils/getSelectedNode.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\n\n/*\n * Base text alignment dropdown composable component.\n * Note: To add a custom dropdown component use @see LexicalEditorConfig API.\n */\nexport const BaseTextAlignmentDropDown = makeDecoratable(\n    \"BaseTextAlignmentDropDown\",\n    (): JSX.Element | null => {\n        useEffect(() => {\n            console.log(\"Default BaseTextAlignmentDropDown, please add your own component\");\n        }, []);\n        return null;\n    }\n);\n\ninterface TextAlignmentActionDropdownProps {\n    element: JSX.Element;\n}\n\nconst TextAlignmentActionDropDown = ({\n    element\n}: TextAlignmentActionDropdownProps): JSX.Element => {\n    return <Compose component={BaseTextAlignmentDropDown} with={() => () => element} />;\n};\n\nexport type TextAlignmentAction = React.ComponentType<unknown> & {\n    TextAlignmentDropDown: typeof TextAlignmentActionDropDown;\n};\n\nexport const TextAlignmentAction: TextAlignmentAction = () => {\n    const { editor } = useRichTextEditor();\n    const alignmentValue: ElementFormatType = useDeriveValueFromSelection(({ rangeSelection }) => {\n        const node = rangeSelection ? getSelectedNode(rangeSelection) : null;\n        if (node) {\n            return node.getParent()?.getFormatType() || \"\";\n        }\n        return \"\";\n    });\n\n    const applyTextAlignment = (value: ElementFormatType) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, value);\n    };\n\n    const outdentText = () => {\n        editor.dispatchCommand(OUTDENT_CONTENT_COMMAND, undefined);\n    };\n\n    const indentText = () => {\n        editor.dispatchCommand(INDENT_CONTENT_COMMAND, undefined);\n    };\n\n    const context = useMemo(\n        () => ({\n            value: alignmentValue,\n            applyTextAlignment,\n            outdentText,\n            indentText\n        }),\n        [alignmentValue]\n    );\n\n    return (\n        <TextAlignmentActionContext.Provider value={context}>\n            <BaseTextAlignmentDropDown />\n        </TextAlignmentActionContext.Provider>\n    );\n};\n\nTextAlignmentAction.TextAlignmentDropDown = TextAlignmentActionDropDown;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAEjD,SAASC,sBAAsB,EAAEC,sBAAsB,EAAEC,uBAAuB,QAAQ,SAAS;AACjG,SAASC,OAAO,EAAEC,eAAe,QAAQ,2BAA2B;AACpE,SAASC,0BAA0B;AACnC,SAASC,2BAA2B;AACpC,SAASC,eAAe;AACxB,SAASC,iBAAiB;;AAE1B;AACA;AACA;AACA;AACA,OAAO,MAAMC,yBAAyB,GAAGL,eAAe,CACpD,2BAA2B,EAC3B,MAA0B;EACtBN,SAAS,CAAC,MAAM;IACZY,OAAO,CAACC,GAAG,CAAC,kEAAkE,CAAC;EACnF,CAAC,EAAE,EAAE,CAAC;EACN,OAAO,IAAI;AACf,CACJ,CAAC;AAMD,MAAMC,2BAA2B,GAAGA,CAAC;EACjCC;AAC8B,CAAC,KAAkB;EACjD,oBAAOhB,KAAA,CAAAiB,aAAA,CAACX,OAAO;IAACY,SAAS,EAAEN,yBAA0B;IAACO,IAAI,EAAEA,CAAA,KAAM,MAAMH;EAAQ,CAAE,CAAC;AACvF,CAAC;AAMD,OAAO,MAAMI,mBAAwC,GAAGA,CAAA,KAAM;EAC1D,MAAM;IAAEC;EAAO,CAAC,GAAGV,iBAAiB,CAAC,CAAC;EACtC,MAAMW,cAAiC,GAAGb,2BAA2B,CAAC,CAAC;IAAEc;EAAe,CAAC,KAAK;IAC1F,MAAMC,IAAI,GAAGD,cAAc,GAAGb,eAAe,CAACa,cAAc,CAAC,GAAG,IAAI;IACpE,IAAIC,IAAI,EAAE;MACN,OAAOA,IAAI,CAACC,SAAS,CAAC,CAAC,EAAEC,aAAa,CAAC,CAAC,IAAI,EAAE;IAClD;IACA,OAAO,EAAE;EACb,CAAC,CAAC;EAEF,MAAMC,kBAAkB,GAAIC,KAAwB,IAAK;IACrDP,MAAM,CAACQ,eAAe,CAAC1B,sBAAsB,EAAEyB,KAAK,CAAC;EACzD,CAAC;EAED,MAAME,WAAW,GAAGA,CAAA,KAAM;IACtBT,MAAM,CAACQ,eAAe,CAACxB,uBAAuB,EAAE0B,SAAS,CAAC;EAC9D,CAAC;EAED,MAAMC,UAAU,GAAGA,CAAA,KAAM;IACrBX,MAAM,CAACQ,eAAe,CAACzB,sBAAsB,EAAE2B,SAAS,CAAC;EAC7D,CAAC;EAED,MAAME,OAAO,GAAG/B,OAAO,CACnB,OAAO;IACH0B,KAAK,EAAEN,cAAc;IACrBK,kBAAkB;IAClBG,WAAW;IACXE;EACJ,CAAC,CAAC,EACF,CAACV,cAAc,CACnB,CAAC;EAED,oBACItB,KAAA,CAAAiB,aAAA,CAACT,0BAA0B,CAAC0B,QAAQ;IAACN,KAAK,EAAEK;EAAQ,gBAChDjC,KAAA,CAAAiB,aAAA,CAACL,yBAAyB,MAAE,CACK,CAAC;AAE9C,CAAC;AAEDQ,mBAAmB,CAACe,qBAAqB,GAAGpB,2BAA2B","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useMemo","FORMAT_ELEMENT_COMMAND","INDENT_CONTENT_COMMAND","OUTDENT_CONTENT_COMMAND","Compose","makeDecoratable","TextAlignmentActionContext","useDeriveValueFromSelection","getSelectedNode","useRichTextEditor","BaseTextAlignmentDropDown","console","log","TextAlignmentActionDropDown","element","createElement","component","with","TextAlignmentAction","editor","alignmentValue","rangeSelection","node","getParent","getFormatType","applyTextAlignment","value","dispatchCommand","outdentText","undefined","indentText","context","Provider","TextAlignmentDropDown"],"sources":["TextAlignmentAction.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport type { ElementFormatType } from \"lexical\";\nimport { FORMAT_ELEMENT_COMMAND, INDENT_CONTENT_COMMAND, OUTDENT_CONTENT_COMMAND } from \"lexical\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport { TextAlignmentActionContext } from \"~/context/TextAlignmentActionContextProps.js\";\nimport { useDeriveValueFromSelection } from \"~/hooks/useCurrentSelection.js\";\nimport { getSelectedNode } from \"~/utils/getSelectedNode.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\n\n/*\n * Base text alignment dropdown composable component.\n * Note: To add a custom dropdown component use @see LexicalEditorConfig API.\n */\nexport const BaseTextAlignmentDropDown = makeDecoratable(\n    \"BaseTextAlignmentDropDown\",\n    (): React.JSX.Element | null => {\n        useEffect(() => {\n            console.log(\"Default BaseTextAlignmentDropDown, please add your own component\");\n        }, []);\n        return null;\n    }\n);\n\ninterface TextAlignmentActionDropdownProps {\n    element: React.JSX.Element;\n}\n\nconst TextAlignmentActionDropDown = ({\n    element\n}: TextAlignmentActionDropdownProps): React.JSX.Element => {\n    return <Compose component={BaseTextAlignmentDropDown} with={() => () => element} />;\n};\n\nexport type TextAlignmentAction = React.ComponentType<unknown> & {\n    TextAlignmentDropDown: typeof TextAlignmentActionDropDown;\n};\n\nexport const TextAlignmentAction: TextAlignmentAction = () => {\n    const { editor } = useRichTextEditor();\n    const alignmentValue: ElementFormatType = useDeriveValueFromSelection(({ rangeSelection }) => {\n        const node = rangeSelection ? getSelectedNode(rangeSelection) : null;\n        if (node) {\n            return node.getParent()?.getFormatType() || \"\";\n        }\n        return \"\";\n    });\n\n    const applyTextAlignment = (value: ElementFormatType) => {\n        editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, value);\n    };\n\n    const outdentText = () => {\n        editor.dispatchCommand(OUTDENT_CONTENT_COMMAND, undefined);\n    };\n\n    const indentText = () => {\n        editor.dispatchCommand(INDENT_CONTENT_COMMAND, undefined);\n    };\n\n    const context = useMemo(\n        () => ({\n            value: alignmentValue,\n            applyTextAlignment,\n            outdentText,\n            indentText\n        }),\n        [alignmentValue]\n    );\n\n    return (\n        <TextAlignmentActionContext.Provider value={context}>\n            <BaseTextAlignmentDropDown />\n        </TextAlignmentActionContext.Provider>\n    );\n};\n\nTextAlignmentAction.TextAlignmentDropDown = TextAlignmentActionDropDown;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAEjD,SAASC,sBAAsB,EAAEC,sBAAsB,EAAEC,uBAAuB,QAAQ,SAAS;AACjG,SAASC,OAAO,EAAEC,eAAe,QAAQ,2BAA2B;AACpE,SAASC,0BAA0B;AACnC,SAASC,2BAA2B;AACpC,SAASC,eAAe;AACxB,SAASC,iBAAiB;;AAE1B;AACA;AACA;AACA;AACA,OAAO,MAAMC,yBAAyB,GAAGL,eAAe,CACpD,2BAA2B,EAC3B,MAAgC;EAC5BN,SAAS,CAAC,MAAM;IACZY,OAAO,CAACC,GAAG,CAAC,kEAAkE,CAAC;EACnF,CAAC,EAAE,EAAE,CAAC;EACN,OAAO,IAAI;AACf,CACJ,CAAC;AAMD,MAAMC,2BAA2B,GAAGA,CAAC;EACjCC;AAC8B,CAAC,KAAwB;EACvD,oBAAOhB,KAAA,CAAAiB,aAAA,CAACX,OAAO;IAACY,SAAS,EAAEN,yBAA0B;IAACO,IAAI,EAAEA,CAAA,KAAM,MAAMH;EAAQ,CAAE,CAAC;AACvF,CAAC;AAMD,OAAO,MAAMI,mBAAwC,GAAGA,CAAA,KAAM;EAC1D,MAAM;IAAEC;EAAO,CAAC,GAAGV,iBAAiB,CAAC,CAAC;EACtC,MAAMW,cAAiC,GAAGb,2BAA2B,CAAC,CAAC;IAAEc;EAAe,CAAC,KAAK;IAC1F,MAAMC,IAAI,GAAGD,cAAc,GAAGb,eAAe,CAACa,cAAc,CAAC,GAAG,IAAI;IACpE,IAAIC,IAAI,EAAE;MACN,OAAOA,IAAI,CAACC,SAAS,CAAC,CAAC,EAAEC,aAAa,CAAC,CAAC,IAAI,EAAE;IAClD;IACA,OAAO,EAAE;EACb,CAAC,CAAC;EAEF,MAAMC,kBAAkB,GAAIC,KAAwB,IAAK;IACrDP,MAAM,CAACQ,eAAe,CAAC1B,sBAAsB,EAAEyB,KAAK,CAAC;EACzD,CAAC;EAED,MAAME,WAAW,GAAGA,CAAA,KAAM;IACtBT,MAAM,CAACQ,eAAe,CAACxB,uBAAuB,EAAE0B,SAAS,CAAC;EAC9D,CAAC;EAED,MAAMC,UAAU,GAAGA,CAAA,KAAM;IACrBX,MAAM,CAACQ,eAAe,CAACzB,sBAAsB,EAAE2B,SAAS,CAAC;EAC7D,CAAC;EAED,MAAME,OAAO,GAAG/B,OAAO,CACnB,OAAO;IACH0B,KAAK,EAAEN,cAAc;IACrBK,kBAAkB;IAClBG,WAAW;IACXE;EACJ,CAAC,CAAC,EACF,CAACV,cAAc,CACnB,CAAC;EAED,oBACItB,KAAA,CAAAiB,aAAA,CAACT,0BAA0B,CAAC0B,QAAQ;IAACN,KAAK,EAAEK;EAAQ,gBAChDjC,KAAA,CAAAiB,aAAA,CAACL,yBAAyB,MAAE,CACK,CAAC;AAE9C,CAAC;AAEDQ,mBAAmB,CAACe,qBAAqB,GAAGpB,2BAA2B","ignoreList":[]}

package/components/ToolbarActions/TypographyAction.d.ts

@@ -1,27 +1,27 @@
 import React from "react";
-export declare const BaseTypographyActionDropDown: (() => JSX.Element | null) & {
-    original: () => JSX.Element | null;
+export declare const BaseTypographyActionDropDown: (() => React.JSX.Element | null) & {
+    original: () => React.JSX.Element | null;
     originalName: string;
     displayName: string;
 } & {
-    original: (() => JSX.Element | null) & {
-        original: () => JSX.Element | null;
+    original: (() => React.JSX.Element | null) & {
+        original: () => React.JSX.Element | null;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(() => JSX.Element | null) & {
-        original: () => JSX.Element | null;
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(() => React.JSX.Element | null) & {
+        original: () => React.JSX.Element | null;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 };
 interface TypographyActionDropdownProps {
-    element: JSX.Element;
+    element: React.JSX.Element;
 }
-declare const TypographyActionDropDown: ({ element }: TypographyActionDropdownProps) => JSX.Element;
+declare const TypographyActionDropDown: ({ element }: TypographyActionDropdownProps) => React.JSX.Element;
 export type TypographyAction = React.ComponentType<unknown> & {
     TypographyDropDown: typeof TypographyActionDropDown;
 };

package/components/ToolbarActions/TypographyAction.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useState","Compose","makeDecoratable","TypographyActionContext","$isHeadingNode","$isListNode","$isParagraphNode","$isQuoteNode","useRichTextEditor","INSERT_ORDERED_LIST_COMMAND","INSERT_UNORDERED_LIST_COMMAND","INSERT_QUOTE_COMMAND","ADD_TYPOGRAPHY_COMMAND","useCurrentElement","quoteTagNames","BaseTypographyActionDropDown","console","log","TypographyActionDropDown","element","createElement","component","with","TypographyAction","typography","setTypography","editor","theme","isParagraphSelected","isHeadingSelected","isQuoteSelected","onTypographySelect","value","tag","includes","dispatchCommand","themeStyleId","id","styleId","getStyleId","style","getTypographyById","label","Provider","applyTypography","TypographyDropDown"],"sources":["TypographyAction.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport type { LexicalCommand } from \"lexical\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport type { TypographyValue } from \"@webiny/lexical-theme\";\nimport type { ActiveTypography } from \"~/context/TypographyActionContext.js\";\nimport { TypographyActionContext } from \"~/context/TypographyActionContext.js\";\nimport { $isHeadingNode, $isListNode, $isParagraphNode, $isQuoteNode } from \"@webiny/lexical-nodes\";\nimport { useRichTextEditor } from \"~/hooks/useRichTextEditor.js\";\nimport type {\n    ListCommandPayload,\n    QuoteCommandPayload,\n    TypographyPayload\n} from \"~/commands/index.js\";\nimport {\n    INSERT_ORDERED_LIST_COMMAND,\n    INSERT_UNORDERED_LIST_COMMAND,\n    INSERT_QUOTE_COMMAND,\n    ADD_TYPOGRAPHY_COMMAND\n} from \"~/commands/index.js\";\nimport { useCurrentElement } from \"~/hooks/useCurrentElement.js\";\n\n// Unfortunately, for some time in v5 we had `quoteblock` in our theme, so let's not break it.\nconst quoteTagNames = [\"blockquote\", \"quoteblock\"];\n\n/*\n * Base composable action component that is mounted on toolbar action as a placeholder for the custom toolbar action.\n * Note: Toa add custom component access trough @see LexicalEditorConfig API\n * */\nexport const BaseTypographyActionDropDown = makeDecoratable(\n    \"BaseTypographyActionDropDown\",\n    (): JSX.Element | null => {\n        useEffect(() => {\n            console.log(\"Default BaseTypographyActionDropDown, please add your own component\");\n        }, []);\n        return null;\n    }\n);\n\ninterface TypographyActionDropdownProps {\n    element: JSX.Element;\n}\n\nconst TypographyActionDropDown = ({ element }: TypographyActionDropdownProps): JSX.Element => {\n    return <Compose component={BaseTypographyActionDropDown} with={() => () => element} />;\n};\n\nexport type TypographyAction = React.ComponentType<unknown> & {\n    TypographyDropDown: typeof TypographyActionDropDown;\n};\n\nexport const TypographyAction: TypographyAction = () => {\n    const [typography, setTypography] = useState<ActiveTypography>();\n    const { editor, theme } = useRichTextEditor();\n    const { element } = useCurrentElement();\n    const isParagraphSelected = $isParagraphNode(element);\n    const isHeadingSelected = $isHeadingNode(element);\n    const isQuoteSelected = $isQuoteNode(element);\n\n    const onTypographySelect = useCallback((value: TypographyValue) => {\n        setTypography(value);\n\n        if (value.tag.includes(\"h\") || value.tag.includes(\"p\")) {\n            editor.dispatchCommand<LexicalCommand<TypographyPayload>>(ADD_TYPOGRAPHY_COMMAND, {\n                value\n            });\n            return;\n        }\n\n        if (value.tag === \"ol\") {\n            editor.dispatchCommand<LexicalCommand<ListCommandPayload>>(\n                INSERT_ORDERED_LIST_COMMAND,\n                {\n                    themeStyleId: value.id\n                }\n            );\n            return;\n        }\n\n        if (value.tag === \"ul\") {\n            editor.dispatchCommand<LexicalCommand<ListCommandPayload>>(\n                INSERT_UNORDERED_LIST_COMMAND,\n                {\n                    themeStyleId: value.id\n                }\n            );\n            return;\n        }\n\n        if (quoteTagNames.includes(value.tag)) {\n            editor.dispatchCommand<LexicalCommand<QuoteCommandPayload>>(INSERT_QUOTE_COMMAND, {\n                themeStyleId: value.id\n            });\n        }\n    }, []);\n\n    useEffect(() => {\n        if (!element) {\n            return;\n        }\n\n        if (isParagraphSelected || isHeadingSelected || isQuoteSelected) {\n            const styleId = element.getStyleId();\n            if (!styleId) {\n                return;\n            }\n\n            const style = theme.getTypographyById(styleId);\n            if (style) {\n                setTypography({\n                    id: style.id,\n                    label: style.label\n                });\n            }\n            return;\n        }\n\n        // list and quote element\n        if ($isListNode(element)) {\n            const styleId = element.getStyleId();\n            if (!styleId) {\n                return;\n            }\n\n            const style = theme.getTypographyById(styleId);\n            if (style) {\n                setTypography({\n                    id: style.id,\n                    label: style.label\n                });\n            }\n        }\n    }, [element, isQuoteSelected, isParagraphSelected, isHeadingSelected]);\n\n    return (\n        <TypographyActionContext.Provider\n            value={{\n                value: typography,\n                applyTypography: onTypographySelect\n            }}\n        >\n            <BaseTypographyActionDropDown />\n        </TypographyActionContext.Provider>\n    );\n};\n\nTypographyAction.TypographyDropDown = TypographyActionDropDown;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE/D,SAASC,OAAO,EAAEC,eAAe,QAAQ,2BAA2B;AAGpE,SAASC,uBAAuB;AAChC,SAASC,cAAc,EAAEC,WAAW,EAAEC,gBAAgB,EAAEC,YAAY,QAAQ,uBAAuB;AACnG,SAASC,iBAAiB;AAM1B,SACIC,2BAA2B,EAC3BC,6BAA6B,EAC7BC,oBAAoB,EACpBC,sBAAsB;AAE1B,SAASC,iBAAiB;;AAE1B;AACA,MAAMC,aAAa,GAAG,CAAC,YAAY,EAAE,YAAY,CAAC;;AAElD;AACA;AACA;AACA;AACA,OAAO,MAAMC,4BAA4B,GAAGb,eAAe,CACvD,8BAA8B,EAC9B,MAA0B;EACtBH,SAAS,CAAC,MAAM;IACZiB,OAAO,CAACC,GAAG,CAAC,qEAAqE,CAAC;EACtF,CAAC,EAAE,EAAE,CAAC;EACN,OAAO,IAAI;AACf,CACJ,CAAC;AAMD,MAAMC,wBAAwB,GAAGA,CAAC;EAAEC;AAAuC,CAAC,KAAkB;EAC1F,oBAAOtB,KAAA,CAAAuB,aAAA,CAACnB,OAAO;IAACoB,SAAS,EAAEN,4BAA6B;IAACO,IAAI,EAAEA,CAAA,KAAM,MAAMH;EAAQ,CAAE,CAAC;AAC1F,CAAC;AAMD,OAAO,MAAMI,gBAAkC,GAAGA,CAAA,KAAM;EACpD,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGzB,QAAQ,CAAmB,CAAC;EAChE,MAAM;IAAE0B,MAAM;IAAEC;EAAM,CAAC,GAAGnB,iBAAiB,CAAC,CAAC;EAC7C,MAAM;IAAEW;EAAQ,CAAC,GAAGN,iBAAiB,CAAC,CAAC;EACvC,MAAMe,mBAAmB,GAAGtB,gBAAgB,CAACa,OAAO,CAAC;EACrD,MAAMU,iBAAiB,GAAGzB,cAAc,CAACe,OAAO,CAAC;EACjD,MAAMW,eAAe,GAAGvB,YAAY,CAACY,OAAO,CAAC;EAE7C,MAAMY,kBAAkB,GAAGjC,WAAW,CAAEkC,KAAsB,IAAK;IAC/DP,aAAa,CAACO,KAAK,CAAC;IAEpB,IAAIA,KAAK,CAACC,GAAG,CAACC,QAAQ,CAAC,GAAG,CAAC,IAAIF,KAAK,CAACC,GAAG,CAACC,QAAQ,CAAC,GAAG,CAAC,EAAE;MACpDR,MAAM,CAACS,eAAe,CAAoCvB,sBAAsB,EAAE;QAC9EoB;MACJ,CAAC,CAAC;MACF;IACJ;IAEA,IAAIA,KAAK,CAACC,GAAG,KAAK,IAAI,EAAE;MACpBP,MAAM,CAACS,eAAe,CAClB1B,2BAA2B,EAC3B;QACI2B,YAAY,EAAEJ,KAAK,CAACK;MACxB,CACJ,CAAC;MACD;IACJ;IAEA,IAAIL,KAAK,CAACC,GAAG,KAAK,IAAI,EAAE;MACpBP,MAAM,CAACS,eAAe,CAClBzB,6BAA6B,EAC7B;QACI0B,YAAY,EAAEJ,KAAK,CAACK;MACxB,CACJ,CAAC;MACD;IACJ;IAEA,IAAIvB,aAAa,CAACoB,QAAQ,CAACF,KAAK,CAACC,GAAG,CAAC,EAAE;MACnCP,MAAM,CAACS,eAAe,CAAsCxB,oBAAoB,EAAE;QAC9EyB,YAAY,EAAEJ,KAAK,CAACK;MACxB,CAAC,CAAC;IACN;EACJ,CAAC,EAAE,EAAE,CAAC;EAENtC,SAAS,CAAC,MAAM;IACZ,IAAI,CAACoB,OAAO,EAAE;MACV;IACJ;IAEA,IAAIS,mBAAmB,IAAIC,iBAAiB,IAAIC,eAAe,EAAE;MAC7D,MAAMQ,OAAO,GAAGnB,OAAO,CAACoB,UAAU,CAAC,CAAC;MACpC,IAAI,CAACD,OAAO,EAAE;QACV;MACJ;MAEA,MAAME,KAAK,GAAGb,KAAK,CAACc,iBAAiB,CAACH,OAAO,CAAC;MAC9C,IAAIE,KAAK,EAAE;QACPf,aAAa,CAAC;UACVY,EAAE,EAAEG,KAAK,CAACH,EAAE;UACZK,KAAK,EAAEF,KAAK,CAACE;QACjB,CAAC,CAAC;MACN;MACA;IACJ;;IAEA;IACA,IAAIrC,WAAW,CAACc,OAAO,CAAC,EAAE;MACtB,MAAMmB,OAAO,GAAGnB,OAAO,CAACoB,UAAU,CAAC,CAAC;MACpC,IAAI,CAACD,OAAO,EAAE;QACV;MACJ;MAEA,MAAME,KAAK,GAAGb,KAAK,CAACc,iBAAiB,CAACH,OAAO,CAAC;MAC9C,IAAIE,KAAK,EAAE;QACPf,aAAa,CAAC;UACVY,EAAE,EAAEG,KAAK,CAACH,EAAE;UACZK,KAAK,EAAEF,KAAK,CAACE;QACjB,CAAC,CAAC;MACN;IACJ;EACJ,CAAC,EAAE,CAACvB,OAAO,EAAEW,eAAe,EAAEF,mBAAmB,EAAEC,iBAAiB,CAAC,CAAC;EAEtE,oBACIhC,KAAA,CAAAuB,aAAA,CAACjB,uBAAuB,CAACwC,QAAQ;IAC7BX,KAAK,EAAE;MACHA,KAAK,EAAER,UAAU;MACjBoB,eAAe,EAAEb;IACrB;EAAE,gBAEFlC,KAAA,CAAAuB,aAAA,CAACL,4BAA4B,MAAE,CACD,CAAC;AAE3C,CAAC;AAEDQ,gBAAgB,CAACsB,kBAAkB,GAAG3B,wBAAwB","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useEffect","useState","Compose","makeDecoratable","TypographyActionContext","$isHeadingNode","$isListNode","$isParagraphNode","$isQuoteNode","useRichTextEditor","INSERT_ORDERED_LIST_COMMAND","INSERT_UNORDERED_LIST_COMMAND","INSERT_QUOTE_COMMAND","ADD_TYPOGRAPHY_COMMAND","useCurrentElement","quoteTagNames","BaseTypographyActionDropDown","console","log","TypographyActionDropDown","element","createElement","component","with","TypographyAction","typography","setTypography","editor","theme","isParagraphSelected","isHeadingSelected","isQuoteSelected","onTypographySelect","value","tag","includes","dispatchCommand","themeStyleId","id","styleId","getStyleId","style","getTypographyById","label","Provider","applyTypography","TypographyDropDown"],"sources":["TypographyAction.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport type { LexicalCommand } from \"lexical\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport type { TypographyValue } from \"@webiny/lexical-theme\";\nimport type { ActiveTypography } from \"~/context/TypographyActionContext.js\";\nimport { TypographyActionContext } from \"~/context/TypographyActionContext.js\";\nimport { $isHeadingNode, $isListNode, $isParagraphNode, $isQuoteNode } from \"@webiny/lexical-nodes\";\nimport { useRichTextEditor } from \"~/hooks/useRichTextEditor.js\";\nimport type {\n    ListCommandPayload,\n    QuoteCommandPayload,\n    TypographyPayload\n} from \"~/commands/index.js\";\nimport {\n    INSERT_ORDERED_LIST_COMMAND,\n    INSERT_UNORDERED_LIST_COMMAND,\n    INSERT_QUOTE_COMMAND,\n    ADD_TYPOGRAPHY_COMMAND\n} from \"~/commands/index.js\";\nimport { useCurrentElement } from \"~/hooks/useCurrentElement.js\";\n\n// Unfortunately, for some time in v5 we had `quoteblock` in our theme, so let's not break it.\nconst quoteTagNames = [\"blockquote\", \"quoteblock\"];\n\n/*\n * Base composable action component that is mounted on toolbar action as a placeholder for the custom toolbar action.\n * Note: Toa add custom component access trough @see LexicalEditorConfig API\n * */\nexport const BaseTypographyActionDropDown = makeDecoratable(\n    \"BaseTypographyActionDropDown\",\n    (): React.JSX.Element | null => {\n        useEffect(() => {\n            console.log(\"Default BaseTypographyActionDropDown, please add your own component\");\n        }, []);\n        return null;\n    }\n);\n\ninterface TypographyActionDropdownProps {\n    element: React.JSX.Element;\n}\n\nconst TypographyActionDropDown = ({\n    element\n}: TypographyActionDropdownProps): React.JSX.Element => {\n    return <Compose component={BaseTypographyActionDropDown} with={() => () => element} />;\n};\n\nexport type TypographyAction = React.ComponentType<unknown> & {\n    TypographyDropDown: typeof TypographyActionDropDown;\n};\n\nexport const TypographyAction: TypographyAction = () => {\n    const [typography, setTypography] = useState<ActiveTypography>();\n    const { editor, theme } = useRichTextEditor();\n    const { element } = useCurrentElement();\n    const isParagraphSelected = $isParagraphNode(element);\n    const isHeadingSelected = $isHeadingNode(element);\n    const isQuoteSelected = $isQuoteNode(element);\n\n    const onTypographySelect = useCallback((value: TypographyValue) => {\n        setTypography(value);\n\n        if (value.tag.includes(\"h\") || value.tag.includes(\"p\")) {\n            editor.dispatchCommand<LexicalCommand<TypographyPayload>>(ADD_TYPOGRAPHY_COMMAND, {\n                value\n            });\n            return;\n        }\n\n        if (value.tag === \"ol\") {\n            editor.dispatchCommand<LexicalCommand<ListCommandPayload>>(\n                INSERT_ORDERED_LIST_COMMAND,\n                {\n                    themeStyleId: value.id\n                }\n            );\n            return;\n        }\n\n        if (value.tag === \"ul\") {\n            editor.dispatchCommand<LexicalCommand<ListCommandPayload>>(\n                INSERT_UNORDERED_LIST_COMMAND,\n                {\n                    themeStyleId: value.id\n                }\n            );\n            return;\n        }\n\n        if (quoteTagNames.includes(value.tag)) {\n            editor.dispatchCommand<LexicalCommand<QuoteCommandPayload>>(INSERT_QUOTE_COMMAND, {\n                themeStyleId: value.id\n            });\n        }\n    }, []);\n\n    useEffect(() => {\n        if (!element) {\n            return;\n        }\n\n        if (isParagraphSelected || isHeadingSelected || isQuoteSelected) {\n            const styleId = element.getStyleId();\n            if (!styleId) {\n                return;\n            }\n\n            const style = theme.getTypographyById(styleId);\n            if (style) {\n                setTypography({\n                    id: style.id,\n                    label: style.label\n                });\n            }\n            return;\n        }\n\n        // list and quote element\n        if ($isListNode(element)) {\n            const styleId = element.getStyleId();\n            if (!styleId) {\n                return;\n            }\n\n            const style = theme.getTypographyById(styleId);\n            if (style) {\n                setTypography({\n                    id: style.id,\n                    label: style.label\n                });\n            }\n        }\n    }, [element, isQuoteSelected, isParagraphSelected, isHeadingSelected]);\n\n    return (\n        <TypographyActionContext.Provider\n            value={{\n                value: typography,\n                applyTypography: onTypographySelect\n            }}\n        >\n            <BaseTypographyActionDropDown />\n        </TypographyActionContext.Provider>\n    );\n};\n\nTypographyAction.TypographyDropDown = TypographyActionDropDown;\n"],"mappings":"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","ignoreList":[]}

package/context/SharedHistoryContext.d.ts

@@ -1,3 +1,4 @@
+import * as React from "react";
 import type { ReactNode } from "react";
 import type { HistoryState } from "@lexical/history";
 type ContextShape = {
@@ -5,6 +6,6 @@ type ContextShape = {
 };
 export declare const SharedHistoryContext: ({ children }: {
     children: ReactNode;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export declare const useSharedHistoryContext: () => ContextShape;
 export {};

package/context/SharedHistoryContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","useContext","useMemo","createEmptyHistoryState","Context","SharedHistoryContext","children","historyContext","historyState","createElement","Provider","value","useSharedHistoryContext"],"sources":["SharedHistoryContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\nimport type { HistoryState } from \"@lexical/history\";\nimport { createEmptyHistoryState } from \"@lexical/history\";\n\ntype ContextShape = {\n    historyState?: HistoryState;\n};\n\nconst Context: React.Context<ContextShape> = createContext({});\n\nexport const SharedHistoryContext = ({ children }: { children: ReactNode }): JSX.Element => {\n    const historyContext = useMemo(() => ({ historyState: createEmptyHistoryState() }), []);\n    return <Context.Provider value={historyContext}>{children}</Context.Provider>;\n};\n\nexport const useSharedHistoryContext = (): ContextShape => {\n    return useContext(Context);\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,aAAa,EAAEC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAE1D,SAASC,uBAAuB,QAAQ,kBAAkB;AAM1D,MAAMC,OAAoC,gBAAGJ,aAAa,CAAC,CAAC,CAAC,CAAC;AAE9D,OAAO,MAAMK,oBAAoB,GAAGA,CAAC;EAAEC;AAAkC,CAAC,KAAkB;EACxF,MAAMC,cAAc,GAAGL,OAAO,CAAC,OAAO;IAAEM,YAAY,EAAEL,uBAAuB,CAAC;EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;EACvF,oBAAOJ,KAAA,CAAAU,aAAA,CAACL,OAAO,CAACM,QAAQ;IAACC,KAAK,EAAEJ;EAAe,GAAED,QAA2B,CAAC;AACjF,CAAC;AAED,OAAO,MAAMM,uBAAuB,GAAGA,CAAA,KAAoB;EACvD,OAAOX,UAAU,CAACG,OAAO,CAAC;AAC9B,CAAC","ignoreList":[]}
+{"version":3,"names":["React","createContext","useContext","useMemo","createEmptyHistoryState","Context","SharedHistoryContext","children","historyContext","historyState","createElement","Provider","value","useSharedHistoryContext"],"sources":["SharedHistoryContext.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\nimport type { HistoryState } from \"@lexical/history\";\nimport { createEmptyHistoryState } from \"@lexical/history\";\n\ntype ContextShape = {\n    historyState?: HistoryState;\n};\n\nconst Context: React.Context<ContextShape> = createContext({});\n\nexport const SharedHistoryContext = ({ children }: { children: ReactNode }): React.JSX.Element => {\n    const historyContext = useMemo(() => ({ historyState: createEmptyHistoryState() }), []);\n    return <Context.Provider value={historyContext}>{children}</Context.Provider>;\n};\n\nexport const useSharedHistoryContext = (): ContextShape => {\n    return useContext(Context);\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,aAAa,EAAEC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAE1D,SAASC,uBAAuB,QAAQ,kBAAkB;AAM1D,MAAMC,OAAoC,gBAAGJ,aAAa,CAAC,CAAC,CAAC,CAAC;AAE9D,OAAO,MAAMK,oBAAoB,GAAGA,CAAC;EAAEC;AAAkC,CAAC,KAAwB;EAC9F,MAAMC,cAAc,GAAGL,OAAO,CAAC,OAAO;IAAEM,YAAY,EAAEL,uBAAuB,CAAC;EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;EACvF,oBAAOJ,KAAA,CAAAU,aAAA,CAACL,OAAO,CAACM,QAAQ;IAACC,KAAK,EAAEJ;EAAe,GAAED,QAA2B,CAAC;AACjF,CAAC;AAED,OAAO,MAAMM,uBAAuB,GAAGA,CAAA,KAAoB;EACvD,OAAOX,UAAU,CAACG,OAAO,CAAC;AAC9B,CAAC","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/lexical-editor",
-	"version": "6.0.0",
+	"version": "6.1.0-beta.1",
 	"type": "module",
 	"repository": {
 		"type": "git",
@@ -9,28 +9,28 @@
 	"license": "MIT",
 	"dependencies": {
 		"@floating-ui/dom": "1.7.6",
-		"@lexical/code": "0.40.0",
-		"@lexical/history": "0.40.0",
-		"@lexical/react": "0.40.0",
-		"@lexical/rich-text": "0.40.0",
-		"@lexical/selection": "0.40.0",
-		"@lexical/text": "0.40.0",
-		"@lexical/utils": "0.40.0",
-		"@webiny/lexical-nodes": "6.0.0",
-		"@webiny/lexical-theme": "6.0.0",
-		"@webiny/react-composition": "6.0.0",
-		"@webiny/react-properties": "6.0.0",
-		"lexical": "0.40.0",
+		"@lexical/code": "0.42.0",
+		"@lexical/history": "0.42.0",
+		"@lexical/react": "0.42.0",
+		"@lexical/rich-text": "0.42.0",
+		"@lexical/selection": "0.42.0",
+		"@lexical/text": "0.42.0",
+		"@lexical/utils": "0.42.0",
+		"@webiny/lexical-nodes": "6.1.0-beta.1",
+		"@webiny/lexical-theme": "6.1.0-beta.1",
+		"@webiny/react-composition": "6.1.0-beta.1",
+		"@webiny/react-properties": "6.1.0-beta.1",
+		"lexical": "0.42.0",
 		"lodash": "4.17.23",
 		"react": "18.2.0",
 		"react-dom": "18.2.0"
 	},
 	"devDependencies": {
-		"@webiny/build-tools": "6.0.0"
+		"@webiny/build-tools": "6.1.0-beta.1"
 	},
 	"publishConfig": {
 		"access": "public",
 		"directory": "dist"
 	},
-	"gitHead": "9c6892640a45679ff521e25cd6587dff57393a2e"
+	"gitHead": "3c1293ba17a14f239fb1cbf5d80cd66846849309"
 }

package/plugins/ImagesPlugin/ImagesPlugin.d.ts

@@ -2,7 +2,7 @@ import type { ImagePayload } from "../../commands/index.js";
 export type InsertImagePayload = Readonly<ImagePayload>;
 export declare function ImagesPlugin({ captionsEnabled }: {
     captionsEnabled?: boolean;
-}): JSX.Element | null;
+}): React.JSX.Element | null;
 declare global {
     interface DragEvent {
         rangeOffset?: number;

package/plugins/ImagesPlugin/ImagesPlugin.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEffect","$createRangeSelection","$getSelection","$isNodeSelection","$setSelection","mergeRegister","COMMAND_PRIORITY_EDITOR","COMMAND_PRIORITY_HIGH","COMMAND_PRIORITY_LOW","DRAGOVER_COMMAND","DRAGSTART_COMMAND","DROP_COMMAND","$isImageNode","ImageNode","INSERT_IMAGE_COMMAND","CAN_USE_DOM","insertImage","useRichTextEditor","getDOMSelection","targetWindow","window","getSelection","ImagesPlugin","captionsEnabled","editor","hasNodes","Error","registerCommand","payload","event","onDragStart","onDragover","onDrop","getDragImage","document","undefined","TRANSPARENT_IMAGE","img","createElement","src","node","getImageNodeInSelection","dataTransfer","dragImage","setData","setDragImage","JSON","stringify","data","id","__id","altText","__altText","height","__height","key","getKey","maxWidth","__maxWidth","__src","width","__width","type","canDropImage","preventDefault","getDragImageData","range","getDragSelection","remove","rangeSelection","applyDOMRange","dispatchCommand","selection","nodes","getNodes","dragData","getData","parse","target","HTMLElement","closest","parentElement","nodeType","defaultView","ownerDocument","domSelection","caretRangeFromPoint","clientX","clientY","rangeParent","collapse","rangeOffset","getRangeAt"],"sources":["ImagesPlugin.tsx"],"sourcesContent":["\"use client\";\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 */\nimport { useEffect } from \"react\";\nimport type { LexicalEditor } from \"lexical\";\nimport {\n    $createRangeSelection,\n    $getSelection,\n    $isNodeSelection,\n    $setSelection,\n    mergeRegister,\n    COMMAND_PRIORITY_EDITOR,\n    COMMAND_PRIORITY_HIGH,\n    COMMAND_PRIORITY_LOW,\n    DRAGOVER_COMMAND,\n    DRAGSTART_COMMAND,\n    DROP_COMMAND\n} from \"lexical\";\nimport { $isImageNode, ImageNode } from \"@webiny/lexical-nodes\";\nimport type { ImagePayload } from \"~/commands/index.js\";\nimport { INSERT_IMAGE_COMMAND } from \"~/commands/index.js\";\nimport { CAN_USE_DOM } from \"~/utils/canUseDOM.js\";\nimport { insertImage } from \"~/utils/insertImage.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\n\nexport type InsertImagePayload = Readonly<ImagePayload>;\n\nconst getDOMSelection = (targetWindow: Window | null): Selection | null =>\n    CAN_USE_DOM ? (targetWindow || window).getSelection() : null;\n\nexport function ImagesPlugin({\n    captionsEnabled\n}: {\n    captionsEnabled?: boolean;\n}): JSX.Element | null {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([ImageNode])) {\n            throw new Error(\"ImagesPlugin: ImageNode not registered in the editor!\");\n        }\n\n        return mergeRegister(\n            editor.registerCommand<InsertImagePayload>(\n                INSERT_IMAGE_COMMAND,\n                payload => insertImage(payload),\n                COMMAND_PRIORITY_EDITOR\n            ),\n            editor.registerCommand<DragEvent>(\n                DRAGSTART_COMMAND,\n                event => {\n                    return onDragStart(event);\n                },\n                COMMAND_PRIORITY_HIGH\n            ),\n            editor.registerCommand<DragEvent>(\n                DRAGOVER_COMMAND,\n                event => {\n                    return onDragover(event);\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand<DragEvent>(\n                DROP_COMMAND,\n                event => {\n                    return onDrop(event, editor);\n                },\n                COMMAND_PRIORITY_HIGH\n            )\n        );\n    }, [captionsEnabled, editor]);\n\n    return null;\n}\n\nfunction getDragImage() {\n    if (!document) {\n        return undefined;\n    }\n\n    const TRANSPARENT_IMAGE =\n        \"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\";\n    const img = document.createElement(\"img\");\n    img.src = TRANSPARENT_IMAGE;\n    return img;\n}\n\nfunction onDragStart(event: DragEvent): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    const dataTransfer = event.dataTransfer;\n    const dragImage = getDragImage();\n    if (!dataTransfer || !dragImage) {\n        return false;\n    }\n    dataTransfer.setData(\"text/plain\", \"_\");\n    dataTransfer.setDragImage(dragImage, 0, 0);\n    dataTransfer.setData(\n        \"application/x-lexical-drag\",\n        JSON.stringify({\n            data: {\n                id: node.__id,\n                altText: node.__altText,\n                height: node.__height,\n                key: node.getKey(),\n                maxWidth: node.__maxWidth,\n                src: node.__src,\n                width: node.__width\n            },\n            type: \"image\"\n        })\n    );\n\n    return true;\n}\n\nfunction onDragover(event: DragEvent): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    if (!canDropImage(event)) {\n        event.preventDefault();\n    }\n    return true;\n}\n\nfunction onDrop(event: DragEvent, editor: LexicalEditor): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    const data = getDragImageData(event);\n    if (!data) {\n        return false;\n    }\n    event.preventDefault();\n    if (canDropImage(event)) {\n        const range = getDragSelection(event);\n        node.remove();\n        const rangeSelection = $createRangeSelection();\n        if (range !== null && range !== undefined) {\n            rangeSelection.applyDOMRange(range);\n        }\n        $setSelection(rangeSelection);\n        editor.dispatchCommand(INSERT_IMAGE_COMMAND, data);\n    }\n    return true;\n}\n\nfunction getImageNodeInSelection(): ImageNode | null {\n    const selection = $getSelection();\n    if (!$isNodeSelection(selection)) {\n        return null;\n    }\n    const nodes = selection.getNodes();\n    const node = nodes[0];\n    return $isImageNode(node) ? node : null;\n}\n\nfunction getDragImageData(event: DragEvent): null | InsertImagePayload {\n    const dragData = event.dataTransfer?.getData(\"application/x-lexical-drag\");\n    if (!dragData) {\n        return null;\n    }\n    const { type, data } = JSON.parse(dragData);\n    if (type !== \"image\") {\n        return null;\n    }\n\n    return data;\n}\n\ndeclare global {\n    interface DragEvent {\n        rangeOffset?: number;\n        rangeParent?: Node;\n    }\n}\n\nfunction canDropImage(event: DragEvent): boolean {\n    const target = event.target;\n    return !!(\n        target &&\n        target instanceof HTMLElement &&\n        !target.closest(\"code, span.editor-image\") &&\n        target.parentElement &&\n        target.parentElement.closest(\"div.ContentEditable__root\")\n    );\n}\n\nfunction getDragSelection(event: DragEvent): Range | null | undefined {\n    let range;\n    const target = event.target as null | Element | Document;\n    const targetWindow =\n        target == null\n            ? null\n            : target.nodeType === 9\n              ? (target as Document).defaultView\n              : (target as Element).ownerDocument.defaultView;\n    const domSelection = getDOMSelection(targetWindow);\n    if (document.caretRangeFromPoint) {\n        range = document.caretRangeFromPoint(event.clientX, event.clientY);\n    } else if (event.rangeParent && domSelection !== null) {\n        domSelection.collapse(event.rangeParent, event.rangeOffset || 0);\n        range = domSelection.getRangeAt(0);\n    } else {\n        throw Error(`Cannot get the selection when dragging`);\n    }\n\n    return range;\n}\n"],"mappings":"AAAA,YAAY;;AACZ;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,OAAO;AAEjC,SACIC,qBAAqB,EACrBC,aAAa,EACbC,gBAAgB,EAChBC,aAAa,EACbC,aAAa,EACbC,uBAAuB,EACvBC,qBAAqB,EACrBC,oBAAoB,EACpBC,gBAAgB,EAChBC,iBAAiB,EACjBC,YAAY,QACT,SAAS;AAChB,SAASC,YAAY,EAAEC,SAAS,QAAQ,uBAAuB;AAE/D,SAASC,oBAAoB;AAC7B,SAASC,WAAW;AACpB,SAASC,WAAW;AACpB,SAASC,iBAAiB;AAI1B,MAAMC,eAAe,GAAIC,YAA2B,IAChDJ,WAAW,GAAG,CAACI,YAAY,IAAIC,MAAM,EAAEC,YAAY,CAAC,CAAC,GAAG,IAAI;AAEhE,OAAO,SAASC,YAAYA,CAAC;EACzBC;AAGJ,CAAC,EAAsB;EACnB,MAAM;IAAEC;EAAO,CAAC,GAAGP,iBAAiB,CAAC,CAAC;EAEtCjB,SAAS,CAAC,MAAM;IACZ,IAAI,CAACwB,MAAM,CAACC,QAAQ,CAAC,CAACZ,SAAS,CAAC,CAAC,EAAE;MAC/B,MAAM,IAAIa,KAAK,CAAC,uDAAuD,CAAC;IAC5E;IAEA,OAAOrB,aAAa,CAChBmB,MAAM,CAACG,eAAe,CAClBb,oBAAoB,EACpBc,OAAO,IAAIZ,WAAW,CAACY,OAAO,CAAC,EAC/BtB,uBACJ,CAAC,EACDkB,MAAM,CAACG,eAAe,CAClBjB,iBAAiB,EACjBmB,KAAK,IAAI;MACL,OAAOC,WAAW,CAACD,KAAK,CAAC;IAC7B,CAAC,EACDtB,qBACJ,CAAC,EACDiB,MAAM,CAACG,eAAe,CAClBlB,gBAAgB,EAChBoB,KAAK,IAAI;MACL,OAAOE,UAAU,CAACF,KAAK,CAAC;IAC5B,CAAC,EACDrB,oBACJ,CAAC,EACDgB,MAAM,CAACG,eAAe,CAClBhB,YAAY,EACZkB,KAAK,IAAI;MACL,OAAOG,MAAM,CAACH,KAAK,EAAEL,MAAM,CAAC;IAChC,CAAC,EACDjB,qBACJ,CACJ,CAAC;EACL,CAAC,EAAE,CAACgB,eAAe,EAAEC,MAAM,CAAC,CAAC;EAE7B,OAAO,IAAI;AACf;AAEA,SAASS,YAAYA,CAAA,EAAG;EACpB,IAAI,CAACC,QAAQ,EAAE;IACX,OAAOC,SAAS;EACpB;EAEA,MAAMC,iBAAiB,GACnB,gFAAgF;EACpF,MAAMC,GAAG,GAAGH,QAAQ,CAACI,aAAa,CAAC,KAAK,CAAC;EACzCD,GAAG,CAACE,GAAG,GAAGH,iBAAiB;EAC3B,OAAOC,GAAG;AACd;AAEA,SAASP,WAAWA,CAACD,KAAgB,EAAW;EAC5C,MAAMW,IAAI,GAAGC,uBAAuB,CAAC,CAAC;EACtC,IAAI,CAACD,IAAI,EAAE;IACP,OAAO,KAAK;EAChB;EACA,MAAME,YAAY,GAAGb,KAAK,CAACa,YAAY;EACvC,MAAMC,SAAS,GAAGV,YAAY,CAAC,CAAC;EAChC,IAAI,CAACS,YAAY,IAAI,CAACC,SAAS,EAAE;IAC7B,OAAO,KAAK;EAChB;EACAD,YAAY,CAACE,OAAO,CAAC,YAAY,EAAE,GAAG,CAAC;EACvCF,YAAY,CAACG,YAAY,CAACF,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;EAC1CD,YAAY,CAACE,OAAO,CAChB,4BAA4B,EAC5BE,IAAI,CAACC,SAAS,CAAC;IACXC,IAAI,EAAE;MACFC,EAAE,EAAET,IAAI,CAACU,IAAI;MACbC,OAAO,EAAEX,IAAI,CAACY,SAAS;MACvBC,MAAM,EAAEb,IAAI,CAACc,QAAQ;MACrBC,GAAG,EAAEf,IAAI,CAACgB,MAAM,CAAC,CAAC;MAClBC,QAAQ,EAAEjB,IAAI,CAACkB,UAAU;MACzBnB,GAAG,EAAEC,IAAI,CAACmB,KAAK;MACfC,KAAK,EAAEpB,IAAI,CAACqB;IAChB,CAAC;IACDC,IAAI,EAAE;EACV,CAAC,CACL,CAAC;EAED,OAAO,IAAI;AACf;AAEA,SAAS/B,UAAUA,CAACF,KAAgB,EAAW;EAC3C,MAAMW,IAAI,GAAGC,uBAAuB,CAAC,CAAC;EACtC,IAAI,CAACD,IAAI,EAAE;IACP,OAAO,KAAK;EAChB;EACA,IAAI,CAACuB,YAAY,CAAClC,KAAK,CAAC,EAAE;IACtBA,KAAK,CAACmC,cAAc,CAAC,CAAC;EAC1B;EACA,OAAO,IAAI;AACf;AAEA,SAAShC,MAAMA,CAACH,KAAgB,EAAEL,MAAqB,EAAW;EAC9D,MAAMgB,IAAI,GAAGC,uBAAuB,CAAC,CAAC;EACtC,IAAI,CAACD,IAAI,EAAE;IACP,OAAO,KAAK;EAChB;EACA,MAAMQ,IAAI,GAAGiB,gBAAgB,CAACpC,KAAK,CAAC;EACpC,IAAI,CAACmB,IAAI,EAAE;IACP,OAAO,KAAK;EAChB;EACAnB,KAAK,CAACmC,cAAc,CAAC,CAAC;EACtB,IAAID,YAAY,CAAClC,KAAK,CAAC,EAAE;IACrB,MAAMqC,KAAK,GAAGC,gBAAgB,CAACtC,KAAK,CAAC;IACrCW,IAAI,CAAC4B,MAAM,CAAC,CAAC;IACb,MAAMC,cAAc,GAAGpE,qBAAqB,CAAC,CAAC;IAC9C,IAAIiE,KAAK,KAAK,IAAI,IAAIA,KAAK,KAAK/B,SAAS,EAAE;MACvCkC,cAAc,CAACC,aAAa,CAACJ,KAAK,CAAC;IACvC;IACA9D,aAAa,CAACiE,cAAc,CAAC;IAC7B7C,MAAM,CAAC+C,eAAe,CAACzD,oBAAoB,EAAEkC,IAAI,CAAC;EACtD;EACA,OAAO,IAAI;AACf;AAEA,SAASP,uBAAuBA,CAAA,EAAqB;EACjD,MAAM+B,SAAS,GAAGtE,aAAa,CAAC,CAAC;EACjC,IAAI,CAACC,gBAAgB,CAACqE,SAAS,CAAC,EAAE;IAC9B,OAAO,IAAI;EACf;EACA,MAAMC,KAAK,GAAGD,SAAS,CAACE,QAAQ,CAAC,CAAC;EAClC,MAAMlC,IAAI,GAAGiC,KAAK,CAAC,CAAC,CAAC;EACrB,OAAO7D,YAAY,CAAC4B,IAAI,CAAC,GAAGA,IAAI,GAAG,IAAI;AAC3C;AAEA,SAASyB,gBAAgBA,CAACpC,KAAgB,EAA6B;EACnE,MAAM8C,QAAQ,GAAG9C,KAAK,CAACa,YAAY,EAAEkC,OAAO,CAAC,4BAA4B,CAAC;EAC1E,IAAI,CAACD,QAAQ,EAAE;IACX,OAAO,IAAI;EACf;EACA,MAAM;IAAEb,IAAI;IAAEd;EAAK,CAAC,GAAGF,IAAI,CAAC+B,KAAK,CAACF,QAAQ,CAAC;EAC3C,IAAIb,IAAI,KAAK,OAAO,EAAE;IAClB,OAAO,IAAI;EACf;EAEA,OAAOd,IAAI;AACf;AASA,SAASe,YAAYA,CAAClC,KAAgB,EAAW;EAC7C,MAAMiD,MAAM,GAAGjD,KAAK,CAACiD,MAAM;EAC3B,OAAO,CAAC,EACJA,MAAM,IACNA,MAAM,YAAYC,WAAW,IAC7B,CAACD,MAAM,CAACE,OAAO,CAAC,yBAAyB,CAAC,IAC1CF,MAAM,CAACG,aAAa,IACpBH,MAAM,CAACG,aAAa,CAACD,OAAO,CAAC,2BAA2B,CAAC,CAC5D;AACL;AAEA,SAASb,gBAAgBA,CAACtC,KAAgB,EAA4B;EAClE,IAAIqC,KAAK;EACT,MAAMY,MAAM,GAAGjD,KAAK,CAACiD,MAAmC;EACxD,MAAM3D,YAAY,GACd2D,MAAM,IAAI,IAAI,GACR,IAAI,GACJA,MAAM,CAACI,QAAQ,KAAK,CAAC,GAClBJ,MAAM,CAAcK,WAAW,GAC/BL,MAAM,CAAaM,aAAa,CAACD,WAAW;EACzD,MAAME,YAAY,GAAGnE,eAAe,CAACC,YAAY,CAAC;EAClD,IAAIe,QAAQ,CAACoD,mBAAmB,EAAE;IAC9BpB,KAAK,GAAGhC,QAAQ,CAACoD,mBAAmB,CAACzD,KAAK,CAAC0D,OAAO,EAAE1D,KAAK,CAAC2D,OAAO,CAAC;EACtE,CAAC,MAAM,IAAI3D,KAAK,CAAC4D,WAAW,IAAIJ,YAAY,KAAK,IAAI,EAAE;IACnDA,YAAY,CAACK,QAAQ,CAAC7D,KAAK,CAAC4D,WAAW,EAAE5D,KAAK,CAAC8D,WAAW,IAAI,CAAC,CAAC;IAChEzB,KAAK,GAAGmB,YAAY,CAACO,UAAU,CAAC,CAAC,CAAC;EACtC,CAAC,MAAM;IACH,MAAMlE,KAAK,CAAC,wCAAwC,CAAC;EACzD;EAEA,OAAOwC,KAAK;AAChB","ignoreList":[]}
+{"version":3,"names":["useEffect","$createRangeSelection","$getSelection","$isNodeSelection","$setSelection","mergeRegister","COMMAND_PRIORITY_EDITOR","COMMAND_PRIORITY_HIGH","COMMAND_PRIORITY_LOW","DRAGOVER_COMMAND","DRAGSTART_COMMAND","DROP_COMMAND","$isImageNode","ImageNode","INSERT_IMAGE_COMMAND","CAN_USE_DOM","insertImage","useRichTextEditor","getDOMSelection","targetWindow","window","getSelection","ImagesPlugin","captionsEnabled","editor","hasNodes","Error","registerCommand","payload","event","onDragStart","onDragover","onDrop","getDragImage","document","undefined","TRANSPARENT_IMAGE","img","createElement","src","node","getImageNodeInSelection","dataTransfer","dragImage","setData","setDragImage","JSON","stringify","data","id","__id","altText","__altText","height","__height","key","getKey","maxWidth","__maxWidth","__src","width","__width","type","canDropImage","preventDefault","getDragImageData","range","getDragSelection","remove","rangeSelection","applyDOMRange","dispatchCommand","selection","nodes","getNodes","dragData","getData","parse","target","HTMLElement","closest","parentElement","nodeType","defaultView","ownerDocument","domSelection","caretRangeFromPoint","clientX","clientY","rangeParent","collapse","rangeOffset","getRangeAt"],"sources":["ImagesPlugin.tsx"],"sourcesContent":["\"use client\";\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 */\nimport { useEffect } from \"react\";\nimport type { LexicalEditor } from \"lexical\";\nimport {\n    $createRangeSelection,\n    $getSelection,\n    $isNodeSelection,\n    $setSelection,\n    mergeRegister,\n    COMMAND_PRIORITY_EDITOR,\n    COMMAND_PRIORITY_HIGH,\n    COMMAND_PRIORITY_LOW,\n    DRAGOVER_COMMAND,\n    DRAGSTART_COMMAND,\n    DROP_COMMAND\n} from \"lexical\";\nimport { $isImageNode, ImageNode } from \"@webiny/lexical-nodes\";\nimport type { ImagePayload } from \"~/commands/index.js\";\nimport { INSERT_IMAGE_COMMAND } from \"~/commands/index.js\";\nimport { CAN_USE_DOM } from \"~/utils/canUseDOM.js\";\nimport { insertImage } from \"~/utils/insertImage.js\";\nimport { useRichTextEditor } from \"~/hooks/index.js\";\n\nexport type InsertImagePayload = Readonly<ImagePayload>;\n\nconst getDOMSelection = (targetWindow: Window | null): Selection | null =>\n    CAN_USE_DOM ? (targetWindow || window).getSelection() : null;\n\nexport function ImagesPlugin({\n    captionsEnabled\n}: {\n    captionsEnabled?: boolean;\n}): React.JSX.Element | null {\n    const { editor } = useRichTextEditor();\n\n    useEffect(() => {\n        if (!editor.hasNodes([ImageNode])) {\n            throw new Error(\"ImagesPlugin: ImageNode not registered in the editor!\");\n        }\n\n        return mergeRegister(\n            editor.registerCommand<InsertImagePayload>(\n                INSERT_IMAGE_COMMAND,\n                payload => insertImage(payload),\n                COMMAND_PRIORITY_EDITOR\n            ),\n            editor.registerCommand<DragEvent>(\n                DRAGSTART_COMMAND,\n                event => {\n                    return onDragStart(event);\n                },\n                COMMAND_PRIORITY_HIGH\n            ),\n            editor.registerCommand<DragEvent>(\n                DRAGOVER_COMMAND,\n                event => {\n                    return onDragover(event);\n                },\n                COMMAND_PRIORITY_LOW\n            ),\n            editor.registerCommand<DragEvent>(\n                DROP_COMMAND,\n                event => {\n                    return onDrop(event, editor);\n                },\n                COMMAND_PRIORITY_HIGH\n            )\n        );\n    }, [captionsEnabled, editor]);\n\n    return null;\n}\n\nfunction getDragImage() {\n    if (!document) {\n        return undefined;\n    }\n\n    const TRANSPARENT_IMAGE =\n        \"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\";\n    const img = document.createElement(\"img\");\n    img.src = TRANSPARENT_IMAGE;\n    return img;\n}\n\nfunction onDragStart(event: DragEvent): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    const dataTransfer = event.dataTransfer;\n    const dragImage = getDragImage();\n    if (!dataTransfer || !dragImage) {\n        return false;\n    }\n    dataTransfer.setData(\"text/plain\", \"_\");\n    dataTransfer.setDragImage(dragImage, 0, 0);\n    dataTransfer.setData(\n        \"application/x-lexical-drag\",\n        JSON.stringify({\n            data: {\n                id: node.__id,\n                altText: node.__altText,\n                height: node.__height,\n                key: node.getKey(),\n                maxWidth: node.__maxWidth,\n                src: node.__src,\n                width: node.__width\n            },\n            type: \"image\"\n        })\n    );\n\n    return true;\n}\n\nfunction onDragover(event: DragEvent): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    if (!canDropImage(event)) {\n        event.preventDefault();\n    }\n    return true;\n}\n\nfunction onDrop(event: DragEvent, editor: LexicalEditor): boolean {\n    const node = getImageNodeInSelection();\n    if (!node) {\n        return false;\n    }\n    const data = getDragImageData(event);\n    if (!data) {\n        return false;\n    }\n    event.preventDefault();\n    if (canDropImage(event)) {\n        const range = getDragSelection(event);\n        node.remove();\n        const rangeSelection = $createRangeSelection();\n        if (range !== null && range !== undefined) {\n            rangeSelection.applyDOMRange(range);\n        }\n        $setSelection(rangeSelection);\n        editor.dispatchCommand(INSERT_IMAGE_COMMAND, data);\n    }\n    return true;\n}\n\nfunction getImageNodeInSelection(): ImageNode | null {\n    const selection = $getSelection();\n    if (!$isNodeSelection(selection)) {\n        return null;\n    }\n    const nodes = selection.getNodes();\n    const node = nodes[0];\n    return $isImageNode(node) ? node : null;\n}\n\nfunction getDragImageData(event: DragEvent): null | InsertImagePayload {\n    const dragData = event.dataTransfer?.getData(\"application/x-lexical-drag\");\n    if (!dragData) {\n        return null;\n    }\n    const { type, data } = JSON.parse(dragData);\n    if (type !== \"image\") {\n        return null;\n    }\n\n    return data;\n}\n\ndeclare global {\n    interface DragEvent {\n        rangeOffset?: number;\n        rangeParent?: Node;\n    }\n}\n\nfunction canDropImage(event: DragEvent): boolean {\n    const target = event.target;\n    return !!(\n        target &&\n        target instanceof HTMLElement &&\n        !target.closest(\"code, span.editor-image\") &&\n        target.parentElement &&\n        target.parentElement.closest(\"div.ContentEditable__root\")\n    );\n}\n\nfunction getDragSelection(event: DragEvent): Range | null | undefined {\n    let range;\n    const target = event.target as null | Element | Document;\n    const targetWindow =\n        target == null\n            ? null\n            : target.nodeType === 9\n              ? (target as Document).defaultView\n              : (target as Element).ownerDocument.defaultView;\n    const domSelection = getDOMSelection(targetWindow);\n    if (document.caretRangeFromPoint) {\n        range = document.caretRangeFromPoint(event.clientX, event.clientY);\n    } else if (event.rangeParent && domSelection !== null) {\n        domSelection.collapse(event.rangeParent, event.rangeOffset || 0);\n        range = domSelection.getRangeAt(0);\n    } else {\n        throw Error(`Cannot get the selection when dragging`);\n    }\n\n    return range;\n}\n"],"mappings":"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","ignoreList":[]}

package/ui/ContentEditable.d.ts

@@ -6,6 +6,7 @@
  *
  */
 import "./ContentEditable.css";
+import * as React from "react";
 export declare function LexicalContentEditable({ className }: {
     className?: string;
-}): JSX.Element;
+}): React.JSX.Element;

package/ui/ContentEditable.js.map

@@ -1 +1 @@
-{"version":3,"names":["ContentEditable","React","LexicalContentEditable","className","createElement"],"sources":["ContentEditable.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\nimport \"./ContentEditable.css\";\n\nimport { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\nimport * as React from \"react\";\n\nexport function LexicalContentEditable({ className }: { className?: string }): JSX.Element {\n    return <ContentEditable className={className || \"ContentEditable__root\"} />;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,SAASA,eAAe,QAAQ,uCAAuC;AACvE,OAAO,KAAKC,KAAK,MAAM,OAAO;AAE9B,OAAO,SAASC,sBAAsBA,CAAC;EAAEC;AAAkC,CAAC,EAAe;EACvF,oBAAOF,KAAA,CAAAG,aAAA,CAACJ,eAAe;IAACG,SAAS,EAAEA,SAAS,IAAI;EAAwB,CAAE,CAAC;AAC/E","ignoreList":[]}
+{"version":3,"names":["ContentEditable","React","LexicalContentEditable","className","createElement"],"sources":["ContentEditable.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\nimport \"./ContentEditable.css\";\n\nimport { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\nimport * as React from \"react\";\n\nexport function LexicalContentEditable({ className }: { className?: string }): React.JSX.Element {\n    return <ContentEditable className={className || \"ContentEditable__root\"} />;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,SAASA,eAAe,QAAQ,uCAAuC;AACvE,OAAO,KAAKC,KAAK,MAAM,OAAO;AAE9B,OAAO,SAASC,sBAAsBA,CAAC;EAAEC;AAAkC,CAAC,EAAqB;EAC7F,oBAAOF,KAAA,CAAAG,aAAA,CAACJ,eAAe;IAACG,SAAS,EAAEA,SAAS,IAAI;EAAwB,CAAE,CAAC;AAC/E","ignoreList":[]}

package/ui/Divider.d.ts

@@ -1 +1,2 @@
-export declare function Divider(): JSX.Element;
+import React from "react";
+export declare function Divider(): React.JSX.Element;

package/ui/Divider.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Divider","createElement","className"],"sources":["Divider.tsx"],"sourcesContent":["import React from \"react\";\n\nexport function Divider(): JSX.Element {\n    return <div className=\"divider\"></div>;\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,SAASC,OAAOA,CAAA,EAAgB;EACnC,oBAAOD,KAAA,CAAAE,aAAA;IAAKC,SAAS,EAAC;EAAS,CAAM,CAAC;AAC1C","ignoreList":[]}
+{"version":3,"names":["React","Divider","createElement","className"],"sources":["Divider.tsx"],"sourcesContent":["import React from \"react\";\n\nexport function Divider(): React.JSX.Element {\n    return <div className=\"divider\"></div>;\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAO,SAASC,OAAOA,CAAA,EAAsB;EACzC,oBAAOD,KAAA,CAAAE,aAAA;IAAKC,SAAS,EAAC;EAAS,CAAM,CAAC;AAC1C","ignoreList":[]}

package/ui/DropDown.d.ts

@@ -22,4 +22,4 @@ export declare function DropDown({ disabled, buttonLabel, buttonAriaLabel, butto
     children: ReactNode;
     stopCloseOnClickSelf?: boolean;
     showScroll?: boolean;
-}): JSX.Element;
+}): React.JSX.Element;

package/ui/DropDown.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useMemo","useRef","useState","DropDownContext","createContext","DropDownItem","children","className","onClick","title","ref","dropDownContext","useContext","Error","registerItem","current","createElement","type","DropDownItems","dropDownRef","showScroll","onClose","items","setItems","highlightedItem","setHighlightedItem","itemRef","prev","handleKeyDown","event","key","includes","preventDefault","index","indexOf","length","contextValue","focus","Provider","value","onKeyDown","DropDown","disabled","buttonLabel","buttonAriaLabel","buttonClassName","buttonIconClassName","stopCloseOnClickSelf","buttonRef","positionIsCalculated","setPositionIsCalculated","showDropDown","setShowDropDown","handleClose","button","dropDown","style","top","left","offsetLeft","handle","target","contains","document","addEventListener","removeEventListener","displayContainer","display","Fragment","position"],"sources":["DropDown.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport type { ReactNode, RefObject } from \"react\";\nimport * as React from \"react\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\ntype DropDownContextType = {\n    registerItem: (ref: React.RefObject<HTMLButtonElement>) => void;\n};\n\nconst DropDownContext = React.createContext<DropDownContextType | null>(null);\n\nexport function DropDownItem({\n    children,\n    className,\n    onClick,\n    title\n}: {\n    children: React.ReactNode;\n    className: string;\n    onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    title?: string;\n}) {\n    const ref = useRef<HTMLButtonElement>(null);\n\n    const dropDownContext = React.useContext(DropDownContext);\n\n    if (dropDownContext === null) {\n        throw new Error(\"DropDownItem must be used within a DropDown\");\n    }\n\n    const { registerItem } = dropDownContext;\n\n    useEffect(() => {\n        if (!ref.current) {\n            return;\n        }\n\n        registerItem(ref as RefObject<HTMLButtonElement>);\n    }, [ref, registerItem]);\n\n    return (\n        <button className={className} onClick={onClick} ref={ref} title={title} type=\"button\">\n            {children}\n        </button>\n    );\n}\n\nfunction DropDownItems({\n    children,\n    dropDownRef,\n    showScroll = true,\n    onClose\n}: {\n    children: React.ReactNode;\n    dropDownRef?: React.Ref<HTMLDivElement>;\n    showScroll?: boolean;\n    onClose: () => void;\n}) {\n    const [items, setItems] = useState<React.RefObject<HTMLButtonElement>[]>();\n    const [highlightedItem, setHighlightedItem] = useState<React.RefObject<HTMLButtonElement>>();\n\n    const registerItem = useCallback(\n        (itemRef: React.RefObject<HTMLButtonElement>) => {\n            setItems(prev => (prev ? [...prev, itemRef] : [itemRef]));\n        },\n        [setItems]\n    );\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!items) {\n            return;\n        }\n\n        const key = event.key;\n\n        if ([\"Escape\", \"ArrowUp\", \"ArrowDown\", \"Tab\"].includes(key)) {\n            event.preventDefault();\n        }\n\n        if (key === \"Escape\" || key === \"Tab\") {\n            onClose();\n        } else if (key === \"ArrowUp\") {\n            setHighlightedItem(prev => {\n                if (!prev) {\n                    return items[0];\n                }\n                const index = items.indexOf(prev) - 1;\n                return items[index === -1 ? items.length - 1 : index];\n            });\n        } else if (key === \"ArrowDown\") {\n            setHighlightedItem(prev => {\n                if (!prev) {\n                    return items[0];\n                }\n                return items[items.indexOf(prev) + 1];\n            });\n        }\n    };\n\n    const contextValue = useMemo(\n        () => ({\n            registerItem\n        }),\n        [registerItem]\n    );\n\n    useEffect(() => {\n        if (items && !highlightedItem) {\n            setHighlightedItem(items[0]);\n        }\n\n        if (highlightedItem && highlightedItem.current) {\n            highlightedItem.current.focus();\n        }\n    }, [items, highlightedItem]);\n\n    return (\n        <DropDownContext.Provider value={contextValue}>\n            <div\n                className={`lexical-dropdown ${showScroll ? \"\" : \"no-scroll\"}`}\n                ref={dropDownRef}\n                onKeyDown={handleKeyDown}\n            >\n                {children}\n            </div>\n        </DropDownContext.Provider>\n    );\n}\n\nexport function DropDown({\n    disabled = false,\n    buttonLabel,\n    buttonAriaLabel,\n    buttonClassName,\n    buttonIconClassName,\n    children,\n    stopCloseOnClickSelf,\n    showScroll = true\n}: {\n    disabled?: boolean;\n    buttonAriaLabel?: string;\n    buttonClassName: string;\n    buttonIconClassName?: string;\n    buttonLabel?: string;\n    children: ReactNode;\n    stopCloseOnClickSelf?: boolean;\n    showScroll?: boolean;\n}): JSX.Element {\n    const dropDownRef = useRef<HTMLDivElement>(null);\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    // Used to prevent flickering of the dropdown while calculating the dropdown position.\n    const [positionIsCalculated, setPositionIsCalculated] = useState(false);\n    const [showDropDown, setShowDropDown] = useState(false);\n\n    const handleClose = () => {\n        setPositionIsCalculated(false);\n        setShowDropDown(false);\n        if (buttonRef && buttonRef.current) {\n            buttonRef.current.focus();\n        }\n    };\n\n    useEffect(() => {\n        const button = buttonRef.current;\n        const dropDown = dropDownRef.current;\n\n        if (showDropDown && button && dropDown) {\n            dropDown.style.top = \"44px\";\n            dropDown.style.left = `${button.offsetLeft}px`;\n            setPositionIsCalculated(true);\n        }\n    }, [dropDownRef, buttonRef, showDropDown]);\n\n    useEffect(() => {\n        const button = buttonRef.current;\n        if (button && showDropDown) {\n            const handle = (event: MouseEvent) => {\n                const target = event.target;\n                if (stopCloseOnClickSelf) {\n                    if (dropDownRef.current && dropDownRef.current.contains(target as Node)) {\n                        return;\n                    }\n                }\n\n                if (!button.contains(target as Node)) {\n                    setShowDropDown(false);\n                }\n            };\n            document.addEventListener(\"click\", handle);\n            return () => {\n                document.removeEventListener(\"click\", handle);\n            };\n        }\n        return;\n    }, [dropDownRef, buttonRef, showDropDown, stopCloseOnClickSelf]);\n\n    const displayContainer = useMemo(() => {\n        // To prevent blinking, we show the container only when the dropdown position is calculated.\n        // Without this, window would be visible first on left (0px), and after a millisecond on the right side.\n        return positionIsCalculated ? { display: \"block\" } : { display: \"none\" };\n    }, [positionIsCalculated]);\n\n    return (\n        <>\n            <button\n                style={{ position: \"relative\" }}\n                disabled={disabled}\n                aria-label={buttonAriaLabel || buttonLabel}\n                className={buttonClassName}\n                onClick={() => setShowDropDown(!showDropDown)}\n                ref={buttonRef}\n            >\n                {buttonIconClassName && <span className={buttonIconClassName} />}\n                {buttonLabel && <span className=\"text dropdown-button-text\">{buttonLabel}</span>}\n                <i className=\"chevron-down\" />\n            </button>\n            {showDropDown && (\n                <div className={\"lexical-dropdown-container\"} style={displayContainer}>\n                    <DropDownItems\n                        showScroll={showScroll}\n                        dropDownRef={dropDownRef}\n                        onClose={handleClose}\n                    >\n                        {children}\n                    </DropDownItems>\n                </div>\n            )}\n        </>\n    );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useEffect","useMemo","useRef","useState","DropDownContext","createContext","DropDownItem","children","className","onClick","title","ref","dropDownContext","useContext","Error","registerItem","current","createElement","type","DropDownItems","dropDownRef","showScroll","onClose","items","setItems","highlightedItem","setHighlightedItem","itemRef","prev","handleKeyDown","event","key","includes","preventDefault","index","indexOf","length","contextValue","focus","Provider","value","onKeyDown","DropDown","disabled","buttonLabel","buttonAriaLabel","buttonClassName","buttonIconClassName","stopCloseOnClickSelf","buttonRef","positionIsCalculated","setPositionIsCalculated","showDropDown","setShowDropDown","handleClose","button","dropDown","style","top","left","offsetLeft","handle","target","contains","document","addEventListener","removeEventListener","displayContainer","display","Fragment","position"],"sources":["DropDown.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport type { ReactNode, RefObject } from \"react\";\nimport * as React from \"react\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\ntype DropDownContextType = {\n    registerItem: (ref: React.RefObject<HTMLButtonElement>) => void;\n};\n\nconst DropDownContext = React.createContext<DropDownContextType | null>(null);\n\nexport function DropDownItem({\n    children,\n    className,\n    onClick,\n    title\n}: {\n    children: React.ReactNode;\n    className: string;\n    onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;\n    title?: string;\n}) {\n    const ref = useRef<HTMLButtonElement>(null);\n\n    const dropDownContext = React.useContext(DropDownContext);\n\n    if (dropDownContext === null) {\n        throw new Error(\"DropDownItem must be used within a DropDown\");\n    }\n\n    const { registerItem } = dropDownContext;\n\n    useEffect(() => {\n        if (!ref.current) {\n            return;\n        }\n\n        registerItem(ref as RefObject<HTMLButtonElement>);\n    }, [ref, registerItem]);\n\n    return (\n        <button className={className} onClick={onClick} ref={ref} title={title} type=\"button\">\n            {children}\n        </button>\n    );\n}\n\nfunction DropDownItems({\n    children,\n    dropDownRef,\n    showScroll = true,\n    onClose\n}: {\n    children: React.ReactNode;\n    dropDownRef?: React.Ref<HTMLDivElement>;\n    showScroll?: boolean;\n    onClose: () => void;\n}) {\n    const [items, setItems] = useState<React.RefObject<HTMLButtonElement>[]>();\n    const [highlightedItem, setHighlightedItem] = useState<React.RefObject<HTMLButtonElement>>();\n\n    const registerItem = useCallback(\n        (itemRef: React.RefObject<HTMLButtonElement>) => {\n            setItems(prev => (prev ? [...prev, itemRef] : [itemRef]));\n        },\n        [setItems]\n    );\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (!items) {\n            return;\n        }\n\n        const key = event.key;\n\n        if ([\"Escape\", \"ArrowUp\", \"ArrowDown\", \"Tab\"].includes(key)) {\n            event.preventDefault();\n        }\n\n        if (key === \"Escape\" || key === \"Tab\") {\n            onClose();\n        } else if (key === \"ArrowUp\") {\n            setHighlightedItem(prev => {\n                if (!prev) {\n                    return items[0];\n                }\n                const index = items.indexOf(prev) - 1;\n                return items[index === -1 ? items.length - 1 : index];\n            });\n        } else if (key === \"ArrowDown\") {\n            setHighlightedItem(prev => {\n                if (!prev) {\n                    return items[0];\n                }\n                return items[items.indexOf(prev) + 1];\n            });\n        }\n    };\n\n    const contextValue = useMemo(\n        () => ({\n            registerItem\n        }),\n        [registerItem]\n    );\n\n    useEffect(() => {\n        if (items && !highlightedItem) {\n            setHighlightedItem(items[0]);\n        }\n\n        if (highlightedItem && highlightedItem.current) {\n            highlightedItem.current.focus();\n        }\n    }, [items, highlightedItem]);\n\n    return (\n        <DropDownContext.Provider value={contextValue}>\n            <div\n                className={`lexical-dropdown ${showScroll ? \"\" : \"no-scroll\"}`}\n                ref={dropDownRef}\n                onKeyDown={handleKeyDown}\n            >\n                {children}\n            </div>\n        </DropDownContext.Provider>\n    );\n}\n\nexport function DropDown({\n    disabled = false,\n    buttonLabel,\n    buttonAriaLabel,\n    buttonClassName,\n    buttonIconClassName,\n    children,\n    stopCloseOnClickSelf,\n    showScroll = true\n}: {\n    disabled?: boolean;\n    buttonAriaLabel?: string;\n    buttonClassName: string;\n    buttonIconClassName?: string;\n    buttonLabel?: string;\n    children: ReactNode;\n    stopCloseOnClickSelf?: boolean;\n    showScroll?: boolean;\n}): React.JSX.Element {\n    const dropDownRef = useRef<HTMLDivElement>(null);\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    // Used to prevent flickering of the dropdown while calculating the dropdown position.\n    const [positionIsCalculated, setPositionIsCalculated] = useState(false);\n    const [showDropDown, setShowDropDown] = useState(false);\n\n    const handleClose = () => {\n        setPositionIsCalculated(false);\n        setShowDropDown(false);\n        if (buttonRef && buttonRef.current) {\n            buttonRef.current.focus();\n        }\n    };\n\n    useEffect(() => {\n        const button = buttonRef.current;\n        const dropDown = dropDownRef.current;\n\n        if (showDropDown && button && dropDown) {\n            dropDown.style.top = \"44px\";\n            dropDown.style.left = `${button.offsetLeft}px`;\n            setPositionIsCalculated(true);\n        }\n    }, [dropDownRef, buttonRef, showDropDown]);\n\n    useEffect(() => {\n        const button = buttonRef.current;\n        if (button && showDropDown) {\n            const handle = (event: MouseEvent) => {\n                const target = event.target;\n                if (stopCloseOnClickSelf) {\n                    if (dropDownRef.current && dropDownRef.current.contains(target as Node)) {\n                        return;\n                    }\n                }\n\n                if (!button.contains(target as Node)) {\n                    setShowDropDown(false);\n                }\n            };\n            document.addEventListener(\"click\", handle);\n            return () => {\n                document.removeEventListener(\"click\", handle);\n            };\n        }\n        return;\n    }, [dropDownRef, buttonRef, showDropDown, stopCloseOnClickSelf]);\n\n    const displayContainer = useMemo(() => {\n        // To prevent blinking, we show the container only when the dropdown position is calculated.\n        // Without this, window would be visible first on left (0px), and after a millisecond on the right side.\n        return positionIsCalculated ? { display: \"block\" } : { display: \"none\" };\n    }, [positionIsCalculated]);\n\n    return (\n        <>\n            <button\n                style={{ position: \"relative\" }}\n                disabled={disabled}\n                aria-label={buttonAriaLabel || buttonLabel}\n                className={buttonClassName}\n                onClick={() => setShowDropDown(!showDropDown)}\n                ref={buttonRef}\n            >\n                {buttonIconClassName && <span className={buttonIconClassName} />}\n                {buttonLabel && <span className=\"text dropdown-button-text\">{buttonLabel}</span>}\n                <i className=\"chevron-down\" />\n            </button>\n            {showDropDown && (\n                <div className={\"lexical-dropdown-container\"} style={displayContainer}>\n                    <DropDownItems\n                        showScroll={showScroll}\n                        dropDownRef={dropDownRef}\n                        onClose={handleClose}\n                    >\n                        {children}\n                    </DropDownItems>\n                </div>\n            )}\n        </>\n    );\n}\n"],"mappings":"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","ignoreList":[]}

package/ui/ImageResizer.d.ts

@@ -6,6 +6,7 @@
  *
  */
 import type { LexicalEditor } from "lexical";
+import * as React from "react";
 export declare function ImageResizer({ onResizeStart, onResizeEnd, buttonRef, imageRef, maxWidth, editor, showCaption, setShowCaption, captionsEnabled }: {
     editor: LexicalEditor;
     buttonRef: {
@@ -20,4 +21,4 @@ export declare function ImageResizer({ onResizeStart, onResizeEnd, buttonRef, im
     setShowCaption: (show: boolean) => void;
     showCaption: boolean;
     captionsEnabled: boolean;
-}): JSX.Element;
+}): React.JSX.Element;

package/ui/ImageResizer.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useRef","clamp","value","min","max","Math","Direction","east","north","south","west","ImageResizer","onResizeStart","onResizeEnd","buttonRef","imageRef","maxWidth","editor","showCaption","setShowCaption","captionsEnabled","controlWrapperRef","userSelect","priority","positioningRef","currentHeight","currentWidth","direction","isResizing","ratio","startHeight","startWidth","startX","startY","editorRootElement","getRootElement","maxWidthContainer","getBoundingClientRect","width","maxHeightContainer","height","minWidth","minHeight","setStartCursor","ew","ns","nwse","cursorDir","style","setProperty","document","body","current","getPropertyValue","getPropertyPriority","setEndCursor","handlePointerDown","event","isEditable","image","controlWrapper","positioning","clientX","clientY","classList","add","addEventListener","handlePointerMove","handlePointerUp","isHorizontal","isVertical","diff","floor","remove","removeEventListener","createElement","ref","className","onClick","onPointerDown"],"sources":["ImageResizer.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport type { LexicalEditor } from \"lexical\";\n\nimport * as React from \"react\";\nimport { useRef } from \"react\";\n\nfunction clamp(value: number, min: number, max: number) {\n    return Math.min(Math.max(value, min), max);\n}\n\nconst Direction = {\n    east: 1 << 0,\n    north: 1 << 3,\n    south: 1 << 1,\n    west: 1 << 2\n};\n\nexport function ImageResizer({\n    onResizeStart,\n    onResizeEnd,\n    buttonRef,\n    imageRef,\n    maxWidth,\n    editor,\n    showCaption,\n    setShowCaption,\n    captionsEnabled\n}: {\n    editor: LexicalEditor;\n    buttonRef: { current: null | HTMLButtonElement };\n    imageRef: { current: null | HTMLElement };\n    maxWidth?: number;\n    onResizeEnd: (width: \"inherit\" | number, height: \"inherit\" | number) => void;\n    onResizeStart: () => void;\n    setShowCaption: (show: boolean) => void;\n    showCaption: boolean;\n    captionsEnabled: boolean;\n}): JSX.Element {\n    const controlWrapperRef = useRef<HTMLDivElement>(null);\n    const userSelect = useRef({\n        priority: \"\",\n        value: \"default\"\n    });\n    const positioningRef = useRef<{\n        currentHeight: \"inherit\" | number;\n        currentWidth: \"inherit\" | number;\n        direction: number;\n        isResizing: boolean;\n        ratio: number;\n        startHeight: number;\n        startWidth: number;\n        startX: number;\n        startY: number;\n    }>({\n        currentHeight: 0,\n        currentWidth: 0,\n        direction: 0,\n        isResizing: false,\n        ratio: 0,\n        startHeight: 0,\n        startWidth: 0,\n        startX: 0,\n        startY: 0\n    });\n    const editorRootElement = editor.getRootElement();\n    // Find max width, accounting for editor padding.\n    const maxWidthContainer = maxWidth\n        ? maxWidth\n        : editorRootElement !== null\n          ? editorRootElement.getBoundingClientRect().width - 20\n          : 100;\n    const maxHeightContainer =\n        editorRootElement !== null ? editorRootElement.getBoundingClientRect().height - 20 : 100;\n\n    const minWidth = 100;\n    const minHeight = 100;\n\n    const setStartCursor = (direction: number) => {\n        const ew = direction === Direction.east || direction === Direction.west;\n        const ns = direction === Direction.north || direction === Direction.south;\n        const nwse =\n            (direction & Direction.north && direction & Direction.west) ||\n            (direction & Direction.south && direction & Direction.east);\n\n        const cursorDir = ew ? \"ew\" : ns ? \"ns\" : nwse ? \"nwse\" : \"nesw\";\n\n        if (editorRootElement !== null) {\n            editorRootElement.style.setProperty(\"cursor\", `${cursorDir}-resize`, \"important\");\n        }\n        if (document.body !== null) {\n            document.body.style.setProperty(\"cursor\", `${cursorDir}-resize`, \"important\");\n            userSelect.current.value = document.body.style.getPropertyValue(\"-webkit-user-select\");\n            userSelect.current.priority =\n                document.body.style.getPropertyPriority(\"-webkit-user-select\");\n            document.body.style.setProperty(\"-webkit-user-select\", `none`, \"important\");\n        }\n    };\n\n    const setEndCursor = () => {\n        if (editorRootElement !== null) {\n            editorRootElement.style.setProperty(\"cursor\", \"text\");\n        }\n        if (document.body !== null) {\n            document.body.style.setProperty(\"cursor\", \"default\");\n            document.body.style.setProperty(\n                \"-webkit-user-select\",\n                userSelect.current.value,\n                userSelect.current.priority\n            );\n        }\n    };\n\n    const handlePointerDown = (event: React.PointerEvent<HTMLDivElement>, direction: number) => {\n        if (!editor.isEditable()) {\n            return;\n        }\n\n        const image = imageRef.current;\n        const controlWrapper = controlWrapperRef.current;\n\n        if (image !== null && controlWrapper !== null) {\n            const { width, height } = image.getBoundingClientRect();\n            const positioning = positioningRef.current;\n            positioning.startWidth = width;\n            positioning.startHeight = height;\n            positioning.ratio = width / height;\n            positioning.currentWidth = width;\n            positioning.currentHeight = height;\n            positioning.startX = event.clientX;\n            positioning.startY = event.clientY;\n            positioning.isResizing = true;\n            positioning.direction = direction;\n\n            setStartCursor(direction);\n            onResizeStart();\n\n            controlWrapper.classList.add(\"image-control-wrapper--resizing\");\n            image.style.height = `${height}px`;\n            image.style.width = `${width}px`;\n\n            document.addEventListener(\"pointermove\", handlePointerMove);\n            document.addEventListener(\"pointerup\", handlePointerUp);\n        }\n    };\n    const handlePointerMove = (event: PointerEvent) => {\n        const image = imageRef.current;\n        const positioning = positioningRef.current;\n\n        const isHorizontal = positioning.direction & (Direction.east | Direction.west);\n        const isVertical = positioning.direction & (Direction.south | Direction.north);\n\n        if (image !== null && positioning.isResizing) {\n            // Corner cursor\n            if (isHorizontal && isVertical) {\n                let diff = Math.floor(positioning.startX - event.clientX);\n                diff = positioning.direction & Direction.east ? -diff : diff;\n\n                const width = clamp(positioning.startWidth + diff, minWidth, maxWidthContainer);\n\n                const height = width / positioning.ratio;\n                image.style.width = `${width}px`;\n                image.style.height = `${height}px`;\n                positioning.currentHeight = height;\n                positioning.currentWidth = width;\n            } else if (isVertical) {\n                let diff = Math.floor(positioning.startY - event.clientY);\n                diff = positioning.direction & Direction.south ? -diff : diff;\n\n                const height = clamp(positioning.startHeight + diff, minHeight, maxHeightContainer);\n\n                image.style.height = `${height}px`;\n                positioning.currentHeight = height;\n            } else {\n                let diff = Math.floor(positioning.startX - event.clientX);\n                diff = positioning.direction & Direction.east ? -diff : diff;\n\n                const width = clamp(positioning.startWidth + diff, minWidth, maxWidthContainer);\n\n                image.style.width = `${width}px`;\n                positioning.currentWidth = width;\n            }\n        }\n    };\n    const handlePointerUp = () => {\n        const image = imageRef.current;\n        const positioning = positioningRef.current;\n        const controlWrapper = controlWrapperRef.current;\n        if (image !== null && controlWrapper !== null && positioning.isResizing) {\n            const width = positioning.currentWidth;\n            const height = positioning.currentHeight;\n            positioning.startWidth = 0;\n            positioning.startHeight = 0;\n            positioning.ratio = 0;\n            positioning.startX = 0;\n            positioning.startY = 0;\n            positioning.currentWidth = 0;\n            positioning.currentHeight = 0;\n            positioning.isResizing = false;\n\n            controlWrapper.classList.remove(\"image-control-wrapper--resizing\");\n\n            setEndCursor();\n            onResizeEnd(width, height);\n\n            document.removeEventListener(\"pointermove\", handlePointerMove);\n            document.removeEventListener(\"pointerup\", handlePointerUp);\n        }\n    };\n    return (\n        <div ref={controlWrapperRef}>\n            {!showCaption && captionsEnabled && (\n                <button\n                    className=\"image-caption-button\"\n                    ref={buttonRef}\n                    onClick={() => {\n                        setShowCaption(!showCaption);\n                    }}\n                >\n                    Add Caption\n                </button>\n            )}\n            <div\n                className=\"image-resizer image-resizer-n\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.north);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-ne\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.north | Direction.east);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-e\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.east);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-se\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.south | Direction.east);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-s\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.south);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-sw\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.south | Direction.west);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-w\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.west);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-nw\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.north | Direction.west);\n                }}\n            />\n        </div>\n    );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useRef","clamp","value","min","max","Math","Direction","east","north","south","west","ImageResizer","onResizeStart","onResizeEnd","buttonRef","imageRef","maxWidth","editor","showCaption","setShowCaption","captionsEnabled","controlWrapperRef","userSelect","priority","positioningRef","currentHeight","currentWidth","direction","isResizing","ratio","startHeight","startWidth","startX","startY","editorRootElement","getRootElement","maxWidthContainer","getBoundingClientRect","width","maxHeightContainer","height","minWidth","minHeight","setStartCursor","ew","ns","nwse","cursorDir","style","setProperty","document","body","current","getPropertyValue","getPropertyPriority","setEndCursor","handlePointerDown","event","isEditable","image","controlWrapper","positioning","clientX","clientY","classList","add","addEventListener","handlePointerMove","handlePointerUp","isHorizontal","isVertical","diff","floor","remove","removeEventListener","createElement","ref","className","onClick","onPointerDown"],"sources":["ImageResizer.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport type { LexicalEditor } from \"lexical\";\n\nimport * as React from \"react\";\nimport { useRef } from \"react\";\n\nfunction clamp(value: number, min: number, max: number) {\n    return Math.min(Math.max(value, min), max);\n}\n\nconst Direction = {\n    east: 1 << 0,\n    north: 1 << 3,\n    south: 1 << 1,\n    west: 1 << 2\n};\n\nexport function ImageResizer({\n    onResizeStart,\n    onResizeEnd,\n    buttonRef,\n    imageRef,\n    maxWidth,\n    editor,\n    showCaption,\n    setShowCaption,\n    captionsEnabled\n}: {\n    editor: LexicalEditor;\n    buttonRef: { current: null | HTMLButtonElement };\n    imageRef: { current: null | HTMLElement };\n    maxWidth?: number;\n    onResizeEnd: (width: \"inherit\" | number, height: \"inherit\" | number) => void;\n    onResizeStart: () => void;\n    setShowCaption: (show: boolean) => void;\n    showCaption: boolean;\n    captionsEnabled: boolean;\n}): React.JSX.Element {\n    const controlWrapperRef = useRef<HTMLDivElement>(null);\n    const userSelect = useRef({\n        priority: \"\",\n        value: \"default\"\n    });\n    const positioningRef = useRef<{\n        currentHeight: \"inherit\" | number;\n        currentWidth: \"inherit\" | number;\n        direction: number;\n        isResizing: boolean;\n        ratio: number;\n        startHeight: number;\n        startWidth: number;\n        startX: number;\n        startY: number;\n    }>({\n        currentHeight: 0,\n        currentWidth: 0,\n        direction: 0,\n        isResizing: false,\n        ratio: 0,\n        startHeight: 0,\n        startWidth: 0,\n        startX: 0,\n        startY: 0\n    });\n    const editorRootElement = editor.getRootElement();\n    // Find max width, accounting for editor padding.\n    const maxWidthContainer = maxWidth\n        ? maxWidth\n        : editorRootElement !== null\n          ? editorRootElement.getBoundingClientRect().width - 20\n          : 100;\n    const maxHeightContainer =\n        editorRootElement !== null ? editorRootElement.getBoundingClientRect().height - 20 : 100;\n\n    const minWidth = 100;\n    const minHeight = 100;\n\n    const setStartCursor = (direction: number) => {\n        const ew = direction === Direction.east || direction === Direction.west;\n        const ns = direction === Direction.north || direction === Direction.south;\n        const nwse =\n            (direction & Direction.north && direction & Direction.west) ||\n            (direction & Direction.south && direction & Direction.east);\n\n        const cursorDir = ew ? \"ew\" : ns ? \"ns\" : nwse ? \"nwse\" : \"nesw\";\n\n        if (editorRootElement !== null) {\n            editorRootElement.style.setProperty(\"cursor\", `${cursorDir}-resize`, \"important\");\n        }\n        if (document.body !== null) {\n            document.body.style.setProperty(\"cursor\", `${cursorDir}-resize`, \"important\");\n            userSelect.current.value = document.body.style.getPropertyValue(\"-webkit-user-select\");\n            userSelect.current.priority =\n                document.body.style.getPropertyPriority(\"-webkit-user-select\");\n            document.body.style.setProperty(\"-webkit-user-select\", `none`, \"important\");\n        }\n    };\n\n    const setEndCursor = () => {\n        if (editorRootElement !== null) {\n            editorRootElement.style.setProperty(\"cursor\", \"text\");\n        }\n        if (document.body !== null) {\n            document.body.style.setProperty(\"cursor\", \"default\");\n            document.body.style.setProperty(\n                \"-webkit-user-select\",\n                userSelect.current.value,\n                userSelect.current.priority\n            );\n        }\n    };\n\n    const handlePointerDown = (event: React.PointerEvent<HTMLDivElement>, direction: number) => {\n        if (!editor.isEditable()) {\n            return;\n        }\n\n        const image = imageRef.current;\n        const controlWrapper = controlWrapperRef.current;\n\n        if (image !== null && controlWrapper !== null) {\n            const { width, height } = image.getBoundingClientRect();\n            const positioning = positioningRef.current;\n            positioning.startWidth = width;\n            positioning.startHeight = height;\n            positioning.ratio = width / height;\n            positioning.currentWidth = width;\n            positioning.currentHeight = height;\n            positioning.startX = event.clientX;\n            positioning.startY = event.clientY;\n            positioning.isResizing = true;\n            positioning.direction = direction;\n\n            setStartCursor(direction);\n            onResizeStart();\n\n            controlWrapper.classList.add(\"image-control-wrapper--resizing\");\n            image.style.height = `${height}px`;\n            image.style.width = `${width}px`;\n\n            document.addEventListener(\"pointermove\", handlePointerMove);\n            document.addEventListener(\"pointerup\", handlePointerUp);\n        }\n    };\n    const handlePointerMove = (event: PointerEvent) => {\n        const image = imageRef.current;\n        const positioning = positioningRef.current;\n\n        const isHorizontal = positioning.direction & (Direction.east | Direction.west);\n        const isVertical = positioning.direction & (Direction.south | Direction.north);\n\n        if (image !== null && positioning.isResizing) {\n            // Corner cursor\n            if (isHorizontal && isVertical) {\n                let diff = Math.floor(positioning.startX - event.clientX);\n                diff = positioning.direction & Direction.east ? -diff : diff;\n\n                const width = clamp(positioning.startWidth + diff, minWidth, maxWidthContainer);\n\n                const height = width / positioning.ratio;\n                image.style.width = `${width}px`;\n                image.style.height = `${height}px`;\n                positioning.currentHeight = height;\n                positioning.currentWidth = width;\n            } else if (isVertical) {\n                let diff = Math.floor(positioning.startY - event.clientY);\n                diff = positioning.direction & Direction.south ? -diff : diff;\n\n                const height = clamp(positioning.startHeight + diff, minHeight, maxHeightContainer);\n\n                image.style.height = `${height}px`;\n                positioning.currentHeight = height;\n            } else {\n                let diff = Math.floor(positioning.startX - event.clientX);\n                diff = positioning.direction & Direction.east ? -diff : diff;\n\n                const width = clamp(positioning.startWidth + diff, minWidth, maxWidthContainer);\n\n                image.style.width = `${width}px`;\n                positioning.currentWidth = width;\n            }\n        }\n    };\n    const handlePointerUp = () => {\n        const image = imageRef.current;\n        const positioning = positioningRef.current;\n        const controlWrapper = controlWrapperRef.current;\n        if (image !== null && controlWrapper !== null && positioning.isResizing) {\n            const width = positioning.currentWidth;\n            const height = positioning.currentHeight;\n            positioning.startWidth = 0;\n            positioning.startHeight = 0;\n            positioning.ratio = 0;\n            positioning.startX = 0;\n            positioning.startY = 0;\n            positioning.currentWidth = 0;\n            positioning.currentHeight = 0;\n            positioning.isResizing = false;\n\n            controlWrapper.classList.remove(\"image-control-wrapper--resizing\");\n\n            setEndCursor();\n            onResizeEnd(width, height);\n\n            document.removeEventListener(\"pointermove\", handlePointerMove);\n            document.removeEventListener(\"pointerup\", handlePointerUp);\n        }\n    };\n    return (\n        <div ref={controlWrapperRef}>\n            {!showCaption && captionsEnabled && (\n                <button\n                    className=\"image-caption-button\"\n                    ref={buttonRef}\n                    onClick={() => {\n                        setShowCaption(!showCaption);\n                    }}\n                >\n                    Add Caption\n                </button>\n            )}\n            <div\n                className=\"image-resizer image-resizer-n\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.north);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-ne\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.north | Direction.east);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-e\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.east);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-se\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.south | Direction.east);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-s\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.south);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-sw\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.south | Direction.west);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-w\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.west);\n                }}\n            />\n            <div\n                className=\"image-resizer image-resizer-nw\"\n                onPointerDown={event => {\n                    handlePointerDown(event, Direction.north | Direction.west);\n                }}\n            />\n        </div>\n    );\n}\n"],"mappings":"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","ignoreList":[]}

package/ui/LinkPreview.d.ts

@@ -6,6 +6,7 @@
  *
  */
 import "./LinkPreview.css";
+import * as React from "react";
 export declare function LinkPreview({ url }: Readonly<{
     url: string;
-}>): JSX.Element;
+}>): React.JSX.Element;

package/ui/LinkPreview.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Suspense","PREVIEW_CACHE","URL_MATCHER","useSuspenseRequest","url","cached","match","preview","fetch","encodeURI","then","response","json","catch","Promise","LinkPreviewContent","createElement","className","img","src","alt","title","domain","description","Glimmer","props","Object","assign","style","animationDelay","String","index","LinkPreview","fallback","Fragment","height","width"],"sources":["LinkPreview.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport \"./LinkPreview.css\";\n\nimport * as React from \"react\";\nimport type { CSSProperties } from \"react\";\nimport { Suspense } from \"react\";\n\ntype Preview = {\n    title: string;\n    description: string;\n    img: string;\n    domain: string;\n} | null;\n\n// Cached responses or running request promises\nconst PREVIEW_CACHE: Record<string, Promise<Preview> | { preview: Preview }> = {};\n\nconst URL_MATCHER =\n    /((https?:\\/\\/(www\\.)?)|(www\\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;\n\nfunction useSuspenseRequest(url: string) {\n    let cached = PREVIEW_CACHE[url];\n\n    if (!url.match(URL_MATCHER)) {\n        return { preview: null };\n    }\n\n    if (!cached) {\n        cached = PREVIEW_CACHE[url] = fetch(`/api/link-preview?url=${encodeURI(url)}`)\n            .then(response => response.json())\n            .then(preview => {\n                PREVIEW_CACHE[url] = preview;\n                return preview;\n            })\n            .catch(() => {\n                PREVIEW_CACHE[url] = { preview: null };\n            });\n    }\n\n    if (cached instanceof Promise) {\n        throw cached;\n    }\n\n    return cached;\n}\n\nfunction LinkPreviewContent({\n    url\n}: Readonly<{\n    url: string;\n}>): JSX.Element | null {\n    const { preview } = useSuspenseRequest(url);\n    if (preview === null) {\n        return null;\n    }\n    return (\n        <div className=\"CustomLinkPreview__container\">\n            {preview.img && (\n                <div className=\"CustomLinkPreview__imageWrapper\">\n                    <img\n                        src={preview.img}\n                        alt={preview.title}\n                        className=\"CustomLinkPreview__image\"\n                    />\n                </div>\n            )}\n            {preview.domain && <div className=\"CustomLinkPreview__domain\">{preview.domain}</div>}\n            {preview.title && <div className=\"CustomLinkPreview__title\">{preview.title}</div>}\n            {preview.description && (\n                <div className=\"CustomLinkPreview__description\">{preview.description}</div>\n            )}\n        </div>\n    );\n}\n\nfunction Glimmer(props: { style: CSSProperties; index: number }): JSX.Element {\n    return (\n        <div\n            className=\"CustomLinkPreview__glimmer\"\n            {...props}\n            style={{\n                animationDelay: String((props.index || 0) * 300),\n                ...(props.style || {})\n            }}\n        />\n    );\n}\n\nexport function LinkPreview({\n    url\n}: Readonly<{\n    url: string;\n}>): JSX.Element {\n    return (\n        <Suspense\n            fallback={\n                <>\n                    <Glimmer style={{ height: \"80px\" }} index={0} />\n                    <Glimmer style={{ width: \"60%\" }} index={1} />\n                    <Glimmer style={{ width: \"80%\" }} index={2} />\n                </>\n            }\n        >\n            <LinkPreviewContent url={url} />\n        </Suspense>\n    );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Suspense","PREVIEW_CACHE","URL_MATCHER","useSuspenseRequest","url","cached","match","preview","fetch","encodeURI","then","response","json","catch","Promise","LinkPreviewContent","createElement","className","img","src","alt","title","domain","description","Glimmer","props","Object","assign","style","animationDelay","String","index","LinkPreview","fallback","Fragment","height","width"],"sources":["LinkPreview.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport \"./LinkPreview.css\";\n\nimport * as React from \"react\";\nimport type { CSSProperties } from \"react\";\nimport { Suspense } from \"react\";\n\ntype Preview = {\n    title: string;\n    description: string;\n    img: string;\n    domain: string;\n} | null;\n\n// Cached responses or running request promises\nconst PREVIEW_CACHE: Record<string, Promise<Preview> | { preview: Preview }> = {};\n\nconst URL_MATCHER =\n    /((https?:\\/\\/(www\\.)?)|(www\\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;\n\nfunction useSuspenseRequest(url: string) {\n    let cached = PREVIEW_CACHE[url];\n\n    if (!url.match(URL_MATCHER)) {\n        return { preview: null };\n    }\n\n    if (!cached) {\n        cached = PREVIEW_CACHE[url] = fetch(`/api/link-preview?url=${encodeURI(url)}`)\n            .then(response => response.json())\n            .then(preview => {\n                PREVIEW_CACHE[url] = preview;\n                return preview;\n            })\n            .catch(() => {\n                PREVIEW_CACHE[url] = { preview: null };\n            });\n    }\n\n    if (cached instanceof Promise) {\n        throw cached;\n    }\n\n    return cached;\n}\n\nfunction LinkPreviewContent({\n    url\n}: Readonly<{\n    url: string;\n}>): React.JSX.Element | null {\n    const { preview } = useSuspenseRequest(url);\n    if (preview === null) {\n        return null;\n    }\n    return (\n        <div className=\"CustomLinkPreview__container\">\n            {preview.img && (\n                <div className=\"CustomLinkPreview__imageWrapper\">\n                    <img\n                        src={preview.img}\n                        alt={preview.title}\n                        className=\"CustomLinkPreview__image\"\n                    />\n                </div>\n            )}\n            {preview.domain && <div className=\"CustomLinkPreview__domain\">{preview.domain}</div>}\n            {preview.title && <div className=\"CustomLinkPreview__title\">{preview.title}</div>}\n            {preview.description && (\n                <div className=\"CustomLinkPreview__description\">{preview.description}</div>\n            )}\n        </div>\n    );\n}\n\nfunction Glimmer(props: { style: CSSProperties; index: number }): React.JSX.Element {\n    return (\n        <div\n            className=\"CustomLinkPreview__glimmer\"\n            {...props}\n            style={{\n                animationDelay: String((props.index || 0) * 300),\n                ...(props.style || {})\n            }}\n        />\n    );\n}\n\nexport function LinkPreview({\n    url\n}: Readonly<{\n    url: string;\n}>): React.JSX.Element {\n    return (\n        <Suspense\n            fallback={\n                <>\n                    <Glimmer style={{ height: \"80px\" }} index={0} />\n                    <Glimmer style={{ width: \"60%\" }} index={1} />\n                    <Glimmer style={{ width: \"80%\" }} index={2} />\n                </>\n            }\n        >\n            <LinkPreviewContent url={url} />\n        </Suspense>\n    );\n}\n"],"mappings":"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","ignoreList":[]}

package/ui/Placeholder.d.ts

@@ -12,4 +12,4 @@ export declare function Placeholder({ children, className, styles }: {
     children: ReactNode;
     className?: string;
     styles?: React.CSSProperties;
-}): JSX.Element;
+}): React.JSX.Element;

package/ui/Placeholder.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Placeholder","children","className","styles","createElement","style"],"sources":["Placeholder.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport \"./Placeholder.css\";\n\nimport * as React from \"react\";\nimport type { ReactNode } from \"react\";\n\nexport function Placeholder({\n    children,\n    className,\n    styles\n}: {\n    children: ReactNode;\n    className?: string;\n    styles?: React.CSSProperties;\n}): JSX.Element {\n    return (\n        <div style={{ ...styles }} className={className || \"Placeholder__root\"}>\n            {children}\n        </div>\n    );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAEA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,OAAO,SAASC,WAAWA,CAAC;EACxBC,QAAQ;EACRC,SAAS;EACTC;AAKJ,CAAC,EAAe;EACZ,oBACIJ,KAAA,CAAAK,aAAA;IAAKC,KAAK,EAAE;MAAE,GAAGF;IAAO,CAAE;IAACD,SAAS,EAAEA,SAAS,IAAI;EAAoB,GAClED,QACA,CAAC;AAEd","ignoreList":[]}
+{"version":3,"names":["React","Placeholder","children","className","styles","createElement","style"],"sources":["Placeholder.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport \"./Placeholder.css\";\n\nimport * as React from \"react\";\nimport type { ReactNode } from \"react\";\n\nexport function Placeholder({\n    children,\n    className,\n    styles\n}: {\n    children: ReactNode;\n    className?: string;\n    styles?: React.CSSProperties;\n}): React.JSX.Element {\n    return (\n        <div style={{ ...styles }} className={className || \"Placeholder__root\"}>\n            {children}\n        </div>\n    );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAEA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,OAAO,SAASC,WAAWA,CAAC;EACxBC,QAAQ;EACRC,SAAS;EACTC;AAKJ,CAAC,EAAqB;EAClB,oBACIJ,KAAA,CAAAK,aAAA;IAAKC,KAAK,EAAE;MAAE,GAAGF;IAAO,CAAE;IAACD,SAAS,EAAEA,SAAS,IAAI;EAAoB,GAClED,QACA,CAAC;AAEd","ignoreList":[]}

package/ui/TextInput.d.ts

@@ -6,6 +6,7 @@
  *
  */
 import "./Input.css";
+import * as React from "react";
 type Props = Readonly<{
     "data-test-id"?: string;
     label: string;
@@ -13,5 +14,5 @@ type Props = Readonly<{
     placeholder?: string;
     value: string;
 }>;
-export default function TextInput({ label, value, onChange, placeholder, "data-test-id": dataTestId }: Props): JSX.Element;
+export default function TextInput({ label, value, onChange, placeholder, "data-test-id": dataTestId }: Props): React.JSX.Element;
 export {};

package/ui/TextInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","TextInput","label","value","onChange","placeholder","dataTestId","createElement","className","type","e","target"],"sources":["TextInput.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport \"./Input.css\";\n\nimport * as React from \"react\";\n\ntype Props = Readonly<{\n    \"data-test-id\"?: string;\n    label: string;\n    onChange: (val: string) => void;\n    placeholder?: string;\n    value: string;\n}>;\n\nexport default function TextInput({\n    label,\n    value,\n    onChange,\n    placeholder = \"\",\n    \"data-test-id\": dataTestId\n}: Props): JSX.Element {\n    return (\n        <div className=\"Input__wrapper\">\n            <label className=\"Input__label\">{label}</label>\n            <input\n                type=\"text\"\n                className=\"Input__input\"\n                placeholder={placeholder}\n                value={value}\n                onChange={e => {\n                    onChange(e.target.value);\n                }}\n                data-test-id={dataTestId}\n            />\n        </div>\n    );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAEA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAU9B,eAAe,SAASC,SAASA,CAAC;EAC9BC,KAAK;EACLC,KAAK;EACLC,QAAQ;EACRC,WAAW,GAAG,EAAE;EAChB,cAAc,EAAEC;AACb,CAAC,EAAe;EACnB,oBACIN,KAAA,CAAAO,aAAA;IAAKC,SAAS,EAAC;EAAgB,gBAC3BR,KAAA,CAAAO,aAAA;IAAOC,SAAS,EAAC;EAAc,GAAEN,KAAa,CAAC,eAC/CF,KAAA,CAAAO,aAAA;IACIE,IAAI,EAAC,MAAM;IACXD,SAAS,EAAC,cAAc;IACxBH,WAAW,EAAEA,WAAY;IACzBF,KAAK,EAAEA,KAAM;IACbC,QAAQ,EAAEM,CAAC,IAAI;MACXN,QAAQ,CAACM,CAAC,CAACC,MAAM,CAACR,KAAK,CAAC;IAC5B,CAAE;IACF,gBAAcG;EAAW,CAC5B,CACA,CAAC;AAEd","ignoreList":[]}
+{"version":3,"names":["React","TextInput","label","value","onChange","placeholder","dataTestId","createElement","className","type","e","target"],"sources":["TextInput.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport \"./Input.css\";\n\nimport * as React from \"react\";\n\ntype Props = Readonly<{\n    \"data-test-id\"?: string;\n    label: string;\n    onChange: (val: string) => void;\n    placeholder?: string;\n    value: string;\n}>;\n\nexport default function TextInput({\n    label,\n    value,\n    onChange,\n    placeholder = \"\",\n    \"data-test-id\": dataTestId\n}: Props): React.JSX.Element {\n    return (\n        <div className=\"Input__wrapper\">\n            <label className=\"Input__label\">{label}</label>\n            <input\n                type=\"text\"\n                className=\"Input__input\"\n                placeholder={placeholder}\n                value={value}\n                onChange={e => {\n                    onChange(e.target.value);\n                }}\n                data-test-id={dataTestId}\n            />\n        </div>\n    );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AAEA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAU9B,eAAe,SAASC,SAASA,CAAC;EAC9BC,KAAK;EACLC,KAAK;EACLC,QAAQ;EACRC,WAAW,GAAG,EAAE;EAChB,cAAc,EAAEC;AACb,CAAC,EAAqB;EACzB,oBACIN,KAAA,CAAAO,aAAA;IAAKC,SAAS,EAAC;EAAgB,gBAC3BR,KAAA,CAAAO,aAAA;IAAOC,SAAS,EAAC;EAAc,GAAEN,KAAa,CAAC,eAC/CF,KAAA,CAAAO,aAAA;IACIE,IAAI,EAAC,MAAM;IACXD,SAAS,EAAC,cAAc;IACxBH,WAAW,EAAEA,WAAY;IACzBF,KAAK,EAAEA,KAAM;IACbC,QAAQ,EAAEM,CAAC,IAAI;MACXN,QAAQ,CAACM,CAAC,CAACC,MAAM,CAACR,KAAK,CAAC;IAC5B,CAAE;IACF,gBAAcG;EAAW,CAC5B,CACA,CAAC;AAEd","ignoreList":[]}

package/ui/ToolbarActionDialog.d.ts

@@ -7,5 +7,5 @@ interface ToolbarActionDialogProps {
     buttonIconClassName: string;
     children: React.ReactNode | React.ReactNode[];
 }
-export declare const ToolbarActionDialog: ({ disabled, buttonAriaLabel, buttonClassName, buttonIconClassName, buttonLabel, children }: ToolbarActionDialogProps) => JSX.Element;
+export declare const ToolbarActionDialog: ({ disabled, buttonAriaLabel, buttonClassName, buttonIconClassName, buttonLabel, children }: ToolbarActionDialogProps) => React.JSX.Element;
 export {};

package/ui/ToolbarActionDialog.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useRef","useState","MenuContainer","children","menuContainerRef","onClose","handleKeyDown","event","key","includes","preventDefault","handleContainerClick","e","createElement","style","position","onClick","top","left","width","backgroundColor","ref","onKeyDown","ToolbarActionDialog","disabled","buttonAriaLabel","buttonClassName","buttonIconClassName","buttonLabel","menuWindowRef","showDropDown","setShowDropDown","handleClose","current","focus","className"],"sources":["ToolbarActionDialog.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\n\nfunction MenuContainer({\n    children,\n    menuContainerRef,\n    onClose\n}: {\n    children: React.ReactNode | React.ReactNode[];\n    menuContainerRef?: React.Ref<HTMLDivElement>;\n    onClose: () => void;\n}) {\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        const key = event.key;\n\n        if ([\"Escape\", \"ArrowUp\", \"ArrowDown\", \"Tab\"].includes(key)) {\n            event.preventDefault();\n        }\n\n        if (key === \"Escape\" || key === \"Tab\") {\n            onClose();\n        }\n    };\n\n    const handleContainerClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        e.preventDefault();\n    };\n\n    return (\n        <div style={{ position: \"relative\" }}>\n            <div\n                onClick={e => handleContainerClick(e)}\n                style={{\n                    position: \"absolute\",\n                    top: -10,\n                    left: 0,\n                    width: 240,\n                    backgroundColor: \"#fff\"\n                }}\n                ref={menuContainerRef ?? null}\n                onKeyDown={handleKeyDown}\n            >\n                {children}\n            </div>\n        </div>\n    );\n}\ninterface ToolbarActionDialogProps {\n    disabled: boolean;\n    buttonLabel?: string;\n    buttonAriaLabel: string;\n    buttonClassName: string;\n    buttonIconClassName: string;\n    children: React.ReactNode | React.ReactNode[];\n}\n\nexport const ToolbarActionDialog = ({\n    disabled,\n    buttonAriaLabel,\n    buttonClassName,\n    buttonIconClassName,\n    buttonLabel,\n    children\n}: ToolbarActionDialogProps): JSX.Element => {\n    const menuWindowRef = useRef<HTMLDivElement>(null);\n    const [showDropDown, setShowDropDown] = useState(false);\n\n    const handleClose = () => {\n        if (menuWindowRef && menuWindowRef.current) {\n            setShowDropDown(false);\n            menuWindowRef.current.focus();\n        }\n    };\n\n    return (\n        <div style={{ position: \"relative\" }}>\n            <button\n                style={{ position: \"relative\" }}\n                disabled={disabled}\n                aria-label={buttonAriaLabel || buttonLabel}\n                className={buttonClassName}\n                onClick={() => {\n                    setShowDropDown(!showDropDown);\n                }}\n            >\n                {buttonIconClassName && <span className={buttonIconClassName} />}\n                {buttonLabel && <span className=\"text dropdown-button-text\">{buttonLabel}</span>}\n                <i className=\"chevron-down\" />\n            </button>\n            {showDropDown && <MenuContainer onClose={handleClose}>{children}</MenuContainer>}\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAE/C,SAASC,aAAaA,CAAC;EACnBC,QAAQ;EACRC,gBAAgB;EAChBC;AAKJ,CAAC,EAAE;EACC,MAAMC,aAAa,GAAIC,KAA0C,IAAK;IAClE,MAAMC,GAAG,GAAGD,KAAK,CAACC,GAAG;IAErB,IAAI,CAAC,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,CAAC,CAACC,QAAQ,CAACD,GAAG,CAAC,EAAE;MACzDD,KAAK,CAACG,cAAc,CAAC,CAAC;IAC1B;IAEA,IAAIF,GAAG,KAAK,QAAQ,IAAIA,GAAG,KAAK,KAAK,EAAE;MACnCH,OAAO,CAAC,CAAC;IACb;EACJ,CAAC;EAED,MAAMM,oBAAoB,GAAIC,CAA+C,IAAK;IAC9EA,CAAC,CAACF,cAAc,CAAC,CAAC;EACtB,CAAC;EAED,oBACIX,KAAA,CAAAc,aAAA;IAAKC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAW;EAAE,gBACjChB,KAAA,CAAAc,aAAA;IACIG,OAAO,EAAEJ,CAAC,IAAID,oBAAoB,CAACC,CAAC,CAAE;IACtCE,KAAK,EAAE;MACHC,QAAQ,EAAE,UAAU;MACpBE,GAAG,EAAE,CAAC,EAAE;MACRC,IAAI,EAAE,CAAC;MACPC,KAAK,EAAE,GAAG;MACVC,eAAe,EAAE;IACrB,CAAE;IACFC,GAAG,EAAEjB,gBAAgB,IAAI,IAAK;IAC9BkB,SAAS,EAAEhB;EAAc,GAExBH,QACA,CACJ,CAAC;AAEd;AAUA,OAAO,MAAMoB,mBAAmB,GAAGA,CAAC;EAChCC,QAAQ;EACRC,eAAe;EACfC,eAAe;EACfC,mBAAmB;EACnBC,WAAW;EACXzB;AACsB,CAAC,KAAkB;EACzC,MAAM0B,aAAa,GAAG7B,MAAM,CAAiB,IAAI,CAAC;EAClD,MAAM,CAAC8B,YAAY,EAAEC,eAAe,CAAC,GAAG9B,QAAQ,CAAC,KAAK,CAAC;EAEvD,MAAM+B,WAAW,GAAGA,CAAA,KAAM;IACtB,IAAIH,aAAa,IAAIA,aAAa,CAACI,OAAO,EAAE;MACxCF,eAAe,CAAC,KAAK,CAAC;MACtBF,aAAa,CAACI,OAAO,CAACC,KAAK,CAAC,CAAC;IACjC;EACJ,CAAC;EAED,oBACInC,KAAA,CAAAc,aAAA;IAAKC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAW;EAAE,gBACjChB,KAAA,CAAAc,aAAA;IACIC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAW,CAAE;IAChCS,QAAQ,EAAEA,QAAS;IACnB,cAAYC,eAAe,IAAIG,WAAY;IAC3CO,SAAS,EAAET,eAAgB;IAC3BV,OAAO,EAAEA,CAAA,KAAM;MACXe,eAAe,CAAC,CAACD,YAAY,CAAC;IAClC;EAAE,GAEDH,mBAAmB,iBAAI5B,KAAA,CAAAc,aAAA;IAAMsB,SAAS,EAAER;EAAoB,CAAE,CAAC,EAC/DC,WAAW,iBAAI7B,KAAA,CAAAc,aAAA;IAAMsB,SAAS,EAAC;EAA2B,GAAEP,WAAkB,CAAC,eAChF7B,KAAA,CAAAc,aAAA;IAAGsB,SAAS,EAAC;EAAc,CAAE,CACzB,CAAC,EACRL,YAAY,iBAAI/B,KAAA,CAAAc,aAAA,CAACX,aAAa;IAACG,OAAO,EAAE2B;EAAY,GAAE7B,QAAwB,CAC9E,CAAC;AAEd,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useRef","useState","MenuContainer","children","menuContainerRef","onClose","handleKeyDown","event","key","includes","preventDefault","handleContainerClick","e","createElement","style","position","onClick","top","left","width","backgroundColor","ref","onKeyDown","ToolbarActionDialog","disabled","buttonAriaLabel","buttonClassName","buttonIconClassName","buttonLabel","menuWindowRef","showDropDown","setShowDropDown","handleClose","current","focus","className"],"sources":["ToolbarActionDialog.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\n\nfunction MenuContainer({\n    children,\n    menuContainerRef,\n    onClose\n}: {\n    children: React.ReactNode | React.ReactNode[];\n    menuContainerRef?: React.Ref<HTMLDivElement>;\n    onClose: () => void;\n}) {\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        const key = event.key;\n\n        if ([\"Escape\", \"ArrowUp\", \"ArrowDown\", \"Tab\"].includes(key)) {\n            event.preventDefault();\n        }\n\n        if (key === \"Escape\" || key === \"Tab\") {\n            onClose();\n        }\n    };\n\n    const handleContainerClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        e.preventDefault();\n    };\n\n    return (\n        <div style={{ position: \"relative\" }}>\n            <div\n                onClick={e => handleContainerClick(e)}\n                style={{\n                    position: \"absolute\",\n                    top: -10,\n                    left: 0,\n                    width: 240,\n                    backgroundColor: \"#fff\"\n                }}\n                ref={menuContainerRef ?? null}\n                onKeyDown={handleKeyDown}\n            >\n                {children}\n            </div>\n        </div>\n    );\n}\ninterface ToolbarActionDialogProps {\n    disabled: boolean;\n    buttonLabel?: string;\n    buttonAriaLabel: string;\n    buttonClassName: string;\n    buttonIconClassName: string;\n    children: React.ReactNode | React.ReactNode[];\n}\n\nexport const ToolbarActionDialog = ({\n    disabled,\n    buttonAriaLabel,\n    buttonClassName,\n    buttonIconClassName,\n    buttonLabel,\n    children\n}: ToolbarActionDialogProps): React.JSX.Element => {\n    const menuWindowRef = useRef<HTMLDivElement>(null);\n    const [showDropDown, setShowDropDown] = useState(false);\n\n    const handleClose = () => {\n        if (menuWindowRef && menuWindowRef.current) {\n            setShowDropDown(false);\n            menuWindowRef.current.focus();\n        }\n    };\n\n    return (\n        <div style={{ position: \"relative\" }}>\n            <button\n                style={{ position: \"relative\" }}\n                disabled={disabled}\n                aria-label={buttonAriaLabel || buttonLabel}\n                className={buttonClassName}\n                onClick={() => {\n                    setShowDropDown(!showDropDown);\n                }}\n            >\n                {buttonIconClassName && <span className={buttonIconClassName} />}\n                {buttonLabel && <span className=\"text dropdown-button-text\">{buttonLabel}</span>}\n                <i className=\"chevron-down\" />\n            </button>\n            {showDropDown && <MenuContainer onClose={handleClose}>{children}</MenuContainer>}\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAE/C,SAASC,aAAaA,CAAC;EACnBC,QAAQ;EACRC,gBAAgB;EAChBC;AAKJ,CAAC,EAAE;EACC,MAAMC,aAAa,GAAIC,KAA0C,IAAK;IAClE,MAAMC,GAAG,GAAGD,KAAK,CAACC,GAAG;IAErB,IAAI,CAAC,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,CAAC,CAACC,QAAQ,CAACD,GAAG,CAAC,EAAE;MACzDD,KAAK,CAACG,cAAc,CAAC,CAAC;IAC1B;IAEA,IAAIF,GAAG,KAAK,QAAQ,IAAIA,GAAG,KAAK,KAAK,EAAE;MACnCH,OAAO,CAAC,CAAC;IACb;EACJ,CAAC;EAED,MAAMM,oBAAoB,GAAIC,CAA+C,IAAK;IAC9EA,CAAC,CAACF,cAAc,CAAC,CAAC;EACtB,CAAC;EAED,oBACIX,KAAA,CAAAc,aAAA;IAAKC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAW;EAAE,gBACjChB,KAAA,CAAAc,aAAA;IACIG,OAAO,EAAEJ,CAAC,IAAID,oBAAoB,CAACC,CAAC,CAAE;IACtCE,KAAK,EAAE;MACHC,QAAQ,EAAE,UAAU;MACpBE,GAAG,EAAE,CAAC,EAAE;MACRC,IAAI,EAAE,CAAC;MACPC,KAAK,EAAE,GAAG;MACVC,eAAe,EAAE;IACrB,CAAE;IACFC,GAAG,EAAEjB,gBAAgB,IAAI,IAAK;IAC9BkB,SAAS,EAAEhB;EAAc,GAExBH,QACA,CACJ,CAAC;AAEd;AAUA,OAAO,MAAMoB,mBAAmB,GAAGA,CAAC;EAChCC,QAAQ;EACRC,eAAe;EACfC,eAAe;EACfC,mBAAmB;EACnBC,WAAW;EACXzB;AACsB,CAAC,KAAwB;EAC/C,MAAM0B,aAAa,GAAG7B,MAAM,CAAiB,IAAI,CAAC;EAClD,MAAM,CAAC8B,YAAY,EAAEC,eAAe,CAAC,GAAG9B,QAAQ,CAAC,KAAK,CAAC;EAEvD,MAAM+B,WAAW,GAAGA,CAAA,KAAM;IACtB,IAAIH,aAAa,IAAIA,aAAa,CAACI,OAAO,EAAE;MACxCF,eAAe,CAAC,KAAK,CAAC;MACtBF,aAAa,CAACI,OAAO,CAACC,KAAK,CAAC,CAAC;IACjC;EACJ,CAAC;EAED,oBACInC,KAAA,CAAAc,aAAA;IAAKC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAW;EAAE,gBACjChB,KAAA,CAAAc,aAAA;IACIC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAW,CAAE;IAChCS,QAAQ,EAAEA,QAAS;IACnB,cAAYC,eAAe,IAAIG,WAAY;IAC3CO,SAAS,EAAET,eAAgB;IAC3BV,OAAO,EAAEA,CAAA,KAAM;MACXe,eAAe,CAAC,CAACD,YAAY,CAAC;IAClC;EAAE,GAEDH,mBAAmB,iBAAI5B,KAAA,CAAAc,aAAA;IAAMsB,SAAS,EAAER;EAAoB,CAAE,CAAC,EAC/DC,WAAW,iBAAI7B,KAAA,CAAAc,aAAA;IAAMsB,SAAS,EAAC;EAA2B,GAAEP,WAAkB,CAAC,eAChF7B,KAAA,CAAAc,aAAA;IAAGsB,SAAS,EAAC;EAAc,CAAE,CACzB,CAAC,EACRL,YAAY,iBAAI/B,KAAA,CAAAc,aAAA,CAACX,aAAa;IAACG,OAAO,EAAE2B;EAAY,GAAE7B,QAAwB,CAC9E,CAAC;AAEd,CAAC","ignoreList":[]}