@kids-reporter/draft-editor 1.0.3 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/block-renderers/blockquote.js +2 -2
- package/lib/block-renderers/embedded-code.js +2 -2
- package/lib/block-renderers/image.js +2 -2
- package/lib/block-renderers/info-box.js +2 -2
- package/lib/block-renderers/slideshow.js +2 -2
- package/lib/buttons/annotation.js +2 -2
- package/lib/buttons/bg-color.js +3 -4
- package/lib/buttons/blockquote.js +2 -2
- package/lib/buttons/bt-names.js +2 -3
- package/lib/buttons/control-buttons.js +3 -4
- package/lib/buttons/embedded-code.js +45 -3
- package/lib/buttons/font-color.js +3 -4
- package/lib/buttons/image.js +2 -2
- package/lib/buttons/index.js +13 -26
- package/lib/buttons/info-box.js +2 -2
- package/lib/buttons/link.js +2 -2
- package/lib/buttons/news-reading.js +2 -2
- package/lib/buttons/selector/align-selector.js +2 -2
- package/lib/buttons/selector/image-selector.js +2 -2
- package/lib/buttons/selector/search-box.js +2 -2
- package/lib/buttons/slideshow.js +2 -2
- package/lib/draft-editor.js +4 -7
- package/lib/entity-decorators/anchor.js +4 -5
- package/lib/index.js +2 -3
- package/lib/styled.js +9 -15
- package/package.json +2 -2
- package/lib/buttons/inner-anchor.js +0 -53
- package/lib/entity-decorators/inner-anchor.js +0 -110
|
@@ -10,8 +10,8 @@ var _blockquote = require("../buttons/blockquote");
|
|
|
10
10
|
var _styled = require("./styled");
|
|
11
11
|
var _draftRenderer = require("@kids-reporter/draft-renderer");
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
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
15
|
const {
|
|
16
16
|
BlockquoteInArticleBody
|
|
17
17
|
} = _draftRenderer.blockRenderers;
|
|
@@ -10,8 +10,8 @@ var _embeddedCode = require("../buttons/embedded-code");
|
|
|
10
10
|
var _styled = require("./styled");
|
|
11
11
|
var _fields = require("@keystone-ui/fields");
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
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
15
|
function EmbeddedCode({
|
|
16
16
|
className,
|
|
17
17
|
embeddedCode
|
|
@@ -10,8 +10,8 @@ var _imageSelector = require("../buttons/selector/image-selector");
|
|
|
10
10
|
var _styled = require("./styled");
|
|
11
11
|
var _draftRenderer = require("@kids-reporter/draft-renderer");
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
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
15
|
const {
|
|
16
16
|
ImageInArticleBody
|
|
17
17
|
} = _draftRenderer.blockRenderers;
|
|
@@ -10,8 +10,8 @@ var _styled = require("./styled");
|
|
|
10
10
|
var _infoBox = require("../buttons/info-box");
|
|
11
11
|
var _draftRenderer = require("@kids-reporter/draft-renderer");
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
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
15
|
const {
|
|
16
16
|
InfoBoxInArticleBody
|
|
17
17
|
} = _draftRenderer.blockRenderers;
|
|
@@ -10,8 +10,8 @@ var _imageSelector = require("../buttons/selector/image-selector");
|
|
|
10
10
|
var _styled = require("./styled");
|
|
11
11
|
var _draftRenderer = require("@kids-reporter/draft-renderer");
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
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
15
|
const {
|
|
16
16
|
SlideshowInArticleBody
|
|
17
17
|
} = _draftRenderer.blockRenderers;
|
|
@@ -9,8 +9,8 @@ var _btNames = _interopRequireDefault(require("./bt-names"));
|
|
|
9
9
|
var _draftJs = require("draft-js");
|
|
10
10
|
var _modals = require("@keystone-ui/modals");
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
function _getRequireWildcardCache(
|
|
13
|
-
function _interopRequireWildcard(
|
|
12
|
+
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); }
|
|
13
|
+
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; }
|
|
14
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, _btNames.default.newsReading, _btNames.default.anchor];
|
|
15
15
|
function createAnnotationButton({
|
|
16
16
|
InnerEditor,
|
package/lib/buttons/bg-color.js
CHANGED
|
@@ -11,10 +11,9 @@ var _draftJs = require("draft-js");
|
|
|
11
11
|
var _fields = require("@keystone-ui/fields");
|
|
12
12
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
|
-
function _getRequireWildcardCache(
|
|
15
|
-
function _interopRequireWildcard(
|
|
16
|
-
const customStylePrefix = 'BACKGROUND_COLOR_';
|
|
17
|
-
exports.customStylePrefix = customStylePrefix;
|
|
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); }
|
|
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
|
+
const customStylePrefix = exports.customStylePrefix = 'BACKGROUND_COLOR_';
|
|
18
17
|
const ColorHexInput = (0, _styledComponents.default)(_fields.TextInput)`
|
|
19
18
|
margin-right: 10px;
|
|
20
19
|
padding: 10px;
|
|
@@ -10,8 +10,8 @@ var _draftJs = require("draft-js");
|
|
|
10
10
|
var _modals = require("@keystone-ui/modals");
|
|
11
11
|
var _select = require("./form/select");
|
|
12
12
|
var _fields = require("@keystone-ui/fields");
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
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
15
|
var BlockquoteTypeEnum = /*#__PURE__*/function (BlockquoteTypeEnum) {
|
|
16
16
|
BlockquoteTypeEnum["borderLeft"] = "border_left";
|
|
17
17
|
BlockquoteTypeEnum["quoteLeft"] = "quote_left";
|
package/lib/buttons/bt-names.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
var _default = {
|
|
7
|
+
var _default = exports.default = {
|
|
8
8
|
// inline styles
|
|
9
9
|
bold: 'bold',
|
|
10
10
|
italic: 'italic',
|
|
@@ -32,5 +32,4 @@ var _default = {
|
|
|
32
32
|
newsReading: 'news-reading',
|
|
33
33
|
divider: 'divider',
|
|
34
34
|
anchor: 'anchor'
|
|
35
|
-
};
|
|
36
|
-
exports.default = _default;
|
|
35
|
+
};
|
|
@@ -6,10 +6,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.buttonStyle = exports.InlineStyleControls = exports.BlockStyleControls = void 0;
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
9
|
-
function _getRequireWildcardCache(
|
|
10
|
-
function _interopRequireWildcard(
|
|
9
|
+
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); }
|
|
10
|
+
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
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
const buttonStyle = (0, _styledComponents.css)`
|
|
12
|
+
const buttonStyle = exports.buttonStyle = (0, _styledComponents.css)`
|
|
13
13
|
cursor: pointer;
|
|
14
14
|
border-radius: 6px;
|
|
15
15
|
text-align: center;
|
|
@@ -59,7 +59,6 @@ const buttonStyle = (0, _styledComponents.css)`
|
|
|
59
59
|
return 'inline-flex';
|
|
60
60
|
}};
|
|
61
61
|
`;
|
|
62
|
-
exports.buttonStyle = buttonStyle;
|
|
63
62
|
const CustomButton = _styledComponents.default.div`
|
|
64
63
|
${buttonStyle}
|
|
65
64
|
`;
|
|
@@ -7,10 +7,29 @@ exports.EmbeddedCodeButton = EmbeddedCodeButton;
|
|
|
7
7
|
exports.EmbeddedCodeInput = EmbeddedCodeInput;
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
9
|
var _draftJs = require("draft-js");
|
|
10
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
10
11
|
var _modals = require("@keystone-ui/modals");
|
|
11
12
|
var _fields = require("@keystone-ui/fields");
|
|
12
|
-
|
|
13
|
-
function
|
|
13
|
+
var _alignSelector = require("./selector/align-selector");
|
|
14
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
+
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); }
|
|
16
|
+
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; }
|
|
17
|
+
var AlignOption = /*#__PURE__*/function (AlignOption) {
|
|
18
|
+
AlignOption["Paragraph"] = "paragraph-width";
|
|
19
|
+
AlignOption["Image"] = "image-width";
|
|
20
|
+
return AlignOption;
|
|
21
|
+
}(AlignOption || {});
|
|
22
|
+
const options = [{
|
|
23
|
+
value: AlignOption.Paragraph,
|
|
24
|
+
label: '與文章段落等寬'
|
|
25
|
+
}, {
|
|
26
|
+
value: AlignOption.Image,
|
|
27
|
+
label: '寬版(與圖片預設等寬)'
|
|
28
|
+
}];
|
|
29
|
+
const Container = _styledComponents.default.div`
|
|
30
|
+
margin-top: 20px;
|
|
31
|
+
margin-bottom: 20px;
|
|
32
|
+
`;
|
|
14
33
|
function EmbeddedCodeInput({
|
|
15
34
|
isOpen,
|
|
16
35
|
onConfirm,
|
|
@@ -18,9 +37,17 @@ function EmbeddedCodeInput({
|
|
|
18
37
|
inputValue
|
|
19
38
|
}) {
|
|
20
39
|
const [inputValueState, setInputValue] = (0, _react.useState)(inputValue);
|
|
40
|
+
const contentWrapperRef = (0, _react.useRef)(null);
|
|
21
41
|
const confirmInput = () => {
|
|
22
42
|
onConfirm(inputValueState);
|
|
23
43
|
};
|
|
44
|
+
const onAlignSelectOpen = () => {
|
|
45
|
+
var _contentWrapperRef$cu;
|
|
46
|
+
const scrollWrapper = (_contentWrapperRef$cu = contentWrapperRef.current) === null || _contentWrapperRef$cu === void 0 ? void 0 : _contentWrapperRef$cu.parentElement;
|
|
47
|
+
if (scrollWrapper) {
|
|
48
|
+
scrollWrapper.scrollTop = scrollWrapper === null || scrollWrapper === void 0 ? void 0 : scrollWrapper.scrollHeight;
|
|
49
|
+
}
|
|
50
|
+
};
|
|
24
51
|
return /*#__PURE__*/_react.default.createElement(_modals.DrawerController, {
|
|
25
52
|
isOpen: isOpen
|
|
26
53
|
}, /*#__PURE__*/_react.default.createElement(_modals.Drawer, {
|
|
@@ -37,9 +64,12 @@ function EmbeddedCodeInput({
|
|
|
37
64
|
action: confirmInput
|
|
38
65
|
}
|
|
39
66
|
}
|
|
67
|
+
}, /*#__PURE__*/_react.default.createElement(Container, {
|
|
68
|
+
ref: contentWrapperRef
|
|
40
69
|
}, /*#__PURE__*/_react.default.createElement(_fields.TextArea, {
|
|
41
70
|
onChange: e => setInputValue({
|
|
42
71
|
caption: inputValueState.caption,
|
|
72
|
+
align: inputValueState.align,
|
|
43
73
|
embeddedCode: e.target.value
|
|
44
74
|
}),
|
|
45
75
|
placeholder: "Embedded Code",
|
|
@@ -51,6 +81,7 @@ function EmbeddedCodeInput({
|
|
|
51
81
|
}), /*#__PURE__*/_react.default.createElement(_fields.TextInput, {
|
|
52
82
|
onChange: e => setInputValue({
|
|
53
83
|
caption: e.target.value,
|
|
84
|
+
align: inputValueState.align,
|
|
54
85
|
embeddedCode: inputValueState.embeddedCode
|
|
55
86
|
}),
|
|
56
87
|
type: "text",
|
|
@@ -60,7 +91,18 @@ function EmbeddedCodeInput({
|
|
|
60
91
|
marginBottom: '10px',
|
|
61
92
|
marginTop: '30px'
|
|
62
93
|
}
|
|
63
|
-
})
|
|
94
|
+
}), /*#__PURE__*/_react.default.createElement(_alignSelector.AlignSelector, {
|
|
95
|
+
align: inputValueState.align,
|
|
96
|
+
options: options,
|
|
97
|
+
onChange: align => {
|
|
98
|
+
setInputValue({
|
|
99
|
+
caption: inputValueState.caption,
|
|
100
|
+
align: align,
|
|
101
|
+
embeddedCode: inputValueState.embeddedCode
|
|
102
|
+
});
|
|
103
|
+
},
|
|
104
|
+
onOpen: onAlignSelectOpen
|
|
105
|
+
}))));
|
|
64
106
|
}
|
|
65
107
|
function EmbeddedCodeButton(props) {
|
|
66
108
|
const {
|
|
@@ -11,10 +11,9 @@ var _draftJs = require("draft-js");
|
|
|
11
11
|
var _fields = require("@keystone-ui/fields");
|
|
12
12
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
|
-
function _getRequireWildcardCache(
|
|
15
|
-
function _interopRequireWildcard(
|
|
16
|
-
const customStylePrefix = 'FONT_COLOR_';
|
|
17
|
-
exports.customStylePrefix = customStylePrefix;
|
|
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); }
|
|
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
|
+
const customStylePrefix = exports.customStylePrefix = 'FONT_COLOR_';
|
|
18
17
|
const ColorHexInput = (0, _styledComponents.default)(_fields.TextInput)`
|
|
19
18
|
margin-right: 10px;
|
|
20
19
|
padding: 10px;
|
package/lib/buttons/image.js
CHANGED
|
@@ -7,8 +7,8 @@ exports.ImageButton = ImageButton;
|
|
|
7
7
|
var _react = _interopRequireWildcard(require("react"));
|
|
8
8
|
var _draftJs = require("draft-js");
|
|
9
9
|
var _imageSelector = require("./selector/image-selector");
|
|
10
|
-
function _getRequireWildcardCache(
|
|
11
|
-
function _interopRequireWildcard(
|
|
10
|
+
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); }
|
|
11
|
+
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; }
|
|
12
12
|
function ImageButton(props) {
|
|
13
13
|
const {
|
|
14
14
|
editorState,
|
package/lib/buttons/index.js
CHANGED
|
@@ -24,31 +24,18 @@ const withStyle = Button => {
|
|
|
24
24
|
`;
|
|
25
25
|
};
|
|
26
26
|
exports.withStyle = withStyle;
|
|
27
|
-
const BlockStyleControls = _controlButtons.BlockStyleControls;
|
|
28
|
-
exports.
|
|
29
|
-
const
|
|
30
|
-
exports.
|
|
31
|
-
const
|
|
32
|
-
exports.
|
|
33
|
-
const CustomAnchorButton = withStyle(_anchor.AnchorButton);
|
|
34
|
-
exports.CustomAnchorButton = CustomAnchorButton;
|
|
35
|
-
const CustomLinkButton = withStyle(_link.LinkButton);
|
|
36
|
-
exports.CustomLinkButton = CustomLinkButton;
|
|
37
|
-
const CustomEnlargeButton = (0, _styledComponents.default)(withStyle(_enlarge.EnlargeButton))`
|
|
27
|
+
const BlockStyleControls = exports.BlockStyleControls = _controlButtons.BlockStyleControls;
|
|
28
|
+
const InlineStyleControls = exports.InlineStyleControls = _controlButtons.InlineStyleControls;
|
|
29
|
+
const CustomBlockquoteButton = exports.CustomBlockquoteButton = withStyle(_blockquote.BlockquoteButton);
|
|
30
|
+
const CustomAnchorButton = exports.CustomAnchorButton = withStyle(_anchor.AnchorButton);
|
|
31
|
+
const CustomLinkButton = exports.CustomLinkButton = withStyle(_link.LinkButton);
|
|
32
|
+
const CustomEnlargeButton = exports.CustomEnlargeButton = (0, _styledComponents.default)(withStyle(_enlarge.EnlargeButton))`
|
|
38
33
|
color: #999;
|
|
39
34
|
`;
|
|
40
|
-
exports.
|
|
41
|
-
const
|
|
42
|
-
exports.
|
|
43
|
-
const
|
|
44
|
-
exports.
|
|
45
|
-
const
|
|
46
|
-
exports.
|
|
47
|
-
const CustomNewsReadingButton = withStyle(_newsReading.NewsReadingButton);
|
|
48
|
-
exports.CustomNewsReadingButton = CustomNewsReadingButton;
|
|
49
|
-
const CustomBackgroundColorButton = withStyle(_bgColor.BackgroundColorButton);
|
|
50
|
-
exports.CustomBackgroundColorButton = CustomBackgroundColorButton;
|
|
51
|
-
const CustomFontColorButton = withStyle(_fontColor.FontColorButton);
|
|
52
|
-
exports.CustomFontColorButton = CustomFontColorButton;
|
|
53
|
-
const CustomDividerButton = withStyle(_divider.DividerButton);
|
|
54
|
-
exports.CustomDividerButton = CustomDividerButton;
|
|
35
|
+
const CustomImageButton = exports.CustomImageButton = withStyle(_image.ImageButton);
|
|
36
|
+
const CustomSlideshowButton = exports.CustomSlideshowButton = withStyle(_slideshow.SlideshowButton);
|
|
37
|
+
const CustomEmbeddedCodeButton = exports.CustomEmbeddedCodeButton = withStyle(_embeddedCode.EmbeddedCodeButton);
|
|
38
|
+
const CustomNewsReadingButton = exports.CustomNewsReadingButton = withStyle(_newsReading.NewsReadingButton);
|
|
39
|
+
const CustomBackgroundColorButton = exports.CustomBackgroundColorButton = withStyle(_bgColor.BackgroundColorButton);
|
|
40
|
+
const CustomFontColorButton = exports.CustomFontColorButton = withStyle(_fontColor.FontColorButton);
|
|
41
|
+
const CustomDividerButton = exports.CustomDividerButton = withStyle(_divider.DividerButton);
|
package/lib/buttons/info-box.js
CHANGED
|
@@ -11,8 +11,8 @@ var _draftJs = require("draft-js");
|
|
|
11
11
|
var _modals = require("@keystone-ui/modals");
|
|
12
12
|
var _select = require("./form/select");
|
|
13
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
|
-
function _getRequireWildcardCache(
|
|
15
|
-
function _interopRequireWildcard(
|
|
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); }
|
|
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
16
|
const disabledButtons = [_btNames.default.h2, _btNames.default.h3, _btNames.default.code, _btNames.default.codeBlock, _btNames.default.blockquote, _btNames.default.infoBox, _btNames.default.slideshow, _btNames.default.newsReading, _btNames.default.anchor];
|
|
17
17
|
var InfoBoxTypeEnum = /*#__PURE__*/function (InfoBoxTypeEnum) {
|
|
18
18
|
InfoBoxTypeEnum["newsChargeStation"] = "news-charge-station";
|
package/lib/buttons/link.js
CHANGED
|
@@ -8,8 +8,8 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
8
8
|
var _modals = require("@keystone-ui/modals");
|
|
9
9
|
var _draftJs = require("draft-js");
|
|
10
10
|
var _fields = require("@keystone-ui/fields");
|
|
11
|
-
function _getRequireWildcardCache(
|
|
12
|
-
function _interopRequireWildcard(
|
|
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; }
|
|
13
13
|
const styles = {
|
|
14
14
|
urlInput: {
|
|
15
15
|
fontFamily: "'Georgia', serif",
|
|
@@ -12,8 +12,8 @@ var _draftJs = require("draft-js");
|
|
|
12
12
|
var _modals = require("@keystone-ui/modals");
|
|
13
13
|
var _fields = require("@keystone-ui/fields");
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
function _getRequireWildcardCache(
|
|
16
|
-
function _interopRequireWildcard(
|
|
15
|
+
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); }
|
|
16
|
+
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; }
|
|
17
17
|
// @ts-ignore pkg does not have definition
|
|
18
18
|
|
|
19
19
|
async function fetchNewsReadingGroup(itemId) {
|
|
@@ -8,8 +8,8 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
8
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
9
|
var _fields = require("@keystone-ui/fields");
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
function _getRequireWildcardCache(
|
|
12
|
-
function _interopRequireWildcard(
|
|
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; }
|
|
13
13
|
const Label = _styledComponents.default.label`
|
|
14
14
|
display: block;
|
|
15
15
|
margin: 10px 0;
|
|
@@ -13,8 +13,8 @@ var _alignSelector = require("./align-selector");
|
|
|
13
13
|
var _searchBox = require("./search-box");
|
|
14
14
|
var _pagination = require("./pagination");
|
|
15
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
|
-
function _getRequireWildcardCache(
|
|
17
|
-
function _interopRequireWildcard(
|
|
16
|
+
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); }
|
|
17
|
+
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; }
|
|
18
18
|
const _ = {
|
|
19
19
|
debounce: _debounce.default
|
|
20
20
|
};
|
|
@@ -9,8 +9,8 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
9
9
|
var _button = require("@keystone-ui/button");
|
|
10
10
|
var _fields = require("@keystone-ui/fields");
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
function _getRequireWildcardCache(
|
|
13
|
-
function _interopRequireWildcard(
|
|
12
|
+
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); }
|
|
13
|
+
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; }
|
|
14
14
|
const SearchBoxWrapper = _styledComponents.default.div`
|
|
15
15
|
display: flex;
|
|
16
16
|
`;
|
package/lib/buttons/slideshow.js
CHANGED
|
@@ -7,8 +7,8 @@ exports.SlideshowButton = SlideshowButton;
|
|
|
7
7
|
var _react = _interopRequireWildcard(require("react"));
|
|
8
8
|
var _imageSelector = require("./selector/image-selector");
|
|
9
9
|
var _draftJs = require("draft-js");
|
|
10
|
-
function _getRequireWildcardCache(
|
|
11
|
-
function _interopRequireWildcard(
|
|
10
|
+
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); }
|
|
11
|
+
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; }
|
|
12
12
|
function SlideshowButton(props) {
|
|
13
13
|
const {
|
|
14
14
|
editorState,
|
package/lib/draft-editor.js
CHANGED
|
@@ -32,8 +32,7 @@ const styleSource = /*#__PURE__*/_react.default.createElement(_react.default.Fra
|
|
|
32
32
|
rel: "stylesheet",
|
|
33
33
|
type: "text/css"
|
|
34
34
|
}));
|
|
35
|
-
const decorator = new _draftJs.CompositeDecorator([_draftRenderer.annotationDecorator, _draftRenderer.linkDecorator]);
|
|
36
|
-
exports.decorator = decorator;
|
|
35
|
+
const decorator = exports.decorator = new _draftJs.CompositeDecorator([_draftRenderer.annotationDecorator, _draftRenderer.linkDecorator]);
|
|
37
36
|
class RichTextEditor extends _react.default.Component {
|
|
38
37
|
editorRef = null;
|
|
39
38
|
constructor(props) {
|
|
@@ -74,7 +73,6 @@ class RichTextEditor extends _react.default.Component {
|
|
|
74
73
|
mapKeyToEditorCommand = e => {
|
|
75
74
|
if (e.keyCode === 9 /* TAB */) {
|
|
76
75
|
const newEditorState = _draftJs.RichUtils.onTab(e, this.props.editorState, 4 /* maxDepth */);
|
|
77
|
-
|
|
78
76
|
if (newEditorState !== this.props.editorState) {
|
|
79
77
|
this.onChange(newEditorState);
|
|
80
78
|
}
|
|
@@ -243,7 +241,7 @@ class RichTextEditor extends _react.default.Component {
|
|
|
243
241
|
if (this.editorRef) {
|
|
244
242
|
var _this$editorRef;
|
|
245
243
|
// eslint-disable-next-line prettier/prettier
|
|
246
|
-
(_this$editorRef = this.editorRef) === null || _this$editorRef === void 0
|
|
244
|
+
(_this$editorRef = this.editorRef) === null || _this$editorRef === void 0 || _this$editorRef.focus();
|
|
247
245
|
}
|
|
248
246
|
}
|
|
249
247
|
}, /*#__PURE__*/_react.default.createElement(_draftJs.Editor, {
|
|
@@ -273,8 +271,7 @@ const InfoBoxButton = (0, _infoBox.createInfoBoxButton)({
|
|
|
273
271
|
});
|
|
274
272
|
const CustomAnnotationButton = (0, _buttons.withStyle)(AnnotationButton);
|
|
275
273
|
const CustomInfoBoxButton = (0, _buttons.withStyle)(InfoBoxButton);
|
|
276
|
-
var _default = {
|
|
274
|
+
var _default = exports.default = {
|
|
277
275
|
RichTextEditor,
|
|
278
276
|
decorator
|
|
279
|
-
};
|
|
280
|
-
exports.default = _default;
|
|
277
|
+
};
|
|
@@ -10,8 +10,8 @@ var _modals = require("@keystone-ui/modals");
|
|
|
10
10
|
var _fields = require("@keystone-ui/fields");
|
|
11
11
|
var _draftRenderer = require("@kids-reporter/draft-renderer");
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
function _getRequireWildcardCache(
|
|
14
|
-
function _interopRequireWildcard(
|
|
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
15
|
const AnchorWrapper = _styledComponents.default.span`
|
|
16
16
|
display: inline;
|
|
17
17
|
color: #8e8e8e;
|
|
@@ -105,8 +105,7 @@ const EditableAnchor = props => {
|
|
|
105
105
|
className: "fas fa-pen"
|
|
106
106
|
})), /*#__PURE__*/_react.default.createElement("span", null, children)));
|
|
107
107
|
};
|
|
108
|
-
const editableAnchorDecorator = {
|
|
108
|
+
const editableAnchorDecorator = exports.editableAnchorDecorator = {
|
|
109
109
|
strategy: _draftRenderer.findAnchorEntities,
|
|
110
110
|
component: EditableAnchor
|
|
111
|
-
};
|
|
112
|
-
exports.editableAnchorDecorator = editableAnchorDecorator;
|
|
111
|
+
};
|
package/lib/index.js
CHANGED
|
@@ -25,9 +25,8 @@ exports.default = void 0;
|
|
|
25
25
|
var _draftEditor = require("./draft-editor");
|
|
26
26
|
var _btNames = _interopRequireDefault(require("./buttons/bt-names"));
|
|
27
27
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
28
|
-
var _default = {
|
|
28
|
+
var _default = exports.default = {
|
|
29
29
|
RichTextEditor: _draftEditor.RichTextEditor,
|
|
30
30
|
buttonNames: _btNames.default,
|
|
31
31
|
decorator: _draftEditor.decorator
|
|
32
|
-
};
|
|
33
|
-
exports.default = _default;
|
|
32
|
+
};
|
package/lib/styled.js
CHANGED
|
@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.TextEditorWrapper = exports.EnlargeButtonWrapper = exports.DraftEditorWrapper = exports.DraftEditorControlsWrapper = exports.DraftEditorControls = exports.DraftEditorContainer = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
8
|
-
function _getRequireWildcardCache(
|
|
9
|
-
function _interopRequireWildcard(
|
|
10
|
-
const DraftEditorWrapper = _styledComponents.default.div`
|
|
8
|
+
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); }
|
|
9
|
+
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; }
|
|
10
|
+
const DraftEditorWrapper = exports.DraftEditorWrapper = _styledComponents.default.div`
|
|
11
11
|
/* Rich-editor default setting (.RichEditor-root)*/
|
|
12
12
|
background: #fff;
|
|
13
13
|
border: 1px solid #ddd;
|
|
@@ -25,14 +25,12 @@ const DraftEditorWrapper = _styledComponents.default.div`
|
|
|
25
25
|
border-radius: 6px;
|
|
26
26
|
padding: 0 1rem 1rem;
|
|
27
27
|
`;
|
|
28
|
-
exports.
|
|
29
|
-
const DraftEditorControls = _styledComponents.default.div`
|
|
28
|
+
const DraftEditorControls = exports.DraftEditorControls = _styledComponents.default.div`
|
|
30
29
|
padding-top: 1rem;
|
|
31
30
|
width: 100%;
|
|
32
31
|
background: rgb(255, 255, 255);
|
|
33
32
|
`;
|
|
34
|
-
exports.
|
|
35
|
-
const DraftEditorControlsWrapper = _styledComponents.default.div`
|
|
33
|
+
const DraftEditorControlsWrapper = exports.DraftEditorControlsWrapper = _styledComponents.default.div`
|
|
36
34
|
width: 100%;
|
|
37
35
|
position: relative;
|
|
38
36
|
display: flex;
|
|
@@ -41,16 +39,14 @@ const DraftEditorControlsWrapper = _styledComponents.default.div`
|
|
|
41
39
|
padding-right: 45px;
|
|
42
40
|
gap: 2px;
|
|
43
41
|
`;
|
|
44
|
-
exports.
|
|
45
|
-
const TextEditorWrapper = _styledComponents.default.div`
|
|
42
|
+
const TextEditorWrapper = exports.TextEditorWrapper = _styledComponents.default.div`
|
|
46
43
|
/* Rich-editor default setting (.RichEditor-editor)*/
|
|
47
44
|
border-top: 1px solid #ddd;
|
|
48
45
|
cursor: text;
|
|
49
46
|
font-size: 16px;
|
|
50
47
|
margin-top: 10px;
|
|
51
48
|
`;
|
|
52
|
-
exports.
|
|
53
|
-
const DraftEditorContainer = _styledComponents.default.div`
|
|
49
|
+
const DraftEditorContainer = exports.DraftEditorContainer = _styledComponents.default.div`
|
|
54
50
|
overflow-x: hidden;
|
|
55
51
|
position: relative;
|
|
56
52
|
margin-top: 4px;
|
|
@@ -94,11 +90,9 @@ const DraftEditorContainer = _styledComponents.default.div`
|
|
|
94
90
|
` : ''}
|
|
95
91
|
}
|
|
96
92
|
`;
|
|
97
|
-
exports.
|
|
98
|
-
const EnlargeButtonWrapper = _styledComponents.default.div`
|
|
93
|
+
const EnlargeButtonWrapper = exports.EnlargeButtonWrapper = _styledComponents.default.div`
|
|
99
94
|
position: absolute;
|
|
100
95
|
top: 0;
|
|
101
96
|
right: 0;
|
|
102
97
|
margin: 0;
|
|
103
|
-
`;
|
|
104
|
-
exports.EnlargeButtonWrapper = EnlargeButtonWrapper;
|
|
98
|
+
`;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kids-reporter/draft-editor",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.4",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
],
|
|
24
24
|
"license": "MIT",
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@kids-reporter/draft-renderer": "1.0.
|
|
26
|
+
"@kids-reporter/draft-renderer": "1.0.4",
|
|
27
27
|
"@twreporter/errors": "^1.1.2",
|
|
28
28
|
"draft-js": "^0.11.7"
|
|
29
29
|
},
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.InnerAnchorButton = void 0;
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _draftJs = require("draft-js");
|
|
9
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
-
// import { ANCHOR_ENTITY_TYPE } from '@kids-reporter/draft-renderer'
|
|
11
|
-
|
|
12
|
-
const InnerAnchorButton = props => {
|
|
13
|
-
const toggleEntity = _draftJs.RichUtils.toggleLink;
|
|
14
|
-
const {
|
|
15
|
-
isActive,
|
|
16
|
-
editorState,
|
|
17
|
-
onChange
|
|
18
|
-
} = props;
|
|
19
|
-
const promptForAnchor = e => {
|
|
20
|
-
e.preventDefault();
|
|
21
|
-
const selection = editorState.getSelection();
|
|
22
|
-
if (!selection.isCollapsed()) {
|
|
23
|
-
const contentState = editorState.getCurrentContent();
|
|
24
|
-
const startKey = selection.getStartKey();
|
|
25
|
-
const block = contentState.getBlockForKey(startKey);
|
|
26
|
-
const start = selection.getStartOffset();
|
|
27
|
-
const end = selection.getEndOffset();
|
|
28
|
-
const selectedText = block.getText().slice(start, end);
|
|
29
|
-
const contentStateWithEntity = contentState.createEntity('ANCHOR',
|
|
30
|
-
// TODO: ANCHOR_ENTITY_TYPE
|
|
31
|
-
'MUTABLE', {
|
|
32
|
-
anchorID: selectedText
|
|
33
|
-
});
|
|
34
|
-
const entityKey = contentStateWithEntity.getLastCreatedEntityKey();
|
|
35
|
-
const newEditorState = _draftJs.EditorState.set(editorState, {
|
|
36
|
-
currentContent: contentStateWithEntity
|
|
37
|
-
});
|
|
38
|
-
onChange(toggleEntity(newEditorState, newEditorState.getSelection(), entityKey));
|
|
39
|
-
}
|
|
40
|
-
};
|
|
41
|
-
const removeAnchor = () => {
|
|
42
|
-
const selection = editorState.getSelection();
|
|
43
|
-
if (!selection.isCollapsed()) {
|
|
44
|
-
onChange(toggleEntity(editorState, selection, null));
|
|
45
|
-
}
|
|
46
|
-
};
|
|
47
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
48
|
-
className: props.className,
|
|
49
|
-
onMouseDown: isActive ? removeAnchor : promptForAnchor,
|
|
50
|
-
title: "\u9328\u9EDE"
|
|
51
|
-
}, /*#__PURE__*/_react.default.createElement("span", null, "\u9328"));
|
|
52
|
-
};
|
|
53
|
-
exports.InnerAnchorButton = InnerAnchorButton;
|
|
@@ -1,110 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.editableInnerAnchorDecorator = void 0;
|
|
7
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
-
var _modals = require("@keystone-ui/modals");
|
|
10
|
-
var _fields = require("@keystone-ui/fields");
|
|
11
|
-
var _draftRenderer = require("@kids-reporter/draft-renderer");
|
|
12
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
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); }
|
|
14
|
-
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; }
|
|
15
|
-
const AnchorWrapper = _styledComponents.default.span`
|
|
16
|
-
display: inline;
|
|
17
|
-
color: #8e8e8e;
|
|
18
|
-
&::before {
|
|
19
|
-
content: '[';
|
|
20
|
-
}
|
|
21
|
-
&::after {
|
|
22
|
-
content: ']';
|
|
23
|
-
}
|
|
24
|
-
`;
|
|
25
|
-
const AnchorEditButton = _styledComponents.default.div`
|
|
26
|
-
display: inline;
|
|
27
|
-
cursor: pointer;
|
|
28
|
-
&::before {
|
|
29
|
-
content: '索引:${props => props.anchorLabel !== undefined ? `(${props.anchorLabel}) ` : ''}';
|
|
30
|
-
}
|
|
31
|
-
`;
|
|
32
|
-
const StyledTextInput = (0, _styledComponents.default)(_fields.TextInput)`
|
|
33
|
-
margin: 10px;
|
|
34
|
-
`;
|
|
35
|
-
const AnchorLabelEditor = props => {
|
|
36
|
-
const {
|
|
37
|
-
isOpen,
|
|
38
|
-
anchorLabelValue,
|
|
39
|
-
onConfirm,
|
|
40
|
-
onCancel
|
|
41
|
-
} = props;
|
|
42
|
-
const [anchorLabel, setTOCLabel] = (0, _react.useState)(anchorLabelValue);
|
|
43
|
-
return /*#__PURE__*/_react.default.createElement(_modals.AlertDialog, {
|
|
44
|
-
title: "\u7DE8\u8F2F\u9328\u9EDE\u6587\u5B57(ID): \u6CE8\u610F\uFF01\u540C\u7BC7\u6587\u7AE0ID\u4E0D\u53EF\u91CD\u8907\uFF01",
|
|
45
|
-
isOpen: isOpen,
|
|
46
|
-
actions: {
|
|
47
|
-
cancel: {
|
|
48
|
-
label: 'Cancel',
|
|
49
|
-
action: () => onCancel()
|
|
50
|
-
},
|
|
51
|
-
confirm: {
|
|
52
|
-
label: 'Confirm',
|
|
53
|
-
action: () => onConfirm(anchorLabel)
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
}, /*#__PURE__*/_react.default.createElement(StyledTextInput, {
|
|
57
|
-
placeholder: "\u9328\u9EDE\u6587\u5B57(ID)",
|
|
58
|
-
type: "text",
|
|
59
|
-
value: anchorLabel,
|
|
60
|
-
onChange: e => setTOCLabel(e.target.value)
|
|
61
|
-
}));
|
|
62
|
-
};
|
|
63
|
-
const EditableAnchor = props => {
|
|
64
|
-
var _contentState$getEnti;
|
|
65
|
-
const {
|
|
66
|
-
children,
|
|
67
|
-
contentState,
|
|
68
|
-
entityKey
|
|
69
|
-
} = props;
|
|
70
|
-
const tocContent = props.decoratedText;
|
|
71
|
-
const [isModalOpen, setIsModalOpen] = (0, _react.useState)(false);
|
|
72
|
-
const [anchorID, setAnchorID] = (0, _react.useState)(contentState === null || contentState === void 0 || (_contentState$getEnti = contentState.getEntity(entityKey)) === null || _contentState$getEnti === void 0 || (_contentState$getEnti = _contentState$getEnti.getData()) === null || _contentState$getEnti === void 0 ? void 0 : _contentState$getEnti.anchorID);
|
|
73
|
-
(0, _react.useEffect)(() => {
|
|
74
|
-
var _contentState$getEnti2;
|
|
75
|
-
setAnchorID((_contentState$getEnti2 = contentState.getEntity(entityKey).getData()) === null || _contentState$getEnti2 === void 0 ? void 0 : _contentState$getEnti2.anchorID);
|
|
76
|
-
});
|
|
77
|
-
const onAnchorIDChange = anchorID => {
|
|
78
|
-
setIsModalOpen(false);
|
|
79
|
-
setAnchorID(anchorID);
|
|
80
|
-
props.onEditFinish({
|
|
81
|
-
entityKey,
|
|
82
|
-
entityData: {
|
|
83
|
-
anchorID: anchorID
|
|
84
|
-
}
|
|
85
|
-
});
|
|
86
|
-
};
|
|
87
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isModalOpen && /*#__PURE__*/_react.default.createElement(AnchorLabelEditor, {
|
|
88
|
-
isOpen: isModalOpen,
|
|
89
|
-
anchorLabelValue: anchorID,
|
|
90
|
-
onConfirm: onAnchorIDChange,
|
|
91
|
-
onCancel: () => {
|
|
92
|
-
setIsModalOpen(false);
|
|
93
|
-
props.onEditFinish();
|
|
94
|
-
}
|
|
95
|
-
}), /*#__PURE__*/_react.default.createElement(AnchorWrapper, null, /*#__PURE__*/_react.default.createElement(AnchorEditButton, {
|
|
96
|
-
anchorLabel: anchorID !== tocContent ? anchorID : undefined,
|
|
97
|
-
onClick: e => {
|
|
98
|
-
e.preventDefault();
|
|
99
|
-
setIsModalOpen(true);
|
|
100
|
-
props.onEditStart();
|
|
101
|
-
}
|
|
102
|
-
}, /*#__PURE__*/_react.default.createElement("i", {
|
|
103
|
-
className: "fas fa-pen"
|
|
104
|
-
})), /*#__PURE__*/_react.default.createElement("span", null, children)));
|
|
105
|
-
};
|
|
106
|
-
const editableInnerAnchorDecorator = {
|
|
107
|
-
strategy: _draftRenderer.findAnchorEntities,
|
|
108
|
-
component: EditableAnchor
|
|
109
|
-
};
|
|
110
|
-
exports.editableInnerAnchorDecorator = editableInnerAnchorDecorator;
|