@corva/ui 0.34.0-rc.2 → 0.34.0-rc.3

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

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,wBAAwB,0DAA+D;AACvF;AACA;AACA;AACA;AACA;AACA;"}

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

@@ -1 +1,144 @@
-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};
+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

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

@@ -0,0 +1 @@
+{"version":3,"file":"ImageElement.js","sources":["../../../../../src/components/SlateFormattedText/Elements/ImageElement/ImageElement.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { useEffect, useRef } from 'react';\nimport { Transforms } from 'slate';\nimport { useSlateStatic, ReactEditor } from 'slate-react';\n\nimport styles from './ImageElement.css';\n\nconst CONTENT_PADDING = 24;\nconst MIN_PANE_SIZE = 150;\n\nconst ImageElement = props => {\n  const { attributes, element, imageWidth, mode, children } = props;\n  const isWriteMode = mode === 'write';\n  const wrapperRef = useRef();\n  const imageRef = useRef();\n  const editor = useSlateStatic();\n\n  const pointermoveController = new AbortController();\n\n  const setPaneWidth = width => {\n    if (wrapperRef.current) {\n      wrapperRef.current.style.setProperty('width', `${width}px`);\n    }\n  };\n\n  const getPaneWidth = () => {\n    const containerElement = document.getElementById(`resizable${element.url}`);\n    const pxWidth =\n      containerElement && window.getComputedStyle(containerElement).getPropertyValue('width');\n    return pxWidth ? parseInt(pxWidth, 10) : document.body.clientWidth;\n  };\n\n  const stopDragging = () => {\n    // update Slate element params\n    Transforms.removeNodes(editor, { at: ReactEditor.findPath(editor, element) });\n    Transforms.insertNodes(\n      editor,\n      { ...element, dimensions: { width: getPaneWidth() - CONTENT_PADDING } },\n      { at: ReactEditor.findPath(editor, element) }\n    );\n    document.body.removeEventListener('pointerup', stopDragging);\n  };\n\n  const pageContent = document.getElementsByClassName('c-docs-custom-page-content');\n  const maxPaneSize =\n    (pageContent && pageContent[0] && pageContent[0].offsetWidth - CONTENT_PADDING * 1.5) ||\n    document.body.clientWidth * 0.5;\n\n  const mouseDragHandler = (moveEvent, xOffset, startingPaneWidth) => {\n    moveEvent.preventDefault();\n    if (getPaneWidth() < MIN_PANE_SIZE || getPaneWidth() > maxPaneSize) {\n      setPaneWidth(Math.min(Math.max(getPaneWidth(), MIN_PANE_SIZE), maxPaneSize));\n      return;\n    }\n    const paneOriginAdjustment = -1;\n    setPaneWidth((xOffset - moveEvent.pageX) * paneOriginAdjustment + startingPaneWidth);\n  };\n\n  const startDraggingRight = event => {\n    const startingPaneWidth = getPaneWidth();\n    const xOffset = event.pageX;\n\n    document.body.addEventListener(\n      'pointermove',\n      moveEvent => mouseDragHandler(moveEvent, xOffset, startingPaneWidth),\n      { signal: pointermoveController.signal }\n    );\n    document.body.addEventListener('pointerup', stopDragging);\n  };\n\n  useEffect(() => {\n    if (wrapperRef.current && isWriteMode) {\n      wrapperRef.current.addEventListener('mousedown', startDraggingRight);\n    }\n\n    return () => {\n      pointermoveController.abort();\n      document.body.removeEventListener('pointerup', stopDragging);\n      document.body.removeEventListener('pointermove', stopDragging);\n      if (wrapperRef.current) {\n        wrapperRef.current.removeEventListener('mousedown', startDraggingRight);\n      }\n    };\n  }, [mode]);\n\n  const containerWidth = element.dimensions?.width + CONTENT_PADDING;\n\n  return (\n    <div {...attributes}>\n      <div contentEditable={false}>\n        {element && (\n          <div\n            style={{\n              width: containerWidth || imageWidth,\n            }}\n            ref={wrapperRef}\n            id={`resizable${element.url}`}\n            className={styles.resizable}\n          >\n            <div className={styles.container}>\n              {isWriteMode && <div className={styles.handleLeft} />}\n              <img src={element.url} className={styles.image} ref={imageRef} alt=\"\" />\n              {isWriteMode && <div className={styles.handleRight} />}\n            </div>\n          </div>\n        )}\n      </div>\n      {children}\n    </div>\n  );\n};\n\nImageElement.propTypes = {\n  attributes: PropTypes.shape({}).isRequired,\n  children: PropTypes.node.isRequired,\n  element: PropTypes.shape({\n    url: PropTypes.string.isRequired,\n    dimensions: PropTypes.shape({\n      width: PropTypes.string,\n    }),\n  }).isRequired,\n  imageWidth: PropTypes.string,\n  mode: PropTypes.string,\n};\n\nImageElement.defaultProps = {\n  imageWidth: undefined,\n  mode: undefined,\n};\n\nexport default ImageElement;\n"],"names":["CONTENT_PADDING","MIN_PANE_SIZE","ImageElement","props","attributes","element","imageWidth","mode","children","isWriteMode","wrapperRef","useRef","imageRef","editor","useSlateStatic","pointermoveController","AbortController","setPaneWidth","width","current","style","setProperty","getPaneWidth","containerElement","document","getElementById","url","pxWidth","window","getComputedStyle","getPropertyValue","parseInt","body","clientWidth","stopDragging","Transforms","removeNodes","at","ReactEditor","findPath","insertNodes","dimensions","removeEventListener","pageContent","getElementsByClassName","maxPaneSize","offsetWidth","mouseDragHandler","moveEvent","xOffset","startingPaneWidth","preventDefault","Math","min","max","paneOriginAdjustment","pageX","startDraggingRight","event","addEventListener","signal","useEffect","abort","containerWidth","_jsxs","_jsx","styles","resizable","container","handleLeft","image","handleRight","propTypes","PropTypes","shape","isRequired","node","string","defaultProps","undefined"],"mappings":"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"}

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

@@ -1 +1,48 @@
-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};
+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

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

@@ -0,0 +1 @@
+{"version":3,"file":"VideoElement.js","sources":["../../../../../src/components/SlateFormattedText/Elements/VideoElement/VideoElement.js"],"sourcesContent":["import { number, shape, string, node } from 'prop-types';\n\nimport styles from './style.css';\n\nconst VideoElement = ({ attributes, element, children }) => {\n  const { url, width } = element;\n  if (!url) return null;\n\n  return (\n    <div {...attributes}>\n      <div contentEditable={false}>\n        <div className={styles.videoContainer}>\n          <iframe\n            className={styles.player}\n            style={{\n              width: `${width ? `${width}px` : '100%'}`,\n              height: `${width ? `calc(${width}px/1.77)` : '100%'}`,\n            }}\n            src={url}\n            frameBorder=\"0\"\n            allowFullScreen\n            title=\"video\"\n          />\n        </div>\n      </div>\n      {children}\n    </div>\n  );\n};\n\nVideoElement.propTypes = {\n  element: shape({ url: string.isRequired, width: number.isRequired }).isRequired,\n  attributes: shape({}).isRequired,\n  children: node.isRequired,\n};\n\nexport default VideoElement;\n"],"names":["VideoElement","attributes","element","children","url","width","_jsxs","_jsx","styles","videoContainer","player","height","propTypes","shape","string","isRequired","number","node"],"mappings":";;;;;;;;;IAIMA,YAAY,GAAG,SAAfA,YAAe,OAAuC;AAAA,MAApCC,UAAoC,QAApCA,UAAoC;AAAA,MAAxBC,OAAwB,QAAxBA,OAAwB;AAAA,MAAfC,QAAe,QAAfA,QAAe;AAAA,MAClDC,GADkD,GACnCF,OADmC,CAClDE,GADkD;AAAA,MAC7CC,KAD6C,GACnCH,OADmC,CAC7CG,KAD6C;AAE1D,MAAI,CAACD,GAAL,EAAU,OAAO,IAAP;AAEV,sBACEE,4CAASL,UAAT;AAAA,4BACEM;AAAK,MAAA,eAAe,EAAE,KAAtB;AAAA,6BACEA;AAAK,QAAA,SAAS,EAAEC,MAAM,CAACC,cAAvB;AAAA,+BACEF;AACE,UAAA,SAAS,EAAEC,MAAM,CAACE,MADpB;AAEE,UAAA,KAAK,EAAE;AACLL,YAAAA,KAAK,YAAKA,KAAK,aAAMA,KAAN,UAAkB,MAA5B,CADA;AAELM,YAAAA,MAAM,YAAKN,KAAK,kBAAWA,KAAX,gBAA6B,MAAvC;AAFD,WAFT;AAME,UAAA,GAAG,EAAED,GANP;AAOE,UAAA,WAAW,EAAC,GAPd;AAQE,UAAA,eAAe,MARjB;AASE,UAAA,KAAK,EAAC;AATR;AADF;AADF,MADF,EAgBGD,QAhBH;AAAA,KADF;AAoBD;;AAEDH,YAAY,CAACY,SAAb,GAAyB;AACvBV,EAAAA,OAAO,EAAEW,KAAK,CAAC;AAAET,IAAAA,GAAG,EAAEU,MAAM,CAACC,UAAd;AAA0BV,IAAAA,KAAK,EAAEW,MAAM,CAACD;AAAxC,GAAD,CAAL,CAA4DA,UAD9C;AAEvBd,EAAAA,UAAU,EAAEY,KAAK,CAAC,EAAD,CAAL,CAAUE,UAFC;AAGvBZ,EAAAA,QAAQ,EAAEc,IAAI,CAACF;AAHQ,CAAzB;;;;"}

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

@@ -1 +1,8 @@
-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};
+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

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

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,wBAAwB,0DAA+D;AACvF;AACA;AACA;AACA;AACA;AACA;"}

package/components/SlateFormattedText/RenderElements.js

@@ -1 +1,228 @@
-import e from"@babel/runtime/helpers/defineProperty";import{withStyles as r,Tooltip as t}from"@material-ui/core";import n from"@material-ui/icons/Language";import a from"classnames";import{TEXT_FORMATS as i}from"./Constants.js";import l from"./Elements/ImageElement/ImageElement.js";import c from"./Elements/VideoElement/VideoElement.js";import s from"./style.css.js";import{jsx as o,jsxs as m}from"react/jsx-runtime";function d(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function u(r){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?d(Object(n),!0).forEach((function(t){e(r,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(n)):d(Object(n)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(n,e))}))}return r}var h=r({tooltip:{height:24,maxWidth:168}})(t),p=r({root:{color:"#bdbdbd",fontSize:14,marginRight:8}})(n),b=function(r){var t=r.attributes,n=r.leaf,i=r.children;return n.bold&&(i=o("strong",{children:i})),n.italic&&(i=o("em",{children:i})),n.underline&&(i=o("u",{children:i})),n.contrastText&&(i=o("span",{className:s.contrastText,children:i})),n.textPrimary&&(i=o("span",{className:s.textPrimary,children:i})),n.bodyLeaf&&(i=o("span",{className:s.body,children:i})),n.captionLeaf&&(i=o("span",{className:s.caption,children:i})),n.codeLeaf&&(i=o("span",{className:s.code,children:i})),o("span",u(u({},t),{},{className:a("token",e({"attr-name":n["attr-name"],"class-name":n["class-name"],boolean:n.boolean,char:n.char,comment:n.comment||n.visiblePragma,constant:n.constant,constants:n.constants,function:n.function,keyword:n.keyword,number:n.number,operator:n.operator,punctuation:n.punctuation,regex:n.regex,selector:n.selector,string:n.string,symbol:n.symbol,tag:n.tag,url:n.url,variable:n.variable},s.invisible,n.invisiblePragma)),children:i}))},f=function(e){var r=e.attributes,t=e.children,n=e.element;switch(n.type){case"block-quote":return o("blockquote",u(u({},r),{},{children:t}));case"bulleted-list":return o("ul",u(u({},r),{},{className:s.bulletedList,children:t}));case"numbered-list":var d,b,f=s.numberedList;return 1===(null===(d=n.children)||void 0===d?void 0:d.length)&&null!==(b=n.children)&&void 0!==b&&b[0].textPrimary&&(f=a(s.listItem,s.listItemPrimary)),o("ol",u(u({},r),{},{className:f,start:null==n?void 0:n.startPosition,children:t}));case"list-item":var v,y,g=s.listItem;return 1===(null===(v=n.children)||void 0===v?void 0:v.length)&&null!==(y=n.children)&&void 0!==y&&y[0].textPrimary&&(g=a(s.listItem,s.listItemPrimary)),o("li",u(u({},r),{},{className:g,children:t}));case"image":return o(l,u({},e));case i.headerOne:return o("div",{className:s.headerOne,children:t});case i.headerTwo:return o("div",{className:s.headerTwo,children:t});case i.headerThree:return o("div",{className:s.headerThree,children:t});case i.body:return o("div",{className:s.body,children:t});case i.caption:return o("div",{className:s.caption,children:t});case i.code:return o("pre",{className:a("language-js",s.codeBlock),children:t});case"video":return o(c,u({},e));case"link":return o(h,{placement:"bottom-start",title:m("span",{className:s.richTextEditorPopoverLinkElement,children:[o(p,{}),o("a",{href:n.url,children:n.url})]}),children:o("a",u(u({},r),{},{href:n.url,className:s.richTextEditorLinkElement,children:t}))});default:return o("div",{className:s.body,children:t})}};export{f as Element,b as Leaf};
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { withStyles, Tooltip } from '@material-ui/core';
+import classNames from 'classnames';
+import LanguageIcon from '@material-ui/icons/Language';
+import { TEXT_FORMATS } from './Constants.js';
+import ImageElement from './Elements/ImageElement/ImageElement.js';
+import VideoElement from './Elements/VideoElement/VideoElement.js';
+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 StyledTooltip = withStyles({
+  tooltip: {
+    height: 24,
+    maxWidth: 168
+  }
+})(Tooltip);
+var StyledLanguageIcon = withStyles({
+  root: {
+    color: '#bdbdbd',
+    fontSize: 14,
+    marginRight: 8
+  }
+})(LanguageIcon);
+var Leaf = function Leaf(params) {
+  var attributes = params.attributes,
+      leaf = params.leaf;
+  var children = params.children;
+
+  if (leaf.bold) {
+    children = /*#__PURE__*/jsx("strong", {
+      children: children
+    });
+  }
+
+  if (leaf.italic) {
+    children = /*#__PURE__*/jsx("em", {
+      children: children
+    });
+  }
+
+  if (leaf.underline) {
+    children = /*#__PURE__*/jsx("u", {
+      children: children
+    });
+  }
+
+  if (leaf.contrastText) {
+    children = /*#__PURE__*/jsx("span", {
+      className: styles.contrastText,
+      children: children
+    });
+  }
+
+  if (leaf.textPrimary) {
+    children = /*#__PURE__*/jsx("span", {
+      className: styles.textPrimary,
+      children: children
+    });
+  }
+
+  if (leaf.bodyLeaf) {
+    children = /*#__PURE__*/jsx("span", {
+      className: styles.body,
+      children: children
+    });
+  }
+
+  if (leaf.captionLeaf) {
+    children = /*#__PURE__*/jsx("span", {
+      className: styles.caption,
+      children: children
+    });
+  }
+
+  if (leaf.codeLeaf) {
+    children = /*#__PURE__*/jsx("span", {
+      className: styles.code,
+      children: children
+    });
+  }
+
+  return /*#__PURE__*/jsx("span", _objectSpread(_objectSpread({}, attributes), {}, {
+    className: classNames('token', _defineProperty({
+      'attr-name': leaf['attr-name'],
+      'class-name': leaf['class-name'],
+      boolean: leaf.boolean,
+      char: leaf.char,
+      comment: leaf.comment || leaf.visiblePragma,
+      constant: leaf.constant,
+      constants: leaf.constants,
+      function: leaf.function,
+      keyword: leaf.keyword,
+      number: leaf.number,
+      operator: leaf.operator,
+      punctuation: leaf.punctuation,
+      regex: leaf.regex,
+      selector: leaf.selector,
+      string: leaf.string,
+      symbol: leaf.symbol,
+      tag: leaf.tag,
+      url: leaf.url,
+      variable: leaf.variable
+    }, styles.invisible, leaf.invisiblePragma)),
+    children: children
+  }));
+};
+var Element = function Element(params) {
+  var attributes = params.attributes,
+      children = params.children,
+      element = params.element;
+
+  switch (element.type) {
+    case 'block-quote':
+      return /*#__PURE__*/jsx("blockquote", _objectSpread(_objectSpread({}, attributes), {}, {
+        children: children
+      }));
+
+    case 'bulleted-list':
+      return /*#__PURE__*/jsx("ul", _objectSpread(_objectSpread({}, attributes), {}, {
+        className: styles.bulletedList,
+        children: children
+      }));
+
+    case 'numbered-list':
+      {
+        var _element$children, _element$children2;
+
+        var listItemClassName = styles.numberedList;
+
+        if (((_element$children = element.children) === null || _element$children === void 0 ? void 0 : _element$children.length) === 1 && (_element$children2 = element.children) !== null && _element$children2 !== void 0 && _element$children2[0].textPrimary) {
+          listItemClassName = classNames(styles.listItem, styles.listItemPrimary);
+        }
+
+        return /*#__PURE__*/jsx("ol", _objectSpread(_objectSpread({}, attributes), {}, {
+          className: listItemClassName,
+          start: element === null || element === void 0 ? void 0 : element.startPosition,
+          children: children
+        }));
+      }
+
+    case 'list-item':
+      {
+        var _element$children3, _element$children4;
+
+        var _listItemClassName = styles.listItem;
+
+        if (((_element$children3 = element.children) === null || _element$children3 === void 0 ? void 0 : _element$children3.length) === 1 && (_element$children4 = element.children) !== null && _element$children4 !== void 0 && _element$children4[0].textPrimary) {
+          _listItemClassName = classNames(styles.listItem, styles.listItemPrimary);
+        }
+
+        return /*#__PURE__*/jsx("li", _objectSpread(_objectSpread({}, attributes), {}, {
+          className: _listItemClassName,
+          children: children
+        }));
+      }
+
+    case 'image':
+      return /*#__PURE__*/jsx(ImageElement, _objectSpread({}, params));
+
+    case TEXT_FORMATS.headerOne:
+      return /*#__PURE__*/jsx("div", {
+        className: styles.headerOne,
+        children: children
+      });
+
+    case TEXT_FORMATS.headerTwo:
+      return /*#__PURE__*/jsx("div", {
+        className: styles.headerTwo,
+        children: children
+      });
+
+    case TEXT_FORMATS.headerThree:
+      return /*#__PURE__*/jsx("div", {
+        className: styles.headerThree,
+        children: children
+      });
+
+    case TEXT_FORMATS.body:
+      return /*#__PURE__*/jsx("div", {
+        className: styles.body,
+        children: children
+      });
+
+    case TEXT_FORMATS.caption:
+      return /*#__PURE__*/jsx("div", {
+        className: styles.caption,
+        children: children
+      });
+
+    case TEXT_FORMATS.code:
+      return /*#__PURE__*/jsx("pre", {
+        className: classNames('language-js', styles.codeBlock),
+        children: children
+      });
+
+    case 'video':
+      return /*#__PURE__*/jsx(VideoElement, _objectSpread({}, params));
+
+    case 'link':
+      return /*#__PURE__*/jsx(StyledTooltip, {
+        placement: "bottom-start",
+        title: /*#__PURE__*/jsxs("span", {
+          className: styles.richTextEditorPopoverLinkElement,
+          children: [/*#__PURE__*/jsx(StyledLanguageIcon, {}), /*#__PURE__*/jsx("a", {
+            href: element.url,
+            children: element.url
+          })]
+        }),
+        children: /*#__PURE__*/jsx("a", _objectSpread(_objectSpread({}, attributes), {}, {
+          href: element.url,
+          className: styles.richTextEditorLinkElement,
+          children: children
+        }))
+      });
+
+    default:
+      return /*#__PURE__*/jsx("div", {
+        className: styles.body,
+        children: children
+      });
+  }
+};
+
+export { Element, Leaf };
+//# sourceMappingURL=RenderElements.js.map

package/components/SlateFormattedText/RenderElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderElements.js","sources":["../../../src/components/SlateFormattedText/RenderElements.js"],"sourcesContent":["import { Tooltip, withStyles } from '@material-ui/core';\nimport LanguageIcon from '@material-ui/icons/Language';\nimport classnames from 'classnames';\n\nimport { TEXT_FORMATS } from './Constants';\n\nimport { ImageElement, VideoElement } from './Elements';\n\nimport styles from './style.css';\n\nconst StyledTooltip = withStyles({\n  tooltip: {\n    height: 24,\n    maxWidth: 168,\n  },\n})(Tooltip);\n\nconst StyledLanguageIcon = withStyles({\n  root: {\n    color: '#bdbdbd',\n    fontSize: 14,\n    marginRight: 8,\n  },\n})(LanguageIcon);\n\nexport const Leaf = params => {\n  const { attributes, leaf } = params;\n\n  let { children } = params;\n\n  if (leaf.bold) {\n    children = <strong>{children}</strong>;\n  }\n\n  if (leaf.italic) {\n    children = <em>{children}</em>;\n  }\n\n  if (leaf.underline) {\n    children = <u>{children}</u>;\n  }\n\n  if (leaf.contrastText) {\n    children = <span className={styles.contrastText}>{children}</span>;\n  }\n\n  if (leaf.textPrimary) {\n    children = <span className={styles.textPrimary}>{children}</span>;\n  }\n\n  if (leaf.bodyLeaf) {\n    children = <span className={styles.body}>{children}</span>;\n  }\n\n  if (leaf.captionLeaf) {\n    children = <span className={styles.caption}>{children}</span>;\n  }\n\n  if (leaf.codeLeaf) {\n    children = <span className={styles.code}>{children}</span>;\n  }\n\n  return (\n    <span\n      {...attributes}\n      className={classnames('token', {\n        'attr-name': leaf['attr-name'],\n        'class-name': leaf['class-name'],\n        boolean: leaf.boolean,\n        char: leaf.char,\n        comment: leaf.comment || leaf.visiblePragma,\n        constant: leaf.constant,\n        constants: leaf.constants,\n        function: leaf.function,\n        keyword: leaf.keyword,\n        number: leaf.number,\n        operator: leaf.operator,\n        punctuation: leaf.punctuation,\n        regex: leaf.regex,\n        selector: leaf.selector,\n        string: leaf.string,\n        symbol: leaf.symbol,\n        tag: leaf.tag,\n        url: leaf.url,\n        variable: leaf.variable,\n        [styles.invisible]: leaf.invisiblePragma,\n      })}\n    >\n      {children}\n    </span>\n  );\n};\n\nexport const Element = params => {\n  const { attributes, children, element } = params;\n\n  switch (element.type) {\n    case 'block-quote':\n      return <blockquote {...attributes}>{children}</blockquote>;\n    case 'bulleted-list':\n      return (\n        <ul {...attributes} className={styles.bulletedList}>\n          {children}\n        </ul>\n      );\n    case 'numbered-list': {\n      let listItemClassName = styles.numberedList;\n      if (element.children?.length === 1 && element.children?.[0].textPrimary) {\n        listItemClassName = classnames(styles.listItem, styles.listItemPrimary);\n      }\n      return (\n        <ol {...attributes} className={listItemClassName} start={element?.startPosition}>\n          {children}\n        </ol>\n      );\n    }\n    case 'list-item': {\n      let listItemClassName = styles.listItem;\n      if (element.children?.length === 1 && element.children?.[0].textPrimary) {\n        listItemClassName = classnames(styles.listItem, styles.listItemPrimary);\n      }\n      return (\n        <li {...attributes} className={listItemClassName}>\n          {children}\n        </li>\n      );\n    }\n    case 'image':\n      return <ImageElement {...params} />;\n\n    case TEXT_FORMATS.headerOne:\n      return <div className={styles.headerOne}>{children}</div>;\n\n    case TEXT_FORMATS.headerTwo:\n      return <div className={styles.headerTwo}>{children}</div>;\n\n    case TEXT_FORMATS.headerThree:\n      return <div className={styles.headerThree}>{children}</div>;\n\n    case TEXT_FORMATS.body:\n      return <div className={styles.body}>{children}</div>;\n\n    case TEXT_FORMATS.caption:\n      return <div className={styles.caption}>{children}</div>;\n\n    case TEXT_FORMATS.code:\n      return <pre className={classnames('language-js', styles.codeBlock)}>{children}</pre>;\n\n    case 'video':\n      return <VideoElement {...params} />;\n\n    case 'link':\n      return (\n        <StyledTooltip\n          placement=\"bottom-start\"\n          title={\n            <span className={styles.richTextEditorPopoverLinkElement}>\n              <StyledLanguageIcon />\n              <a href={element.url}>{element.url}</a>\n            </span>\n          }\n        >\n          <a {...attributes} href={element.url} className={styles.richTextEditorLinkElement}>\n            {children}\n          </a>\n        </StyledTooltip>\n      );\n\n    default:\n      return <div className={styles.body}>{children}</div>;\n  }\n};\n"],"names":["StyledTooltip","withStyles","tooltip","height","maxWidth","Tooltip","StyledLanguageIcon","root","color","fontSize","marginRight","LanguageIcon","Leaf","params","attributes","leaf","children","bold","_jsx","italic","underline","contrastText","styles","textPrimary","bodyLeaf","body","captionLeaf","caption","codeLeaf","code","classnames","boolean","char","comment","visiblePragma","constant","constants","function","keyword","number","operator","punctuation","regex","selector","string","symbol","tag","url","variable","invisible","invisiblePragma","Element","element","type","bulletedList","listItemClassName","numberedList","length","listItem","listItemPrimary","startPosition","TEXT_FORMATS","headerOne","headerTwo","headerThree","codeBlock","_jsxs","richTextEditorPopoverLinkElement","richTextEditorLinkElement"],"mappings":"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"}

package/components/SlateFormattedText/SlateFormattedText.js

@@ -1 +1,126 @@
-import t from"@babel/runtime/helpers/toConsumableArray";import e from"@babel/runtime/helpers/defineProperty";import{useMemo as r,useCallback as n}from"react";import a from"prop-types";import{withReact as o,Slate as i,Editable as l}from"slate-react";import{createEditor as c}from"slate";import{every as s}from"lodash";import{Element as p,Leaf as d}from"./RenderElements.js";import{slateFormattingTextUtils as f}from"./utils.js";import{jsx as u,jsxs as m}from"react/jsx-runtime";function O(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.push.apply(r,n)}return r}function S(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?O(Object(n),!0).forEach((function(r){e(t,r,n[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):O(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}var x=function(e){var a,O=e.text,x=e.textsList,y=e.defaultText,b=e.defaultRenderingTextNode,g=e.locator,h="".concat(g,"_slateText"),T=r((function(){return o(c())}),[]),j=n((function(t){return u(p,S({},t))}),[]),N=n((function(t){return u(d,S({},t))}),[]),v=r((function(){var e=f.getValidSlateJSON(O),r=e.isTextValidSlateJSON,n=e.parsedJSON;if(x.length){var a=x.map((function(t){return f.getValidSlateJSON(t)}));r=s(a,(function(t){return t.isTextValidSlateJSON})),n=f.getDefaultParagraphObjectEmpty(),r&&a.forEach((function(e){var r,a=e.parsedJSON;f.isSlateTextEmpty(a)||(n[0].children=(r=n[0].children).concat.apply(r,t(a.map((function(t){return t.children})))));n[0].children=n[0].children.concat({text:"\n"})}))}var o=r&&f.isSlateTextEmpty(n);return{isValidSlateJSON:r,parsedSlateJSON:n,isEmptySlateJSON:o}}),[O,String(x)]),J=v.isValidSlateJSON,E=v.parsedSlateJSON,P=v.isEmptySlateJSON,V=f.getFormattedText({isValid:J,isEmpty:P,text:O,parsedText:E,defaultText:y});return a=x.length>0?x.map((function(t){return m("span",{"data-testid":"".concat(h,"_listItem"),children:[t,u("br",{})]},t)})):J&&P||!b?V:b,J&&!P?u(i,{editor:T,value:V,children:u(l,{"data-testid":"".concat(h,"_editable"),renderElement:j,renderLeaf:N,readOnly:!0})}):a};x.propTypes={text:a.string,textsList:a.arrayOf(a.string),defaultText:a.oneOfType([a.string,a.node]),defaultRenderingTextNode:a.node,locator:a.string},x.defaultProps={text:"",textsList:[],defaultText:"",defaultRenderingTextNode:void 0,locator:"SlateFormattedText"};export{x as default};
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { every } from 'lodash';
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useMemo, useCallback } from 'react';
+import PropTypes from 'prop-types';
+import { withReact, Slate, Editable } from 'slate-react';
+import { createEditor } from 'slate';
+import { Element, Leaf } from './RenderElements.js';
+import { slateFormattingTextUtils } from './utils.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 PAGE_NAME = 'SlateFormattedText';
+
+var SlateFormattedText = function SlateFormattedText(_ref) {
+  var text = _ref.text,
+      textsList = _ref.textsList,
+      defaultText = _ref.defaultText,
+      defaultRenderingTextNode = _ref.defaultRenderingTextNode,
+      locator = _ref.locator;
+  var currentLocator = "".concat(locator, "_slateText");
+  var editor = useMemo(function () {
+    return withReact(createEditor());
+  }, []);
+  var renderElement = useCallback(function (props) {
+    return /*#__PURE__*/jsx(Element, _objectSpread({}, props));
+  }, []);
+  var renderLeaf = useCallback(function (props) {
+    return /*#__PURE__*/jsx(Leaf, _objectSpread({}, props));
+  }, []);
+
+  var _useMemo = useMemo(function () {
+    var _slateFormattingTextU = slateFormattingTextUtils.getValidSlateJSON(text),
+        isTextValidSlateJSON = _slateFormattingTextU.isTextValidSlateJSON,
+        parsedJSON = _slateFormattingTextU.parsedJSON;
+
+    if (textsList.length) {
+      var validatedAndParsedTextsList = textsList.map(function (item) {
+        return slateFormattingTextUtils.getValidSlateJSON(item);
+      });
+      isTextValidSlateJSON = every(validatedAndParsedTextsList, function (item) {
+        return item.isTextValidSlateJSON;
+      });
+      parsedJSON = slateFormattingTextUtils.getDefaultParagraphObjectEmpty();
+
+      if (isTextValidSlateJSON) {
+        validatedAndParsedTextsList.forEach(function (item) {
+          var parsedItem = item.parsedJSON;
+
+          if (!slateFormattingTextUtils.isSlateTextEmpty(parsedItem)) {
+            var _parsedJSON$0$childre;
+
+            parsedJSON[0].children = (_parsedJSON$0$childre = parsedJSON[0].children).concat.apply(_parsedJSON$0$childre, _toConsumableArray(parsedItem.map(function (el) {
+              return el.children;
+            })));
+          }
+
+          parsedJSON[0].children = parsedJSON[0].children.concat({
+            text: '\n'
+          });
+        });
+      }
+    }
+
+    var isTextEmptySlateJSON = isTextValidSlateJSON && slateFormattingTextUtils.isSlateTextEmpty(parsedJSON);
+    return {
+      isValidSlateJSON: isTextValidSlateJSON,
+      parsedSlateJSON: parsedJSON,
+      isEmptySlateJSON: isTextEmptySlateJSON
+    };
+  }, [text, String(textsList)]),
+      isValidSlateJSON = _useMemo.isValidSlateJSON,
+      parsedSlateJSON = _useMemo.parsedSlateJSON,
+      isEmptySlateJSON = _useMemo.isEmptySlateJSON;
+
+  var textFormatted = slateFormattingTextUtils.getFormattedText({
+    isValid: isValidSlateJSON,
+    isEmpty: isEmptySlateJSON,
+    text: text,
+    parsedText: parsedSlateJSON,
+    defaultText: defaultText
+  });
+  var notSlateText;
+
+  if (textsList.length > 0) {
+    notSlateText = textsList.map(function (textsListItem) {
+      return /*#__PURE__*/jsxs("span", {
+        "data-testid": "".concat(currentLocator, "_listItem"),
+        children: [textsListItem, /*#__PURE__*/jsx("br", {})]
+      }, textsListItem);
+    });
+  } else {
+    notSlateText = isValidSlateJSON && isEmptySlateJSON || !defaultRenderingTextNode ? textFormatted : defaultRenderingTextNode;
+  }
+
+  return isValidSlateJSON && !isEmptySlateJSON ? /*#__PURE__*/jsx(Slate, {
+    editor: editor,
+    value: textFormatted,
+    children: /*#__PURE__*/jsx(Editable, {
+      "data-testid": "".concat(currentLocator, "_editable"),
+      renderElement: renderElement,
+      renderLeaf: renderLeaf,
+      readOnly: true
+    })
+  }) : notSlateText;
+};
+
+SlateFormattedText.propTypes = {
+  text: PropTypes.string,
+  textsList: PropTypes.arrayOf(PropTypes.string),
+  defaultText: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+  defaultRenderingTextNode: PropTypes.node,
+  locator: PropTypes.string
+};
+SlateFormattedText.defaultProps = {
+  text: '',
+  textsList: [],
+  defaultText: '',
+  defaultRenderingTextNode: undefined,
+  locator: PAGE_NAME
+};
+
+export default SlateFormattedText;
+//# sourceMappingURL=SlateFormattedText.js.map