@corva/ui 0.34.0-rc.3 → 0.34.0

package/components/SettingEditors/ColorEditor/index.js

@@ -1,109 +1 @@
-import '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { withStyles, Button, ClickAwayListener } from '@material-ui/core';
-import { useState } from 'react';
-import PropTypes from 'prop-types';
-import { GithubPicker, ChromePicker } from 'react-color';
-import ColorLensIcon from '@material-ui/icons/ColorLens';
-import styles from './style.css.js';
-
-var muiStyles = {
-  button: {
-    marginBottom: 16
-  }
-};
-var ColorEditor = function ColorEditor(_ref) {
-  var onChange = _ref.onChange,
-      currentValue = _ref.currentValue,
-      defaultValue = _ref.defaultValue,
-      classes = _ref.classes,
-      condensed = _ref.condensed,
-      colors = _ref.colors,
-      lensColor = _ref.lensColor;
-
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      isPickerOpened = _useState2[0],
-      setIsPickerOpened = _useState2[1];
-
-  var _useState3 = useState(currentValue || defaultValue),
-      _useState4 = _slicedToArray(_useState3, 2),
-      color = _useState4[0],
-      setColor = _useState4[1];
-
-  var handlePickerOpen = function handlePickerOpen() {
-    return setIsPickerOpened(true);
-  };
-
-  var handleSave = function handleSave() {
-    return onChange(color);
-  };
-
-  var handlePickerClose = function handlePickerClose() {
-    setIsPickerOpened(false);
-    handleSave();
-  };
-
-  var handleChange = function handleChange(color) {
-    setColor(color.hex);
-    handleSave();
-  };
-
-  var handleChangeAndClose = function handleChangeAndClose(color) {
-    setColor(color.hex);
-    setIsPickerOpened(false);
-    handleSave();
-  };
-
-  return /*#__PURE__*/jsxs("div", {
-    className: styles.colorEditor,
-    children: [/*#__PURE__*/jsx(Button, {
-      variant: "contained",
-      color: "primary",
-      onClick: handlePickerOpen,
-      className: classes.button,
-      style: {
-        backgroundColor: color,
-        color: lensColor
-      },
-      children: /*#__PURE__*/jsx(ColorLensIcon, {})
-    }), isPickerOpened && /*#__PURE__*/jsx(ClickAwayListener, {
-      mouseEvent: "onMouseDown",
-      touchEvent: "onTouchStart",
-      onClickAway: handlePickerClose,
-      children: /*#__PURE__*/jsx("div", {
-        className: styles.colorEditorPickerContainer,
-        children: condensed ? /*#__PURE__*/jsx(GithubPicker, {
-          color: color,
-          onChange: handleChangeAndClose,
-          colors: colors,
-          triangle: "hide"
-        }) : /*#__PURE__*/jsx(ChromePicker, {
-          color: color,
-          onChange: handleChange
-        })
-      })
-    })]
-  });
-};
-ColorEditor.propTypes = {
-  currentValue: PropTypes.string.isRequired,
-  defaultValue: PropTypes.string,
-  condensed: PropTypes.bool,
-  onChange: PropTypes.func.isRequired,
-  colors: PropTypes.arrayOf(PropTypes.string),
-  classes: PropTypes.shape({}).isRequired,
-  lensColor: PropTypes.string
-};
-ColorEditor.defaultProps = {
-  condensed: false,
-  colors: ['#FF0000', '#00FF00', '#0000FF'],
-  defaultValue: '#FF0000',
-  lensColor: '#fff'
-};
-var index = withStyles(muiStyles)(ColorEditor);
-
-export default index;
-export { ColorEditor };
-//# sourceMappingURL=index.js.map
+import"@babel/runtime/helpers/defineProperty";import o from"@babel/runtime/helpers/slicedToArray";import{useState as r}from"react";import e from"prop-types";import{GithubPicker as n,ChromePicker as t}from"react-color";import{withStyles as i,Button as l,ClickAwayListener as a}from"@material-ui/core";import s from"@material-ui/icons/ColorLens";import c from"./style.css.js";import{jsxs as u,jsx as m}from"react/jsx-runtime";var d=function(e){var i=e.onChange,d=e.currentValue,f=e.defaultValue,p=e.classes,h=e.condensed,C=e.colors,g=e.lensColor,y=r(!1),b=o(y,2),v=b[0],F=b[1],V=r(d||f),k=o(V,2),x=k[0],E=k[1],q=function(){return i(x)};return u("div",{className:c.colorEditor,children:[m(l,{variant:"contained",color:"primary",onClick:function(){return F(!0)},className:p.button,style:{backgroundColor:x,color:g},children:m(s,{})}),v&&m(a,{mouseEvent:"onMouseDown",touchEvent:"onTouchStart",onClickAway:function(){F(!1),q()},children:m("div",{className:c.colorEditorPickerContainer,children:h?m(n,{color:x,onChange:function(o){E(o.hex),F(!1),q()},colors:C,triangle:"hide"}):m(t,{color:x,onChange:function(o){E(o.hex),q()}})})})]})};d.propTypes={currentValue:e.string.isRequired,defaultValue:e.string,condensed:e.bool,onChange:e.func.isRequired,colors:e.arrayOf(e.string),classes:e.shape({}).isRequired,lensColor:e.string},d.defaultProps={condensed:!1,colors:["#FF0000","#00FF00","#0000FF"],defaultValue:"#FF0000",lensColor:"#fff"};var f=i({button:{marginBottom:16}})(d);export{d as ColorEditor,f as default};

package/components/SettingEditors/ColorEditor/style.css.js

@@ -1,8 +1 @@
-import styleInject from '../../../ext-esm/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".style_colorEditor__1j-TL {\n  position: relative;\n}\n\n.style_colorEditorPickerContainer__2-nBC {\n  z-index: 100;\n  position: absolute;\n  top: 0;\n  left: 0;\n}\n";
-var styles = {"colorEditor":"style_colorEditor__1j-TL","colorEditorPickerContainer":"style_colorEditorPickerContainer__2-nBC"};
-styleInject(css_248z);
-
-export default styles;
-//# sourceMappingURL=style.css.js.map
+import o from'./../../../ext-esm/style-inject/dist/style-inject.es.js';var t={colorEditor:"style_colorEditor__jrtxl",colorEditorPickerContainer:"style_colorEditorPickerContainer__oLMSi"};o(".style_colorEditor__jrtxl{position:relative}.style_colorEditorPickerContainer__oLMSi{left:0;position:absolute;top:0;z-index:100}");export{t as default};

package/components/SettingEditors/DropdownEditor/index.js

@@ -1,105 +1 @@
-import '@babel/runtime/helpers/defineProperty';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { withStyles, Checkbox, FormControl, InputLabel, Select, MenuItem, FormHelperText } from '@material-ui/core';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-
-var StyledCheckbox = withStyles({
-  root: {
-    paddingLeft: '7px'
-  }
-})(Checkbox);
-
-function DropdownEditor(_ref) {
-  var currentValue = _ref.currentValue,
-      defaultValue = _ref.defaultValue,
-      options = _ref.options,
-      placeholder = _ref.placeholder,
-      _onChange = _ref.onChange,
-      multiple = _ref.multiple,
-      disabled = _ref.disabled,
-      classes = _ref.classes,
-      renderValue = _ref.renderValue,
-      errorText = _ref.errorText;
-  var value = currentValue || defaultValue;
-  var menuItemClassName = classNames(classes.menuItem, multiple && classes.multipleMenuItem);
-  return /*#__PURE__*/jsxs(FormControl, {
-    className: classes.formControl,
-    error: !!errorText,
-    children: [/*#__PURE__*/jsx(InputLabel, {
-      shrink: value !== undefined,
-      children: placeholder
-    }), /*#__PURE__*/jsx(Select, {
-      value: value,
-      onChange: function onChange(e) {
-        return _onChange(e.target.value);
-      },
-      multiple: multiple,
-      disabled: disabled,
-      renderValue: renderValue,
-      MenuProps: {
-        className: classes.selectMenu,
-        anchorOrigin: {
-          vertical: 'top'
-        }
-      },
-      autoWidth: true,
-      displayEmpty: true,
-      children: options && options.map(function (option) {
-        return /*#__PURE__*/jsxs(MenuItem, {
-          value: option.value,
-          className: menuItemClassName,
-          children: [multiple && /*#__PURE__*/jsx(StyledCheckbox, {
-            color: "primary",
-            checked: value && value.includes(option.value)
-          }), option.label]
-        }, option.value);
-      })
-    }), !!errorText && /*#__PURE__*/jsx(FormHelperText, {
-      children: errorText
-    })]
-  });
-}
-
-DropdownEditor.propTypes = {
-  currentValue: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.array]),
-  defaultValue: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.array]),
-  onChange: PropTypes.func.isRequired,
-  options: PropTypes.arrayOf(PropTypes.any).isRequired,
-  placeholder: PropTypes.string,
-  multiple: PropTypes.bool,
-  disabled: PropTypes.bool,
-  classes: PropTypes.shape({}).isRequired,
-  renderValue: PropTypes.func,
-  errorText: PropTypes.string
-};
-DropdownEditor.defaultProps = {
-  currentValue: undefined,
-  defaultValue: undefined,
-  multiple: false,
-  placeholder: 'Choose An Option',
-  disabled: false,
-  renderValue: undefined,
-  errorText: ''
-};
-var muiStyles = {
-  formControl: {
-    minWidth: '200px',
-    maxWidth: '200px',
-    margin: '10px 20px 10px 0'
-  },
-  selectMenu: {
-    maxHeight: '400px'
-  },
-  menuItem: {
-    minWidth: '200px'
-  },
-  multipleMenuItem: {
-    paddingLeft: '5px',
-    minWidth: '200px'
-  }
-};
-var StyledDropdownEditor = withStyles(muiStyles)(DropdownEditor);
-
-export default StyledDropdownEditor;
-//# sourceMappingURL=index.js.map
+import"@babel/runtime/helpers/defineProperty";import e from"prop-types";import{withStyles as r,Checkbox as a,FormControl as l,InputLabel as n,Select as t,MenuItem as i,FormHelperText as o}from"@material-ui/core";import u from"classnames";import{jsxs as p,jsx as d}from"react/jsx-runtime";var s=r({root:{paddingLeft:"7px"}})(a);function m(e){var r=e.currentValue,a=e.defaultValue,m=e.options,c=e.placeholder,h=e.onChange,f=e.multiple,x=e.disabled,v=e.classes,g=e.renderValue,y=e.errorText,b=r||a,V=u(v.menuItem,f&&v.multipleMenuItem);return p(l,{className:v.formControl,error:!!y,children:[d(n,{shrink:void 0!==b,children:c}),d(t,{value:b,onChange:function(e){return h(e.target.value)},multiple:f,disabled:x,renderValue:g,MenuProps:{className:v.selectMenu,anchorOrigin:{vertical:"top"}},autoWidth:!0,displayEmpty:!0,children:m&&m.map((function(e){return p(i,{value:e.value,className:V,children:[f&&d(s,{color:"primary",checked:b&&b.includes(e.value)}),e.label]},e.value)}))}),!!y&&d(o,{children:y})]})}m.propTypes={currentValue:e.oneOfType([e.number,e.string,e.array]),defaultValue:e.oneOfType([e.number,e.string,e.array]),onChange:e.func.isRequired,options:e.arrayOf(e.any).isRequired,placeholder:e.string,multiple:e.bool,disabled:e.bool,classes:e.shape({}).isRequired,renderValue:e.func,errorText:e.string},m.defaultProps={currentValue:void 0,defaultValue:void 0,multiple:!1,placeholder:"Choose An Option",disabled:!1,renderValue:void 0,errorText:""};var c=r({formControl:{minWidth:"200px",maxWidth:"200px",margin:"10px 20px 10px 0"},selectMenu:{maxHeight:"400px"},menuItem:{minWidth:"200px"},multipleMenuItem:{paddingLeft:"5px",minWidth:"200px"}})(m);export{c as default};

package/components/SettingEditors/RadioEditor/index.js

@@ -1,52 +1 @@
-import '@babel/runtime/helpers/defineProperty';
-import { jsx } from 'react/jsx-runtime';
-import { FormControl, RadioGroup, FormControlLabel, Radio } from '@material-ui/core';
-import PropTypes from 'prop-types';
-
-var RadioEditor = function RadioEditor(_ref) {
-  var options = _ref.options,
-      currentValue = _ref.currentValue,
-      defaultValue = _ref.defaultValue,
-      _onChange = _ref.onChange;
-  var selectedValue = currentValue === undefined ? defaultValue : currentValue;
-  return /*#__PURE__*/jsx(FormControl, {
-    component: "fieldset",
-    margin: "dense",
-    fullWidth: true,
-    children: /*#__PURE__*/jsx(RadioGroup, {
-      "aria-label": "position",
-      name: "radio_editor",
-      row: true,
-      children: options.map(function (_ref2) {
-        var value = _ref2.value,
-            label = _ref2.label;
-        return /*#__PURE__*/jsx(FormControlLabel, {
-          onChange: function onChange() {
-            return _onChange(value);
-          },
-          control: /*#__PURE__*/jsx(Radio, {
-            color: "primary",
-            checked: value === selectedValue
-          }),
-          label: label
-        }, value);
-      })
-    })
-  });
-};
-
-RadioEditor.propTypes = {
-  options: PropTypes.arrayOf(PropTypes.shape({
-    value: PropTypes.string,
-    label: PropTypes.string
-  })).isRequired,
-  defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-  currentValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  onChange: PropTypes.func.isRequired
-};
-RadioEditor.defaultProps = {
-  currentValue: undefined
-};
-
-export default RadioEditor;
-//# sourceMappingURL=index.js.map
+import"@babel/runtime/helpers/defineProperty";import e from"prop-types";import{FormControl as r,RadioGroup as n,FormControlLabel as o,Radio as i}from"@material-ui/core";import{jsx as a}from"react/jsx-runtime";var t=function(e){var t=e.options,u=e.currentValue,l=e.defaultValue,p=e.onChange,s=void 0===u?l:u;return a(r,{component:"fieldset",margin:"dense",fullWidth:!0,children:a(n,{"aria-label":"position",name:"radio_editor",row:!0,children:t.map((function(e){var r=e.value,n=e.label;return a(o,{onChange:function(){return p(r)},control:a(i,{color:"primary",checked:r===s}),label:n},r)}))})})};t.propTypes={options:e.arrayOf(e.shape({value:e.string,label:e.string})).isRequired,defaultValue:e.oneOfType([e.string,e.number]).isRequired,currentValue:e.oneOfType([e.string,e.number]),onChange:e.func.isRequired},t.defaultProps={currentValue:void 0};export{t as default};

package/components/SlateFormattedText/Constants.js

@@ -1,12 +1 @@
-// eslint-disable-next-line import/prefer-default-export
-var TEXT_FORMATS = {
-  headerOne: 'headerOne',
-  headerTwo: 'headerTwo',
-  headerThree: 'headerThree',
-  body: 'body',
-  caption: 'caption',
-  code: 'code'
-};
-
-export { TEXT_FORMATS };
-//# sourceMappingURL=Constants.js.map
+var e={headerOne:"headerOne",headerTwo:"headerTwo",headerThree:"headerThree",body:"body",caption:"caption",code:"code"};export{e as TEXT_FORMATS};

package/components/SlateFormattedText/Elements/ImageElement/ImageElement.css.js

@@ -1,8 +1 @@
-import styleInject from '../../../../ext-esm/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".ImageElement_container__17H5M {\n  display: flex;\n  margin-bottom: -22px;\n}\n\n.ImageElement_image__xYV1h {\n  /* minus image container padding 24px */\n  width: calc(100% - 24px);\n}\n\n.ImageElement_resizable__g25B9 {\n  padding-bottom: 16px;\n}\n\n.ImageElement_handleRight__10302,\n.ImageElement_handleLeft__3nDDe {\n  width: 4px;\n  background-color: #414141;\n  border-radius: 6px;\n  margin-top: 16px;\n  margin-bottom: 16px;\n  position: relative;\n  min-height: 32px;\n}\n\n.ImageElement_handleRight__10302 {\n  right: -11px;\n}\n\n.ImageElement_handleLeft__3nDDe {\n  left: -11px;\n}\n\n.ImageElement_handleRight__10302:hover {\n  background-color: #03bcd4;\n}\n\n.ImageElement_handle___WLAo::after {\n  content: '';\n  width: 9px;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  margin-left: -4px;\n  background-color: transparent;\n  cursor: ew-resize;\n  z-index: 2;\n}\n";
-var styles = {"container":"ImageElement_container__17H5M","image":"ImageElement_image__xYV1h","resizable":"ImageElement_resizable__g25B9","handleRight":"ImageElement_handleRight__10302","handleLeft":"ImageElement_handleLeft__3nDDe","handle":"ImageElement_handle___WLAo"};
-styleInject(css_248z);
-
-export default styles;
-//# sourceMappingURL=ImageElement.css.js.map
+import e from'./../../../../ext-esm/style-inject/dist/style-inject.es.js';var t={container:"ImageElement_container__BjAcP",image:"ImageElement_image__52Cir",resizable:"ImageElement_resizable__OvxJS",handleRight:"ImageElement_handleRight__g2lsE",handleLeft:"ImageElement_handleLeft__EgDg9",handle:"ImageElement_handle__YcRmJ"};e('.ImageElement_container__BjAcP{display:flex;margin-bottom:-22px}.ImageElement_image__52Cir{width:calc(100% - 24px)}.ImageElement_resizable__OvxJS{padding-bottom:16px}.ImageElement_handleLeft__EgDg9,.ImageElement_handleRight__g2lsE{background-color:#414141;border-radius:6px;margin-bottom:16px;margin-top:16px;min-height:32px;position:relative;width:4px}.ImageElement_handleRight__g2lsE{right:-11px}.ImageElement_handleLeft__EgDg9{left:-11px}.ImageElement_handleRight__g2lsE:hover{background-color:#03bcd4}.ImageElement_handle__YcRmJ:after{background-color:transparent;bottom:0;content:"";cursor:ew-resize;margin-left:-4px;position:absolute;top:0;width:9px;z-index:2}');export{t as default};

package/components/SlateFormattedText/Elements/ImageElement/ImageElement.js

@@ -1,144 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useRef, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import { useSlateStatic, ReactEditor } from 'slate-react';
-import { Transforms } from 'slate';
-import styles from './ImageElement.css.js';
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-var CONTENT_PADDING = 24;
-var MIN_PANE_SIZE = 150;
-
-var ImageElement = function ImageElement(props) {
-  var _element$dimensions;
-
-  var attributes = props.attributes,
-      element = props.element,
-      imageWidth = props.imageWidth,
-      mode = props.mode,
-      children = props.children;
-  var isWriteMode = mode === 'write';
-  var wrapperRef = useRef();
-  var imageRef = useRef();
-  var editor = useSlateStatic();
-  var pointermoveController = new AbortController();
-
-  var setPaneWidth = function setPaneWidth(width) {
-    if (wrapperRef.current) {
-      wrapperRef.current.style.setProperty('width', "".concat(width, "px"));
-    }
-  };
-
-  var getPaneWidth = function getPaneWidth() {
-    var containerElement = document.getElementById("resizable".concat(element.url));
-    var pxWidth = containerElement && window.getComputedStyle(containerElement).getPropertyValue('width');
-    return pxWidth ? parseInt(pxWidth, 10) : document.body.clientWidth;
-  };
-
-  var stopDragging = function stopDragging() {
-    // update Slate element params
-    Transforms.removeNodes(editor, {
-      at: ReactEditor.findPath(editor, element)
-    });
-    Transforms.insertNodes(editor, _objectSpread(_objectSpread({}, element), {}, {
-      dimensions: {
-        width: getPaneWidth() - CONTENT_PADDING
-      }
-    }), {
-      at: ReactEditor.findPath(editor, element)
-    });
-    document.body.removeEventListener('pointerup', stopDragging);
-  };
-
-  var pageContent = document.getElementsByClassName('c-docs-custom-page-content');
-  var maxPaneSize = pageContent && pageContent[0] && pageContent[0].offsetWidth - CONTENT_PADDING * 1.5 || document.body.clientWidth * 0.5;
-
-  var mouseDragHandler = function mouseDragHandler(moveEvent, xOffset, startingPaneWidth) {
-    moveEvent.preventDefault();
-
-    if (getPaneWidth() < MIN_PANE_SIZE || getPaneWidth() > maxPaneSize) {
-      setPaneWidth(Math.min(Math.max(getPaneWidth(), MIN_PANE_SIZE), maxPaneSize));
-      return;
-    }
-
-    var paneOriginAdjustment = -1;
-    setPaneWidth((xOffset - moveEvent.pageX) * paneOriginAdjustment + startingPaneWidth);
-  };
-
-  var startDraggingRight = function startDraggingRight(event) {
-    var startingPaneWidth = getPaneWidth();
-    var xOffset = event.pageX;
-    document.body.addEventListener('pointermove', function (moveEvent) {
-      return mouseDragHandler(moveEvent, xOffset, startingPaneWidth);
-    }, {
-      signal: pointermoveController.signal
-    });
-    document.body.addEventListener('pointerup', stopDragging);
-  };
-
-  useEffect(function () {
-    if (wrapperRef.current && isWriteMode) {
-      wrapperRef.current.addEventListener('mousedown', startDraggingRight);
-    }
-
-    return function () {
-      pointermoveController.abort();
-      document.body.removeEventListener('pointerup', stopDragging);
-      document.body.removeEventListener('pointermove', stopDragging);
-
-      if (wrapperRef.current) {
-        wrapperRef.current.removeEventListener('mousedown', startDraggingRight);
-      }
-    };
-  }, [mode]);
-  var containerWidth = ((_element$dimensions = element.dimensions) === null || _element$dimensions === void 0 ? void 0 : _element$dimensions.width) + CONTENT_PADDING;
-  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, attributes), {}, {
-    children: [/*#__PURE__*/jsx("div", {
-      contentEditable: false,
-      children: element && /*#__PURE__*/jsx("div", {
-        style: {
-          width: containerWidth || imageWidth
-        },
-        ref: wrapperRef,
-        id: "resizable".concat(element.url),
-        className: styles.resizable,
-        children: /*#__PURE__*/jsxs("div", {
-          className: styles.container,
-          children: [isWriteMode && /*#__PURE__*/jsx("div", {
-            className: styles.handleLeft
-          }), /*#__PURE__*/jsx("img", {
-            src: element.url,
-            className: styles.image,
-            ref: imageRef,
-            alt: ""
-          }), isWriteMode && /*#__PURE__*/jsx("div", {
-            className: styles.handleRight
-          })]
-        })
-      })
-    }), children]
-  }));
-};
-
-ImageElement.propTypes = {
-  attributes: PropTypes.shape({}).isRequired,
-  children: PropTypes.node.isRequired,
-  element: PropTypes.shape({
-    url: PropTypes.string.isRequired,
-    dimensions: PropTypes.shape({
-      width: PropTypes.string
-    })
-  }).isRequired,
-  imageWidth: PropTypes.string,
-  mode: PropTypes.string
-};
-ImageElement.defaultProps = {
-  imageWidth: undefined,
-  mode: undefined
-};
-
-export default ImageElement;
-//# sourceMappingURL=ImageElement.js.map
+import e from"@babel/runtime/helpers/defineProperty";import t from"prop-types";import{useRef as r,useEffect as n}from"react";import{Transforms as i}from"slate";import{useSlateStatic as o,ReactEditor as d}from"slate-react";import s from"./ImageElement.css.js";import{jsxs as c,jsx as a}from"react/jsx-runtime";function m(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function u(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?m(Object(n),!0).forEach((function(r){e(t,r,n[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):m(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}var l=function(e){var t,m=e.attributes,l=e.element,p=e.imageWidth,f=e.mode,v=e.children,h="write"===f,b=r(),y=r(),g=o(),w=new AbortController,O=function(e){b.current&&b.current.style.setProperty("width","".concat(e,"px"))},P=function(){var e=document.getElementById("resizable".concat(l.url)),t=e&&window.getComputedStyle(e).getPropertyValue("width");return t?parseInt(t,10):document.body.clientWidth},j=function e(){i.removeNodes(g,{at:d.findPath(g,l)}),i.insertNodes(g,u(u({},l),{},{dimensions:{width:P()-24}}),{at:d.findPath(g,l)}),document.body.removeEventListener("pointerup",e)},E=document.getElementsByClassName("c-docs-custom-page-content"),L=E&&E[0]&&E[0].offsetWidth-36||.5*document.body.clientWidth,N=function(e){var t=P(),r=e.pageX;document.body.addEventListener("pointermove",(function(e){return function(e,t,r){e.preventDefault(),P()<150||P()>L?O(Math.min(Math.max(P(),150),L)):O(-1*(t-e.pageX)+r)}(e,r,t)}),{signal:w.signal}),document.body.addEventListener("pointerup",j)};n((function(){return b.current&&h&&b.current.addEventListener("mousedown",N),function(){w.abort(),document.body.removeEventListener("pointerup",j),document.body.removeEventListener("pointermove",j),b.current&&b.current.removeEventListener("mousedown",N)}}),[f]);var W=(null===(t=l.dimensions)||void 0===t?void 0:t.width)+24;return c("div",u(u({},m),{},{children:[a("div",{contentEditable:!1,children:l&&a("div",{style:{width:W||p},ref:b,id:"resizable".concat(l.url),className:s.resizable,children:c("div",{className:s.container,children:[h&&a("div",{className:s.handleLeft}),a("img",{src:l.url,className:s.image,ref:y,alt:""}),h&&a("div",{className:s.handleRight})]})})}),v]}))};l.propTypes={attributes:t.shape({}).isRequired,children:t.node.isRequired,element:t.shape({url:t.string.isRequired,dimensions:t.shape({width:t.string})}).isRequired,imageWidth:t.string,mode:t.string},l.defaultProps={imageWidth:void 0,mode:void 0};export{l as default};

package/components/SlateFormattedText/Elements/VideoElement/VideoElement.js

@@ -1,48 +1 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { shape, string, number, node } from 'prop-types';
-import styles from './style.css.js';
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-var VideoElement = function VideoElement(_ref) {
-  var attributes = _ref.attributes,
-      element = _ref.element,
-      children = _ref.children;
-  var url = element.url,
-      width = element.width;
-  if (!url) return null;
-  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, attributes), {}, {
-    children: [/*#__PURE__*/jsx("div", {
-      contentEditable: false,
-      children: /*#__PURE__*/jsx("div", {
-        className: styles.videoContainer,
-        children: /*#__PURE__*/jsx("iframe", {
-          className: styles.player,
-          style: {
-            width: "".concat(width ? "".concat(width, "px") : '100%'),
-            height: "".concat(width ? "calc(".concat(width, "px/1.77)") : '100%')
-          },
-          src: url,
-          frameBorder: "0",
-          allowFullScreen: true,
-          title: "video"
-        })
-      })
-    }), children]
-  }));
-};
-
-VideoElement.propTypes = {
-  element: shape({
-    url: string.isRequired,
-    width: number.isRequired
-  }).isRequired,
-  attributes: shape({}).isRequired,
-  children: node.isRequired
-};
-
-export default VideoElement;
-//# sourceMappingURL=VideoElement.js.map
+import e from"@babel/runtime/helpers/defineProperty";import{shape as r,string as t,number as i,node as n}from"prop-types";import c from"./style.css.js";import{jsxs as o,jsx as l}from"react/jsx-runtime";function s(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);r&&(i=i.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,i)}return t}function a(r){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{};t%2?s(Object(i),!0).forEach((function(t){e(r,t,i[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(i)):s(Object(i)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(i,e))}))}return r}var p=function(e){var r=e.attributes,t=e.element,i=e.children,n=t.url,s=t.width;return n?o("div",a(a({},r),{},{children:[l("div",{contentEditable:!1,children:l("div",{className:c.videoContainer,children:l("iframe",{className:c.player,style:{width:"".concat(s?"".concat(s,"px"):"100%"),height:"".concat(s?"calc(".concat(s,"px/1.77)"):"100%")},src:n,frameBorder:"0",allowFullScreen:!0,title:"video"})})}),i]})):null};p.propTypes={element:r({url:t.isRequired,width:i.isRequired}).isRequired,attributes:r({}).isRequired,children:n.isRequired};export{p as default};

package/components/SlateFormattedText/Elements/VideoElement/style.css.js

@@ -1,8 +1 @@
-import styleInject from '../../../../ext-esm/style-inject/dist/style-inject.es.js';
-
-var css_248z = ".style_videoContainer__uAvLE {\n  padding: 16px 0 16px 0;\n  position: relative;\n  width: 100%;\n  height: 0;\n  padding-bottom: 56.25%;\n}\n\n.style_player__3Zh6q {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n";
-var styles = {"videoContainer":"style_videoContainer__uAvLE","player":"style_player__3Zh6q"};
-styleInject(css_248z);
-
-export default styles;
-//# sourceMappingURL=style.css.js.map
+import e from'./../../../../ext-esm/style-inject/dist/style-inject.es.js';var t={videoContainer:"style_videoContainer__7S74V",player:"style_player__ZuTZe"};e(".style_videoContainer__7S74V{height:0;padding:16px 0 56.25%;position:relative;width:100%}.style_player__ZuTZe{height:100%;left:0;position:absolute;top:0;width:100%}");export{t as default};