carbon-react 153.0.3 → 153.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/esm/components/text-editor/__internal__/index.d.ts +0 -1
  2. package/esm/components/text-editor/__internal__/index.js +1 -2
  3. package/esm/components/text-editor/__internal__/plugins/Toolbar/buttons/save.component.d.ts +2 -2
  4. package/esm/components/text-editor/__internal__/plugins/Toolbar/toolbar.component.d.ts +2 -2
  5. package/esm/components/text-editor/__internal__/read-only-rte.component.js +1 -1
  6. package/esm/components/text-editor/index.d.ts +2 -2
  7. package/esm/components/text-editor/index.js +1 -1
  8. package/esm/components/text-editor/text-editor.component.d.ts +3 -2
  9. package/esm/components/text-editor/text-editor.component.js +4 -3
  10. package/esm/components/text-editor/{__internal__/utils.js → utils.js} +1 -1
  11. package/lib/components/text-editor/__internal__/index.d.ts +0 -1
  12. package/lib/components/text-editor/__internal__/index.js +0 -13
  13. package/lib/components/text-editor/__internal__/plugins/Toolbar/buttons/save.component.d.ts +2 -2
  14. package/lib/components/text-editor/__internal__/plugins/Toolbar/toolbar.component.d.ts +2 -2
  15. package/lib/components/text-editor/__internal__/read-only-rte.component.js +1 -1
  16. package/lib/components/text-editor/index.d.ts +2 -2
  17. package/lib/components/text-editor/index.js +3 -3
  18. package/lib/components/text-editor/text-editor.component.d.ts +3 -2
  19. package/lib/components/text-editor/text-editor.component.js +7 -6
  20. package/lib/components/text-editor/{__internal__/utils.js → utils.js} +1 -1
  21. package/package.json +1 -1
  22. /package/esm/components/text-editor/{__internal__/utils.d.ts → utils.d.ts} +0 -0
  23. /package/lib/components/text-editor/{__internal__/utils.d.ts → utils.d.ts} +0 -0
@@ -1,2 +1 @@
1
1
  export { default } from "./read-only-rte.component";
2
- export { createEmpty, createFromHTML } from "./utils";
@@ -1,2 +1 @@
1
- export { default } from "./read-only-rte.component";
2
- export { createEmpty, createFromHTML } from "./utils";
1
+ export { default } from "./read-only-rte.component";
@@ -11,7 +11,7 @@ interface SaveObjectProps {
11
11
  interface SaveProps {
12
12
  children: SaveObjectProps[];
13
13
  }
14
- export interface SaveCallbackProps {
14
+ export interface EditorFormattedValues {
15
15
  htmlString?: string;
16
16
  json?: {
17
17
  root: {
@@ -28,7 +28,7 @@ interface SaveButtonProps {
28
28
  /** The namespace of the editor that this button belongs to */
29
29
  namespace: string;
30
30
  /** The callback to call when the save button is clicked */
31
- onSave: (value: SaveCallbackProps) => void;
31
+ onSave: (value: EditorFormattedValues) => void;
32
32
  }
33
33
  declare const SaveButton: ({ namespace, onSave }: SaveButtonProps) => React.JSX.Element;
34
34
  export default SaveButton;
@@ -1,12 +1,12 @@
1
1
  import React from "react";
2
- import { SaveCallbackProps } from "./buttons/save.component";
2
+ import { EditorFormattedValues } from "./buttons/save.component";
3
3
  interface ToolbarProps {
4
4
  /** The namespace of the editor that this toolbar belongs to */
5
5
  namespace: string;
6
6
  /** The callback to call when the cancel button is clicked */
7
7
  onCancel?: () => void;
8
8
  /** The callback to call when the save button is clicked */
9
- onSave?: (value: SaveCallbackProps) => void;
9
+ onSave?: (value: EditorFormattedValues) => void;
10
10
  }
11
11
  declare const Toolbar: ({ namespace, onCancel, onSave }: ToolbarProps) => React.JSX.Element;
12
12
  export default Toolbar;
@@ -4,7 +4,7 @@ import { ContentEditable } from "@lexical/react/LexicalContentEditable";
4
4
  import { LexicalErrorBoundary } from "@lexical/react/LexicalErrorBoundary";
5
5
  import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
6
6
  import React, { useMemo } from "react";
7
- import { createFromHTML } from "./utils";
7
+ import { createFromHTML } from "../utils";
8
8
  import { markdownNodes, theme } from "./constants";
9
9
  const wrapLinksInAnchors = value => {
10
10
  const urlRegex = /((https?:\/\/)?[\w-]+(\.[\w-]+)+\.?(:\d+)?(\/\S*)?)/g;
@@ -1,3 +1,3 @@
1
1
  export { default } from "./text-editor.component";
2
- export { createEmpty, createFromHTML } from "./__internal__";
3
- export type { TextEditorProps } from "./text-editor.component";
2
+ export { createEmpty, createFromHTML } from "./utils";
3
+ export type { TextEditorProps, EditorFormattedValues, } from "./text-editor.component";
@@ -1,2 +1,2 @@
1
1
  export { default } from "./text-editor.component";
2
- export { createEmpty, createFromHTML } from "./__internal__";
2
+ export { createEmpty, createFromHTML } from "./utils";
@@ -1,7 +1,8 @@
1
1
  import React from "react";
2
2
  import { MarginProps } from "styled-system";
3
- import { SaveCallbackProps } from "./__internal__/plugins/Toolbar/buttons/save.component";
3
+ import { EditorFormattedValues as SaveCallbackProps } from "./__internal__/plugins/Toolbar/buttons/save.component";
4
4
  import { TagProps } from "../../__internal__/utils/helpers/tags";
5
+ export type EditorFormattedValues = SaveCallbackProps;
5
6
  export interface TextEditorProps extends MarginProps, TagProps {
6
7
  /** The maximum number of characters allowed in the editor */
7
8
  characterLimit?: number;
@@ -18,7 +19,7 @@ export interface TextEditorProps extends MarginProps, TagProps {
18
19
  /** The callback to fire when the Cancel button within the editor is pressed */
19
20
  onCancel?: () => void;
20
21
  /** The callback to fire when a change is registered within the editor */
21
- onChange?: (value: string) => void;
22
+ onChange?: (value: string, formattedValues: EditorFormattedValues) => void;
22
23
  /** The callback to fire when a link is added into the editor */
23
24
  onLinkAdded?: (link: string, state: string) => void;
24
25
  /** The callback to fire when the Save button within the editor is pressed */
@@ -11,15 +11,15 @@ import { LinkPlugin } from "@lexical/react/LexicalLinkPlugin";
11
11
  import { ListPlugin } from "@lexical/react/LexicalListPlugin";
12
12
  import { $getRoot } from "lexical";
13
13
  import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
14
+ import { SerializeLexical, validateUrl } from "./__internal__/helpers";
14
15
  import Label from "../../__internal__/label";
15
16
  import useDebounce from "../../hooks/__internal__/useDebounce";
16
17
  import useLocale from "../../hooks/__internal__/useLocale";
17
18
  import { COMPONENT_PREFIX, markdownNodes, theme } from "./__internal__/constants";
18
- import { validateUrl } from "./__internal__/helpers";
19
19
  import { AutoLinkerPlugin, CharacterCounterPlugin, ContentEditor, LinkMonitorPlugin, OnChangePlugin, Placeholder, ToolbarPlugin } from "./__internal__/plugins";
20
20
  import TextEditorContext from "./text-editor.context";
21
21
  import StyledTextEditor, { StyledEditorToolbarWrapper, StyledTextEditorWrapper, StyledValidationMessage, StyledWrapper } from "./text-editor.style";
22
- import { createEmpty } from "./__internal__";
22
+ import { createEmpty } from "./utils";
23
23
  import HintText from "../../__internal__/hint-text";
24
24
  import { filterStyledSystemMarginProps } from "../../style/utils";
25
25
  import tagComponent from "../../__internal__/utils/helpers/tags";
@@ -65,7 +65,8 @@ export const TextEditor = ({
65
65
  const handleChange = useDebounce(newState => {
66
66
  const currentTextContent = newState.read(() => $getRoot().getTextContent());
67
67
  if (onChange) {
68
- onChange?.(currentTextContent);
68
+ const formattedValues = editorRef.current ? SerializeLexical(editorRef.current) : {};
69
+ onChange?.(currentTextContent, formattedValues);
69
70
  }
70
71
 
71
72
  // If the character limit is set, check if the limit has been exceeded
@@ -1,4 +1,4 @@
1
- import { DeserializeHTML } from "./helpers";
1
+ import { DeserializeHTML } from "./__internal__/helpers";
2
2
  const createFromHTML = html => {
3
3
  // DeserializeHTML is tested as part of the helper tests
4
4
  /* istanbul ignore next */
@@ -1,2 +1 @@
1
1
  export { default } from "./read-only-rte.component";
2
- export { createEmpty, createFromHTML } from "./utils";
@@ -3,18 +3,6 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- Object.defineProperty(exports, "createEmpty", {
7
- enumerable: true,
8
- get: function () {
9
- return _utils.createEmpty;
10
- }
11
- });
12
- Object.defineProperty(exports, "createFromHTML", {
13
- enumerable: true,
14
- get: function () {
15
- return _utils.createFromHTML;
16
- }
17
- });
18
6
  Object.defineProperty(exports, "default", {
19
7
  enumerable: true,
20
8
  get: function () {
@@ -22,5 +10,4 @@ Object.defineProperty(exports, "default", {
22
10
  }
23
11
  });
24
12
  var _readOnlyRte = _interopRequireDefault(require("./read-only-rte.component"));
25
- var _utils = require("./utils");
26
13
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -11,7 +11,7 @@ interface SaveObjectProps {
11
11
  interface SaveProps {
12
12
  children: SaveObjectProps[];
13
13
  }
14
- export interface SaveCallbackProps {
14
+ export interface EditorFormattedValues {
15
15
  htmlString?: string;
16
16
  json?: {
17
17
  root: {
@@ -28,7 +28,7 @@ interface SaveButtonProps {
28
28
  /** The namespace of the editor that this button belongs to */
29
29
  namespace: string;
30
30
  /** The callback to call when the save button is clicked */
31
- onSave: (value: SaveCallbackProps) => void;
31
+ onSave: (value: EditorFormattedValues) => void;
32
32
  }
33
33
  declare const SaveButton: ({ namespace, onSave }: SaveButtonProps) => React.JSX.Element;
34
34
  export default SaveButton;
@@ -1,12 +1,12 @@
1
1
  import React from "react";
2
- import { SaveCallbackProps } from "./buttons/save.component";
2
+ import { EditorFormattedValues } from "./buttons/save.component";
3
3
  interface ToolbarProps {
4
4
  /** The namespace of the editor that this toolbar belongs to */
5
5
  namespace: string;
6
6
  /** The callback to call when the cancel button is clicked */
7
7
  onCancel?: () => void;
8
8
  /** The callback to call when the save button is clicked */
9
- onSave?: (value: SaveCallbackProps) => void;
9
+ onSave?: (value: EditorFormattedValues) => void;
10
10
  }
11
11
  declare const Toolbar: ({ namespace, onCancel, onSave }: ToolbarProps) => React.JSX.Element;
12
12
  export default Toolbar;
@@ -9,7 +9,7 @@ var _LexicalContentEditable = require("@lexical/react/LexicalContentEditable");
9
9
  var _LexicalErrorBoundary = require("@lexical/react/LexicalErrorBoundary");
10
10
  var _LexicalRichTextPlugin = require("@lexical/react/LexicalRichTextPlugin");
11
11
  var _react = _interopRequireWildcard(require("react"));
12
- var _utils = require("./utils");
12
+ var _utils = require("../utils");
13
13
  var _constants = require("./constants");
14
14
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
15
15
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -1,3 +1,3 @@
1
1
  export { default } from "./text-editor.component";
2
- export { createEmpty, createFromHTML } from "./__internal__";
3
- export type { TextEditorProps } from "./text-editor.component";
2
+ export { createEmpty, createFromHTML } from "./utils";
3
+ export type { TextEditorProps, EditorFormattedValues, } from "./text-editor.component";
@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", {
6
6
  Object.defineProperty(exports, "createEmpty", {
7
7
  enumerable: true,
8
8
  get: function () {
9
- return _internal__.createEmpty;
9
+ return _utils.createEmpty;
10
10
  }
11
11
  });
12
12
  Object.defineProperty(exports, "createFromHTML", {
13
13
  enumerable: true,
14
14
  get: function () {
15
- return _internal__.createFromHTML;
15
+ return _utils.createFromHTML;
16
16
  }
17
17
  });
18
18
  Object.defineProperty(exports, "default", {
@@ -22,5 +22,5 @@ Object.defineProperty(exports, "default", {
22
22
  }
23
23
  });
24
24
  var _textEditor = _interopRequireDefault(require("./text-editor.component"));
25
- var _internal__ = require("./__internal__");
25
+ var _utils = require("./utils");
26
26
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -1,7 +1,8 @@
1
1
  import React from "react";
2
2
  import { MarginProps } from "styled-system";
3
- import { SaveCallbackProps } from "./__internal__/plugins/Toolbar/buttons/save.component";
3
+ import { EditorFormattedValues as SaveCallbackProps } from "./__internal__/plugins/Toolbar/buttons/save.component";
4
4
  import { TagProps } from "../../__internal__/utils/helpers/tags";
5
+ export type EditorFormattedValues = SaveCallbackProps;
5
6
  export interface TextEditorProps extends MarginProps, TagProps {
6
7
  /** The maximum number of characters allowed in the editor */
7
8
  characterLimit?: number;
@@ -18,7 +19,7 @@ export interface TextEditorProps extends MarginProps, TagProps {
18
19
  /** The callback to fire when the Cancel button within the editor is pressed */
19
20
  onCancel?: () => void;
20
21
  /** The callback to fire when a change is registered within the editor */
21
- onChange?: (value: string) => void;
22
+ onChange?: (value: string, formattedValues: EditorFormattedValues) => void;
22
23
  /** The callback to fire when a link is added into the editor */
23
24
  onLinkAdded?: (link: string, state: string) => void;
24
25
  /** The callback to fire when the Save button within the editor is pressed */
@@ -15,17 +15,17 @@ var _LexicalLinkPlugin = require("@lexical/react/LexicalLinkPlugin");
15
15
  var _LexicalListPlugin = require("@lexical/react/LexicalListPlugin");
16
16
  var _lexical = require("lexical");
17
17
  var _react = _interopRequireWildcard(require("react"));
18
+ var _helpers = require("./__internal__/helpers");
18
19
  var _label = _interopRequireDefault(require("../../__internal__/label"));
19
20
  var _useDebounce = _interopRequireDefault(require("../../hooks/__internal__/useDebounce"));
20
21
  var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
21
22
  var _constants = require("./__internal__/constants");
22
- var _helpers = require("./__internal__/helpers");
23
23
  var _plugins = require("./__internal__/plugins");
24
24
  var _textEditor = _interopRequireDefault(require("./text-editor.context"));
25
25
  var _textEditor2 = _interopRequireWildcard(require("./text-editor.style"));
26
- var _internal__ = require("./__internal__");
26
+ var _utils = require("./utils");
27
27
  var _hintText = _interopRequireDefault(require("../../__internal__/hint-text"));
28
- var _utils = require("../../style/utils");
28
+ var _utils2 = require("../../style/utils");
29
29
  var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags"));
30
30
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
31
31
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -73,7 +73,8 @@ const TextEditor = ({
73
73
  const handleChange = (0, _useDebounce.default)(newState => {
74
74
  const currentTextContent = newState.read(() => (0, _lexical.$getRoot)().getTextContent());
75
75
  if (onChange) {
76
- onChange?.(currentTextContent);
76
+ const formattedValues = editorRef.current ? (0, _helpers.SerializeLexical)(editorRef.current) : {};
77
+ onChange?.(currentTextContent, formattedValues);
77
78
  }
78
79
 
79
80
  // If the character limit is set, check if the limit has been exceeded
@@ -100,7 +101,7 @@ const TextEditor = ({
100
101
  // Reset the value of the editor when the cancel trigger is updated (implements reset on cancel)
101
102
  (0, _react.useEffect)(() => {
102
103
  const editor = editorRef.current;
103
- const safeValue = value || (0, _internal__.createEmpty)();
104
+ const safeValue = value || (0, _utils.createEmpty)();
104
105
 
105
106
  /* istanbul ignore else */
106
107
  if (editor) {
@@ -115,7 +116,7 @@ const TextEditor = ({
115
116
  }), [handleCancel, namespace, onCancel, onSave]);
116
117
  return /*#__PURE__*/_react.default.createElement(_textEditor2.StyledTextEditorWrapper, _extends({
117
118
  "data-role": `${namespace}-editor-wrapper`
118
- }, (0, _utils.filterStyledSystemMarginProps)(rest), (0, _tags.default)("text-editor", rest)), /*#__PURE__*/_react.default.createElement(_textEditor.default.Provider, {
119
+ }, (0, _utils2.filterStyledSystemMarginProps)(rest), (0, _tags.default)("text-editor", rest)), /*#__PURE__*/_react.default.createElement(_textEditor.default.Provider, {
119
120
  value: {
120
121
  onLinkAdded,
121
122
  readOnly
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.createFromHTML = exports.createEmpty = void 0;
7
- var _helpers = require("./helpers");
7
+ var _helpers = require("./__internal__/helpers");
8
8
  const createFromHTML = html => {
9
9
  // DeserializeHTML is tested as part of the helper tests
10
10
  /* istanbul ignore next */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "carbon-react",
3
- "version": "153.0.3",
3
+ "version": "153.1.0",
4
4
  "description": "A library of reusable React components for easily building user interfaces.",
5
5
  "files": [
6
6
  "lib",