@pega/cosmos-react-rte 5.0.0-dev.4.7 → 5.0.0-dev.4.8

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 (193) hide show
  1. package/package.json +2 -2
  2. package/lib/components/DynamicContentEditor/DynamicContentEditor.d.ts +0 -12
  3. package/lib/components/DynamicContentEditor/DynamicContentEditor.d.ts.map +0 -1
  4. package/lib/components/DynamicContentEditor/DynamicContentEditor.js +0 -252
  5. package/lib/components/DynamicContentEditor/DynamicContentEditor.js.map +0 -1
  6. package/lib/components/DynamicContentEditor/DynamicContentEditor.test-ids.d.ts +0 -2
  7. package/lib/components/DynamicContentEditor/DynamicContentEditor.test-ids.d.ts.map +0 -1
  8. package/lib/components/DynamicContentEditor/DynamicContentEditor.test-ids.js +0 -8
  9. package/lib/components/DynamicContentEditor/DynamicContentEditor.test-ids.js.map +0 -1
  10. package/lib/components/DynamicContentEditor/DynamicContentEditor.types.d.ts +0 -35
  11. package/lib/components/DynamicContentEditor/DynamicContentEditor.types.d.ts.map +0 -1
  12. package/lib/components/DynamicContentEditor/DynamicContentEditor.types.js +0 -3
  13. package/lib/components/DynamicContentEditor/DynamicContentEditor.types.js.map +0 -1
  14. package/lib/components/DynamicContentEditor/PegaCustomElement.d.ts +0 -329
  15. package/lib/components/DynamicContentEditor/PegaCustomElement.d.ts.map +0 -1
  16. package/lib/components/DynamicContentEditor/PegaCustomElement.js +0 -27
  17. package/lib/components/DynamicContentEditor/PegaCustomElement.js.map +0 -1
  18. package/lib/components/DynamicContentEditor/index.d.ts +0 -3
  19. package/lib/components/DynamicContentEditor/index.d.ts.map +0 -1
  20. package/lib/components/DynamicContentEditor/index.js +0 -2
  21. package/lib/components/DynamicContentEditor/index.js.map +0 -1
  22. package/lib/components/Editor/Editor.context.d.ts +0 -10
  23. package/lib/components/Editor/Editor.context.d.ts.map +0 -1
  24. package/lib/components/Editor/Editor.context.js +0 -10
  25. package/lib/components/Editor/Editor.context.js.map +0 -1
  26. package/lib/components/Editor/Editor.d.ts +0 -19
  27. package/lib/components/Editor/Editor.d.ts.map +0 -1
  28. package/lib/components/Editor/Editor.js +0 -369
  29. package/lib/components/Editor/Editor.js.map +0 -1
  30. package/lib/components/Editor/Editor.styles.d.ts +0 -5
  31. package/lib/components/Editor/Editor.styles.d.ts.map +0 -1
  32. package/lib/components/Editor/Editor.styles.js +0 -50
  33. package/lib/components/Editor/Editor.styles.js.map +0 -1
  34. package/lib/components/Editor/Editor.test-ids.d.ts +0 -2
  35. package/lib/components/Editor/Editor.test-ids.d.ts.map +0 -1
  36. package/lib/components/Editor/Editor.test-ids.js +0 -8
  37. package/lib/components/Editor/Editor.test-ids.js.map +0 -1
  38. package/lib/components/Editor/Editor.types.d.ts +0 -69
  39. package/lib/components/Editor/Editor.types.d.ts.map +0 -1
  40. package/lib/components/Editor/Editor.types.js +0 -2
  41. package/lib/components/Editor/Editor.types.js.map +0 -1
  42. package/lib/components/Editor/ImageEditor.d.ts +0 -10
  43. package/lib/components/Editor/ImageEditor.d.ts.map +0 -1
  44. package/lib/components/Editor/ImageEditor.js +0 -276
  45. package/lib/components/Editor/ImageEditor.js.map +0 -1
  46. package/lib/components/Editor/Toolbar/AnchorButton.d.ts +0 -10
  47. package/lib/components/Editor/Toolbar/AnchorButton.d.ts.map +0 -1
  48. package/lib/components/Editor/Toolbar/AnchorButton.js +0 -161
  49. package/lib/components/Editor/Toolbar/AnchorButton.js.map +0 -1
  50. package/lib/components/Editor/Toolbar/ImageButton.d.ts +0 -8
  51. package/lib/components/Editor/Toolbar/ImageButton.d.ts.map +0 -1
  52. package/lib/components/Editor/Toolbar/ImageButton.js +0 -30
  53. package/lib/components/Editor/Toolbar/ImageButton.js.map +0 -1
  54. package/lib/components/Editor/Toolbar/TextSelect.d.ts +0 -14
  55. package/lib/components/Editor/Toolbar/TextSelect.d.ts.map +0 -1
  56. package/lib/components/Editor/Toolbar/TextSelect.js +0 -131
  57. package/lib/components/Editor/Toolbar/TextSelect.js.map +0 -1
  58. package/lib/components/Editor/Toolbar/Toolbar.d.ts +0 -17
  59. package/lib/components/Editor/Toolbar/Toolbar.d.ts.map +0 -1
  60. package/lib/components/Editor/Toolbar/Toolbar.js +0 -164
  61. package/lib/components/Editor/Toolbar/Toolbar.js.map +0 -1
  62. package/lib/components/Editor/Toolbar/Toolbar.test-ids.d.ts +0 -3
  63. package/lib/components/Editor/Toolbar/Toolbar.test-ids.d.ts.map +0 -1
  64. package/lib/components/Editor/Toolbar/Toolbar.test-ids.js +0 -16
  65. package/lib/components/Editor/Toolbar/Toolbar.test-ids.js.map +0 -1
  66. package/lib/components/Editor/index.d.ts +0 -4
  67. package/lib/components/Editor/index.d.ts.map +0 -1
  68. package/lib/components/Editor/index.js +0 -3
  69. package/lib/components/Editor/index.js.map +0 -1
  70. package/lib/components/RichTextEditor/DecoratorComponents/CodeBlock.d.ts +0 -4
  71. package/lib/components/RichTextEditor/DecoratorComponents/CodeBlock.d.ts.map +0 -1
  72. package/lib/components/RichTextEditor/DecoratorComponents/CodeBlock.js +0 -15
  73. package/lib/components/RichTextEditor/DecoratorComponents/CodeBlock.js.map +0 -1
  74. package/lib/components/RichTextEditor/DecoratorComponents/Image.d.ts +0 -4
  75. package/lib/components/RichTextEditor/DecoratorComponents/Image.d.ts.map +0 -1
  76. package/lib/components/RichTextEditor/DecoratorComponents/Image.js +0 -7
  77. package/lib/components/RichTextEditor/DecoratorComponents/Image.js.map +0 -1
  78. package/lib/components/RichTextEditor/DecoratorComponents/Link.d.ts +0 -4
  79. package/lib/components/RichTextEditor/DecoratorComponents/Link.d.ts.map +0 -1
  80. package/lib/components/RichTextEditor/DecoratorComponents/Link.js +0 -8
  81. package/lib/components/RichTextEditor/DecoratorComponents/Link.js.map +0 -1
  82. package/lib/components/RichTextEditor/DecoratorComponents/Table.d.ts +0 -6
  83. package/lib/components/RichTextEditor/DecoratorComponents/Table.d.ts.map +0 -1
  84. package/lib/components/RichTextEditor/DecoratorComponents/Table.js +0 -24
  85. package/lib/components/RichTextEditor/DecoratorComponents/Table.js.map +0 -1
  86. package/lib/components/RichTextEditor/RichTextEditor.context.d.ts +0 -15
  87. package/lib/components/RichTextEditor/RichTextEditor.context.d.ts.map +0 -1
  88. package/lib/components/RichTextEditor/RichTextEditor.context.js +0 -11
  89. package/lib/components/RichTextEditor/RichTextEditor.context.js.map +0 -1
  90. package/lib/components/RichTextEditor/RichTextEditor.d.ts +0 -6
  91. package/lib/components/RichTextEditor/RichTextEditor.d.ts.map +0 -1
  92. package/lib/components/RichTextEditor/RichTextEditor.js +0 -346
  93. package/lib/components/RichTextEditor/RichTextEditor.js.map +0 -1
  94. package/lib/components/RichTextEditor/RichTextEditor.styles.d.ts +0 -10
  95. package/lib/components/RichTextEditor/RichTextEditor.styles.d.ts.map +0 -1
  96. package/lib/components/RichTextEditor/RichTextEditor.styles.js +0 -73
  97. package/lib/components/RichTextEditor/RichTextEditor.styles.js.map +0 -1
  98. package/lib/components/RichTextEditor/RichTextEditor.types.d.ts +0 -72
  99. package/lib/components/RichTextEditor/RichTextEditor.types.d.ts.map +0 -1
  100. package/lib/components/RichTextEditor/RichTextEditor.types.js +0 -2
  101. package/lib/components/RichTextEditor/RichTextEditor.types.js.map +0 -1
  102. package/lib/components/RichTextEditor/RichTextTreeRenderer.d.ts +0 -9
  103. package/lib/components/RichTextEditor/RichTextTreeRenderer.d.ts.map +0 -1
  104. package/lib/components/RichTextEditor/RichTextTreeRenderer.js +0 -15
  105. package/lib/components/RichTextEditor/RichTextTreeRenderer.js.map +0 -1
  106. package/lib/components/RichTextEditor/RichTextViewer.d.ts +0 -7
  107. package/lib/components/RichTextEditor/RichTextViewer.d.ts.map +0 -1
  108. package/lib/components/RichTextEditor/RichTextViewer.js +0 -38
  109. package/lib/components/RichTextEditor/RichTextViewer.js.map +0 -1
  110. package/lib/components/RichTextEditor/RichTextViewer.types.d.ts +0 -33
  111. package/lib/components/RichTextEditor/RichTextViewer.types.d.ts.map +0 -1
  112. package/lib/components/RichTextEditor/RichTextViewer.types.js +0 -2
  113. package/lib/components/RichTextEditor/RichTextViewer.types.js.map +0 -1
  114. package/lib/components/RichTextEditor/Toolbar/AnchorButton.d.ts +0 -8
  115. package/lib/components/RichTextEditor/Toolbar/AnchorButton.d.ts.map +0 -1
  116. package/lib/components/RichTextEditor/Toolbar/AnchorButton.js +0 -156
  117. package/lib/components/RichTextEditor/Toolbar/AnchorButton.js.map +0 -1
  118. package/lib/components/RichTextEditor/Toolbar/ImageButton.d.ts +0 -5
  119. package/lib/components/RichTextEditor/Toolbar/ImageButton.d.ts.map +0 -1
  120. package/lib/components/RichTextEditor/Toolbar/ImageButton.js +0 -30
  121. package/lib/components/RichTextEditor/Toolbar/ImageButton.js.map +0 -1
  122. package/lib/components/RichTextEditor/Toolbar/IndentButton.d.ts +0 -8
  123. package/lib/components/RichTextEditor/Toolbar/IndentButton.d.ts.map +0 -1
  124. package/lib/components/RichTextEditor/Toolbar/IndentButton.js +0 -31
  125. package/lib/components/RichTextEditor/Toolbar/IndentButton.js.map +0 -1
  126. package/lib/components/RichTextEditor/Toolbar/TableButton.d.ts +0 -5
  127. package/lib/components/RichTextEditor/Toolbar/TableButton.d.ts.map +0 -1
  128. package/lib/components/RichTextEditor/Toolbar/TableButton.js +0 -20
  129. package/lib/components/RichTextEditor/Toolbar/TableButton.js.map +0 -1
  130. package/lib/components/RichTextEditor/Toolbar/TextSelect.d.ts +0 -6
  131. package/lib/components/RichTextEditor/Toolbar/TextSelect.d.ts.map +0 -1
  132. package/lib/components/RichTextEditor/Toolbar/TextSelect.js +0 -119
  133. package/lib/components/RichTextEditor/Toolbar/TextSelect.js.map +0 -1
  134. package/lib/components/RichTextEditor/Toolbar/Toolbar.d.ts +0 -10
  135. package/lib/components/RichTextEditor/Toolbar/Toolbar.d.ts.map +0 -1
  136. package/lib/components/RichTextEditor/Toolbar/Toolbar.js +0 -155
  137. package/lib/components/RichTextEditor/Toolbar/Toolbar.js.map +0 -1
  138. package/lib/components/RichTextEditor/Toolbar/Toolbar.types.d.ts +0 -9
  139. package/lib/components/RichTextEditor/Toolbar/Toolbar.types.d.ts.map +0 -1
  140. package/lib/components/RichTextEditor/Toolbar/Toolbar.types.js +0 -2
  141. package/lib/components/RichTextEditor/Toolbar/Toolbar.types.js.map +0 -1
  142. package/lib/components/RichTextEditor/Toolbar/ToolbarButton.d.ts +0 -14
  143. package/lib/components/RichTextEditor/Toolbar/ToolbarButton.d.ts.map +0 -1
  144. package/lib/components/RichTextEditor/Toolbar/ToolbarButton.js +0 -67
  145. package/lib/components/RichTextEditor/Toolbar/ToolbarButton.js.map +0 -1
  146. package/lib/components/RichTextEditor/Toolbar/utils.d.ts +0 -7
  147. package/lib/components/RichTextEditor/Toolbar/utils.d.ts.map +0 -1
  148. package/lib/components/RichTextEditor/Toolbar/utils.js +0 -13
  149. package/lib/components/RichTextEditor/Toolbar/utils.js.map +0 -1
  150. package/lib/components/RichTextEditor/index.d.ts +0 -9
  151. package/lib/components/RichTextEditor/index.d.ts.map +0 -1
  152. package/lib/components/RichTextEditor/index.js +0 -6
  153. package/lib/components/RichTextEditor/index.js.map +0 -1
  154. package/lib/components/RichTextEditor/utils/EditorCommands.d.ts +0 -34
  155. package/lib/components/RichTextEditor/utils/EditorCommands.d.ts.map +0 -1
  156. package/lib/components/RichTextEditor/utils/EditorCommands.js +0 -447
  157. package/lib/components/RichTextEditor/utils/EditorCommands.js.map +0 -1
  158. package/lib/components/RichTextEditor/utils/ListCommands.d.ts +0 -10
  159. package/lib/components/RichTextEditor/utils/ListCommands.d.ts.map +0 -1
  160. package/lib/components/RichTextEditor/utils/ListCommands.js +0 -346
  161. package/lib/components/RichTextEditor/utils/ListCommands.js.map +0 -1
  162. package/lib/components/RichTextEditor/utils/htmlConverter.d.ts +0 -29
  163. package/lib/components/RichTextEditor/utils/htmlConverter.d.ts.map +0 -1
  164. package/lib/components/RichTextEditor/utils/htmlConverter.js +0 -156
  165. package/lib/components/RichTextEditor/utils/htmlConverter.js.map +0 -1
  166. package/lib/components/RichTextEditor/utils/interactionRenderer.d.ts +0 -6
  167. package/lib/components/RichTextEditor/utils/interactionRenderer.d.ts.map +0 -1
  168. package/lib/components/RichTextEditor/utils/interactionRenderer.js +0 -132
  169. package/lib/components/RichTextEditor/utils/interactionRenderer.js.map +0 -1
  170. package/lib/components/RichTextEditor/utils/markdownConverter.d.ts +0 -6
  171. package/lib/components/RichTextEditor/utils/markdownConverter.d.ts.map +0 -1
  172. package/lib/components/RichTextEditor/utils/markdownConverter.js +0 -130
  173. package/lib/components/RichTextEditor/utils/markdownConverter.js.map +0 -1
  174. package/lib/components/RichTextEditor/utils/renderers.d.ts +0 -22
  175. package/lib/components/RichTextEditor/utils/renderers.d.ts.map +0 -1
  176. package/lib/components/RichTextEditor/utils/renderers.js +0 -163
  177. package/lib/components/RichTextEditor/utils/renderers.js.map +0 -1
  178. package/lib/components/RichTextEditor/utils/search.d.ts +0 -11
  179. package/lib/components/RichTextEditor/utils/search.d.ts.map +0 -1
  180. package/lib/components/RichTextEditor/utils/search.js +0 -37
  181. package/lib/components/RichTextEditor/utils/search.js.map +0 -1
  182. package/lib/components/RichTextEditor/utils/slateConverter.d.ts +0 -25
  183. package/lib/components/RichTextEditor/utils/slateConverter.d.ts.map +0 -1
  184. package/lib/components/RichTextEditor/utils/slateConverter.js +0 -88
  185. package/lib/components/RichTextEditor/utils/slateConverter.js.map +0 -1
  186. package/lib/components/RichTextEditor/utils/utils.types.d.ts +0 -3
  187. package/lib/components/RichTextEditor/utils/utils.types.d.ts.map +0 -1
  188. package/lib/components/RichTextEditor/utils/utils.types.js +0 -3
  189. package/lib/components/RichTextEditor/utils/utils.types.js.map +0 -1
  190. package/lib/index.d.ts +0 -5
  191. package/lib/index.d.ts.map +0 -1
  192. package/lib/index.js +0 -6
  193. package/lib/index.js.map +0 -1
@@ -1,131 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import { useRef, useState, useMemo } from 'react';
3
- import styled, { css } from 'styled-components';
4
- import { Popover, Icon, registerIcon, useOuterEvent, Menu, Button, defaultThemeProp, useI18n, Tooltip, calculateFontSize } from '@pega/cosmos-react-core';
5
- import * as arrowMicroDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-micro-down.icon';
6
- import { getKeyCommand } from '../../RichTextEditor/Toolbar/utils';
7
- registerIcon(arrowMicroDownIcon);
8
- const StyledTextSelect = styled(Button)(({ theme }) => {
9
- const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);
10
- return css `
11
- color: ${theme.base.palette['foreground-color']};
12
- display: inline-flex;
13
- align-items: center;
14
- border-radius: calc(0.25 * ${theme.base['border-radius']});
15
- height: calc(4 * ${theme.base.spacing});
16
- padding: calc(0.5 * ${theme.base.spacing});
17
- font-size: ${fontSizes.xxs};
18
-
19
- span {
20
- white-space: nowrap;
21
- }
22
-
23
- :focus {
24
- box-shadow: ${theme.base.shadow.focus};
25
- }
26
- `;
27
- });
28
- StyledTextSelect.defaultProps = defaultThemeProp;
29
- const StyledSelectMenu = styled.div `
30
- min-width: 20ch;
31
- `;
32
- const textMapping = {
33
- p: 'Normal',
34
- h1: 'Heading 1',
35
- h2: 'Heading 2',
36
- h3: 'Heading 3',
37
- h4: 'Heading 4',
38
- '': 'Normal',
39
- div: 'Normal'
40
- };
41
- const getTextCommand = (num, osx) => {
42
- return getKeyCommand(osx, ({ ctrl, alt }) => `${ctrl}${alt}${num}`);
43
- };
44
- export const getTextFormats = (osx = false) => {
45
- return [
46
- { text: 'Normal', subText: getTextCommand(0, osx), type: 'p' },
47
- { text: 'Heading 1', subText: getTextCommand(1, osx), type: 'h1' },
48
- { text: 'Heading 2', subText: getTextCommand(2, osx), type: 'h2' },
49
- { text: 'Heading 3', subText: getTextCommand(3, osx), type: 'h3' },
50
- { text: 'Heading 4', subText: getTextCommand(4, osx), type: 'h4' }
51
- ];
52
- };
53
- const TextSelect = ({ osx, editor, ...restProps }) => {
54
- const t = useI18n();
55
- const [open, setOpen] = useState(false);
56
- const selecting = useRef(false);
57
- const openedByClick = useRef(false);
58
- const buttonRef = useRef(null);
59
- const popoverRef = useRef(null);
60
- const menuRef = useRef(null);
61
- const textFormats = useMemo(() => {
62
- return getTextFormats(osx);
63
- }, [osx]);
64
- useOuterEvent('click', [buttonRef, popoverRef, menuRef], () => {
65
- setOpen(false);
66
- });
67
- const onTextSelect = (type, e) => {
68
- e.stopPropagation();
69
- e.preventDefault();
70
- editor.execCommand('FormatBlock', false, type);
71
- if (!openedByClick.current) {
72
- buttonRef.current?.focus();
73
- }
74
- setOpen(false);
75
- selecting.current = true;
76
- setTimeout(() => {
77
- if (!editor.hasFocus() && openedByClick.current) {
78
- editor.focus();
79
- }
80
- }, 0);
81
- };
82
- const getParentTextFormat = (el) => {
83
- const elTagName = el.nodeName.toLowerCase();
84
- if (textMapping[elTagName]) {
85
- return elTagName;
86
- }
87
- if (el.parentNode) {
88
- return getParentTextFormat(el.parentNode);
89
- }
90
- return undefined;
91
- };
92
- const activeFormat = () => {
93
- return editor.hasFocus()
94
- ? getParentTextFormat(editor.selection.getNode())
95
- : editor.contentDocument?.body?.firstChild?.nodeName.toLowerCase();
96
- };
97
- const getFormatText = () => {
98
- const activeFormatType = activeFormat();
99
- const format = activeFormatType ? textMapping[activeFormatType] : 'Unknown';
100
- return format || 'Unknown';
101
- };
102
- return (_jsxs(_Fragment, { children: [_jsxs(StyledTextSelect, { ...restProps, variant: 'simple', type: 'button', icon: false, ref: buttonRef, onMouseDown: (e) => {
103
- e.preventDefault();
104
- e.stopPropagation();
105
- setOpen(true);
106
- openedByClick.current = true;
107
- }, onKeyDown: (e) => {
108
- if (e.key === 'Enter' && !selecting.current) {
109
- e.preventDefault();
110
- setOpen(true);
111
- openedByClick.current = false;
112
- }
113
- else if (e.key === 'Enter') {
114
- e.preventDefault();
115
- selecting.current = false;
116
- }
117
- else if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {
118
- setOpen(false);
119
- }
120
- }, onFocus: (e) => {
121
- e.preventDefault();
122
- e.stopPropagation();
123
- }, onClick: (e) => e.stopPropagation(), "aria-expanded": open, "aria-label": `${t('rte_text_formatting_toolbar')}. ${t('rte_heading_style')}. ${getFormatText()} ${t('selected').toLocaleLowerCase()}`, "aria-haspopup": true, children: [_jsx("span", { children: getFormatText() }), _jsx(Icon, { name: 'arrow-micro-down' })] }), buttonRef.current && (_jsx(Tooltip, { target: buttonRef.current, showDelay: 'none', hideDelay: 'none', children: t('rte_heading_style') })), _jsx(Popover, { show: open, as: StyledSelectMenu, target: buttonRef.current, placement: 'bottom-start', ref: popoverRef, children: _jsx(Menu, { items: textFormats.map(({ text, type, subText }) => ({
124
- id: type,
125
- primary: text,
126
- secondary: [subText],
127
- selected: type === activeFormat()
128
- })), focusControlEl: buttonRef.current ?? undefined, mode: 'single-select', ref: menuRef, onItemClick: onTextSelect }) })] }));
129
- };
130
- export default TextSelect;
131
- //# sourceMappingURL=TextSelect.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TextSelect.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/TextSelect.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useRef, useState, MouseEvent, KeyboardEvent, FocusEvent, useMemo } from 'react';\nimport { Editor } from 'tinymce';\nimport styled, { css } from 'styled-components';\n\nimport {\n Popover,\n Icon,\n registerIcon,\n useOuterEvent,\n Menu,\n Button,\n defaultThemeProp,\n useI18n,\n Tooltip,\n calculateFontSize\n} from '@pega/cosmos-react-core';\nimport * as arrowMicroDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-micro-down.icon';\n\nimport { getKeyCommand } from '../../RichTextEditor/Toolbar/utils';\n\nregisterIcon(arrowMicroDownIcon);\n\nconst StyledTextSelect = styled(Button)(({ theme }) => {\n const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n color: ${theme.base.palette['foreground-color']};\n display: inline-flex;\n align-items: center;\n border-radius: calc(0.25 * ${theme.base['border-radius']});\n height: calc(4 * ${theme.base.spacing});\n padding: calc(0.5 * ${theme.base.spacing});\n font-size: ${fontSizes.xxs};\n\n span {\n white-space: nowrap;\n }\n\n :focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n});\n\nStyledTextSelect.defaultProps = defaultThemeProp;\n\nconst StyledSelectMenu = styled.div`\n min-width: 20ch;\n`;\n\ntype FormatTypes = 'p' | 'h1' | 'h2' | 'h3' | 'h4';\n\nconst textMapping = {\n p: 'Normal',\n h1: 'Heading 1',\n h2: 'Heading 2',\n h3: 'Heading 3',\n h4: 'Heading 4',\n '': 'Normal',\n div: 'Normal'\n} as const;\n\nconst getTextCommand = (num: number, osx: boolean) => {\n return getKeyCommand(osx, ({ ctrl, alt }) => `${ctrl}${alt}${num}`);\n};\n\nexport const getTextFormats = (\n osx: boolean = false\n): { text: string; subText: string; type: FormatTypes }[] => {\n return [\n { text: 'Normal', subText: getTextCommand(0, osx), type: 'p' },\n { text: 'Heading 1', subText: getTextCommand(1, osx), type: 'h1' },\n { text: 'Heading 2', subText: getTextCommand(2, osx), type: 'h2' },\n { text: 'Heading 3', subText: getTextCommand(3, osx), type: 'h3' },\n { text: 'Heading 4', subText: getTextCommand(4, osx), type: 'h4' }\n ];\n};\n\nconst TextSelect: FC<{ osx: boolean; editor: Editor }> = ({ osx, editor, ...restProps }) => {\n const t = useI18n();\n const [open, setOpen] = useState(false);\n const selecting = useRef(false);\n const openedByClick = useRef(false);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const popoverRef = useRef(null);\n const menuRef = useRef(null);\n\n const textFormats = useMemo(() => {\n return getTextFormats(osx);\n }, [osx]);\n\n useOuterEvent('click', [buttonRef, popoverRef, menuRef], () => {\n setOpen(false);\n });\n\n const onTextSelect = (type: FormatTypes, e: MouseEvent) => {\n e.stopPropagation();\n e.preventDefault();\n editor.execCommand('FormatBlock', false, type);\n if (!openedByClick.current) {\n buttonRef.current?.focus();\n }\n setOpen(false);\n selecting.current = true;\n setTimeout(() => {\n if (!editor.hasFocus() && openedByClick.current) {\n editor.focus();\n }\n }, 0);\n };\n\n const getParentTextFormat = (el: Element | Node): FormatTypes | undefined => {\n const elTagName = el.nodeName.toLowerCase() as FormatTypes;\n if (textMapping[elTagName]) {\n return elTagName;\n }\n if (el.parentNode) {\n return getParentTextFormat(el.parentNode);\n }\n return undefined;\n };\n\n const activeFormat = (): FormatTypes | undefined => {\n return editor.hasFocus()\n ? getParentTextFormat(editor.selection.getNode())\n : (editor.contentDocument?.body?.firstChild?.nodeName.toLowerCase() as FormatTypes);\n };\n\n const getFormatText = (): string => {\n const activeFormatType = activeFormat();\n const format = activeFormatType ? textMapping[activeFormatType] : 'Unknown';\n return format || 'Unknown';\n };\n\n return (\n <>\n <StyledTextSelect\n {...restProps}\n variant='simple'\n type='button'\n icon={false}\n ref={buttonRef}\n onMouseDown={(e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setOpen(true);\n openedByClick.current = true;\n }}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === 'Enter' && !selecting.current) {\n e.preventDefault();\n setOpen(true);\n openedByClick.current = false;\n } else if (e.key === 'Enter') {\n e.preventDefault();\n selecting.current = false;\n } else if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n setOpen(false);\n }\n }}\n onFocus={(e: FocusEvent) => {\n e.preventDefault();\n e.stopPropagation();\n }}\n onClick={(e: MouseEvent) => e.stopPropagation()}\n aria-expanded={open}\n aria-label={`${t('rte_text_formatting_toolbar')}. ${t(\n 'rte_heading_style'\n )}. ${getFormatText()} ${t('selected').toLocaleLowerCase()}`}\n aria-haspopup\n >\n <span>{getFormatText()}</span>\n <Icon name='arrow-micro-down' />\n </StyledTextSelect>\n {buttonRef.current && (\n <Tooltip target={buttonRef.current} showDelay='none' hideDelay='none'>\n {t('rte_heading_style')}\n </Tooltip>\n )}\n <Popover\n show={open}\n as={StyledSelectMenu}\n target={buttonRef.current}\n placement='bottom-start'\n ref={popoverRef}\n >\n <Menu\n items={textFormats.map(({ text, type, subText }) => ({\n id: type,\n primary: text,\n secondary: [subText],\n selected: type === activeFormat()\n }))}\n focusControlEl={buttonRef.current ?? undefined}\n mode='single-select'\n ref={menuRef}\n onItemClick={onTextSelect as (id: string, e: MouseEvent) => void}\n />\n </Popover>\n </>\n );\n};\n\nexport default TextSelect;\n"]}
@@ -1,17 +0,0 @@
1
- import { FC } from 'react';
2
- import { Editor } from 'tinymce';
3
- import { TestIdProp } from '@pega/cosmos-react-core';
4
- import { Features } from '../../RichTextEditor/Toolbar/Toolbar.types';
5
- import { CustomAction } from '../Editor.types';
6
- import { elements } from './Toolbar.test-ids';
7
- export interface ToolbarProps extends TestIdProp<typeof elements> {
8
- features: Features[];
9
- sticky?: boolean;
10
- editor: Editor;
11
- customActions?: CustomAction[];
12
- }
13
- declare const _default: FC<ToolbarProps> & {
14
- getTestIds: (testIdProp?: string | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["toolbar", "text-styles", "bold", "italic", "strike-through", "bulleted-list", "numbered-list", "indent", "unindent", "link", "image"]>;
15
- };
16
- export default _default;
17
- //# sourceMappingURL=Toolbar.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/Toolbar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA4C,MAAM,OAAO,CAAC;AAErE,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEjC,OAAO,EAUL,UAAU,EAGX,MAAM,yBAAyB,CAAC;AAMjC,OAAO,EAAa,QAAQ,EAAE,MAAM,4CAA4C,CAAC;AAEjF,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAK/C,OAAO,EAAqB,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAwBjE,MAAM,WAAW,YAAa,SAAQ,UAAU,CAAC,OAAO,QAAQ,CAAC;IAC/D,QAAQ,EAAE,QAAQ,EAAE,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;CAChC;;;;AA8QD,wBAAuD"}
@@ -1,164 +0,0 @@
1
- import { createElement as _createElement } from "react";
2
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { useState, useEffect, useRef, useCallback } from 'react';
4
- import styled, { css } from 'styled-components';
5
- import { Flex, Icon, useArrows, useI18n, defaultThemeProp, registerIcon, useOS, navigatorIsAvailable, useTestIds, withTestIds } from '@pega/cosmos-react-core';
6
- import * as indentIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/indent.icon';
7
- import * as unindentIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/unindent.icon';
8
- import ToolbarButton from '../../RichTextEditor/Toolbar/ToolbarButton';
9
- import { getKeyCommand } from '../../RichTextEditor/Toolbar/utils';
10
- import ImageButton from './ImageButton';
11
- import TextSelect from './TextSelect';
12
- import AnchorButton from './AnchorButton';
13
- import { getToolbarTestIds } from './Toolbar.test-ids';
14
- registerIcon(indentIcon, unindentIcon);
15
- const StyledToolbar = styled.div(({ sticky, theme }) => {
16
- return css `
17
- background-color: ${theme.base.palette['primary-background']};
18
- border-radius: calc(0.25 * ${theme.base['border-radius']});
19
- overflow: auto;
20
- padding: calc(0.5 * ${theme.base.spacing});
21
- ${sticky &&
22
- css `
23
- position: sticky;
24
- bottom: 0;
25
- `}
26
-
27
- &:has(:focus-visible) {
28
- box-shadow: ${theme.base.shadow['focus-group']};
29
- }
30
- `;
31
- });
32
- StyledToolbar.defaultProps = defaultThemeProp;
33
- const isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');
34
- // Function that returns the text styling buttons
35
- function renderStyleButtons(editor, t, activeStyles, osx, testIds) {
36
- const inlineStyleButtons = [
37
- {
38
- 'data-testid': testIds.bold,
39
- style: 'BOLD',
40
- text: 'B',
41
- format: 'Bold',
42
- label: t('rte_bold'),
43
- element: 'strong',
44
- tooltip: isMobile
45
- ? `${t('rte_bold')}`
46
- : getKeyCommand(osx, ({ ctrl, shift }) => `${t('rte_bold')} (${ctrl}B, ${ctrl}${shift}B)`)
47
- },
48
- {
49
- 'data-testid': testIds.italic,
50
- style: 'ITALIC',
51
- text: 'I',
52
- format: 'Italic',
53
- label: t('rte_italic'),
54
- element: 'i',
55
- tooltip: isMobile
56
- ? `${t('rte_italic')}`
57
- : getKeyCommand(osx, ({ ctrl, shift }) => `${t('rte_italic')} (${ctrl}I, ${ctrl}${shift}I)`)
58
- },
59
- {
60
- 'data-testid': testIds.strikeThrough,
61
- style: 'STRIKE-THROUGH',
62
- text: 'S',
63
- format: 'Strikethrough',
64
- element: 's',
65
- label: t('rte_strike_through'),
66
- tooltip: isMobile
67
- ? `${t('rte_strike_through')}`
68
- : getKeyCommand(osx, ({ ctrl, shift }) => `${t('rte_strike_through')} (${ctrl}${shift}X)`)
69
- }
70
- ];
71
- return inlineStyleButtons.map(({ format, style, text, label, tooltip, 'data-testid': dataTestId }) => {
72
- return (_jsx(ToolbarButton, { "data-testid": dataTestId, onMouseDown: e => {
73
- e.preventDefault();
74
- if (editor.hasFocus()) {
75
- editor.execCommand(format);
76
- }
77
- else {
78
- editor.focus();
79
- setTimeout(() => {
80
- editor.execCommand(format);
81
- }, 0);
82
- }
83
- }, styleType: style, active: activeStyles[format.toLowerCase()], tooltip: tooltip, label: label, children: text }, style));
84
- });
85
- }
86
- // Takes the features array and transforms it into a map for faster lookup
87
- function createActiveFeaturesMap(features) {
88
- return features.reduce((acc, feature) => {
89
- return { ...acc, [feature]: true };
90
- }, {});
91
- }
92
- const Toolbar = ({ testId, features, sticky, editor, customActions, ...restProps }) => {
93
- const t = useI18n();
94
- const { macintosh: osx } = useOS();
95
- const toolbarRef = useRef(null);
96
- const testIds = useTestIds(testId, getToolbarTestIds);
97
- useArrows(toolbarRef, { selector: 'button', dir: 'left-right' });
98
- const [activeFeatures, setActiveFeatures] = useState(() => createActiveFeaturesMap(features));
99
- const [activeStyles, setActiveStyles] = useState(() => ({
100
- bold: false,
101
- italic: false,
102
- strikethrough: false,
103
- unorderedList: false,
104
- orderedList: false
105
- }));
106
- const getIndentationToolTip = (type) => getKeyCommand(osx, ({ shift, alt }) => type === 'indent' ? `${t('rte_indent')} (${alt}M)` : `${t('rte_unindent')} (${alt}${shift}M)`);
107
- const tooltipMobile = (type) => type === 'indent' ? `${t('rte_indent')}` : `${t('rte_unindent')}`;
108
- useEffect(() => {
109
- setActiveFeatures(createActiveFeaturesMap(features));
110
- }, [features]);
111
- const getActiveStyles = useCallback(() => {
112
- if (editor.hasFocus()) {
113
- setActiveStyles({
114
- bold: editor.queryCommandState('Bold'),
115
- italic: editor.queryCommandState('Italic'),
116
- strikethrough: editor.queryCommandState('Strikethrough'),
117
- unorderedList: editor.queryCommandState('InsertUnorderedList'),
118
- orderedList: editor.queryCommandState('InsertOrderedList')
119
- });
120
- }
121
- else {
122
- setActiveStyles({
123
- bold: false,
124
- italic: false,
125
- strikethrough: false,
126
- unorderedList: false,
127
- orderedList: false
128
- });
129
- }
130
- }, [editor, setActiveStyles]);
131
- useEffect(() => {
132
- getActiveStyles();
133
- editor.on('SelectionChange', getActiveStyles);
134
- return () => {
135
- editor.off('SelectionChange', getActiveStyles);
136
- };
137
- }, [editor, getActiveStyles]);
138
- return (_jsxs(Flex, { "data-testid": testIds.toolbar, ...restProps, as: StyledToolbar, sticky: sticky, container: { justify: 'between' }, ref: toolbarRef, children: [_jsxs(Flex, { container: { alignItems: 'end' }, children: [_jsx(TextSelect, { "data-testid": testIds.textStyles, osx: osx, editor: editor }), activeFeatures['inline-styling'] &&
139
- renderStyleButtons(editor, t, activeStyles, osx, testIds), activeFeatures.lists && (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { "data-testid": testIds.bulletedList, onMouseDown: e => {
140
- e.preventDefault();
141
- editor.execCommand('InsertUnorderedList');
142
- }, active: activeStyles.unorderedList, tooltip: isMobile
143
- ? `${t('rte_bulleted_list')}`
144
- : getKeyCommand(osx, ({ ctrl, shift }) => `${t('rte_bulleted_list')} (${ctrl}${shift}L)`), label: t('rte_bulleted_list'), children: _jsx(Icon, { name: 'list' }) }), _jsx(ToolbarButton, { "data-testid": testIds.numberedList, onMouseDown: e => {
145
- e.preventDefault();
146
- editor.execCommand('InsertOrderedList');
147
- }, active: activeStyles.orderedList, tooltip: t('rte_numbered_list'), label: t('rte_numbered_list'), children: _jsx(Icon, { name: 'list-number' }) })] })), activeFeatures.indentation && (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { "data-testid": testIds.indent, onMouseDown: e => {
148
- e.preventDefault();
149
- editor.execCommand('Indent');
150
- }, label: t('rte_indent'), tooltip: isMobile ? tooltipMobile('indent') : getIndentationToolTip('indent'), children: _jsx(Icon, { name: 'indent' }) }), _jsx(ToolbarButton, { "data-testid": testIds.unindent, onMouseDown: e => {
151
- e.preventDefault();
152
- editor.execCommand('Outdent');
153
- }, label: t('rte_unindent'), tooltip: isMobile ? tooltipMobile('unindent') : getIndentationToolTip('unindent'), children: _jsx(Icon, { name: 'unindent' }) })] }))] }), _jsxs(Flex, { container: { alignItems: 'end' }, children: [customActions?.map(({ text, icon, active, onMouseDown,
154
- // Avoid spreading shortcut to DOM attribute
155
- shortcut, ...rest }) => {
156
- return (_createElement(ToolbarButton, { ...rest, onMouseDown: e => {
157
- e.preventDefault();
158
- onMouseDown(e);
159
- }, tooltip: text, label: text, key: icon, active: active?.(editor) || false },
160
- _jsx(Icon, { name: icon })));
161
- }), activeFeatures.links && (_jsx(AnchorButton, { "data-testid": testIds.link, editor: editor, osx: osx })), activeFeatures.images && _jsx(ImageButton, { "data-testid": testIds.image, editor: editor })] })] }));
162
- };
163
- export default withTestIds(Toolbar, getToolbarTestIds);
164
- //# sourceMappingURL=Toolbar.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Toolbar.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/Toolbar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useState, useEffect, useRef, useCallback } from 'react';\nimport styled, { css } from 'styled-components';\nimport { Editor } from 'tinymce';\n\nimport {\n Flex,\n Icon,\n useArrows,\n useI18n,\n defaultThemeProp,\n TranslationPack,\n registerIcon,\n useOS,\n navigatorIsAvailable,\n TestIdProp,\n useTestIds,\n withTestIds\n} from '@pega/cosmos-react-core';\nimport { TranslationFunction } from '@pega/cosmos-react-core/lib/i18n/translate';\nimport * as indentIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/indent.icon';\nimport * as unindentIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/unindent.icon';\n\nimport ToolbarButton from '../../RichTextEditor/Toolbar/ToolbarButton';\nimport { StyleType, Features } from '../../RichTextEditor/Toolbar/Toolbar.types';\nimport { getKeyCommand } from '../../RichTextEditor/Toolbar/utils';\nimport { CustomAction } from '../Editor.types';\n\nimport ImageButton from './ImageButton';\nimport TextSelect from './TextSelect';\nimport AnchorButton from './AnchorButton';\nimport { getToolbarTestIds, elements } from './Toolbar.test-ids';\n\nregisterIcon(indentIcon, unindentIcon);\n\nconst StyledToolbar = styled.div<{ sticky?: boolean }>(({ sticky, theme }) => {\n return css`\n background-color: ${theme.base.palette['primary-background']};\n border-radius: calc(0.25 * ${theme.base['border-radius']});\n overflow: auto;\n padding: calc(0.5 * ${theme.base.spacing});\n ${sticky &&\n css`\n position: sticky;\n bottom: 0;\n `}\n\n &:has(:focus-visible) {\n box-shadow: ${theme.base.shadow['focus-group']};\n }\n `;\n});\n\nStyledToolbar.defaultProps = defaultThemeProp;\n\nexport interface ToolbarProps extends TestIdProp<typeof elements> {\n features: Features[];\n sticky?: boolean;\n editor: Editor;\n customActions?: CustomAction[];\n}\n\ntype StyleButtonType = {\n 'data-testid'?: string;\n style: StyleType;\n text: string;\n icon?: string;\n label?: string;\n format: string;\n element?: string;\n tooltip: string;\n};\n\nconst isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');\n\n// Function that returns the text styling buttons\nfunction renderStyleButtons(\n editor: Editor,\n t: TranslationFunction<TranslationPack>,\n activeStyles: { [key: string]: boolean },\n osx: boolean,\n testIds: Pick<Partial<ReturnType<typeof getToolbarTestIds>>, 'bold' | 'italic' | 'strikeThrough'>\n) {\n const inlineStyleButtons: StyleButtonType[] = [\n {\n 'data-testid': testIds.bold,\n style: 'BOLD',\n text: 'B',\n format: 'Bold',\n label: t('rte_bold'),\n element: 'strong',\n tooltip: isMobile\n ? `${t('rte_bold')}`\n : getKeyCommand(osx, ({ ctrl, shift }) => `${t('rte_bold')} (${ctrl}B, ${ctrl}${shift}B)`)\n },\n {\n 'data-testid': testIds.italic,\n style: 'ITALIC',\n text: 'I',\n format: 'Italic',\n label: t('rte_italic'),\n element: 'i',\n tooltip: isMobile\n ? `${t('rte_italic')}`\n : getKeyCommand(osx, ({ ctrl, shift }) => `${t('rte_italic')} (${ctrl}I, ${ctrl}${shift}I)`)\n },\n {\n 'data-testid': testIds.strikeThrough,\n style: 'STRIKE-THROUGH',\n text: 'S',\n format: 'Strikethrough',\n element: 's',\n label: t('rte_strike_through'),\n tooltip: isMobile\n ? `${t('rte_strike_through')}`\n : getKeyCommand(osx, ({ ctrl, shift }) => `${t('rte_strike_through')} (${ctrl}${shift}X)`)\n }\n ];\n\n return inlineStyleButtons.map(\n ({ format, style, text, label, tooltip, 'data-testid': dataTestId }) => {\n return (\n <ToolbarButton\n data-testid={dataTestId}\n key={style}\n onMouseDown={e => {\n e.preventDefault();\n if (editor.hasFocus()) {\n editor.execCommand(format);\n } else {\n editor.focus();\n setTimeout(() => {\n editor.execCommand(format);\n }, 0);\n }\n }}\n styleType={style}\n active={activeStyles[format.toLowerCase()]}\n tooltip={tooltip}\n label={label}\n >\n {text}\n </ToolbarButton>\n );\n }\n );\n}\n\n// Takes the features array and transforms it into a map for faster lookup\nfunction createActiveFeaturesMap(features: Features[]) {\n return features.reduce((acc, feature) => {\n return { ...acc, [feature]: true };\n }, {} as { [F in Features]: boolean });\n}\n\nconst Toolbar: FC<ToolbarProps> = ({\n testId,\n features,\n sticky,\n editor,\n customActions,\n ...restProps\n}: ToolbarProps) => {\n const t = useI18n();\n const { macintosh: osx } = useOS();\n const toolbarRef = useRef<HTMLElement>(null);\n const testIds = useTestIds(testId, getToolbarTestIds);\n\n useArrows(toolbarRef, { selector: 'button', dir: 'left-right' });\n\n const [activeFeatures, setActiveFeatures] = useState(() => createActiveFeaturesMap(features));\n const [activeStyles, setActiveStyles] = useState(() => ({\n bold: false,\n italic: false,\n strikethrough: false,\n unorderedList: false,\n orderedList: false\n }));\n\n const getIndentationToolTip = (type: 'indent' | 'unindent') =>\n getKeyCommand(osx, ({ shift, alt }) =>\n type === 'indent' ? `${t('rte_indent')} (${alt}M)` : `${t('rte_unindent')} (${alt}${shift}M)`\n );\n const tooltipMobile = (type: 'indent' | 'unindent') =>\n type === 'indent' ? `${t('rte_indent')}` : `${t('rte_unindent')}`;\n\n useEffect(() => {\n setActiveFeatures(createActiveFeaturesMap(features));\n }, [features]);\n\n const getActiveStyles = useCallback(() => {\n if (editor.hasFocus()) {\n setActiveStyles({\n bold: editor.queryCommandState('Bold'),\n italic: editor.queryCommandState('Italic'),\n strikethrough: editor.queryCommandState('Strikethrough'),\n unorderedList: editor.queryCommandState('InsertUnorderedList'),\n orderedList: editor.queryCommandState('InsertOrderedList')\n });\n } else {\n setActiveStyles({\n bold: false,\n italic: false,\n strikethrough: false,\n unorderedList: false,\n orderedList: false\n });\n }\n }, [editor, setActiveStyles]);\n\n useEffect(() => {\n getActiveStyles();\n editor.on('SelectionChange', getActiveStyles);\n return () => {\n editor.off('SelectionChange', getActiveStyles);\n };\n }, [editor, getActiveStyles]);\n\n return (\n <Flex\n data-testid={testIds.toolbar}\n {...restProps}\n as={StyledToolbar}\n sticky={sticky}\n container={{ justify: 'between' }}\n ref={toolbarRef}\n >\n <Flex container={{ alignItems: 'end' }}>\n <TextSelect data-testid={testIds.textStyles} osx={osx} editor={editor} />\n {activeFeatures['inline-styling'] &&\n renderStyleButtons(editor, t, activeStyles, osx, testIds)}\n {activeFeatures.lists && (\n <>\n <ToolbarButton\n data-testid={testIds.bulletedList}\n onMouseDown={e => {\n e.preventDefault();\n editor.execCommand('InsertUnorderedList');\n }}\n active={activeStyles.unorderedList}\n tooltip={\n isMobile\n ? `${t('rte_bulleted_list')}`\n : getKeyCommand(\n osx,\n ({ ctrl, shift }) => `${t('rte_bulleted_list')} (${ctrl}${shift}L)`\n )\n }\n label={t('rte_bulleted_list')}\n >\n <Icon name='list' />\n </ToolbarButton>\n <ToolbarButton\n data-testid={testIds.numberedList}\n onMouseDown={e => {\n e.preventDefault();\n editor.execCommand('InsertOrderedList');\n }}\n active={activeStyles.orderedList}\n tooltip={t('rte_numbered_list')}\n label={t('rte_numbered_list')}\n >\n <Icon name='list-number' />\n </ToolbarButton>\n </>\n )}\n {activeFeatures.indentation && (\n <>\n <ToolbarButton\n data-testid={testIds.indent}\n onMouseDown={e => {\n e.preventDefault();\n editor.execCommand('Indent');\n }}\n label={t('rte_indent')}\n tooltip={isMobile ? tooltipMobile('indent') : getIndentationToolTip('indent')}\n >\n <Icon name='indent' />\n </ToolbarButton>\n <ToolbarButton\n data-testid={testIds.unindent}\n onMouseDown={e => {\n e.preventDefault();\n editor.execCommand('Outdent');\n }}\n label={t('rte_unindent')}\n tooltip={isMobile ? tooltipMobile('unindent') : getIndentationToolTip('unindent')}\n >\n <Icon name='unindent' />\n </ToolbarButton>\n </>\n )}\n </Flex>\n <Flex container={{ alignItems: 'end' }}>\n {customActions?.map(\n ({\n text,\n icon,\n active,\n onMouseDown,\n // Avoid spreading shortcut to DOM attribute\n shortcut,\n ...rest\n }) => {\n return (\n <ToolbarButton\n {...rest}\n onMouseDown={e => {\n e.preventDefault();\n onMouseDown(e);\n }}\n tooltip={text}\n label={text}\n key={icon}\n active={active?.(editor) || false}\n >\n <Icon name={icon} />\n </ToolbarButton>\n );\n }\n )}\n {activeFeatures.links && (\n <AnchorButton data-testid={testIds.link} editor={editor} osx={osx} />\n )}\n {activeFeatures.images && <ImageButton data-testid={testIds.image} editor={editor} />}\n </Flex>\n </Flex>\n );\n};\n\nexport default withTestIds(Toolbar, getToolbarTestIds);\n"]}
@@ -1,3 +0,0 @@
1
- export declare const elements: readonly ["toolbar", "text-styles", "bold", "italic", "strike-through", "bulleted-list", "numbered-list", "indent", "unindent", "link", "image"];
2
- export declare const getToolbarTestIds: (testIdProp?: string | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["toolbar", "text-styles", "bold", "italic", "strike-through", "bulleted-list", "numbered-list", "indent", "unindent", "link", "image"]>;
3
- //# sourceMappingURL=Toolbar.test-ids.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Toolbar.test-ids.d.ts","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/Toolbar.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,kJAYX,CAAC;AAEX,eAAO,MAAM,iBAAiB,wOAAqC,CAAC"}
@@ -1,16 +0,0 @@
1
- import { createTestIds } from '@pega/cosmos-react-core';
2
- export const elements = [
3
- 'toolbar',
4
- 'text-styles',
5
- 'bold',
6
- 'italic',
7
- 'strike-through',
8
- 'bulleted-list',
9
- 'numbered-list',
10
- 'indent',
11
- 'unindent',
12
- 'link',
13
- 'image'
14
- ];
15
- export const getToolbarTestIds = createTestIds('toolbar', elements);
16
- //# sourceMappingURL=Toolbar.test-ids.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Toolbar.test-ids.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/Toolbar.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,SAAS;IACT,aAAa;IACb,MAAM;IACN,QAAQ;IACR,gBAAgB;IAChB,eAAe;IACf,eAAe;IACf,QAAQ;IACR,UAAU;IACV,MAAM;IACN,OAAO;CACC,CAAC;AAEX,MAAM,CAAC,MAAM,iBAAiB,GAAG,aAAa,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["import { createTestIds } from '@pega/cosmos-react-core';\n\nexport const elements = [\n 'toolbar',\n 'text-styles',\n 'bold',\n 'italic',\n 'strike-through',\n 'bulleted-list',\n 'numbered-list',\n 'indent',\n 'unindent',\n 'link',\n 'image'\n] as const;\n\nexport const getToolbarTestIds = createTestIds('toolbar', elements);\n"]}
@@ -1,4 +0,0 @@
1
- export { default as Editor } from './Editor';
2
- export type { EditorProps, EditorState } from './Editor.types';
3
- export { useEditorContext } from './Editor.context';
4
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Editor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC/D,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC"}
@@ -1,3 +0,0 @@
1
- export { default as Editor } from './Editor';
2
- export { useEditorContext } from './Editor.context';
3
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Editor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAE7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["export { default as Editor } from './Editor';\nexport type { EditorProps, EditorState } from './Editor.types';\nexport { useEditorContext } from './Editor.context';\n"]}
@@ -1,4 +0,0 @@
1
- import { FC } from 'react';
2
- declare const CodeBlock: FC<any>;
3
- export default CodeBlock;
4
- //# sourceMappingURL=CodeBlock.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/CodeBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAc3B,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,GAAG,CAEtB,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1,15 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import styled from 'styled-components';
3
- import { defaultThemeProp } from '@pega/cosmos-react-core';
4
- const StyledCodeBlock = styled.code `
5
- background-color: ${props => props.theme.base.colors.gray['extra-light']};
6
- display: block;
7
- font-family: monospace;
8
- padding: ${props => props.theme.base.spacing};
9
- `;
10
- StyledCodeBlock.defaultProps = defaultThemeProp;
11
- const CodeBlock = (props) => {
12
- return _jsx(StyledCodeBlock, { ...props });
13
- };
14
- export default CodeBlock;
15
- //# sourceMappingURL=CodeBlock.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CodeBlock.js","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/CodeBlock.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,eAAe,GAAG,MAAM,CAAC,IAAI,CAAA;sBACb,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC;;;aAG7D,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO;CAC7C,CAAC;AAEF,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhD,MAAM,SAAS,GAAY,CAAC,KAAU,EAAE,EAAE;IACxC,OAAO,KAAC,eAAe,OAAK,KAAK,GAAI,CAAC;AACxC,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { FC } from 'react';\nimport styled from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nconst StyledCodeBlock = styled.code`\n background-color: ${props => props.theme.base.colors.gray['extra-light']};\n display: block;\n font-family: monospace;\n padding: ${props => props.theme.base.spacing};\n`;\n\nStyledCodeBlock.defaultProps = defaultThemeProp;\n\nconst CodeBlock: FC<any> = (props: any) => {\n return <StyledCodeBlock {...props} />;\n};\n\nexport default CodeBlock;\n"]}
@@ -1,4 +0,0 @@
1
- import { FC } from 'react';
2
- declare const ImageBlock: FC<any>;
3
- export default ImageBlock;
4
- //# sourceMappingURL=Image.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/Image.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAS3B,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,GAAG,CAMvB,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -1,7 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { Flex, Image } from '@pega/cosmos-react-core';
3
- const ImageBlock = ({ src, alt }) => {
4
- return (_jsx(Flex, { container: { alignItems: 'end' }, children: _jsx(Image, { src: src, alt: alt }) }));
5
- };
6
- export default ImageBlock;
7
- //# sourceMappingURL=Image.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Image.js","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/Image.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAOtD,MAAM,UAAU,GAAY,CAAC,EAAE,GAAG,EAAE,GAAG,EAAmB,EAAE,EAAE;IAC5D,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,YACpC,KAAC,KAAK,IAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAI,GACxB,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import { FC } from 'react';\n\nimport { Flex, Image } from '@pega/cosmos-react-core';\n\ninterface ImageBlockProps {\n src: string;\n alt: string;\n}\n\nconst ImageBlock: FC<any> = ({ src, alt }: ImageBlockProps) => {\n return (\n <Flex container={{ alignItems: 'end' }}>\n <Image src={src} alt={alt} />\n </Flex>\n );\n};\n\nexport default ImageBlock;\n"]}
@@ -1,4 +0,0 @@
1
- import { FC } from 'react';
2
- declare const LinkEntity: FC<any>;
3
- export default LinkEntity;
4
- //# sourceMappingURL=Link.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,GAAG,CAGvB,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -1,8 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { Link } from '@pega/cosmos-react-core';
3
- const LinkEntity = ({ children, contentState, entityKey }) => {
4
- const { url } = contentState.getEntity(entityKey).getData();
5
- return _jsx(Link, { href: url, children: children });
6
- };
7
- export default LinkEntity;
8
- //# sourceMappingURL=Link.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/DecoratorComponents/Link.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,MAAM,UAAU,GAAY,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAO,EAAE,EAAE;IACzE,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,OAAO,EAAE,CAAC;IAC5D,OAAO,KAAC,IAAI,IAAC,IAAI,EAAE,GAAG,YAAG,QAAQ,GAAQ,CAAC;AAC5C,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import { FC } from 'react';\n\nimport { Link } from '@pega/cosmos-react-core';\n\nconst LinkEntity: FC<any> = ({ children, contentState, entityKey }: any) => {\n const { url } = contentState.getEntity(entityKey).getData();\n return <Link href={url}>{children}</Link>;\n};\n\nexport default LinkEntity;\n"]}
@@ -1,6 +0,0 @@
1
- import { FC } from 'react';
2
- export declare const TableBody: FC<any>;
3
- export declare const Table: FC<any>;
4
- export declare const TableRow: FC<any>;
5
- export declare const TableCell: FC<any>;
6
- //# sourceMappingURL=Table.d.ts.map
@@ -1 +0,0 @@
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;AAU5C,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,24 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { forwardRef } from 'react';
3
- import styled from 'styled-components';
4
- import { defaultThemeProp } from '@pega/cosmos-react-core';
5
- import { getTableStyles } from '@pega/cosmos-react-core/lib/components/HTML/HTML';
6
- const StyledTable = styled.table(props => getTableStyles(props.theme));
7
- StyledTable.defaultProps = defaultThemeProp;
8
- export const TableBody = forwardRef(function TableBody(props, ref) {
9
- const { children, ...restProps } = props;
10
- return (_jsx("tbody", { ...restProps, ref: ref, children: children }));
11
- });
12
- export const Table = forwardRef(function Table(props, ref) {
13
- const { children, ...restProps } = props;
14
- return (_jsx(StyledTable, { ...restProps, ref: ref, children: children }));
15
- });
16
- export const TableRow = forwardRef(function TableRow(props, ref) {
17
- const { children, ...restProps } = props;
18
- return (_jsx("tr", { ...restProps, ref: ref, children: children }));
19
- });
20
- export const TableCell = forwardRef(function TableCell(props, ref) {
21
- const { children, ...restProps } = props;
22
- return (_jsx("td", { ...restProps, ref: ref, children: children }));
23
- });
24
- //# sourceMappingURL=Table.js.map
@@ -1 +0,0 @@
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;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,kDAAkD,CAAC;AAElF,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,SAAS,SAAS,CAAC,KAAU,EAAE,GAAa;IACvF,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,mBAAW,SAAS,EAAE,GAAG,EAAE,GAAG,YAC3B,QAAQ,GACH,CACT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,KAAK,GAAY,UAAU,CAAC,SAAS,KAAK,CAAC,KAAU,EAAE,GAAa;IAC/E,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,KAAC,WAAW,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,YACjC,QAAQ,GACG,CACf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,QAAQ,GAAY,UAAU,CAAC,SAAS,QAAQ,CAAC,KAAU,EAAE,GAAa;IACrF,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,gBAAQ,SAAS,EAAE,GAAG,EAAE,GAAG,YACxB,QAAQ,GACN,CACN,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,SAAS,GAAY,UAAU,CAAC,SAAS,SAAS,CAAC,KAAU,EAAE,GAAa;IACvF,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACzC,OAAO,CACL,gBAAQ,SAAS,EAAE,GAAG,EAAE,GAAG,YACxB,QAAQ,GACN,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';\nimport { getTableStyles } from '@pega/cosmos-react-core/lib/components/HTML/HTML';\n\nconst StyledTable = styled.table(props => getTableStyles(props.theme));\n\nStyledTable.defaultProps = defaultThemeProp;\n\nexport const TableBody: FC<any> = forwardRef(function TableBody(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(function Table(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(function TableRow(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(function TableCell(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,15 +0,0 @@
1
- import { MouseEvent, FocusEvent } from 'react';
2
- export interface RichTextEditorContextValue {
3
- addImage: (image: File) => void;
4
- setPopoverOpen: (open: boolean) => void;
5
- onEditorFocus: (args: {
6
- event?: MouseEvent | FocusEvent<any>;
7
- force?: boolean;
8
- runAfterFocus?: () => void;
9
- focusEditor?: boolean;
10
- }) => void;
11
- disabled: boolean;
12
- }
13
- export declare const RichTextEditorContext: import("react").Context<RichTextEditorContextValue>;
14
- export declare const useRTEContext: () => RichTextEditorContextValue;
15
- //# sourceMappingURL=RichTextEditor.context.d.ts.map
@@ -1 +0,0 @@
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,QAAQ,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,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"}
@@ -1,11 +0,0 @@
1
- import { createContext, useContext } from 'react';
2
- export const RichTextEditorContext = createContext({
3
- addImage: () => { },
4
- setPopoverOpen: () => { },
5
- onEditorFocus: () => { },
6
- disabled: false
7
- });
8
- export const useRTEContext = () => {
9
- return useContext(RichTextEditorContext);
10
- };
11
- //# sourceMappingURL=RichTextEditor.context.js.map
@@ -1 +0,0 @@
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,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;IAClB,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 addImage: (image: File) => 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 addImage: () => {},\n setPopoverOpen: () => {},\n onEditorFocus: () => {},\n disabled: false\n});\n\nexport const useRTEContext = () => {\n return useContext(RichTextEditorContext);\n};\n"]}
@@ -1,6 +0,0 @@
1
- import { FC } from 'react';
2
- import { ForwardProps } from '@pega/cosmos-react-core';
3
- import { RichTextEditorProps } from './RichTextEditor.types';
4
- declare const RichTextEditor: FC<RichTextEditorProps & ForwardProps>;
5
- export default RichTextEditor;
6
- //# sourceMappingURL=RichTextEditor.d.ts.map