@kaizen/components 0.0.0-canary-richtexttest-20231101014014 → 0.0.0-canary-js-tokens-20231102052541
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/LikertScaleLegacy/LikertScaleLegacy.cjs +146 -0
- package/dist/cjs/LikertScaleLegacy/LikertScaleLegacy.cjs.map +1 -0
- package/dist/cjs/LikertScaleLegacy/LikertScaleLegacy.module.scss.cjs +27 -0
- package/dist/cjs/LikertScaleLegacy/LikertScaleLegacy.module.scss.cjs.map +1 -0
- package/dist/cjs/LikertScaleLegacy/utils/determineSelectionFromKeyPress.cjs +50 -0
- package/dist/cjs/LikertScaleLegacy/utils/determineSelectionFromKeyPress.cjs.map +1 -0
- package/dist/cjs/ProgressBar/ProgressBar.cjs +59 -0
- package/dist/cjs/ProgressBar/ProgressBar.cjs.map +1 -0
- package/dist/cjs/ProgressBar/ProgressBar.module.scss.cjs +15 -0
- package/dist/cjs/ProgressBar/ProgressBar.module.scss.cjs.map +1 -0
- package/dist/cjs/ProgressBar/subcomponents/Label/Label.cjs +23 -0
- package/dist/cjs/ProgressBar/subcomponents/Label/Label.cjs.map +1 -0
- package/dist/cjs/ProgressBar/subcomponents/Label/Label.module.scss.cjs +7 -0
- package/dist/cjs/ProgressBar/subcomponents/Label/Label.module.scss.cjs.map +1 -0
- package/dist/cjs/ProgressBar/utils/calculatePercentage.cjs +9 -0
- package/dist/cjs/ProgressBar/utils/calculatePercentage.cjs.map +1 -0
- package/dist/cjs/dts/LikertScaleLegacy/LikertScaleLegacy.d.ts +20 -0
- package/dist/cjs/dts/LikertScaleLegacy/index.d.ts +1 -0
- package/dist/cjs/dts/LikertScaleLegacy/types.d.ts +6 -0
- package/dist/cjs/dts/LikertScaleLegacy/utils/determineSelectionFromKeyPress.d.ts +3 -0
- package/dist/cjs/dts/Notification/ToastNotification/ToastNotification.d.ts +14 -0
- package/dist/cjs/dts/Notification/ToastNotification/index.d.ts +3 -0
- package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationManager/ToastNotificationManager.d.ts +7 -0
- package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationManager/index.d.ts +1 -0
- package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationsList/ToastNotificationsList.d.ts +11 -0
- package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationsList/index.d.ts +1 -0
- package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/ToastNotificationsListContainer.d.ts +7 -0
- package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/index.d.ts +1 -0
- package/dist/cjs/dts/Notification/ToastNotification/types.d.ts +23 -0
- package/dist/cjs/dts/ProgressBar/ProgressBar.d.ts +24 -0
- package/dist/cjs/dts/ProgressBar/index.d.ts +1 -0
- package/dist/cjs/dts/ProgressBar/subcomponents/Label/Label.d.ts +10 -0
- package/dist/cjs/dts/ProgressBar/subcomponents/Label/index.d.ts +1 -0
- package/dist/cjs/dts/ProgressBar/utils/calculatePercentage.d.ts +4 -0
- package/dist/cjs/dts/index.d.ts +2 -1
- package/dist/cjs/index.cjs +4 -14
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/index.css +6 -9
- package/dist/esm/LikertScaleLegacy/LikertScaleLegacy.mjs +144 -0
- package/dist/esm/LikertScaleLegacy/LikertScaleLegacy.mjs.map +1 -0
- package/dist/esm/LikertScaleLegacy/LikertScaleLegacy.module.scss.mjs +25 -0
- package/dist/esm/LikertScaleLegacy/LikertScaleLegacy.module.scss.mjs.map +1 -0
- package/dist/esm/LikertScaleLegacy/utils/determineSelectionFromKeyPress.mjs +48 -0
- package/dist/esm/LikertScaleLegacy/utils/determineSelectionFromKeyPress.mjs.map +1 -0
- package/dist/esm/ProgressBar/ProgressBar.mjs +57 -0
- package/dist/esm/ProgressBar/ProgressBar.mjs.map +1 -0
- package/dist/esm/ProgressBar/ProgressBar.module.scss.mjs +13 -0
- package/dist/esm/ProgressBar/ProgressBar.module.scss.mjs.map +1 -0
- package/dist/esm/ProgressBar/subcomponents/Label/Label.mjs +21 -0
- package/dist/esm/ProgressBar/subcomponents/Label/Label.mjs.map +1 -0
- package/dist/esm/ProgressBar/subcomponents/Label/Label.module.scss.mjs +5 -0
- package/dist/esm/ProgressBar/subcomponents/Label/Label.module.scss.mjs.map +1 -0
- package/dist/esm/ProgressBar/utils/calculatePercentage.mjs +7 -0
- package/dist/esm/ProgressBar/utils/calculatePercentage.mjs.map +1 -0
- package/dist/esm/dts/LikertScaleLegacy/LikertScaleLegacy.d.ts +20 -0
- package/dist/esm/dts/LikertScaleLegacy/index.d.ts +1 -0
- package/dist/esm/dts/LikertScaleLegacy/types.d.ts +6 -0
- package/dist/esm/dts/LikertScaleLegacy/utils/determineSelectionFromKeyPress.d.ts +3 -0
- package/dist/esm/dts/Notification/ToastNotification/ToastNotification.d.ts +14 -0
- package/dist/esm/dts/Notification/ToastNotification/index.d.ts +3 -0
- package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationManager/ToastNotificationManager.d.ts +7 -0
- package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationManager/index.d.ts +1 -0
- package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationsList/ToastNotificationsList.d.ts +11 -0
- package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationsList/index.d.ts +1 -0
- package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/ToastNotificationsListContainer.d.ts +7 -0
- package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/index.d.ts +1 -0
- package/dist/esm/dts/Notification/ToastNotification/types.d.ts +23 -0
- package/dist/esm/dts/ProgressBar/ProgressBar.d.ts +24 -0
- package/dist/esm/dts/ProgressBar/index.d.ts +1 -0
- package/dist/esm/dts/ProgressBar/subcomponents/Label/Label.d.ts +10 -0
- package/dist/esm/dts/ProgressBar/subcomponents/Label/index.d.ts +1 -0
- package/dist/esm/dts/ProgressBar/utils/calculatePercentage.d.ts +4 -0
- package/dist/esm/dts/index.d.ts +2 -1
- package/dist/esm/index.css +7 -10
- package/dist/esm/index.mjs +2 -7
- package/dist/esm/index.mjs.map +1 -1
- package/dist/index.d.ts +52 -104
- package/dist/styles.css +1 -1
- package/package.json +1 -8
- package/dist/cjs/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.cjs +0 -47
- package/dist/cjs/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.module.scss.cjs +0 -8
- package/dist/cjs/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.module.scss.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextContent/RichTextContent.cjs +0 -33
- package/dist/cjs/RichTextEditor/src/RichTextContent/RichTextContent.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextContent/RichTextContent.module.scss.cjs +0 -7
- package/dist/cjs/RichTextEditor/src/RichTextContent/RichTextContent.module.scss.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/RichTextEditor.cjs +0 -143
- package/dist/cjs/RichTextEditor/src/RichTextEditor/RichTextEditor.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/RichTextEditor.module.scss.cjs +0 -32
- package/dist/cjs/RichTextEditor/src/RichTextEditor/RichTextEditor.module.scss.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/controlmap.cjs +0 -245
- package/dist/cjs/RichTextEditor/src/RichTextEditor/controlmap.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/inputrules.cjs +0 -21
- package/dist/cjs/RichTextEditor/src/RichTextEditor/inputrules.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/keymap.cjs +0 -80
- package/dist/cjs/RichTextEditor/src/RichTextEditor/keymap.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/schema.cjs +0 -59
- package/dist/cjs/RichTextEditor/src/RichTextEditor/schema.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.cjs +0 -43
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.module.scss.cjs +0 -14
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.module.scss.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.cjs +0 -71
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.module.scss.cjs +0 -7
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.module.scss.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.cjs +0 -16
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.module.scss.cjs +0 -7
- package/dist/cjs/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.module.scss.cjs.map +0 -1
- package/dist/cjs/RichTextEditor/src/constants.cjs +0 -5
- package/dist/cjs/RichTextEditor/src/constants.cjs.map +0 -1
- package/dist/cjs/dts/RichTextEditor/index.d.ts +0 -5
- package/dist/cjs/dts/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.d.ts +0 -15
- package/dist/cjs/dts/RichTextEditor/src/EditableRichTextContent/index.d.ts +0 -1
- package/dist/cjs/dts/RichTextEditor/src/RichTextContent/RichTextContent.d.ts +0 -10
- package/dist/cjs/dts/RichTextEditor/src/RichTextContent/index.d.ts +0 -1
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/RichTextEditor.d.ts +0 -43
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/controlmap.d.ts +0 -13
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/index.d.ts +0 -4
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/inputrules.d.ts +0 -2
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/keymap.d.ts +0 -6
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/schema.d.ts +0 -4
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.d.ts +0 -9
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/index.d.ts +0 -1
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.d.ts +0 -11
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/index.d.ts +0 -1
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.d.ts +0 -8
- package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/index.d.ts +0 -1
- package/dist/cjs/dts/RichTextEditor/src/constants.d.ts +0 -2
- package/dist/cjs/dts/RichTextEditor/src/types.d.ts +0 -12
- package/dist/esm/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.mjs +0 -45
- package/dist/esm/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.module.scss.mjs +0 -6
- package/dist/esm/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.module.scss.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextContent/RichTextContent.mjs +0 -31
- package/dist/esm/RichTextEditor/src/RichTextContent/RichTextContent.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextContent/RichTextContent.module.scss.mjs +0 -5
- package/dist/esm/RichTextEditor/src/RichTextContent/RichTextContent.module.scss.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/RichTextEditor.mjs +0 -141
- package/dist/esm/RichTextEditor/src/RichTextEditor/RichTextEditor.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/RichTextEditor.module.scss.mjs +0 -30
- package/dist/esm/RichTextEditor/src/RichTextEditor/RichTextEditor.module.scss.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/controlmap.mjs +0 -243
- package/dist/esm/RichTextEditor/src/RichTextEditor/controlmap.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/inputrules.mjs +0 -19
- package/dist/esm/RichTextEditor/src/RichTextEditor/inputrules.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/keymap.mjs +0 -78
- package/dist/esm/RichTextEditor/src/RichTextEditor/keymap.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/schema.mjs +0 -56
- package/dist/esm/RichTextEditor/src/RichTextEditor/schema.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.mjs +0 -41
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.module.scss.mjs +0 -12
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.module.scss.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.mjs +0 -69
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.module.scss.mjs +0 -5
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.module.scss.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.mjs +0 -14
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.module.scss.mjs +0 -5
- package/dist/esm/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.module.scss.mjs.map +0 -1
- package/dist/esm/RichTextEditor/src/constants.mjs +0 -3
- package/dist/esm/RichTextEditor/src/constants.mjs.map +0 -1
- package/dist/esm/dts/RichTextEditor/index.d.ts +0 -5
- package/dist/esm/dts/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.d.ts +0 -15
- package/dist/esm/dts/RichTextEditor/src/EditableRichTextContent/index.d.ts +0 -1
- package/dist/esm/dts/RichTextEditor/src/RichTextContent/RichTextContent.d.ts +0 -10
- package/dist/esm/dts/RichTextEditor/src/RichTextContent/index.d.ts +0 -1
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/RichTextEditor.d.ts +0 -43
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/controlmap.d.ts +0 -13
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/index.d.ts +0 -4
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/inputrules.d.ts +0 -2
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/keymap.d.ts +0 -6
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/schema.d.ts +0 -4
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/ToggleIconButton.d.ts +0 -9
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToggleIconButton/index.d.ts +0 -1
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/Toolbar.d.ts +0 -11
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/subcomponents/Toolbar/index.d.ts +0 -1
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/ToolbarSection.d.ts +0 -8
- package/dist/esm/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/index.d.ts +0 -1
- package/dist/esm/dts/RichTextEditor/src/constants.d.ts +0 -2
- package/dist/esm/dts/RichTextEditor/src/types.d.ts +0 -12
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { OverrideClassName } from "../../../../../types/OverrideClassName";
|
|
3
|
-
export interface ToolbarProps extends OverrideClassName<React.HTMLAttributes<HTMLElement>> {
|
|
4
|
-
children: React.ReactNode;
|
|
5
|
-
"aria-controls": string;
|
|
6
|
-
"aria-label": string;
|
|
7
|
-
}
|
|
8
|
-
export declare const Toolbar: {
|
|
9
|
-
(props: ToolbarProps): JSX.Element;
|
|
10
|
-
displayName: string;
|
|
11
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Toolbar";
|
package/dist/cjs/dts/RichTextEditor/src/RichTextEditor/subcomponents/ToolbarSection/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./ToolbarSection";
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
export type ToolbarControlTypes = "bold" | "italic" | "underline" | "orderedList" | "bulletList" | "link";
|
|
2
|
-
export interface ToolbarItems {
|
|
3
|
-
name: ToolbarControlTypes;
|
|
4
|
-
/**
|
|
5
|
-
* A group is used to wrap items in the same section wrapper
|
|
6
|
-
* ungrouped items will be appended to the end of the toolbar */
|
|
7
|
-
group?: string;
|
|
8
|
-
}
|
|
9
|
-
export type EditorContentArray = Array<{
|
|
10
|
-
[key: string]: any;
|
|
11
|
-
}>;
|
|
12
|
-
export type EditorRows = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20;
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { __rest, __assign } from 'tslib';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import classnames from 'classnames';
|
|
4
|
-
import { Label } from '../../../Label/Label.mjs';
|
|
5
|
-
import { VisuallyHidden } from '../../../VisuallyHidden/VisuallyHidden.mjs';
|
|
6
|
-
import { RichTextContent } from '../RichTextContent/RichTextContent.mjs';
|
|
7
|
-
import styles from './EditableRichTextContent.module.scss.mjs';
|
|
8
|
-
var handleEditableClick = function (e, onClick) {
|
|
9
|
-
if (e.target.hasAttribute("href")) {
|
|
10
|
-
return;
|
|
11
|
-
}
|
|
12
|
-
return onClick(e);
|
|
13
|
-
};
|
|
14
|
-
const EditableRichTextContent = /*#__PURE__*/function () {
|
|
15
|
-
const EditableRichTextContent = function (props) {
|
|
16
|
-
var onClick = props.onClick,
|
|
17
|
-
content = props.content,
|
|
18
|
-
classNameOverride = props.classNameOverride,
|
|
19
|
-
labelText = props.labelText,
|
|
20
|
-
_a = props.isLabelHidden,
|
|
21
|
-
isLabelHidden = _a === void 0 ? false : _a,
|
|
22
|
-
contentProps = props.contentProps,
|
|
23
|
-
restProps = __rest(props, ["onClick", "content", "classNameOverride", "labelText", "isLabelHidden", "contentProps"]);
|
|
24
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, !isLabelHidden && /*#__PURE__*/React.createElement(Label, {
|
|
25
|
-
labelText: labelText
|
|
26
|
-
}), /*#__PURE__*/React.createElement("div", __assign({
|
|
27
|
-
onClick: function (e) {
|
|
28
|
-
return handleEditableClick(e, onClick);
|
|
29
|
-
},
|
|
30
|
-
className: classnames(styles.editableContainer, classNameOverride)
|
|
31
|
-
}, restProps), /*#__PURE__*/React.createElement(VisuallyHidden, {
|
|
32
|
-
classNameOverride: styles.hiddenButton
|
|
33
|
-
}, /*#__PURE__*/React.createElement("button", {
|
|
34
|
-
type: "button",
|
|
35
|
-
onClick: onClick,
|
|
36
|
-
"aria-label": "Edit ".concat(labelText)
|
|
37
|
-
})), /*#__PURE__*/React.createElement(RichTextContent, __assign({
|
|
38
|
-
content: content
|
|
39
|
-
}, contentProps))));
|
|
40
|
-
};
|
|
41
|
-
EditableRichTextContent.displayName = "EditableRichTextContent";
|
|
42
|
-
return EditableRichTextContent;
|
|
43
|
-
}();
|
|
44
|
-
export { EditableRichTextContent };
|
|
45
|
-
//# sourceMappingURL=EditableRichTextContent.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"EditableRichTextContent.mjs","sources":["../../../../../src/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.tsx"],"sourcesContent":["import React, { MouseEvent, HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport { Label } from \"~components/Label\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { RichTextContent, RichTextContentProps } from \"../RichTextContent\"\nimport { EditorContentArray } from \"../types\"\nimport styles from \"./EditableRichTextContent.module.scss\"\n\nexport interface EditableRichTextContentProps\n extends OverrideClassName<\n Omit<HTMLAttributes<HTMLDivElement>, \"onClick\" | \"content\">\n > {\n onClick: (event: MouseEvent<HTMLElement>) => void\n content: EditorContentArray\n labelText: string\n isLabelHidden?: boolean\n contentProps?: Omit<RichTextContentProps, \"content\">\n}\n\nconst handleEditableClick = (\n e: MouseEvent<HTMLElement>,\n onClick: (event: MouseEvent<HTMLElement>) => void\n): void => {\n if ((e.target as HTMLElement).hasAttribute(\"href\")) {\n return\n }\n return onClick(e)\n}\n\nexport const EditableRichTextContent = (\n props: EditableRichTextContentProps\n): JSX.Element => {\n const {\n onClick,\n content,\n classNameOverride,\n labelText,\n isLabelHidden = false,\n contentProps,\n ...restProps\n } = props\n\n return (\n <>\n {!isLabelHidden && <Label labelText={labelText} />}\n {/* Disabling these a11y linting errors because there is a <button> that mitigates these concerns. The onClick here is just an additional layer. */}\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n <div\n onClick={(e): void => handleEditableClick(e, onClick)}\n className={classnames(styles.editableContainer, classNameOverride)}\n {...restProps}\n >\n <VisuallyHidden classNameOverride={styles.hiddenButton}>\n <button\n type=\"button\"\n onClick={onClick}\n aria-label={`Edit ${labelText}`}\n />\n </VisuallyHidden>\n <RichTextContent content={content} {...contentProps} />\n </div>\n </>\n )\n}\n\nEditableRichTextContent.displayName = \"EditableRichTextContent\"\n"],"names":["handleEditableClick","e","onClick","target","hasAttribute","EditableRichTextContent","props","content","classNameOverride","labelText","_a","isLabelHidden","contentProps","restProps","__rest","React","createElement","Fragment","Label","__assign","className","classnames","styles","editableContainer","VisuallyHidden","hiddenButton","type","concat","RichTextContent","displayName"],"mappings":";;;;;;;AAoBA,IAAMA,mBAAmB,GAAG,SAAAA,CAC1BC,CAA0B,EAC1BC,OAAiD,EAAA;EAEjD,IAAKD,CAAC,CAACE,MAAsB,CAACC,YAAY,CAAC,MAAM,CAAC,EAAE;IAClD;EACD;EACD,OAAOF,OAAO,CAACD,CAAC,CAAC;AACnB,CAAC;AAAA,MAEYI,uBAAuB;EAAA,MAAvBA,uBAAuB,GAAG,SAAAA,CACrCC,KAAmC,EAAA;IAGjC,IAAAJ,OAAO,GAOLI,KAAK,QAPA;MACPC,OAAO,GAMLD,KAAK,CAAAC,OANA;MACPC,iBAAiB,GAKfF,KAAK,CAAAE,iBALU;MACjBC,SAAS,GAIPH,KAAK,CAJEG,SAAA;MACTC,EAGE,GAAAJ,KAAK,cAHc;MAArBK,aAAa,mBAAG,KAAK,GAAAD,EAAA;MACrBE,YAAY,GAEVN,KAAK,CAAAM,YAFK;MACTC,SAAS,GAAAC,MAAA,CACVR,KAAK,EARH,CAAA,SAAA,EAAA,SAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,eAAA,EAAA,cAAA,CAQL,CADa;IAGd,oBACES,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EACG,CAACN,aAAa,iBAAII,KAAC,CAAAC,aAAA,CAAAE,KAAK;MAACT,SAAS,EAAEA;KAAa,CAAA,eAGlDM,KACE,CAAAC,aAAA,CAAA,KAAA,EAAAG,QAAA,CAAA;MAAAjB,OAAO,EAAE,SAAAA,CAACD,CAAC,EAAA;QAAW,OAAAD,mBAAmB,CAACC,CAAC,EAAEC,OAAO,CAAC;MAAA,CAAA;MACrDkB,SAAS,EAAEC,UAAU,CAACC,MAAM,CAACC,iBAAiB,EAAEf,iBAAiB;IAAC,CAAA,EAC9DK,SAAS,CAAA,eAEbE,KAAA,CAAAC,aAAA,CAACQ,cAAc,EAAC;MAAAhB,iBAAiB,EAAEc,MAAM,CAACG;IAAY,CAAA,eACpDV,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;MACEU,IAAI,EAAC,QAAQ;MACbxB,OAAO,EAAEA,OAAO;MAAA,YAAA,EACJ,OAAQ,CAAAyB,MAAA,CAAAlB,SAAS;IAAE,CAAA,CAC/B,CACa,eACjBM,KAAC,CAAAC,aAAA,CAAAY,eAAe,EAACT,QAAA,CAAA;MAAAZ,OAAO,EAAEA;KAAa,EAAAK,YAAY,CAAI,CAAA,CACnD,CACL;EAEP,CAAC;EAEDP,uBAAuB,CAACwB,WAAW,GAAG,yBAAyB;EAAA,OApClDxB,uBAAuB;AAAA;"}
|
package/dist/esm/RichTextEditor/src/EditableRichTextContent/EditableRichTextContent.module.scss.mjs
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
var styles = {
|
|
2
|
-
"editableContainer": "EditableRichTextContent-module_editableContainer__jULrV",
|
|
3
|
-
"hiddenButton": "EditableRichTextContent-module_hiddenButton__fE67E"
|
|
4
|
-
};
|
|
5
|
-
export { styles as default };
|
|
6
|
-
//# sourceMappingURL=EditableRichTextContent.module.scss.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"EditableRichTextContent.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import { __rest, __assign } from 'tslib';
|
|
2
|
-
import React, { useState } from 'react';
|
|
3
|
-
import { useRichTextEditor, ProseMirrorState, ProseMirrorModel } from '@cultureamp/rich-text-toolkit';
|
|
4
|
-
import classnames from 'classnames';
|
|
5
|
-
import { createSchemaWithAll } from '../RichTextEditor/schema.mjs';
|
|
6
|
-
import styles from './RichTextContent.module.scss.mjs';
|
|
7
|
-
const RichTextContent = /*#__PURE__*/function () {
|
|
8
|
-
const RichTextContent = function (props) {
|
|
9
|
-
var content = props.content,
|
|
10
|
-
classNameOverride = props.classNameOverride,
|
|
11
|
-
restProps = __rest(props, ["content", "classNameOverride"]);
|
|
12
|
-
var schema = useState(createSchemaWithAll())[0];
|
|
13
|
-
var editorRef = useRichTextEditor(ProseMirrorState.EditorState.create({
|
|
14
|
-
doc: ProseMirrorModel.Node.fromJSON(schema, {
|
|
15
|
-
type: "doc",
|
|
16
|
-
content: content
|
|
17
|
-
}),
|
|
18
|
-
schema: schema
|
|
19
|
-
}), undefined, {
|
|
20
|
-
editable: false
|
|
21
|
-
})[0];
|
|
22
|
-
return /*#__PURE__*/React.createElement("div", __assign({
|
|
23
|
-
ref: editorRef,
|
|
24
|
-
className: classnames(styles.content, classNameOverride)
|
|
25
|
-
}, restProps));
|
|
26
|
-
};
|
|
27
|
-
RichTextContent.displayName = "RichTextContent";
|
|
28
|
-
return RichTextContent;
|
|
29
|
-
}();
|
|
30
|
-
export { RichTextContent };
|
|
31
|
-
//# sourceMappingURL=RichTextContent.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RichTextContent.mjs","sources":["../../../../../src/RichTextEditor/src/RichTextContent/RichTextContent.tsx"],"sourcesContent":["import React, { useState, HTMLAttributes } from \"react\"\nimport {\n ProseMirrorState,\n ProseMirrorModel,\n useRichTextEditor,\n} from \"@cultureamp/rich-text-toolkit\"\nimport classnames from \"classnames\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { createSchemaWithAll } from \"../RichTextEditor/schema\"\nimport { EditorContentArray } from \"../types\"\nimport styles from \"./RichTextContent.module.scss\"\n\nexport interface RichTextContentProps\n extends OverrideClassName<Omit<HTMLAttributes<HTMLDivElement>, \"content\">> {\n content: EditorContentArray\n}\n\nexport const RichTextContent = (props: RichTextContentProps): JSX.Element => {\n const { content, classNameOverride, ...restProps } = props\n const [schema] = useState<ProseMirrorModel.Schema>(createSchemaWithAll())\n\n const [editorRef] = useRichTextEditor(\n ProseMirrorState.EditorState.create({\n doc: ProseMirrorModel.Node.fromJSON(schema, {\n type: \"doc\",\n content,\n }),\n schema,\n }),\n undefined,\n {\n editable: false,\n }\n )\n\n return (\n <div\n ref={editorRef}\n className={classnames(styles.content, classNameOverride)}\n {...restProps}\n />\n )\n}\n\nRichTextContent.displayName = \"RichTextContent\"\n"],"names":["RichTextContent","props","content","classNameOverride","restProps","__rest","schema","useState","createSchemaWithAll","editorRef","useRichTextEditor","ProseMirrorState","EditorState","create","doc","ProseMirrorModel","Node","fromJSON","type","undefined","editable","React","ref","className","classnames","styles","displayName"],"mappings":";;;;;;MAiBaA,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,KAA2B,EAAA;IACjD,IAAAC,OAAO,GAAsCD,KAAK,CAA3CC,OAAA;MAAEC,iBAAiB,GAAmBF,KAAK,CAAxBE,iBAAA;MAAKC,SAAS,GAAKC,MAAA,CAAAJ,KAAK,EAApD,CAAA,SAAA,EAAA,mBAAA,CAA4C,CAAF;IACzC,IAAAK,MAAM,GAAIC,QAAQ,CAA0BC,mBAAmB,CAAA,CAAE,CAAC,GAA5D;IAEN,IAAAC,SAAS,GAAIC,iBAAiB,CACnCC,gBAAgB,CAACC,WAAW,CAACC,MAAM,CAAC;MAClCC,GAAG,EAAEC,gBAAgB,CAACC,IAAI,CAACC,QAAQ,CAACX,MAAM,EAAE;QAC1CY,IAAI,EAAE,KAAK;QACXhB,OAAO,EAAAA;OACR,CAAC;MACFI,MAAM,EAAAA;IACP,CAAA,CAAC,EACFa,SAAS,EACT;MACEC,QAAQ,EAAE;IACX,CAAA,CACF,GAZe;IAchB,oBACEC;MACEC,GAAG,EAAEb,SAAS;MACdc,SAAS,EAAEC,UAAU,CAACC,MAAM,CAACvB,OAAO,EAAEC,iBAAiB;OACnDC,SAAS,CAAA,CACb;EAEN,CAAC;EAEDJ,eAAe,CAAC0B,WAAW,GAAG,iBAAiB;EAAA,OA3BlC1B,eAAe;AAAA;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RichTextContent.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
|
|
@@ -1,141 +0,0 @@
|
|
|
1
|
-
import { __rest, __assign, __spreadArray } from 'tslib';
|
|
2
|
-
import React, { useState, useEffect } from 'react';
|
|
3
|
-
import { useRichTextEditor, ProseMirrorState, ProseMirrorModel, ProseMirrorHistory, ProseMirrorKeymap, ProseMirrorCommands, createLinkManager } from '@cultureamp/rich-text-toolkit';
|
|
4
|
-
import classnames from 'classnames';
|
|
5
|
-
import { v4 } from 'uuid';
|
|
6
|
-
import { FieldMessage } from '../../../FieldMessage/FieldMessage.mjs';
|
|
7
|
-
import { Label } from '../../../Label/Label.mjs';
|
|
8
|
-
import { InlineNotification } from '../../../Notification/InlineNotification/InlineNotification.mjs';
|
|
9
|
-
import '../../../Notification/GlobalNotification/GlobalNotification.mjs';
|
|
10
|
-
import { buildControlMap } from './controlmap.mjs';
|
|
11
|
-
import { buildInputRules } from './inputrules.mjs';
|
|
12
|
-
import { buildKeymap } from './keymap.mjs';
|
|
13
|
-
import { createSchemaFromControls } from './schema.mjs';
|
|
14
|
-
import { ToggleIconButton } from './subcomponents/ToggleIconButton/ToggleIconButton.mjs';
|
|
15
|
-
import { Toolbar } from './subcomponents/Toolbar/Toolbar.mjs';
|
|
16
|
-
import { ToolbarSection } from './subcomponents/ToolbarSection/ToolbarSection.mjs';
|
|
17
|
-
import styles from './RichTextEditor.module.scss.mjs';
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* {@link https://cultureamp.design/components/rich-text-editor/ Guidance} |
|
|
21
|
-
* {@link https://cultureamp.design/storybook/?path=/docs/components-rich-text-editor--default Storybook}
|
|
22
|
-
*/
|
|
23
|
-
const RichTextEditor = /*#__PURE__*/function () {
|
|
24
|
-
const RichTextEditor = function (props) {
|
|
25
|
-
var onChange = props.onChange,
|
|
26
|
-
defaultValue = props.defaultValue,
|
|
27
|
-
labelText = props.labelText,
|
|
28
|
-
labelledBy = props["aria-labelledby"],
|
|
29
|
-
classNameOverride = props.classNameOverride,
|
|
30
|
-
controls = props.controls,
|
|
31
|
-
_a = props.rows,
|
|
32
|
-
rows = _a === void 0 ? 3 : _a,
|
|
33
|
-
_b = props.dataError,
|
|
34
|
-
dataError = _b === void 0 ? "Something went wrong" : _b,
|
|
35
|
-
onDataError = props.onDataError,
|
|
36
|
-
validationMessage = props.validationMessage,
|
|
37
|
-
description = props.description,
|
|
38
|
-
_c = props.status,
|
|
39
|
-
status = _c === void 0 ? "default" : _c,
|
|
40
|
-
restProps = __rest(props, ["onChange", "defaultValue", "labelText", "aria-labelledby", "classNameOverride", "controls", "rows", "dataError", "onDataError", "validationMessage", "description", "status"]);
|
|
41
|
-
var schema = useState(createSchemaFromControls(controls))[0];
|
|
42
|
-
var labelId = useState(labelledBy || v4())[0];
|
|
43
|
-
var editorId = useState(v4())[0];
|
|
44
|
-
var useRichTextEditorResult = function () {
|
|
45
|
-
try {
|
|
46
|
-
return useRichTextEditor(ProseMirrorState.EditorState.create({
|
|
47
|
-
doc: ProseMirrorModel.Node.fromJSON(schema, {
|
|
48
|
-
type: "doc",
|
|
49
|
-
// we're converting empty arrays to the ProseMirror default "empty" state because when
|
|
50
|
-
// given an empty array ProseMirror returns undefined, breaking the type
|
|
51
|
-
content: (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.length) > 0 ? defaultValue : [{
|
|
52
|
-
type: "paragraph"
|
|
53
|
-
}]
|
|
54
|
-
}),
|
|
55
|
-
schema: schema,
|
|
56
|
-
plugins: getPlugins(controls, schema)
|
|
57
|
-
}), {
|
|
58
|
-
"aria-labelledby": labelId,
|
|
59
|
-
role: "textbox"
|
|
60
|
-
});
|
|
61
|
-
} catch (_a) {
|
|
62
|
-
return new Error("Bad data error");
|
|
63
|
-
}
|
|
64
|
-
}();
|
|
65
|
-
if (useRichTextEditorResult instanceof Error) {
|
|
66
|
-
onDataError && onDataError();
|
|
67
|
-
return /*#__PURE__*/React.createElement(InlineNotification, {
|
|
68
|
-
headingProps: {
|
|
69
|
-
children: "Error",
|
|
70
|
-
variant: "heading-3"
|
|
71
|
-
},
|
|
72
|
-
type: "negative",
|
|
73
|
-
persistent: true
|
|
74
|
-
}, dataError);
|
|
75
|
-
}
|
|
76
|
-
var editorRef = useRichTextEditorResult[0],
|
|
77
|
-
editorState = useRichTextEditorResult[1],
|
|
78
|
-
dispatchTransaction = useRichTextEditorResult[2];
|
|
79
|
-
var controlMap = buildControlMap(schema, editorState, controls);
|
|
80
|
-
useEffect(function () {
|
|
81
|
-
onChange(editorState);
|
|
82
|
-
// Including `onContentChange` in the dependencies here will cause a 'Maximum update depth exceeded' issue
|
|
83
|
-
}, [editorState]);
|
|
84
|
-
var validationMessageAria = validationMessage ? "".concat(editorId, "-rte-validation-message") : "";
|
|
85
|
-
var descriptionAria = description ? "".concat(editorId, "-rte-description") : "";
|
|
86
|
-
var ariaDescribedBy = "".concat(validationMessageAria, " ").concat(descriptionAria);
|
|
87
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, !labelledBy && labelText && /*#__PURE__*/React.createElement(Label, {
|
|
88
|
-
id: labelId,
|
|
89
|
-
labelText: labelText
|
|
90
|
-
}), /*#__PURE__*/React.createElement("div", {
|
|
91
|
-
className: classnames(styles.editorWrapper, styles[status])
|
|
92
|
-
}, controls && /*#__PURE__*/React.createElement(Toolbar, {
|
|
93
|
-
"aria-controls": editorId,
|
|
94
|
-
"aria-label": "Text formatting",
|
|
95
|
-
classNameOverride: styles.toolbar
|
|
96
|
-
}, controlMap.map(function (section, index) {
|
|
97
|
-
return /*#__PURE__*/React.createElement(ToolbarSection, {
|
|
98
|
-
key: index
|
|
99
|
-
}, section.map(function (controlConfig, controlKeyIndex) {
|
|
100
|
-
return /*#__PURE__*/React.createElement(ToggleIconButton, {
|
|
101
|
-
key: controlKeyIndex,
|
|
102
|
-
icon: controlConfig.icon,
|
|
103
|
-
disabled: controlConfig.disabled,
|
|
104
|
-
label: controlConfig.label,
|
|
105
|
-
isActive: controlConfig.isActive,
|
|
106
|
-
onClick: function () {
|
|
107
|
-
return dispatchTransaction(controlConfig.action);
|
|
108
|
-
}
|
|
109
|
-
});
|
|
110
|
-
}));
|
|
111
|
-
})), /*#__PURE__*/React.createElement("div", __assign({
|
|
112
|
-
id: editorId,
|
|
113
|
-
ref: editorRef,
|
|
114
|
-
className: classnames(styles.editor, styles["rows".concat(rows)], classNameOverride, controls != null && controls.length > 0 && styles.hasToolbar),
|
|
115
|
-
"aria-describedby": ariaDescribedBy
|
|
116
|
-
}, restProps))), validationMessage && /*#__PURE__*/React.createElement(FieldMessage, {
|
|
117
|
-
id: validationMessageAria,
|
|
118
|
-
message: validationMessage,
|
|
119
|
-
status: status
|
|
120
|
-
}), description && /*#__PURE__*/React.createElement(FieldMessage, {
|
|
121
|
-
id: descriptionAria,
|
|
122
|
-
message: description
|
|
123
|
-
}));
|
|
124
|
-
};
|
|
125
|
-
RichTextEditor.displayName = "RichTextEditor";
|
|
126
|
-
return RichTextEditor;
|
|
127
|
-
}();
|
|
128
|
-
function getPlugins(controls, schema) {
|
|
129
|
-
var allControlNames = controls ? controls.reduce(function (acc, c) {
|
|
130
|
-
return __spreadArray(__spreadArray([], acc, true), [c.name], false);
|
|
131
|
-
}, []) : [];
|
|
132
|
-
var plugins = [ProseMirrorHistory.history(), ProseMirrorKeymap.keymap(buildKeymap(schema)), ProseMirrorKeymap.keymap(ProseMirrorCommands.baseKeymap), buildInputRules(schema)];
|
|
133
|
-
if (allControlNames.includes("link")) {
|
|
134
|
-
plugins.push(createLinkManager({
|
|
135
|
-
markType: schema.marks.link
|
|
136
|
-
}));
|
|
137
|
-
}
|
|
138
|
-
return plugins;
|
|
139
|
-
}
|
|
140
|
-
export { RichTextEditor };
|
|
141
|
-
//# sourceMappingURL=RichTextEditor.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RichTextEditor.mjs","sources":["../../../../../src/RichTextEditor/src/RichTextEditor/RichTextEditor.tsx"],"sourcesContent":["import React, { useState, useEffect, HTMLAttributes, ReactNode } from \"react\"\nimport {\n ProseMirrorCommands,\n ProseMirrorState,\n ProseMirrorModel,\n ProseMirrorKeymap,\n ProseMirrorHistory,\n useRichTextEditor,\n createLinkManager,\n} from \"@cultureamp/rich-text-toolkit\"\nimport classnames from \"classnames\"\nimport { v4 } from \"uuid\"\nimport { FieldMessage } from \"~components/FieldMessage\"\nimport { Label } from \"~components/Label\"\nimport { InlineNotification } from \"~components/Notification\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { ToolbarItems, EditorContentArray, EditorRows } from \"../types\"\nimport { buildControlMap } from \"./controlmap\"\nimport { buildInputRules } from \"./inputrules\"\nimport { buildKeymap } from \"./keymap\"\nimport { createSchemaFromControls } from \"./schema\"\nimport { ToggleIconButton } from \"./subcomponents/ToggleIconButton\"\nimport { Toolbar } from \"./subcomponents/Toolbar\"\nimport { ToolbarSection } from \"./subcomponents/ToolbarSection\"\n\nimport styles from \"./RichTextEditor.module.scss\"\n\nexport interface BaseRichTextEditorProps\n extends OverrideClassName<\n Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\">\n > {\n onChange: (content: ProseMirrorState.EditorState) => void\n defaultValue: EditorContentArray\n controls?: ToolbarItems[]\n /**\n * Sets a default min-height for the editable area in units of body paragraph line height, similar to the 'rows' attribute on <textarea>.\n * The editable area will autogrow, so this only affects the component when the content doesn't exceed this height.\n */\n rows?: EditorRows\n dataError?: React.ReactElement\n onDataError?: () => void\n status?: \"default\" | \"error\" | \"caution\"\n /**\n * A descriptive message for `error` or `caution` states\n */\n validationMessage?: React.ReactNode\n /**\n * A description that provides context\n */\n description?: React.ReactNode\n}\n\ninterface RTEWithLabelText extends BaseRichTextEditorProps {\n labelText: ReactNode\n \"aria-labelledby\"?: never\n}\n\ninterface RTEWithLabelledBy extends BaseRichTextEditorProps {\n labelText?: never\n \"aria-labelledby\": string\n}\n\nexport type RichTextEditorProps = RTEWithLabelText | RTEWithLabelledBy\n/**\n * {@link https://cultureamp.design/components/rich-text-editor/ Guidance} |\n * {@link https://cultureamp.design/storybook/?path=/docs/components-rich-text-editor--default Storybook}\n */\nexport const RichTextEditor = (props: RichTextEditorProps): JSX.Element => {\n const {\n onChange,\n defaultValue,\n labelText,\n \"aria-labelledby\": labelledBy,\n classNameOverride,\n controls,\n rows = 3,\n dataError = \"Something went wrong\",\n onDataError,\n validationMessage,\n description,\n status = \"default\",\n ...restProps\n } = props\n const [schema] = useState<ProseMirrorModel.Schema>(\n createSchemaFromControls(controls)\n )\n const [labelId] = useState<string>(labelledBy || v4())\n const [editorId] = useState<string>(v4())\n\n const useRichTextEditorResult = (():\n | ReturnType<typeof useRichTextEditor>\n | Error => {\n try {\n return useRichTextEditor(\n ProseMirrorState.EditorState.create({\n doc: ProseMirrorModel.Node.fromJSON(schema, {\n type: \"doc\",\n // we're converting empty arrays to the ProseMirror default \"empty\" state because when\n // given an empty array ProseMirror returns undefined, breaking the type\n content:\n defaultValue?.length > 0 ? defaultValue : [{ type: \"paragraph\" }],\n }),\n schema,\n plugins: getPlugins(controls, schema),\n }),\n { \"aria-labelledby\": labelId, role: \"textbox\" }\n )\n } catch {\n return new Error(\"Bad data error\")\n }\n })()\n\n if (useRichTextEditorResult instanceof Error) {\n onDataError && onDataError()\n return (\n <InlineNotification\n headingProps={{\n children: \"Error\",\n variant: \"heading-3\",\n }}\n type=\"negative\"\n persistent\n >\n {dataError}\n </InlineNotification>\n )\n }\n\n const [editorRef, editorState, dispatchTransaction] = useRichTextEditorResult\n\n const controlMap = buildControlMap(schema, editorState, controls)\n\n useEffect(() => {\n onChange(editorState)\n // Including `onContentChange` in the dependencies here will cause a 'Maximum update depth exceeded' issue\n }, [editorState])\n\n const validationMessageAria = validationMessage\n ? `${editorId}-rte-validation-message`\n : \"\"\n const descriptionAria = description ? `${editorId}-rte-description` : \"\"\n\n const ariaDescribedBy = `${validationMessageAria} ${descriptionAria}`\n\n return (\n <>\n {!labelledBy && labelText && <Label id={labelId} labelText={labelText} />}\n {/* TODO: add a bit of margin here once we have a classNameOverride on Label */}\n <div className={classnames(styles.editorWrapper, styles[status])}>\n {controls && (\n <Toolbar\n aria-controls={editorId}\n aria-label=\"Text formatting\"\n classNameOverride={styles.toolbar}\n >\n {controlMap.map((section, index) => (\n <ToolbarSection key={index}>\n {section.map((controlConfig, controlKeyIndex) => (\n <ToggleIconButton\n key={controlKeyIndex}\n icon={controlConfig.icon}\n disabled={controlConfig.disabled}\n label={controlConfig.label}\n isActive={controlConfig.isActive}\n onClick={(): void =>\n dispatchTransaction(controlConfig.action)\n }\n />\n ))}\n </ToolbarSection>\n ))}\n </Toolbar>\n )}\n <div\n id={editorId}\n ref={editorRef}\n className={classnames(\n styles.editor,\n styles[`rows${rows}`],\n classNameOverride,\n controls != null && controls.length > 0 && styles.hasToolbar\n )}\n aria-describedby={ariaDescribedBy}\n {...restProps}\n />\n </div>\n\n {validationMessage && (\n <FieldMessage\n id={validationMessageAria}\n message={validationMessage}\n status={status}\n />\n )}\n\n {description && (\n <FieldMessage id={descriptionAria} message={description} />\n )}\n </>\n )\n}\n\nfunction getPlugins(\n controls: ToolbarItems[] | undefined,\n schema: ProseMirrorModel.Schema\n): Array<\n | ProseMirrorState.Plugin<unknown>\n | ProseMirrorState.Plugin<{\n transform: ProseMirrorState.Transaction\n from: number\n to: number\n text: string\n } | null>\n> {\n const allControlNames: string[] = controls\n ? controls.reduce((acc: string[], c: ToolbarItems) => [...acc, c.name], [])\n : []\n const plugins = [\n ProseMirrorHistory.history(),\n ProseMirrorKeymap.keymap(buildKeymap(schema)),\n ProseMirrorKeymap.keymap(ProseMirrorCommands.baseKeymap),\n buildInputRules(schema),\n ]\n\n if (allControlNames.includes(\"link\")) {\n plugins.push(\n createLinkManager({\n markType: schema.marks.link,\n })\n )\n }\n\n return plugins\n}\n\nRichTextEditor.displayName = \"RichTextEditor\"\n"],"names":["RichTextEditor","props","onChange","defaultValue","labelText","labelledBy","classNameOverride","controls","_a","rows","_b","dataError","onDataError","validationMessage","description","_c","status","restProps","__rest","schema","useState","createSchemaFromControls","labelId","v4","editorId","useRichTextEditorResult","useRichTextEditor","ProseMirrorState","EditorState","create","doc","ProseMirrorModel","Node","fromJSON","type","content","length","plugins","getPlugins","role","Error","React","createElement","InlineNotification","headingProps","children","variant","persistent","editorRef","editorState","dispatchTransaction","controlMap","buildControlMap","useEffect","validationMessageAria","concat","descriptionAria","ariaDescribedBy","Fragment","Label","id","className","classnames","styles","editorWrapper","Toolbar","toolbar","map","section","index","ToolbarSection","key","controlConfig","controlKeyIndex","ToggleIconButton","icon","disabled","label","isActive","onClick","action","__assign","ref","editor","hasToolbar","FieldMessage","message","displayName","allControlNames","reduce","acc","c","name","ProseMirrorHistory","history","ProseMirrorKeymap","keymap","buildKeymap","ProseMirrorCommands","baseKeymap","buildInputRules","includes","push","createLinkManager","markType","marks","link"],"mappings":"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"}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
var styles = {
|
|
2
|
-
"editor": "RichTextEditor-module_editor__okUfp",
|
|
3
|
-
"hasToolbar": "RichTextEditor-module_hasToolbar__4Owhv",
|
|
4
|
-
"editorWrapper": "RichTextEditor-module_editorWrapper__A5BhN",
|
|
5
|
-
"toolbar": "RichTextEditor-module_toolbar__3Plfs",
|
|
6
|
-
"error": "RichTextEditor-module_error__UMpSL",
|
|
7
|
-
"caution": "RichTextEditor-module_caution__6fXtL",
|
|
8
|
-
"rows1": "RichTextEditor-module_rows1__Gob2B",
|
|
9
|
-
"rows2": "RichTextEditor-module_rows2__C6VJ8",
|
|
10
|
-
"rows3": "RichTextEditor-module_rows3__qIAfH",
|
|
11
|
-
"rows4": "RichTextEditor-module_rows4__1WilX",
|
|
12
|
-
"rows5": "RichTextEditor-module_rows5__rAh8L",
|
|
13
|
-
"rows6": "RichTextEditor-module_rows6__5qPRA",
|
|
14
|
-
"rows7": "RichTextEditor-module_rows7__UoWsH",
|
|
15
|
-
"rows8": "RichTextEditor-module_rows8__L0uxX",
|
|
16
|
-
"rows9": "RichTextEditor-module_rows9__LnHZ7",
|
|
17
|
-
"rows10": "RichTextEditor-module_rows10__RGNTL",
|
|
18
|
-
"rows11": "RichTextEditor-module_rows11__-WhWa",
|
|
19
|
-
"rows12": "RichTextEditor-module_rows12__IltPs",
|
|
20
|
-
"rows13": "RichTextEditor-module_rows13__0-KRw",
|
|
21
|
-
"rows14": "RichTextEditor-module_rows14__ghHj1",
|
|
22
|
-
"rows15": "RichTextEditor-module_rows15__1JkHj",
|
|
23
|
-
"rows16": "RichTextEditor-module_rows16__np59M",
|
|
24
|
-
"rows17": "RichTextEditor-module_rows17__7W-kF",
|
|
25
|
-
"rows18": "RichTextEditor-module_rows18__q4c7D",
|
|
26
|
-
"rows19": "RichTextEditor-module_rows19__3DP0y",
|
|
27
|
-
"rows20": "RichTextEditor-module_rows20__dxZNO"
|
|
28
|
-
};
|
|
29
|
-
export { styles as default };
|
|
30
|
-
//# sourceMappingURL=RichTextEditor.module.scss.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"RichTextEditor.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,243 +0,0 @@
|
|
|
1
|
-
import { __assign } from 'tslib';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import { markIsActive, listIsActive, ProseMirrorCommands, ProseMirrorSchemaList } from '@cultureamp/rich-text-toolkit';
|
|
4
|
-
import 'uuid';
|
|
5
|
-
import '../../../Icon/subcomponents/SVG/SVG.mjs';
|
|
6
|
-
import { AddLinkIcon } from '../../../Icon/AddLinkIcon.mjs';
|
|
7
|
-
import { BoldIcon } from '../../../Icon/BoldIcon.mjs';
|
|
8
|
-
import { BullettedListIcon } from '../../../Icon/BullettedListIcon.mjs';
|
|
9
|
-
import { DecreaseIndentIcon } from '../../../Icon/DecreaseIndentIcon.mjs';
|
|
10
|
-
import { IncreaseIndentIcon } from '../../../Icon/IncreaseIndentIcon.mjs';
|
|
11
|
-
import { ItalicsIcon } from '../../../Icon/ItalicsIcon.mjs';
|
|
12
|
-
import { NumberedListIcon } from '../../../Icon/NumberedListIcon.mjs';
|
|
13
|
-
import { UnderlineIcon } from '../../../Icon/UnderlineIcon.mjs';
|
|
14
|
-
|
|
15
|
-
/** Chains multiple commands to dispatch each transitions in sequential order */
|
|
16
|
-
function chainTransactions() {
|
|
17
|
-
var commands = [];
|
|
18
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
19
|
-
commands[_i] = arguments[_i];
|
|
20
|
-
}
|
|
21
|
-
return function (state, dispatch) {
|
|
22
|
-
var updateStateAndDispatch = function (tr) {
|
|
23
|
-
state = state.apply(tr);
|
|
24
|
-
dispatch && dispatch(tr);
|
|
25
|
-
};
|
|
26
|
-
var lastCommand = commands.pop();
|
|
27
|
-
for (var _i = 0, commands_1 = commands; _i < commands_1.length; _i++) {
|
|
28
|
-
var command = commands_1[_i];
|
|
29
|
-
command(state, updateStateAndDispatch);
|
|
30
|
-
}
|
|
31
|
-
return lastCommand !== undefined && lastCommand(state, dispatch);
|
|
32
|
-
};
|
|
33
|
-
}
|
|
34
|
-
/** Dispatches a transaction to create initial p tag required for pm commands */
|
|
35
|
-
function createInitialParagraph(state, dispatch) {
|
|
36
|
-
if (dispatch) {
|
|
37
|
-
var tr = state.tr,
|
|
38
|
-
schema = state.schema;
|
|
39
|
-
dispatch(tr.replaceSelectionWith(schema.nodes.paragraph.create()));
|
|
40
|
-
return true;
|
|
41
|
-
}
|
|
42
|
-
return false;
|
|
43
|
-
}
|
|
44
|
-
/** Create command for toggling Marks */
|
|
45
|
-
function createToggleMarkCommand(mark) {
|
|
46
|
-
return function (state, dispatch) {
|
|
47
|
-
var docIsEmpty = state.doc.content.size === 0;
|
|
48
|
-
if (docIsEmpty) {
|
|
49
|
-
return chainTransactions(createInitialParagraph, ProseMirrorCommands.toggleMark(mark))(state, dispatch);
|
|
50
|
-
}
|
|
51
|
-
return ProseMirrorCommands.toggleMark(mark)(state, dispatch);
|
|
52
|
-
};
|
|
53
|
-
}
|
|
54
|
-
/** Create command for toggling Lists */
|
|
55
|
-
function createToggleListCommand(node) {
|
|
56
|
-
return function (state, dispatch) {
|
|
57
|
-
var docIsEmpty = state.doc.content.size === 0;
|
|
58
|
-
if (docIsEmpty) {
|
|
59
|
-
return chainTransactions(createInitialParagraph, ProseMirrorSchemaList.wrapInList(node))(state, dispatch);
|
|
60
|
-
}
|
|
61
|
-
return ProseMirrorSchemaList.wrapInList(node)(state, dispatch);
|
|
62
|
-
};
|
|
63
|
-
}
|
|
64
|
-
/** Create command for reducing indents in a List */
|
|
65
|
-
function createLiftListCommand() {
|
|
66
|
-
return function (state, dispatch) {
|
|
67
|
-
var _a;
|
|
68
|
-
var $from = state.selection.$from;
|
|
69
|
-
// calculate the parent node from the current tag selected
|
|
70
|
-
var listItemNode = (_a = $from.node($from.depth - 1)) === null || _a === void 0 ? void 0 : _a.type;
|
|
71
|
-
return ProseMirrorSchemaList.liftListItem(listItemNode)(state, dispatch);
|
|
72
|
-
};
|
|
73
|
-
}
|
|
74
|
-
/** Create command for indenting in a List */
|
|
75
|
-
function createIndentListCommand() {
|
|
76
|
-
return function (state, dispatch) {
|
|
77
|
-
var _a;
|
|
78
|
-
var $from = state.selection.$from;
|
|
79
|
-
var listItemNode = (_a = $from.node($from.depth - 1)) === null || _a === void 0 ? void 0 : _a.type;
|
|
80
|
-
return ProseMirrorSchemaList.sinkListItem(listItemNode)(state, dispatch);
|
|
81
|
-
};
|
|
82
|
-
}
|
|
83
|
-
/** handler lift list disabled state */
|
|
84
|
-
function liftListIsDisabled(state) {
|
|
85
|
-
var _a;
|
|
86
|
-
var $from = state.selection.$from;
|
|
87
|
-
var listItemNode = (_a = $from.node($from.depth - 1)) === null || _a === void 0 ? void 0 : _a.type;
|
|
88
|
-
var isValidListItem = (listItemNode === null || listItemNode === void 0 ? void 0 : listItemNode.name) === "listItem" || false;
|
|
89
|
-
return !isValidListItem;
|
|
90
|
-
}
|
|
91
|
-
/** handler indent list disabled state */
|
|
92
|
-
function indentListIsDisabled(state) {
|
|
93
|
-
var _a;
|
|
94
|
-
var _b = state.selection,
|
|
95
|
-
$from = _b.$from,
|
|
96
|
-
$to = _b.$to;
|
|
97
|
-
var listItemNode = (_a = $from.node($from.depth - 1)) === null || _a === void 0 ? void 0 : _a.type;
|
|
98
|
-
var isValidListItem = (listItemNode === null || listItemNode === void 0 ? void 0 : listItemNode.name) === "listItem" || false;
|
|
99
|
-
if (!isValidListItem) {
|
|
100
|
-
return true;
|
|
101
|
-
}
|
|
102
|
-
var range = $from.blockRange($to, function (node) {
|
|
103
|
-
return node.childCount > 0 && node.firstChild.type === listItemNode;
|
|
104
|
-
});
|
|
105
|
-
return !range || range.startIndex === 0 ? true : false;
|
|
106
|
-
}
|
|
107
|
-
/** Creates an object used as an index to map the controls to respective groups */
|
|
108
|
-
var createControlGroupIndex = function (controls) {
|
|
109
|
-
return controls.reduce(function (groups, currentControl) {
|
|
110
|
-
var _a;
|
|
111
|
-
if (!(currentControl === null || currentControl === void 0 ? void 0 : currentControl.name)) return groups;
|
|
112
|
-
return __assign(__assign({}, groups), (_a = {}, _a[currentControl.name] = currentControl.group || "ungrouped", _a));
|
|
113
|
-
}, {});
|
|
114
|
-
};
|
|
115
|
-
/** Creates an initial object used to map button configuration into its respective groups */
|
|
116
|
-
var createInitialControls = function (controlGroupIndex) {
|
|
117
|
-
var uniqueGroups = Array.from(new Set(Object.values(controlGroupIndex)));
|
|
118
|
-
var initialControlObject = uniqueGroups.reduce(function (controlObject, controlKey) {
|
|
119
|
-
var _a;
|
|
120
|
-
if (controlKey === "ungrouped") return controlObject;
|
|
121
|
-
return __assign(__assign({}, controlObject), (_a = {}, _a[controlKey] = [], _a));
|
|
122
|
-
}, {});
|
|
123
|
-
// This ensure that ungrouped controls are always last
|
|
124
|
-
initialControlObject["ungrouped"] = [];
|
|
125
|
-
return initialControlObject;
|
|
126
|
-
};
|
|
127
|
-
/** Retrieves the name of the group a control belongs to */
|
|
128
|
-
var getGroupIndex = function (controlGroupIndex, controlType) {
|
|
129
|
-
var _a;
|
|
130
|
-
if (controlType) {
|
|
131
|
-
return (_a = controlGroupIndex[controlType]) !== null && _a !== void 0 ? _a : "ungrouped";
|
|
132
|
-
}
|
|
133
|
-
return "ungrouped";
|
|
134
|
-
};
|
|
135
|
-
/** Filters out empty control groups and returns a multi dimensional array */
|
|
136
|
-
var filterToolbarControls = function (groupedControls) {
|
|
137
|
-
return Object.values(groupedControls).filter(function (controls) {
|
|
138
|
-
return controls.length > 0;
|
|
139
|
-
});
|
|
140
|
-
};
|
|
141
|
-
/** Builds an array of object used to map control configuration to rte toolbar buttons */
|
|
142
|
-
function buildControlMap(schema, editorState, controls) {
|
|
143
|
-
if (!controls) return [];
|
|
144
|
-
var controlGroupIndex = createControlGroupIndex(controls);
|
|
145
|
-
var toolbarControls = createInitialControls(controlGroupIndex);
|
|
146
|
-
var listNodes = [schema.nodes.bulletList, schema.nodes.orderedList];
|
|
147
|
-
if (schema.marks.strong) {
|
|
148
|
-
var type = schema.marks.strong;
|
|
149
|
-
var groupIndex = getGroupIndex(controlGroupIndex, "bold");
|
|
150
|
-
toolbarControls[groupIndex].push({
|
|
151
|
-
isActive: markIsActive(editorState, type),
|
|
152
|
-
action: createToggleMarkCommand(type),
|
|
153
|
-
label: "Bold",
|
|
154
|
-
icon: /*#__PURE__*/React.createElement(BoldIcon, {
|
|
155
|
-
role: "presentation"
|
|
156
|
-
})
|
|
157
|
-
});
|
|
158
|
-
}
|
|
159
|
-
if (schema.marks.em) {
|
|
160
|
-
var type = schema.marks.em;
|
|
161
|
-
var groupIndex = getGroupIndex(controlGroupIndex, "italic");
|
|
162
|
-
toolbarControls[groupIndex].push({
|
|
163
|
-
isActive: markIsActive(editorState, type),
|
|
164
|
-
action: createToggleMarkCommand(type),
|
|
165
|
-
label: "Italic",
|
|
166
|
-
icon: /*#__PURE__*/React.createElement(ItalicsIcon, {
|
|
167
|
-
role: "presentation"
|
|
168
|
-
})
|
|
169
|
-
});
|
|
170
|
-
}
|
|
171
|
-
if (schema.marks.underline) {
|
|
172
|
-
var type = schema.marks.underline;
|
|
173
|
-
var groupIndex = getGroupIndex(controlGroupIndex, "underline");
|
|
174
|
-
toolbarControls[groupIndex].push({
|
|
175
|
-
isActive: markIsActive(editorState, type),
|
|
176
|
-
action: createToggleMarkCommand(type),
|
|
177
|
-
label: "Underline",
|
|
178
|
-
icon: /*#__PURE__*/React.createElement(UnderlineIcon, {
|
|
179
|
-
role: "presentation"
|
|
180
|
-
})
|
|
181
|
-
});
|
|
182
|
-
}
|
|
183
|
-
if (schema.nodes.bulletList) {
|
|
184
|
-
var type = schema.nodes.bulletList;
|
|
185
|
-
var groupIndex = getGroupIndex(controlGroupIndex, "bulletList");
|
|
186
|
-
toolbarControls[groupIndex].push({
|
|
187
|
-
action: createToggleListCommand(type),
|
|
188
|
-
isActive: listIsActive(editorState, type, listNodes),
|
|
189
|
-
label: "Bullet List",
|
|
190
|
-
icon: /*#__PURE__*/React.createElement(BullettedListIcon, {
|
|
191
|
-
role: "presentation"
|
|
192
|
-
})
|
|
193
|
-
});
|
|
194
|
-
}
|
|
195
|
-
if (schema.nodes.orderedList) {
|
|
196
|
-
var type = schema.nodes.orderedList;
|
|
197
|
-
var groupIndex = getGroupIndex(controlGroupIndex, "orderedList");
|
|
198
|
-
toolbarControls[groupIndex].push({
|
|
199
|
-
action: createToggleListCommand(type),
|
|
200
|
-
isActive: listIsActive(editorState, type, listNodes),
|
|
201
|
-
label: "Numbered List",
|
|
202
|
-
icon: /*#__PURE__*/React.createElement(NumberedListIcon, {
|
|
203
|
-
role: "presentation"
|
|
204
|
-
})
|
|
205
|
-
});
|
|
206
|
-
}
|
|
207
|
-
if (schema.nodes.orderedList || schema.nodes.bulletList) {
|
|
208
|
-
var groupIndex = controlGroupIndex["orderedList"] || controlGroupIndex["bulletList"] || "ungrouped";
|
|
209
|
-
toolbarControls[groupIndex].push({
|
|
210
|
-
action: createLiftListCommand(),
|
|
211
|
-
disabled: liftListIsDisabled(editorState),
|
|
212
|
-
isActive: false,
|
|
213
|
-
label: "Decrease indent",
|
|
214
|
-
icon: /*#__PURE__*/React.createElement(DecreaseIndentIcon, {
|
|
215
|
-
role: "presentation"
|
|
216
|
-
})
|
|
217
|
-
}, {
|
|
218
|
-
action: createIndentListCommand(),
|
|
219
|
-
disabled: indentListIsDisabled(editorState),
|
|
220
|
-
isActive: false,
|
|
221
|
-
label: "Increase indent",
|
|
222
|
-
icon: /*#__PURE__*/React.createElement(IncreaseIndentIcon, {
|
|
223
|
-
role: "presentation"
|
|
224
|
-
})
|
|
225
|
-
});
|
|
226
|
-
}
|
|
227
|
-
if (schema.marks.link) {
|
|
228
|
-
var type = schema.marks.link;
|
|
229
|
-
var groupIndex = getGroupIndex(controlGroupIndex, "link");
|
|
230
|
-
toolbarControls[groupIndex].push({
|
|
231
|
-
action: createToggleMarkCommand(type),
|
|
232
|
-
disabled: editorState.selection.empty,
|
|
233
|
-
isActive: false,
|
|
234
|
-
label: "Link",
|
|
235
|
-
icon: /*#__PURE__*/React.createElement(AddLinkIcon, {
|
|
236
|
-
role: "presentation"
|
|
237
|
-
})
|
|
238
|
-
});
|
|
239
|
-
}
|
|
240
|
-
return filterToolbarControls(toolbarControls);
|
|
241
|
-
}
|
|
242
|
-
export { buildControlMap };
|
|
243
|
-
//# sourceMappingURL=controlmap.mjs.map
|