@mirrormedia/lilith-draft-editor 1.1.0-alpha.3 → 1.1.0-alpha.31

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 (79) hide show
  1. package/lib/draft-js/buttons/annotation.js +22 -0
  2. package/lib/draft-js/buttons/audio.js +16 -3
  3. package/lib/draft-js/buttons/background-color.js +26 -0
  4. package/lib/draft-js/buttons/background-image.js +32 -13
  5. package/lib/draft-js/buttons/background-video.js +32 -13
  6. package/lib/draft-js/buttons/color-box.js +21 -5
  7. package/lib/draft-js/buttons/divider.js +12 -3
  8. package/lib/draft-js/buttons/embedded-code.js +16 -5
  9. package/lib/draft-js/buttons/enlarge.js +3 -0
  10. package/lib/draft-js/buttons/font-color.js +26 -0
  11. package/lib/draft-js/buttons/image.js +18 -7
  12. package/lib/draft-js/buttons/info-box.js +21 -5
  13. package/lib/draft-js/buttons/link.js +68 -22
  14. package/lib/draft-js/buttons/media.js +16 -3
  15. package/lib/draft-js/buttons/related-post.js +14 -3
  16. package/lib/draft-js/buttons/selector/align-selector.js +11 -2
  17. package/lib/draft-js/buttons/selector/audio-selector.js +33 -5
  18. package/lib/draft-js/buttons/selector/image-selector.js +64 -16
  19. package/lib/draft-js/buttons/selector/pagination.js +6 -2
  20. package/lib/draft-js/buttons/selector/post-selector.js +39 -6
  21. package/lib/draft-js/buttons/selector/search-box.js +9 -0
  22. package/lib/draft-js/buttons/selector/video-selector.js +33 -4
  23. package/lib/draft-js/buttons/side-index.js +31 -15
  24. package/lib/draft-js/buttons/slideshow.js +16 -7
  25. package/lib/draft-js/buttons/table.js +11 -5
  26. package/lib/draft-js/buttons/text-align.js +14 -0
  27. package/lib/draft-js/buttons/video.js +19 -5
  28. package/lib/draft-js/buttons/youtube.js +147 -0
  29. package/lib/draft-js/const.js +2 -0
  30. package/lib/draft-js/draft-converter/api-data-instance.js +14 -0
  31. package/lib/draft-js/draft-converter/atomic-block-processor.js +42 -12
  32. package/lib/draft-js/draft-converter/entities.js +3 -1
  33. package/lib/draft-js/draft-converter/index.js +29 -10
  34. package/lib/draft-js/draft-converter/inline-styles-processor.js +55 -22
  35. package/lib/draft-js/modifier.js +13 -5
  36. package/lib/draft-js/util.js +32 -0
  37. package/lib/index.js +4 -0
  38. package/lib/website/mirrormedia/block-renderer/background-image-block.js +14 -2
  39. package/lib/website/mirrormedia/block-renderer/background-video-block.js +14 -2
  40. package/lib/website/mirrormedia/block-renderer/color-box-block.js +14 -2
  41. package/lib/website/mirrormedia/block-renderer/embedded-code-block.js +12 -3
  42. package/lib/website/mirrormedia/block-renderer/image-block.js +108 -0
  43. package/lib/website/mirrormedia/block-renderer/info-box-block.js +14 -2
  44. package/lib/website/mirrormedia/block-renderer/side-index-block.js +13 -2
  45. package/lib/website/mirrormedia/block-renderer/slideshow-block.js +93 -7
  46. package/lib/website/mirrormedia/block-renderer/table-block.js +62 -28
  47. package/lib/website/mirrormedia/block-renderer-fn.js +48 -5
  48. package/lib/website/mirrormedia/draft-editor.js +138 -14
  49. package/lib/website/mirrormedia/entity-decorator.js +12 -1
  50. package/lib/website/mirrormedia/index.js +3 -0
  51. package/lib/website/mirrormedia/selector/align-selector.js +11 -2
  52. package/lib/website/mirrormedia/selector/audio-selector.js +34 -5
  53. package/lib/website/mirrormedia/selector/image-selector.js +75 -18
  54. package/lib/website/mirrormedia/selector/pagination.js +6 -2
  55. package/lib/website/mirrormedia/selector/post-selector.js +40 -6
  56. package/lib/website/mirrormedia/selector/search-box.js +9 -0
  57. package/lib/website/mirrormedia/selector/video-selector.js +36 -7
  58. package/lib/website/mirrormedia/shared-style/index.js +17 -0
  59. package/lib/website/mirrormedia/theme/index.js +28 -0
  60. package/lib/website/readr/block-renderer/background-image-block.js +66 -6
  61. package/lib/website/readr/block-renderer/background-video-block.js +76 -6
  62. package/lib/website/readr/block-renderer/color-box-block.js +14 -2
  63. package/lib/website/readr/block-renderer/image-block.js +106 -0
  64. package/lib/website/readr/block-renderer/info-box-block.js +14 -2
  65. package/lib/website/readr/block-renderer/side-index-block.js +13 -2
  66. package/lib/website/readr/block-renderer/table-block.js +62 -28
  67. package/lib/website/readr/block-renderer-fn.js +32 -3
  68. package/lib/website/readr/draft-editor.js +112 -12
  69. package/lib/website/readr/entity-decorator.js +4 -0
  70. package/lib/website/readr/index.js +3 -0
  71. package/lib/website/readr/selector/align-selector.js +11 -2
  72. package/lib/website/readr/selector/audio-selector.js +34 -17
  73. package/lib/website/readr/selector/image-selector.js +62 -16
  74. package/lib/website/readr/selector/pagination.js +6 -2
  75. package/lib/website/readr/selector/post-selector.js +40 -13
  76. package/lib/website/readr/selector/search-box.js +9 -0
  77. package/lib/website/readr/selector/video-selector.js +33 -4
  78. package/lib/website/readr/theme/index.js +39 -0
  79. package/package.json +8 -8
@@ -4,16 +4,25 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.SearchBox = SearchBox;
7
+
7
8
  var _react = _interopRequireWildcard(require("react"));
9
+
8
10
  var _styledComponents = _interopRequireDefault(require("styled-components"));
11
+
9
12
  var _button = require("@keystone-ui/button");
13
+
10
14
  var _fields = require("@keystone-ui/fields");
15
+
11
16
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
+
12
18
  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
+
13
20
  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
+
14
22
  const SearchBoxWrapper = _styledComponents.default.div`
15
23
  display: flex;
16
24
  `;
25
+
17
26
  function SearchBox(props) {
18
27
  const {
19
28
  onChange,
@@ -4,20 +4,31 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.VideoSelector = VideoSelector;
7
+
7
8
  var _react = _interopRequireWildcard(require("react"));
9
+
8
10
  var _styledComponents = _interopRequireDefault(require("styled-components"));
11
+
9
12
  var _modals = require("@keystone-ui/modals");
13
+
10
14
  var _apollo = require("@keystone-6/core/admin-ui/apollo");
15
+
11
16
  var _searchBox = require("./search-box");
17
+
12
18
  var _pagination = require("./pagination");
19
+
13
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
21
+
14
22
  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
+
15
24
  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
+
16
26
  const videosQuery = (0, _apollo.gql)`
17
27
  query Videos($searchText: String!, $take: Int, $skip: Int) {
18
28
  videosCount(where: { name: { contains: $searchText } })
19
29
  videos(
20
30
  where: { name: { contains: $searchText } }
31
+ orderBy: { id: desc }
21
32
  take: $take
22
33
  skip: $skip
23
34
  ) {
@@ -91,6 +102,7 @@ const ErrorWrapper = _styledComponents.default.div`
91
102
  const VideoName = _styledComponents.default.p`
92
103
  text-align: center;
93
104
  `;
105
+
94
106
  function VideosGrids(props) {
95
107
  const {
96
108
  videos,
@@ -106,8 +118,10 @@ function VideosGrids(props) {
106
118
  });
107
119
  }));
108
120
  }
121
+
109
122
  function VideoGrid(props) {
110
123
  var _video$file;
124
+
111
125
  const {
112
126
  video,
113
127
  onSelect,
@@ -127,20 +141,24 @@ function VideoGrid(props) {
127
141
  src: video === null || video === void 0 ? void 0 : (_video$file = video.file) === null || _video$file === void 0 ? void 0 : _video$file.url
128
142
  })));
129
143
  }
144
+
130
145
  function VideoMetaGrids(props) {
131
146
  const {
132
147
  videoMetas
133
148
  } = props;
134
149
  return /*#__PURE__*/_react.default.createElement(VideoMetaGridsWrapper, null, videoMetas.map(videoMeta => {
135
150
  var _videoMeta$video;
151
+
136
152
  return /*#__PURE__*/_react.default.createElement(VideoMetaGrid, {
137
153
  key: videoMeta === null || videoMeta === void 0 ? void 0 : (_videoMeta$video = videoMeta.video) === null || _videoMeta$video === void 0 ? void 0 : _videoMeta$video.id,
138
154
  videoMeta: videoMeta
139
155
  });
140
156
  }));
141
157
  }
158
+
142
159
  function VideoMetaGrid(props) {
143
160
  var _video$file2;
161
+
144
162
  const {
145
163
  videoMeta
146
164
  } = props;
@@ -157,6 +175,7 @@ function VideoMetaGrid(props) {
157
175
  src: video === null || video === void 0 ? void 0 : (_video$file2 = video.file) === null || _video$file2 === void 0 ? void 0 : _video$file2.url
158
176
  })), /*#__PURE__*/_react.default.createElement(VideoName, null, video === null || video === void 0 ? void 0 : video.name));
159
177
  }
178
+
160
179
  function VideoSelector(props) {
161
180
  const [queryVideos, {
162
181
  loading,
@@ -169,40 +188,46 @@ function VideoSelector(props) {
169
188
  fetchPolicy: 'no-cache'
170
189
  });
171
190
  const [currentPage, setCurrentPage] = (0, _react.useState)(0); // page starts with 1, 0 is used to detect initialization
191
+
172
192
  const [searchText, setSearchText] = (0, _react.useState)('');
173
193
  const [selected, setSelected] = (0, _react.useState)([]);
174
194
  const pageSize = 6;
175
195
  const {
176
196
  onChange
177
197
  } = props;
198
+
178
199
  const onSave = () => {
179
200
  onChange(selected);
180
201
  };
202
+
181
203
  const onCancel = () => {
182
204
  onChange([]);
183
205
  };
206
+
184
207
  const onSearchBoxChange = async searchInput => {
185
208
  setSearchText(searchInput);
186
209
  setCurrentPage(1);
187
210
  };
211
+
188
212
  const onVideosGridSelect = videoEntity => {
189
213
  setSelected(selected => {
190
214
  const filterdSelected = selected.filter(ele => {
191
215
  var _ele$video;
216
+
192
217
  return ((_ele$video = ele.video) === null || _ele$video === void 0 ? void 0 : _ele$video.id) !== videoEntity.id;
193
- });
218
+ }); // deselect the video
194
219
 
195
- // deselect the video
196
220
  if (filterdSelected.length !== selected.length) {
197
221
  return filterdSelected;
198
- }
222
+ } // single select
223
+
199
224
 
200
- // single select
201
225
  return [{
202
226
  video: videoEntity
203
227
  }];
204
228
  });
205
229
  };
230
+
206
231
  const selectedVideos = selected.map(ele => {
207
232
  return ele.video;
208
233
  });
@@ -217,6 +242,7 @@ function VideoSelector(props) {
217
242
  });
218
243
  }
219
244
  }, [currentPage, searchText]);
245
+
220
246
  let searchResult = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(VideosGrids, {
221
247
  videos: videos,
222
248
  selected: selectedVideos,
@@ -229,12 +255,15 @@ function VideoSelector(props) {
229
255
  setCurrentPage(pageIndex);
230
256
  }
231
257
  }));
258
+
232
259
  if (loading) {
233
260
  searchResult = /*#__PURE__*/_react.default.createElement("p", null, "searching...");
234
261
  }
262
+
235
263
  if (error) {
236
264
  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)));
237
265
  }
266
+
238
267
  return /*#__PURE__*/_react.default.createElement(_modals.DrawerController, {
239
268
  isOpen: true
240
269
  }, /*#__PURE__*/_react.default.createElement(_modals.Drawer, {
@@ -0,0 +1,39 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.theme = exports.mediaSize = exports.default = void 0;
7
+ const mediaSize = {
8
+ xs: 0,
9
+ sm: 576,
10
+ md: 768,
11
+ lg: 960,
12
+ xl: 1200,
13
+ xxl: 1400
14
+ };
15
+ exports.mediaSize = mediaSize;
16
+ const theme = {
17
+ breakpoint: {
18
+ xs: `@media (min-width: ${mediaSize.xs}px)`,
19
+ sm: `@media (min-width: ${mediaSize.sm}px)`,
20
+ md: `@media (min-width: ${mediaSize.md}px)`,
21
+ lg: `@media (min-width: ${mediaSize.lg}px)`,
22
+ xl: `@media (min-width: ${mediaSize.xl}px)`,
23
+ xxl: `@media (min-width: ${mediaSize.xxl}px)`
24
+ },
25
+ fontSize: {
26
+ xs: 'font-size: 14px;',
27
+ sm: 'font-size: 16px;',
28
+ md: 'font-size: 18px;',
29
+ lg: 'font-size: 24px;',
30
+ xl: 'font-size: 28px;'
31
+ },
32
+ margin: {
33
+ default: 'margin: 32px auto;',
34
+ narrow: 'margin: 16px auto;'
35
+ }
36
+ };
37
+ exports.theme = theme;
38
+ var _default = theme;
39
+ exports.default = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mirrormedia/lilith-draft-editor",
3
- "version": "1.1.0-alpha.3",
3
+ "version": "1.1.0-alpha.31",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "scripts": {
@@ -23,16 +23,16 @@
23
23
  "license": "MIT",
24
24
  "dependencies": {
25
25
  "draft-js": "^0.11.7",
26
- "@mirrormedia/lilith-draft-renderer": "1.1.0-alpha.6"
26
+ "@mirrormedia/lilith-draft-renderer": "1.3.0-alpha.17"
27
27
  },
28
28
  "peerDependencies": {
29
- "react": "18.1.0",
30
- "react-dom": "18.1.0",
29
+ "react": "18.2.0",
30
+ "react-dom": "18.2.0",
31
31
  "styled-components": "5.3.5",
32
- "@keystone-6/core": "1.1.1",
33
- "@keystone-ui/button": "^6.0.0",
34
- "@keystone-ui/fields": "^6.0.0",
35
- "@keystone-ui/modals": "^5.0.0"
32
+ "@keystone-6/core": "5.2.0",
33
+ "@keystone-ui/button": "^7.0.2",
34
+ "@keystone-ui/fields": "^7.2.0",
35
+ "@keystone-ui/modals": "^6.0.3"
36
36
  },
37
37
  "files": [
38
38
  "lib"