@kids-reporter/draft-editor 1.0.16 → 1.0.18

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 (41) hide show
  1. package/lib/block-renderer-fn.js +1 -1
  2. package/lib/block-renderers/blockquote.js +21 -18
  3. package/lib/block-renderers/embedded-code.js +31 -25
  4. package/lib/block-renderers/image-link.js +78 -73
  5. package/lib/block-renderers/image.js +23 -21
  6. package/lib/block-renderers/info-box.js +22 -19
  7. package/lib/block-renderers/slideshow.js +22 -19
  8. package/lib/block-renderers/styled.js +12 -8
  9. package/lib/buttons/anchor.js +18 -14
  10. package/lib/buttons/annotation.js +19 -15
  11. package/lib/buttons/bg-color.js +31 -23
  12. package/lib/buttons/blockquote.js +68 -62
  13. package/lib/buttons/control-buttons.js +31 -25
  14. package/lib/buttons/divider.js +29 -21
  15. package/lib/buttons/embedded-code.js +84 -76
  16. package/lib/buttons/enlarge.js +7 -5
  17. package/lib/buttons/font-color.js +21 -16
  18. package/lib/buttons/form/select.js +14 -10
  19. package/lib/buttons/image-link.js +26 -22
  20. package/lib/buttons/image.js +18 -12
  21. package/lib/buttons/index.js +6 -6
  22. package/lib/buttons/info-box.js +79 -73
  23. package/lib/buttons/link.js +17 -15
  24. package/lib/buttons/news-reading.js +65 -56
  25. package/lib/buttons/selector/align-selector.js +20 -16
  26. package/lib/buttons/selector/image-selector.js +119 -88
  27. package/lib/buttons/selector/pagination.js +45 -33
  28. package/lib/buttons/selector/search-box.js +19 -18
  29. package/lib/buttons/slideshow.js +18 -12
  30. package/lib/buttons/toc-anchor.js +9 -5
  31. package/lib/entity-decorators/anchor.js +46 -33
  32. package/lib/entity-decorators/annotation.js +53 -52
  33. package/lib/entity-decorators/link.js +38 -36
  34. package/lib/entity-decorators/toc-anchor.js +41 -35
  35. package/lib/entity-decorators/wrapper.js +9 -6
  36. package/lib/index.js +7 -6
  37. package/lib/local-types/kids-reporter__draft-renderer.d.js +1 -0
  38. package/lib/rich-text-editor.js +110 -84
  39. package/lib/styled.js +14 -3
  40. package/package.json +12 -10
  41. package/lib/buttons/form/array-field.js +0 -30
@@ -4,13 +4,13 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.atomicBlockRenderer = atomicBlockRenderer;
7
+ var _draftRenderer = require("@kids-reporter/draft-renderer");
7
8
  var _blockquote = require("./block-renderers/blockquote");
8
9
  var _embeddedCode = require("./block-renderers/embedded-code");
9
10
  var _image = require("./block-renderers/image");
10
11
  var _imageLink = require("./block-renderers/image-link");
11
12
  var _infoBox = require("./block-renderers/info-box");
12
13
  var _slideshow = require("./block-renderers/slideshow");
13
- var _draftRenderer = require("@kids-reporter/draft-renderer");
14
14
  const {
15
15
  Divider,
16
16
  NewsReading
@@ -4,11 +4,12 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.EditableBlockquote = EditableBlockquote;
7
+ var _draftRenderer = require("@kids-reporter/draft-renderer");
7
8
  var _react = _interopRequireWildcard(require("react"));
8
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
9
10
  var _blockquote = require("../buttons/blockquote");
10
11
  var _styled = require("./styled");
11
- var _draftRenderer = require("@kids-reporter/draft-renderer");
12
+ var _jsxRuntime = require("react/jsx-runtime");
12
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
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); }
14
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 && Object.prototype.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; }
@@ -45,21 +46,23 @@ function EditableBlockquote(props) {
45
46
  entityData: inputValue
46
47
  });
47
48
  };
48
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_blockquote.BlockquoteInput, {
49
- isOpen: isInputOpen,
50
- onCancel: () => {
51
- setIsInputOpen(false);
52
- onEditFinish();
53
- },
54
- onConfirm: onInputChange,
55
- inputValue: data
56
- }), /*#__PURE__*/_react.default.createElement(EditableBlock, {
57
- component: /*#__PURE__*/_react.default.createElement(StyledBlockquote, {
58
- data: data
59
- }),
60
- onClick: () => {
61
- onEditStart();
62
- setIsInputOpen(true);
63
- }
64
- }));
49
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
50
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockquote.BlockquoteInput, {
51
+ isOpen: isInputOpen,
52
+ onCancel: () => {
53
+ setIsInputOpen(false);
54
+ onEditFinish();
55
+ },
56
+ onConfirm: onInputChange,
57
+ inputValue: data
58
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableBlock, {
59
+ component: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledBlockquote, {
60
+ data: data
61
+ }),
62
+ onClick: () => {
63
+ onEditStart();
64
+ setIsInputOpen(true);
65
+ }
66
+ })]
67
+ });
65
68
  }
@@ -4,11 +4,12 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.EditableEmbeddedCode = EditableEmbeddedCode;
7
+ var _fields = require("@keystone-ui/fields");
7
8
  var _react = _interopRequireWildcard(require("react"));
8
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
9
10
  var _embeddedCode = require("../buttons/embedded-code");
10
11
  var _styled = require("./styled");
11
- var _fields = require("@keystone-ui/fields");
12
+ var _jsxRuntime = require("react/jsx-runtime");
12
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
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); }
14
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 && Object.prototype.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; }
@@ -16,13 +17,16 @@ function EmbeddedCode({
16
17
  className,
17
18
  embeddedCode
18
19
  }) {
19
- return /*#__PURE__*/_react.default.createElement("div", {
20
- className: className
21
- }, /*#__PURE__*/_react.default.createElement("span", null, "Embedded Code:"), /*#__PURE__*/_react.default.createElement(_fields.TextArea, {
22
- disabled: true,
23
- type: "text",
24
- value: embeddedCode
25
- }));
20
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
21
+ className: className,
22
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
23
+ children: "Embedded Code:"
24
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_fields.TextArea, {
25
+ disabled: true,
26
+ type: "text",
27
+ value: embeddedCode
28
+ })]
29
+ });
26
30
  }
27
31
  const StyledEmbeddedCode = (0, _styledComponents.default)(EmbeddedCode)`
28
32
  max-width: 700px;
@@ -58,21 +62,23 @@ function EditableEmbeddedCode(props) {
58
62
  entityData: inputValue
59
63
  });
60
64
  };
61
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_embeddedCode.EmbeddedCodeInput, {
62
- isOpen: isInputOpen,
63
- onCancel: () => {
64
- setIsInputOpen(false);
65
- onEditFinish();
66
- },
67
- onConfirm: onInputChange,
68
- inputValue: data
69
- }), /*#__PURE__*/_react.default.createElement(EditableBlock, {
70
- component: /*#__PURE__*/_react.default.createElement(StyledEmbeddedCode, {
71
- embeddedCode: data === null || data === void 0 ? void 0 : data.embeddedCode
72
- }),
73
- onClick: () => {
74
- onEditStart();
75
- setIsInputOpen(true);
76
- }
77
- }));
65
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
66
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_embeddedCode.EmbeddedCodeInput, {
67
+ isOpen: isInputOpen,
68
+ onCancel: () => {
69
+ setIsInputOpen(false);
70
+ onEditFinish();
71
+ },
72
+ onConfirm: onInputChange,
73
+ inputValue: data
74
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableBlock, {
75
+ component: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledEmbeddedCode, {
76
+ embeddedCode: data?.embeddedCode
77
+ }),
78
+ onClick: () => {
79
+ onEditStart();
80
+ setIsInputOpen(true);
81
+ }
82
+ })]
83
+ });
78
84
  }
@@ -4,21 +4,20 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.ImageLinkEditor = exports.EditableImageLink = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _styledComponents = _interopRequireDefault(require("styled-components"));
9
- var _modals = require("@keystone-ui/modals");
10
7
  var _fields = require("@keystone-ui/fields");
11
- var _draftJs = require("draft-js");
8
+ var _modals = require("@keystone-ui/modals");
12
9
  var _draftRenderer = require("@kids-reporter/draft-renderer");
13
- var _imageSelector = require("../buttons/selector/image-selector");
10
+ var _draftJs = require("draft-js");
11
+ var _react = require("react");
12
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
13
+ var _btNames = _interopRequireDefault(require("../buttons/bt-names"));
14
14
  var _alignSelector = require("../buttons/selector/align-selector");
15
- var _styled = require("./styled");
16
- var _richTextEditor = require("../rich-text-editor");
15
+ var _imageSelector = require("../buttons/selector/image-selector");
17
16
  var _link = require("../entity-decorators/link");
18
- var _btNames = _interopRequireDefault(require("../buttons/bt-names"));
17
+ var _richTextEditor = require("../rich-text-editor");
18
+ var _styled = require("./styled");
19
+ var _jsxRuntime = require("react/jsx-runtime");
19
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
20
- 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); }
21
- 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 && Object.prototype.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; }
22
21
  const disabledButtons = [_btNames.default.bold, _btNames.default.italic, _btNames.default.underline, _btNames.default.fontColor, _btNames.default.backgroundColor, _btNames.default.ol, _btNames.default.ul, _btNames.default.divider, _btNames.default.h2, _btNames.default.h3, _btNames.default.h4, _btNames.default.h5, _btNames.default.code, _btNames.default.codeBlock, _btNames.default.blockquote, _btNames.default.infoBox, _btNames.default.slideshow, _btNames.default.newsReading, _btNames.default.tocAnchor, _btNames.default.anchor, _btNames.default.embed, _btNames.default.annotation, _btNames.default.image, _btNames.default.imageLink];
23
22
  const {
24
23
  ImageLinkInArticleBody
@@ -54,50 +53,55 @@ const ImageLinkEditor = props => {
54
53
  setAlign(align);
55
54
  };
56
55
  const onAlignSelectOpen = () => {
57
- var _contentWrapperRef$cu;
58
- const scrollWrapper = (_contentWrapperRef$cu = contentWrapperRef.current) === null || _contentWrapperRef$cu === void 0 ? void 0 : _contentWrapperRef$cu.parentElement;
56
+ const scrollWrapper = contentWrapperRef.current?.parentElement;
59
57
  if (scrollWrapper) {
60
- scrollWrapper.scrollTop = scrollWrapper === null || scrollWrapper === void 0 ? void 0 : scrollWrapper.scrollHeight;
58
+ scrollWrapper.scrollTop = scrollWrapper?.scrollHeight;
61
59
  }
62
60
  };
63
- return /*#__PURE__*/_react.default.createElement(_modals.DrawerController, {
64
- isOpen: isOpen
65
- }, /*#__PURE__*/_react.default.createElement(_modals.Drawer, {
66
- title: "Image Link",
67
- actions: {
68
- cancel: {
69
- label: 'Cancel',
70
- action: () => onCancel()
61
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_modals.DrawerController, {
62
+ isOpen: isOpen,
63
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_modals.Drawer, {
64
+ title: "Image Link",
65
+ actions: {
66
+ cancel: {
67
+ label: 'Cancel',
68
+ action: () => onCancel()
69
+ },
70
+ confirm: {
71
+ label: 'Confirm',
72
+ action: () => onConfirm({
73
+ url: url,
74
+ alignment: align,
75
+ rawContentState: (0, _draftJs.convertToRaw)(description.value.getCurrentContent())
76
+ })
77
+ }
71
78
  },
72
- confirm: {
73
- label: 'Confirm',
74
- action: () => onConfirm({
75
- url: url,
76
- alignment: align,
77
- rawContentState: (0, _draftJs.convertToRaw)(description.value.getCurrentContent())
78
- })
79
- }
80
- }
81
- }, /*#__PURE__*/_react.default.createElement(Label, null, "\u9023\u7D50"), /*#__PURE__*/_react.default.createElement(_fields.TextInput, {
82
- placeholder: "\u5716\u7247\u9023\u7D50",
83
- type: "text",
84
- value: url,
85
- onChange: e => setURL(e.target.value)
86
- }), /*#__PURE__*/_react.default.createElement(_alignSelector.AlignSelector, {
87
- align: align,
88
- options: _imageSelector.ImageAlignOptions,
89
- onChange: onAlignSelectChange,
90
- onOpen: onAlignSelectOpen
91
- }), /*#__PURE__*/_react.default.createElement(Label, null, "\u5716\u8AAA"), /*#__PURE__*/_react.default.createElement(_richTextEditor.RichTextEditor, {
92
- decorators: [_link.editableLinkDecorator],
93
- disabledButtons: disabledButtons,
94
- editorState: description.value,
95
- onChange: editorState => {
96
- setDescription({
97
- value: editorState
98
- });
99
- }
100
- })));
79
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Label, {
80
+ children: "\u9023\u7D50"
81
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_fields.TextInput, {
82
+ placeholder: "\u5716\u7247\u9023\u7D50",
83
+ type: "text",
84
+ value: url,
85
+ onChange: e => setURL(e.target.value)
86
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_alignSelector.AlignSelector, {
87
+ align: align,
88
+ options: _imageSelector.ImageAlignOptions,
89
+ onChange: onAlignSelectChange,
90
+ onOpen: onAlignSelectOpen
91
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Label, {
92
+ children: "\u5716\u8AAA"
93
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_richTextEditor.RichTextEditor, {
94
+ decorators: [_link.editableLinkDecorator],
95
+ disabledButtons: disabledButtons,
96
+ editorState: description.value,
97
+ onChange: editorState => {
98
+ setDescription({
99
+ value: editorState
100
+ });
101
+ }
102
+ })]
103
+ })
104
+ });
101
105
  };
102
106
  exports.ImageLinkEditor = ImageLinkEditor;
103
107
  const EditableImageLink = props => {
@@ -118,8 +122,7 @@ const EditableImageLink = props => {
118
122
  url,
119
123
  alignment,
120
124
  rawContentState
121
- } = data; // eslint-disable-line
122
-
125
+ } = data;
123
126
  const onChange = inputValue => {
124
127
  setIsEditorOpen(false);
125
128
  onEditFinish({
@@ -127,26 +130,28 @@ const EditableImageLink = props => {
127
130
  entityData: inputValue
128
131
  });
129
132
  };
130
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isEditorOpen && /*#__PURE__*/_react.default.createElement(ImageLinkEditor, {
131
- isOpen: isEditorOpen,
132
- inputValue: {
133
- url: url,
134
- alignment: alignment,
135
- rawContentState: rawContentState
136
- },
137
- onConfirm: onChange,
138
- onCancel: () => {
139
- setIsEditorOpen(false);
140
- onEditFinish();
141
- }
142
- }), /*#__PURE__*/_react.default.createElement(EditableBlock, {
143
- component: /*#__PURE__*/_react.default.createElement(StyledImage, {
144
- data: data
145
- }),
146
- onClick: () => {
147
- onEditStart();
148
- setIsEditorOpen(true);
149
- }
150
- }));
133
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
134
+ children: [isEditorOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(ImageLinkEditor, {
135
+ isOpen: isEditorOpen,
136
+ inputValue: {
137
+ url: url,
138
+ alignment: alignment,
139
+ rawContentState: rawContentState
140
+ },
141
+ onConfirm: onChange,
142
+ onCancel: () => {
143
+ setIsEditorOpen(false);
144
+ onEditFinish();
145
+ }
146
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableBlock, {
147
+ component: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledImage, {
148
+ data: data
149
+ }),
150
+ onClick: () => {
151
+ onEditStart();
152
+ setIsEditorOpen(true);
153
+ }
154
+ })]
155
+ });
151
156
  };
152
157
  exports.EditableImageLink = EditableImageLink;
@@ -4,14 +4,13 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.EditableImage = EditableImage;
7
- var _react = _interopRequireWildcard(require("react"));
7
+ var _draftRenderer = require("@kids-reporter/draft-renderer");
8
+ var _react = require("react");
8
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
9
10
  var _imageSelector = require("../buttons/selector/image-selector");
10
11
  var _styled = require("./styled");
11
- var _draftRenderer = require("@kids-reporter/draft-renderer");
12
+ var _jsxRuntime = require("react/jsx-runtime");
12
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
- 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); }
14
- 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 && Object.prototype.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; }
15
14
  const {
16
15
  ImageInArticleBody
17
16
  } = _draftRenderer.blockRenderers;
@@ -22,6 +21,7 @@ const EditableBlock = (0, _styledComponents.default)(_styled.EditableBlock)`
22
21
  background-color: #f0f0f0;
23
22
  opacity: 0.3;
24
23
  }
24
+ }
25
25
  `;
26
26
  function EditableImage(props) {
27
27
  const [isSelectorOpen, setIsSelectorOpen] = (0, _react.useState)(false);
@@ -45,11 +45,11 @@ function EditableImage(props) {
45
45
  const onChange = (selectedImages, alignment) => {
46
46
  // close `ImageSelector`
47
47
  setIsSelectorOpen(false);
48
- if ((selectedImages === null || selectedImages === void 0 ? void 0 : selectedImages.length) === 0) {
48
+ if (selectedImages?.length === 0) {
49
49
  onEditFinish();
50
50
  return;
51
51
  }
52
- const selectedImage = selectedImages === null || selectedImages === void 0 ? void 0 : selectedImages[0];
52
+ const selectedImage = selectedImages?.[0];
53
53
  onEditFinish({
54
54
  entityKey,
55
55
  entityData: Object.assign({
@@ -57,19 +57,21 @@ function EditableImage(props) {
57
57
  }, selectedImage)
58
58
  });
59
59
  };
60
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isSelectorOpen && /*#__PURE__*/_react.default.createElement(_imageSelector.ImageSelector, {
61
- onChange: onChange,
62
- enableCaption: true,
63
- enableAlignment: true,
64
- alignment: data.alignment,
65
- selected: [imageWithMeta]
66
- }), /*#__PURE__*/_react.default.createElement(EditableBlock, {
67
- component: /*#__PURE__*/_react.default.createElement(StyledImage, {
68
- data: data
69
- }),
70
- onClick: () => {
71
- onEditStart();
72
- setIsSelectorOpen(true);
73
- }
74
- }));
60
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
61
+ children: [isSelectorOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_imageSelector.ImageSelector, {
62
+ onChange: onChange,
63
+ enableCaption: true,
64
+ enableAlignment: true,
65
+ alignment: data.alignment,
66
+ selected: [imageWithMeta]
67
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableBlock, {
68
+ component: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledImage, {
69
+ data: data
70
+ }),
71
+ onClick: () => {
72
+ onEditStart();
73
+ setIsSelectorOpen(true);
74
+ }
75
+ })]
76
+ });
75
77
  }
@@ -4,11 +4,12 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.EditableInfoBox = EditableInfoBox;
7
+ var _draftRenderer = require("@kids-reporter/draft-renderer");
7
8
  var _react = _interopRequireWildcard(require("react"));
8
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
9
- var _styled = require("./styled");
10
10
  var _infoBox = require("../buttons/info-box");
11
- var _draftRenderer = require("@kids-reporter/draft-renderer");
11
+ var _styled = require("./styled");
12
+ var _jsxRuntime = require("react/jsx-runtime");
12
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
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); }
14
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 && Object.prototype.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; }
@@ -45,21 +46,23 @@ function EditableInfoBox(props) {
45
46
  entityData: inputValue
46
47
  });
47
48
  };
48
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_infoBox.InfoBoxInput, {
49
- isOpen: isInputOpen,
50
- onCancel: () => {
51
- setIsInputOpen(false);
52
- onEditFinish();
53
- },
54
- onConfirm: onInputChange,
55
- inputValue: data
56
- }), /*#__PURE__*/_react.default.createElement(EditableBlock, {
57
- component: /*#__PURE__*/_react.default.createElement(StyledInfoBox, {
58
- data: data
59
- }),
60
- onClick: () => {
61
- onEditStart();
62
- setIsInputOpen(true);
63
- }
64
- }));
49
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
50
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_infoBox.InfoBoxInput, {
51
+ isOpen: isInputOpen,
52
+ onCancel: () => {
53
+ setIsInputOpen(false);
54
+ onEditFinish();
55
+ },
56
+ onConfirm: onInputChange,
57
+ inputValue: data
58
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableBlock, {
59
+ component: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledInfoBox, {
60
+ data: data
61
+ }),
62
+ onClick: () => {
63
+ onEditStart();
64
+ setIsInputOpen(true);
65
+ }
66
+ })]
67
+ });
65
68
  }
@@ -4,11 +4,12 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.EditableSlideshow = EditableSlideshow;
7
+ var _draftRenderer = require("@kids-reporter/draft-renderer");
7
8
  var _react = _interopRequireWildcard(require("react"));
8
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
9
10
  var _imageSelector = require("../buttons/selector/image-selector");
10
11
  var _styled = require("./styled");
11
- var _draftRenderer = require("@kids-reporter/draft-renderer");
12
+ var _jsxRuntime = require("react/jsx-runtime");
12
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
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); }
14
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 && Object.prototype.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; }
@@ -22,6 +23,7 @@ const EditableBlock = (0, _styledComponents.default)(_styled.EditableBlock)`
22
23
  background-color: #f0f0f0;
23
24
  opacity: 0.3;
24
25
  }
26
+ }
25
27
  `;
26
28
  function EditableSlideshow(props) {
27
29
  const [isSelectorOpen, setIsSelectorOpen] = (0, _react.useState)(false);
@@ -40,7 +42,7 @@ function EditableSlideshow(props) {
40
42
  const onChange = (selectedImages, alignment) => {
41
43
  // close `ImageSelector`
42
44
  setIsSelectorOpen(false);
43
- if ((selectedImages === null || selectedImages === void 0 ? void 0 : selectedImages.length) === 0) {
45
+ if (selectedImages?.length === 0) {
44
46
  onEditFinish();
45
47
  return;
46
48
  }
@@ -52,21 +54,22 @@ function EditableSlideshow(props) {
52
54
  }
53
55
  });
54
56
  };
55
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isSelectorOpen && /*#__PURE__*/_react.default.createElement(_imageSelector.ImageSelector, {
56
- onChange: onChange,
57
- enableCaption: true,
58
- enableUrl: false,
59
- enableAlignment: false,
60
- enableMultiSelect: true,
61
- alignment: data.alignment,
62
- selected: data.images
63
- }), /*#__PURE__*/_react.default.createElement(EditableBlock, {
64
- component: /*#__PURE__*/_react.default.createElement(StyledSlideshow, {
65
- data: data
66
- }),
67
- onClick: () => {
68
- onEditStart();
69
- setIsSelectorOpen(true);
70
- }
71
- }));
57
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
58
+ children: [isSelectorOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_imageSelector.ImageSelector, {
59
+ onChange: onChange,
60
+ enableCaption: true,
61
+ enableAlignment: false,
62
+ enableMultiSelect: true,
63
+ alignment: data.alignment,
64
+ selected: data.images
65
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(EditableBlock, {
66
+ component: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledSlideshow, {
67
+ data: data
68
+ }),
69
+ onClick: () => {
70
+ onEditStart();
71
+ setIsSelectorOpen(true);
72
+ }
73
+ })]
74
+ });
72
75
  }
@@ -4,8 +4,8 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.EditableBlock = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
7
  var _styledComponents = _interopRequireDefault(require("styled-components"));
8
+ var _jsxRuntime = require("react/jsx-runtime");
9
9
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
10
  const EditButton = _styledComponents.default.div`
11
11
  cursor: pointer;
@@ -26,12 +26,16 @@ const _EditableBlock = _styledComponents.default.div`
26
26
  }
27
27
  `;
28
28
  const EditableBlock = props => {
29
- return /*#__PURE__*/_react.default.createElement(_EditableBlock, {
30
- className: props.className
31
- }, props.component, /*#__PURE__*/_react.default.createElement(EditButton, {
32
- onClick: props.onClick
33
- }, /*#__PURE__*/_react.default.createElement("i", {
34
- className: "fa-solid fa-pen"
35
- }), /*#__PURE__*/_react.default.createElement("span", null, "Modify")));
29
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_EditableBlock, {
30
+ className: props.className,
31
+ children: [props.component, /*#__PURE__*/(0, _jsxRuntime.jsxs)(EditButton, {
32
+ onClick: props.onClick,
33
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
34
+ className: "fa-solid fa-pen"
35
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
36
+ children: "Modify"
37
+ })]
38
+ })]
39
+ });
36
40
  };
37
41
  exports.EditableBlock = EditableBlock;
@@ -4,12 +4,11 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.AnchorButton = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _draftJs = require("draft-js");
9
7
  var _draftRenderer = require("@kids-reporter/draft-renderer");
8
+ var _draftJs = require("draft-js");
9
+ var _react = require("react");
10
10
  var _anchor = require("../entity-decorators/anchor");
11
- 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); }
12
- 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 && Object.prototype.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; }
11
+ var _jsxRuntime = require("react/jsx-runtime");
13
12
  const AnchorButton = props => {
14
13
  const toggleEntity = _draftJs.RichUtils.toggleLink;
15
14
  const {
@@ -47,15 +46,20 @@ const AnchorButton = props => {
47
46
  setIsEditorOpen(false);
48
47
  props.onEditFinish();
49
48
  };
50
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isEditorOpen && /*#__PURE__*/_react.default.createElement(_anchor.AnchorIDEditor, {
51
- isOpen: isEditorOpen,
52
- anchorIDValue: '',
53
- onConfirm: confirmAnchor,
54
- onCancel: removeAnchor
55
- }), /*#__PURE__*/_react.default.createElement("div", {
56
- className: props.className,
57
- onMouseDown: isActive ? removeAnchor : promptForAnchor,
58
- title: "\u9328\u9EDE"
59
- }, /*#__PURE__*/_react.default.createElement("span", null, "\u9328")));
49
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
50
+ children: [isEditorOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_anchor.AnchorIDEditor, {
51
+ isOpen: isEditorOpen,
52
+ anchorIDValue: '',
53
+ onConfirm: confirmAnchor,
54
+ onCancel: removeAnchor
55
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
56
+ className: props.className,
57
+ onMouseDown: isActive ? removeAnchor : promptForAnchor,
58
+ title: "\u9328\u9EDE",
59
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
60
+ children: "\u9328"
61
+ })
62
+ })]
63
+ });
60
64
  };
61
65
  exports.AnchorButton = AnchorButton;