@kids-reporter/draft-editor 1.0.16 → 1.0.18

package/lib/buttons/annotation.js

@@ -4,12 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AnnotationButton = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _draftJs = require("draft-js");
 var _draftRenderer = require("@kids-reporter/draft-renderer");
+var _draftJs = require("draft-js");
+var _react = require("react");
 var _annotation = require("../entity-decorators/annotation");
-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); }
-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; }
+var _jsxRuntime = require("react/jsx-runtime");
 const AnnotationButton = props => {
   const toggleEntity = _draftJs.RichUtils.toggleLink;
   const {
@@ -48,16 +47,21 @@ const AnnotationButton = props => {
     setToShowInput(false);
     props.onEditFinish();
   };
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, toShowInput && /*#__PURE__*/_react.default.createElement(_annotation.AnnotationEditor, {
-    isOpen: toShowInput,
-    editorStateValue: _draftJs.EditorState.createEmpty(),
-    onConfirm: confirmAnnotation,
-    onCancel: removeAnnotation
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: props.className,
-    onMouseDown: isActive ? removeAnnotation : promptForAnnotation
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "far"
-  }), /*#__PURE__*/_react.default.createElement("span", null, "Annotation")));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [toShowInput && /*#__PURE__*/(0, _jsxRuntime.jsx)(_annotation.AnnotationEditor, {
+      isOpen: toShowInput,
+      editorStateValue: _draftJs.EditorState.createEmpty(),
+      onConfirm: confirmAnnotation,
+      onCancel: removeAnnotation
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: props.className,
+      onMouseDown: isActive ? removeAnnotation : promptForAnnotation,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+        className: "far"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: "Annotation"
+      })]
+    })]
+  });
 };
 exports.AnnotationButton = AnnotationButton;

package/lib/buttons/bg-color.js

@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.BackgroundColorButton = BackgroundColorButton;
 exports.customStylePrefix = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _fields = require("@keystone-ui/fields");
 var _modals = require("@keystone-ui/modals");
 var _draftJs = require("draft-js");
-var _fields = require("@keystone-ui/fields");
+var _react = _interopRequireWildcard(require("react"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
 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; }
@@ -69,7 +70,7 @@ function BackgroundColorButton(props) {
     setColorValue('');
     props.onEditFinish();
   };
-  const colorInput = /*#__PURE__*/_react.default.createElement(_modals.AlertDialog, {
+  const colorInput = /*#__PURE__*/(0, _jsxRuntime.jsx)(_modals.AlertDialog, {
     title: "Hex Color Code (#ffffff)",
     isOpen: toShowColorInput,
     actions: {
@@ -81,24 +82,31 @@ function BackgroundColorButton(props) {
         label: 'Confirm',
         action: confirmColor
       }
-    }
-  }, /*#__PURE__*/_react.default.createElement(ColorHexInput, {
-    onChange: e => setColorValue(e.target.value),
-    type: "text",
-    value: colorValue,
-    onKeyDown: onColorInputKeyDown
-  }));
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, colorInput, /*#__PURE__*/_react.default.createElement("div", {
-    className: props.className,
-    onMouseDown: isActive ? removeColor : promptForColor
-  }, /*#__PURE__*/_react.default.createElement("svg", {
-    width: "16",
-    height: "14",
-    viewBox: "0 0 16 14",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, /*#__PURE__*/_react.default.createElement("path", {
-    d: "M3.74443 8.75V6.78945C3.74443 6.37109 3.98306 5.98008 4.34542 5.73125L12.3911 0.229633C12.6091 0.0804726 12.8477 0 13.1453 0C13.4811 0 13.8022 0.124113 14.0409 0.345078L15.6553 1.84242C15.8939 2.06336 16 2.36305 16 2.67531C16 2.92578 15.9411 3.14727 15.779 3.37422L9.85159 10.8418C9.5835 11.1781 9.1357 11.375 8.71147 11.375H6.57264L5.85086 12.0695C5.4826 12.4113 4.8875 12.4113 4.51924 12.0695L3.02265 10.6805C2.65439 10.3387 2.65439 9.78633 3.02265 9.44453L3.74443 8.75ZM13.9466 2.73219L13.0834 1.9302L6.74646 6.26172L9.25354 8.58867L13.9466 2.73219ZM0.207107 12.7504L2.064 11.0277L4.14509 12.9582L3.23182 13.784C3.09925 13.9316 2.91954 14 2.73099 14H0.707052C0.3167 14 0 13.7074 0 13.3438V13.2152C0 13.0184 0.0745351 12.8734 0.207107 12.7504Z",
-    fill: isActive ? '#ED8B00' : '#6b7280'
-  })), /*#__PURE__*/_react.default.createElement("span", null, " Highlight")));
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ColorHexInput, {
+      onChange: e => setColorValue(e.target.value),
+      type: "text",
+      value: colorValue,
+      onKeyDown: onColorInputKeyDown
+    })
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
+    children: [colorInput, /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: props.className,
+      onMouseDown: isActive ? removeColor : promptForColor,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
+        width: "16",
+        height: "14",
+        viewBox: "0 0 16 14",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+          d: "M3.74443 8.75V6.78945C3.74443 6.37109 3.98306 5.98008 4.34542 5.73125L12.3911 0.229633C12.6091 0.0804726 12.8477 0 13.1453 0C13.4811 0 13.8022 0.124113 14.0409 0.345078L15.6553 1.84242C15.8939 2.06336 16 2.36305 16 2.67531C16 2.92578 15.9411 3.14727 15.779 3.37422L9.85159 10.8418C9.5835 11.1781 9.1357 11.375 8.71147 11.375H6.57264L5.85086 12.0695C5.4826 12.4113 4.8875 12.4113 4.51924 12.0695L3.02265 10.6805C2.65439 10.3387 2.65439 9.78633 3.02265 9.44453L3.74443 8.75ZM13.9466 2.73219L13.0834 1.9302L6.74646 6.26172L9.25354 8.58867L13.9466 2.73219ZM0.207107 12.7504L2.064 11.0277L4.14509 12.9582L3.23182 13.784C3.09925 13.9316 2.91954 14 2.73099 14H0.707052C0.3167 14 0 13.7074 0 13.3438V13.2152C0 13.0184 0.0745351 12.8734 0.207107 12.7504Z",
+          fill: isActive ? '#ED8B00' : '#6b7280'
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: " Highlight"
+      })]
+    })]
+  });
 }

package/lib/buttons/blockquote.js

@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.BlockquoteButton = BlockquoteButton;
 exports.BlockquoteInput = BlockquoteInput;
-var _react = _interopRequireWildcard(require("react"));
-var _draftJs = require("draft-js");
+var _fields = require("@keystone-ui/fields");
 var _modals = require("@keystone-ui/modals");
+var _draftJs = require("draft-js");
+var _react = _interopRequireWildcard(require("react"));
 var _select = require("./form/select");
-var _fields = require("@keystone-ui/fields");
+var _jsxRuntime = require("react/jsx-runtime");
 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); }
 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; }
 var BlockquoteTypeEnum = /*#__PURE__*/function (BlockquoteTypeEnum) {
@@ -32,50 +33,52 @@ function BlockquoteInput({
   const confirmInput = () => {
     onConfirm(inputValueState);
   };
-  return /*#__PURE__*/_react.default.createElement(_modals.DrawerController, {
-    isOpen: isOpen
-  }, /*#__PURE__*/_react.default.createElement(_modals.Drawer, {
-    title: "\u5F15\u8A00"
-    //isOpen={toShowInput}
-    ,
-    actions: {
-      cancel: {
-        label: 'Cancel',
-        action: onCancel
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_modals.DrawerController, {
+    isOpen: isOpen,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_modals.Drawer, {
+      title: "\u5F15\u8A00"
+      //isOpen={toShowInput}
+      ,
+      actions: {
+        cancel: {
+          label: 'Cancel',
+          action: onCancel
+        },
+        confirm: {
+          label: 'Confirm',
+          action: confirmInput
+        }
       },
-      confirm: {
-        label: 'Confirm',
-        action: confirmInput
-      }
-    }
-  }, /*#__PURE__*/_react.default.createElement(_select.Select, {
-    title: "\u7248\u578B",
-    value: inputValueState.type,
-    options: [{
-      label: BlockquoteLabelEnum.borderLeft,
-      value: BlockquoteTypeEnum.borderLeft
-    }, {
-      label: BlockquoteLabelEnum.quoteLeft,
-      value: BlockquoteTypeEnum.quoteLeft
-    }],
-    onChange: blockquoteType => {
-      setInputValueState({
-        type: blockquoteType,
-        text: inputValueState.text
-      });
-    }
-  }), /*#__PURE__*/_react.default.createElement(_fields.TextArea, {
-    onChange: e => setInputValueState({
-      type: inputValueState.type,
-      text: e.target.value
-    }),
-    placeholder: "\u5F15\u8A00\u6587\u5B57",
-    type: "text",
-    value: inputValueState.text,
-    style: {
-      marginBottom: '30px'
-    }
-  })));
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_select.Select, {
+        title: "\u7248\u578B",
+        value: inputValueState.type,
+        options: [{
+          label: BlockquoteLabelEnum.borderLeft,
+          value: BlockquoteTypeEnum.borderLeft
+        }, {
+          label: BlockquoteLabelEnum.quoteLeft,
+          value: BlockquoteTypeEnum.quoteLeft
+        }],
+        onChange: blockquoteType => {
+          setInputValueState({
+            type: blockquoteType,
+            text: inputValueState.text
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_fields.TextArea, {
+        onChange: e => setInputValueState({
+          type: inputValueState.type,
+          text: e.target.value
+        }),
+        placeholder: "\u5F15\u8A00\u6587\u5B57",
+        type: "text",
+        value: inputValueState.text,
+        style: {
+          marginBottom: '30px'
+        }
+      })]
+    })
+  });
 }
 function BlockquoteButton(props) {
   const {
@@ -103,20 +106,23 @@ function BlockquoteButton(props) {
   const onInputCancel = () => {
     setIsInputOpen(false);
   };
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isInputOpen && /*#__PURE__*/_react.default.createElement(BlockquoteInput, {
-    isOpen: isInputOpen,
-    onConfirm: onInputChange,
-    onCancel: onInputCancel,
-    inputValue: {
-      type: BlockquoteTypeEnum.borderLeft,
-      text: ''
-    }
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    onClick: () => {
-      promptForInput();
-    },
-    className: className
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "fas fa-quote-left"
-  })));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
+    children: [isInputOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockquoteInput, {
+      isOpen: isInputOpen,
+      onConfirm: onInputChange,
+      onCancel: onInputCancel,
+      inputValue: {
+        type: BlockquoteTypeEnum.borderLeft,
+        text: ''
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      onClick: () => {
+        promptForInput();
+      },
+      className: className,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+        className: "fas fa-quote-left"
+      })
+    })]
+  });
 }

package/lib/buttons/control-buttons.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.buttonStyle = exports.InlineStyleControls = exports.BlockStyleControls = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _jsxRuntime = require("react/jsx-runtime");
 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); }
 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; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -68,14 +69,17 @@ class StyleButton extends _react.default.Component {
     this.props.onToggle(this.props.style);
   };
   render() {
-    return /*#__PURE__*/_react.default.createElement(CustomButton, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(CustomButton, {
       isDisabled: this.props.isDisabled,
       isActive: this.props.active,
       onMouseDown: this.onToggle,
-      readOnly: this.props.readOnly
-    }, this.props.icon && /*#__PURE__*/_react.default.createElement("i", {
-      className: this.props.icon
-    }), /*#__PURE__*/_react.default.createElement("span", null, !this.props.icon ? this.props.label : ''));
+      readOnly: this.props.readOnly,
+      children: [this.props.icon && /*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+        className: this.props.icon
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: !this.props.icon ? this.props.label : ''
+      })]
+    });
   }
 }
 const blockStyles = [{
@@ -114,16 +118,17 @@ const BlockStyleControls = props => {
   } = props;
   const selection = editorState.getSelection();
   const blockType = editorState.getCurrentContent().getBlockForKey(selection.getStartKey()).getType();
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, blockStyles.map(type => /*#__PURE__*/_react.default.createElement(StyleButton, {
-    isDisabled: disabledButtons.includes(type.style),
-    key: type.label,
-    active: type.style === blockType,
-    label: type.label,
-    onToggle: props.onToggle,
-    style: type.style,
-    icon: type.icon,
-    readOnly: props.readOnly
-  })));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.default.Fragment, {
+    children: blockStyles.map(type => /*#__PURE__*/(0, _jsxRuntime.jsx)(StyleButton, {
+      isDisabled: disabledButtons.includes(type.style),
+      active: type.style === blockType,
+      label: type.label,
+      onToggle: props.onToggle,
+      style: type.style,
+      icon: type.icon,
+      readOnly: props.readOnly
+    }, type.label))
+  });
 };
 exports.BlockStyleControls = BlockStyleControls;
 const inlineStyles = [{
@@ -145,15 +150,16 @@ const inlineStyles = [{
 }];
 const InlineStyleControls = props => {
   const currentStyle = props.editorState.getCurrentInlineStyle();
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, inlineStyles.map(type => /*#__PURE__*/_react.default.createElement(StyleButton, {
-    isDisabled: props.disabledButtons.includes(type.style.toLowerCase()),
-    key: type.label,
-    active: currentStyle.has(type.style),
-    label: type.label,
-    onToggle: props.onToggle,
-    style: type.style,
-    icon: type.icon,
-    readOnly: props.readOnly
-  })));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.default.Fragment, {
+    children: inlineStyles.map(type => /*#__PURE__*/(0, _jsxRuntime.jsx)(StyleButton, {
+      isDisabled: props.disabledButtons.includes(type.style.toLowerCase()),
+      active: currentStyle.has(type.style),
+      label: type.label,
+      onToggle: props.onToggle,
+      style: type.style,
+      icon: type.icon,
+      readOnly: props.readOnly
+    }, type.label))
+  });
 };
 exports.InlineStyleControls = InlineStyleControls;

package/lib/buttons/divider.js

@@ -4,9 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DividerButton = DividerButton;
-var _react = _interopRequireDefault(require("react"));
 var _draftJs = require("draft-js");
+var _react = _interopRequireDefault(require("react"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const IconWrapper = _styledComponents.default.span`
   display: inline-block;
@@ -31,24 +32,31 @@ function DividerButton(props) {
     // If you set an empty string, you will get an error: Unknown DraftEntity key: null
     onChange(_draftJs.AtomicBlockUtils.insertAtomicBlock(newEditorState, entityKey, ' '));
   };
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    onClick: onClick,
-    className: className
-  }, /*#__PURE__*/_react.default.createElement(IconWrapper, null, /*#__PURE__*/_react.default.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    height: "16",
-    viewBox: "0 0 16 16",
-    width: "16"
-  }, /*#__PURE__*/_react.default.createElement("g", {
-    fill: "none",
-    fillRule: "evenodd"
-  }, /*#__PURE__*/_react.default.createElement("path", {
-    d: "M0 0h16v16H0z"
-  }), /*#__PURE__*/_react.default.createElement("path", {
-    d: "M15 10.501a0.5 0.5 0 0 1 0.496 0.442l0.004 0.059v2.031a2.468 2.468 0 0 1 -2.361 2.466l-0.107 0.003H2.967a2.467 2.467 0 0 1 -2.465 -2.36L0.5 13.032v-2.03a0.5 0.5 0 0 1 0.997 -0.058l0.004 0.059v2.03a1.468 1.468 0 0 0 1.381 1.464l0.086 0.003h10.065a1.468 1.468 0 0 0 1.466 -1.382l0.003 -0.086v-2.031a0.5 0.5 0 0 1 0.5 -0.5zM15.5 7.5a0.5 0.5 0 0 1 0 1H0.5a0.5 0.5 0 0 1 0 -1zM13.029 0.5a2.471 2.471 0 0 1 2.469 2.364l0.003 0.107v2.031a0.5 0.5 0 0 1 -0.997 0.058L14.5 5.003V2.971a1.471 1.471 0 0 0 -1.385 -1.468L13.029 1.5H2.97a1.47 1.47 0 0 0 -1.467 1.383L1.5 2.97V5a0.5 0.5 0 0 1 -0.997 0.058L0.5 5V2.97a2.47 2.47 0 0 1 2.362 -2.467L2.97 0.5z",
-    fill: "#6b7280",
-    fillRule: "nonzero",
-    stroke: "#6b7280",
-    strokeWidth: "0.5"
-  }))))));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.default.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      onClick: onClick,
+      className: className,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconWrapper, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          height: "16",
+          viewBox: "0 0 16 16",
+          width: "16",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("g", {
+            fill: "none",
+            fillRule: "evenodd",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+              d: "M0 0h16v16H0z"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+              d: "M15 10.501a0.5 0.5 0 0 1 0.496 0.442l0.004 0.059v2.031a2.468 2.468 0 0 1 -2.361 2.466l-0.107 0.003H2.967a2.467 2.467 0 0 1 -2.465 -2.36L0.5 13.032v-2.03a0.5 0.5 0 0 1 0.997 -0.058l0.004 0.059v2.03a1.468 1.468 0 0 0 1.381 1.464l0.086 0.003h10.065a1.468 1.468 0 0 0 1.466 -1.382l0.003 -0.086v-2.031a0.5 0.5 0 0 1 0.5 -0.5zM15.5 7.5a0.5 0.5 0 0 1 0 1H0.5a0.5 0.5 0 0 1 0 -1zM13.029 0.5a2.471 2.471 0 0 1 2.469 2.364l0.003 0.107v2.031a0.5 0.5 0 0 1 -0.997 0.058L14.5 5.003V2.971a1.471 1.471 0 0 0 -1.385 -1.468L13.029 1.5H2.97a1.47 1.47 0 0 0 -1.467 1.383L1.5 2.97V5a0.5 0.5 0 0 1 -0.997 0.058L0.5 5V2.97a2.47 2.47 0 0 1 2.362 -2.467L2.97 0.5z",
+              fill: "#6b7280",
+              fillRule: "nonzero",
+              stroke: "#6b7280",
+              strokeWidth: "0.5"
+            })]
+          })
+        })
+      })
+    })
+  });
 }

package/lib/buttons/embedded-code.js

@@ -5,12 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.EmbeddedCodeButton = EmbeddedCodeButton;
 exports.EmbeddedCodeInput = EmbeddedCodeInput;
-var _react = _interopRequireWildcard(require("react"));
+var _fields = require("@keystone-ui/fields");
+var _modals = require("@keystone-ui/modals");
 var _draftJs = require("draft-js");
+var _react = _interopRequireWildcard(require("react"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _modals = require("@keystone-ui/modals");
-var _fields = require("@keystone-ui/fields");
 var _alignSelector = require("./selector/align-selector");
+var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
 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; }
@@ -42,67 +43,69 @@ function EmbeddedCodeInput({
     onConfirm(inputValueState);
   };
   const onAlignSelectOpen = () => {
-    var _contentWrapperRef$cu;
-    const scrollWrapper = (_contentWrapperRef$cu = contentWrapperRef.current) === null || _contentWrapperRef$cu === void 0 ? void 0 : _contentWrapperRef$cu.parentElement;
+    const scrollWrapper = contentWrapperRef.current?.parentElement;
     if (scrollWrapper) {
-      scrollWrapper.scrollTop = scrollWrapper === null || scrollWrapper === void 0 ? void 0 : scrollWrapper.scrollHeight;
+      scrollWrapper.scrollTop = scrollWrapper?.scrollHeight;
     }
   };
-  return /*#__PURE__*/_react.default.createElement(_modals.DrawerController, {
-    isOpen: isOpen
-  }, /*#__PURE__*/_react.default.createElement(_modals.Drawer, {
-    title: "\u9472\u5D4C\u7A0B\u5F0F\u78BC\uFF08Embedded Code\uFF09"
-    //isOpen={toShowInput}
-    ,
-    actions: {
-      cancel: {
-        label: 'Cancel',
-        action: onCancel
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_modals.DrawerController, {
+    isOpen: isOpen,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_modals.Drawer, {
+      title: "\u9472\u5D4C\u7A0B\u5F0F\u78BC\uFF08Embedded Code\uFF09"
+      //isOpen={toShowInput}
+      ,
+      actions: {
+        cancel: {
+          label: 'Cancel',
+          action: onCancel
+        },
+        confirm: {
+          label: 'Confirm',
+          action: confirmInput
+        }
       },
-      confirm: {
-        label: 'Confirm',
-        action: confirmInput
-      }
-    }
-  }, /*#__PURE__*/_react.default.createElement(Container, {
-    ref: contentWrapperRef
-  }, /*#__PURE__*/_react.default.createElement(_fields.TextArea, {
-    onChange: e => setInputValue({
-      caption: inputValueState.caption,
-      align: inputValueState.align,
-      embeddedCode: e.target.value
-    }),
-    placeholder: "Embedded Code",
-    type: "text",
-    value: inputValueState.embeddedCode,
-    style: {
-      marginBottom: '30px'
-    }
-  }), /*#__PURE__*/_react.default.createElement(_fields.TextInput, {
-    onChange: e => setInputValue({
-      caption: e.target.value,
-      align: inputValueState.align,
-      embeddedCode: inputValueState.embeddedCode
-    }),
-    type: "text",
-    placeholder: "Caption",
-    value: inputValueState.caption,
-    style: {
-      marginBottom: '10px',
-      marginTop: '30px'
-    }
-  }), /*#__PURE__*/_react.default.createElement(_alignSelector.AlignSelector, {
-    align: inputValueState.align,
-    options: options,
-    onChange: align => {
-      setInputValue({
-        caption: inputValueState.caption,
-        align: align,
-        embeddedCode: inputValueState.embeddedCode
-      });
-    },
-    onOpen: onAlignSelectOpen
-  }))));
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
+        ref: contentWrapperRef,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_fields.TextArea, {
+          onChange: e => setInputValue({
+            caption: inputValueState.caption,
+            align: inputValueState.align,
+            embeddedCode: e.target.value
+          }),
+          placeholder: "Embedded Code",
+          type: "text",
+          value: inputValueState.embeddedCode,
+          style: {
+            marginBottom: '30px'
+          }
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_fields.TextInput, {
+          onChange: e => setInputValue({
+            caption: e.target.value,
+            align: inputValueState.align,
+            embeddedCode: inputValueState.embeddedCode
+          }),
+          type: "text",
+          placeholder: "Caption",
+          value: inputValueState.caption,
+          style: {
+            marginBottom: '10px',
+            marginTop: '30px'
+          }
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_alignSelector.AlignSelector, {
+          align: inputValueState.align,
+          options: options,
+          onChange: align => {
+            setInputValue({
+              caption: inputValueState.caption,
+              align: align,
+              embeddedCode: inputValueState.embeddedCode
+            });
+          },
+          onOpen: onAlignSelectOpen
+        })]
+      })
+    })
+  });
 }
 function EmbeddedCodeButton(props) {
   const {
@@ -130,20 +133,25 @@ function EmbeddedCodeButton(props) {
   const onInputCancel = () => {
     setIsInputOpen(false);
   };
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isInputOpen && /*#__PURE__*/_react.default.createElement(EmbeddedCodeInput, {
-    isOpen: isInputOpen,
-    onConfirm: onInputChange,
-    onCancel: onInputCancel,
-    inputValue: {
-      caption: '',
-      embeddedCode: ''
-    }
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    onClick: () => {
-      promptForInput();
-    },
-    className: className
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "far"
-  }), /*#__PURE__*/_react.default.createElement("span", null, "Embed")));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.default.Fragment, {
+    children: [isInputOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(EmbeddedCodeInput, {
+      isOpen: isInputOpen,
+      onConfirm: onInputChange,
+      onCancel: onInputCancel,
+      inputValue: {
+        caption: '',
+        embeddedCode: ''
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      onClick: () => {
+        promptForInput();
+      },
+      className: className,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("i", {
+        className: "far"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: "Embed"
+      })]
+    })]
+  });
 }