npm - @pega/cosmos-react-rte - Versions diffs - 2.0.0-dev.10.0 → 2.0.0-dev.13.0 - Mend

@pega/cosmos-react-rte 2.0.0-dev.10.0 → 2.0.0-dev.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (53) hide show

package/lib/components/RichTextEditor/DecoratorComponents/Table.d.ts CHANGED Viewed

@@ -1,4 +1,6 @@
 import { FC } from 'react';
+import { DefaultTheme } from 'styled-components';
+export declare const getTableStyles: (theme: DefaultTheme) => import("styled-components").FlattenSimpleInterpolation;
 export declare const TableBody: FC<any>;
 export declare const Table: FC<any>;
 export declare const TableRow: FC<any>;

package/lib/components/RichTextEditor/DecoratorComponents/Table.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAmB,MAAM,OAAO,CAAC;~~AAoC5C~~,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,GAAG,CAO5B,CAAC;AAEH,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,GAAG,CAOxB,CAAC;AAEH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,GAAG,CAO3B,CAAC;AAEH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,GAAG,CAO5B,CAAC"}
1	+ {"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAmB,MAAM,OAAO,CAAC;AAC5C,OAAe,EAAE,YAAY,EAAO,MAAM,mBAAmB,CAAC;AAI9D,eAAO,MAAM,cAAc,UAAW,YAAY,2DA2BjD,CAAC;AAMF,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,GAAG,CAO5B,CAAC;AAEH,eAAO,MAAM,KAAK,EAAE,EAAE,CAAC,GAAG,CAOxB,CAAC;AAEH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,GAAG,CAO3B,CAAC;AAEH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,GAAG,CAO5B,CAAC"}

package/lib/components/RichTextEditor/DecoratorComponents/Table.js CHANGED Viewed

@@ -1,12 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
-import styled from 'styled-components';
+import styled, { css } from 'styled-components';
 import { defaultThemeProp } from '@pega/cosmos-react-core';
-const StyledTable = styled.table `
+export const getTableStyles = (theme) => css `
   border-collapse: collapse;
   td {
-    border: 0.0625rem solid ${props => props.theme.base.palette['border-line']};
+    border: 0.0625rem solid ${theme.base.palette['border-line']};
     min-width: 6.25rem;
   }
@@ -30,6 +30,7 @@ const StyledTable = styled.table `
     }
   }
 `;
+const StyledTable = styled.table(props => getTableStyles(props.theme));
 StyledTable.defaultProps = defaultThemeProp;
 export const TableBody = forwardRef((props, ref) => {
     const { children, ...restProps } = props;

package/lib/components/RichTextEditor/DecoratorComponents/Table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/Table.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAO,MAAM,OAAO,CAAC;AAC5C,OAAO,MAAM,MAAM,mBAAmB,CAAC;~~AAEvC~~,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,~~WAAW~~,GAAG,~~MAAM~~,CAAC,~~KAAK~~,CAAA;;;;~~8BAIF~~,KAAK,CAAC,~~EAAE~~,CAAC,KAAK,CAAC,KAAK,CAAC,~~IAAI~~,CAAC,~~OAAO~~,CAAC,~~aAAa~~,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;CAuB7E~~,CAAC;~~AAEF~~,WAAW,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE5C,MAAM,CAAC,MAAM,SAAS,GAAY,UAAU,CAAC,CAAC,KAAU,EAAE,GAAa,EAAE,EAAE;IACzE,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,gCAAW,SAAS,IAAE,GAAG,EAAE,GAAG,gBAC3B,QAAQ,YACH,CACT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,KAAK,GAAY,UAAU,CAAC,CAAC,KAAU,EAAE,GAAa,EAAE,EAAE;IACrE,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,KAAC,WAAW,oBAAK,SAAS,IAAE,GAAG,EAAE,GAAG,gBACjC,QAAQ,YACG,CACf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,QAAQ,GAAY,UAAU,CAAC,CAAC,KAAU,EAAE,GAAa,EAAE,EAAE;IACxE,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,6BAAQ,SAAS,IAAE,GAAG,EAAE,GAAG,gBACxB,QAAQ,YACN,CACN,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,SAAS,GAAY,UAAU,CAAC,CAAC,KAAU,EAAE,GAAa,EAAE,EAAE;IACzE,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,6BAAQ,SAAS,IAAE,GAAG,EAAE,GAAG,gBACxB,QAAQ,YACN,CACN,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import { FC, forwardRef, Ref } from 'react';\nimport styled from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\~~nconst~~ ~~StyledTable~~ = ~~styled.table~~`\n border-collapse: collapse;\n\n td {\n border: 0.0625rem solid ${~~props => props.~~theme.base.palette['border-line']};\n min-width: 6.25rem;\n }\n\n tr:first-child {\n td:first-child {\n border-top-left-radius: 0.125rem;\n }\n\n td:last-child {\n border-top-right-radius: 0.125rem;\n }\n }\n\n tr:last-child {\n td:first-child {\n border-bottom-left-radius: 0.125rem;\n }\n\n td:last-child {\n border-bottom-right-radius: 0.125rem;\n }\n }\n`;\n\nStyledTable.defaultProps = defaultThemeProp;\n\nexport const TableBody: FC<any> = forwardRef((props: any, ref: Ref<any>) => {\n const { children, ...restProps } = props;\n return (\n <tbody {...restProps} ref={ref}>\n {children}\n </tbody>\n );\n});\n\nexport const Table: FC<any> = forwardRef((props: any, ref: Ref<any>) => {\n const { children, ...restProps } = props;\n return (\n <StyledTable {...restProps} ref={ref}>\n {children}\n </StyledTable>\n );\n});\n\nexport const TableRow: FC<any> = forwardRef((props: any, ref: Ref<any>) => {\n const { children, ...restProps } = props;\n return (\n <tr {...restProps} ref={ref}>\n {children}\n </tr>\n );\n});\n\nexport const TableCell: FC<any> = forwardRef((props: any, ref: Ref<any>) => {\n const { children, ...restProps } = props;\n return (\n <td {...restProps} ref={ref}>\n {children}\n </td>\n );\n});\n"]}
1	+ {"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/Table.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAO,MAAM,OAAO,CAAC;AAC5C,OAAO,MAAM,EAAE,EAAgB,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAE9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,GAAG,CAAA;;;;8BAI5B,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;;;;;;;;;;;;;;;;;;;;;;CAuB9D,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;AAEvE,WAAW,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE5C,MAAM,CAAC,MAAM,SAAS,GAAY,UAAU,CAAC,CAAC,KAAU,EAAE,GAAa,EAAE,EAAE;IACzE,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,gCAAW,SAAS,IAAE,GAAG,EAAE,GAAG,gBAC3B,QAAQ,YACH,CACT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,KAAK,GAAY,UAAU,CAAC,CAAC,KAAU,EAAE,GAAa,EAAE,EAAE;IACrE,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,KAAC,WAAW,oBAAK,SAAS,IAAE,GAAG,EAAE,GAAG,gBACjC,QAAQ,YACG,CACf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,QAAQ,GAAY,UAAU,CAAC,CAAC,KAAU,EAAE,GAAa,EAAE,EAAE;IACxE,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,6BAAQ,SAAS,IAAE,GAAG,EAAE,GAAG,gBACxB,QAAQ,YACN,CACN,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,SAAS,GAAY,UAAU,CAAC,CAAC,KAAU,EAAE,GAAa,EAAE,EAAE;IACzE,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,6BAAQ,SAAS,IAAE,GAAG,EAAE,GAAG,gBACxB,QAAQ,YACN,CACN,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import { FC, forwardRef, Ref } from 'react';\nimport styled, { DefaultTheme, css } from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nexport const getTableStyles = (theme: DefaultTheme) => css`\n border-collapse: collapse;\n\n td {\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n min-width: 6.25rem;\n }\n\n tr:first-child {\n td:first-child {\n border-top-left-radius: 0.125rem;\n }\n\n td:last-child {\n border-top-right-radius: 0.125rem;\n }\n }\n\n tr:last-child {\n td:first-child {\n border-bottom-left-radius: 0.125rem;\n }\n\n td:last-child {\n border-bottom-right-radius: 0.125rem;\n }\n }\n`;\n\nconst StyledTable = styled.table(props => getTableStyles(props.theme));\n\nStyledTable.defaultProps = defaultThemeProp;\n\nexport const TableBody: FC<any> = forwardRef((props: any, ref: Ref<any>) => {\n const { children, ...restProps } = props;\n return (\n <tbody {...restProps} ref={ref}>\n {children}\n </tbody>\n );\n});\n\nexport const Table: FC<any> = forwardRef((props: any, ref: Ref<any>) => {\n const { children, ...restProps } = props;\n return (\n <StyledTable {...restProps} ref={ref}>\n {children}\n </StyledTable>\n );\n});\n\nexport const TableRow: FC<any> = forwardRef((props: any, ref: Ref<any>) => {\n const { children, ...restProps } = props;\n return (\n <tr {...restProps} ref={ref}>\n {children}\n </tr>\n );\n});\n\nexport const TableCell: FC<any> = forwardRef((props: any, ref: Ref<any>) => {\n const { children, ...restProps } = props;\n return (\n <td {...restProps} ref={ref}>\n {children}\n </td>\n );\n});\n"]}

package/lib/components/RichTextEditor/RichTextEditor.context.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
-import { MouseEvent } from 'react';
+import { MouseEvent, FocusEvent } from 'react';
 export interface RichTextEditorContextValue {
     onImageAdded?: (image: File, id: string) => void;
     setPopoverOpen: (open: boolean) => void;
     onEditorFocus: (args: {
-        event?: MouseEvent | FocusEvent;
+        event?: MouseEvent | FocusEvent<any>;
         force?: boolean;
         runAfterFocus?: () => void;
         focusEditor?: boolean;

package/lib/components/RichTextEditor/RichTextEditor.context.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextEditor.context.d.ts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,UAAU,EAAc,MAAM,OAAO,CAAC;~~AAE9D~~,MAAM,WAAW,0BAA0B;IACzC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,cAAc,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,aAAa,EAAE,CAAC,IAAI,EAAE;QACpB,KAAK,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC;~~QAChC~~,KAAK,CAAC,EAAE,OAAO,CAAC;QAChB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;QAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;KACvB,KAAK,IAAI,CAAC;IACX,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,qBAAqB,qDAKhC,CAAC;AAEH,eAAO,MAAM,aAAa,kCAEzB,CAAC"}
1	+ {"version":3,"file":"RichTextEditor.context.d.ts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,UAAU,EAAc,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1E,MAAM,WAAW,0BAA0B;IACzC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,cAAc,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,aAAa,EAAE,CAAC,IAAI,EAAE;QACpB,KAAK,CAAC,EAAE,UAAU,GAAG,UAAU,CAAC,GAAG,CAAC,CAAC;QACrC,KAAK,CAAC,EAAE,OAAO,CAAC;QAChB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;QAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;KACvB,KAAK,IAAI,CAAC;IACX,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,qBAAqB,qDAKhC,CAAC;AAEH,eAAO,MAAM,aAAa,kCAEzB,CAAC"}

package/lib/components/RichTextEditor/RichTextEditor.context.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextEditor.context.js","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAc,UAAU,~~EAAE~~,MAAM,OAAO,CAAC;~~AAc9D~~,MAAM,CAAC,MAAM,qBAAqB,GAAG,aAAa,CAA6B;IAC7E,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;IACvB,QAAQ,EAAE,KAAK;CAChB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,OAAO,UAAU,CAAC,qBAAqB,CAAC,CAAC;AAC3C,CAAC,CAAC","sourcesContent":["import { createContext, MouseEvent, useContext } from 'react';\n\nexport interface RichTextEditorContextValue {\n onImageAdded?: (image: File, id: string) => void;\n setPopoverOpen: (open: boolean) => void;\n onEditorFocus: (args: {\n event?: MouseEvent \| FocusEvent;\n force?: boolean;\n runAfterFocus?: () => void;\n focusEditor?: boolean;\n }) => void;\n disabled: boolean;\n}\n\nexport const RichTextEditorContext = createContext<RichTextEditorContextValue>({\n onImageAdded: () => {},\n setPopoverOpen: () => {},\n onEditorFocus: () => {},\n disabled: false\n});\n\nexport const useRTEContext = () => {\n return useContext(RichTextEditorContext);\n};\n"]}
1	+ {"version":3,"file":"RichTextEditor.context.js","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAc,UAAU,EAAc,MAAM,OAAO,CAAC;AAc1E,MAAM,CAAC,MAAM,qBAAqB,GAAG,aAAa,CAA6B;IAC7E,YAAY,EAAE,GAAG,EAAE,GAAE,CAAC;IACtB,cAAc,EAAE,GAAG,EAAE,GAAE,CAAC;IACxB,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;IACvB,QAAQ,EAAE,KAAK;CAChB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,OAAO,UAAU,CAAC,qBAAqB,CAAC,CAAC;AAC3C,CAAC,CAAC","sourcesContent":["import { createContext, MouseEvent, useContext, FocusEvent } from 'react';\n\nexport interface RichTextEditorContextValue {\n onImageAdded?: (image: File, id: string) => void;\n setPopoverOpen: (open: boolean) => void;\n onEditorFocus: (args: {\n event?: MouseEvent \| FocusEvent<any>;\n force?: boolean;\n runAfterFocus?: () => void;\n focusEditor?: boolean;\n }) => void;\n disabled: boolean;\n}\n\nexport const RichTextEditorContext = createContext<RichTextEditorContextValue>({\n onImageAdded: () => {},\n setPopoverOpen: () => {},\n onEditorFocus: () => {},\n disabled: false\n});\n\nexport const useRTEContext = () => {\n return useContext(RichTextEditorContext);\n};\n"]}

package/lib/components/RichTextEditor/RichTextEditor.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextEditor.d.ts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,EAAE,EASH,MAAM,OAAO,CAAC;AAQf,OAAO,EAQL,YAAY,~~EAMb~~,MAAM,yBAAyB,CAAC;AAUjC,OAAO,EAAuB,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AA2DlF,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,GAAG,YAAY,~~CA0a1D~~,CAAC;AAEF,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"RichTextEditor.d.ts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,EAAE,EASH,MAAM,OAAO,CAAC;AAQf,OAAO,EAQL,YAAY,EAKb,MAAM,yBAAyB,CAAC;AAUjC,OAAO,EAAuB,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AA2DlF,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,GAAG,YAAY,CA6a1D,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/RichTextEditor/RichTextEditor.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { createEditor, Node } from 'slate';
 // Import the Slate components and React plugin.
 import { Slate, Editable, withReact, ReactEditor } from 'slate-react';
 import styled from 'styled-components';
-import { FormField, FormControl, StyledPopover, useTheme, useUID, createUID, debounce, Popover, Menu, menuHelpers, useAfterInitialEffect } from '@pega/cosmos-react-core';
+import { FormField, FormControl, StyledPopover, useTheme, useUID, createUID, debounce, Popover, Menu, menuHelpers } from '@pega/cosmos-react-core';
 import StyledRichTextEditor, { EditorContainer } from './RichTextEditor.styles';
 import Toolbar from './Toolbar/Toolbar';
 import { nodeRenderer, leafRenderer } from './utils/renderers';
@@ -26,7 +26,6 @@ const withVoids = (editor) => {
     return editor;
 };
 const syntheticFocusReducer = (currentId, action) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     const { type, menuItems, selectedItemId } = action;
     switch (type) {
         case 'child':
@@ -34,24 +33,24 @@ const syntheticFocusReducer = (currentId, action) => {
             if (!currentId)
                 return menuItems[0].id;
             // if currently highlighted item has children, select first of them
-            return (_b = (_a = menuHelpers.getItem(menuItems, currentId)) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b[0].id;
+            return menuHelpers.getItem(menuItems, currentId)?.items?.[0].id;
         case 'parent':
             // find and return parent of currently selected item
-            return (_c = menuHelpers.getParentItem(menuItems, currentId)) === null || _c === void 0 ? void 0 : _c.id;
+            return menuHelpers.getParentItem(menuItems, currentId)?.id;
         case 'next':
             // return next sibling of currently selected item
-            return (_e = (_d = menuHelpers.getNextItem(menuItems, currentId)) === null || _d === void 0 ? void 0 : _d.id) !== null && _e !== void 0 ? _e : currentId;
+            return menuHelpers.getNextItem(menuItems, currentId)?.id ?? currentId;
         case 'prev':
             // return prev sibling of currently selected item
-            return (_g = (_f = menuHelpers.getPrevItem(menuItems, currentId)) === null || _f === void 0 ? void 0 : _f.id) !== null && _g !== void 0 ? _g : currentId;
+            return menuHelpers.getPrevItem(menuItems, currentId)?.id ?? currentId;
         case 'list_change':
             // if currently selected item does not exist in new list, select first one
             if (currentId && menuHelpers.getItem(menuItems, currentId))
                 return currentId;
-            return (_h = menuItems[0]) === null || _h === void 0 ? void 0 : _h.id;
+            return menuItems[0]?.id;
         case 'set':
             // return arbitrary selected item id if it is in the tree; undefined otherwise
-            return selectedItemId ? (_j = menuHelpers.getItem(menuItems, selectedItemId)) === null || _j === void 0 ? void 0 : _j.id : undefined;
+            return selectedItemId ? menuHelpers.getItem(menuItems, selectedItemId)?.id : undefined;
         case 'clear':
             return undefined;
         default:
@@ -77,8 +76,7 @@ const RichTextEditor = forwardRef((props, ref) => {
     const [popoverTarget, setPopoverTarget] = useState(null);
     const [searchEl, setSearchEl] = useState(null);
     const updateToolbarStyle = () => {
-        var _a;
-        if ((((_a = formFieldRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) || 0) > window.innerHeight) {
+        if ((formFieldRef.current?.offsetHeight || 0) > window.innerHeight) {
             setToolbarSticky(true);
         }
         else {
@@ -91,7 +89,7 @@ const RichTextEditor = forwardRef((props, ref) => {
             .map(node => {
             if (markdownOnly && node.children) {
                 return node.children
-                    .map(textNode => { var _a; return ((_a = textNode.searchResult) === null || _a === void 0 ? void 0 : _a.markdown) || textNode.text; })
+                    .map(textNode => textNode.searchResult?.markdown || textNode.text)
                     .join('');
             }
             return Node.string(node);
@@ -100,18 +98,22 @@ const RichTextEditor = forwardRef((props, ref) => {
     };
     const onEditorFocus = ({ event, force, focusEditor, runAfterFocus }) => {
         if (focusEditor) {
-            ReactEditor.focus(editor);
+            setTimeout(() => {
+                ReactEditor.focus(editor);
+            }, 0);
         }
         if (runAfterFocus && (force || (!disabled && !toolbarPopover))) {
             setTimeout(runAfterFocus, 0);
         }
         else {
-            event === null || event === void 0 ? void 0 : event.stopPropagation();
+            event?.stopPropagation();
         }
     };
     const blurEditor = () => {
-        ReactEditor.blur(editor);
-        onBlur === null || onBlur === void 0 ? void 0 : onBlur();
+        if (ReactEditor.isFocused(editor)) {
+            ReactEditor.blur(editor);
+            onBlur?.();
+        }
     };
     useImperativeHandle(ref, () => ({
         focus: () => {
@@ -144,10 +146,9 @@ const RichTextEditor = forwardRef((props, ref) => {
         }
     }), [value, setValue]);
     const onMenuItemClick = (itemId, e) => {
-        var _a;
         // MenuItem expects actual click events, but we don't have reference to actual menu item element to trigger a click.
-        (_a = menu === null || menu === void 0 ? void 0 : menu.onItemClick) === null || _a === void 0 ? void 0 : _a.call(menu, itemId, e);
-        const replacement = getSearchItemReplacement === null || getSearchItemReplacement === void 0 ? void 0 : getSearchItemReplacement(itemId);
+        menu?.onItemClick?.(itemId, e);
+        const replacement = getSearchItemReplacement?.(itemId);
         if (replacement) {
             let node;
             if (replacement.markdown && replacement.component && replacement.props) {
@@ -215,7 +216,7 @@ const RichTextEditor = forwardRef((props, ref) => {
     const addImage = (file) => {
         const placeholderId = EditorCommands.appendImagePlaceholder(editor);
         if (placeholderId)
-            onImageAdded === null || onImageAdded === void 0 ? void 0 : onImageAdded(file, placeholderId);
+            onImageAdded?.(file, placeholderId);
     };
     const onPaste = (e) => {
         let image;
@@ -246,15 +247,14 @@ const RichTextEditor = forwardRef((props, ref) => {
         }
     }, [popoverTarget]);
     useEffect(() => {
-        onChange === null || onChange === void 0 ? void 0 : onChange();
+        onChange?.();
     }, [value]);
     useEffect(() => {
-        var _a;
         if (menu && popoverTarget) {
             dispatchFocus({
                 type: 'set',
                 menuItems: menu.items,
-                selectedItemId: (_a = menu.items[0]) === null || _a === void 0 ? void 0 : _a.id
+                selectedItemId: menu.items[0]?.id
             });
         }
     }, [menu, popoverTarget]);
@@ -265,11 +265,6 @@ const RichTextEditor = forwardRef((props, ref) => {
             }, 0);
         }
     }, []);
-    useAfterInitialEffect(() => {
-        if (!menu) {
-            ReactEditor.focus(editor);
-        }
-    }, [menu]);
     return (_jsx(RichTextEditorContext.Provider, Object.assign({ value: {
             onImageAdded,
             setPopoverOpen: setToolbarPopover,
@@ -278,9 +273,10 @@ const RichTextEditor = forwardRef((props, ref) => {
         } }, { children: _jsx(FormField, Object.assign({ label:
             // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events
             _jsx("span", Object.assign({ onClick: () => onEditorFocus({ focusEditor: true }) }, { children: label }), void 0), labelHidden: labelHidden, id: id, labelOrder: -1, info: info, status: status, required: required, disabled: disabled, readOnly: readOnly, onDrop: onDrop, onFocus: (e) => {
-                if (e.target === formFieldRef.current)
-                    onEditorFocus({});
-            }, ref: formFieldRef, "aria-label": `${label} ${!markdownOnly && !readOnly && (toolbar === null || toolbar === void 0 ? void 0 : toolbar.length) ? 'Hit tab to edit toolbar below' : ''}` }, { children: _jsxs(Slate, Object.assign({ editor: editor, value: value, onChange: newValue => {
+                if (e.target === formFieldRef.current) {
+                    onEditorFocus({ focusEditor: true });
+                }
+            }, onBlur: blurEditor, ref: formFieldRef, "aria-label": `${label} ${!markdownOnly && !readOnly && toolbar?.length ? 'Hit tab to edit toolbar below' : ''}` }, { children: _jsxs(Slate, Object.assign({ editor: editor, value: value, onChange: newValue => {
                     if (!disabled) {
                         setValue(newValue);
                         debouncedUpdateToolbarStyle();
@@ -320,26 +316,27 @@ const RichTextEditor = forwardRef((props, ref) => {
                             }
                         }
                     }
-                } }, { children: [_jsxs(FormControl, Object.assign({}, restProps, { ref: ref, ariaLabel: label, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, as: StyledRichTextEditor, toolbar: !!(!markdownOnly && (toolbar === null || toolbar === void 0 ? void 0 : toolbar.length)), onClick: () => {
-                            onEditorFocus({ focusEditor: true });
-                        }, focused: ReactEditor.isFocused(editor) }, { children: [_jsx(EditorContainer, Object.assign({ toolbar: !!(!markdownOnly && (toolbar === null || toolbar === void 0 ? void 0 : toolbar.length)), containerHeight: height, onClick: () => {
-                                    if (!disabled) {
+                } }, { children: [_jsxs(FormControl, Object.assign({}, restProps, { ref: ref, ariaLabel: label, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, as: StyledRichTextEditor, toolbar: !!(!markdownOnly && toolbar?.length), onClick: () => {
+                            if (!ReactEditor.isFocused(editor))
+                                onEditorFocus({ focusEditor: true });
+                        }, focused: ReactEditor.isFocused(editor) }, { children: [_jsx(EditorContainer, Object.assign({ toolbar: !!(!markdownOnly && toolbar?.length), containerHeight: height, onClick: () => {
+                                    if (!disabled && !ReactEditor.isFocused(editor)) {
                                         onEditorFocus({ focusEditor: true });
-                                        onFocus === null || onFocus === void 0 ? void 0 : onFocus();
+                                        onFocus?.();
                                     }
-                                } }, { children: _jsx(Editable, { renderElement: nodeRenderer, renderLeaf: leafRenderer, onKeyDown: onKeyDown, onKeyUp: onKeyUp, placeholder: placeholder, onFocus: () => {
+                                } }, { children: _jsx(Editable, { renderElement: nodeRenderer, renderLeaf: leafRenderer, onKeyDown: onKeyDown, onKeyUp: onKeyUp, placeholder: placeholder, onFocus: event => {
                                         if (!disabled) {
-                                            onEditorFocus({});
-                                            onFocus === null || onFocus === void 0 ? void 0 : onFocus();
+                                            if (!ReactEditor.isFocused(editor)) {
+                                                onEditorFocus({ focusEditor: true, event });
+                                                onFocus?.();
+                                            }
                                         }
                                         else {
                                             blurEditor();
                                         }
-                                    }, onBlur: blurEditor, disabled: disabled, readOnly: readOnly, onPaste: onPaste }, void 0) }), void 0),
-                            !markdownOnly && !readOnly && (toolbar === null || toolbar === void 0 ? void 0 : toolbar.length) ? (_jsx(Toolbar, { features: toolbar, sticky: toolbarSticky, setFocusableBtn: el => {
+                                    }, onBlur: blurEditor, disabled: disabled, readOnly: readOnly, onPaste: onPaste }, void 0) }), void 0), !markdownOnly && !readOnly && toolbar?.length ? (_jsx(Toolbar, { features: toolbar, sticky: toolbarSticky, setFocusableBtn: el => {
                                     setFocusableToolbarBtn(el);
-                                } }, void 0)) : null] }), void 0),
-                    _jsx(Popover, Object.assign({ show: !!popoverTarget && !!menu, strategy: 'fixed', target: searchEl, placement: 'bottom-start' }, { children: menu && (_jsx(Menu, Object.assign({}, menu, { as: StyledSearchPopover, currentItemId: focusedId, mode: 'action', onItemClick: onMenuItemClick }), void 0)) }), void 0)] }), void 0) }), void 0) }), void 0));
+                                } }, void 0)) : null] }), void 0), _jsx(Popover, Object.assign({ show: !!popoverTarget && !!menu, strategy: 'fixed', target: searchEl, placement: 'bottom-start' }, { children: menu && (_jsx(Menu, Object.assign({}, menu, { as: StyledSearchPopover, currentItemId: focusedId, mode: 'action', onItemClick: onMenuItemClick }), void 0)) }), void 0)] }), void 0) }), void 0) }), void 0));
 });
 export default RichTextEditor;
 //# sourceMappingURL=RichTextEditor.js.map

package/lib/components/RichTextEditor/RichTextEditor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextEditor.js","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n PropsWithoutRef,\n Ref,\n useState,\n useRef,\n useMemo,\n FC,\n useEffect,\n useCallback,\n MouseEvent,\n KeyboardEvent,\n useImperativeHandle,\n ClipboardEvent,\n FocusEvent,\n useReducer\n} from 'react';\n// Import the Slate editor factory.\nimport { createEditor, Editor, Node, Element, Text, Range } from 'slate';\n// Import the Slate components and React plugin.\nimport { Slate, Editable, withReact, ReactEditor } from 'slate-react';\nimport styled from 'styled-components';\nimport { VirtualElement } from '@popperjs/core';\n\nimport {\n FormField,\n FormControl,\n StyledPopover,\n useTheme,\n useUID,\n createUID,\n debounce,\n ForwardProps,\n Popover,\n Menu,\n menuHelpers,\n MenuItemProps,\n useAfterInitialEffect\n} from '@pega/cosmos-react-core';\n\nimport StyledRichTextEditor, { EditorContainer } from './RichTextEditor.styles';\nimport Toolbar from './Toolbar/Toolbar';\nimport { nodeRenderer, leafRenderer } from './utils/renderers';\nimport { onSearchChange } from './utils/search';\nimport EditorCommands from './utils/EditorCommands';\nimport ListCommands from './utils/ListCommands';\nimport { convertHtml } from './utils/htmlConverter';\nimport { convertSlateToHtml } from './utils/slateConverter';\nimport { RichTextEditorState, RichTextEditorProps } from './RichTextEditor.types';\nimport { RichTextEditorContext, RichTextEditorContextValue } from './RichTextEditor.context';\nimport { convertMarkdownForEditor } from './utils/markdownConverter';\n\ntype SyntheticActionType = 'prev' \| 'next' \| 'child' \| 'parent' \| 'list_change' \| 'set' \| 'clear';\n\nconst withVoids = (editor: Editor): ReactEditor => {\n editor.isVoid = element => {\n if (element.type === 'image' \|\| element.type === 'image-placeholder') {\n return true;\n }\n return false;\n };\n\n return editor as ReactEditor;\n};\n\nconst syntheticFocusReducer = (\n currentId: string \| undefined,\n action: {\n type: SyntheticActionType;\n menuItems: MenuItemProps[];\n selectedItemId?: MenuItemProps['id'];\n }\n): string \| undefined => {\n const { type, menuItems, selectedItemId } = action;\n switch (type) {\n case 'child':\n // return first item id if top-level\n if (!currentId) return menuItems[0].id;\n // if currently highlighted item has children, select first of them\n return menuHelpers.getItem(menuItems, currentId)?.items?.[0].id;\n case 'parent':\n // find and return parent of currently selected item\n return menuHelpers.getParentItem(menuItems, currentId)?.id;\n case 'next':\n // return next sibling of currently selected item\n return menuHelpers.getNextItem(menuItems, currentId)?.id ?? currentId;\n case 'prev':\n // return prev sibling of currently selected item\n return menuHelpers.getPrevItem(menuItems, currentId)?.id ?? currentId;\n case 'list_change':\n // if currently selected item does not exist in new list, select first one\n if (currentId && menuHelpers.getItem(menuItems, currentId)) return currentId;\n return menuItems[0]?.id;\n case 'set':\n // return arbitrary selected item id if it is in the tree; undefined otherwise\n return selectedItemId ? menuHelpers.getItem(menuItems, selectedItemId)?.id : undefined;\n case 'clear':\n return undefined;\n default:\n return currentId;\n }\n};\n\nconst StyledSearchPopover = styled(StyledPopover)`\n min-width: 20rem;\n`;\n\nconst RichTextEditor: FC<RichTextEditorProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<RichTextEditorProps>, ref: Ref<RichTextEditorState>) => {\n const {\n components: {\n 'text-area': { 'min-height': minHeight }\n }\n } = useTheme();\n const uid = useUID();\n const {\n id = uid,\n label,\n labelHidden,\n info,\n status,\n required,\n disabled,\n readOnly,\n onChange,\n onFocus,\n onBlur,\n placeholder,\n toolbar,\n onImageAdded,\n markdownOnly,\n searchTriggers,\n onSearch,\n getSearchItemReplacement,\n searchRenderers,\n menu,\n height = { min: minHeight },\n defaultValue,\n autoFocus,\n ...restProps\n } = props;\n\n const formFieldRef = useRef<HTMLElement>(null);\n const editor = useMemo(() => withVoids(withReact(createEditor())), []);\n const [value, setValue] = useState<(Element \| Text)[]>(\n defaultValue && !markdownOnly\n ? convertHtml(defaultValue)\n : convertMarkdownForEditor(defaultValue, searchRenderers)\n );\n const [toolbarPopover, setToolbarPopover] = useState(false);\n const [toolbarSticky, setToolbarSticky] = useState(false);\n const [focusableToolbarBtn, setFocusableToolbarBtn] = useState<HTMLElement \| null>(null);\n const [focusedId, dispatchFocus] = useReducer(syntheticFocusReducer, undefined);\n\n const [popoverTarget, setPopoverTarget] = useState<Range \| null>(null);\n const [searchEl, setSearchEl] = useState<VirtualElement \| null>(null);\n\n const updateToolbarStyle = () => {\n if ((formFieldRef.current?.offsetHeight \|\| 0) > window.innerHeight) {\n setToolbarSticky(true);\n } else {\n setToolbarSticky(false);\n }\n };\n\n const debouncedUpdateToolbarStyle = debounce(updateToolbarStyle, 200);\n\n const getPlainText = () => {\n return value\n .map(node => {\n if (markdownOnly && (node as Element).children) {\n return (node as Element).children\n .map(textNode => (textNode as Text).searchResult?.markdown \|\| (textNode as Text).text)\n .join('');\n }\n return Node.string(node);\n })\n .join('\\n');\n };\n\n const onEditorFocus: RichTextEditorContextValue['onEditorFocus'] = ({\n event,\n force,\n focusEditor,\n runAfterFocus\n }) => {\n if (focusEditor) {\n ReactEditor.focus(editor);\n }\n\n if (runAfterFocus && (force \|\| (!disabled && !toolbarPopover))) {\n setTimeout(runAfterFocus, 0);\n } else {\n event?.stopPropagation();\n }\n };\n\n const blurEditor = () => {\n ReactEditor.blur(editor);\n onBlur?.();\n };\n\n useImperativeHandle<any, RichTextEditorState>(\n ref,\n () => ({\n focus: () => {\n onEditorFocus({ focusEditor: true });\n },\n getPlainText: () => {\n return getPlainText();\n },\n getRichText: () => {\n return JSON.stringify(value);\n },\n getHtml: () => {\n return convertSlateToHtml(value);\n },\n clear: () => {\n const point = { path: [0, 0], offset: 0 };\n editor.selection = { anchor: point, focus: point };\n setValue([\n {\n type: 'paragraph',\n children: [{ text: '' }]\n }\n ]);\n },\n appendImage: ({ src, alt }, imageId) => {\n EditorCommands.appendImage(editor, { src, alt }, imageId);\n },\n insertText: (text: string) => {\n editor.insertText(text);\n }\n }),\n [value, setValue]\n );\n\n const onMenuItemClick = (itemId: string, e: MouseEvent<any> \| KeyboardEvent<any>) => {\n // MenuItem expects actual click events, but we don't have reference to actual menu item element to trigger a click.\n menu?.onItemClick?.(itemId, e as MouseEvent<any>);\n const replacement = getSearchItemReplacement?.(itemId);\n if (replacement) {\n let node: Node;\n\n if (replacement.markdown && replacement.component && replacement.props) {\n node = {\n text: replacement.text,\n searchResult: {\n markdown: replacement.markdown,\n component: replacement.component,\n props: replacement.props,\n // Prevents copying searchResult attribute onPaste\n toJSON: () => undefined\n }\n };\n } else {\n node = { text: replacement.text };\n }\n\n EditorCommands.replaceWithNodes(editor, popoverTarget, node);\n }\n };\n\n const onKeyDown = useCallback(\n (event: KeyboardEvent<any>) => {\n if (popoverTarget && menu) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n dispatchFocus({ type: 'next', menuItems: menu.items, selectedItemId: focusedId });\n break;\n case 'ArrowUp':\n event.preventDefault();\n dispatchFocus({ type: 'prev', menuItems: menu.items, selectedItemId: focusedId });\n break;\n case 'Enter':\n event.preventDefault();\n if (focusedId) {\n onMenuItemClick(focusedId, event);\n dispatchFocus({ type: 'clear', menuItems: menu.items });\n }\n break;\n case 'Escape':\n event.preventDefault();\n setPopoverTarget(null);\n break;\n default:\n break;\n }\n } else if (event.key === 'Tab' && !event.shiftKey) {\n if (focusableToolbarBtn) {\n focusableToolbarBtn.focus();\n event.preventDefault();\n }\n } else {\n ListCommands.checkListEnter(editor, event);\n EditorCommands.checkLinkBreak(editor, event);\n EditorCommands.checkSearchDownKeys(editor, event);\n EditorCommands.checkImageEnter(editor, event);\n EditorCommands.checkKeyCommands(editor, event);\n }\n },\n [menu, focusedId, popoverTarget, focusableToolbarBtn]\n );\n\n const onKeyUp = (event: KeyboardEvent<any>) => {\n EditorCommands.checkSearchUpKeys(editor, event);\n };\n\n // Adds an image placeholder to be replaced later in time by an image\n const addImage = (file: File) => {\n const placeholderId = EditorCommands.appendImagePlaceholder(editor);\n if (placeholderId) onImageAdded?.(file, placeholderId);\n };\n\n const onPaste = (e: ClipboardEvent) => {\n let image;\n for (let i = 0; i < e.clipboardData.items.length; i += 1) {\n const item = e.clipboardData.items[i];\n\n if (item.type.startsWith('image')) {\n image = item.getAsFile();\n }\n }\n\n if (image) {\n e.preventDefault();\n addImage(image);\n }\n };\n\n const onDrop = (e: DragEvent) => {\n e.preventDefault();\n if (e.dataTransfer) {\n Array.from(e.dataTransfer.files).forEach(file => {\n if (file.type.includes('image')) {\n addImage(file);\n }\n });\n }\n };\n\n useEffect(() => {\n if (popoverTarget) {\n setSearchEl(ReactEditor.toDOMRange(editor, popoverTarget) as VirtualElement);\n }\n }, [popoverTarget]);\n\n useEffect(() => {\n onChange?.();\n }, [value]);\n\n useEffect(() => {\n if (menu && popoverTarget) {\n dispatchFocus({\n type: 'set',\n menuItems: menu.items,\n selectedItemId: menu.items[0]?.id\n });\n }\n }, [menu, popoverTarget]);\n\n useEffect(() => {\n if (autoFocus) {\n setTimeout(() => {\n ReactEditor.focus(editor);\n }, 0);\n }\n }, []);\n\n useAfterInitialEffect(() => {\n if (!menu) {\n ReactEditor.focus(editor);\n }\n }, [menu]);\n\n return (\n <RichTextEditorContext.Provider\n value={{\n onImageAdded,\n setPopoverOpen: setToolbarPopover,\n onEditorFocus,\n disabled: disabled \|\| false\n }}\n >\n <FormField\n label={\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events\n <span onClick={() => onEditorFocus({ focusEditor: true })}>{label}</span>\n }\n labelHidden={labelHidden}\n id={id}\n labelOrder={-1}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n onDrop={onDrop}\n onFocus={(e: FocusEvent) => {\n if (e.target === formFieldRef.current) onEditorFocus({});\n }}\n ref={formFieldRef}\n aria-label={`${label} ${\n !markdownOnly && !readOnly && toolbar?.length ? 'Hit tab to edit toolbar below' : ''\n }`}\n >\n <Slate\n editor={editor}\n value={value}\n onChange={newValue => {\n if (!disabled) {\n setValue(newValue);\n debouncedUpdateToolbarStyle();\n\n if (searchTriggers && onSearch && markdownOnly) {\n const res = searchTriggers.flatMap(({ trigger, regex }) => {\n for (let i = 0; i < 10; i += 1) {\n try {\n const groupId = createUID();\n return [\n {\n trigger,\n groupId: `g${groupId}`,\n regex: new RegExp(\n String.raw`(?<=^\|\\s)${trigger}(?<g${groupId}>${\n regex \|\| String.raw`\\w*`\n })$`\n )\n }\n ];\n } catch (e: unknown) {\n if (!(e instanceof SyntaxError)) throw e;\n }\n }\n\n // Failsafe\n return [];\n });\n\n let search;\n for (let i = 0; i < res.length; i += 1) {\n search = onSearchChange(editor, res[i]);\n if (search) break;\n }\n\n if (search) {\n setPopoverTarget(search.target);\n onSearch({ search: search.search, trigger: search.trigger });\n } else {\n setPopoverTarget(null);\n }\n }\n }\n }}\n >\n <FormControl\n {...restProps}\n ref={ref}\n ariaLabel={label}\n id={id}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={status}\n as={StyledRichTextEditor}\n toolbar={!!(!markdownOnly && toolbar?.length)}\n onClick={() => {\n onEditorFocus({ focusEditor: true });\n }}\n focused={ReactEditor.isFocused(editor)}\n >\n <EditorContainer\n toolbar={!!(!markdownOnly && toolbar?.length)}\n containerHeight={height}\n onClick={() => {\n if (!disabled) {\n onEditorFocus({ focusEditor: true });\n onFocus?.();\n }\n }}\n >\n <Editable\n renderElement={nodeRenderer}\n renderLeaf={leafRenderer}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n placeholder={placeholder}\n onFocus={() => {\n if (!disabled) {\n onEditorFocus({});\n onFocus?.();\n } else {\n blurEditor();\n }\n }}\n onBlur={blurEditor}\n disabled={disabled}\n readOnly={readOnly}\n onPaste={onPaste}\n />\n </EditorContainer>\n {!markdownOnly && !readOnly && toolbar?.length ? (\n <Toolbar\n features={toolbar}\n sticky={toolbarSticky}\n setFocusableBtn={el => {\n setFocusableToolbarBtn(el);\n }}\n />\n ) : null}\n </FormControl>\n <Popover\n show={!!popoverTarget && !!menu}\n strategy='fixed'\n target={searchEl}\n placement='bottom-start'\n >\n {menu && (\n <Menu\n {...menu}\n as={StyledSearchPopover}\n currentItemId={focusedId}\n mode='action'\n onItemClick={onMenuItemClick}\n />\n )}\n </Popover>\n </Slate>\n </FormField>\n </RichTextEditorContext.Provider>\n );\n }\n);\n\nexport default RichTextEditor;\n"]}
1	+ {"version":3,"file":"RichTextEditor.js","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n PropsWithoutRef,\n Ref,\n useState,\n useRef,\n useMemo,\n FC,\n useEffect,\n useCallback,\n MouseEvent,\n KeyboardEvent,\n useImperativeHandle,\n ClipboardEvent,\n FocusEvent,\n useReducer\n} from 'react';\n// Import the Slate editor factory.\nimport { createEditor, Editor, Node, Element, Text, Range } from 'slate';\n// Import the Slate components and React plugin.\nimport { Slate, Editable, withReact, ReactEditor } from 'slate-react';\nimport styled from 'styled-components';\nimport { VirtualElement } from '@popperjs/core';\n\nimport {\n FormField,\n FormControl,\n StyledPopover,\n useTheme,\n useUID,\n createUID,\n debounce,\n ForwardProps,\n Popover,\n Menu,\n menuHelpers,\n MenuItemProps\n} from '@pega/cosmos-react-core';\n\nimport StyledRichTextEditor, { EditorContainer } from './RichTextEditor.styles';\nimport Toolbar from './Toolbar/Toolbar';\nimport { nodeRenderer, leafRenderer } from './utils/renderers';\nimport { onSearchChange } from './utils/search';\nimport EditorCommands from './utils/EditorCommands';\nimport ListCommands from './utils/ListCommands';\nimport { convertHtml } from './utils/htmlConverter';\nimport { convertSlateToHtml } from './utils/slateConverter';\nimport { RichTextEditorState, RichTextEditorProps } from './RichTextEditor.types';\nimport { RichTextEditorContext, RichTextEditorContextValue } from './RichTextEditor.context';\nimport { convertMarkdownForEditor } from './utils/markdownConverter';\n\ntype SyntheticActionType = 'prev' \| 'next' \| 'child' \| 'parent' \| 'list_change' \| 'set' \| 'clear';\n\nconst withVoids = (editor: Editor): ReactEditor => {\n editor.isVoid = element => {\n if (element.type === 'image' \|\| element.type === 'image-placeholder') {\n return true;\n }\n return false;\n };\n\n return editor as ReactEditor;\n};\n\nconst syntheticFocusReducer = (\n currentId: string \| undefined,\n action: {\n type: SyntheticActionType;\n menuItems: MenuItemProps[];\n selectedItemId?: MenuItemProps['id'];\n }\n): string \| undefined => {\n const { type, menuItems, selectedItemId } = action;\n switch (type) {\n case 'child':\n // return first item id if top-level\n if (!currentId) return menuItems[0].id;\n // if currently highlighted item has children, select first of them\n return menuHelpers.getItem(menuItems, currentId)?.items?.[0].id;\n case 'parent':\n // find and return parent of currently selected item\n return menuHelpers.getParentItem(menuItems, currentId)?.id;\n case 'next':\n // return next sibling of currently selected item\n return menuHelpers.getNextItem(menuItems, currentId)?.id ?? currentId;\n case 'prev':\n // return prev sibling of currently selected item\n return menuHelpers.getPrevItem(menuItems, currentId)?.id ?? currentId;\n case 'list_change':\n // if currently selected item does not exist in new list, select first one\n if (currentId && menuHelpers.getItem(menuItems, currentId)) return currentId;\n return menuItems[0]?.id;\n case 'set':\n // return arbitrary selected item id if it is in the tree; undefined otherwise\n return selectedItemId ? menuHelpers.getItem(menuItems, selectedItemId)?.id : undefined;\n case 'clear':\n return undefined;\n default:\n return currentId;\n }\n};\n\nconst StyledSearchPopover = styled(StyledPopover)`\n min-width: 20rem;\n`;\n\nconst RichTextEditor: FC<RichTextEditorProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<RichTextEditorProps>, ref: Ref<RichTextEditorState>) => {\n const {\n components: {\n 'text-area': { 'min-height': minHeight }\n }\n } = useTheme();\n const uid = useUID();\n const {\n id = uid,\n label,\n labelHidden,\n info,\n status,\n required,\n disabled,\n readOnly,\n onChange,\n onFocus,\n onBlur,\n placeholder,\n toolbar,\n onImageAdded,\n markdownOnly,\n searchTriggers,\n onSearch,\n getSearchItemReplacement,\n searchRenderers,\n menu,\n height = { min: minHeight },\n defaultValue,\n autoFocus,\n ...restProps\n } = props;\n\n const formFieldRef = useRef<HTMLElement>(null);\n const editor = useMemo(() => withVoids(withReact(createEditor())), []);\n const [value, setValue] = useState<(Element \| Text)[]>(\n defaultValue && !markdownOnly\n ? convertHtml(defaultValue)\n : convertMarkdownForEditor(defaultValue, searchRenderers)\n );\n const [toolbarPopover, setToolbarPopover] = useState(false);\n const [toolbarSticky, setToolbarSticky] = useState(false);\n const [focusableToolbarBtn, setFocusableToolbarBtn] = useState<HTMLElement \| null>(null);\n const [focusedId, dispatchFocus] = useReducer(syntheticFocusReducer, undefined);\n\n const [popoverTarget, setPopoverTarget] = useState<Range \| null>(null);\n const [searchEl, setSearchEl] = useState<VirtualElement \| null>(null);\n\n const updateToolbarStyle = () => {\n if ((formFieldRef.current?.offsetHeight \|\| 0) > window.innerHeight) {\n setToolbarSticky(true);\n } else {\n setToolbarSticky(false);\n }\n };\n\n const debouncedUpdateToolbarStyle = debounce(updateToolbarStyle, 200);\n\n const getPlainText = () => {\n return value\n .map(node => {\n if (markdownOnly && (node as Element).children) {\n return (node as Element).children\n .map(textNode => (textNode as Text).searchResult?.markdown \|\| (textNode as Text).text)\n .join('');\n }\n return Node.string(node);\n })\n .join('\\n');\n };\n\n const onEditorFocus: RichTextEditorContextValue['onEditorFocus'] = ({\n event,\n force,\n focusEditor,\n runAfterFocus\n }) => {\n if (focusEditor) {\n setTimeout(() => {\n ReactEditor.focus(editor);\n }, 0);\n }\n\n if (runAfterFocus && (force \|\| (!disabled && !toolbarPopover))) {\n setTimeout(runAfterFocus, 0);\n } else {\n event?.stopPropagation();\n }\n };\n\n const blurEditor = () => {\n if (ReactEditor.isFocused(editor)) {\n ReactEditor.blur(editor);\n onBlur?.();\n }\n };\n\n useImperativeHandle<any, RichTextEditorState>(\n ref,\n () => ({\n focus: () => {\n onEditorFocus({ focusEditor: true });\n },\n getPlainText: () => {\n return getPlainText();\n },\n getRichText: () => {\n return JSON.stringify(value);\n },\n getHtml: () => {\n return convertSlateToHtml(value);\n },\n clear: () => {\n const point = { path: [0, 0], offset: 0 };\n editor.selection = { anchor: point, focus: point };\n setValue([\n {\n type: 'paragraph',\n children: [{ text: '' }]\n }\n ]);\n },\n appendImage: ({ src, alt }, imageId) => {\n EditorCommands.appendImage(editor, { src, alt }, imageId);\n },\n insertText: (text: string) => {\n editor.insertText(text);\n }\n }),\n [value, setValue]\n );\n\n const onMenuItemClick = (itemId: string, e: MouseEvent<any> \| KeyboardEvent<any>) => {\n // MenuItem expects actual click events, but we don't have reference to actual menu item element to trigger a click.\n menu?.onItemClick?.(itemId, e as MouseEvent<any>);\n const replacement = getSearchItemReplacement?.(itemId);\n if (replacement) {\n let node: Node;\n\n if (replacement.markdown && replacement.component && replacement.props) {\n node = {\n text: replacement.text,\n searchResult: {\n markdown: replacement.markdown,\n component: replacement.component,\n props: replacement.props,\n // Prevents copying searchResult attribute onPaste\n toJSON: () => undefined\n }\n };\n } else {\n node = { text: replacement.text };\n }\n\n EditorCommands.replaceWithNodes(editor, popoverTarget, node);\n }\n };\n\n const onKeyDown = useCallback(\n (event: KeyboardEvent<any>) => {\n if (popoverTarget && menu) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n dispatchFocus({ type: 'next', menuItems: menu.items, selectedItemId: focusedId });\n break;\n case 'ArrowUp':\n event.preventDefault();\n dispatchFocus({ type: 'prev', menuItems: menu.items, selectedItemId: focusedId });\n break;\n case 'Enter':\n event.preventDefault();\n if (focusedId) {\n onMenuItemClick(focusedId, event);\n dispatchFocus({ type: 'clear', menuItems: menu.items });\n }\n break;\n case 'Escape':\n event.preventDefault();\n setPopoverTarget(null);\n break;\n default:\n break;\n }\n } else if (event.key === 'Tab' && !event.shiftKey) {\n if (focusableToolbarBtn) {\n focusableToolbarBtn.focus();\n event.preventDefault();\n }\n } else {\n ListCommands.checkListEnter(editor, event);\n EditorCommands.checkLinkBreak(editor, event);\n EditorCommands.checkSearchDownKeys(editor, event);\n EditorCommands.checkImageEnter(editor, event);\n EditorCommands.checkKeyCommands(editor, event);\n }\n },\n [menu, focusedId, popoverTarget, focusableToolbarBtn]\n );\n\n const onKeyUp = (event: KeyboardEvent<any>) => {\n EditorCommands.checkSearchUpKeys(editor, event);\n };\n\n // Adds an image placeholder to be replaced later in time by an image\n const addImage = (file: File) => {\n const placeholderId = EditorCommands.appendImagePlaceholder(editor);\n if (placeholderId) onImageAdded?.(file, placeholderId);\n };\n\n const onPaste = (e: ClipboardEvent) => {\n let image;\n for (let i = 0; i < e.clipboardData.items.length; i += 1) {\n const item = e.clipboardData.items[i];\n\n if (item.type.startsWith('image')) {\n image = item.getAsFile();\n }\n }\n\n if (image) {\n e.preventDefault();\n addImage(image);\n }\n };\n\n const onDrop = (e: DragEvent) => {\n e.preventDefault();\n if (e.dataTransfer) {\n Array.from(e.dataTransfer.files).forEach(file => {\n if (file.type.includes('image')) {\n addImage(file);\n }\n });\n }\n };\n\n useEffect(() => {\n if (popoverTarget) {\n setSearchEl(ReactEditor.toDOMRange(editor, popoverTarget) as VirtualElement);\n }\n }, [popoverTarget]);\n\n useEffect(() => {\n onChange?.();\n }, [value]);\n\n useEffect(() => {\n if (menu && popoverTarget) {\n dispatchFocus({\n type: 'set',\n menuItems: menu.items,\n selectedItemId: menu.items[0]?.id\n });\n }\n }, [menu, popoverTarget]);\n\n useEffect(() => {\n if (autoFocus) {\n setTimeout(() => {\n ReactEditor.focus(editor);\n }, 0);\n }\n }, []);\n\n return (\n <RichTextEditorContext.Provider\n value={{\n onImageAdded,\n setPopoverOpen: setToolbarPopover,\n onEditorFocus,\n disabled: disabled \|\| false\n }}\n >\n <FormField\n label={\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events\n <span onClick={() => onEditorFocus({ focusEditor: true })}>{label}</span>\n }\n labelHidden={labelHidden}\n id={id}\n labelOrder={-1}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n onDrop={onDrop}\n onFocus={(e: FocusEvent) => {\n if (e.target === formFieldRef.current) {\n onEditorFocus({ focusEditor: true });\n }\n }}\n onBlur={blurEditor}\n ref={formFieldRef}\n aria-label={`${label} ${\n !markdownOnly && !readOnly && toolbar?.length ? 'Hit tab to edit toolbar below' : ''\n }`}\n >\n <Slate\n editor={editor}\n value={value}\n onChange={newValue => {\n if (!disabled) {\n setValue(newValue);\n debouncedUpdateToolbarStyle();\n\n if (searchTriggers && onSearch && markdownOnly) {\n const res = searchTriggers.flatMap(({ trigger, regex }) => {\n for (let i = 0; i < 10; i += 1) {\n try {\n const groupId = createUID();\n return [\n {\n trigger,\n groupId: `g${groupId}`,\n regex: new RegExp(\n String.raw`(?<=^\|\\s)${trigger}(?<g${groupId}>${\n regex \|\| String.raw`\\w*`\n })$`\n )\n }\n ];\n } catch (e: unknown) {\n if (!(e instanceof SyntaxError)) throw e;\n }\n }\n\n // Failsafe\n return [];\n });\n\n let search;\n for (let i = 0; i < res.length; i += 1) {\n search = onSearchChange(editor, res[i]);\n if (search) break;\n }\n\n if (search) {\n setPopoverTarget(search.target);\n onSearch({ search: search.search, trigger: search.trigger });\n } else {\n setPopoverTarget(null);\n }\n }\n }\n }}\n >\n <FormControl\n {...restProps}\n ref={ref}\n ariaLabel={label}\n id={id}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={status}\n as={StyledRichTextEditor}\n toolbar={!!(!markdownOnly && toolbar?.length)}\n onClick={() => {\n if (!ReactEditor.isFocused(editor)) onEditorFocus({ focusEditor: true });\n }}\n focused={ReactEditor.isFocused(editor)}\n >\n <EditorContainer\n toolbar={!!(!markdownOnly && toolbar?.length)}\n containerHeight={height}\n onClick={() => {\n if (!disabled && !ReactEditor.isFocused(editor)) {\n onEditorFocus({ focusEditor: true });\n onFocus?.();\n }\n }}\n >\n <Editable\n renderElement={nodeRenderer}\n renderLeaf={leafRenderer}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n placeholder={placeholder}\n onFocus={event => {\n if (!disabled) {\n if (!ReactEditor.isFocused(editor)) {\n onEditorFocus({ focusEditor: true, event });\n onFocus?.();\n }\n } else {\n blurEditor();\n }\n }}\n onBlur={blurEditor}\n disabled={disabled}\n readOnly={readOnly}\n onPaste={onPaste}\n />\n </EditorContainer>\n {!markdownOnly && !readOnly && toolbar?.length ? (\n <Toolbar\n features={toolbar}\n sticky={toolbarSticky}\n setFocusableBtn={el => {\n setFocusableToolbarBtn(el);\n }}\n />\n ) : null}\n </FormControl>\n <Popover\n show={!!popoverTarget && !!menu}\n strategy='fixed'\n target={searchEl}\n placement='bottom-start'\n >\n {menu && (\n <Menu\n {...menu}\n as={StyledSearchPopover}\n currentItemId={focusedId}\n mode='action'\n onItemClick={onMenuItemClick}\n />\n )}\n </Popover>\n </Slate>\n </FormField>\n </RichTextEditorContext.Provider>\n );\n }\n);\n\nexport default RichTextEditor;\n"]}

package/lib/components/RichTextEditor/RichTextEditor.styles.d.ts CHANGED Viewed

@@ -5,8 +5,10 @@ interface StyledRichTextEditorProps {
     readOnly?: boolean;
     containerHeight?: RichTextEditorProps['height'];
 }
+export declare const listStyles: import("styled-components").FlattenSimpleInterpolation;
 export declare const EditorContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledRichTextEditorProps, never>;
 declare const StyledRichTextEditor: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledRichTextEditorProps, never>;
 export declare const StyledRichTextViewer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledHtml: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export default StyledRichTextEditor;
 //# sourceMappingURL=RichTextEditor.styles.d.ts.map

package/lib/components/RichTextEditor/RichTextEditor.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextEditor.styles.d.ts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.styles.ts"],"names":[],"mappings":"~~AAIA~~,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;~~AAE7D~~,UAAU,yBAAyB;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;CACjD;AAED,eAAO,MAAM,eAAe,~~gIAyD3B~~,CAAC;AAIF,QAAA,MAAM,oBAAoB,gIAsBxB,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGAWhC,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
1	+ {"version":3,"file":"RichTextEditor.styles.d.ts","sourceRoot":"","sources":["../../../src/components/RichTextEditor/RichTextEditor.styles.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAG7D,UAAU,yBAAyB;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;CACjD;AAED,eAAO,MAAM,UAAU,wDAmDtB,CAAC;AAEF,eAAO,MAAM,eAAe,gIAgB3B,CAAC;AAIF,QAAA,MAAM,oBAAoB,gIAsBxB,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGAWhC,CAAC;AAEF,eAAO,MAAM,UAAU,yGAwCrB,CAAC;AAIH,eAAe,oBAAoB,CAAC"}

package/lib/components/RichTextEditor/RichTextEditor.styles.js CHANGED Viewed

@@ -1,59 +1,71 @@
 import styled, { css } from 'styled-components';
-import { defaultThemeProp, StyledLink } from '@pega/cosmos-react-core';
+import { calculateFontSize, defaultThemeProp, StyledLink, StyledPopover } from '@pega/cosmos-react-core';
+import { getTableStyles } from './DecoratorComponents/Table';
+export const listStyles = css `
+  ul,
+  ol {
+    padding-inline-start: 2.5rem;
+  }
+  li {
+    margin: 0.5rem 0;
+  }
+  ul li {
+    ul {
+      margin-inline-start: 1rem;
+      list-style-type: circle;
+    }
+    ul ul {
+      margin-inline-start: 2rem;
+      list-style-type: square;
+    }
+    ul ul ul {
+      margin-inline-start: 3rem;
+      list-style-type: disc;
+    }
+  }
+  ol li {
+    ol {
+      margin-inline-start: 1rem;
+      list-style-type: lower-alpha;
+    }
+    ol ol {
+      margin-inline-start: 2rem;
+      list-style-type: lower-roman;
+    }
+    ol ol ol {
+      margin-inline-start: 3rem;
+      list-style-type: decimal;
+    }
+  }
+  ${StyledPopover} ul, ${StyledPopover} ol {
+    padding-inline-start: 0;
+  }
+  ${StyledPopover} li {
+    margin: 0;
+  }
+`;
 export const EditorContainer = styled.div(({ containerHeight, toolbar, theme }) => {
     return css `
       padding: ${toolbar ? theme.base.spacing : '0'};
       height: ${typeof containerHeight === 'string' ? containerHeight : 'auto'};
-      min-height: ${typeof containerHeight === 'string' ? 'auto' : (containerHeight === null || containerHeight === void 0 ? void 0 : containerHeight.min) || 'auto'};
-      max-height: ${typeof containerHeight === 'string' ? 'auto' : (containerHeight === null || containerHeight === void 0 ? void 0 : containerHeight.max) || 'auto'};
+      min-height: ${typeof containerHeight === 'string' ? 'auto' : containerHeight?.min || 'auto'};
+      max-height: ${typeof containerHeight === 'string' ? 'auto' : containerHeight?.max || 'auto'};
       overflow: auto;
       &:hover {
         cursor: text;
       }
-      ul,
-      ol {
-        padding-left: 2.5rem;
-      }
-      li {
-        margin: 0.5rem 0;
-      }
-      ul li {
-        ul {
-          margin-left: 1rem;
-          list-style-type: circle;
-        }
-        ul ul {
-          margin-left: 2rem;
-          list-style-type: square;
-        }
-        ul ul ul {
-          margin-left: 3rem;
-          list-style-type: disc;
-        }
-      }
-      ol li {
-        ol {
-          margin-left: 1rem;
-          list-style-type: lower-alpha;
-        }
-        ol ol {
-          margin-left: 2rem;
-          list-style-type: lower-roman;
-        }
-        ol ol ol {
-          margin-left: 3rem;
-          list-style-type: decimal;
-        }
-      }
+      ${listStyles}
     `;
 });
 EditorContainer.defaultProps = defaultThemeProp;
@@ -93,5 +105,44 @@ export const StyledRichTextViewer = styled.div `
     }
   }
 `;
+export const StyledHtml = styled.div(({ theme }) => {
+    const { base: { 'font-size': baseFontSize, 'font-scale': baseFontScale, palette }, components: { text } } = theme;
+    const fontSize = calculateFontSize(baseFontSize, baseFontScale);
+    return css `
+    ${listStyles}
+    table {
+      ${getTableStyles(theme)}
+    }
+    a {
+      color: ${palette.interactive};
+    }
+    h1 {
+      font-size: ${fontSize[text.h1['font-size']]};
+      font-weight: ${text.h1['font-weight']};
+    }
+    h2 {
+      font-size: ${fontSize[text.h2['font-size']]};
+      font-weight: ${text.h2['font-weight']};
+    }
+    h3 {
+      font-size: ${fontSize[text.h3['font-size']]};
+      font-weight: ${text.h3['font-weight']};
+    }
+    h4 {
+      font-size: ${fontSize[text.h4['font-size']]};
+      font-weight: ${text.h4['font-weight']};
+    }
+    h5 {
+      font-size: ${fontSize[text.h5['font-size']]};
+      font-weight: ${text.h5['font-weight']};
+    }
+    h6 {
+      font-size: ${fontSize[text.h6['font-size']]};
+      font-weight: ${text.h6['font-weight']};
+    }
+  `;
+});
+StyledHtml.defaultProps = defaultThemeProp;
 export default StyledRichTextEditor;
 //# sourceMappingURL=RichTextEditor.styles.js.map