@pie-lib/editable-html 12.1.0-next.2 → 12.1.0-next.5

package/lib/plugins/toolbar/editor-and-toolbar.js

@@ -0,0 +1,258 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.EditorAndToolbar = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _toolbar = _interopRequireDefault(require("./toolbar"));
+var _debug = _interopRequireDefault(require("debug"));
+var _theme = require("../../theme");
+var _styles = require("@mui/material/styles");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _slatePropTypes = _interopRequireDefault(require("slate-prop-types"));
+var _renderUi = require("@pie-lib/render-ui");
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var log = (0, _debug["default"])('@pie-lib:editable-html:plugins:toolbar:editor-and-toolbar');
+var Root = (0, _styles.styled)('div', {
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return !['noBorder', 'error'].includes(prop);
+  }
+})(function (_ref) {
+  var theme = _ref.theme,
+    noBorder = _ref.noBorder,
+    error = _ref.error;
+  return {
+    position: 'relative',
+    padding: '0px',
+    border: noBorder ? 'none' : '1px solid #ccc',
+    borderRadius: '4px',
+    cursor: 'text',
+    borderColor: error ? "".concat(theme.palette.error.main, " !important") : undefined,
+    borderWidth: error ? '2px !important' : undefined,
+    '& [data-slate-editor="true"]': {
+      wordBreak: 'break-word',
+      overflow: 'visible',
+      maxHeight: '500px',
+      // needed in order to be able to put the focus before a void element when it is the first one in the editor
+      padding: '5px'
+    }
+  };
+});
+var EditorHolder = (0, _styles.styled)('div', {
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return !['inFocus', 'readOnly', 'disableUnderline', 'disableScrollbar'].includes(prop);
+  }
+})(function (_ref2) {
+  var theme = _ref2.theme,
+    inFocus = _ref2.inFocus,
+    readOnly = _ref2.readOnly,
+    disableUnderline = _ref2.disableUnderline,
+    disableScrollbar = _ref2.disableScrollbar;
+  return _objectSpread(_objectSpread(_objectSpread(_objectSpread({
+    position: 'relative',
+    padding: '0px',
+    overflowY: 'auto',
+    color: _renderUi.color.text(),
+    backgroundColor: _renderUi.color.background()
+  }, disableScrollbar && {
+    '&::-webkit-scrollbar': {
+      display: 'none'
+    },
+    scrollbarWidth: 'none',
+    '-ms-overflow-style': 'none'
+  }), !disableUnderline && {
+    '&::before': {
+      left: '0',
+      right: '0',
+      bottom: '0',
+      height: '1px',
+      content: '""',
+      position: 'absolute',
+      transition: 'background-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms',
+      pointerEvents: 'none',
+      backgroundColor: 'rgba(0, 0, 0, 0.42)'
+    },
+    '&::after': {
+      left: '0',
+      right: '0',
+      bottom: '0',
+      height: '1px',
+      content: '""',
+      position: 'absolute',
+      transform: 'scaleX(0)',
+      transition: 'transform 200ms cubic-bezier(0.0, 0.0, 0.2, 1) 0ms, background-color 200ms linear',
+      backgroundColor: 'rgba(0, 0, 0, 0.42)'
+    },
+    '&:focus': {
+      '&::after': {
+        transform: 'scaleX(1)',
+        backgroundColor: _theme.primary,
+        height: '2px'
+      }
+    },
+    '&:hover': {
+      '&::after': {
+        transform: 'scaleX(1)',
+        backgroundColor: theme.palette.common.black,
+        height: '2px'
+      }
+    }
+  }), readOnly && {
+    '&::before': {
+      background: 'transparent',
+      backgroundSize: '5px 1px',
+      backgroundImage: 'linear-gradient(to right, rgba(0, 0, 0, 0.42) 33%, transparent 0%)',
+      backgroundRepeat: 'repeat-x',
+      backgroundPosition: 'left top'
+    },
+    '&::after': {
+      left: '0',
+      right: '0',
+      bottom: '0',
+      height: '1px',
+      content: '""',
+      position: 'absolute',
+      transform: 'scaleX(0)',
+      transition: 'transform 200ms cubic-bezier(0.0, 0.0, 0.2, 1) 0ms, background-color 0ms linear',
+      backgroundColor: 'rgba(0, 0, 0, 0)'
+    },
+    '&:hover': {
+      '&::after': {
+        transform: 'scaleX(0)',
+        backgroundColor: theme.palette.common.black,
+        height: '2px'
+      }
+    }
+  }), inFocus && {
+    '&::after': {
+      transform: 'scaleX(1)',
+      backgroundColor: _theme.primary,
+      height: '2px'
+    },
+    '&:hover': {
+      '&::after': {
+        backgroundColor: _theme.primary
+      }
+    }
+  });
+});
+var ChildrenContainer = (0, _styles.styled)('div', {
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return !['noPadding'].includes(prop);
+  }
+})(function (_ref3) {
+  var noPadding = _ref3.noPadding;
+  return {
+    padding: noPadding ? 0 : '10px 16px'
+  };
+});
+var EditorAndToolbar = exports.EditorAndToolbar = /*#__PURE__*/function (_React$Component) {
+  function EditorAndToolbar() {
+    (0, _classCallCheck2["default"])(this, EditorAndToolbar);
+    return _callSuper(this, EditorAndToolbar, arguments);
+  }
+  (0, _inherits2["default"])(EditorAndToolbar, _React$Component);
+  return (0, _createClass2["default"])(EditorAndToolbar, [{
+    key: "render",
+    value: function render() {
+      var _this = this;
+      var _this$props = this.props,
+        children = _this$props.children,
+        value = _this$props.value,
+        plugins = _this$props.plugins,
+        onChange = _this$props.onChange,
+        getFocusedValue = _this$props.getFocusedValue,
+        onDone = _this$props.onDone,
+        focusedNode = _this$props.focusedNode,
+        autoWidth = _this$props.autoWidth,
+        readOnly = _this$props.readOnly,
+        disableScrollbar = _this$props.disableScrollbar,
+        disableUnderline = _this$props.disableUnderline,
+        pluginProps = _this$props.pluginProps,
+        toolbarOpts = _this$props.toolbarOpts,
+        onDataChange = _this$props.onDataChange,
+        toolbarRef = _this$props.toolbarRef,
+        doneButtonRef = _this$props.doneButtonRef,
+        focusToolbar = _this$props.focusToolbar,
+        onToolbarFocus = _this$props.onToolbarFocus,
+        onToolbarBlur = _this$props.onToolbarBlur;
+      var inFocus = value.isFocused || focusedNode !== null && focusedNode !== undefined || focusToolbar;
+      var clonedChildren = children;
+      if (typeof children !== 'string') {
+        clonedChildren = /*#__PURE__*/_react["default"].cloneElement(children, {
+          ref: function ref(el) {
+            return _this.editorRef = el;
+          }
+        });
+      }
+      log('[render] inFocus: ', inFocus, 'value.isFocused:', value.isFocused, 'focused node: ', focusedNode);
+      return /*#__PURE__*/_react["default"].createElement(Root, {
+        noBorder: toolbarOpts && toolbarOpts.noBorder,
+        error: toolbarOpts && toolbarOpts.error
+      }, /*#__PURE__*/_react["default"].createElement(EditorHolder, {
+        inFocus: inFocus,
+        readOnly: readOnly,
+        disableUnderline: disableUnderline,
+        disableScrollbar: disableScrollbar
+      }, /*#__PURE__*/_react["default"].createElement(ChildrenContainer, {
+        noPadding: toolbarOpts && toolbarOpts.noPadding
+      }, clonedChildren)), /*#__PURE__*/_react["default"].createElement(_toolbar["default"], {
+        autoWidth: autoWidth,
+        plugins: plugins,
+        focusedNode: focusedNode,
+        value: value,
+        isFocused: inFocus,
+        onBlur: onToolbarBlur,
+        onFocus: onToolbarFocus,
+        onChange: onChange,
+        getFocusedValue: getFocusedValue,
+        onDone: onDone,
+        onDataChange: onDataChange,
+        toolbarRef: toolbarRef,
+        doneButtonRef: doneButtonRef,
+        pluginProps: pluginProps,
+        toolbarOpts: toolbarOpts
+      }));
+    }
+  }]);
+}(_react["default"].Component);
+(0, _defineProperty2["default"])(EditorAndToolbar, "propTypes", {
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired,
+  value: _slatePropTypes["default"].value.isRequired,
+  plugins: _propTypes["default"].array.isRequired,
+  onChange: _propTypes["default"].func.isRequired,
+  getFocusedValue: _propTypes["default"].func.isRequired,
+  onDone: _propTypes["default"].func.isRequired,
+  onDataChange: _propTypes["default"].func,
+  toolbarRef: _propTypes["default"].func,
+  focusedNode: _slatePropTypes["default"].node,
+  readOnly: _propTypes["default"].bool,
+  disableScrollbar: _propTypes["default"].bool,
+  disableUnderline: _propTypes["default"].bool,
+  autoWidth: _propTypes["default"].bool,
+  pluginProps: _propTypes["default"].object,
+  toolbarOpts: _propTypes["default"].shape({
+    position: _propTypes["default"].oneOf(['bottom', 'top']),
+    alwaysVisible: _propTypes["default"].bool,
+    error: _propTypes["default"].string,
+    noBorder: _propTypes["default"].any,
+    noPadding: _propTypes["default"].any
+  }),
+  focusToolbar: _propTypes["default"].bool.isRequired,
+  onToolbarFocus: _propTypes["default"].func.isRequired,
+  onToolbarBlur: _propTypes["default"].func.isRequired,
+  doneButtonRef: _propTypes["default"].func
+});
+var _default = exports["default"] = EditorAndToolbar;
+//# sourceMappingURL=editor-and-toolbar.js.map

package/lib/plugins/toolbar/editor-and-toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor-and-toolbar.js","names":["_react","_interopRequireDefault","require","_toolbar","_debug","_theme","_styles","_propTypes","_slatePropTypes","_renderUi","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","ownKeys","r","Object","keys","getOwnPropertySymbols","filter","getOwnPropertyDescriptor","enumerable","push","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","log","debug","Root","styled","shouldForwardProp","prop","includes","_ref","theme","noBorder","error","position","padding","border","borderRadius","cursor","borderColor","concat","palette","main","undefined","borderWidth","wordBreak","overflow","maxHeight","EditorHolder","_ref2","inFocus","readOnly","disableUnderline","disableScrollbar","overflowY","color","text","backgroundColor","background","display","scrollbarWidth","left","right","bottom","height","content","transition","pointerEvents","transform","primary","common","black","backgroundSize","backgroundImage","backgroundRepeat","backgroundPosition","ChildrenContainer","_ref3","noPadding","EditorAndToolbar","exports","_React$Component","_classCallCheck2","_inherits2","_createClass2","key","value","render","_this","_this$props","props","children","plugins","onChange","getFocusedValue","onDone","focusedNode","autoWidth","pluginProps","toolbarOpts","onDataChange","toolbarRef","doneButtonRef","focusToolbar","onToolbarFocus","onToolbarBlur","isFocused","clonedChildren","React","cloneElement","ref","el","editorRef","createElement","onBlur","onFocus","Component","PropTypes","oneOfType","arrayOf","node","isRequired","SlatePropTypes","array","func","bool","object","shape","oneOf","alwaysVisible","string","any","_default"],"sources":["../../../src/plugins/toolbar/editor-and-toolbar.jsx"],"sourcesContent":["import React from 'react';\nimport Toolbar from './toolbar';\nimport debug from 'debug';\nimport { primary } from '../../theme';\nimport { styled } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\nimport SlatePropTypes from 'slate-prop-types';\nimport { color } from '@pie-lib/render-ui';\n\nconst log = debug('@pie-lib:editable-html:plugins:toolbar:editor-and-toolbar');\n\nconst Root = styled('div', {\n  shouldForwardProp: (prop) => !['noBorder', 'error'].includes(prop),\n})(({ theme, noBorder, error }) => ({\n  position: 'relative',\n  padding: '0px',\n  border: noBorder ? 'none' : '1px solid #ccc',\n  borderRadius: '4px',\n  cursor: 'text',\n  borderColor: error ? `${theme.palette.error.main} !important` : undefined,\n  borderWidth: error ? '2px !important' : undefined,\n  '& [data-slate-editor=\"true\"]': {\n    wordBreak: 'break-word',\n    overflow: 'visible',\n    maxHeight: '500px',\n    // needed in order to be able to put the focus before a void element when it is the first one in the editor\n    padding: '5px',\n  },\n}));\n\nconst EditorHolder = styled('div', {\n  shouldForwardProp: (prop) => !['inFocus', 'readOnly', 'disableUnderline', 'disableScrollbar'].includes(prop),\n})(({ theme, inFocus, readOnly, disableUnderline, disableScrollbar }) => ({\n  position: 'relative',\n  padding: '0px',\n  overflowY: 'auto',\n  color: color.text(),\n  backgroundColor: color.background(),\n  ...(disableScrollbar && {\n    '&::-webkit-scrollbar': {\n      display: 'none',\n    },\n    scrollbarWidth: 'none',\n    '-ms-overflow-style': 'none',\n  }),\n  ...(!disableUnderline && {\n    '&::before': {\n      left: '0',\n      right: '0',\n      bottom: '0',\n      height: '1px',\n      content: '\"\"',\n      position: 'absolute',\n      transition: 'background-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms',\n      pointerEvents: 'none',\n      backgroundColor: 'rgba(0, 0, 0, 0.42)',\n    },\n    '&::after': {\n      left: '0',\n      right: '0',\n      bottom: '0',\n      height: '1px',\n      content: '\"\"',\n      position: 'absolute',\n      transform: 'scaleX(0)',\n      transition: 'transform 200ms cubic-bezier(0.0, 0.0, 0.2, 1) 0ms, background-color 200ms linear',\n      backgroundColor: 'rgba(0, 0, 0, 0.42)',\n    },\n    '&:focus': {\n      '&::after': {\n        transform: 'scaleX(1)',\n        backgroundColor: primary,\n        height: '2px',\n      },\n    },\n    '&:hover': {\n      '&::after': {\n        transform: 'scaleX(1)',\n        backgroundColor: theme.palette.common.black,\n        height: '2px',\n      },\n    },\n  }),\n  ...(readOnly && {\n    '&::before': {\n      background: 'transparent',\n      backgroundSize: '5px 1px',\n      backgroundImage: 'linear-gradient(to right, rgba(0, 0, 0, 0.42) 33%, transparent 0%)',\n      backgroundRepeat: 'repeat-x',\n      backgroundPosition: 'left top',\n    },\n    '&::after': {\n      left: '0',\n      right: '0',\n      bottom: '0',\n      height: '1px',\n      content: '\"\"',\n      position: 'absolute',\n      transform: 'scaleX(0)',\n      transition: 'transform 200ms cubic-bezier(0.0, 0.0, 0.2, 1) 0ms, background-color 0ms linear',\n      backgroundColor: 'rgba(0, 0, 0, 0)',\n    },\n    '&:hover': {\n      '&::after': {\n        transform: 'scaleX(0)',\n        backgroundColor: theme.palette.common.black,\n        height: '2px',\n      },\n    },\n  }),\n  ...(inFocus && {\n    '&::after': {\n      transform: 'scaleX(1)',\n      backgroundColor: primary,\n      height: '2px',\n    },\n    '&:hover': {\n      '&::after': {\n        backgroundColor: primary,\n      },\n    },\n  }),\n}));\n\nconst ChildrenContainer = styled('div', {\n  shouldForwardProp: (prop) => !['noPadding'].includes(prop),\n})(({ noPadding }) => ({\n  padding: noPadding ? 0 : '10px 16px',\n}));\n\nexport class EditorAndToolbar extends React.Component {\n  static propTypes = {\n    children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n    value: SlatePropTypes.value.isRequired,\n    plugins: PropTypes.array.isRequired,\n    onChange: PropTypes.func.isRequired,\n    getFocusedValue: PropTypes.func.isRequired,\n    onDone: PropTypes.func.isRequired,\n    onDataChange: PropTypes.func,\n    toolbarRef: PropTypes.func,\n    focusedNode: SlatePropTypes.node,\n    readOnly: PropTypes.bool,\n    disableScrollbar: PropTypes.bool,\n    disableUnderline: PropTypes.bool,\n    autoWidth: PropTypes.bool,\n    pluginProps: PropTypes.object,\n    toolbarOpts: PropTypes.shape({\n      position: PropTypes.oneOf(['bottom', 'top']),\n      alwaysVisible: PropTypes.bool,\n      error: PropTypes.string,\n      noBorder: PropTypes.any,\n      noPadding: PropTypes.any,\n    }),\n    focusToolbar: PropTypes.bool.isRequired,\n    onToolbarFocus: PropTypes.func.isRequired,\n    onToolbarBlur: PropTypes.func.isRequired,\n    doneButtonRef: PropTypes.func,\n  };\n\n  render() {\n    const {\n      children,\n      value,\n      plugins,\n      onChange,\n      getFocusedValue,\n      onDone,\n      focusedNode,\n      autoWidth,\n      readOnly,\n      disableScrollbar,\n      disableUnderline,\n      pluginProps,\n      toolbarOpts,\n      onDataChange,\n      toolbarRef,\n      doneButtonRef,\n      focusToolbar,\n      onToolbarFocus,\n      onToolbarBlur,\n    } = this.props;\n\n    let inFocus = value.isFocused || (focusedNode !== null && focusedNode !== undefined) || focusToolbar;\n\n    let clonedChildren = children;\n\n    if (typeof children !== 'string') {\n      clonedChildren = React.cloneElement(children, {\n        ref: (el) => (this.editorRef = el),\n      });\n    }\n\n    log('[render] inFocus: ', inFocus, 'value.isFocused:', value.isFocused, 'focused node: ', focusedNode);\n\n    return (\n      <Root\n        noBorder={toolbarOpts && toolbarOpts.noBorder}\n        error={toolbarOpts && toolbarOpts.error}\n      >\n        <EditorHolder\n          inFocus={inFocus}\n          readOnly={readOnly}\n          disableUnderline={disableUnderline}\n          disableScrollbar={disableScrollbar}\n        >\n          <ChildrenContainer noPadding={toolbarOpts && toolbarOpts.noPadding}>\n            {clonedChildren}\n          </ChildrenContainer>\n        </EditorHolder>\n\n        <Toolbar\n          autoWidth={autoWidth}\n          plugins={plugins}\n          focusedNode={focusedNode}\n          value={value}\n          isFocused={inFocus}\n          onBlur={onToolbarBlur}\n          onFocus={onToolbarFocus}\n          onChange={onChange}\n          getFocusedValue={getFocusedValue}\n          onDone={onDone}\n          onDataChange={onDataChange}\n          toolbarRef={toolbarRef}\n          doneButtonRef={doneButtonRef}\n          pluginProps={pluginProps}\n          toolbarOpts={toolbarOpts}\n        />\n      </Root>\n    );\n  }\n}\n\nexport default EditorAndToolbar;\n"],"mappings":"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","ignoreList":[]}

package/lib/plugins/toolbar/index.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = ToolbarPlugin;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _editorAndToolbar = _interopRequireDefault(require("./editor-and-toolbar"));
+/**
+ * Adds a toolbar which is shown when the editor is focused.
+ * @param {*} opts
+ */
+function ToolbarPlugin(opts) {
+  return {
+    /* eslint-disable-next-line */
+    renderEditor: function renderEditor(props) {
+      return /*#__PURE__*/_react["default"].createElement(_editorAndToolbar["default"], (0, _extends2["default"])({}, props, {
+        mainEditorRef: opts.mainEditorRef,
+        disableScrollbar: opts.disableScrollbar,
+        disableUnderline: opts.disableUnderline,
+        autoWidth: opts.autoWidth,
+        onDone: opts.onDone
+      }));
+    }
+  };
+}
+//# sourceMappingURL=index.js.map

package/lib/plugins/toolbar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_editorAndToolbar","ToolbarPlugin","opts","renderEditor","props","createElement","_extends2","mainEditorRef","disableScrollbar","disableUnderline","autoWidth","onDone"],"sources":["../../../src/plugins/toolbar/index.jsx"],"sourcesContent":["import React from 'react';\n\nimport EditorAndToolbar from './editor-and-toolbar';\n\n/**\n * Adds a toolbar which is shown when the editor is focused.\n * @param {*} opts\n */\nexport default function ToolbarPlugin(opts) {\n  return {\n    /* eslint-disable-next-line */\n    renderEditor: (props) => (\n      <EditorAndToolbar\n        {...props}\n        mainEditorRef={opts.mainEditorRef}\n        disableScrollbar={opts.disableScrollbar}\n        disableUnderline={opts.disableUnderline}\n        autoWidth={opts.autoWidth}\n        onDone={opts.onDone}\n      />\n    ),\n  };\n}\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,iBAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA;AACA;AACA;AACA;AACe,SAASE,aAAaA,CAACC,IAAI,EAAE;EAC1C,OAAO;IACL;IACAC,YAAY,EAAE,SAAdA,YAAYA,CAAGC,KAAK;MAAA,oBAClBP,MAAA,YAAAQ,aAAA,CAACL,iBAAA,WAAgB,MAAAM,SAAA,iBACXF,KAAK;QACTG,aAAa,EAAEL,IAAI,CAACK,aAAc;QAClCC,gBAAgB,EAAEN,IAAI,CAACM,gBAAiB;QACxCC,gBAAgB,EAAEP,IAAI,CAACO,gBAAiB;QACxCC,SAAS,EAAER,IAAI,CAACQ,SAAU;QAC1BC,MAAM,EAAET,IAAI,CAACS;MAAO,EACrB,CAAC;IAAA;EAEN,CAAC;AACH","ignoreList":[]}

package/lib/plugins/toolbar/toolbar-buttons.js

@@ -0,0 +1,145 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RawMarkButton = exports.RawButton = exports.MarkButton = exports.Button = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _debug = _interopRequireDefault(require("debug"));
+var _styles = require("@mui/material/styles");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var StyledButton = (0, _styles.styled)('button', {
+  shouldForwardProp: function shouldForwardProp(prop) {
+    return !['active', 'disabled', 'extraStyles'].includes(prop);
+  }
+})(function (_ref) {
+  var theme = _ref.theme,
+    active = _ref.active,
+    disabled = _ref.disabled,
+    extraStyles = _ref.extraStyles;
+  return _objectSpread({
+    color: active ? 'black' : 'grey',
+    display: 'inline-flex',
+    padding: '2px',
+    background: 'none',
+    border: 'none',
+    cursor: disabled ? 'not-allowed' : 'pointer',
+    opacity: disabled ? 0.7 : 1,
+    '&:hover': {
+      color: disabled ? 'grey' : 'black'
+    },
+    '&:focus': {
+      outline: "2px solid ".concat(theme.palette.grey[700])
+    }
+  }, extraStyles);
+});
+var log = (0, _debug["default"])('pie-elements:editable-html:raw-button');
+var RawButton = exports.RawButton = /*#__PURE__*/function (_React$Component) {
+  function RawButton(props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, RawButton);
+    _this = _callSuper(this, RawButton, [props]);
+    (0, _defineProperty2["default"])(_this, "onClick", function (e) {
+      log('[onClick]');
+      e.preventDefault();
+      var onClick = _this.props.onClick;
+      onClick(e);
+    });
+    (0, _defineProperty2["default"])(_this, "onKeyDown", function (e) {
+      if (e.key === 'Enter' || e.key === ' ') {
+        log('[onKeyDown]');
+        e.preventDefault();
+        var onClick = _this.props.onClick;
+        onClick(e);
+      }
+    });
+    return _this;
+  }
+  (0, _inherits2["default"])(RawButton, _React$Component);
+  return (0, _createClass2["default"])(RawButton, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        active = _this$props.active,
+        children = _this$props.children,
+        disabled = _this$props.disabled,
+        extraStyles = _this$props.extraStyles,
+        ariaLabel = _this$props.ariaLabel;
+      return /*#__PURE__*/_react["default"].createElement(StyledButton, {
+        active: active,
+        disabled: disabled,
+        extraStyles: extraStyles,
+        onMouseDown: this.onClick,
+        onKeyDown: this.onKeyDown,
+        "aria-label": ariaLabel,
+        "aria-pressed": active,
+        tabIndex: 0
+      }, children);
+    }
+  }]);
+}(_react["default"].Component);
+(0, _defineProperty2["default"])(RawButton, "propTypes", {
+  onClick: _propTypes["default"].func.isRequired,
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired,
+  active: _propTypes["default"].bool,
+  disabled: _propTypes["default"].bool,
+  extraStyles: _propTypes["default"].object,
+  ariaLabel: _propTypes["default"].string
+});
+var Button = exports.Button = RawButton;
+var RawMarkButton = exports.RawMarkButton = /*#__PURE__*/function (_React$Component2) {
+  function RawMarkButton(props) {
+    var _this2;
+    (0, _classCallCheck2["default"])(this, RawMarkButton);
+    _this2 = _callSuper(this, RawMarkButton, [props]);
+    (0, _defineProperty2["default"])(_this2, "onToggle", function (e) {
+      e.preventDefault();
+      _this2.props.onToggle(_this2.props.mark);
+    });
+    (0, _defineProperty2["default"])(_this2, "onKeyDown", function (e) {
+      if (e.key === 'Enter' || e.key === ' ') {
+        e.preventDefault();
+        _this2.props.onToggle(_this2.props.mark);
+      }
+    });
+    return _this2;
+  }
+  (0, _inherits2["default"])(RawMarkButton, _React$Component2);
+  return (0, _createClass2["default"])(RawMarkButton, [{
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+        children = _this$props2.children,
+        active = _this$props2.active,
+        label = _this$props2.label;
+      return /*#__PURE__*/_react["default"].createElement(StyledButton, {
+        active: active,
+        onMouseDown: this.onToggle,
+        "aria-pressed": active,
+        onKeyDown: this.onKeyDown,
+        "aria-label": label,
+        tabIndex: 0
+      }, children);
+    }
+  }]);
+}(_react["default"].Component);
+(0, _defineProperty2["default"])(RawMarkButton, "propTypes", {
+  onToggle: _propTypes["default"].func.isRequired,
+  mark: _propTypes["default"].string,
+  label: _propTypes["default"].string.isRequired,
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired,
+  active: _propTypes["default"].bool
+});
+var MarkButton = exports.MarkButton = RawMarkButton;
+//# sourceMappingURL=toolbar-buttons.js.map

package/lib/plugins/toolbar/toolbar-buttons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar-buttons.js","names":["_react","_interopRequireDefault","require","_debug","_styles","_propTypes","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","ownKeys","r","Object","keys","getOwnPropertySymbols","filter","getOwnPropertyDescriptor","enumerable","push","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","StyledButton","styled","shouldForwardProp","prop","includes","_ref","theme","active","disabled","extraStyles","color","display","padding","background","border","cursor","opacity","outline","concat","palette","grey","log","debug","RawButton","exports","_React$Component","props","_this","_classCallCheck2","preventDefault","onClick","key","_inherits2","_createClass2","value","render","_this$props","children","ariaLabel","createElement","onMouseDown","onKeyDown","tabIndex","React","Component","PropTypes","func","isRequired","oneOfType","arrayOf","node","bool","object","string","Button","RawMarkButton","_React$Component2","_this2","onToggle","mark","_this$props2","label","MarkButton"],"sources":["../../../src/plugins/toolbar/toolbar-buttons.jsx"],"sourcesContent":["import React from 'react';\nimport debug from 'debug';\nimport { styled } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\n\nconst StyledButton = styled('button', {\n  shouldForwardProp: (prop) => !['active', 'disabled', 'extraStyles'].includes(prop),\n})(({ theme, active, disabled, extraStyles }) => ({\n  color: active ? 'black' : 'grey',\n  display: 'inline-flex',\n  padding: '2px',\n  background: 'none',\n  border: 'none',\n  cursor: disabled ? 'not-allowed' : 'pointer',\n  opacity: disabled ? 0.7 : 1,\n  '&:hover': {\n    color: disabled ? 'grey' : 'black',\n  },\n  '&:focus': {\n    outline: `2px solid ${theme.palette.grey[700]}`,\n  },\n  ...extraStyles,\n}));\n\nconst log = debug('pie-elements:editable-html:raw-button');\n\nexport class RawButton extends React.Component {\n  static propTypes = {\n    onClick: PropTypes.func.isRequired,\n    children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n    active: PropTypes.bool,\n    disabled: PropTypes.bool,\n    extraStyles: PropTypes.object,\n    ariaLabel: PropTypes.string,\n  };\n\n  constructor(props) {\n    super(props);\n  }\n\n  onClick = (e) => {\n    log('[onClick]');\n    e.preventDefault();\n    const { onClick } = this.props;\n    onClick(e);\n  };\n\n  onKeyDown = (e) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      log('[onKeyDown]');\n      e.preventDefault();\n      const { onClick } = this.props;\n      onClick(e);\n    }\n  };\n\n  render() {\n    const { active, children, disabled, extraStyles, ariaLabel } = this.props;\n\n    return (\n      <StyledButton\n        active={active}\n        disabled={disabled}\n        extraStyles={extraStyles}\n        onMouseDown={this.onClick}\n        onKeyDown={this.onKeyDown}\n        aria-label={ariaLabel}\n        aria-pressed={active}\n        tabIndex={0}\n      >\n        {children}\n      </StyledButton>\n    );\n  }\n}\n\nexport const Button = RawButton;\n\nexport class RawMarkButton extends React.Component {\n  static propTypes = {\n    onToggle: PropTypes.func.isRequired,\n    mark: PropTypes.string,\n    label: PropTypes.string.isRequired,\n    children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n    active: PropTypes.bool,\n  };\n\n  constructor(props) {\n    super(props);\n  }\n\n  onToggle = (e) => {\n    e.preventDefault();\n    this.props.onToggle(this.props.mark);\n  };\n\n  onKeyDown = (e) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      this.props.onToggle(this.props.mark);\n    }\n  };\n\n  render() {\n    const { children, active, label } = this.props;\n\n    return (\n      <StyledButton\n        active={active}\n        onMouseDown={this.onToggle}\n        aria-pressed={active}\n        onKeyDown={this.onKeyDown}\n        aria-label={label}\n        tabIndex={0}\n      >\n        {children}\n      </StyledButton>\n    );\n  }\n}\n\nexport const MarkButton = RawMarkButton;\n"],"mappings":"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","ignoreList":[]}