@os-design/editor 1.0.148 → 1.0.152

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.
@@ -0,0 +1,113 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = exports.VIDEO_BLOCK = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _draftJs = require("draft-js");
11
+
12
+ var _core = require("@os-design/core");
13
+
14
+ var _icons = require("@os-design/icons");
15
+
16
+ var _FigureCaption = _interopRequireDefault(require("./FigureCaption"));
17
+
18
+ var _changeBlock = _interopRequireDefault(require("../utils/changeBlock"));
19
+
20
+ var _getCurrentBlock = _interopRequireDefault(require("../utils/getCurrentBlock"));
21
+
22
+ var _Figure = _interopRequireDefault(require("./Figure"));
23
+
24
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
25
+
26
+ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
27
+
28
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
29
+
30
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
31
+
32
+ var VideoBlock = function VideoBlock(props) {
33
+ var block = props.block;
34
+ var data = block.getData();
35
+ var src = data.get('src');
36
+ if (!src) return null;
37
+ return /*#__PURE__*/_react["default"].createElement(_Figure["default"], null, /*#__PURE__*/_react["default"].createElement(_core.Video, {
38
+ src: src,
39
+ title: block.getText()
40
+ }), /*#__PURE__*/_react["default"].createElement(_FigureCaption["default"], null, /*#__PURE__*/_react["default"].createElement(_draftJs.EditorBlock, props)));
41
+ };
42
+
43
+ var videoTypes = [
44
+ /**
45
+ * YouTube. Supported formats:
46
+ * https://www.youtube.com/watch?v=FJIhWbUt600&ab_channel=IlyaOrdin
47
+ * https://www.youtube.com/embed/FJIhWbUt600
48
+ * https://youtu.be/FJIhWbUt600
49
+ */
50
+ {
51
+ re: /^https:\/\/(?:www\.youtube\.com\/(?:watch\?v=|embed\/)|youtu\.be\/)([A-z0-9-_]*).*$/,
52
+ getUrl: function getUrl(id) {
53
+ return "https://www.youtube.com/embed/".concat(id);
54
+ }
55
+ },
56
+ /**
57
+ * RuTube. Supported formats:
58
+ * https://rutube.ru/video/d00526135b2b96d272f6d89b486036c1/
59
+ * https://rutube.ru/play/embed/d00526135b2b96d272f6d89b486036c1
60
+ */
61
+ {
62
+ re: /^https:\/\/rutube\.ru\/(?:video|play\/embed)\/([a-z0-9]*)\/?$/,
63
+ getUrl: function getUrl(id) {
64
+ return "https://rutube.ru/play/embed/".concat(id);
65
+ }
66
+ }];
67
+
68
+ var detectVideo = function detectVideo(url) {
69
+ // eslint-disable-next-line no-restricted-syntax
70
+ var _iterator = _createForOfIteratorHelper(videoTypes),
71
+ _step;
72
+
73
+ try {
74
+ for (_iterator.s(); !(_step = _iterator.n()).done;) {
75
+ var _step$value = _step.value,
76
+ re = _step$value.re,
77
+ getUrl = _step$value.getUrl;
78
+ var groups = url.match(re);
79
+ if (groups && groups[1]) return getUrl(groups[1]);
80
+ }
81
+ } catch (err) {
82
+ _iterator.e(err);
83
+ } finally {
84
+ _iterator.f();
85
+ }
86
+
87
+ return null;
88
+ };
89
+
90
+ var VIDEO_BLOCK = 'atomic:video';
91
+ exports.VIDEO_BLOCK = VIDEO_BLOCK;
92
+ var videoBlock = {
93
+ type: VIDEO_BLOCK,
94
+ component: VideoBlock,
95
+ icon: /*#__PURE__*/_react["default"].createElement(_icons.Video, null),
96
+ onClick: function onClick(_ref) {
97
+ var value = _ref.value,
98
+ onChange = _ref.onChange;
99
+ // eslint-disable-next-line no-alert
100
+ var url = prompt('Insert a link to YouTube or RuTube');
101
+ if (!url) return;
102
+ var src = detectVideo(url);
103
+ if (!src) return;
104
+ var currentBlock = (0, _getCurrentBlock["default"])(value);
105
+ var nextEditorState = (0, _changeBlock["default"])(value, currentBlock, VIDEO_BLOCK, {
106
+ src: src
107
+ });
108
+ onChange(nextEditorState);
109
+ }
110
+ };
111
+ var _default = videoBlock;
112
+ exports["default"] = _default;
113
+ //# sourceMappingURL=videoBlock.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"videoBlock.js","names":["VideoBlock","props","block","data","getData","src","get","getText","videoTypes","re","getUrl","id","detectVideo","url","groups","match","VIDEO_BLOCK","videoBlock","type","component","icon","onClick","value","onChange","prompt","currentBlock","getCurrentBlock","nextEditorState","changeBlock"],"sources":["../../../../src/Editor/blocks/videoBlock.tsx"],"sourcesContent":["import React from 'react';\nimport { EditorBlock } from 'draft-js';\nimport { Video } from '@os-design/core';\nimport { Video as VideoIcon } from '@os-design/icons';\nimport { BlockToolbarItem, BlockProps } from './types';\nimport FigureCaption from './FigureCaption';\nimport changeBlock from '../utils/changeBlock';\nimport getCurrentBlock from '../utils/getCurrentBlock';\nimport Figure from './Figure';\n\nconst VideoBlock: React.FC<BlockProps> = (props) => {\n const { block } = props;\n const data = block.getData();\n const src = data.get('src');\n\n if (!src) return null;\n\n return (\n <Figure>\n <Video src={src} title={block.getText()} />\n <FigureCaption>\n <EditorBlock {...props} />\n </FigureCaption>\n </Figure>\n );\n};\n\nconst videoTypes = [\n /**\n * YouTube. Supported formats:\n * https://www.youtube.com/watch?v=FJIhWbUt600&ab_channel=IlyaOrdin\n * https://www.youtube.com/embed/FJIhWbUt600\n * https://youtu.be/FJIhWbUt600\n */\n {\n re: /^https:\\/\\/(?:www\\.youtube\\.com\\/(?:watch\\?v=|embed\\/)|youtu\\.be\\/)([A-z0-9-_]*).*$/,\n getUrl: (id: string) => `https://www.youtube.com/embed/${id}`,\n },\n /**\n * RuTube. Supported formats:\n * https://rutube.ru/video/d00526135b2b96d272f6d89b486036c1/\n * https://rutube.ru/play/embed/d00526135b2b96d272f6d89b486036c1\n */\n {\n re: /^https:\\/\\/rutube\\.ru\\/(?:video|play\\/embed)\\/([a-z0-9]*)\\/?$/,\n getUrl: (id: string) => `https://rutube.ru/play/embed/${id}`,\n },\n];\n\nconst detectVideo = (url: string) => {\n // eslint-disable-next-line no-restricted-syntax\n for (const { re, getUrl } of videoTypes) {\n const groups = url.match(re);\n if (groups && groups[1]) return getUrl(groups[1]);\n }\n return null;\n};\n\nexport const VIDEO_BLOCK = 'atomic:video';\n\nconst videoBlock: BlockToolbarItem = {\n type: VIDEO_BLOCK,\n component: VideoBlock,\n icon: <VideoIcon />,\n onClick: ({ value, onChange }) => {\n // eslint-disable-next-line no-alert\n const url = prompt('Insert a link to YouTube or RuTube');\n if (!url) return;\n\n const src = detectVideo(url);\n if (!src) return;\n\n const currentBlock = getCurrentBlock(value);\n const nextEditorState = changeBlock(value, currentBlock, VIDEO_BLOCK, {\n src,\n });\n\n onChange(nextEditorState);\n },\n};\n\nexport default videoBlock;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,UAAgC,GAAG,SAAnCA,UAAmC,CAACC,KAAD,EAAW;EAClD,IAAQC,KAAR,GAAkBD,KAAlB,CAAQC,KAAR;EACA,IAAMC,IAAI,GAAGD,KAAK,CAACE,OAAN,EAAb;EACA,IAAMC,GAAG,GAAGF,IAAI,CAACG,GAAL,CAAS,KAAT,CAAZ;EAEA,IAAI,CAACD,GAAL,EAAU,OAAO,IAAP;EAEV,oBACE,gCAAC,kBAAD,qBACE,gCAAC,WAAD;IAAO,GAAG,EAAEA,GAAZ;IAAiB,KAAK,EAAEH,KAAK,CAACK,OAAN;EAAxB,EADF,eAEE,gCAAC,yBAAD,qBACE,gCAAC,oBAAD,EAAiBN,KAAjB,CADF,CAFF,CADF;AAQD,CAfD;;AAiBA,IAAMO,UAAU,GAAG;AACjB;AACF;AACA;AACA;AACA;AACA;AACE;EACEC,EAAE,EAAE,qFADN;EAEEC,MAAM,EAAE,gBAACC,EAAD;IAAA,+CAAiDA,EAAjD;EAAA;AAFV,CAPiB;AAWjB;AACF;AACA;AACA;AACA;AACE;EACEF,EAAE,EAAE,+DADN;EAEEC,MAAM,EAAE,gBAACC,EAAD;IAAA,8CAAgDA,EAAhD;EAAA;AAFV,CAhBiB,CAAnB;;AAsBA,IAAMC,WAAW,GAAG,SAAdA,WAAc,CAACC,GAAD,EAAiB;EACnC;EADmC,2CAENL,UAFM;EAAA;;EAAA;IAEnC,oDAAyC;MAAA;MAAA,IAA5BC,EAA4B,eAA5BA,EAA4B;MAAA,IAAxBC,MAAwB,eAAxBA,MAAwB;MACvC,IAAMI,MAAM,GAAGD,GAAG,CAACE,KAAJ,CAAUN,EAAV,CAAf;MACA,IAAIK,MAAM,IAAIA,MAAM,CAAC,CAAD,CAApB,EAAyB,OAAOJ,MAAM,CAACI,MAAM,CAAC,CAAD,CAAP,CAAb;IAC1B;EALkC;IAAA;EAAA;IAAA;EAAA;;EAMnC,OAAO,IAAP;AACD,CAPD;;AASO,IAAME,WAAW,GAAG,cAApB;;AAEP,IAAMC,UAA4B,GAAG;EACnCC,IAAI,EAAEF,WAD6B;EAEnCG,SAAS,EAAEnB,UAFwB;EAGnCoB,IAAI,eAAE,gCAAC,YAAD,OAH6B;EAInCC,OAAO,EAAE,uBAAyB;IAAA,IAAtBC,KAAsB,QAAtBA,KAAsB;IAAA,IAAfC,QAAe,QAAfA,QAAe;IAChC;IACA,IAAMV,GAAG,GAAGW,MAAM,CAAC,oCAAD,CAAlB;IACA,IAAI,CAACX,GAAL,EAAU;IAEV,IAAMR,GAAG,GAAGO,WAAW,CAACC,GAAD,CAAvB;IACA,IAAI,CAACR,GAAL,EAAU;IAEV,IAAMoB,YAAY,GAAG,IAAAC,2BAAA,EAAgBJ,KAAhB,CAArB;IACA,IAAMK,eAAe,GAAG,IAAAC,uBAAA,EAAYN,KAAZ,EAAmBG,YAAnB,EAAiCT,WAAjC,EAA8C;MACpEX,GAAG,EAAHA;IADoE,CAA9C,CAAxB;IAIAkB,QAAQ,CAACI,eAAD,CAAR;EACD;AAlBkC,CAArC;eAqBeV,U"}
package/dist/cjs/index.js CHANGED
@@ -15,7 +15,7 @@ var _exportNames = {
15
15
  defaultStyleToolbarItems: true,
16
16
  getCurrentBlock: true,
17
17
  imageBlock: true,
18
- youTubeBlock: true,
18
+ videoBlock: true,
19
19
  EditorSkeleton: true
20
20
  };
21
21
  Object.defineProperty(exports, "Editor", {
@@ -78,10 +78,10 @@ Object.defineProperty(exports, "imageBlock", {
78
78
  return _imageBlock["default"];
79
79
  }
80
80
  });
81
- Object.defineProperty(exports, "youTubeBlock", {
81
+ Object.defineProperty(exports, "videoBlock", {
82
82
  enumerable: true,
83
83
  get: function get() {
84
- return _youTubeBlock["default"];
84
+ return _videoBlock["default"];
85
85
  }
86
86
  });
87
87
 
@@ -115,7 +115,7 @@ var _getCurrentBlock = _interopRequireDefault(require("./Editor/utils/getCurrent
115
115
 
116
116
  var _imageBlock = _interopRequireDefault(require("./Editor/blocks/imageBlock"));
117
117
 
118
- var _youTubeBlock = _interopRequireDefault(require("./Editor/blocks/youTubeBlock"));
118
+ var _videoBlock = _interopRequireDefault(require("./Editor/blocks/videoBlock"));
119
119
 
120
120
  var _EditorSkeleton = _interopRequireWildcard(require("./EditorSkeleton"));
121
121
 
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Editor } from './Editor';\nexport { default as addNewBlockAt } from './Editor/utils/addNewBlockAt';\nexport { default as changeBlock } from './Editor/utils/changeBlock';\nexport { default as createContentEditorState } from './Editor/utils/createContentEditorState';\nexport { default as createDecorator } from './Editor/utils/createDecorator';\nexport { default as createEmptyEditorState } from './Editor/utils/createEmptyEditorState';\nexport { default as defaultStyleToolbarItems } from './Editor/utils/defaultStyleToolbarItems';\nexport { default as getCurrentBlock } from './Editor/utils/getCurrentBlock';\nexport { default as imageBlock } from './Editor/blocks/imageBlock';\nexport { default as youTubeBlock } from './Editor/blocks/youTubeBlock';\nexport { default as EditorSkeleton } from './EditorSkeleton';\n\nexport * from './Editor';\nexport * from './Editor/utils/transformers';\nexport * from './Editor/blocks/types';\nexport * from './EditorSkeleton';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAYA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AAXA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AAFA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Editor } from './Editor';\nexport { default as addNewBlockAt } from './Editor/utils/addNewBlockAt';\nexport { default as changeBlock } from './Editor/utils/changeBlock';\nexport { default as createContentEditorState } from './Editor/utils/createContentEditorState';\nexport { default as createDecorator } from './Editor/utils/createDecorator';\nexport { default as createEmptyEditorState } from './Editor/utils/createEmptyEditorState';\nexport { default as defaultStyleToolbarItems } from './Editor/utils/defaultStyleToolbarItems';\nexport { default as getCurrentBlock } from './Editor/utils/getCurrentBlock';\nexport { default as imageBlock } from './Editor/blocks/imageBlock';\nexport { default as videoBlock } from './Editor/blocks/videoBlock';\nexport { default as EditorSkeleton } from './EditorSkeleton';\n\nexport * from './Editor';\nexport * from './Editor/utils/transformers';\nexport * from './Editor/blocks/types';\nexport * from './EditorSkeleton';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAYA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AAXA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AAFA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
@@ -0,0 +1,79 @@
1
+ import React from 'react';
2
+ import { EditorBlock } from 'draft-js';
3
+ import { Video } from '@os-design/core';
4
+ import { Video as VideoIcon } from '@os-design/icons';
5
+ import FigureCaption from './FigureCaption';
6
+ import changeBlock from '../utils/changeBlock';
7
+ import getCurrentBlock from '../utils/getCurrentBlock';
8
+ import Figure from './Figure';
9
+
10
+ const VideoBlock = props => {
11
+ const {
12
+ block
13
+ } = props;
14
+ const data = block.getData();
15
+ const src = data.get('src');
16
+ if (!src) return null;
17
+ return /*#__PURE__*/React.createElement(Figure, null, /*#__PURE__*/React.createElement(Video, {
18
+ src: src,
19
+ title: block.getText()
20
+ }), /*#__PURE__*/React.createElement(FigureCaption, null, /*#__PURE__*/React.createElement(EditorBlock, props)));
21
+ };
22
+
23
+ const videoTypes = [
24
+ /**
25
+ * YouTube. Supported formats:
26
+ * https://www.youtube.com/watch?v=FJIhWbUt600&ab_channel=IlyaOrdin
27
+ * https://www.youtube.com/embed/FJIhWbUt600
28
+ * https://youtu.be/FJIhWbUt600
29
+ */
30
+ {
31
+ re: /^https:\/\/(?:www\.youtube\.com\/(?:watch\?v=|embed\/)|youtu\.be\/)([A-z0-9-_]*).*$/,
32
+ getUrl: id => `https://www.youtube.com/embed/${id}`
33
+ },
34
+ /**
35
+ * RuTube. Supported formats:
36
+ * https://rutube.ru/video/d00526135b2b96d272f6d89b486036c1/
37
+ * https://rutube.ru/play/embed/d00526135b2b96d272f6d89b486036c1
38
+ */
39
+ {
40
+ re: /^https:\/\/rutube\.ru\/(?:video|play\/embed)\/([a-z0-9]*)\/?$/,
41
+ getUrl: id => `https://rutube.ru/play/embed/${id}`
42
+ }];
43
+
44
+ const detectVideo = url => {
45
+ // eslint-disable-next-line no-restricted-syntax
46
+ for (const {
47
+ re,
48
+ getUrl
49
+ } of videoTypes) {
50
+ const groups = url.match(re);
51
+ if (groups && groups[1]) return getUrl(groups[1]);
52
+ }
53
+
54
+ return null;
55
+ };
56
+
57
+ export const VIDEO_BLOCK = 'atomic:video';
58
+ const videoBlock = {
59
+ type: VIDEO_BLOCK,
60
+ component: VideoBlock,
61
+ icon: /*#__PURE__*/React.createElement(VideoIcon, null),
62
+ onClick: ({
63
+ value,
64
+ onChange
65
+ }) => {
66
+ // eslint-disable-next-line no-alert
67
+ const url = prompt('Insert a link to YouTube or RuTube');
68
+ if (!url) return;
69
+ const src = detectVideo(url);
70
+ if (!src) return;
71
+ const currentBlock = getCurrentBlock(value);
72
+ const nextEditorState = changeBlock(value, currentBlock, VIDEO_BLOCK, {
73
+ src
74
+ });
75
+ onChange(nextEditorState);
76
+ }
77
+ };
78
+ export default videoBlock;
79
+ //# sourceMappingURL=videoBlock.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"videoBlock.js","names":["React","EditorBlock","Video","VideoIcon","FigureCaption","changeBlock","getCurrentBlock","Figure","VideoBlock","props","block","data","getData","src","get","getText","videoTypes","re","getUrl","id","detectVideo","url","groups","match","VIDEO_BLOCK","videoBlock","type","component","icon","onClick","value","onChange","prompt","currentBlock","nextEditorState"],"sources":["../../../../src/Editor/blocks/videoBlock.tsx"],"sourcesContent":["import React from 'react';\nimport { EditorBlock } from 'draft-js';\nimport { Video } from '@os-design/core';\nimport { Video as VideoIcon } from '@os-design/icons';\nimport { BlockToolbarItem, BlockProps } from './types';\nimport FigureCaption from './FigureCaption';\nimport changeBlock from '../utils/changeBlock';\nimport getCurrentBlock from '../utils/getCurrentBlock';\nimport Figure from './Figure';\n\nconst VideoBlock: React.FC<BlockProps> = (props) => {\n const { block } = props;\n const data = block.getData();\n const src = data.get('src');\n\n if (!src) return null;\n\n return (\n <Figure>\n <Video src={src} title={block.getText()} />\n <FigureCaption>\n <EditorBlock {...props} />\n </FigureCaption>\n </Figure>\n );\n};\n\nconst videoTypes = [\n /**\n * YouTube. Supported formats:\n * https://www.youtube.com/watch?v=FJIhWbUt600&ab_channel=IlyaOrdin\n * https://www.youtube.com/embed/FJIhWbUt600\n * https://youtu.be/FJIhWbUt600\n */\n {\n re: /^https:\\/\\/(?:www\\.youtube\\.com\\/(?:watch\\?v=|embed\\/)|youtu\\.be\\/)([A-z0-9-_]*).*$/,\n getUrl: (id: string) => `https://www.youtube.com/embed/${id}`,\n },\n /**\n * RuTube. Supported formats:\n * https://rutube.ru/video/d00526135b2b96d272f6d89b486036c1/\n * https://rutube.ru/play/embed/d00526135b2b96d272f6d89b486036c1\n */\n {\n re: /^https:\\/\\/rutube\\.ru\\/(?:video|play\\/embed)\\/([a-z0-9]*)\\/?$/,\n getUrl: (id: string) => `https://rutube.ru/play/embed/${id}`,\n },\n];\n\nconst detectVideo = (url: string) => {\n // eslint-disable-next-line no-restricted-syntax\n for (const { re, getUrl } of videoTypes) {\n const groups = url.match(re);\n if (groups && groups[1]) return getUrl(groups[1]);\n }\n return null;\n};\n\nexport const VIDEO_BLOCK = 'atomic:video';\n\nconst videoBlock: BlockToolbarItem = {\n type: VIDEO_BLOCK,\n component: VideoBlock,\n icon: <VideoIcon />,\n onClick: ({ value, onChange }) => {\n // eslint-disable-next-line no-alert\n const url = prompt('Insert a link to YouTube or RuTube');\n if (!url) return;\n\n const src = detectVideo(url);\n if (!src) return;\n\n const currentBlock = getCurrentBlock(value);\n const nextEditorState = changeBlock(value, currentBlock, VIDEO_BLOCK, {\n src,\n });\n\n onChange(nextEditorState);\n },\n};\n\nexport default videoBlock;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,WAAT,QAA4B,UAA5B;AACA,SAASC,KAAT,QAAsB,iBAAtB;AACA,SAASA,KAAK,IAAIC,SAAlB,QAAmC,kBAAnC;AAEA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,WAAP,MAAwB,sBAAxB;AACA,OAAOC,eAAP,MAA4B,0BAA5B;AACA,OAAOC,MAAP,MAAmB,UAAnB;;AAEA,MAAMC,UAAgC,GAAIC,KAAD,IAAW;EAClD,MAAM;IAAEC;EAAF,IAAYD,KAAlB;EACA,MAAME,IAAI,GAAGD,KAAK,CAACE,OAAN,EAAb;EACA,MAAMC,GAAG,GAAGF,IAAI,CAACG,GAAL,CAAS,KAAT,CAAZ;EAEA,IAAI,CAACD,GAAL,EAAU,OAAO,IAAP;EAEV,oBACE,oBAAC,MAAD,qBACE,oBAAC,KAAD;IAAO,GAAG,EAAEA,GAAZ;IAAiB,KAAK,EAAEH,KAAK,CAACK,OAAN;EAAxB,EADF,eAEE,oBAAC,aAAD,qBACE,oBAAC,WAAD,EAAiBN,KAAjB,CADF,CAFF,CADF;AAQD,CAfD;;AAiBA,MAAMO,UAAU,GAAG;AACjB;AACF;AACA;AACA;AACA;AACA;AACE;EACEC,EAAE,EAAE,qFADN;EAEEC,MAAM,EAAGC,EAAD,IAAiB,iCAAgCA,EAAG;AAF9D,CAPiB;AAWjB;AACF;AACA;AACA;AACA;AACE;EACEF,EAAE,EAAE,+DADN;EAEEC,MAAM,EAAGC,EAAD,IAAiB,gCAA+BA,EAAG;AAF7D,CAhBiB,CAAnB;;AAsBA,MAAMC,WAAW,GAAIC,GAAD,IAAiB;EACnC;EACA,KAAK,MAAM;IAAEJ,EAAF;IAAMC;EAAN,CAAX,IAA6BF,UAA7B,EAAyC;IACvC,MAAMM,MAAM,GAAGD,GAAG,CAACE,KAAJ,CAAUN,EAAV,CAAf;IACA,IAAIK,MAAM,IAAIA,MAAM,CAAC,CAAD,CAApB,EAAyB,OAAOJ,MAAM,CAACI,MAAM,CAAC,CAAD,CAAP,CAAb;EAC1B;;EACD,OAAO,IAAP;AACD,CAPD;;AASA,OAAO,MAAME,WAAW,GAAG,cAApB;AAEP,MAAMC,UAA4B,GAAG;EACnCC,IAAI,EAAEF,WAD6B;EAEnCG,SAAS,EAAEnB,UAFwB;EAGnCoB,IAAI,eAAE,oBAAC,SAAD,OAH6B;EAInCC,OAAO,EAAE,CAAC;IAAEC,KAAF;IAASC;EAAT,CAAD,KAAyB;IAChC;IACA,MAAMV,GAAG,GAAGW,MAAM,CAAC,oCAAD,CAAlB;IACA,IAAI,CAACX,GAAL,EAAU;IAEV,MAAMR,GAAG,GAAGO,WAAW,CAACC,GAAD,CAAvB;IACA,IAAI,CAACR,GAAL,EAAU;IAEV,MAAMoB,YAAY,GAAG3B,eAAe,CAACwB,KAAD,CAApC;IACA,MAAMI,eAAe,GAAG7B,WAAW,CAACyB,KAAD,EAAQG,YAAR,EAAsBT,WAAtB,EAAmC;MACpEX;IADoE,CAAnC,CAAnC;IAIAkB,QAAQ,CAACG,eAAD,CAAR;EACD;AAlBkC,CAArC;AAqBA,eAAeT,UAAf"}
package/dist/esm/index.js CHANGED
@@ -7,7 +7,7 @@ export { default as createEmptyEditorState } from './Editor/utils/createEmptyEdi
7
7
  export { default as defaultStyleToolbarItems } from './Editor/utils/defaultStyleToolbarItems';
8
8
  export { default as getCurrentBlock } from './Editor/utils/getCurrentBlock';
9
9
  export { default as imageBlock } from './Editor/blocks/imageBlock';
10
- export { default as youTubeBlock } from './Editor/blocks/youTubeBlock';
10
+ export { default as videoBlock } from './Editor/blocks/videoBlock';
11
11
  export { default as EditorSkeleton } from './EditorSkeleton';
12
12
  export * from './Editor';
13
13
  export * from './Editor/utils/transformers';
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["default","Editor","addNewBlockAt","changeBlock","createContentEditorState","createDecorator","createEmptyEditorState","defaultStyleToolbarItems","getCurrentBlock","imageBlock","youTubeBlock","EditorSkeleton"],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Editor } from './Editor';\nexport { default as addNewBlockAt } from './Editor/utils/addNewBlockAt';\nexport { default as changeBlock } from './Editor/utils/changeBlock';\nexport { default as createContentEditorState } from './Editor/utils/createContentEditorState';\nexport { default as createDecorator } from './Editor/utils/createDecorator';\nexport { default as createEmptyEditorState } from './Editor/utils/createEmptyEditorState';\nexport { default as defaultStyleToolbarItems } from './Editor/utils/defaultStyleToolbarItems';\nexport { default as getCurrentBlock } from './Editor/utils/getCurrentBlock';\nexport { default as imageBlock } from './Editor/blocks/imageBlock';\nexport { default as youTubeBlock } from './Editor/blocks/youTubeBlock';\nexport { default as EditorSkeleton } from './EditorSkeleton';\n\nexport * from './Editor';\nexport * from './Editor/utils/transformers';\nexport * from './Editor/blocks/types';\nexport * from './EditorSkeleton';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,MAApB,QAAkC,UAAlC;AACA,SAASD,OAAO,IAAIE,aAApB,QAAyC,8BAAzC;AACA,SAASF,OAAO,IAAIG,WAApB,QAAuC,4BAAvC;AACA,SAASH,OAAO,IAAII,wBAApB,QAAoD,yCAApD;AACA,SAASJ,OAAO,IAAIK,eAApB,QAA2C,gCAA3C;AACA,SAASL,OAAO,IAAIM,sBAApB,QAAkD,uCAAlD;AACA,SAASN,OAAO,IAAIO,wBAApB,QAAoD,yCAApD;AACA,SAASP,OAAO,IAAIQ,eAApB,QAA2C,gCAA3C;AACA,SAASR,OAAO,IAAIS,UAApB,QAAsC,4BAAtC;AACA,SAAST,OAAO,IAAIU,YAApB,QAAwC,8BAAxC;AACA,SAASV,OAAO,IAAIW,cAApB,QAA0C,kBAA1C;AAEA,cAAc,UAAd;AACA,cAAc,6BAAd;AACA,cAAc,uBAAd;AACA,cAAc,kBAAd"}
1
+ {"version":3,"file":"index.js","names":["default","Editor","addNewBlockAt","changeBlock","createContentEditorState","createDecorator","createEmptyEditorState","defaultStyleToolbarItems","getCurrentBlock","imageBlock","videoBlock","EditorSkeleton"],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Editor } from './Editor';\nexport { default as addNewBlockAt } from './Editor/utils/addNewBlockAt';\nexport { default as changeBlock } from './Editor/utils/changeBlock';\nexport { default as createContentEditorState } from './Editor/utils/createContentEditorState';\nexport { default as createDecorator } from './Editor/utils/createDecorator';\nexport { default as createEmptyEditorState } from './Editor/utils/createEmptyEditorState';\nexport { default as defaultStyleToolbarItems } from './Editor/utils/defaultStyleToolbarItems';\nexport { default as getCurrentBlock } from './Editor/utils/getCurrentBlock';\nexport { default as imageBlock } from './Editor/blocks/imageBlock';\nexport { default as videoBlock } from './Editor/blocks/videoBlock';\nexport { default as EditorSkeleton } from './EditorSkeleton';\n\nexport * from './Editor';\nexport * from './Editor/utils/transformers';\nexport * from './Editor/blocks/types';\nexport * from './EditorSkeleton';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,MAApB,QAAkC,UAAlC;AACA,SAASD,OAAO,IAAIE,aAApB,QAAyC,8BAAzC;AACA,SAASF,OAAO,IAAIG,WAApB,QAAuC,4BAAvC;AACA,SAASH,OAAO,IAAII,wBAApB,QAAoD,yCAApD;AACA,SAASJ,OAAO,IAAIK,eAApB,QAA2C,gCAA3C;AACA,SAASL,OAAO,IAAIM,sBAApB,QAAkD,uCAAlD;AACA,SAASN,OAAO,IAAIO,wBAApB,QAAoD,yCAApD;AACA,SAASP,OAAO,IAAIQ,eAApB,QAA2C,gCAA3C;AACA,SAASR,OAAO,IAAIS,UAApB,QAAsC,4BAAtC;AACA,SAAST,OAAO,IAAIU,UAApB,QAAsC,4BAAtC;AACA,SAASV,OAAO,IAAIW,cAApB,QAA0C,kBAA1C;AAEA,cAAc,UAAd;AACA,cAAc,6BAAd;AACA,cAAc,uBAAd;AACA,cAAc,kBAAd"}
@@ -0,0 +1,5 @@
1
+ import { BlockToolbarItem } from './types';
2
+ export declare const VIDEO_BLOCK = "atomic:video";
3
+ declare const videoBlock: BlockToolbarItem;
4
+ export default videoBlock;
5
+ //# sourceMappingURL=videoBlock.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"videoBlock.d.ts","sourceRoot":"","sources":["../../../../src/Editor/blocks/videoBlock.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAc,MAAM,SAAS,CAAC;AAsDvD,eAAO,MAAM,WAAW,iBAAiB,CAAC;AAE1C,QAAA,MAAM,UAAU,EAAE,gBAmBjB,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -7,7 +7,7 @@ export { default as createEmptyEditorState } from './Editor/utils/createEmptyEdi
7
7
  export { default as defaultStyleToolbarItems } from './Editor/utils/defaultStyleToolbarItems';
8
8
  export { default as getCurrentBlock } from './Editor/utils/getCurrentBlock';
9
9
  export { default as imageBlock } from './Editor/blocks/imageBlock';
10
- export { default as youTubeBlock } from './Editor/blocks/youTubeBlock';
10
+ export { default as videoBlock } from './Editor/blocks/videoBlock';
11
11
  export { default as EditorSkeleton } from './EditorSkeleton';
12
12
  export * from './Editor';
13
13
  export * from './Editor/utils/transformers';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,yCAAyC,CAAC;AAC9F,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAC1F,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,yCAAyC,CAAC;AAC9F,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAE7D,cAAc,UAAU,CAAC;AACzB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,yCAAyC,CAAC;AAC9F,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAC1F,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,yCAAyC,CAAC;AAC9F,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAE7D,cAAc,UAAU,CAAC;AACzB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@os-design/editor",
3
- "version": "1.0.148",
3
+ "version": "1.0.152",
4
4
  "license": "UNLICENSED",
5
5
  "repository": "git@gitlab.com:os-team/libs/os-design.git",
6
6
  "main": "dist/cjs/index.js",
@@ -29,11 +29,11 @@
29
29
  "access": "public"
30
30
  },
31
31
  "dependencies": {
32
- "@os-design/core": "^1.0.144",
33
- "@os-design/icons": "^1.0.37",
34
- "@os-design/styles": "^1.0.35",
35
- "@os-design/theming": "^1.0.33",
36
- "@os-design/utils": "^1.0.50",
32
+ "@os-design/core": "^1.0.148",
33
+ "@os-design/icons": "^1.0.39",
34
+ "@os-design/styles": "^1.0.37",
35
+ "@os-design/theming": "^1.0.35",
36
+ "@os-design/utils": "^1.0.52",
37
37
  "draft-js": "^0.11.7"
38
38
  },
39
39
  "devDependencies": {
@@ -49,5 +49,5 @@
49
49
  "react": ">=18",
50
50
  "react-dom": ">=18"
51
51
  },
52
- "gitHead": "9d5e3b6abd1889613320ff0fac5b2294c3dccfea"
52
+ "gitHead": "45e65ea32b3fb5795eefb498e15721fd0ad09b33"
53
53
  }
@@ -1,61 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports["default"] = exports.YOUTUBE_BLOCK = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _draftJs = require("draft-js");
11
-
12
- var _core = require("@os-design/core");
13
-
14
- var _icons = require("@os-design/icons");
15
-
16
- var _FigureCaption = _interopRequireDefault(require("./FigureCaption"));
17
-
18
- var _changeBlock = _interopRequireDefault(require("../utils/changeBlock"));
19
-
20
- var _getCurrentBlock = _interopRequireDefault(require("../utils/getCurrentBlock"));
21
-
22
- var _Figure = _interopRequireDefault(require("./Figure"));
23
-
24
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
25
-
26
- var YouTubeBlock = function YouTubeBlock(props) {
27
- var block = props.block;
28
- var data = block.getData();
29
- var id = data.get('id');
30
- if (!id) return null;
31
- return /*#__PURE__*/_react["default"].createElement(_Figure["default"], null, /*#__PURE__*/_react["default"].createElement(_core.YouTubeVideo, {
32
- id: id,
33
- title: block.getText()
34
- }), /*#__PURE__*/_react["default"].createElement(_FigureCaption["default"], null, /*#__PURE__*/_react["default"].createElement(_draftJs.EditorBlock, props)));
35
- };
36
-
37
- var YOUTUBE_ID_RE = /^.*(?:(?:youtu\.be\/|v\/|vi\/|u\/\w\/|embed\/)|(?:(?:watch)?\?v(?:i)?=|&v(?:i)?=))([^#&?]*).*/;
38
- var YOUTUBE_BLOCK = 'atomic:youtube';
39
- exports.YOUTUBE_BLOCK = YOUTUBE_BLOCK;
40
- var youTubeBlock = {
41
- type: YOUTUBE_BLOCK,
42
- component: YouTubeBlock,
43
- icon: /*#__PURE__*/_react["default"].createElement(_icons.Video, null),
44
- onClick: function onClick(_ref) {
45
- var value = _ref.value,
46
- onChange = _ref.onChange;
47
- // eslint-disable-next-line no-alert
48
- var url = prompt('Paste a YouTube link');
49
- if (!url) return;
50
- var match = url.match(YOUTUBE_ID_RE);
51
- if (!match || !match[1]) return;
52
- var currentBlock = (0, _getCurrentBlock["default"])(value);
53
- var nextEditorState = (0, _changeBlock["default"])(value, currentBlock, YOUTUBE_BLOCK, {
54
- id: match[1]
55
- });
56
- onChange(nextEditorState);
57
- }
58
- };
59
- var _default = youTubeBlock;
60
- exports["default"] = _default;
61
- //# sourceMappingURL=youTubeBlock.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"youTubeBlock.js","names":["YouTubeBlock","props","block","data","getData","id","get","getText","YOUTUBE_ID_RE","YOUTUBE_BLOCK","youTubeBlock","type","component","icon","onClick","value","onChange","url","prompt","match","currentBlock","getCurrentBlock","nextEditorState","changeBlock"],"sources":["../../../../src/Editor/blocks/youTubeBlock.tsx"],"sourcesContent":["import React from 'react';\nimport { EditorBlock } from 'draft-js';\nimport { YouTubeVideo } from '@os-design/core';\nimport { Video } from '@os-design/icons';\nimport { BlockToolbarItem, BlockProps } from './types';\nimport FigureCaption from './FigureCaption';\nimport changeBlock from '../utils/changeBlock';\nimport getCurrentBlock from '../utils/getCurrentBlock';\nimport Figure from './Figure';\n\nconst YouTubeBlock: React.FC<BlockProps> = (props) => {\n const { block } = props;\n const data = block.getData();\n const id = data.get('id');\n\n if (!id) return null;\n\n return (\n <Figure>\n <YouTubeVideo id={id} title={block.getText()} />\n <FigureCaption>\n <EditorBlock {...props} />\n </FigureCaption>\n </Figure>\n );\n};\n\nconst YOUTUBE_ID_RE =\n /^.*(?:(?:youtu\\.be\\/|v\\/|vi\\/|u\\/\\w\\/|embed\\/)|(?:(?:watch)?\\?v(?:i)?=|&v(?:i)?=))([^#&?]*).*/;\n\nexport const YOUTUBE_BLOCK = 'atomic:youtube';\n\nconst youTubeBlock: BlockToolbarItem = {\n type: YOUTUBE_BLOCK,\n component: YouTubeBlock,\n icon: <Video />,\n onClick: ({ value, onChange }) => {\n // eslint-disable-next-line no-alert\n const url = prompt('Paste a YouTube link');\n if (!url) return;\n\n const match = url.match(YOUTUBE_ID_RE);\n if (!match || !match[1]) return;\n\n const currentBlock = getCurrentBlock(value);\n const nextEditorState = changeBlock(value, currentBlock, YOUTUBE_BLOCK, {\n id: match[1],\n });\n\n onChange(nextEditorState);\n },\n};\n\nexport default youTubeBlock;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;AAEA,IAAMA,YAAkC,GAAG,SAArCA,YAAqC,CAACC,KAAD,EAAW;EACpD,IAAQC,KAAR,GAAkBD,KAAlB,CAAQC,KAAR;EACA,IAAMC,IAAI,GAAGD,KAAK,CAACE,OAAN,EAAb;EACA,IAAMC,EAAE,GAAGF,IAAI,CAACG,GAAL,CAAS,IAAT,CAAX;EAEA,IAAI,CAACD,EAAL,EAAS,OAAO,IAAP;EAET,oBACE,gCAAC,kBAAD,qBACE,gCAAC,kBAAD;IAAc,EAAE,EAAEA,EAAlB;IAAsB,KAAK,EAAEH,KAAK,CAACK,OAAN;EAA7B,EADF,eAEE,gCAAC,yBAAD,qBACE,gCAAC,oBAAD,EAAiBN,KAAjB,CADF,CAFF,CADF;AAQD,CAfD;;AAiBA,IAAMO,aAAa,GACjB,+FADF;AAGO,IAAMC,aAAa,GAAG,gBAAtB;;AAEP,IAAMC,YAA8B,GAAG;EACrCC,IAAI,EAAEF,aAD+B;EAErCG,SAAS,EAAEZ,YAF0B;EAGrCa,IAAI,eAAE,gCAAC,YAAD,OAH+B;EAIrCC,OAAO,EAAE,uBAAyB;IAAA,IAAtBC,KAAsB,QAAtBA,KAAsB;IAAA,IAAfC,QAAe,QAAfA,QAAe;IAChC;IACA,IAAMC,GAAG,GAAGC,MAAM,CAAC,sBAAD,CAAlB;IACA,IAAI,CAACD,GAAL,EAAU;IAEV,IAAME,KAAK,GAAGF,GAAG,CAACE,KAAJ,CAAUX,aAAV,CAAd;IACA,IAAI,CAACW,KAAD,IAAU,CAACA,KAAK,CAAC,CAAD,CAApB,EAAyB;IAEzB,IAAMC,YAAY,GAAG,IAAAC,2BAAA,EAAgBN,KAAhB,CAArB;IACA,IAAMO,eAAe,GAAG,IAAAC,uBAAA,EAAYR,KAAZ,EAAmBK,YAAnB,EAAiCX,aAAjC,EAAgD;MACtEJ,EAAE,EAAEc,KAAK,CAAC,CAAD;IAD6D,CAAhD,CAAxB;IAIAH,QAAQ,CAACM,eAAD,CAAR;EACD;AAlBoC,CAAvC;eAqBeZ,Y"}
@@ -1,46 +0,0 @@
1
- import React from 'react';
2
- import { EditorBlock } from 'draft-js';
3
- import { YouTubeVideo } from '@os-design/core';
4
- import { Video } from '@os-design/icons';
5
- import FigureCaption from './FigureCaption';
6
- import changeBlock from '../utils/changeBlock';
7
- import getCurrentBlock from '../utils/getCurrentBlock';
8
- import Figure from './Figure';
9
-
10
- const YouTubeBlock = props => {
11
- const {
12
- block
13
- } = props;
14
- const data = block.getData();
15
- const id = data.get('id');
16
- if (!id) return null;
17
- return /*#__PURE__*/React.createElement(Figure, null, /*#__PURE__*/React.createElement(YouTubeVideo, {
18
- id: id,
19
- title: block.getText()
20
- }), /*#__PURE__*/React.createElement(FigureCaption, null, /*#__PURE__*/React.createElement(EditorBlock, props)));
21
- };
22
-
23
- const YOUTUBE_ID_RE = /^.*(?:(?:youtu\.be\/|v\/|vi\/|u\/\w\/|embed\/)|(?:(?:watch)?\?v(?:i)?=|&v(?:i)?=))([^#&?]*).*/;
24
- export const YOUTUBE_BLOCK = 'atomic:youtube';
25
- const youTubeBlock = {
26
- type: YOUTUBE_BLOCK,
27
- component: YouTubeBlock,
28
- icon: /*#__PURE__*/React.createElement(Video, null),
29
- onClick: ({
30
- value,
31
- onChange
32
- }) => {
33
- // eslint-disable-next-line no-alert
34
- const url = prompt('Paste a YouTube link');
35
- if (!url) return;
36
- const match = url.match(YOUTUBE_ID_RE);
37
- if (!match || !match[1]) return;
38
- const currentBlock = getCurrentBlock(value);
39
- const nextEditorState = changeBlock(value, currentBlock, YOUTUBE_BLOCK, {
40
- id: match[1]
41
- });
42
- onChange(nextEditorState);
43
- }
44
- };
45
- export default youTubeBlock;
46
- //# sourceMappingURL=youTubeBlock.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"youTubeBlock.js","names":["React","EditorBlock","YouTubeVideo","Video","FigureCaption","changeBlock","getCurrentBlock","Figure","YouTubeBlock","props","block","data","getData","id","get","getText","YOUTUBE_ID_RE","YOUTUBE_BLOCK","youTubeBlock","type","component","icon","onClick","value","onChange","url","prompt","match","currentBlock","nextEditorState"],"sources":["../../../../src/Editor/blocks/youTubeBlock.tsx"],"sourcesContent":["import React from 'react';\nimport { EditorBlock } from 'draft-js';\nimport { YouTubeVideo } from '@os-design/core';\nimport { Video } from '@os-design/icons';\nimport { BlockToolbarItem, BlockProps } from './types';\nimport FigureCaption from './FigureCaption';\nimport changeBlock from '../utils/changeBlock';\nimport getCurrentBlock from '../utils/getCurrentBlock';\nimport Figure from './Figure';\n\nconst YouTubeBlock: React.FC<BlockProps> = (props) => {\n const { block } = props;\n const data = block.getData();\n const id = data.get('id');\n\n if (!id) return null;\n\n return (\n <Figure>\n <YouTubeVideo id={id} title={block.getText()} />\n <FigureCaption>\n <EditorBlock {...props} />\n </FigureCaption>\n </Figure>\n );\n};\n\nconst YOUTUBE_ID_RE =\n /^.*(?:(?:youtu\\.be\\/|v\\/|vi\\/|u\\/\\w\\/|embed\\/)|(?:(?:watch)?\\?v(?:i)?=|&v(?:i)?=))([^#&?]*).*/;\n\nexport const YOUTUBE_BLOCK = 'atomic:youtube';\n\nconst youTubeBlock: BlockToolbarItem = {\n type: YOUTUBE_BLOCK,\n component: YouTubeBlock,\n icon: <Video />,\n onClick: ({ value, onChange }) => {\n // eslint-disable-next-line no-alert\n const url = prompt('Paste a YouTube link');\n if (!url) return;\n\n const match = url.match(YOUTUBE_ID_RE);\n if (!match || !match[1]) return;\n\n const currentBlock = getCurrentBlock(value);\n const nextEditorState = changeBlock(value, currentBlock, YOUTUBE_BLOCK, {\n id: match[1],\n });\n\n onChange(nextEditorState);\n },\n};\n\nexport default youTubeBlock;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,WAAT,QAA4B,UAA5B;AACA,SAASC,YAAT,QAA6B,iBAA7B;AACA,SAASC,KAAT,QAAsB,kBAAtB;AAEA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,WAAP,MAAwB,sBAAxB;AACA,OAAOC,eAAP,MAA4B,0BAA5B;AACA,OAAOC,MAAP,MAAmB,UAAnB;;AAEA,MAAMC,YAAkC,GAAIC,KAAD,IAAW;EACpD,MAAM;IAAEC;EAAF,IAAYD,KAAlB;EACA,MAAME,IAAI,GAAGD,KAAK,CAACE,OAAN,EAAb;EACA,MAAMC,EAAE,GAAGF,IAAI,CAACG,GAAL,CAAS,IAAT,CAAX;EAEA,IAAI,CAACD,EAAL,EAAS,OAAO,IAAP;EAET,oBACE,oBAAC,MAAD,qBACE,oBAAC,YAAD;IAAc,EAAE,EAAEA,EAAlB;IAAsB,KAAK,EAAEH,KAAK,CAACK,OAAN;EAA7B,EADF,eAEE,oBAAC,aAAD,qBACE,oBAAC,WAAD,EAAiBN,KAAjB,CADF,CAFF,CADF;AAQD,CAfD;;AAiBA,MAAMO,aAAa,GACjB,+FADF;AAGA,OAAO,MAAMC,aAAa,GAAG,gBAAtB;AAEP,MAAMC,YAA8B,GAAG;EACrCC,IAAI,EAAEF,aAD+B;EAErCG,SAAS,EAAEZ,YAF0B;EAGrCa,IAAI,eAAE,oBAAC,KAAD,OAH+B;EAIrCC,OAAO,EAAE,CAAC;IAAEC,KAAF;IAASC;EAAT,CAAD,KAAyB;IAChC;IACA,MAAMC,GAAG,GAAGC,MAAM,CAAC,sBAAD,CAAlB;IACA,IAAI,CAACD,GAAL,EAAU;IAEV,MAAME,KAAK,GAAGF,GAAG,CAACE,KAAJ,CAAUX,aAAV,CAAd;IACA,IAAI,CAACW,KAAD,IAAU,CAACA,KAAK,CAAC,CAAD,CAApB,EAAyB;IAEzB,MAAMC,YAAY,GAAGtB,eAAe,CAACiB,KAAD,CAApC;IACA,MAAMM,eAAe,GAAGxB,WAAW,CAACkB,KAAD,EAAQK,YAAR,EAAsBX,aAAtB,EAAqC;MACtEJ,EAAE,EAAEc,KAAK,CAAC,CAAD;IAD6D,CAArC,CAAnC;IAIAH,QAAQ,CAACK,eAAD,CAAR;EACD;AAlBoC,CAAvC;AAqBA,eAAeX,YAAf"}
@@ -1,5 +0,0 @@
1
- import { BlockToolbarItem } from './types';
2
- export declare const YOUTUBE_BLOCK = "atomic:youtube";
3
- declare const youTubeBlock: BlockToolbarItem;
4
- export default youTubeBlock;
5
- //# sourceMappingURL=youTubeBlock.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"youTubeBlock.d.ts","sourceRoot":"","sources":["../../../../src/Editor/blocks/youTubeBlock.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAc,MAAM,SAAS,CAAC;AA0BvD,eAAO,MAAM,aAAa,mBAAmB,CAAC;AAE9C,QAAA,MAAM,YAAY,EAAE,gBAmBnB,CAAC;AAEF,eAAe,YAAY,CAAC"}