@kids-reporter/draft-editor 0.4.0 → 0.4.2

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.
@@ -4,25 +4,15 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.PostSelector = PostSelector;
7
-
8
7
  var _react = _interopRequireWildcard(require("react"));
9
-
10
8
  var _styledComponents = _interopRequireDefault(require("styled-components"));
11
-
12
9
  var _modals = require("@keystone-ui/modals");
13
-
14
10
  var _apollo = require("@keystone-6/core/admin-ui/apollo");
15
-
16
11
  var _searchBox = require("./search-box");
17
-
18
12
  var _pagination = require("./pagination");
19
-
20
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
21
-
22
14
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
-
24
15
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
25
-
26
16
  const postsQuery = (0, _apollo.gql)`
27
17
  query Posts($searchText: String!, $take: Int, $skip: Int) {
28
18
  postsCount(where: { name: { contains: $searchText } })
@@ -113,7 +103,6 @@ const ErrorWrapper = _styledComponents.default.div`
113
103
  margin: 0;
114
104
  }
115
105
  `;
116
-
117
106
  function PostGrids(props) {
118
107
  const {
119
108
  posts,
@@ -129,10 +118,8 @@ function PostGrids(props) {
129
118
  });
130
119
  }));
131
120
  }
132
-
133
121
  function PostGrid(props) {
134
- var _post$heroImage, _post$heroImage$resiz;
135
-
122
+ var _post$heroImage;
136
123
  const {
137
124
  post,
138
125
  onSelect,
@@ -144,32 +131,27 @@ function PostGrid(props) {
144
131
  }, /*#__PURE__*/_react.default.createElement(PostSelected, null, isSelected ? /*#__PURE__*/_react.default.createElement("i", {
145
132
  className: "fas fa-check-circle"
146
133
  }) : null), /*#__PURE__*/_react.default.createElement(Post, null, /*#__PURE__*/_react.default.createElement(PostImage, {
147
- src: (_post$heroImage = post.heroImage) === null || _post$heroImage === void 0 ? void 0 : (_post$heroImage$resiz = _post$heroImage.resized) === null || _post$heroImage$resiz === void 0 ? void 0 : _post$heroImage$resiz.original,
134
+ src: (_post$heroImage = post.heroImage) === null || _post$heroImage === void 0 || (_post$heroImage = _post$heroImage.resized) === null || _post$heroImage === void 0 ? void 0 : _post$heroImage.original,
148
135
  onError: e => {
149
- var _post$heroImage2, _post$heroImage2$imag;
150
-
151
- return e.currentTarget.src = (_post$heroImage2 = post.heroImage) === null || _post$heroImage2 === void 0 ? void 0 : (_post$heroImage2$imag = _post$heroImage2.imageFile) === null || _post$heroImage2$imag === void 0 ? void 0 : _post$heroImage2$imag.url;
136
+ var _post$heroImage2;
137
+ return e.currentTarget.src = (_post$heroImage2 = post.heroImage) === null || _post$heroImage2 === void 0 || (_post$heroImage2 = _post$heroImage2.imageFile) === null || _post$heroImage2 === void 0 ? void 0 : _post$heroImage2.url;
152
138
  }
153
139
  }), /*#__PURE__*/_react.default.createElement(PostTitle, null, post.name)));
154
140
  }
155
-
156
141
  function PostMetaGrids(props) {
157
142
  const {
158
143
  postMetas
159
144
  } = props;
160
145
  return /*#__PURE__*/_react.default.createElement(PostMetaGridsWrapper, null, postMetas.map(postMetas => {
161
146
  var _postMetas$post;
162
-
163
147
  return /*#__PURE__*/_react.default.createElement(PostMetaGrid, {
164
- key: postMetas === null || postMetas === void 0 ? void 0 : (_postMetas$post = postMetas.post) === null || _postMetas$post === void 0 ? void 0 : _postMetas$post.id,
148
+ key: postMetas === null || postMetas === void 0 || (_postMetas$post = postMetas.post) === null || _postMetas$post === void 0 ? void 0 : _postMetas$post.id,
165
149
  postMeta: postMetas
166
150
  });
167
151
  }));
168
152
  }
169
-
170
153
  function PostMetaGrid(props) {
171
- var _post$heroImage3, _post$heroImage3$resi;
172
-
154
+ var _post$heroImage3;
173
155
  const {
174
156
  postMeta
175
157
  } = props;
@@ -177,15 +159,13 @@ function PostMetaGrid(props) {
177
159
  post
178
160
  } = postMeta;
179
161
  return /*#__PURE__*/_react.default.createElement(PostMetaGridWrapper, null, /*#__PURE__*/_react.default.createElement(Post, null, /*#__PURE__*/_react.default.createElement(PostImage, {
180
- src: post === null || post === void 0 ? void 0 : (_post$heroImage3 = post.heroImage) === null || _post$heroImage3 === void 0 ? void 0 : (_post$heroImage3$resi = _post$heroImage3.resized) === null || _post$heroImage3$resi === void 0 ? void 0 : _post$heroImage3$resi.original,
162
+ src: post === null || post === void 0 || (_post$heroImage3 = post.heroImage) === null || _post$heroImage3 === void 0 || (_post$heroImage3 = _post$heroImage3.resized) === null || _post$heroImage3 === void 0 ? void 0 : _post$heroImage3.original,
181
163
  onError: e => {
182
- var _post$heroImage4, _post$heroImage4$imag;
183
-
184
- return e.currentTarget.src = post === null || post === void 0 ? void 0 : (_post$heroImage4 = post.heroImage) === null || _post$heroImage4 === void 0 ? void 0 : (_post$heroImage4$imag = _post$heroImage4.imageFile) === null || _post$heroImage4$imag === void 0 ? void 0 : _post$heroImage4$imag.url;
164
+ var _post$heroImage4;
165
+ return e.currentTarget.src = post === null || post === void 0 || (_post$heroImage4 = post.heroImage) === null || _post$heroImage4 === void 0 || (_post$heroImage4 = _post$heroImage4.imageFile) === null || _post$heroImage4 === void 0 ? void 0 : _post$heroImage4.url;
185
166
  }
186
167
  }), /*#__PURE__*/_react.default.createElement(PostTitle, null, post === null || post === void 0 ? void 0 : post.name)));
187
168
  }
188
-
189
169
  function PostSelector(props) {
190
170
  const [queryPosts, {
191
171
  loading,
@@ -198,7 +178,6 @@ function PostSelector(props) {
198
178
  fetchPolicy: 'no-cache'
199
179
  });
200
180
  const [currentPage, setCurrentPage] = (0, _react.useState)(0); // page starts with 1, 0 is used to detect initialization
201
-
202
181
  const [searchText, setSearchText] = (0, _react.useState)('');
203
182
  const [selected, setSelected] = (0, _react.useState)([]);
204
183
  const [showErrorHint, setShowErrorHint] = (0, _react.useState)(false);
@@ -208,51 +187,45 @@ function PostSelector(props) {
208
187
  enableMultiSelect = false,
209
188
  minSelectCount = 1
210
189
  } = props;
211
-
212
190
  const onSave = () => {
213
191
  if (enableMultiSelect && minSelectCount && selected.length < minSelectCount) {
214
192
  setShowErrorHint(true);
215
193
  return;
216
194
  }
217
-
218
195
  onChange(selected);
219
196
  };
220
-
221
197
  const onCancel = () => {
222
198
  onChange([]);
223
199
  };
224
-
225
200
  const onSearchBoxChange = async searchInput => {
226
201
  setSearchText(searchInput);
227
202
  setCurrentPage(1);
228
203
  };
229
-
230
204
  const onPostsGridSelect = postEntity => {
231
205
  setSelected(selected => {
232
206
  const filterdSelected = selected.filter(ele => {
233
207
  var _ele$post;
234
-
235
208
  return ((_ele$post = ele.post) === null || _ele$post === void 0 ? void 0 : _ele$post.id) !== postEntity.id;
236
- }); // deselect the post
209
+ });
237
210
 
211
+ // deselect the post
238
212
  if (filterdSelected.length !== selected.length) {
239
213
  return filterdSelected;
240
- } // add new selected one and check shrink the array if there is a limit
241
-
214
+ }
242
215
 
216
+ // add new selected one and check shrink the array if there is a limit
243
217
  if (enableMultiSelect) {
244
218
  return selected.concat([{
245
219
  post: postEntity
246
220
  }]);
247
- } // single select
248
-
221
+ }
249
222
 
223
+ // single select
250
224
  return [{
251
225
  post: postEntity
252
226
  }];
253
227
  });
254
228
  };
255
-
256
229
  const selectedPosts = selected.map(ele => {
257
230
  return ele.post;
258
231
  });
@@ -267,7 +240,6 @@ function PostSelector(props) {
267
240
  });
268
241
  }
269
242
  }, [currentPage, searchText]);
270
-
271
243
  let searchResult = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(PostGrids, {
272
244
  posts: posts,
273
245
  selected: selectedPosts,
@@ -280,15 +252,12 @@ function PostSelector(props) {
280
252
  setCurrentPage(pageIndex);
281
253
  }
282
254
  }));
283
-
284
255
  if (loading) {
285
256
  searchResult = /*#__PURE__*/_react.default.createElement("p", null, "searching...");
286
257
  }
287
-
288
258
  if (error) {
289
259
  searchResult = /*#__PURE__*/_react.default.createElement(ErrorWrapper, null, /*#__PURE__*/_react.default.createElement("h3", null, "Errors occurs in the `posts` query"), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("b", null, "Message:"), /*#__PURE__*/_react.default.createElement("div", null, error.message), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("b", null, "Stack:"), /*#__PURE__*/_react.default.createElement("div", null, error.stack), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("b", null, "Query:"), /*#__PURE__*/_react.default.createElement("pre", null, postsQuery.loc.source.body)));
290
260
  }
291
-
292
261
  return /*#__PURE__*/_react.default.createElement(_modals.DrawerController, {
293
262
  isOpen: true
294
263
  }, /*#__PURE__*/_react.default.createElement(_modals.Drawer, {
@@ -4,25 +4,16 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.SearchBox = SearchBox;
7
-
8
7
  var _react = _interopRequireWildcard(require("react"));
9
-
10
8
  var _styledComponents = _interopRequireDefault(require("styled-components"));
11
-
12
9
  var _button = require("@keystone-ui/button");
13
-
14
10
  var _fields = require("@keystone-ui/fields");
15
-
16
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
-
18
12
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
19
-
20
13
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
-
22
14
  const SearchBoxWrapper = _styledComponents.default.div`
23
15
  display: flex;
24
16
  `;
25
-
26
17
  function SearchBox(props) {
27
18
  const {
28
19
  onChange,
@@ -4,25 +4,15 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.VideoSelector = VideoSelector;
7
-
8
7
  var _react = _interopRequireWildcard(require("react"));
9
-
10
8
  var _styledComponents = _interopRequireDefault(require("styled-components"));
11
-
12
9
  var _modals = require("@keystone-ui/modals");
13
-
14
10
  var _apollo = require("@keystone-6/core/admin-ui/apollo");
15
-
16
11
  var _searchBox = require("./search-box");
17
-
18
12
  var _pagination = require("./pagination");
19
-
20
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
21
-
22
14
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
-
24
15
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
25
-
26
16
  const videosQuery = (0, _apollo.gql)`
27
17
  query Videos($searchText: String!, $take: Int, $skip: Int) {
28
18
  videosCount(where: { name: { contains: $searchText } })
@@ -101,7 +91,6 @@ const ErrorWrapper = _styledComponents.default.div`
101
91
  const VideoName = _styledComponents.default.p`
102
92
  text-align: center;
103
93
  `;
104
-
105
94
  function VideosGrids(props) {
106
95
  const {
107
96
  videos,
@@ -117,10 +106,8 @@ function VideosGrids(props) {
117
106
  });
118
107
  }));
119
108
  }
120
-
121
109
  function VideoGrid(props) {
122
110
  var _video$file;
123
-
124
111
  const {
125
112
  video,
126
113
  onSelect,
@@ -137,27 +124,23 @@ function VideoGrid(props) {
137
124
  }, /*#__PURE__*/_react.default.createElement("source", {
138
125
  src: video === null || video === void 0 ? void 0 : video.url
139
126
  }), /*#__PURE__*/_react.default.createElement("source", {
140
- src: video === null || video === void 0 ? void 0 : (_video$file = video.file) === null || _video$file === void 0 ? void 0 : _video$file.url
127
+ src: video === null || video === void 0 || (_video$file = video.file) === null || _video$file === void 0 ? void 0 : _video$file.url
141
128
  })));
142
129
  }
143
-
144
130
  function VideoMetaGrids(props) {
145
131
  const {
146
132
  videoMetas
147
133
  } = props;
148
134
  return /*#__PURE__*/_react.default.createElement(VideoMetaGridsWrapper, null, videoMetas.map(videoMeta => {
149
135
  var _videoMeta$video;
150
-
151
136
  return /*#__PURE__*/_react.default.createElement(VideoMetaGrid, {
152
- key: videoMeta === null || videoMeta === void 0 ? void 0 : (_videoMeta$video = videoMeta.video) === null || _videoMeta$video === void 0 ? void 0 : _videoMeta$video.id,
137
+ key: videoMeta === null || videoMeta === void 0 || (_videoMeta$video = videoMeta.video) === null || _videoMeta$video === void 0 ? void 0 : _videoMeta$video.id,
153
138
  videoMeta: videoMeta
154
139
  });
155
140
  }));
156
141
  }
157
-
158
142
  function VideoMetaGrid(props) {
159
143
  var _video$file2;
160
-
161
144
  const {
162
145
  videoMeta
163
146
  } = props;
@@ -171,10 +154,9 @@ function VideoMetaGrid(props) {
171
154
  }, /*#__PURE__*/_react.default.createElement("source", {
172
155
  src: video === null || video === void 0 ? void 0 : video.url
173
156
  }), /*#__PURE__*/_react.default.createElement("source", {
174
- src: video === null || video === void 0 ? void 0 : (_video$file2 = video.file) === null || _video$file2 === void 0 ? void 0 : _video$file2.url
157
+ src: video === null || video === void 0 || (_video$file2 = video.file) === null || _video$file2 === void 0 ? void 0 : _video$file2.url
175
158
  })), /*#__PURE__*/_react.default.createElement(VideoName, null, video === null || video === void 0 ? void 0 : video.name));
176
159
  }
177
-
178
160
  function VideoSelector(props) {
179
161
  const [queryVideos, {
180
162
  loading,
@@ -187,46 +169,40 @@ function VideoSelector(props) {
187
169
  fetchPolicy: 'no-cache'
188
170
  });
189
171
  const [currentPage, setCurrentPage] = (0, _react.useState)(0); // page starts with 1, 0 is used to detect initialization
190
-
191
172
  const [searchText, setSearchText] = (0, _react.useState)('');
192
173
  const [selected, setSelected] = (0, _react.useState)([]);
193
174
  const pageSize = 6;
194
175
  const {
195
176
  onChange
196
177
  } = props;
197
-
198
178
  const onSave = () => {
199
179
  onChange(selected);
200
180
  };
201
-
202
181
  const onCancel = () => {
203
182
  onChange([]);
204
183
  };
205
-
206
184
  const onSearchBoxChange = async searchInput => {
207
185
  setSearchText(searchInput);
208
186
  setCurrentPage(1);
209
187
  };
210
-
211
188
  const onVideosGridSelect = videoEntity => {
212
189
  setSelected(selected => {
213
190
  const filterdSelected = selected.filter(ele => {
214
191
  var _ele$video;
215
-
216
192
  return ((_ele$video = ele.video) === null || _ele$video === void 0 ? void 0 : _ele$video.id) !== videoEntity.id;
217
- }); // deselect the video
193
+ });
218
194
 
195
+ // deselect the video
219
196
  if (filterdSelected.length !== selected.length) {
220
197
  return filterdSelected;
221
- } // single select
222
-
198
+ }
223
199
 
200
+ // single select
224
201
  return [{
225
202
  video: videoEntity
226
203
  }];
227
204
  });
228
205
  };
229
-
230
206
  const selectedVideos = selected.map(ele => {
231
207
  return ele.video;
232
208
  });
@@ -241,7 +217,6 @@ function VideoSelector(props) {
241
217
  });
242
218
  }
243
219
  }, [currentPage, searchText]);
244
-
245
220
  let searchResult = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(VideosGrids, {
246
221
  videos: videos,
247
222
  selected: selectedVideos,
@@ -254,15 +229,12 @@ function VideoSelector(props) {
254
229
  setCurrentPage(pageIndex);
255
230
  }
256
231
  }));
257
-
258
232
  if (loading) {
259
233
  searchResult = /*#__PURE__*/_react.default.createElement("p", null, "searching...");
260
234
  }
261
-
262
235
  if (error) {
263
236
  searchResult = /*#__PURE__*/_react.default.createElement(ErrorWrapper, null, /*#__PURE__*/_react.default.createElement("h3", null, "Errors occurs in the `videos` query"), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("b", null, "Message:"), /*#__PURE__*/_react.default.createElement("div", null, error.message), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("b", null, "Stack:"), /*#__PURE__*/_react.default.createElement("div", null, error.stack), /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("b", null, "Query:"), /*#__PURE__*/_react.default.createElement("pre", null, videosQuery.loc.source.body)));
264
237
  }
265
-
266
238
  return /*#__PURE__*/_react.default.createElement(_modals.DrawerController, {
267
239
  isOpen: true
268
240
  }, /*#__PURE__*/_react.default.createElement(_modals.Drawer, {
@@ -4,50 +4,41 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.atomicBlockRenderer = atomicBlockRenderer;
7
-
8
7
  var _blockquote = require("./block-renderers/blockquote");
9
-
10
8
  var _draftRenderer = require("@kids-reporter/draft-renderer");
11
-
12
9
  const {
13
10
  EmbeddedCodeInArticleBody,
14
11
  ImageInArticleBody,
15
12
  InfoBoxInArticleBody,
16
13
  SlideshowInArticleBody
17
14
  } = _draftRenderer.blockRenderers;
18
-
19
15
  const AtomicBlock = props => {
20
16
  const entity = props.contentState.getEntity(props.block.getEntityAt(0));
21
17
  const entityType = entity.getType();
22
18
  const entityData = entity.getData();
23
-
24
19
  switch (entityType) {
25
20
  case 'BLOCKQUOTE':
26
21
  {
27
22
  return (0, _blockquote.EditableBlockquote)(props);
28
23
  }
29
-
30
24
  case 'IMAGE':
31
25
  {
32
26
  return ImageInArticleBody({
33
27
  data: entityData
34
28
  });
35
29
  }
36
-
37
30
  case 'SLIDESHOW':
38
31
  {
39
32
  return SlideshowInArticleBody({
40
33
  data: entityData
41
34
  });
42
35
  }
43
-
44
36
  case 'EMBEDDEDCODE':
45
37
  {
46
38
  return EmbeddedCodeInArticleBody({
47
39
  data: entityData
48
40
  });
49
41
  }
50
-
51
42
  case 'INFOBOX':
52
43
  {
53
44
  return InfoBoxInArticleBody({
@@ -55,10 +46,8 @@ const AtomicBlock = props => {
55
46
  });
56
47
  }
57
48
  }
58
-
59
49
  return null;
60
50
  };
61
-
62
51
  function atomicBlockRenderer(block) {
63
52
  if (block.getType() === 'atomic') {
64
53
  return {
@@ -67,6 +56,5 @@ function atomicBlockRenderer(block) {
67
56
  props: {}
68
57
  };
69
58
  }
70
-
71
59
  return null;
72
60
  }
@@ -4,21 +4,13 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.EditableBlockquote = EditableBlockquote;
7
-
8
7
  var _react = _interopRequireWildcard(require("react"));
9
-
10
8
  var _styledComponents = _interopRequireDefault(require("styled-components"));
11
-
12
9
  var _blockquote = require("../buttons/blockquote");
13
-
14
10
  var _draftRenderer = require("@kids-reporter/draft-renderer");
15
-
16
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
-
18
12
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
19
-
20
13
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
-
22
14
  const {
23
15
  BlockquoteInArticleBody
24
16
  } = _draftRenderer.blockRenderers;
@@ -46,7 +38,6 @@ const EditableBlock = _styledComponents.default.div`
46
38
  }
47
39
  }
48
40
  `;
49
-
50
41
  function EditableBlockquote(props) {
51
42
  const [isInputOpen, setIsInputOpen] = (0, _react.useState)(false);
52
43
  const {
@@ -61,7 +52,6 @@ function EditableBlockquote(props) {
61
52
  const entityKey = block.getEntityAt(0);
62
53
  const entity = contentState.getEntity(entityKey);
63
54
  const data = entity.getData();
64
-
65
55
  const onInputChange = inputValue => {
66
56
  // close `BlockquoteInput`
67
57
  setIsInputOpen(false);
@@ -70,7 +60,6 @@ function EditableBlockquote(props) {
70
60
  entityData: inputValue
71
61
  });
72
62
  };
73
-
74
63
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_blockquote.BlockquoteInput, {
75
64
  isOpen: isInputOpen,
76
65
  onCancel: () => {
@@ -84,8 +73,8 @@ function EditableBlockquote(props) {
84
73
  }), /*#__PURE__*/_react.default.createElement(EditButton, {
85
74
  onClick: () => {
86
75
  // call `onEditStart` prop as we are trying to update the blockquote entity
87
- onEditStart(); // open `BlockquoteInput`
88
-
76
+ onEditStart();
77
+ // open `BlockquoteInput`
89
78
  setIsInputOpen(true);
90
79
  }
91
80
  }, /*#__PURE__*/_react.default.createElement("i", {
@@ -4,23 +4,14 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.createAnnotationButton = createAnnotationButton;
7
-
8
7
  var _react = _interopRequireWildcard(require("react"));
9
-
10
8
  var _btNames = _interopRequireDefault(require("./bt-names"));
11
-
12
9
  var _draftJs = require("draft-js");
13
-
14
10
  var _modals = require("@keystone-ui/modals");
15
-
16
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
-
18
12
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
19
-
20
13
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
21
-
22
14
  const disabledButtons = [_btNames.default.h2, _btNames.default.h3, _btNames.default.code, _btNames.default.codeBlock, _btNames.default.blockquote, _btNames.default.annotation, _btNames.default.embed, _btNames.default.image, _btNames.default.infoBox, _btNames.default.slideshow];
23
-
24
15
  function createAnnotationButton({
25
16
  InnerEditor,
26
17
  decorator
@@ -36,16 +27,13 @@ function createAnnotationButton({
36
27
  const [inputValue, setInputValue] = (0, _react.useState)({
37
28
  editorStateOfInnerEditor: _draftJs.EditorState.createEmpty(decorator)
38
29
  });
39
-
40
30
  const promptForAnnotation = e => {
41
31
  e.preventDefault();
42
32
  const selection = editorStateOfOuterEditor.getSelection();
43
-
44
33
  if (!selection.isCollapsed()) {
45
34
  setToShowInput(true);
46
35
  }
47
36
  };
48
-
49
37
  const confirmAnnotation = () => {
50
38
  const contentState = editorStateOfOuterEditor.getCurrentContent();
51
39
  const rawContentState = (0, _draftJs.convertToRaw)(inputValue.editorStateOfInnerEditor.getCurrentContent());
@@ -53,31 +41,25 @@ function createAnnotationButton({
53
41
  rawContentState
54
42
  });
55
43
  const entityKey = contentStateWithEntity.getLastCreatedEntityKey();
56
-
57
44
  const newEditorState = _draftJs.EditorState.set(editorStateOfOuterEditor, {
58
45
  currentContent: contentStateWithEntity
59
46
  });
60
-
61
47
  onChange(toggleEntity(newEditorState, newEditorState.getSelection(), entityKey));
62
48
  setToShowInput(false);
63
49
  setInputValue({
64
50
  editorStateOfInnerEditor: _draftJs.EditorState.createEmpty(decorator)
65
51
  });
66
52
  };
67
-
68
53
  const removeAnnotation = () => {
69
54
  const selection = editorStateOfOuterEditor.getSelection();
70
-
71
55
  if (!selection.isCollapsed()) {
72
56
  onChange(toggleEntity(editorStateOfOuterEditor, selection, null));
73
57
  }
74
-
75
58
  setToShowInput(false);
76
59
  setInputValue({
77
60
  editorStateOfInnerEditor: _draftJs.EditorState.createEmpty(decorator)
78
61
  });
79
62
  };
80
-
81
63
  const input = /*#__PURE__*/_react.default.createElement(_modals.DrawerController, {
82
64
  isOpen: toShowInput
83
65
  }, /*#__PURE__*/_react.default.createElement(_modals.Drawer, {
@@ -101,7 +83,6 @@ function createAnnotationButton({
101
83
  });
102
84
  }
103
85
  })));
104
-
105
86
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, input, /*#__PURE__*/_react.default.createElement("div", {
106
87
  className: props.className,
107
88
  onMouseDown: isActive ? removeAnnotation : promptForAnnotation