@ajoelp/react-html-wysiwyg - npm Package Compare versions

Comparing version 0.3.1 to 0.4.2

dist/components/Dropdown.d.ts

 import React, { ReactElement } from 'react';
 export declare const DropdownTrigger: React.FC<{
     noArrow?: boolean;
-    className?: string;
 }>;
@@ -6,0 +5,0 @@ export declare const DropdownMenu: React.FC<{

dist/components/IconButton.d.ts

 import React from 'react';
-interface IconButtonProps extends React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> {
-    active?: boolean;
-}
-export declare const IconButton: React.FC<IconButtonProps>;
-export {};
+export declare const IconButton: React.FC<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>>;

dist/components/ToolbarButton.d.ts

 import React from 'react';
-declare type ButtonProps = React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> & {
-    active?: boolean;
-};
-export default function ToolbarButton({ onClick, ref: _ref, ...rest }: ButtonProps): JSX.Element;
+declare type ButtonProps = React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
+export default function ToolbarButton({ onClick, ...rest }: ButtonProps): JSX.Element;
 export {};

dist/Dialogs/BaseDialog.d.ts

@@ -1,7 +0,14 @@
-import React from 'react';
+import { ReactNode } from 'react';
+declare const SIZES: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+};
 interface BaseDialogProps {
-    onClose(): any;
-    children: React.ReactNode;
+    children: ReactNode;
+    size?: keyof typeof SIZES;
+    closeDialog(): void;
 }
-export default function BaseDialog(props: BaseDialogProps): JSX.Element;
+export declare function BaseDialog({ children, closeDialog, size }: BaseDialogProps): JSX.Element;
 export {};

dist/react-html-wysiwyg.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),n=e(t),r=require("react-custom-scrollbars"),o=require("draft-js");require("draft-js/dist/Draft.css");var a=e(require("draftjs-to-html")),i=e(require("html-to-draftjs"));require("@reach/dialog/styles.css");var l=require("draftjs-utils"),c=require("styled-components"),u=e(c),d=e(require("lodash/get")),s=require("styled-system"),m=require("@reach/dialog"),f=require("polished"),g=require("framer-motion"),h=require("react-dropzone");function v(){return(v=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function p(e,t){if(null==e)return{};var n,r,o={},a=Object.keys(e);for(r=0;r<a.length;r++)t.indexOf(n=a[r])>=0||(o[n]=e[n]);return o}function E(e,t){return t||(t=e.slice(0)),e.raw=t,e}function y(){var e=E(["\n  margin: 0;\n  padding: 0;\n  border: none;\n  background: transparent;\n"]);return y=function(){return e},e}var b=u.button(y());function C(e){var t=e.onClick,r=p(e,["onClick","ref"]);return n.createElement(b,Object.assign({onClick:function(e){e.preventDefault(),t&&t(e)}},r))}function x(e){return function(t){return d(t.theme,e)}}function k(){var e=E(["\n      background: ",";\n      cursor: pointer;\n    "]);return k=function(){return e},e}function S(){var e=E(["\n  height: 30px;\n  width: 30px;\n  border: 1px solid ",";\n  border-radius: ",";\n  padding: 0.5em;\n  margin-right: 0.5em;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  &:hover {\n    background: ",";\n    cursor: pointer;\n  }\n  ","\n"]);return S=function(){return e},e}var w=u(C)(S(),x("colors.borderColor"),x("rounding"),x("colors.primary"),(function(e){return e.active&&c.css(k(),x("colors.primary"))})),H=function(e){var t=e.className,r=p(e,["className","ref"]);return n.createElement(w,Object.assign({className:t},r))};function z(e){var n,r,o=J().editorState,a=(n=o,r=t.useRef(),t.useEffect((function(){r.current=n}),[n]),r.current);t.useEffect((function(){o!==a&&e()}),[o])}function O(){var e=E(["\n  ",";\n  ",";\n  ",";\n  ","\n"]);return O=function(){return e},e}var M=u.div(O(),s.flexbox,s.space,s.color,s.layout),D=[{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M3 4h18v2H3V4zm0 15h14v2H3v-2zm0-5h18v2H3v-2zm0-5h14v2H3V9z",fill:"currentColor"}))},format:"left"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M3 4h18v2H3V4zm2 15h14v2H5v-2zm-2-5h18v2H3v-2zm2-5h14v2H5V9z",fill:"currentColor"}))},format:"center"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M3 4h18v2H3V4zm4 15h14v2H7v-2zm-4-5h18v2H3v-2zm4-5h14v2H7V9z",fill:"currentColor"}))},format:"right"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M3 4h18v2H3V4zm0 15h18v2H3v-2zm0-5h18v2H3v-2zm0-5h18v2H3V9z",fill:"currentColor"}))},format:"justyfy"}];function A(e){var r=e.editorState,o=e.onChange,a=e.toggleAlignment,i=t.useState(r?l.getSelectedBlocksMetadata(r).get("text-align"):void 0),c=i[0],u=i[1];return z((function(){u(l.getSelectedBlocksMetadata(r).get("text-align"))})),n.createElement(M,{display:"inline-flex",alignItems:"center"},D.map((function(e){return n.createElement(H,{"data-testid":"button-"+e.format,key:e.format,active:c===e.format,onClick:(t=e.format,function(){if(a)return a(t);o(l.setBlockData(r,{"text-align":t}))})},n.createElement(e.icon,null));var t})))}function j(e,n){var r=J(),a=r.editorState,i=r.onChange,l=t.useState(!1),c=l[0],u=l[1];return{updateBlockEntityData:t.useCallback((function(t){var r=e.getEntityAt(0);n.mergeEntityData(r,t),i(o.EditorState.push(a,n,"change-block-data")),u(!c)}),[e,n,c,a,i])}}function B(e){return e?"string"==typeof e?e:e.target?e.target.value:e:e}function L(){var e=E(["\n  ","\n  * {\n    box-sizing: border-box;\n  }\n"]);return L=function(){return e},e}var I=u.div(L(),x("base"));function N(e){return n.createElement(m.DialogOverlay,{isOpen:!0,onDismiss:e.onClose,style:{zIndex:9e3}},n.createElement(m.DialogContent,{style:{width:"100%",maxWidth:400,zIndex:9e3}},n.createElement(I,null,e.children)))}function T(){var e=E(["\n  width: 100%;\n  padding: 1em;\n  border: 1px solid ",";\n  border-radius: ",";\n"]);return T=function(){return e},e}var V=u.input(T(),x("colors.borderColor"),x("rounding"));function R(){var e=E(["\n  width: 100%;\n  background-color: ",";\n  padding: 1em;\n  border: none;\n  border-radius: ",";\n  color: white;\n  text-transform: uppercase;\n  margin: 1em auto 0;\n  &:hover {\n    cursor: pointer;\n    background-color: ",";\n  }\n"]);return R=function(){return e},e}var q=u.button(R(),x("colors.primary"),x("rounding"),(function(e){return f.darken(.1,x("colors.primary")(e))})),U={embed:function(e){var r=e.onClose,o=e.block,a=e.contentState,i=e.entity,l=J(),c=l.editorState,u=l.onChange,d=j(o,c.getCurrentContent()).updateBlockEntityData,s=i.getData(),m=s.height,f=s.width,g=t.useState({height:void 0===m?"auto":m,width:void 0===f?"200px":f,textAlign:s.textAlign,src:s.src}),h=g[0],p=g[1],E=function(e){return function(t){var n;return p(v({},h,((n={})[e]=B(t),n)))}};return o&&a?n.createElement(N,{onClose:r},n.createElement("form",{onSubmit:function(e){e.preventDefault(),d(h)}},n.createElement("div",null,n.createElement("p",null,"Alignment"),n.createElement(A,Object.assign({},{editorState:c,onChange:u,toggleAlignment:function(e){d({textAlign:e})}}))),n.createElement(M,{display:"flex",mb:"1em"},n.createElement(M,{width:"50%",mr:"1em"},n.createElement("p",null,"Width"),n.createElement(V,{type:"text",value:h.width,onChange:E("width")})),n.createElement(M,{width:"50%"},n.createElement("p",null,"Height"),n.createElement(V,{type:"text",value:h.height,onChange:E("height")}))),n.createElement("div",null,n.createElement("p",null,"Source"),n.createElement(V,{type:"text",value:h.src,onChange:E("src")})),n.createElement(q,{type:"submit"},"Apply"))):null},image:function(e){var r=e.onClose,o=e.block,a=e.contentState,i=e.entity,l=J(),c=l.editorState,u=l.onChange,d=j(o,c.getCurrentContent()).updateBlockEntityData,s=i.getData(),m=s.height,f=s.width,g=t.useState({height:void 0===m?"auto":m,width:void 0===f?"200px":f,textAlign:s.textAlign}),h=g[0],p=g[1],E=function(e){return function(t){var n;return p(v({},h,((n={})[e]=B(t),n)))}};return o&&a?n.createElement(N,{onClose:r},n.createElement("form",{onSubmit:function(e){e.preventDefault(),d(h)}},n.createElement("div",null,n.createElement("p",null,"Alignment"),n.createElement(A,Object.assign({},{editorState:c,onChange:u,toggleAlignment:function(e){d({textAlign:e})}}))),n.createElement(M,{display:"flex",mt:"1em"},n.createElement(M,{width:"50%",mr:"1em"},n.createElement("p",null,"Width"),n.createElement(V,{type:"text",value:h.width,onChange:E("width")})),n.createElement(M,{width:"50%"},n.createElement("p",null,"Height"),n.createElement(V,{type:"text",value:h.height,onChange:E("height")}))),n.createElement(q,{type:"submit"},"Apply"))):null},link:function(e){var r=e.onClose,a=e.entityKey,i=e.contentState,l=function(e,n){var r=J(),a=r.editorState,i=r.onChange,l=t.useState(!1),c=l[0],u=l[1];return{updateBlockEntityData:t.useCallback((function(t){n.mergeEntityData(e,t),i(o.EditorState.push(a,n,"change-block-data")),u(!c)}),[n,c,a,e,i])}}(a,i).updateBlockEntityData,c=i.getEntity(a).getData(),u=t.useState({url:c.url,targetOption:c.targetOption}),d=u[0],s=u[1],m=function(e){return function(t){var n;return s(v({},d,((n={})[e]=B(t),n)))}};return i?n.createElement(N,{onClose:r},n.createElement("form",{onSubmit:function(e){e.preventDefault(),l(d)}},n.createElement("div",null,n.createElement("p",null,"URL"),n.createElement(V,{type:"text",value:d.url,onChange:m("url")}),n.createElement("p",null,"Target"),n.createElement(V,{type:"text",value:d.targetOption,onChange:m("targetOption")})),n.createElement(q,{type:"submit"},"Apply"))):null}},K=t.createContext({openDialog:function(){}});function P(e){var r=t.useState(),o=r[0],a=r[1],i=t.useState(),l=i[0],c=i[1],u=t.useCallback((function(e,t){a(e),c(t)}),[]),d=o?U[o]:null,s=v({},l,{onClose:function(){a(void 0),c(void 0)}});return n.createElement(K.Provider,{value:{openDialog:u}},e.children,n.createElement(t.Suspense,{fallback:n.createElement("div",null)},d?n.createElement(d,Object.assign({},s)):null))}function _(){var e=t.useContext(K);if(void 0===e)throw new Error("useDialog must be used inside a DialogManager");return e}function F(e){var r=e.entityKey,o=e.contentState,a=e.children,i=o.getEntity(r).getData(),l=i.url,c=i.targetOption,u=i.startOpen,d=_().openDialog,s=function(){d("link",{entityKey:r,contentState:o})};return t.useEffect((function(){u&&s()}),[]),n.createElement("a",{href:l,target:c,onMouseDown:s},a)}var W=[{strategy:function(e,t,n){e.findEntityRanges((function(e){var t=e.getEntity();return null!==t&&"LINK"===n.getEntity(t).getType()}),t)},component:F}];function G(e,t){if("LINK"===e.type)return'<a href="'+e.data.url+'" target="'+(e.data.targetOption||"_self")+'">'+t+"</a>";if("IMAGE"===e.type){var n=e.data.textAlign;if(n&&n.length)return'<div style="text-align:'+n+';"><img src="'+e.data.src+'" alt="'+e.data.alt+'" style="display: inline-block; height: '+e.data.height+";width: "+e.data.width+'"/></div>'}}var Z=t.createContext({editorState:o.EditorState.createEmpty(),readOnly:!1,config:{},onChange:function(){},setReadOnly:function(){},focus:function(){}});function J(){var e=t.useContext(Z);if(void 0===e)throw new Error("useEditorState must be used inside EditorStateContext");return e}function Q(e){var r=e.children,l=e.value,c=e.onValueChange,u=e.config,d=t.useMemo((function(){return new o.CompositeDecorator(W)}),[]),s=t.useState(o.EditorState.createEmpty(d)),m=s[0],f=s[1],g=t.useState(!1),h=g[0],v=g[1],p=t.useRef(null),E=t.useCallback((function(){p.current&&p.current.focus()}),[p]);return t.useEffect((function(){var e=i.default?i.default(l):i(l);if(e){var t=o.ContentState.createFromBlockArray(e.contentBlocks),n=o.EditorState.createWithContent(t,d);f(n)}}),[]),n.createElement(Z.Provider,{value:{editorState:m,onChange:function(e){f(e),c(a(o.convertToRaw(e.getCurrentContent()),null,null,G))},readOnly:h,setReadOnly:v,config:u,ref:p,focus:E}},r)}function X(e){var t=e.getData().get("text-align");return t?"editor-text-"+t:""}function Y(){var e=E(["\n  display: inline-block;\n  pointer-events: none;\n"]);return Y=function(){return e},e}function $(){var e=E(["\n  position: relative;\n"]);return $=function(){return e},e}var ee=u(M)($()),te=u(M)(Y()),ne={IMAGE:function(e){var t=e.contentState,r=e.block,o=t.getEntity(r.getEntityAt(0)),a=o.getData(),i=a.src,l=a.height,c=void 0===l?"auto":l,u=a.width,d=void 0===u?"200px":u,s=a.alt,m=a.textAlign,f=_().openDialog;return n.createElement("div",{className:"relative",style:{textAlign:m},onMouseDown:function(){return f("image",{block:r,contentState:t,entity:o})}},n.createElement("img",Object.assign({className:"inline-block"},{src:i,alt:s,style:{height:c,width:d,margin:0}})))},EMBEDDED_LINK:function(e){var t=e.contentState,r=e.block,o=t.getEntity(r.getEntityAt(0)),a=o.getData(),i=a.src,l=a.height,c=void 0===l?"auto":l,u=a.width,d=void 0===u?"200px":u,s=a.textAlign,m=_().openDialog;return n.createElement(ee,{style:{textAlign:s},onMouseDown:function(e){e.preventDefault(),m("embed",{contentState:t,block:r,entity:o})}},n.createElement(te,null,n.createElement("iframe",{title:i,width:d,height:c,src:i,frameBorder:"0",allow:"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"})))},LINK:F};function re(e){return function(t){if("atomic"===t.getType()){var n,r=null===(n=e.getCurrentContent())||void 0===n?void 0:n.getEntity(t.getEntityAt(0));if(r&&Object.keys(ne).includes(r.getType()))return{component:ne[r.getType()],editable:!0}}}}function oe(){var e=E([""]);return oe=function(){return e},e}var ae=u.div(oe());function ie(e){var t,a,i,l=e.placeholder,c=void 0===l?"Type Here":l,u=e.className,d=J(),s=d.editorState,m=d.onChange,f=d.readOnly,g=d.ref,h=d.focus,v=d.config,p=function(){var e=J().onChange;return function(t,n){var r=o.RichUtils.handleKeyCommand(n,t);return r?(e(r),"handled"):"not-handled"}}(),E=null!==(t=v.editorWrapper)&&void 0!==t?t:ae;return n.createElement("div",{"data-testid":"editor",onClick:h},n.createElement(r.Scrollbars,{style:{overflow:"hidden"},autoHeight:!0,autoHeightMin:null!==(a=v.height)&&void 0!==a?a:300,autoHeightMax:null!==(i=v.height)&&void 0!==i?i:300},n.createElement(E,{className:u,ref:g},n.createElement(o.Editor,{placeholder:c,editorState:s,onChange:m,handleKeyCommand:p,blockStyleFn:X,readOnly:f,blockRendererFn:re(s)}))))}function le(){var e=E(["\n  position: relative;\n"]);return le=function(){return e},e}function ce(){var e=E(["\n  position: absolute;\n  background: white;\n  width: 200px;\n  z-index: 30;\n  border-radius: ",";\n  border: 1px solid ",";\n  left: 0;\n  overflow: hidden;\n  margin-top: 0.5em;\n"]);return ce=function(){return e},e}function ue(){var e=E(["\n  width: 15px;\n  height: auto;\n  margin-left: 0.5em;\n"]);return ue=function(){return e},e}function de(){var e=E(["\n  display: flex;\n  align-items: center;\n  font-size: 0.9em;\n  width: auto;\n  border: none;\n  background: none;\n  position: relative;\n  margin: 0;\n  padding: 0;\n"]);return de=function(){return e},e}var se=t.createContext({open:!1,setOpen:function(){}}),me=u.button(de()),fe=u.svg(ue()),ge=function(e){var r=e.children,o=e.noArrow,a=e.className,i=t.useContext(se),l=i.open,c=i.setOpen;return n.createElement(me,{onClick:function(){return c(!l)},className:a},r,!o&&n.createElement(fe,{viewBox:"0 0 24 24"},n.createElement("rect",{width:"24",height:"24",fill:"none",rx:"0",ry:"0"}),n.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11.2913 15.7064L5.29128 9.70641C4.90128 9.31641 4.90128 8.68641 5.29128 8.29641C5.68128 7.90641 6.31128 7.90641 6.70128 8.29641L12.0013 13.5864L17.2913 8.29641C17.6813 7.90641 18.3113 7.90641 18.7013 8.29641C18.9013 8.48641 19.0013 8.73641 19.0013 8.99641C19.0013 9.25641 18.9013 9.50641 18.7113 9.70641L12.7113 15.7064C12.3213 16.0964 11.6813 16.0964 11.2913 15.7064Z",fill:"currentColor"})))},he=u(g.motion.div)(ce(),x("rounding"),x("colors.borderColor")),ve=function(e){var r=e.children,o=t.useContext(se);return n.createElement(g.AnimatePresence,null,o.open&&n.createElement(he,{initial:{opacity:0,marginTop:-10},animate:{opacity:1,marginTop:0},exit:{opacity:0,marginTop:10},transition:{duration:.1}},r))},pe=u(M)(le()),Ee=function(e){var r=e.children,o=n.useState(!1),a=o[0],i=o[1],l=function(e){var r=n.useRef(null),o=t.useCallback((function(t){var n;(null===(n=r.current)||void 0===n?void 0:n.contains(t.target))||e()}),[e]);return t.useEffect((function(){return document.addEventListener("mousedown",o),function(){document.removeEventListener("mousedown",o)}}),[o]),r}((function(){return i(!1)}));return n.createElement(se.Provider,{value:{open:a,setOpen:i}},n.createElement(pe,{ref:l},r))};function ye(){var e=E(["\n  height: 30px;\n  width: auto;\n  border: 1px solid ",";\n  border-radius: ",";\n  padding: 0.5em;\n  margin-right: 0.5em;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  &:hover {\n    background-color: ",";\n    cursor: pointer;\n  }\n"]);return ye=function(){return e},e}function be(){var e=E(["\n  display: block;\n  width: 100%;\n  padding: 1em 0.5em;\n  text-align: left;\n  &:hover {\n    cursor: pointer;\n    background-color: ",";\n  }\n"]);return be=function(){return e},e}var Ce=[{label:"Normal",type:"unstyled"},{label:"Heading 1",type:"header-one"},{label:"Heading 2",type:"header-two"},{label:"Heading 3",type:"header-three"},{label:"Heading 4",type:"header-four"},{label:"Heading 5",type:"header-five"},{label:"Heading 6",type:"header-six"},{label:"Blockquote",type:"blockquote"},{label:"Code",type:"code"}],xe=u((function(e){var r=e.onClick,o=p(e,["onClick"]),a=t.useContext(se).setOpen;return n.createElement(C,Object.assign({onClick:function(e){r&&r(e),a(!1)}},o))}))(be(),x("colors.primary")),ke=u(ge)(ye(),x("colors.borderColor"),x("rounding"),x("colors.primary")),Se=[{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M8 11h4.5a2.5 2.5 0 100-5H8v5zm10 4.5a4.5 4.5 0 01-4.5 4.5H6V4h6.5a4.5 4.5 0 013.256 7.606A4.498 4.498 0 0118 15.5zM8 13v5h5.5a2.5 2.5 0 100-5H8z",fill:"currentColor"}))},format:"BOLD"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M15 20H7v-2h2.927l2.116-12H9V4h8v2h-2.927l-2.116 12H15z",fill:"currentColor"}))},format:"ITALIC"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{fill:"currentColor",d:"M8 3v9a4 4 0 108 0V3h2v9a6 6 0 11-12 0V3h2zM4 20h16v2H4v-2z"}))},format:"UNDERLINE"}];function we(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M14.828 7.757l-5.656 5.657a1 1 0 101.414 1.414l5.657-5.656A3 3 0 1012 4.929l-5.657 5.657a5 5 0 107.071 7.07L19.071 12l1.414 1.414-5.657 5.657a7 7 0 11-9.9-9.9l5.658-5.656a5 5 0 017.07 7.07L12 16.244A3 3 0 117.757 12l5.657-5.657 1.414 1.414z",fill:"currentColor"}))}function He(){var e=E(["\n  display: flex;\n  align-items: center;\n  justify-items: center;\n  padding: 2em;\n  border: 3px dashed ",";\n  text-align: center;\n  cursor: pointer;\n  &:hover {\n    ","\n  }\n"]);return He=function(){return e},e}"undefined"!=typeof Symbol&&(Symbol.iterator||(Symbol.iterator=Symbol("Symbol.iterator"))),"undefined"!=typeof Symbol&&(Symbol.asyncIterator||(Symbol.asyncIterator=Symbol("Symbol.asyncIterator")));var ze=u(M)(He(),x("colors.borderColor"),x("colors.borderColor"));function Oe(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{fill:"currentColor",d:"M18.364 15.536L16.95 14.12l1.414-1.414a5 5 0 10-7.071-7.071L9.879 7.05 8.464 5.636 9.88 4.222a7 7 0 019.9 9.9l-1.415 1.414zm-2.828 2.828l-1.415 1.414a7 7 0 01-9.9-9.9l1.415-1.414L7.05 9.88l-1.414 1.414a5 5 0 107.071 7.071l1.414-1.414 1.415 1.414zm-.708-10.607l1.415 1.415-7.071 7.07-1.415-1.414 7.071-7.07z"}))}var Me=[{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{fill:"currentColor",d:"M8 4h13v2H8V4zM4.5 6.5a1.5 1.5 0 110-3 1.5 1.5 0 010 3zm0 7a1.5 1.5 0 110-3 1.5 1.5 0 010 3zm0 6.9a1.5 1.5 0 110-3 1.5 1.5 0 010 3zM8 11h13v2H8v-2zm0 7h13v2H8v-2z"}))},type:"unordered-list-item"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{fill:"currentColor",d:"M8 4h13v2H8V4zM5 3v3h1v1H3V6h1V4H3V3h2zM3 14v-2.5h2V11H3v-1h3v2.5H4v.5h2v1H3zm2 5.5H3v-1h2V18H3v-1h3v4H3v-1h2v-.5zM8 11h13v2H8v-2zm0 7h13v2H8v-2z"}))},type:"ordered-list-item"}],De={__proto__:null,blocktype:function(e){var r,a=e.editorState,i=e.onChange,c=t.useState(a?l.getSelectedBlocksType(a):"unstyled"),u=c[0],d=c[1];z((function(){d(l.getSelectedBlocksType(a))}));var s=Ce.find((function(e){return e.type===u}));return n.createElement(Ee,null,n.createElement(ke,null,null!==(r=null==s?void 0:s.label)&&void 0!==r?r:"-"),n.createElement(ve,null,Ce.map((function(e){return n.createElement(xe,{"data-testid":"button-"+e.type,key:e.type,onClick:(t=e.type,function(e){e.preventDefault();var n=o.RichUtils.toggleBlockType(a,t);n&&i(n)})},e.label);var t}))))},formatting:function(e){var r=e.editorState,a=e.onChange,i=t.useState(r?l.getSelectionInlineStyle(r):{}),c=i[0],u=i[1];return z((function(){u(l.getSelectionInlineStyle(r))})),n.createElement(M,{display:"inline-flex",alignItems:"center"},Se.map((function(e){return n.createElement(H,{"data-testid":"button-"+e.format.toLowerCase(),key:e.format,active:!!c[e.format],onClick:(t=e.format,function(){var e=o.RichUtils.toggleInlineStyle(r,t);e&&a(e)})},n.createElement(e.icon,null));var t})))},alignment:A,upload:function(e){var r=e.editorState,a=e.onChange,i=t.useState(!1),l=i[0],c=i[1],u=J().config,d=t.useState()[1],s=t.useCallback((function(e,t){var n=r.getSelection(),i={url:e,targetOption:"_blank"},l=r.getCurrentContent().createEntity("LINK","MUTABLE",i).getLastCreatedEntityKey(),c=o.Modifier.replaceText(r.getCurrentContent(),n,""+t.name,r.getCurrentInlineStyle(),l),u=o.EditorState.push(r,c,"insert-characters");a(u)}),[r,a]),m=t.useCallback((function(e){var t={src:e,width:"100%",height:"auto"},n=r.getCurrentContent().createEntity("IMAGE","MUTABLE",t).getLastCreatedEntityKey(),i=o.AtomicBlockUtils.insertAtomicBlock(r,n," ");a(i)}),[r,a]),f=t.useCallback((function(e){try{var t=function(){if(u.onFileUpload&&e.length){var t=function(t,n){try{var r=(o=e[0],Promise.resolve(u.onFileUpload(o)).then((function(e){c(!1),function(e){return e&&"image"===e.type.split("/")[0]}(o)?m(e):s(e,o),c(!1)})))}catch(e){return n(e)}var o;return r&&r.then?r.then(void 0,n):r}(0,(function(e){var t;d(null!==(t=e.message)&&void 0!==t?t:"An error occurred.")}));if(t&&t.then)return t.then((function(){}))}}();return Promise.resolve(t&&t.then?t.then((function(){})):void 0)}catch(e){return Promise.reject(e)}}),[s,m,u]),g=h.useDropzone({onDrop:f,multiple:!1}),v=g.getRootProps,p=g.getInputProps;return n.createElement(Ee,null,n.createElement(ge,{noArrow:!0},n.createElement(H,{onClick:function(){return c(!l)}},n.createElement(we,null))),n.createElement(ve,null,n.createElement(M,{p:"1em"},n.createElement(ze,Object.assign({},v()),n.createElement("input",Object.assign({},p())),n.createElement(M,{display:"flex",flexDirection:"column"},"Drag or click here")))))},link:function(e){var r=e.editorState,a=e.onChange,i=t.useState(r?l.getSelectionEntity(r):void 0),c=i[0],u=i[1],d=t.useCallback((function(){var e=r.getSelection();if(c){var t=l.getEntityRange(r,c),n=e.getIsBackward();e=e.merge(n?{anchorOffset:t.end,focusOffset:t.start}:{anchorOffset:t.start,focusOffset:t.end})}return e}),[c,r]),s=t.useCallback((function(){a(o.RichUtils.toggleLink(r,d(),null))}),[r,d,a]),m=t.useCallback((function(e,t,n){var i=r.getCurrentContent().createEntity("LINK","MUTABLE",{url:t,targetOption:n,startOpen:!0}),l=i.getLastCreatedEntityKey(),c=o.EditorState.set(r,{currentContent:i});a(o.RichUtils.toggleLink(c,d(),l))}),[r,d,a]);return z((function(){u(l.getSelectionEntity(r))})),n.createElement(H,{onMouseDown:function(e){var t;e.preventDefault();var n=r.getCurrentContent();c&&"LINK"===n.getEntity(c).getType()?s():m(null!==(t=l.getSelectionText(r))&&void 0!==t?t:"Click Here","#","_blank")}},n.createElement(Oe,null))},lists:function(e){var t=e.editorState,r=e.onChange;return n.createElement(n.Fragment,null,Me.map((function(e){return n.createElement(H,{"data-testid":"button-"+e.type,key:e.type,className:"text-gray-800 hover:bg-indigo-500 hover:text-white text-left",onClick:(a=e.type,function(e){e.preventDefault();var n=o.RichUtils.toggleBlockType(t,a);n&&r(n)})},n.createElement(e.icon,null));var a})))}};function Ae(){var e=E(["\n  ",";\n  display: flex;\n  align-items: center;\n  border-bottom: 1px solid ",";\n  background: white;\n  margin-bottom: 1em;\n  padding-bottom: 0.5em;\n"]);return Ae=function(){return e},e}var je=["formatting","blocktype","lists","alignment","link","upload"],Be=u(M)(Ae(),x("base"),x("colors.borderColor"));function Le(e){var t=e.controls,r=void 0===t?je:t,o=J(),a=o.editorState,i=o.onChange;return n.createElement(Be,{onMouseDown:function(e){e.preventDefault()}},r.map((function(e){return n.createElement(De[e],{key:e,editorState:a,onChange:i})})))}function Ie(){var e=E(["\n    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji,\n      Segoe UI Emoji;\n    font-size: 14px;\n    line-height: 1.5;\n    color: #24292e;\n  "]);return Ie=function(){return e},e}var Ne={base:c.css(Ie()),colors:{primary:"#5c7cfa",borderColor:"#dee2e6"},rounding:"0.2em"};function Te(e){var t;return n.createElement(c.ThemeProvider,{theme:null!==(t=e.theme)&&void 0!==t?t:Ne},e.children)}function Ve(){var e=E(["\n  border: 1px solid ",";\n  border-radius: ",";\n  position: relative;\n  padding: 0.5em;\n"]);return Ve=function(){return e},e}var Re=u(M)(Ve(),x("colors.borderColor"),x("rounding"));exports.Editor=function(e){var t=e.editorClassName,r=e.value,o=e.onChange,a=e.toolbarHidden;return n.createElement(Te,{theme:e.theme},n.createElement(Q,{value:void 0===r?"":r,onValueChange:void 0===o?function(){}:o,config:e},n.createElement(P,null,n.createElement(Re,null,!(void 0!==a&&a)&&n.createElement(Le,null),n.createElement(ie,{className:t})))))};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),n=e(t),r=require("react-custom-scrollbars"),a=require("draft-js");require("draft-js/dist/Draft.css");var o=e(require("draftjs-to-html")),i=e(require("html-to-draftjs"));require("@reach/dialog/styles.css");var l=require("draftjs-utils"),c=require("@headlessui/react"),u=require("react-dropzone"),s=e(require("@tippyjs/react")),m=require("framer-motion");function d(e,t,n,r,a,o,i){try{var l=e[o](i),c=l.value}catch(e){return void n(e)}l.done?t(c):Promise.resolve(c).then(r,a)}function f(){return(f=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function h(e,t){if(null==e)return{};var n,r,a={},o=Object.keys(e);for(r=0;r<o.length;r++)t.indexOf(n=o[r])>=0||(a[n]=e[n]);return a}function v(e){var t=e.onClick,r=h(e,["onClick"]);return n.createElement("button",Object.assign({onClick:function(e){e.preventDefault(),t&&t(e)}},r))}var g=function(e){var t=e.className,r=h(e,["className"]);return n.createElement(v,Object.assign({className:"h-8 w-8 border rounded p-1 hover:bg-gray-100 mr-1 items-center justify-center flex "+t},r))};function p(e){var n,r,a=D().editorState,o=(n=a,r=t.useRef(),t.useEffect((function(){r.current=n}),[n]),r.current);t.useEffect((function(){a!==o&&e()}),[e,a,o])}var y=[{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M3 4h18v2H3V4zm0 15h14v2H3v-2zm0-5h18v2H3v-2zm0-5h14v2H3V9z",fill:"currentColor"}))},format:"left"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M3 4h18v2H3V4zm2 15h14v2H5v-2zm-2-5h18v2H3v-2zm2-5h14v2H5V9z",fill:"currentColor"}))},format:"center"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M3 4h18v2H3V4zm4 15h14v2H7v-2zm-4-5h18v2H3v-2zm4-5h14v2H7V9z",fill:"currentColor"}))},format:"right"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M3 4h18v2H3V4zm0 15h18v2H3v-2zm0-5h18v2H3v-2zm0-5h18v2H3V9z",fill:"currentColor"}))},format:"justyfy"}];function E(e){var r=e.editorState,a=e.onChange,o=e.toggleAlignment,i=t.useState(r?l.getSelectedBlocksMetadata(r).get("text-align"):void 0),c=i[0],u=i[1];return p((function(){u(l.getSelectedBlocksMetadata(r).get("text-align"))})),n.createElement("div",{className:"inline-flex items-center"},y.map((function(e){return n.createElement(g,{"data-testid":"button-"+e.format,key:e.format,className:"mr-1 "+(c===e.format?"text-indigo-500":""),onClick:(t=e.format,function(){if(o)return o(t);a(l.setBlockData(r,{"text-align":t}))})},n.createElement(e.icon,null));var t})))}function b(e,n){var r=D(),o=r.editorState,i=r.onChange,l=t.useState(!1),c=l[0],u=l[1];return{updateBlockEntityData:t.useCallback((function(t){var r=e.getEntityAt(0);n.mergeEntityData(r,t),i(a.EditorState.push(o,n,"change-block-data")),u(!c)}),[e,n,c,o,i])}}function x(e){return e?"string"==typeof e?e:e.target?e.target.value:e:e}var w={xs:"sm:max-w-sm",sm:"sm:max-w-lg",md:"sm:max-w-xl",lg:"sm:max-w-2xl"};function C(e){var t=e.children,r=e.size,a=void 0===r?"xs":r;return n.createElement(c.Transition,{appear:!0,show:!0},n.createElement("div",{className:"fixed z-10 inset-0 overflow-y-auto"},n.createElement("div",{className:"flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"},n.createElement(c.Transition.Child,{className:"fixed inset-0",enter:"transition-opacity ease-out duration-300",enterFrom:"opacity-0",enterTo:"opacity-100"},n.createElement("div",{onClick:e.closeDialog,className:"absolute inset-0 bg-gray-500 opacity-75"})),n.createElement("span",{className:"hidden sm:inline-block sm:align-middle sm:h-screen"}),"​",n.createElement(c.Transition.Child,{className:"inline-block align-bottom bg-white rounded-lg px-4 pt-5 pb-4 text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle "+w[a]+" sm:w-full sm:p-6",enter:"ease-out duration-300",enterFrom:"opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95",enterTo:"opacity-100 translate-y-0 sm:scale-100"},n.createElement("div",{role:"dialog","aria-modal":"true","aria-labelledby":"modal-headline"},t)))))}var k={embed:function(e){var r=e.onClose,a=e.block,o=e.contentState,i=e.entity,l=D(),c=l.editorState,u=l.onChange,s=b(a,c.getCurrentContent()).updateBlockEntityData,m=i.getData(),d=m.height,h=m.width,v=t.useState({height:void 0===d?"auto":d,width:void 0===h?"200px":h,textAlign:m.textAlign,src:m.src}),g=v[0],p=v[1],y=function(e){return function(t){var n;return p(f({},g,((n={})[e]=x(t),n)))}};return a&&o?n.createElement(C,{closeDialog:r},n.createElement("form",{onSubmit:function(e){e.preventDefault(),s(g)}},n.createElement("div",null,n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"Alignment"),n.createElement(E,Object.assign({},{editorState:c,onChange:u,toggleAlignment:function(e){s({textAlign:e})}}))),n.createElement("div",{className:"flex mb-2"},n.createElement("div",{className:"w-1/2 mr-2"},n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"Width"),n.createElement("input",{type:"text",className:"border px-3 py-1 w-full rounded",value:g.width,onChange:y("width")})),n.createElement("div",{className:"w-1/2"},n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"Height"),n.createElement("input",{type:"text",className:"border px-3 py-1 w-full rounded",value:g.height,onChange:y("height")}))),n.createElement("div",null,n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"Source"),n.createElement("input",{type:"text",className:"border px-3 py-1 w-full rounded",value:g.src,onChange:y("src")})),n.createElement("button",{className:"bg-gray-300 hover:bg-gray-400 p-2 w-full rounded mt-4",type:"submit"},"Apply"))):null},image:function(e){var r=e.onClose,a=e.block,o=e.contentState,i=e.entity,l=D(),c=l.editorState,u=l.onChange,s=b(a,c.getCurrentContent()).updateBlockEntityData,m=i.getData(),d=m.height,h=m.width,v=t.useState({height:void 0===d?"auto":d,width:void 0===h?"200px":h,textAlign:m.textAlign}),g=v[0],p=v[1],y=function(e){return function(t){var n;return p(f({},g,((n={})[e]=x(t),n)))}};return a&&o?n.createElement(C,{closeDialog:r},n.createElement("form",{onSubmit:function(e){e.preventDefault(),s(g)}},n.createElement("div",null,n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"Alignment"),n.createElement(E,Object.assign({},{editorState:c,onChange:u,toggleAlignment:function(e){s({textAlign:e})}}))),n.createElement("div",{className:"flex mt-4"},n.createElement("div",{className:"w-1/2 mr-2"},n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"Width"),n.createElement("input",{type:"text",className:"border px-3 py-1 w-full rounded",value:g.width,onChange:y("width")})),n.createElement("div",{className:"w-1/2"},n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"Height"),n.createElement("input",{type:"text",className:"border px-3 py-1 w-full rounded",value:g.height,onChange:y("height")}))),n.createElement("button",{className:"bg-gray-300 hover:bg-gray-400 p-2 w-full rounded mt-4",type:"submit"},"Apply"))):null},link:function(e){var r=e.onClose,o=e.entityKey,i=e.contentState,l=function(e,n){var r=D(),o=r.editorState,i=r.onChange,l=t.useState(!1),c=l[0],u=l[1];return{updateBlockEntityData:t.useCallback((function(t){n.mergeEntityData(e,t),i(a.EditorState.push(o,n,"change-block-data")),u(!c)}),[n,c,o,e,i])}}(o,i).updateBlockEntityData,c=i.getEntity(o).getData(),u=t.useState({url:c.url,targetOption:c.targetOption}),s=u[0],m=u[1],d=function(e){return function(t){var n;return m(f({},s,((n={})[e]=x(t),n)))}};return i?n.createElement(C,{closeDialog:r},n.createElement("form",{onSubmit:function(e){e.preventDefault(),l(s)}},n.createElement("div",null,n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"URL"),n.createElement("input",{type:"text",className:"border px-3 py-1 w-full rounded",value:s.url,onChange:d("url")}),n.createElement("p",{className:"text-sm uppercase text-gray-600 mb-1"},"Target"),n.createElement("input",{type:"text",className:"border px-3 py-1 w-full rounded",value:s.targetOption,onChange:d("targetOption")})),n.createElement("button",{className:"bg-gray-300 hover:bg-gray-400 p-2 w-full rounded mt-4",type:"submit"},"Apply"))):null}},S=t.createContext({openDialog:function(){}});function N(e){var r=t.useState(),a=r[0],o=r[1],i=t.useState(),l=i[0],c=i[1],u=t.useCallback((function(e,t){o(e),c(t)}),[]),s=a?k[a]:null,m=f({},l,{onClose:function(){o(void 0),c(void 0)}});return n.createElement(S.Provider,{value:{openDialog:u}},e.children,n.createElement(t.Suspense,{fallback:n.createElement("div",null)},s?n.createElement(s,Object.assign({},m)):null))}function H(){var e=t.useContext(S);if(void 0===e)throw new Error("useDialog must be used inside a DialogManager");return e}function O(e){var r=e.entityKey,a=e.contentState,o=e.children,i=a.getEntity(r).getData(),l=i.url,c=i.targetOption,u=i.startOpen,s=H().openDialog,m=function(){s("link",{entityKey:r,contentState:a})};return t.useEffect((function(){u&&m()}),[]),n.createElement("a",{href:l,target:c,onMouseDown:m},o)}var L=[{strategy:function(e,t,n){e.findEntityRanges((function(e){var t=e.getEntity();return null!==t&&"LINK"===n.getEntity(t).getType()}),t)},component:O}];function z(e,t){if("LINK"===e.type)return'<a href="'+e.data.url+'" target="'+(e.data.targetOption||"_self")+'">'+t+"</a>";if("IMAGE"===e.type){var n=e.data.textAlign;if(n&&n.length)return'<div style="text-align:'+n+';"><img src="'+e.data.src+'" alt="'+e.data.alt+'" style="display: inline-block; height: '+e.data.height+";width: "+e.data.width+'"/></div>'}}var M=t.createContext({editorState:a.EditorState.createEmpty(),readOnly:!1,config:{},onChange:function(){},setReadOnly:function(){},focus:function(){}});function D(){var e=t.useContext(M);if(void 0===e)throw new Error("useEditorState must be used inside EditorStateContext");return e}function j(e){var r=e.children,l=e.value,c=e.onValueChange,u=e.config,s=t.useMemo((function(){return new a.CompositeDecorator(L)}),[]),m=t.useState(a.EditorState.createEmpty(s)),d=m[0],f=m[1],h=t.useState(!1),v=h[0],g=h[1],p=t.useRef(null),y=t.useCallback((function(){p.current&&p.current.focus()}),[p]);return t.useEffect((function(){var e=i.default?i.default(l):i(l);if(e){var t=a.ContentState.createFromBlockArray(e.contentBlocks),n=a.EditorState.createWithContent(t,s);f(n)}}),[s,l]),n.createElement(M.Provider,{value:{editorState:d,onChange:function(e){f(e),c(o(a.convertToRaw(e.getCurrentContent()),null,null,z))},readOnly:v,setReadOnly:g,config:u,ref:p,focus:y}},r)}function A(e){var t=e.getData().get("text-align");return t?"editor-text-"+t:""}var B={IMAGE:function(e){var t=e.contentState,r=e.block,a=t.getEntity(r.getEntityAt(0)),o=a.getData(),i=o.src,l=o.height,c=void 0===l?"auto":l,u=o.width,s=void 0===u?"200px":u,m=o.alt,d=o.textAlign,f=H().openDialog;return n.createElement("div",{className:"relative",style:{textAlign:d},onMouseDown:function(){return f("image",{block:r,contentState:t,entity:a})}},n.createElement("img",Object.assign({className:"inline-block"},{src:i,alt:m,style:{height:c,width:s,margin:0}})))},EMBEDDED_LINK:function(e){var t=e.contentState,r=e.block,a=t.getEntity(r.getEntityAt(0)),o=a.getData(),i=o.src,l=o.height,c=void 0===l?"auto":l,u=o.width,s=void 0===u?"200px":u,m=o.textAlign,d=H().openDialog;return n.createElement("div",{className:"relative",style:{textAlign:m},onMouseDown:function(e){e.preventDefault(),d("embed",{contentState:t,block:r,entity:a})}},n.createElement("div",{className:"inline-block pointer-events-none"},n.createElement("iframe",{title:i,width:s,height:c,src:i,frameBorder:"0",allow:"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"})))},LINK:O};function T(e){return function(t){if("atomic"===t.getType()){var n,r=null==(n=e.getCurrentContent())?void 0:n.getEntity(t.getEntityAt(0));if(r&&Object.keys(B).includes(r.getType()))return{component:B[r.getType()],editable:!0}}}}function _(e){var t,o,i=e.placeholder,l=void 0===i?"Type Here":i,c=e.className,u=D(),s=u.editorState,m=u.onChange,d=u.readOnly,f=u.ref,h=u.focus,v=u.config,g=function(){var e=D().onChange;return function(t,n){var r=a.RichUtils.handleKeyCommand(n,t);return r?(e(r),"handled"):"not-handled"}}();return n.createElement("div",{"data-testid":"editor",onClick:h},n.createElement(r.Scrollbars,{style:{overflow:"hidden"},autoHeight:!0,autoHeightMin:null!=(t=v.height)?t:300,autoHeightMax:null!=(o=v.height)?o:300},n.createElement("div",{className:c,ref:f},n.createElement(a.Editor,{placeholder:l,editorState:s,onChange:m,handleKeyCommand:g,blockStyleFn:A,readOnly:d,blockRendererFn:T(s)}))))}var R,I=[{label:"Normal",type:"unstyled"},{label:"Heading 1",type:"header-one"},{label:"Heading 2",type:"header-two"},{label:"Heading 3",type:"header-three"},{label:"Heading 4",type:"header-four"},{label:"Heading 5",type:"header-five"},{label:"Heading 6",type:"header-six"},{label:"Blockquote",type:"blockquote"},{label:"Code",type:"code"}],V=[{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M8 11h4.5a2.5 2.5 0 100-5H8v5zm10 4.5a4.5 4.5 0 01-4.5 4.5H6V4h6.5a4.5 4.5 0 013.256 7.606A4.498 4.498 0 0118 15.5zM8 13v5h5.5a2.5 2.5 0 100-5H8z",fill:"currentColor"}))},format:"BOLD"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M15 20H7v-2h2.927l2.116-12H9V4h8v2h-2.927l-2.116 12H15z",fill:"currentColor"}))},format:"ITALIC"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{fill:"currentColor",d:"M8 3v9a4 4 0 108 0V3h2v9a6 6 0 11-12 0V3h2zM4 20h16v2H4v-2z"}))},format:"UNDERLINE"}],F=(function(e){var t=function(e){var t=Object.prototype,n=t.hasOwnProperty,r="function"==typeof Symbol?Symbol:{},a=r.iterator||"@@iterator",o=r.asyncIterator||"@@asyncIterator",i=r.toStringTag||"@@toStringTag";function l(e,t,n){return Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}),e[t]}try{l({},"")}catch(e){l=function(e,t,n){return e[t]=n}}function c(e,t,n,r){var a=Object.create((t&&t.prototype instanceof m?t:m).prototype),o=new C(r||[]);return a._invoke=function(e,t,n){var r="suspendedStart";return function(a,o){if("executing"===r)throw new Error("Generator is already running");if("completed"===r){if("throw"===a)throw o;return{value:void 0,done:!0}}for(n.method=a,n.arg=o;;){var i=n.delegate;if(i){var l=b(i,n);if(l){if(l===s)continue;return l}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if("suspendedStart"===r)throw r="completed",n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);r="executing";var c=u(e,t,n);if("normal"===c.type){if(r=n.done?"completed":"suspendedYield",c.arg===s)continue;return{value:c.arg,done:n.done}}"throw"===c.type&&(r="completed",n.method="throw",n.arg=c.arg)}}}(e,n,o),a}function u(e,t,n){try{return{type:"normal",arg:e.call(t,n)}}catch(e){return{type:"throw",arg:e}}}e.wrap=c;var s={};function m(){}function d(){}function f(){}var h={};h[a]=function(){return this};var v=Object.getPrototypeOf,g=v&&v(v(k([])));g&&g!==t&&n.call(g,a)&&(h=g);var p=f.prototype=m.prototype=Object.create(h);function y(e){["next","throw","return"].forEach((function(t){l(e,t,(function(e){return this._invoke(t,e)}))}))}function E(e,t){var r;this._invoke=function(a,o){function i(){return new t((function(r,i){!function r(a,o,i,l){var c=u(e[a],e,o);if("throw"!==c.type){var s=c.arg,m=s.value;return m&&"object"==typeof m&&n.call(m,"__await")?t.resolve(m.__await).then((function(e){r("next",e,i,l)}),(function(e){r("throw",e,i,l)})):t.resolve(m).then((function(e){s.value=e,i(s)}),(function(e){return r("throw",e,i,l)}))}l(c.arg)}(a,o,r,i)}))}return r=r?r.then(i,i):i()}}function b(e,t){var n=e.iterator[t.method];if(void 0===n){if(t.delegate=null,"throw"===t.method){if(e.iterator.return&&(t.method="return",t.arg=void 0,b(e,t),"throw"===t.method))return s;t.method="throw",t.arg=new TypeError("The iterator does not provide a 'throw' method")}return s}var r=u(n,e.iterator,t.arg);if("throw"===r.type)return t.method="throw",t.arg=r.arg,t.delegate=null,s;var a=r.arg;return a?a.done?(t[e.resultName]=a.value,t.next=e.nextLoc,"return"!==t.method&&(t.method="next",t.arg=void 0),t.delegate=null,s):a:(t.method="throw",t.arg=new TypeError("iterator result is not an object"),t.delegate=null,s)}function x(e){var t={tryLoc:e[0]};1 in e&&(t.catchLoc=e[1]),2 in e&&(t.finallyLoc=e[2],t.afterLoc=e[3]),this.tryEntries.push(t)}function w(e){var t=e.completion||{};t.type="normal",delete t.arg,e.completion=t}function C(e){this.tryEntries=[{tryLoc:"root"}],e.forEach(x,this),this.reset(!0)}function k(e){if(e){var t=e[a];if(t)return t.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var r=-1,o=function t(){for(;++r<e.length;)if(n.call(e,r))return t.value=e[r],t.done=!1,t;return t.value=void 0,t.done=!0,t};return o.next=o}}return{next:S}}function S(){return{value:void 0,done:!0}}return d.prototype=p.constructor=f,f.constructor=d,d.displayName=l(f,i,"GeneratorFunction"),e.isGeneratorFunction=function(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===d||"GeneratorFunction"===(t.displayName||t.name))},e.mark=function(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,f):(e.__proto__=f,l(e,i,"GeneratorFunction")),e.prototype=Object.create(p),e},e.awrap=function(e){return{__await:e}},y(E.prototype),E.prototype[o]=function(){return this},e.AsyncIterator=E,e.async=function(t,n,r,a,o){void 0===o&&(o=Promise);var i=new E(c(t,n,r,a),o);return e.isGeneratorFunction(n)?i:i.next().then((function(e){return e.done?e.value:i.next()}))},y(p),l(p,i,"Generator"),p[a]=function(){return this},p.toString=function(){return"[object Generator]"},e.keys=function(e){var t=[];for(var n in e)t.push(n);return t.reverse(),function n(){for(;t.length;){var r=t.pop();if(r in e)return n.value=r,n.done=!1,n}return n.done=!0,n}},e.values=k,C.prototype={constructor:C,reset:function(e){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(w),!e)for(var t in this)"t"===t.charAt(0)&&n.call(this,t)&&!isNaN(+t.slice(1))&&(this[t]=void 0)},stop:function(){this.done=!0;var e=this.tryEntries[0].completion;if("throw"===e.type)throw e.arg;return this.rval},dispatchException:function(e){if(this.done)throw e;var t=this;function r(n,r){return i.type="throw",i.arg=e,t.next=n,r&&(t.method="next",t.arg=void 0),!!r}for(var a=this.tryEntries.length-1;a>=0;--a){var o=this.tryEntries[a],i=o.completion;if("root"===o.tryLoc)return r("end");if(o.tryLoc<=this.prev){var l=n.call(o,"catchLoc"),c=n.call(o,"finallyLoc");if(l&&c){if(this.prev<o.catchLoc)return r(o.catchLoc,!0);if(this.prev<o.finallyLoc)return r(o.finallyLoc)}else if(l){if(this.prev<o.catchLoc)return r(o.catchLoc,!0)}else{if(!c)throw new Error("try statement without catch or finally");if(this.prev<o.finallyLoc)return r(o.finallyLoc)}}}},abrupt:function(e,t){for(var r=this.tryEntries.length-1;r>=0;--r){var a=this.tryEntries[r];if(a.tryLoc<=this.prev&&n.call(a,"finallyLoc")&&this.prev<a.finallyLoc){var o=a;break}}o&&("break"===e||"continue"===e)&&o.tryLoc<=t&&t<=o.finallyLoc&&(o=null);var i=o?o.completion:{};return i.type=e,i.arg=t,o?(this.method="next",this.next=o.finallyLoc,s):this.complete(i)},complete:function(e,t){if("throw"===e.type)throw e.arg;return"break"===e.type||"continue"===e.type?this.next=e.arg:"return"===e.type?(this.rval=this.arg=e.arg,this.method="return",this.next="end"):"normal"===e.type&&t&&(this.next=t),s},finish:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.finallyLoc===e)return this.complete(n.completion,n.afterLoc),w(n),s}},catch:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.tryLoc===e){var r=n.completion;if("throw"===r.type){var a=r.arg;w(n)}return a}}throw new Error("illegal catch attempt")},delegateYield:function(e,t,n){return this.delegate={iterator:k(e),resultName:t,nextLoc:n},"next"===this.method&&(this.arg=void 0),s}},e}(e.exports);try{regeneratorRuntime=t}catch(e){Function("r","regeneratorRuntime = r")(t)}}(R={exports:{}}),R.exports);function U(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{d:"M14.828 7.757l-5.656 5.657a1 1 0 101.414 1.414l5.657-5.656A3 3 0 1012 4.929l-5.657 5.657a5 5 0 107.071 7.07L19.071 12l1.414 1.414-5.657 5.657a7 7 0 11-9.9-9.9l5.658-5.656a5 5 0 017.07 7.07L12 16.244A3 3 0 117.757 12l5.657-5.657 1.414 1.414z",fill:"currentColor"}))}function K(e){var r=e.children,a=e.render,o=e.visible,i={damping:15,stiffness:300},l=m.useSpring(0,i),c=m.useSpring(.5,i),u=D().setReadOnly,d=t.useState(o),f=d[0],h=d[1],v=D().ref,g=function(e){var r=n.useRef(null),a=t.useCallback((function(t){var n;(null==(n=r.current)?void 0:n.contains(t.target))||e()}),[e]);return t.useEffect((function(){return document.addEventListener("mousedown",a),function(){document.removeEventListener("mousedown",a)}}),[a]),r}((function(){h(!1)}));return n.createElement(s,{visible:f,animation:!0,appendTo:(null==v?void 0:v.current)||document.body,onMount:function(){u(!0),c.set(1),l.set(1)},onHide:function(e){var t=e.unmount,n=c.onChange((function(e){e<=.5&&(n(),t())}));c.set(.5),l.set(0),u(!1)},interactive:!0,interactiveBorder:20,delay:100,render:function(){return n.createElement(m.motion.div,Object.assign({ref:g,style:{opacity:l,scale:c,minWidth:300},className:"shadow-xl border bg-white p-4 rounded w-full text-gray-800"},arguments.length<=0?void 0:arguments[0]),a&&a.apply(void 0,arguments))}},n.createElement("div",{style:{display:"inline"},onClick:function(e){e.preventDefault(),h(!f)}},n.createElement("div",{style:{display:"inline",pointerEvents:"none"}},r)))}function q(e){return e&&"image"===e.type.split("/")[0]}function P(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{fill:"currentColor",d:"M18.364 15.536L16.95 14.12l1.414-1.414a5 5 0 10-7.071-7.071L9.879 7.05 8.464 5.636 9.88 4.222a7 7 0 019.9 9.9l-1.415 1.414zm-2.828 2.828l-1.415 1.414a7 7 0 01-9.9-9.9l1.415-1.414L7.05 9.88l-1.414 1.414a5 5 0 107.071 7.071l1.414-1.414 1.415 1.414zm-.708-10.607l1.415 1.415-7.071 7.07-1.415-1.414 7.071-7.07z"}))}var G=[{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{fill:"currentColor",d:"M8 4h13v2H8V4zM4.5 6.5a1.5 1.5 0 110-3 1.5 1.5 0 010 3zm0 7a1.5 1.5 0 110-3 1.5 1.5 0 010 3zm0 6.9a1.5 1.5 0 110-3 1.5 1.5 0 010 3zM8 11h13v2H8v-2zm0 7h13v2H8v-2z"}))},type:"unordered-list-item"},{icon:function(e){return t.createElement("svg",Object.assign({viewBox:"0 0 24 24",width:"1em",height:"1em"},e),t.createElement("path",{fill:"none",d:"M0 0h24v24H0z"}),t.createElement("path",{fill:"currentColor",d:"M8 4h13v2H8V4zM5 3v3h1v1H3V6h1V4H3V3h2zM3 14v-2.5h2V11H3v-1h3v2.5H4v.5h2v1H3zm2 5.5H3v-1h2V18H3v-1h3v4H3v-1h2v-.5zM8 11h13v2H8v-2zm0 7h13v2H8v-2z"}))},type:"ordered-list-item"}],W={__proto__:null,blocktype:function(e){var r=e.editorState,o=e.onChange,i=t.useState(r?l.getSelectedBlocksType(r):"unstyled"),u=i[0],s=i[1];p((function(){s(l.getSelectedBlocksType(r))}));var m=I.find((function(e){return e.type===u}));return n.createElement(c.Listbox,{as:"div",className:"space-y-1 mr-1",value:m,onChange:function(e){var t=a.RichUtils.toggleBlockType(r,e);t&&o(t)}},(function(e){var t,r=e.open;return n.createElement(n.Fragment,null,n.createElement("div",{className:"relative"},n.createElement("span",{className:"inline-block w-full rounded-md shadow-sm"},n.createElement(c.Listbox.Button,{className:"cursor-default relative w-full rounded-md border border-gray-300 bg-white pl-3 pr-10 h-8 text-left focus:outline-none focus:shadow-outline-blue focus:border-blue-300 transition ease-in-out duration-150 sm:text-sm sm:leading-5"},n.createElement("span",{className:"block truncate"},null!=(t=null==m?void 0:m.label)?t:"Unknown"),n.createElement("span",{className:"absolute inset-y-0 right-0 flex items-center pr-2 pointer-events-none"},n.createElement("svg",{className:"h-5 w-5 text-gray-400",viewBox:"0 0 20 20",fill:"none",stroke:"currentColor"},n.createElement("path",{d:"M7 7l3-3 3 3m0 6l-3 3-3-3",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}))))),n.createElement(c.Transition,{show:r,leave:"transition ease-in duration-100",leaveFrom:"opacity-100",leaveTo:"opacity-0",className:"absolute mt-1 w-full rounded-md bg-white shadow-lg z-50"},n.createElement(c.Listbox.Options,{static:!0,className:"max-h-60 w-32 rounded-md py-1 text-base leading-6 shadow-xs overflow-auto focus:outline-none sm:text-sm sm:leading-5"},I.map((function(e){return n.createElement(c.Listbox.Option,{key:e.type,value:e.type},(function(t){var r=t.selected,a=t.active;return n.createElement("div",{className:(a?"text-white bg-blue-600":"text-gray-900")+" cursor-default select-none relative py-2 pl-8 pr-4"},n.createElement("span",{className:(r?"font-semibold":"font-normal")+" block truncate"},e.label),r&&n.createElement("span",{className:(a?"text-white":"text-blue-600")+" absolute inset-y-0 left-0 flex items-center pl-1.5"},n.createElement("svg",{className:"h-5 w-5",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor"},n.createElement("path",{fillRule:"evenodd",d:"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z",clipRule:"evenodd"}))))}))}))))))}))},formatting:function(e){var r=e.editorState,o=e.onChange,i=t.useState(r?l.getSelectionInlineStyle(r):{}),c=i[0],u=i[1];return p((function(){u(l.getSelectionInlineStyle(r))})),n.createElement("div",{className:"inline-flex items-center text-gray-800"},V.map((function(e){return n.createElement(g,{"data-testid":"button-"+e.format.toLowerCase(),key:e.format,className:"mr-1 "+(c[e.format]?"text-indigo-500":""),onClick:(t=e.format,function(){var e=a.RichUtils.toggleInlineStyle(r,t);e&&o(e)})},n.createElement(e.icon,null));var t})))},alignment:E,upload:function(e){var r=e.editorState,o=e.onChange,i=t.useState(!1),l=i[0],c=i[1],s=D().config,m=t.useState()[1],f=t.useCallback((function(e,t){var n=r.getSelection(),i={url:e,targetOption:"_blank"},l=r.getCurrentContent().createEntity("LINK","MUTABLE",i).getLastCreatedEntityKey(),c=a.Modifier.replaceText(r.getCurrentContent(),n,""+t.name,r.getCurrentInlineStyle(),l),u=a.EditorState.push(r,c,"insert-characters");o(u)}),[r,o]),h=t.useCallback((function(e){var t={src:e,width:"100%",height:"auto"},n=r.getCurrentContent().createEntity("IMAGE","MUTABLE",t).getLastCreatedEntityKey(),i=a.AtomicBlockUtils.insertAtomicBlock(r,n," ");o(i)}),[r,o]),v=t.useCallback(function(){var e,t=(e=F.mark((function e(t){var n,r,a;return F.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(!s.onFileUpload||!t.length){e.next=14;break}return e.prev=1,n=t[0],e.next=5,s.onFileUpload(n);case 5:r=e.sent,c(!1),q(n)?h(r):f(r,n),c(!1),e.next=14;break;case 11:e.prev=11,e.t0=e.catch(1),m(null!=(a=e.t0.message)?a:"An error occurred.");case 14:case"end":return e.stop()}}),e,null,[[1,11]])})),function(){var t=this,n=arguments;return new Promise((function(r,a){var o=e.apply(t,n);function i(e){d(o,r,a,i,l,"next",e)}function l(e){d(o,r,a,i,l,"throw",e)}i(void 0)}))});return function(e){return t.apply(this,arguments)}}(),[f,h,s]),p=u.useDropzone({onDrop:v,multiple:!1}),y=p.getRootProps,E=p.getInputProps;return n.createElement(K,{visible:l,render:function(){return n.createElement("div",null,n.createElement("div",Object.assign({},y(),{className:"flex items-center justify-center p-8 border-dashed bg-gray-200"}),n.createElement("input",Object.assign({},E())),n.createElement("div",{className:"flex flex-col"},"Drag or click here",n.createElement("button",{className:"mx-3 py-1 rounded text-white bg-indigo-500 mt-2"},"Upload"))))}},n.createElement(g,{onClick:function(){return c(!l)}},n.createElement(U,null)))},link:function(e){var r=e.editorState,o=e.onChange,i=t.useState(r?l.getSelectionEntity(r):void 0),c=i[0],u=i[1],s=t.useCallback((function(){var e=r.getSelection();if(c){var t=l.getEntityRange(r,c),n=e.getIsBackward();e=e.merge(n?{anchorOffset:t.end,focusOffset:t.start}:{anchorOffset:t.start,focusOffset:t.end})}return e}),[c,r]),m=t.useCallback((function(){o(a.RichUtils.toggleLink(r,s(),null))}),[r,s,o]),d=t.useCallback((function(e,t,n){var i=r.getCurrentContent().createEntity("LINK","MUTABLE",{url:t,targetOption:n,startOpen:!0}),l=i.getLastCreatedEntityKey(),c=a.EditorState.set(r,{currentContent:i});o(a.RichUtils.toggleLink(c,s(),l))}),[r,s,o]);return p((function(){u(l.getSelectionEntity(r))})),n.createElement(g,{onMouseDown:function(e){var t;e.preventDefault();var n=r.getCurrentContent();c&&"LINK"===n.getEntity(c).getType()?m():d(null!=(t=l.getSelectionText(r))?t:"Click Here","#","_blank")}},n.createElement(P,null))},lists:function(e){var t=e.editorState,r=e.onChange;return n.createElement(n.Fragment,null,G.map((function(e){return n.createElement(g,{"data-testid":"button-"+e.type,key:e.type,className:"text-gray-800 hover:bg-indigo-500 hover:text-white text-left",onClick:(o=e.type,function(e){e.preventDefault();var n=a.RichUtils.toggleBlockType(t,o);n&&r(n)})},n.createElement(e.icon,null));var o})))}},Y=["formatting","blocktype","lists","alignment","link","upload"];function J(e){var t=e.controls,r=void 0===t?Y:t,a=D(),o=a.editorState,i=a.onChange;return n.createElement("div",{className:"flex items-center border-b px-2 bg-white mb-2 pb-2",onMouseDown:function(e){e.preventDefault()}},r.map((function(e){return n.createElement(W[e],{key:e,editorState:o,onChange:i})})))}exports.Editor=function(e){var t=e.editorClassName,r=e.value,a=e.onChange,o=e.toolbarHidden;return n.createElement(j,{value:void 0===r?"":r,onValueChange:void 0===a?function(){}:a,config:e},n.createElement(N,null,n.createElement("div",{className:"rounded border relative p-2"},!(void 0!==o&&o)&&n.createElement(J,null),n.createElement(_,{className:t}))))};
 //# sourceMappingURL=react-html-wysiwyg.cjs.production.min.js.map

dist/ReactHtmlWysisyg.d.ts

@@ -1,3 +0,2 @@
-import React from 'react';
-import JsonObject from './types/JsonObject';
+/// <reference types="react" />
 export interface ReactHtmlEditorProps {
@@ -10,5 +9,3 @@ value?: string;
     height?: number;
-    theme?: JsonObject;
-    editorWrapper?: React.ElementType;
 }
 export default function ReactHtmlEditor(props: ReactHtmlEditorProps): JSX.Element;

package.json

 {
   "name": "@ajoelp/react-html-wysiwyg",
-  "version": "0.3.1",
+  "version": "0.4.2",
   "description": "Rich text editor for react build with DraftJS",
@@ -34,7 +34,7 @@ "license": "MIT",
     "lint": "tsdx lint",
-    "storybook": "start-storybook -p 6006",
-    "build-storybook": "build-storybook"
+    "storybook": "start-storybook -p 6006 --no-dll",
+    "build-storybook": "build-storybook --no-dll"
   },
   "peerDependencies": {
-    "react": ">=16"
+    "react": ">=17"
   },
@@ -50,48 +50,44 @@ "prettier": {
   "devDependencies": {
-    "@babel/core": "^7.10.5",
-    "@storybook/addon-actions": "^5.3.19",
-    "@storybook/addon-docs": "^5.3.19",
-    "@storybook/addon-info": "^5.3.19",
-    "@storybook/addon-links": "^5.3.19",
-    "@storybook/addons": "^5.3.19",
-    "@storybook/react": "^5.3.19",
-    "@testing-library/react": "^10.4.7",
-    "@types/draft-js": "^0.10.43",
-    "@types/lodash": "^4.14.158",
-    "@types/react": "^16.9.43",
-    "@types/react-custom-scrollbars": "^4.0.6",
-    "@types/react-dom": "^16.9.8",
-    "@types/styled-components": "^5.1.2",
-    "@types/styled-system": "^5.1.10",
-    "autoprefixer": "^9.8.5",
-    "babel-loader": "^8.1.0",
+    "@babel/core": "^7.12.3",
+    "@storybook/addon-actions": "^6.0.28",
+    "@storybook/addon-docs": "^6.0.28",
+    "@storybook/addon-info": "^5.3.21",
+    "@storybook/addon-links": "^6.0.28",
+    "@storybook/addons": "^6.0.28",
+    "@storybook/react": "^6.0.28",
+    "@testing-library/react": "^11.1.2",
+    "@types/draft-js": "^0.10.44",
+    "@types/react": "^16.9.56",
+    "@types/react-custom-scrollbars": "^4.0.7",
+    "@types/react-dom": "^16.9.9",
+    "autoprefixer": "^9.8.6",
+    "babel-loader": "^8.2.1",
     "cssnano": "^4.1.10",
     "flush-promises": "^1.0.2",
-    "husky": "^4.2.5",
+    "husky": "^4.3.0",
     "identity-obj-proxy": "^3.0.0",
-    "react": "^16.13.1",
+    "react": "^17.0.1",
     "react-docgen-typescript-loader": "^3.7.2",
-    "react-dom": "^16.13.1",
-    "react-is": "^16.13.1",
-    "rollup-plugin-postcss": "^3.1.3",
-    "ts-loader": "^8.0.1",
-    "tsdx": "^0.13.2",
-    "tslib": "^2.0.0",
-    "typescript": "^3.9.7"
+    "react-dom": "^17.0.1",
+    "react-is": "^17.0.1",
+    "rollup-plugin-postcss": "^3.1.8",
+    "ts-loader": "^8.0.11",
+    "tsdx": "^0.14.1",
+    "tslib": "^2.0.3",
+    "typescript": "^4.0.5"
   },
   "dependencies": {
-    "@reach/dialog": "^0.10.5",
-    "draft-js": "^0.11.6",
+    "@headlessui/react": "^0.2.0",
+    "@reach/dialog": "^0.11.2",
+    "@tippyjs/react": "^4.2.0",
+    "draft-js": "^0.11.7",
     "draftjs-to-html": "^0.9.1",
     "draftjs-utils": "^0.10.2",
-    "framer-motion": "^2.2.0",
+    "framer-motion": "^2.9.4",
     "html-to-draftjs": "^1.5.0",
-    "immutable": "^3.8.2",
-    "lodash": "^4.17.19",
-    "polished": "^3.6.5",
+    "immutable": "^4.0.0-rc.12",
     "react-custom-scrollbars": "^4.2.1",
-    "react-dropzone": "^11.0.2",
-    "styled-components": "^5.1.1",
-    "styled-system": "^5.1.5"
+    "react-dropzone": "^11.2.4",
+    "tippy.js": "^6.2.7"
   }
 }

src/Decorators/Link.ts

@@ -9,3 +9,3 @@ import { ContentBlock, ContentState } from 'draft-js';
 ): void => {
-  contentBlock.findEntityRanges(character => {
+  contentBlock.findEntityRanges((character) => {
     const entityKey = character.getEntity();
@@ -12,0 +12,0 @@ return entityKey !== null && contentState.getEntity(entityKey).getType() === 'LINK';

src/utils/useChangedEditorState.ts

@@ -12,4 +12,3 @@ import { useEditorState } from '../EditorStateContext';
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [editorState]);
+  }, [callback, editorState, previousEditorState]);
 }

New alerts

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

636220

increased by16.77%

Dependency count

13

decreased by-7.14%

Dev dependency count

27

decreased by-10%

Lines of code

5935

increased by22.12%

Worsened metrics

Number of package files

116

decreased by-7.94%

Number of medium supply chain risk alerts

3

increased byInfinity%

Dependency changes

• + Added@headlessui/react@^0.2.0

• + Added@tippyjs/react@^4.2.0

• + Addedtippy.js@^6.2.7

• + Added@headlessui/react@0.2.0(transitive)

• + Added@popperjs/core@2.11.8(transitive)

• + Added@reach/dialog@0.11.2(transitive)

• + Added@reach/portal@0.11.2(transitive)

• + Added@reach/utils@0.11.2(transitive)

• + Added@tippyjs/react@4.2.6(transitive)

• + Addedimmutable@4.3.6(transitive)

• + Addedtippy.js@6.3.7(transitive)

• - Removedlodash@^4.17.19

• - Removedpolished@^3.6.5

• - Removedstyled-components@^5.1.1

• - Removedstyled-system@^5.1.5

• - Removed@ampproject/remapping@2.3.0(transitive)

• - Removed@babel/code-frame@7.24.7(transitive)

• - Removed@babel/compat-data@7.24.7(transitive)

• - Removed@babel/core@7.24.7(transitive)

• - Removed@babel/generator@7.24.7(transitive)

• - Removed@babel/helper-annotate-as-pure@7.24.7(transitive)

• - Removed@babel/helper-compilation-targets@7.24.7(transitive)

• - Removed@babel/helper-environment-visitor@7.24.7(transitive)

• - Removed@babel/helper-function-name@7.24.7(transitive)

• - Removed@babel/helper-hoist-variables@7.24.7(transitive)

• - Removed@babel/helper-module-imports@7.24.7(transitive)

• - Removed@babel/helper-module-transforms@7.24.7(transitive)

• - Removed@babel/helper-plugin-utils@7.24.7(transitive)

• - Removed@babel/helper-simple-access@7.24.7(transitive)

• - Removed@babel/helper-split-export-declaration@7.24.7(transitive)

• - Removed@babel/helper-string-parser@7.24.7(transitive)

• - Removed@babel/helper-validator-identifier@7.24.7(transitive)

• - Removed@babel/helper-validator-option@7.24.7(transitive)

• - Removed@babel/helpers@7.24.7(transitive)

• - Removed@babel/highlight@7.24.7(transitive)

• - Removed@babel/parser@7.24.7(transitive)

• - Removed@babel/plugin-syntax-jsx@7.24.7(transitive)

• - Removed@babel/template@7.24.7(transitive)

• - Removed@babel/traverse@7.24.7(transitive)

• - Removed@babel/types@7.24.7(transitive)

• - Removed@emotion/is-prop-valid@1.2.2(transitive)

• - Removed@emotion/memoize@0.8.1(transitive)

• - Removed@emotion/stylis@0.8.5(transitive)

• - Removed@emotion/unitless@0.7.5(transitive)

• - Removed@jridgewell/gen-mapping@0.3.5(transitive)

• - Removed@jridgewell/resolve-uri@3.1.2(transitive)

• - Removed@jridgewell/set-array@1.2.1(transitive)

• - Removed@jridgewell/sourcemap-codec@1.4.15(transitive)

• - Removed@jridgewell/trace-mapping@0.3.25(transitive)

• - Removed@reach/dialog@0.10.5(transitive)

• - Removed@reach/portal@0.10.5(transitive)

• - Removed@reach/utils@0.10.5(transitive)

• - Removed@styled-system/background@5.1.2(transitive)

• - Removed@styled-system/border@5.1.5(transitive)

• - Removed@styled-system/color@5.1.2(transitive)

• - Removed@styled-system/core@5.1.2(transitive)

• - Removed@styled-system/css@5.1.5(transitive)

• - Removed@styled-system/flexbox@5.1.2(transitive)

• - Removed@styled-system/grid@5.1.2(transitive)

• - Removed@styled-system/layout@5.1.2(transitive)

• - Removed@styled-system/position@5.1.2(transitive)

• - Removed@styled-system/shadow@5.1.2(transitive)

• - Removed@styled-system/space@5.1.2(transitive)

• - Removed@styled-system/typography@5.1.2(transitive)

• - Removed@styled-system/variant@5.1.5(transitive)

• - Removedansi-styles@3.2.1(transitive)

• - Removedbabel-plugin-styled-components@2.1.4(transitive)

• - Removedbrowserslist@4.23.0(transitive)

• - Removedcamelize@1.0.1(transitive)

• - Removedcaniuse-lite@1.0.30001629(transitive)

• - Removedchalk@2.4.2(transitive)

• - Removedcolor-convert@1.9.3(transitive)

• - Removedcolor-name@1.1.3(transitive)

• - Removedconvert-source-map@2.0.0(transitive)

• - Removedcss-color-keywords@1.0.0(transitive)

• - Removedcss-to-react-native@3.2.0(transitive)

• - Removeddebug@4.3.5(transitive)

• - Removedelectron-to-chromium@1.4.790(transitive)

• - Removedescalade@3.1.2(transitive)

• - Removedescape-string-regexp@1.0.5(transitive)

• - Removedgensync@1.0.0-beta.2(transitive)

• - Removedglobals@11.12.0(transitive)

• - Removedhas-flag@3.0.0(transitive)

• - Removedhoist-non-react-statics@3.3.2(transitive)

• - Removedimmutable@3.8.2(transitive)

• - Removedjsesc@2.5.2(transitive)

• - Removedjson5@2.2.3(transitive)

• - Removedlodash@4.17.21(transitive)

• - Removedlru-cache@5.1.1(transitive)

• - Removedms@2.1.2(transitive)

• - Removednode-releases@2.0.14(transitive)

• - Removedpicocolors@1.0.1(transitive)

• - Removedpicomatch@2.3.1(transitive)

• - Removedpolished@3.7.2(transitive)

• - Removedpostcss-value-parser@4.2.0(transitive)

• - Removedsemver@6.3.1(transitive)

• - Removedshallowequal@1.1.0(transitive)

• - Removedstyled-components@5.3.11(transitive)

• - Removedstyled-system@5.1.5(transitive)

• - Removedsupports-color@5.5.0(transitive)

• - Removedto-fast-properties@2.0.0(transitive)

• - Removedupdate-browserslist-db@1.0.16(transitive)

• - Removedyallist@3.1.1(transitive)

• Updated@reach/dialog@^0.11.2

• Updateddraft-js@^0.11.7

• Updatedframer-motion@^2.9.4

• Updatedimmutable@^4.0.0-rc.12

• Updatedreact-dropzone@^11.2.4