@entur-partner/rich-text-editor 6.2.4-alpha.0 → 6.2.4-alpha.1
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/ExpandableMultiLanguageRichTextEditor.d.ts +21 -21
- package/dist/index.d.ts +5 -5
- package/dist/rich-text-editor.cjs.development.js +103 -122
- package/dist/rich-text-editor.cjs.development.js.map +1 -1
- package/dist/rich-text-editor.cjs.production.min.js +1 -1
- package/dist/rich-text-editor.cjs.production.min.js.map +1 -1
- package/dist/rich-text-editor.esm.js +21 -33
- package/dist/rich-text-editor.esm.js.map +1 -1
- package/package.json +3 -3
- package/dist/RichTextEditor/BlockTypeDropdown/index.d.ts +0 -3
- package/dist/RichTextEditor/Controls/BlockTypeButtonControls.d.ts +0 -3
- package/dist/RichTextEditor/Controls/BlockTypeLinkControls.d.ts +0 -3
- package/dist/RichTextEditor/Controls/BlockTypeSelectControls.d.ts +0 -7
- package/dist/RichTextEditor/Controls/InlineStyleControls.d.ts +0 -3
- package/dist/RichTextEditor/Controls/TagControls.d.ts +0 -3
- package/dist/RichTextEditor/Link/index.d.ts +0 -8
- package/dist/RichTextEditor/StyleButton/index.d.ts +0 -3
- package/dist/RichTextEditor/constants.d.ts +0 -94
- package/dist/RichTextEditor/htmlConvertion.d.ts +0 -9
- package/dist/RichTextEditor/index.d.ts +0 -58
- package/dist/RichTextEditor/markdownConvertion.d.ts +0 -4
- package/dist/events.d.ts +0 -4
- package/dist/withI18n.d.ts +0 -2
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import { type VariantType } from "@entur/form";
|
|
2
|
-
import { type LanguageKey, type LanguageOption, type MultiLanguageValues } from "@entur-partner/common";
|
|
3
|
-
import React from "react";
|
|
4
|
-
type MultiLanguageInputProps = {
|
|
5
|
-
values: MultiLanguageValues;
|
|
6
|
-
onChange: (values: MultiLanguageValues) => void;
|
|
7
|
-
variant?: (lang: LanguageKey) => VariantType;
|
|
8
|
-
feedback?: (lang: LanguageKey) => string;
|
|
9
|
-
tags?: {
|
|
10
|
-
tag: string;
|
|
11
|
-
delimiter: string;
|
|
12
|
-
label: string;
|
|
13
|
-
}[];
|
|
14
|
-
};
|
|
15
|
-
type ExpandableMultiLanguageRichTextEditorProps = MultiLanguageInputProps & {
|
|
16
|
-
name: string;
|
|
17
|
-
title: string;
|
|
18
|
-
languages: LanguageOption[];
|
|
19
|
-
};
|
|
20
|
-
export declare const ExpandableMultiLanguageRichTextEditor: ({ name, title, languages, ...rest }: ExpandableMultiLanguageRichTextEditorProps) => React.JSX.Element;
|
|
21
|
-
export {};
|
|
1
|
+
import { type VariantType } from "@entur/form";
|
|
2
|
+
import { type LanguageKey, type LanguageOption, type MultiLanguageValues } from "@entur-partner/common";
|
|
3
|
+
import React from "react";
|
|
4
|
+
type MultiLanguageInputProps = {
|
|
5
|
+
values: MultiLanguageValues;
|
|
6
|
+
onChange: (values: MultiLanguageValues) => void;
|
|
7
|
+
variant?: (lang: LanguageKey) => VariantType;
|
|
8
|
+
feedback?: (lang: LanguageKey) => string;
|
|
9
|
+
tags?: {
|
|
10
|
+
tag: string;
|
|
11
|
+
delimiter: string;
|
|
12
|
+
label: string;
|
|
13
|
+
}[];
|
|
14
|
+
};
|
|
15
|
+
type ExpandableMultiLanguageRichTextEditorProps = MultiLanguageInputProps & {
|
|
16
|
+
name: string;
|
|
17
|
+
title: string;
|
|
18
|
+
languages: LanguageOption[];
|
|
19
|
+
};
|
|
20
|
+
export declare const ExpandableMultiLanguageRichTextEditor: ({ name, title, languages, ...rest }: ExpandableMultiLanguageRichTextEditorProps) => React.JSX.Element;
|
|
21
|
+
export {};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { ExpandableMultiLanguageRichTextEditor } from "./ExpandableMultiLanguageRichTextEditor";
|
|
2
|
-
export { default as RichTextEditor } from "./RichTextEditor";
|
|
3
|
-
export { EditorConfigTypes, MinifiedConfigTypes, } from "./RichTextEditor/constants";
|
|
4
|
-
export { editorStateToHtml, htmlToEditorState, } from "./RichTextEditor/htmlConvertion";
|
|
5
|
-
export { editorStateToMarkdown, markdownToEditorState, markdownToHtml, } from "./RichTextEditor/markdownConvertion";
|
|
1
|
+
export { ExpandableMultiLanguageRichTextEditor } from "./ExpandableMultiLanguageRichTextEditor";
|
|
2
|
+
export { default as RichTextEditor } from "./RichTextEditor";
|
|
3
|
+
export { EditorConfigTypes, MinifiedConfigTypes, } from "./RichTextEditor/constants";
|
|
4
|
+
export { editorStateToHtml, htmlToEditorState, } from "./RichTextEditor/htmlConvertion";
|
|
5
|
+
export { editorStateToMarkdown, markdownToEditorState, markdownToHtml, } from "./RichTextEditor/markdownConvertion";
|
|
@@ -20,50 +20,31 @@ var markdownDraftJs = require('markdown-draft-js');
|
|
|
20
20
|
var showdown = require('showdown');
|
|
21
21
|
var draftConvert = require('draft-convert');
|
|
22
22
|
|
|
23
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
24
|
-
|
|
25
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
26
|
-
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
|
|
27
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
28
|
-
var showdown__default = /*#__PURE__*/_interopDefaultLegacy(showdown);
|
|
29
|
-
|
|
30
23
|
function _extends() {
|
|
31
|
-
_extends = Object.assign ? Object.assign.bind() : function (
|
|
32
|
-
for (var
|
|
33
|
-
var
|
|
34
|
-
for (var
|
|
35
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
36
|
-
target[key] = source[key];
|
|
37
|
-
}
|
|
38
|
-
}
|
|
24
|
+
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
25
|
+
for (var e = 1; e < arguments.length; e++) {
|
|
26
|
+
var t = arguments[e];
|
|
27
|
+
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
39
28
|
}
|
|
40
|
-
return
|
|
41
|
-
};
|
|
42
|
-
return _extends.apply(this, arguments);
|
|
29
|
+
return n;
|
|
30
|
+
}, _extends.apply(null, arguments);
|
|
43
31
|
}
|
|
44
|
-
function _inheritsLoose(
|
|
45
|
-
|
|
46
|
-
subClass.prototype.constructor = subClass;
|
|
47
|
-
_setPrototypeOf(subClass, superClass);
|
|
32
|
+
function _inheritsLoose(t, o) {
|
|
33
|
+
t.prototype = Object.create(o.prototype), t.prototype.constructor = t, _setPrototypeOf(t, o);
|
|
48
34
|
}
|
|
49
|
-
function
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
}
|
|
56
|
-
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
57
|
-
if (source == null) return {};
|
|
58
|
-
var target = {};
|
|
59
|
-
var sourceKeys = Object.keys(source);
|
|
60
|
-
var key, i;
|
|
61
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
62
|
-
key = sourceKeys[i];
|
|
63
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
64
|
-
target[key] = source[key];
|
|
35
|
+
function _objectWithoutPropertiesLoose(r, e) {
|
|
36
|
+
if (null == r) return {};
|
|
37
|
+
var t = {};
|
|
38
|
+
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
39
|
+
if (-1 !== e.indexOf(n)) continue;
|
|
40
|
+
t[n] = r[n];
|
|
65
41
|
}
|
|
66
|
-
return
|
|
42
|
+
return t;
|
|
43
|
+
}
|
|
44
|
+
function _setPrototypeOf(t, e) {
|
|
45
|
+
return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {
|
|
46
|
+
return t.__proto__ = e, t;
|
|
47
|
+
}, _setPrototypeOf(t, e);
|
|
67
48
|
}
|
|
68
49
|
|
|
69
50
|
var Key = /*#__PURE__*/Object.freeze({
|
|
@@ -85,7 +66,7 @@ function useI18N() {
|
|
|
85
66
|
function withI18n(Component) {
|
|
86
67
|
return function WrappedComponent(props) {
|
|
87
68
|
var t = useI18N();
|
|
88
|
-
return /*#__PURE__*/
|
|
69
|
+
return /*#__PURE__*/React.createElement(Component, _extends({}, props, {
|
|
89
70
|
i18n: t
|
|
90
71
|
}));
|
|
91
72
|
};
|
|
@@ -123,13 +104,13 @@ var StyleButton = /*#__PURE__*/function (_Component) {
|
|
|
123
104
|
label = _this$props3.label,
|
|
124
105
|
title = _this$props3.title,
|
|
125
106
|
hotKey = _this$props3.hotKey;
|
|
126
|
-
var classNames =
|
|
107
|
+
var classNames = cx("editor-stylebutton", {
|
|
127
108
|
active: active
|
|
128
109
|
});
|
|
129
110
|
return (
|
|
130
111
|
/*#__PURE__*/
|
|
131
112
|
// biome-ignore lint/a11y/noStaticElementInteractions: Ignore for now.
|
|
132
|
-
|
|
113
|
+
React.createElement("div", {
|
|
133
114
|
className: classNames,
|
|
134
115
|
onMouseDown: this.onToggle,
|
|
135
116
|
title: i18n(title) + hotKey
|
|
@@ -154,10 +135,10 @@ var BlockTypeButtonControls = function BlockTypeButtonControls(props) {
|
|
|
154
135
|
onToggle = props.onToggle;
|
|
155
136
|
var selection = editorState.getSelection();
|
|
156
137
|
var blockTypeStyle = editorState.getCurrentContent().getBlockForKey(selection.getStartKey()).getType();
|
|
157
|
-
return /*#__PURE__*/
|
|
138
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
158
139
|
className: "controls-group block-editor-controls"
|
|
159
140
|
}, blockTypes.map(function (type) {
|
|
160
|
-
return /*#__PURE__*/
|
|
141
|
+
return /*#__PURE__*/React.createElement(StyleButton$1, {
|
|
161
142
|
key: type.style + type.label,
|
|
162
143
|
active: type.style === blockTypeStyle,
|
|
163
144
|
label: type.label,
|
|
@@ -262,23 +243,23 @@ var BlockTypeLinkControls = /*#__PURE__*/function (_Component) {
|
|
|
262
243
|
var _this$state = this.state,
|
|
263
244
|
showUrlInput = _this$state.showUrlInput,
|
|
264
245
|
hasLink = _this$state.hasLink;
|
|
265
|
-
return /*#__PURE__*/
|
|
246
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
266
247
|
className: "controls-group block-editor-controls link-controls"
|
|
267
|
-
}, /*#__PURE__*/
|
|
248
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
268
249
|
className: "editor-stylebutton",
|
|
269
250
|
title: i18n("styles.link"),
|
|
270
251
|
onClick: this.addLink,
|
|
271
252
|
tabIndex: 0
|
|
272
|
-
}, /*#__PURE__*/
|
|
253
|
+
}, /*#__PURE__*/React.createElement(icons.LinkIcon, null)), showUrlInput && /*#__PURE__*/React.createElement("div", {
|
|
273
254
|
className: "url-input-container"
|
|
274
|
-
}, /*#__PURE__*/
|
|
255
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
275
256
|
className: "exit-button",
|
|
276
257
|
onMouseDown: this.cancelLink
|
|
277
|
-
}, /*#__PURE__*/
|
|
258
|
+
}, /*#__PURE__*/React.createElement(icons.CloseIcon, null)), /*#__PURE__*/React.createElement("div", {
|
|
278
259
|
className: "link-label"
|
|
279
|
-
}, i18n("common.from")), /*#__PURE__*/
|
|
260
|
+
}, i18n("common.from")), /*#__PURE__*/React.createElement("div", {
|
|
280
261
|
className: "url-input-form"
|
|
281
|
-
}, /*#__PURE__*/
|
|
262
|
+
}, /*#__PURE__*/React.createElement(form.TextField, {
|
|
282
263
|
style: {
|
|
283
264
|
width: 250,
|
|
284
265
|
margin: 5
|
|
@@ -287,23 +268,23 @@ var BlockTypeLinkControls = /*#__PURE__*/function (_Component) {
|
|
|
287
268
|
value: this.state.urlValue,
|
|
288
269
|
onKeyDown: this.onLinkInputKeyDown,
|
|
289
270
|
placeholder: "https://example.com"
|
|
290
|
-
}), /*#__PURE__*/
|
|
271
|
+
}), /*#__PURE__*/React.createElement(button.SecondarySquareButton, {
|
|
291
272
|
onMouseDown: this.confirmLink
|
|
292
|
-
}, /*#__PURE__*/
|
|
273
|
+
}, /*#__PURE__*/React.createElement(icons.CheckIcon, {
|
|
293
274
|
width: 15,
|
|
294
275
|
height: 15
|
|
295
|
-
}))), hasLink && /*#__PURE__*/
|
|
276
|
+
}))), hasLink && /*#__PURE__*/React.createElement("div", {
|
|
296
277
|
className: "remove-link"
|
|
297
|
-
}, /*#__PURE__*/
|
|
278
|
+
}, /*#__PURE__*/React.createElement(common.Unbutton, {
|
|
298
279
|
onClick: this.removeLink,
|
|
299
280
|
title: i18n("styles.unlink")
|
|
300
|
-
}, /*#__PURE__*/
|
|
281
|
+
}, /*#__PURE__*/React.createElement(icons.UnlinkIcon, null), i18n("styles.unlink")))));
|
|
301
282
|
};
|
|
302
283
|
return BlockTypeLinkControls;
|
|
303
284
|
}(React.Component);
|
|
304
285
|
BlockTypeLinkControls.propTypes = {
|
|
305
|
-
editorState:
|
|
306
|
-
onToggle:
|
|
286
|
+
editorState: PropTypes.object,
|
|
287
|
+
onToggle: PropTypes.func
|
|
307
288
|
};
|
|
308
289
|
var BlockTypeLinkControls$1 = /*#__PURE__*/withI18n(BlockTypeLinkControls);
|
|
309
290
|
|
|
@@ -332,35 +313,35 @@ var BlockTypeDropdown = /*#__PURE__*/function (_Component) {
|
|
|
332
313
|
var formattedLabelText = this.props.i18n(label);
|
|
333
314
|
switch (label) {
|
|
334
315
|
case "styles.p":
|
|
335
|
-
return /*#__PURE__*/
|
|
316
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
336
317
|
className: "default-p"
|
|
337
318
|
}, formattedLabelText);
|
|
338
319
|
case "styles.h1":
|
|
339
|
-
return /*#__PURE__*/
|
|
320
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
340
321
|
className: "default-h1"
|
|
341
322
|
}, formattedLabelText);
|
|
342
323
|
case "styles.h2":
|
|
343
|
-
return /*#__PURE__*/
|
|
324
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
344
325
|
className: "default-h2"
|
|
345
326
|
}, formattedLabelText);
|
|
346
327
|
case "styles.h3":
|
|
347
|
-
return /*#__PURE__*/
|
|
328
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
348
329
|
className: "default-h3"
|
|
349
330
|
}, formattedLabelText);
|
|
350
331
|
case "styles.h4":
|
|
351
|
-
return /*#__PURE__*/
|
|
332
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
352
333
|
className: "default-h4"
|
|
353
334
|
}, formattedLabelText);
|
|
354
335
|
case "styles.h5":
|
|
355
|
-
return /*#__PURE__*/
|
|
336
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
356
337
|
className: "default-h5"
|
|
357
338
|
}, formattedLabelText);
|
|
358
339
|
case "styles.h6":
|
|
359
|
-
return /*#__PURE__*/
|
|
340
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
360
341
|
className: "default-h6"
|
|
361
342
|
}, formattedLabelText);
|
|
362
343
|
default:
|
|
363
|
-
return /*#__PURE__*/
|
|
344
|
+
return /*#__PURE__*/React.createElement("p", null, formattedLabelText);
|
|
364
345
|
}
|
|
365
346
|
};
|
|
366
347
|
_proto.render = function render() {
|
|
@@ -369,7 +350,7 @@ var BlockTypeDropdown = /*#__PURE__*/function (_Component) {
|
|
|
369
350
|
options = _this$props.options,
|
|
370
351
|
selected = _this$props.selected,
|
|
371
352
|
i18n = _this$props.i18n;
|
|
372
|
-
return /*#__PURE__*/
|
|
353
|
+
return /*#__PURE__*/React.createElement(dropdown.Dropdown, {
|
|
373
354
|
className: "block-type-dropdown",
|
|
374
355
|
items: options.map(function (option) {
|
|
375
356
|
return _this2.toItem(option);
|
|
@@ -394,7 +375,7 @@ var BlockTypeControls = function BlockTypeControls(_ref) {
|
|
|
394
375
|
var selectedOption = blockTypes.find(function (option) {
|
|
395
376
|
return option.style === blockTypeStyle;
|
|
396
377
|
}) || blockTypes[0];
|
|
397
|
-
return /*#__PURE__*/
|
|
378
|
+
return /*#__PURE__*/React.createElement(BlockTypeDropdown$1, {
|
|
398
379
|
options: blockTypes,
|
|
399
380
|
selected: selectedOption,
|
|
400
381
|
onChange: onToggle
|
|
@@ -405,10 +386,10 @@ var InlineStyleControls = function InlineStyleControls(props) {
|
|
|
405
386
|
var editorState = props.editorState,
|
|
406
387
|
inlineStyles = props.inlineStyles;
|
|
407
388
|
var currentStyle = editorState.getCurrentInlineStyle();
|
|
408
|
-
return /*#__PURE__*/
|
|
389
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
409
390
|
className: "controls-group inline-editor-controls"
|
|
410
391
|
}, inlineStyles.map(function (type) {
|
|
411
|
-
return /*#__PURE__*/
|
|
392
|
+
return /*#__PURE__*/React.createElement(StyleButton$1, {
|
|
412
393
|
key: type.style + type.label,
|
|
413
394
|
active: currentStyle.has(type.style),
|
|
414
395
|
label: type.label,
|
|
@@ -465,21 +446,21 @@ var TagControls = /*#__PURE__*/function (_Component) {
|
|
|
465
446
|
var isOpen = this.state.isOpen;
|
|
466
447
|
var menuItems = tags.map(function (tag) {
|
|
467
448
|
var delimiter = tag.delimiter || "{}";
|
|
468
|
-
return /*#__PURE__*/
|
|
449
|
+
return /*#__PURE__*/React.createElement(menu.OverflowMenuItem, {
|
|
469
450
|
key: tag.tag,
|
|
470
451
|
className: "tag-control",
|
|
471
452
|
id: "tag-control-" + tag.tag,
|
|
472
453
|
onClick: function onClick() {
|
|
473
454
|
return _this2.handleTagClick(tag.tag, delimiter);
|
|
474
455
|
}
|
|
475
|
-
}, tag.icon, /*#__PURE__*/
|
|
456
|
+
}, tag.icon, /*#__PURE__*/React.createElement("span", {
|
|
476
457
|
className: "tag-control-text"
|
|
477
458
|
}, tag.label));
|
|
478
459
|
});
|
|
479
|
-
return /*#__PURE__*/
|
|
460
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
480
461
|
className: "tag-control-dropdown",
|
|
481
462
|
ref: this.tagControlRef
|
|
482
|
-
}, /*#__PURE__*/
|
|
463
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
483
464
|
className: "tag-control-header",
|
|
484
465
|
onClick: function onClick() {
|
|
485
466
|
return _this2.setState(function (_ref) {
|
|
@@ -489,36 +470,36 @@ var TagControls = /*#__PURE__*/function (_Component) {
|
|
|
489
470
|
};
|
|
490
471
|
});
|
|
491
472
|
}
|
|
492
|
-
}, i18n("common.insert"), /*#__PURE__*/
|
|
473
|
+
}, i18n("common.insert"), /*#__PURE__*/React.createElement(icons.DownArrowIcon, {
|
|
493
474
|
className: "tag-control-chevron",
|
|
494
475
|
inline: true
|
|
495
|
-
})), /*#__PURE__*/
|
|
476
|
+
})), /*#__PURE__*/React.createElement(tooltip.Popover, {
|
|
496
477
|
open: isOpen,
|
|
497
478
|
className: "tag-control-content"
|
|
498
|
-
}, /*#__PURE__*/
|
|
479
|
+
}, /*#__PURE__*/React.createElement(menu.OverflowMenu, {
|
|
499
480
|
className: "action-menu"
|
|
500
481
|
}, menuItems)));
|
|
501
482
|
};
|
|
502
483
|
return TagControls;
|
|
503
484
|
}(React.Component);
|
|
504
485
|
TagControls.propTypes = {
|
|
505
|
-
editorState:
|
|
506
|
-
tags:
|
|
507
|
-
onInsertTag:
|
|
486
|
+
editorState: PropTypes.object,
|
|
487
|
+
tags: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
488
|
+
onInsertTag: PropTypes.func.isRequired
|
|
508
489
|
};
|
|
509
490
|
var TagControls$1 = /*#__PURE__*/withI18n(TagControls);
|
|
510
491
|
|
|
511
492
|
var HtmlLink = function HtmlLink(_ref) {
|
|
512
493
|
var url = _ref.url,
|
|
513
494
|
children = _ref.children;
|
|
514
|
-
return /*#__PURE__*/
|
|
495
|
+
return /*#__PURE__*/React.createElement("a", {
|
|
515
496
|
href: url
|
|
516
497
|
}, children);
|
|
517
498
|
};
|
|
518
499
|
var Link = function Link(props) {
|
|
519
500
|
var _props$contentState$g = props.contentState.getEntity(props.entityKey).getData(),
|
|
520
501
|
url = _props$contentState$g.url;
|
|
521
|
-
return /*#__PURE__*/
|
|
502
|
+
return /*#__PURE__*/React.createElement(HtmlLink, {
|
|
522
503
|
url: url
|
|
523
504
|
}, props.children);
|
|
524
505
|
};
|
|
@@ -581,31 +562,31 @@ var FontList = /*#__PURE__*/Object.freeze({
|
|
|
581
562
|
});
|
|
582
563
|
var BlockTypeList = /*#__PURE__*/Object.freeze({
|
|
583
564
|
"unordered-list": {
|
|
584
|
-
label: /*#__PURE__*/
|
|
565
|
+
label: /*#__PURE__*/React.createElement(icons.BulletListIcon, null),
|
|
585
566
|
style: "unordered-list-item",
|
|
586
567
|
tooltip: "styles.unordered_list_item"
|
|
587
568
|
},
|
|
588
569
|
"ordered-list": {
|
|
589
|
-
label: /*#__PURE__*/
|
|
570
|
+
label: /*#__PURE__*/React.createElement(icons.NumberListIcon, null),
|
|
590
571
|
style: "ordered-list-item",
|
|
591
572
|
tooltip: "styles.ordered_list_item"
|
|
592
573
|
}
|
|
593
574
|
});
|
|
594
575
|
var InlineStylesList = /*#__PURE__*/Object.freeze({
|
|
595
576
|
bold: {
|
|
596
|
-
label: /*#__PURE__*/
|
|
577
|
+
label: /*#__PURE__*/React.createElement(icons.BoldIcon, null),
|
|
597
578
|
style: "BOLD",
|
|
598
579
|
tooltip: "styles.bold",
|
|
599
580
|
hotKey: "(Ctrl+B)"
|
|
600
581
|
},
|
|
601
582
|
italic: {
|
|
602
|
-
label: /*#__PURE__*/
|
|
583
|
+
label: /*#__PURE__*/React.createElement(icons.ItalicIcon, null),
|
|
603
584
|
style: "ITALIC",
|
|
604
585
|
tooltip: "styles.italic",
|
|
605
586
|
hotKey: "(Ctrl+I)"
|
|
606
587
|
},
|
|
607
588
|
underline: {
|
|
608
|
-
label: /*#__PURE__*/
|
|
589
|
+
label: /*#__PURE__*/React.createElement(icons.UnderlineIcon, null),
|
|
609
590
|
style: "UNDERLINE",
|
|
610
591
|
tooltip: "styles.underline",
|
|
611
592
|
hotKey: "(Ctrl+U)"
|
|
@@ -735,35 +716,35 @@ var RichTextEditor = /*#__PURE__*/function (_Component) {
|
|
|
735
716
|
editorState = _this$props5.editorState,
|
|
736
717
|
onChange = _this$props5.onChange,
|
|
737
718
|
handleBeforeInput = _this$props5.handleBeforeInput;
|
|
738
|
-
var classNames =
|
|
739
|
-
return /*#__PURE__*/
|
|
719
|
+
var classNames = cx("editor-root", className);
|
|
720
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
740
721
|
ref: this.wrapperRef
|
|
741
|
-
}, label && /*#__PURE__*/
|
|
722
|
+
}, label && /*#__PURE__*/React.createElement(typography.Label, null, label), /*#__PURE__*/React.createElement("div", {
|
|
742
723
|
className: classNames
|
|
743
|
-
}, /*#__PURE__*/
|
|
724
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
744
725
|
className: "controls-wrapper"
|
|
745
|
-
}, showFontMenu && /*#__PURE__*/
|
|
726
|
+
}, showFontMenu && /*#__PURE__*/React.createElement(BlockTypeControls, {
|
|
746
727
|
editorState: editorState,
|
|
747
728
|
onToggle: this.toggleSelectBlockType,
|
|
748
729
|
blockTypes: this.getFontListConfigForPanelType("fontList")
|
|
749
|
-
}), showInlineStyleMenu && /*#__PURE__*/
|
|
730
|
+
}), showInlineStyleMenu && /*#__PURE__*/React.createElement(InlineStyleControls, {
|
|
750
731
|
editorState: editorState,
|
|
751
732
|
onToggle: this.toggleInlineStyle,
|
|
752
733
|
inlineStyles: this.getFontListConfigForPanelType("inlineStyles")
|
|
753
|
-
}), showTextFormatMenu && /*#__PURE__*/
|
|
734
|
+
}), showTextFormatMenu && /*#__PURE__*/React.createElement(BlockTypeButtonControls, {
|
|
754
735
|
editorState: editorState,
|
|
755
736
|
onToggle: this.toggleButtonBlockType,
|
|
756
737
|
blockTypes: this.getFontListConfigForPanelType("blockTypes")
|
|
757
|
-
}), showLinkMenu && /*#__PURE__*/
|
|
738
|
+
}), showLinkMenu && /*#__PURE__*/React.createElement(BlockTypeLinkControls$1, {
|
|
758
739
|
editorState: editorState,
|
|
759
740
|
onToggle: this.toggleLink
|
|
760
|
-
}), tags && tags.length > 0 && /*#__PURE__*/
|
|
741
|
+
}), tags && tags.length > 0 && /*#__PURE__*/React.createElement(TagControls$1, {
|
|
761
742
|
editorState: editorState,
|
|
762
743
|
tags: tags,
|
|
763
744
|
onInsertTag: this.insertText
|
|
764
|
-
})), /*#__PURE__*/
|
|
745
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
765
746
|
className: "editor-wrapper"
|
|
766
|
-
}, /*#__PURE__*/
|
|
747
|
+
}, /*#__PURE__*/React.createElement(draftJs.Editor, {
|
|
767
748
|
ref: this.editor,
|
|
768
749
|
editorState: editorState,
|
|
769
750
|
handleKeyCommand: this.handleKeyCommand,
|
|
@@ -777,25 +758,25 @@ var RichTextEditor = /*#__PURE__*/function (_Component) {
|
|
|
777
758
|
}(React.Component);
|
|
778
759
|
RichTextEditor.decorator = decorator;
|
|
779
760
|
var styleShape = function styleShape(configList) {
|
|
780
|
-
return
|
|
781
|
-
type:
|
|
782
|
-
label:
|
|
783
|
-
style:
|
|
784
|
-
tooltip:
|
|
785
|
-
hotKey:
|
|
761
|
+
return PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOf([].concat(Object.values(configList)))), PropTypes.arrayOf(PropTypes.shape({
|
|
762
|
+
type: PropTypes.oneOf([].concat(Object.values(configList))),
|
|
763
|
+
label: PropTypes.string,
|
|
764
|
+
style: PropTypes.string,
|
|
765
|
+
tooltip: PropTypes.string,
|
|
766
|
+
hotKey: PropTypes.string
|
|
786
767
|
}))]);
|
|
787
768
|
};
|
|
788
769
|
RichTextEditor.propTypes = {
|
|
789
|
-
editorState:
|
|
790
|
-
onChange:
|
|
791
|
-
maxTabDepth:
|
|
792
|
-
showFontMenu:
|
|
793
|
-
showInlineStyleMenu:
|
|
794
|
-
showTextFormatMenu:
|
|
795
|
-
showLinkMenu:
|
|
796
|
-
label:
|
|
797
|
-
tags: /*#__PURE__*/
|
|
798
|
-
controlConfigSet: /*#__PURE__*/
|
|
770
|
+
editorState: PropTypes.object.isRequired,
|
|
771
|
+
onChange: PropTypes.func.isRequired,
|
|
772
|
+
maxTabDepth: PropTypes.number,
|
|
773
|
+
showFontMenu: PropTypes.bool,
|
|
774
|
+
showInlineStyleMenu: PropTypes.bool,
|
|
775
|
+
showTextFormatMenu: PropTypes.bool,
|
|
776
|
+
showLinkMenu: PropTypes.bool,
|
|
777
|
+
label: PropTypes.string,
|
|
778
|
+
tags: /*#__PURE__*/PropTypes.arrayOf(PropTypes.object),
|
|
779
|
+
controlConfigSet: /*#__PURE__*/PropTypes.shape({
|
|
799
780
|
fontList: /*#__PURE__*/styleShape(EditorConfigTypes.FONT_LIST),
|
|
800
781
|
blockTypes: /*#__PURE__*/styleShape(EditorConfigTypes.BLOCK_TYPES),
|
|
801
782
|
inlineStyles: /*#__PURE__*/styleShape(EditorConfigTypes.INLINE_STYLES)
|
|
@@ -826,7 +807,7 @@ var markdownToEditorState = function markdownToEditorState(markdown) {
|
|
|
826
807
|
var contentState = draftJs.convertFromRaw(rawState);
|
|
827
808
|
return draftJs.EditorState.createWithContent(contentState, decorator);
|
|
828
809
|
};
|
|
829
|
-
var converter = /*#__PURE__*/new
|
|
810
|
+
var converter = /*#__PURE__*/new showdown.Converter({
|
|
830
811
|
underline: true
|
|
831
812
|
});
|
|
832
813
|
var markdownToHtml = function markdownToHtml(markdown) {
|
|
@@ -859,7 +840,7 @@ var RichTextEditorForLanguage = function RichTextEditorForLanguage(_ref) {
|
|
|
859
840
|
onChange(newValues);
|
|
860
841
|
};
|
|
861
842
|
var feedbackText = feedback == null ? void 0 : feedback(langKey);
|
|
862
|
-
return /*#__PURE__*/
|
|
843
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(RichTextEditor, {
|
|
863
844
|
label: required ? label + "*" : label,
|
|
864
845
|
editorState: editorState,
|
|
865
846
|
onChange: function onChange(changedState) {
|
|
@@ -867,7 +848,7 @@ var RichTextEditorForLanguage = function RichTextEditorForLanguage(_ref) {
|
|
|
867
848
|
},
|
|
868
849
|
controlConfigSet: MinifiedConfigTypes,
|
|
869
850
|
tags: tags
|
|
870
|
-
}), variant && feedbackText && feedbackText.length > 0 && (
|
|
851
|
+
}), variant && feedbackText && feedbackText.length > 0 && (/*#__PURE__*/React.createElement(form.FeedbackText, {
|
|
871
852
|
variant: variant(langKey)
|
|
872
853
|
}, feedbackText)));
|
|
873
854
|
};
|
|
@@ -876,7 +857,7 @@ var ExpandableMultiLanguageRichTextEditor = function ExpandableMultiLanguageRich
|
|
|
876
857
|
title = _ref2.title,
|
|
877
858
|
languages = _ref2.languages,
|
|
878
859
|
rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
879
|
-
return /*#__PURE__*/
|
|
860
|
+
return /*#__PURE__*/React.createElement(expand.ExpandablePanel, {
|
|
880
861
|
title: title,
|
|
881
862
|
defaultOpen: true,
|
|
882
863
|
contentStyle: {
|
|
@@ -884,13 +865,13 @@ var ExpandableMultiLanguageRichTextEditor = function ExpandableMultiLanguageRich
|
|
|
884
865
|
marginTop: "16px",
|
|
885
866
|
marginBottom: "16px"
|
|
886
867
|
}
|
|
887
|
-
}, /*#__PURE__*/
|
|
868
|
+
}, /*#__PURE__*/React.createElement(common.Stack, {
|
|
888
869
|
space: "medium"
|
|
889
870
|
}, languages.map(function (lang) {
|
|
890
|
-
return /*#__PURE__*/
|
|
871
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
891
872
|
key: name + lang.value,
|
|
892
873
|
"data-testid": "multi-lang-rich-text-" + name + "-" + lang.value
|
|
893
|
-
}, /*#__PURE__*/
|
|
874
|
+
}, /*#__PURE__*/React.createElement(RichTextEditorForLanguage, _extends({
|
|
894
875
|
language: lang
|
|
895
876
|
}, rest)));
|
|
896
877
|
})));
|
|
@@ -899,7 +880,7 @@ var ExpandableMultiLanguageRichTextEditor = function ExpandableMultiLanguageRich
|
|
|
899
880
|
var entityToHtml = {
|
|
900
881
|
entityToHTML: function entityToHTML(entity, originalText) {
|
|
901
882
|
if (entity.type === "LINK") {
|
|
902
|
-
return /*#__PURE__*/
|
|
883
|
+
return /*#__PURE__*/React.createElement(HtmlLink, {
|
|
903
884
|
url: entity.data.url
|
|
904
885
|
}, originalText);
|
|
905
886
|
}
|