@jotforminc/dnd-builder 3.0.0-alpha.2 → 3.0.0

package/lib/esm/components/Settings/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sources":["../../../../src/components/Settings/Switch.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nconst Switch = ({\n  config,\n  item,\n  onItemChange,\n  value,\n}) => {\n  const onChange = e => {\n    const status = e.target.checked ? 'on' : 'off';\n    onItemChange(\n      { id: item.id },\n      { [config.key]: status },\n    );\n  };\n  return (\n    <label\n      className={classNames(\n        'toolToggle',\n        { toggled: value === 'on' },\n      )}\n      htmlFor={config.key}\n    >\n      <input\n        checked={value === 'on'}\n        className=\"toolToggle-input\"\n        id={config.key}\n        onChange={onChange}\n        type=\"checkbox\"\n      />\n      <span className=\"toolToggle-custom\" />\n    </label>\n  );\n};\n\nSwitch.propTypes = {\n  config: PropTypes.shape({\n    key: PropTypes.string,\n    options: PropTypes.arrayOf(PropTypes.any),\n  }),\n  item: PropTypes.shape({\n    id: PropTypes.string,\n  }),\n  onItemChange: PropTypes.func,\n  value: PropTypes.string,\n};\n\nSwitch.defaultProps = {\n  config: {},\n  item: {},\n  onItemChange: () => {},\n  value: '',\n};\n\nexport default memo(Switch);\n"],"names":["Switch","config","item","onItemChange","value","onChange","e","status","target","checked","id","key","_jsxs","classNames","toggled","_jsx","propTypes","PropTypes","shape","string","options","arrayOf","any","func","defaultProps","memo"],"mappings":";;;;;;;AAIA,IAAMA,MAAM,GAAG,SAATA,MAAS,OAKT;AAAA,MAJJC,MAII,QAJJA,MAII;AAAA,MAHJC,IAGI,QAHJA,IAGI;AAAA,MAFJC,YAEI,QAFJA,YAEI;AAAA,MADJC,KACI,QADJA,KACI;;AACJ,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAAAC,CAAC,EAAI;AACpB,QAAMC,MAAM,GAAGD,CAAC,CAACE,MAAF,CAASC,OAAT,GAAmB,IAAnB,GAA0B,KAAzC;AACAN,IAAAA,YAAY,CACV;AAAEO,MAAAA,EAAE,EAAER,IAAI,CAACQ;AAAX,KADU,sBAEPT,MAAM,CAACU,GAFA,EAEMJ,MAFN,EAAZ;AAID,GAND;;AAOA,sBACEK;AACE,IAAA,SAAS,EAAEC,UAAU,CACnB,YADmB,EAEnB;AAAEC,MAAAA,OAAO,EAAEV,KAAK,KAAK;AAArB,KAFmB,CADvB;AAKE,IAAA,OAAO,EAAEH,MAAM,CAACU,GALlB;AAAA,4BAOEI;AACE,MAAA,OAAO,EAAEX,KAAK,KAAK,IADrB;AAEE,MAAA,SAAS,EAAC,kBAFZ;AAGE,MAAA,EAAE,EAAEH,MAAM,CAACU,GAHb;AAIE,MAAA,QAAQ,EAAEN,QAJZ;AAKE,MAAA,IAAI,EAAC;AALP,MAPF,eAcEU;AAAM,MAAA,SAAS,EAAC;AAAhB,MAdF;AAAA,IADF;AAkBD,CA/BD;;AAiCAf,MAAM,CAACgB,SAAP,GAAmB;AACjBf,EAAAA,MAAM,EAAEgB,SAAS,CAACC,KAAV,CAAgB;AACtBP,IAAAA,GAAG,EAAEM,SAAS,CAACE,MADO;AAEtBC,IAAAA,OAAO,EAAEH,SAAS,CAACI,OAAV,CAAkBJ,SAAS,CAACK,GAA5B;AAFa,GAAhB,CADS;AAKjBpB,EAAAA,IAAI,EAAEe,SAAS,CAACC,KAAV,CAAgB;AACpBR,IAAAA,EAAE,EAAEO,SAAS,CAACE;AADM,GAAhB,CALW;AAQjBhB,EAAAA,YAAY,EAAEc,SAAS,CAACM,IARP;AASjBnB,EAAAA,KAAK,EAAEa,SAAS,CAACE;AATA,CAAnB;AAYAnB,MAAM,CAACwB,YAAP,GAAsB;AACpBvB,EAAAA,MAAM,EAAE,EADY;AAEpBC,EAAAA,IAAI,EAAE,EAFc;AAGpBC,EAAAA,YAAY,EAAE,wBAAM,EAHA;AAIpBC,EAAAA,KAAK,EAAE;AAJa,CAAtB;AAOA,4BAAeqB,IAAI,CAACzB,MAAD,CAAnB;;;;"}
+{"version":3,"file":"Switch.js","sources":["../../../../src/components/Settings/Switch.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nconst Switch = ({\n  config = {},\n  item = {},\n  onItemChange = () => {},\n  value = '',\n}) => {\n  const onChange = e => {\n    const status = e.target.checked ? 'on' : 'off';\n    onItemChange(\n      { id: item.id },\n      { [config.key]: status },\n    );\n  };\n  return (\n    <label\n      className={classNames(\n        'toolToggle',\n        { toggled: value === 'on' },\n      )}\n      htmlFor={config.key}\n    >\n      <input\n        checked={value === 'on'}\n        className=\"toolToggle-input\"\n        id={config.key}\n        onChange={onChange}\n        type=\"checkbox\"\n      />\n      <span className=\"toolToggle-custom\" />\n    </label>\n  );\n};\n\nSwitch.propTypes = {\n  config: PropTypes.shape({\n    key: PropTypes.string,\n    options: PropTypes.arrayOf(PropTypes.any),\n  }),\n  item: PropTypes.shape({\n    id: PropTypes.string,\n  }),\n  onItemChange: PropTypes.func,\n  value: PropTypes.string,\n};\n\nexport default memo(Switch);\n"],"names":["Switch","config","item","onItemChange","value","onChange","e","status","target","checked","id","key","_jsxs","classNames","toggled","_jsx","propTypes","PropTypes","shape","string","options","arrayOf","any","func","memo"],"mappings":";;;;;;;AAIA,IAAMA,MAAM,GAAG,SAATA,MAAS,OAKT;AAAA,yBAJJC,MAII;AAAA,MAJJA,MAII,4BAJK,EAIL;AAAA,uBAHJC,IAGI;AAAA,MAHJA,IAGI,0BAHG,EAGH;AAAA,+BAFJC,YAEI;AAAA,MAFJA,YAEI,kCAFW,YAAM,EAEjB;AAAA,wBADJC,KACI;AAAA,MADJA,KACI,2BADI,EACJ;;AACJ,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAAAC,CAAC,EAAI;AACpB,QAAMC,MAAM,GAAGD,CAAC,CAACE,MAAF,CAASC,OAAT,GAAmB,IAAnB,GAA0B,KAAzC;AACAN,IAAAA,YAAY,CACV;AAAEO,MAAAA,EAAE,EAAER,IAAI,CAACQ;AAAX,KADU,sBAEPT,MAAM,CAACU,GAFA,EAEMJ,MAFN,EAAZ;AAID,GAND;;AAOA,sBACEK;AACE,IAAA,SAAS,EAAEC,UAAU,CACnB,YADmB,EAEnB;AAAEC,MAAAA,OAAO,EAAEV,KAAK,KAAK;AAArB,KAFmB,CADvB;AAKE,IAAA,OAAO,EAAEH,MAAM,CAACU,GALlB;AAAA,4BAOEI;AACE,MAAA,OAAO,EAAEX,KAAK,KAAK,IADrB;AAEE,MAAA,SAAS,EAAC,kBAFZ;AAGE,MAAA,EAAE,EAAEH,MAAM,CAACU,GAHb;AAIE,MAAA,QAAQ,EAAEN,QAJZ;AAKE,MAAA,IAAI,EAAC;AALP,MAPF,eAcEU;AAAM,MAAA,SAAS,EAAC;AAAhB,MAdF;AAAA,IADF;AAkBD,CA/BD;;AAiCAf,MAAM,CAACgB,SAAP,GAAmB;AACjBf,EAAAA,MAAM,EAAEgB,SAAS,CAACC,KAAV,CAAgB;AACtBP,IAAAA,GAAG,EAAEM,SAAS,CAACE,MADO;AAEtBC,IAAAA,OAAO,EAAEH,SAAS,CAACI,OAAV,CAAkBJ,SAAS,CAACK,GAA5B;AAFa,GAAhB,CADS;AAKjBpB,EAAAA,IAAI,EAAEe,SAAS,CAACC,KAAV,CAAgB;AACpBR,IAAAA,EAAE,EAAEO,SAAS,CAACE;AADM,GAAhB,CALW;AAQjBhB,EAAAA,YAAY,EAAEc,SAAS,CAACM,IARP;AASjBnB,EAAAA,KAAK,EAAEa,SAAS,CAACE;AATA,CAAnB;AAYA,4BAAeK,IAAI,CAACxB,MAAD,CAAnB;;;;"}

package/lib/esm/components/Settings/Textbox.js

@@ -9,12 +9,18 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var Textbox = function Textbox(_ref) {
-  var config = _ref.config,
-      item = _ref.item,
-      maxLength = _ref.maxLength,
-      onItemChange = _ref.onItemChange,
-      placeholder = _ref.placeholder,
-      value = _ref.value;
+  var _ref$config = _ref.config,
+      config = _ref$config === void 0 ? {} : _ref$config,
+      _ref$item = _ref.item,
+      item = _ref$item === void 0 ? {} : _ref$item,
+      _ref$maxLength = _ref.maxLength,
+      maxLength = _ref$maxLength === void 0 ? false : _ref$maxLength,
+      _ref$onItemChange = _ref.onItemChange,
+      onItemChange = _ref$onItemChange === void 0 ? function () {} : _ref$onItemChange,
+      _ref$placeholder = _ref.placeholder,
+      placeholder = _ref$placeholder === void 0 ? '' : _ref$placeholder,
+      _ref$value = _ref.value,
+      value = _ref$value === void 0 ? '' : _ref$value;
 
   var onChange = function onChange(e) {
     var newValue = e.target.value;
@@ -59,14 +65,6 @@ Textbox.propTypes = {
   placeholder: PropTypes.string,
   value: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
 };
-Textbox.defaultProps = {
-  config: [],
-  item: {},
-  maxLength: false,
-  onItemChange: function onItemChange() {},
-  placeholder: '',
-  value: ''
-};
 var Textbox$1 = /*#__PURE__*/memo(Textbox);
 
 export default Textbox$1;

package/lib/esm/components/Settings/Textbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textbox.js","sources":["../../../../src/components/Settings/Textbox.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\n\nconst Textbox = ({\n  config,\n  item,\n  maxLength,\n  onItemChange,\n  placeholder,\n  value,\n}) => {\n  const onChange = e => {\n    const { value: newValue } = e.target;\n    if (newValue !== value) {\n      const changeSettingsFor = { [config.key]: newValue };\n      onItemChange({ id: item.id }, changeSettingsFor);\n    }\n  };\n\n  const handleKeyDown = e => e.stopPropagation();\n\n  const customProps = {};\n  if (maxLength) customProps.maxLength = maxLength;\n\n  return (\n    <input\n      {...customProps}\n      className=\"toolSection-input\"\n      onChange={onChange}\n      onKeyDown={handleKeyDown}\n      placeholder={config.placeholder || placeholder}\n      type={config.inputType || 'text'}\n      value={value}\n    />\n  );\n};\n\nTextbox.propTypes = {\n  config: PropTypes.shape({\n    inputType: PropTypes.string,\n    key: PropTypes.string,\n    options: PropTypes.arrayOf(PropTypes.any),\n    placeholder: PropTypes.string,\n  }),\n  item: PropTypes.shape({\n    id: PropTypes.string,\n  }),\n  maxLength: PropTypes.oneOfType([\n    PropTypes.bool,\n    PropTypes.number,\n  ]),\n  onItemChange: PropTypes.func,\n  placeholder: PropTypes.string,\n  value: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.number,\n  ]),\n};\n\nTextbox.defaultProps = {\n  config: [],\n  item: {},\n  maxLength: false,\n  onItemChange: () => {},\n  placeholder: '',\n  value: '',\n};\n\nexport default memo(Textbox);\n"],"names":["Textbox","config","item","maxLength","onItemChange","placeholder","value","onChange","e","newValue","target","changeSettingsFor","key","id","handleKeyDown","stopPropagation","customProps","_jsx","inputType","propTypes","PropTypes","shape","string","options","arrayOf","any","oneOfType","bool","number","func","defaultProps","memo"],"mappings":";;;;;;;;;;AAGA,IAAMA,OAAO,GAAG,SAAVA,OAAU,OAOV;AAAA,MANJC,MAMI,QANJA,MAMI;AAAA,MALJC,IAKI,QALJA,IAKI;AAAA,MAJJC,SAII,QAJJA,SAII;AAAA,MAHJC,YAGI,QAHJA,YAGI;AAAA,MAFJC,WAEI,QAFJA,WAEI;AAAA,MADJC,KACI,QADJA,KACI;;AACJ,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAAAC,CAAC,EAAI;AACpB,QAAeC,QAAf,GAA4BD,CAAC,CAACE,MAA9B,CAAQJ,KAAR;;AACA,QAAIG,QAAQ,KAAKH,KAAjB,EAAwB;AACtB,UAAMK,iBAAiB,uBAAMV,MAAM,CAACW,GAAb,EAAmBH,QAAnB,CAAvB;;AACAL,MAAAA,YAAY,CAAC;AAAES,QAAAA,EAAE,EAAEX,IAAI,CAACW;AAAX,OAAD,EAAkBF,iBAAlB,CAAZ;AACD;AACF,GAND;;AAQA,MAAMG,aAAa,GAAG,SAAhBA,aAAgB,CAAAN,CAAC;AAAA,WAAIA,CAAC,CAACO,eAAF,EAAJ;AAAA,GAAvB;;AAEA,MAAMC,WAAW,GAAG,EAApB;AACA,MAAIb,SAAJ,EAAea,WAAW,CAACb,SAAZ,GAAwBA,SAAxB;AAEf,sBACEc,6CACMD,WADN;AAEE,IAAA,SAAS,EAAC,mBAFZ;AAGE,IAAA,QAAQ,EAAET,QAHZ;AAIE,IAAA,SAAS,EAAEO,aAJb;AAKE,IAAA,WAAW,EAAEb,MAAM,CAACI,WAAP,IAAsBA,WALrC;AAME,IAAA,IAAI,EAAEJ,MAAM,CAACiB,SAAP,IAAoB,MAN5B;AAOE,IAAA,KAAK,EAAEZ;AAPT,KADF;AAWD,CAhCD;;AAkCAN,OAAO,CAACmB,SAAR,GAAoB;AAClBlB,EAAAA,MAAM,EAAEmB,SAAS,CAACC,KAAV,CAAgB;AACtBH,IAAAA,SAAS,EAAEE,SAAS,CAACE,MADC;AAEtBV,IAAAA,GAAG,EAAEQ,SAAS,CAACE,MAFO;AAGtBC,IAAAA,OAAO,EAAEH,SAAS,CAACI,OAAV,CAAkBJ,SAAS,CAACK,GAA5B,CAHa;AAItBpB,IAAAA,WAAW,EAAEe,SAAS,CAACE;AAJD,GAAhB,CADU;AAOlBpB,EAAAA,IAAI,EAAEkB,SAAS,CAACC,KAAV,CAAgB;AACpBR,IAAAA,EAAE,EAAEO,SAAS,CAACE;AADM,GAAhB,CAPY;AAUlBnB,EAAAA,SAAS,EAAEiB,SAAS,CAACM,SAAV,CAAoB,CAC7BN,SAAS,CAACO,IADmB,EAE7BP,SAAS,CAACQ,MAFmB,CAApB,CAVO;AAclBxB,EAAAA,YAAY,EAAEgB,SAAS,CAACS,IAdN;AAelBxB,EAAAA,WAAW,EAAEe,SAAS,CAACE,MAfL;AAgBlBhB,EAAAA,KAAK,EAAEc,SAAS,CAACM,SAAV,CAAoB,CACzBN,SAAS,CAACE,MADe,EAEzBF,SAAS,CAACQ,MAFe,CAApB;AAhBW,CAApB;AAsBA5B,OAAO,CAAC8B,YAAR,GAAuB;AACrB7B,EAAAA,MAAM,EAAE,EADa;AAErBC,EAAAA,IAAI,EAAE,EAFe;AAGrBC,EAAAA,SAAS,EAAE,KAHU;AAIrBC,EAAAA,YAAY,EAAE,wBAAM,EAJC;AAKrBC,EAAAA,WAAW,EAAE,EALQ;AAMrBC,EAAAA,KAAK,EAAE;AANc,CAAvB;AASA,6BAAeyB,IAAI,CAAC/B,OAAD,CAAnB;;;;"}
+{"version":3,"file":"Textbox.js","sources":["../../../../src/components/Settings/Textbox.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\n\nconst Textbox = ({\n  config = {},\n  item = {},\n  maxLength = false,\n  onItemChange = () => {},\n  placeholder = '',\n  value = '',\n}) => {\n  const onChange = e => {\n    const { value: newValue } = e.target;\n    if (newValue !== value) {\n      const changeSettingsFor = { [config.key]: newValue };\n      onItemChange({ id: item.id }, changeSettingsFor);\n    }\n  };\n\n  const handleKeyDown = e => e.stopPropagation();\n\n  const customProps = {};\n  if (maxLength) customProps.maxLength = maxLength;\n\n  return (\n    <input\n      {...customProps}\n      className=\"toolSection-input\"\n      onChange={onChange}\n      onKeyDown={handleKeyDown}\n      placeholder={config.placeholder || placeholder}\n      type={config.inputType || 'text'}\n      value={value}\n    />\n  );\n};\n\nTextbox.propTypes = {\n  config: PropTypes.shape({\n    inputType: PropTypes.string,\n    key: PropTypes.string,\n    options: PropTypes.arrayOf(PropTypes.any),\n    placeholder: PropTypes.string,\n  }),\n  item: PropTypes.shape({\n    id: PropTypes.string,\n  }),\n  maxLength: PropTypes.oneOfType([\n    PropTypes.bool,\n    PropTypes.number,\n  ]),\n  onItemChange: PropTypes.func,\n  placeholder: PropTypes.string,\n  value: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.number,\n  ]),\n};\n\nexport default memo(Textbox);\n"],"names":["Textbox","config","item","maxLength","onItemChange","placeholder","value","onChange","e","newValue","target","changeSettingsFor","key","id","handleKeyDown","stopPropagation","customProps","_jsx","inputType","propTypes","PropTypes","shape","string","options","arrayOf","any","oneOfType","bool","number","func","memo"],"mappings":";;;;;;;;;;AAGA,IAAMA,OAAO,GAAG,SAAVA,OAAU,OAOV;AAAA,yBANJC,MAMI;AAAA,MANJA,MAMI,4BANK,EAML;AAAA,uBALJC,IAKI;AAAA,MALJA,IAKI,0BALG,EAKH;AAAA,4BAJJC,SAII;AAAA,MAJJA,SAII,+BAJQ,KAIR;AAAA,+BAHJC,YAGI;AAAA,MAHJA,YAGI,kCAHW,YAAM,EAGjB;AAAA,8BAFJC,WAEI;AAAA,MAFJA,WAEI,iCAFU,EAEV;AAAA,wBADJC,KACI;AAAA,MADJA,KACI,2BADI,EACJ;;AACJ,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAAAC,CAAC,EAAI;AACpB,QAAeC,QAAf,GAA4BD,CAAC,CAACE,MAA9B,CAAQJ,KAAR;;AACA,QAAIG,QAAQ,KAAKH,KAAjB,EAAwB;AACtB,UAAMK,iBAAiB,uBAAMV,MAAM,CAACW,GAAb,EAAmBH,QAAnB,CAAvB;;AACAL,MAAAA,YAAY,CAAC;AAAES,QAAAA,EAAE,EAAEX,IAAI,CAACW;AAAX,OAAD,EAAkBF,iBAAlB,CAAZ;AACD;AACF,GAND;;AAQA,MAAMG,aAAa,GAAG,SAAhBA,aAAgB,CAAAN,CAAC;AAAA,WAAIA,CAAC,CAACO,eAAF,EAAJ;AAAA,GAAvB;;AAEA,MAAMC,WAAW,GAAG,EAApB;AACA,MAAIb,SAAJ,EAAea,WAAW,CAACb,SAAZ,GAAwBA,SAAxB;AAEf,sBACEc,6CACMD,WADN;AAEE,IAAA,SAAS,EAAC,mBAFZ;AAGE,IAAA,QAAQ,EAAET,QAHZ;AAIE,IAAA,SAAS,EAAEO,aAJb;AAKE,IAAA,WAAW,EAAEb,MAAM,CAACI,WAAP,IAAsBA,WALrC;AAME,IAAA,IAAI,EAAEJ,MAAM,CAACiB,SAAP,IAAoB,MAN5B;AAOE,IAAA,KAAK,EAAEZ;AAPT,KADF;AAWD,CAhCD;;AAkCAN,OAAO,CAACmB,SAAR,GAAoB;AAClBlB,EAAAA,MAAM,EAAEmB,SAAS,CAACC,KAAV,CAAgB;AACtBH,IAAAA,SAAS,EAAEE,SAAS,CAACE,MADC;AAEtBV,IAAAA,GAAG,EAAEQ,SAAS,CAACE,MAFO;AAGtBC,IAAAA,OAAO,EAAEH,SAAS,CAACI,OAAV,CAAkBJ,SAAS,CAACK,GAA5B,CAHa;AAItBpB,IAAAA,WAAW,EAAEe,SAAS,CAACE;AAJD,GAAhB,CADU;AAOlBpB,EAAAA,IAAI,EAAEkB,SAAS,CAACC,KAAV,CAAgB;AACpBR,IAAAA,EAAE,EAAEO,SAAS,CAACE;AADM,GAAhB,CAPY;AAUlBnB,EAAAA,SAAS,EAAEiB,SAAS,CAACM,SAAV,CAAoB,CAC7BN,SAAS,CAACO,IADmB,EAE7BP,SAAS,CAACQ,MAFmB,CAApB,CAVO;AAclBxB,EAAAA,YAAY,EAAEgB,SAAS,CAACS,IAdN;AAelBxB,EAAAA,WAAW,EAAEe,SAAS,CAACE,MAfL;AAgBlBhB,EAAAA,KAAK,EAAEc,SAAS,CAACM,SAAV,CAAoB,CACzBN,SAAS,CAACE,MADe,EAEzBF,SAAS,CAACQ,MAFe,CAApB;AAhBW,CAApB;AAsBA,6BAAeE,IAAI,CAAC9B,OAAD,CAAnB;;;;"}

package/lib/esm/components/Settings/Toggle.js

@@ -6,10 +6,14 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var Toggle = function Toggle(_ref) {
-  var config = _ref.config,
-      item = _ref.item,
-      onItemChange = _ref.onItemChange,
-      value = _ref.value;
+  var _ref$config = _ref.config,
+      config = _ref$config === void 0 ? {} : _ref$config,
+      _ref$item = _ref.item,
+      item = _ref$item === void 0 ? {} : _ref$item,
+      _ref$onItemChange = _ref.onItemChange,
+      onItemChange = _ref$onItemChange === void 0 ? function () {} : _ref$onItemChange,
+      _ref$value = _ref.value,
+      value = _ref$value === void 0 ? '' : _ref$value;
 
   var onChange = function onChange(e) {
     var status = e.target.checked ? 'on' : 'off';
@@ -53,12 +57,6 @@ Toggle.propTypes = {
   onItemChange: PropTypes.func,
   value: PropTypes.string
 };
-Toggle.defaultProps = {
-  config: {},
-  item: {},
-  onItemChange: function onItemChange() {},
-  value: ''
-};
 var Toggle$1 = /*#__PURE__*/memo(Toggle);
 
 export default Toggle$1;

package/lib/esm/components/Settings/Toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.js","sources":["../../../../src/components/Settings/Toggle.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport { useTranslatedTexts } from '../../utils/hooks';\n\nconst Toggle = ({\n  config,\n  item,\n  onItemChange,\n  value,\n}) => {\n  const onChange = e => {\n    const status = e.target.checked ? 'on' : 'off';\n    onItemChange(\n      { id: item.id },\n      { [config.key]: status },\n    );\n  };\n\n  const { TOGGLE_OFF, TOGGLE_ON } = useTranslatedTexts();\n\n  return (\n    <label\n      className=\"reportToolToggle\"\n      htmlFor={config.key}\n    >\n      <input\n        checked={value === 'on'}\n        id={config.key}\n        onChange={onChange}\n        type=\"checkbox\"\n      />\n      <span className=\"reportToolToggle-knob\" />\n      <span className=\"reportToolToggle-on reportToolToggle-text\">{TOGGLE_ON}</span>\n      <span className=\"reportToolToggle-off reportToolToggle-text\">{TOGGLE_OFF}</span>\n    </label>\n  );\n};\n\nToggle.propTypes = {\n  config: PropTypes.shape({\n    key: PropTypes.string,\n    options: PropTypes.arrayOf(PropTypes.any),\n  }),\n  item: PropTypes.shape({\n    id: PropTypes.string,\n  }),\n  onItemChange: PropTypes.func,\n  value: PropTypes.string,\n};\n\nToggle.defaultProps = {\n  config: {},\n  item: {},\n  onItemChange: () => {},\n  value: '',\n};\n\nexport default memo(Toggle);\n"],"names":["Toggle","config","item","onItemChange","value","onChange","e","status","target","checked","id","key","useTranslatedTexts","TOGGLE_OFF","TOGGLE_ON","_jsxs","_jsx","propTypes","PropTypes","shape","string","options","arrayOf","any","func","defaultProps","memo"],"mappings":";;;;;;;AAIA,IAAMA,MAAM,GAAG,SAATA,MAAS,OAKT;AAAA,MAJJC,MAII,QAJJA,MAII;AAAA,MAHJC,IAGI,QAHJA,IAGI;AAAA,MAFJC,YAEI,QAFJA,YAEI;AAAA,MADJC,KACI,QADJA,KACI;;AACJ,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAAAC,CAAC,EAAI;AACpB,QAAMC,MAAM,GAAGD,CAAC,CAACE,MAAF,CAASC,OAAT,GAAmB,IAAnB,GAA0B,KAAzC;AACAN,IAAAA,YAAY,CACV;AAAEO,MAAAA,EAAE,EAAER,IAAI,CAACQ;AAAX,KADU,sBAEPT,MAAM,CAACU,GAFA,EAEMJ,MAFN,EAAZ;AAID,GAND;;AAQA,4BAAkCK,kBAAkB,EAApD;AAAA,MAAQC,UAAR,uBAAQA,UAAR;AAAA,MAAoBC,SAApB,uBAAoBA,SAApB;;AAEA,sBACEC;AACE,IAAA,SAAS,EAAC,kBADZ;AAEE,IAAA,OAAO,EAAEd,MAAM,CAACU,GAFlB;AAAA,4BAIEK;AACE,MAAA,OAAO,EAAEZ,KAAK,KAAK,IADrB;AAEE,MAAA,EAAE,EAAEH,MAAM,CAACU,GAFb;AAGE,MAAA,QAAQ,EAAEN,QAHZ;AAIE,MAAA,IAAI,EAAC;AAJP,MAJF,eAUEW;AAAM,MAAA,SAAS,EAAC;AAAhB,MAVF,eAWEA;AAAM,MAAA,SAAS,EAAC,2CAAhB;AAAA,gBAA6DF;AAA7D,MAXF,eAYEE;AAAM,MAAA,SAAS,EAAC,4CAAhB;AAAA,gBAA8DH;AAA9D,MAZF;AAAA,IADF;AAgBD,CAhCD;;AAkCAb,MAAM,CAACiB,SAAP,GAAmB;AACjBhB,EAAAA,MAAM,EAAEiB,SAAS,CAACC,KAAV,CAAgB;AACtBR,IAAAA,GAAG,EAAEO,SAAS,CAACE,MADO;AAEtBC,IAAAA,OAAO,EAAEH,SAAS,CAACI,OAAV,CAAkBJ,SAAS,CAACK,GAA5B;AAFa,GAAhB,CADS;AAKjBrB,EAAAA,IAAI,EAAEgB,SAAS,CAACC,KAAV,CAAgB;AACpBT,IAAAA,EAAE,EAAEQ,SAAS,CAACE;AADM,GAAhB,CALW;AAQjBjB,EAAAA,YAAY,EAAEe,SAAS,CAACM,IARP;AASjBpB,EAAAA,KAAK,EAAEc,SAAS,CAACE;AATA,CAAnB;AAYApB,MAAM,CAACyB,YAAP,GAAsB;AACpBxB,EAAAA,MAAM,EAAE,EADY;AAEpBC,EAAAA,IAAI,EAAE,EAFc;AAGpBC,EAAAA,YAAY,EAAE,wBAAM,EAHA;AAIpBC,EAAAA,KAAK,EAAE;AAJa,CAAtB;AAOA,4BAAesB,IAAI,CAAC1B,MAAD,CAAnB;;;;"}
+{"version":3,"file":"Toggle.js","sources":["../../../../src/components/Settings/Toggle.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport { useTranslatedTexts } from '../../utils/hooks';\n\nconst Toggle = ({\n  config = {},\n  item = {},\n  onItemChange = () => {},\n  value = '',\n}) => {\n  const onChange = e => {\n    const status = e.target.checked ? 'on' : 'off';\n    onItemChange(\n      { id: item.id },\n      { [config.key]: status },\n    );\n  };\n\n  const { TOGGLE_OFF, TOGGLE_ON } = useTranslatedTexts();\n\n  return (\n    <label\n      className=\"reportToolToggle\"\n      htmlFor={config.key}\n    >\n      <input\n        checked={value === 'on'}\n        id={config.key}\n        onChange={onChange}\n        type=\"checkbox\"\n      />\n      <span className=\"reportToolToggle-knob\" />\n      <span className=\"reportToolToggle-on reportToolToggle-text\">{TOGGLE_ON}</span>\n      <span className=\"reportToolToggle-off reportToolToggle-text\">{TOGGLE_OFF}</span>\n    </label>\n  );\n};\n\nToggle.propTypes = {\n  config: PropTypes.shape({\n    key: PropTypes.string,\n    options: PropTypes.arrayOf(PropTypes.any),\n  }),\n  item: PropTypes.shape({\n    id: PropTypes.string,\n  }),\n  onItemChange: PropTypes.func,\n  value: PropTypes.string,\n};\n\nexport default memo(Toggle);\n"],"names":["Toggle","config","item","onItemChange","value","onChange","e","status","target","checked","id","key","useTranslatedTexts","TOGGLE_OFF","TOGGLE_ON","_jsxs","_jsx","propTypes","PropTypes","shape","string","options","arrayOf","any","func","memo"],"mappings":";;;;;;;AAIA,IAAMA,MAAM,GAAG,SAATA,MAAS,OAKT;AAAA,yBAJJC,MAII;AAAA,MAJJA,MAII,4BAJK,EAIL;AAAA,uBAHJC,IAGI;AAAA,MAHJA,IAGI,0BAHG,EAGH;AAAA,+BAFJC,YAEI;AAAA,MAFJA,YAEI,kCAFW,YAAM,EAEjB;AAAA,wBADJC,KACI;AAAA,MADJA,KACI,2BADI,EACJ;;AACJ,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAAAC,CAAC,EAAI;AACpB,QAAMC,MAAM,GAAGD,CAAC,CAACE,MAAF,CAASC,OAAT,GAAmB,IAAnB,GAA0B,KAAzC;AACAN,IAAAA,YAAY,CACV;AAAEO,MAAAA,EAAE,EAAER,IAAI,CAACQ;AAAX,KADU,sBAEPT,MAAM,CAACU,GAFA,EAEMJ,MAFN,EAAZ;AAID,GAND;;AAQA,4BAAkCK,kBAAkB,EAApD;AAAA,MAAQC,UAAR,uBAAQA,UAAR;AAAA,MAAoBC,SAApB,uBAAoBA,SAApB;;AAEA,sBACEC;AACE,IAAA,SAAS,EAAC,kBADZ;AAEE,IAAA,OAAO,EAAEd,MAAM,CAACU,GAFlB;AAAA,4BAIEK;AACE,MAAA,OAAO,EAAEZ,KAAK,KAAK,IADrB;AAEE,MAAA,EAAE,EAAEH,MAAM,CAACU,GAFb;AAGE,MAAA,QAAQ,EAAEN,QAHZ;AAIE,MAAA,IAAI,EAAC;AAJP,MAJF,eAUEW;AAAM,MAAA,SAAS,EAAC;AAAhB,MAVF,eAWEA;AAAM,MAAA,SAAS,EAAC,2CAAhB;AAAA,gBAA6DF;AAA7D,MAXF,eAYEE;AAAM,MAAA,SAAS,EAAC,4CAAhB;AAAA,gBAA8DH;AAA9D,MAZF;AAAA,IADF;AAgBD,CAhCD;;AAkCAb,MAAM,CAACiB,SAAP,GAAmB;AACjBhB,EAAAA,MAAM,EAAEiB,SAAS,CAACC,KAAV,CAAgB;AACtBR,IAAAA,GAAG,EAAEO,SAAS,CAACE,MADO;AAEtBC,IAAAA,OAAO,EAAEH,SAAS,CAACI,OAAV,CAAkBJ,SAAS,CAACK,GAA5B;AAFa,GAAhB,CADS;AAKjBrB,EAAAA,IAAI,EAAEgB,SAAS,CAACC,KAAV,CAAgB;AACpBT,IAAAA,EAAE,EAAEQ,SAAS,CAACE;AADM,GAAhB,CALW;AAQjBjB,EAAAA,YAAY,EAAEe,SAAS,CAACM,IARP;AASjBpB,EAAAA,KAAK,EAAEc,SAAS,CAACE;AATA,CAAnB;AAYA,4BAAeK,IAAI,CAACzB,MAAD,CAAnB;;;;"}

package/lib/esm/components/StaticElements/StaticRichText.js

@@ -6,10 +6,34 @@ import { fontTypes } from '../../constants/fonts.js';
 import { jsx } from 'react/jsx-runtime';
 
 var ITEM_TYPE = 'text';
+var details = {
+  height: 65,
+  itemType: ITEM_TYPE,
+  width: 350
+};
+var defaultItem = {
+  fontFamily: 'Circular',
+  opacity: 1,
+  value: ''
+};
+var settings = [{
+  key: 'fontFamily',
+  label: 'Font Family',
+  options: fontTypes.fonts,
+  section: 'GENERAL',
+  type: 'dropdown'
+}, {
+  key: 'opacity',
+  label: 'Opacity',
+  range: [0, 100],
+  section: 'GENERAL',
+  type: 'slider'
+}];
 
 var StaticRichTextElement = function StaticRichTextElement(_ref) {
-  var _ref$item = _ref.item,
-      fontFamily = _ref$item.fontFamily,
+  var _ref$item = _ref.item;
+  _ref$item = _ref$item === void 0 ? defaultItem : _ref$item;
+  var fontFamily = _ref$item.fontFamily,
       opacity = _ref$item.opacity,
       value = _ref$item.value;
   return /*#__PURE__*/jsx("div", {
@@ -34,34 +58,6 @@ StaticRichTextElement.propTypes = {
     value: PropTypes.string
   })
 };
-StaticRichTextElement.defaultProps = {
-  item: {
-    value: ''
-  }
-};
-var details = {
-  height: 65,
-  itemType: ITEM_TYPE,
-  width: 350
-};
-var defaultItem = {
-  fontFamily: 'Circular',
-  opacity: 1,
-  value: ''
-};
-var settings = [{
-  key: 'fontFamily',
-  label: 'Font Family',
-  options: fontTypes.fonts,
-  section: 'GENERAL',
-  type: 'dropdown'
-}, {
-  key: 'opacity',
-  label: 'Opacity',
-  range: [0, 100],
-  section: 'GENERAL',
-  type: 'slider'
-}];
 var StaticRichText = {
   Component: /*#__PURE__*/memo(StaticRichTextElement),
   defaultItem: defaultItem,

package/lib/esm/components/StaticElements/StaticRichText.js.map

@@ -1 +1 @@
-{"version":3,"file":"StaticRichText.js","sources":["../../../../src/components/StaticElements/StaticRichText.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport domPurify from 'dompurify';\nimport 'react-quill/dist/quill.snow.css';\nimport { fontTypes } from '../../constants/fonts';\n\nconst ITEM_TYPE = 'text';\n\nconst StaticRichTextElement = ({\n  item: {\n    fontFamily,\n    opacity,\n    value,\n  },\n}) => (\n  <div\n    className=\"reportItemInner f-height\"\n    style={{ fontFamily, opacity }}\n  >\n    <div\n      className=\"f-all ql-editor\"\n      dangerouslySetInnerHTML={{ __html: domPurify.sanitize(value) }}\n    />\n  </div>\n);\n\nStaticRichTextElement.propTypes = {\n  item: PropTypes.shape({\n    fontFamily: PropTypes.string,\n    opacity: PropTypes.number,\n    value: PropTypes.string,\n  }),\n};\n\nStaticRichTextElement.defaultProps = {\n  item: {\n    value: '',\n  },\n};\n\nconst details = {\n  height: 65,\n  itemType: ITEM_TYPE,\n  width: 350,\n};\n\nconst defaultItem = {\n  fontFamily: 'Circular',\n  opacity: 1,\n  value: '',\n};\n\nconst settings = [\n  {\n    key: 'fontFamily',\n    label: 'Font Family',\n    options: fontTypes.fonts,\n    section: 'GENERAL',\n    type: 'dropdown',\n  },\n  {\n    key: 'opacity',\n    label: 'Opacity',\n    range: [0, 100],\n    section: 'GENERAL',\n    type: 'slider',\n  },\n];\n\nexport default {\n  Component: memo(StaticRichTextElement),\n  defaultItem,\n  details,\n  itemType: ITEM_TYPE,\n  settings,\n};\n"],"names":["ITEM_TYPE","StaticRichTextElement","item","fontFamily","opacity","value","_jsx","__html","domPurify","sanitize","propTypes","PropTypes","shape","string","number","defaultProps","details","height","itemType","width","defaultItem","settings","key","label","options","fontTypes","fonts","section","type","range","Component","memo"],"mappings":";;;;;;;AAMA,IAAMA,SAAS,GAAG,MAAlB;;AAEA,IAAMC,qBAAqB,GAAG,SAAxBA,qBAAwB;AAAA,uBAC5BC,IAD4B;AAAA,MAE1BC,UAF0B,aAE1BA,UAF0B;AAAA,MAG1BC,OAH0B,aAG1BA,OAH0B;AAAA,MAI1BC,KAJ0B,aAI1BA,KAJ0B;AAAA,sBAO5BC;AACE,IAAA,SAAS,EAAC,0BADZ;AAEE,IAAA,KAAK,EAAE;AAAEH,MAAAA,UAAU,EAAVA,UAAF;AAAcC,MAAAA,OAAO,EAAPA;AAAd,KAFT;AAAA,2BAIEE;AACE,MAAA,SAAS,EAAC,iBADZ;AAEE,MAAA,uBAAuB,EAAE;AAAEC,QAAAA,MAAM,EAAEC,SAAS,CAACC,QAAV,CAAmBJ,KAAnB;AAAV;AAF3B;AAJF,IAP4B;AAAA,CAA9B;;AAkBAJ,qBAAqB,CAACS,SAAtB,GAAkC;AAChCR,EAAAA,IAAI,EAAES,SAAS,CAACC,KAAV,CAAgB;AACpBT,IAAAA,UAAU,EAAEQ,SAAS,CAACE,MADF;AAEpBT,IAAAA,OAAO,EAAEO,SAAS,CAACG,MAFC;AAGpBT,IAAAA,KAAK,EAAEM,SAAS,CAACE;AAHG,GAAhB;AAD0B,CAAlC;AAQAZ,qBAAqB,CAACc,YAAtB,GAAqC;AACnCb,EAAAA,IAAI,EAAE;AACJG,IAAAA,KAAK,EAAE;AADH;AAD6B,CAArC;AAMA,IAAMW,OAAO,GAAG;AACdC,EAAAA,MAAM,EAAE,EADM;AAEdC,EAAAA,QAAQ,EAAElB,SAFI;AAGdmB,EAAAA,KAAK,EAAE;AAHO,CAAhB;AAMA,IAAMC,WAAW,GAAG;AAClBjB,EAAAA,UAAU,EAAE,UADM;AAElBC,EAAAA,OAAO,EAAE,CAFS;AAGlBC,EAAAA,KAAK,EAAE;AAHW,CAApB;AAMA,IAAMgB,QAAQ,GAAG,CACf;AACEC,EAAAA,GAAG,EAAE,YADP;AAEEC,EAAAA,KAAK,EAAE,aAFT;AAGEC,EAAAA,OAAO,EAAEC,SAAS,CAACC,KAHrB;AAIEC,EAAAA,OAAO,EAAE,SAJX;AAKEC,EAAAA,IAAI,EAAE;AALR,CADe,EAQf;AACEN,EAAAA,GAAG,EAAE,SADP;AAEEC,EAAAA,KAAK,EAAE,SAFT;AAGEM,EAAAA,KAAK,EAAE,CAAC,CAAD,EAAI,GAAJ,CAHT;AAIEF,EAAAA,OAAO,EAAE,SAJX;AAKEC,EAAAA,IAAI,EAAE;AALR,CARe,CAAjB;AAiBA,qBAAe;AACbE,EAAAA,SAAS,eAAEC,IAAI,CAAC9B,qBAAD,CADF;AAEbmB,EAAAA,WAAW,EAAXA,WAFa;AAGbJ,EAAAA,OAAO,EAAPA,OAHa;AAIbE,EAAAA,QAAQ,EAAElB,SAJG;AAKbqB,EAAAA,QAAQ,EAARA;AALa,CAAf;;;;"}
+{"version":3,"file":"StaticRichText.js","sources":["../../../../src/components/StaticElements/StaticRichText.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport domPurify from 'dompurify';\nimport 'react-quill/dist/quill.snow.css';\nimport { fontTypes } from '../../constants/fonts';\n\nconst ITEM_TYPE = 'text';\n\nconst details = {\n  height: 65,\n  itemType: ITEM_TYPE,\n  width: 350,\n};\n\nconst defaultItem = {\n  fontFamily: 'Circular',\n  opacity: 1,\n  value: '',\n};\n\nconst settings = [\n  {\n    key: 'fontFamily',\n    label: 'Font Family',\n    options: fontTypes.fonts,\n    section: 'GENERAL',\n    type: 'dropdown',\n  },\n  {\n    key: 'opacity',\n    label: 'Opacity',\n    range: [0, 100],\n    section: 'GENERAL',\n    type: 'slider',\n  },\n];\n\nconst StaticRichTextElement = ({\n  item: {\n    fontFamily,\n    opacity,\n    value,\n  } = defaultItem,\n}) => (\n  <div\n    className=\"reportItemInner f-height\"\n    style={{ fontFamily, opacity }}\n  >\n    <div\n      className=\"f-all ql-editor\"\n      dangerouslySetInnerHTML={{ __html: domPurify.sanitize(value) }}\n    />\n  </div>\n);\n\nStaticRichTextElement.propTypes = {\n  item: PropTypes.shape({\n    fontFamily: PropTypes.string,\n    opacity: PropTypes.number,\n    value: PropTypes.string,\n  }),\n};\n\nexport default {\n  Component: memo(StaticRichTextElement),\n  defaultItem,\n  details,\n  itemType: ITEM_TYPE,\n  settings,\n};\n"],"names":["ITEM_TYPE","details","height","itemType","width","defaultItem","fontFamily","opacity","value","settings","key","label","options","fontTypes","fonts","section","type","range","StaticRichTextElement","item","_jsx","__html","domPurify","sanitize","propTypes","PropTypes","shape","string","number","Component","memo"],"mappings":";;;;;;;AAMA,IAAMA,SAAS,GAAG,MAAlB;AAEA,IAAMC,OAAO,GAAG;AACdC,EAAAA,MAAM,EAAE,EADM;AAEdC,EAAAA,QAAQ,EAAEH,SAFI;AAGdI,EAAAA,KAAK,EAAE;AAHO,CAAhB;AAMA,IAAMC,WAAW,GAAG;AAClBC,EAAAA,UAAU,EAAE,UADM;AAElBC,EAAAA,OAAO,EAAE,CAFS;AAGlBC,EAAAA,KAAK,EAAE;AAHW,CAApB;AAMA,IAAMC,QAAQ,GAAG,CACf;AACEC,EAAAA,GAAG,EAAE,YADP;AAEEC,EAAAA,KAAK,EAAE,aAFT;AAGEC,EAAAA,OAAO,EAAEC,SAAS,CAACC,KAHrB;AAIEC,EAAAA,OAAO,EAAE,SAJX;AAKEC,EAAAA,IAAI,EAAE;AALR,CADe,EAQf;AACEN,EAAAA,GAAG,EAAE,SADP;AAEEC,EAAAA,KAAK,EAAE,SAFT;AAGEM,EAAAA,KAAK,EAAE,CAAC,CAAD,EAAI,GAAJ,CAHT;AAIEF,EAAAA,OAAO,EAAE,SAJX;AAKEC,EAAAA,IAAI,EAAE;AALR,CARe,CAAjB;;AAiBA,IAAME,qBAAqB,GAAG,SAAxBA,qBAAwB;AAAA,uBAC5BC,IAD4B;AAAA,qCAKxBd,WALwB;AAAA,MAE1BC,UAF0B,aAE1BA,UAF0B;AAAA,MAG1BC,OAH0B,aAG1BA,OAH0B;AAAA,MAI1BC,KAJ0B,aAI1BA,KAJ0B;AAAA,sBAO5BY;AACE,IAAA,SAAS,EAAC,0BADZ;AAEE,IAAA,KAAK,EAAE;AAAEd,MAAAA,UAAU,EAAVA,UAAF;AAAcC,MAAAA,OAAO,EAAPA;AAAd,KAFT;AAAA,2BAIEa;AACE,MAAA,SAAS,EAAC,iBADZ;AAEE,MAAA,uBAAuB,EAAE;AAAEC,QAAAA,MAAM,EAAEC,SAAS,CAACC,QAAV,CAAmBf,KAAnB;AAAV;AAF3B;AAJF,IAP4B;AAAA,CAA9B;;AAkBAU,qBAAqB,CAACM,SAAtB,GAAkC;AAChCL,EAAAA,IAAI,EAAEM,SAAS,CAACC,KAAV,CAAgB;AACpBpB,IAAAA,UAAU,EAAEmB,SAAS,CAACE,MADF;AAEpBpB,IAAAA,OAAO,EAAEkB,SAAS,CAACG,MAFC;AAGpBpB,IAAAA,KAAK,EAAEiB,SAAS,CAACE;AAHG,GAAhB;AAD0B,CAAlC;AAQA,qBAAe;AACbE,EAAAA,SAAS,eAAEC,IAAI,CAACZ,qBAAD,CADF;AAEbb,EAAAA,WAAW,EAAXA,WAFa;AAGbJ,EAAAA,OAAO,EAAPA,OAHa;AAIbE,EAAAA,QAAQ,EAAEH,SAJG;AAKbS,EAAAA,QAAQ,EAARA;AALa,CAAf;;;;"}

package/lib/esm/components/TextEditor/CustomToolbar/CustomToolbar.js

@@ -24,7 +24,8 @@ var BUTTON_WIDTH = 26;
 var BAR_WIDTH = SELECT_WIDTH + BUTTON_WIDTH * 8;
 
 var CustomToolbar = function CustomToolbar(_ref) {
-  var itemWidth = _ref.itemWidth;
+  var _ref$itemWidth = _ref.itemWidth,
+      itemWidth = _ref$itemWidth === void 0 ? 0 : _ref$itemWidth;
   var overflow = BAR_WIDTH > itemWidth;
 
   var _useState = useState(overflow ? false : true),
@@ -126,9 +127,6 @@ var CustomToolbar = function CustomToolbar(_ref) {
 CustomToolbar.propTypes = {
   itemWidth: PropTypes.number
 };
-CustomToolbar.defaultProps = {
-  itemWidth: 0
-};
 
 export default CustomToolbar;
 //# sourceMappingURL=CustomToolbar.js.map

package/lib/esm/components/TextEditor/CustomToolbar/CustomToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomToolbar.js","sources":["../../../../../src/components/TextEditor/CustomToolbar/CustomToolbar.js"],"sourcesContent":["import {\n  useState, useCallback, useLayoutEffect, useRef,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { fontSizes } from '../../../constants/fonts';\n\nconst SELECT_WIDTH = 70;\nconst BUTTON_WIDTH = 26;\nconst BAR_WIDTH = SELECT_WIDTH + (BUTTON_WIDTH * 8);\n\nconst CustomToolbar = ({ itemWidth }) => {\n  const overflow = BAR_WIDTH > itemWidth;\n  const [isOpened, setIsOpened] = useState(overflow ? false : true);\n  const onClickMore = useCallback(() => setIsOpened(true), []);\n  const wrapper = useRef();\n\n  function getVisibleClass(limit) {\n    return overflow && itemWidth < limit ? ' hiddenVisibility' : '';\n  }\n\n  useLayoutEffect(() => {\n    if (!isOpened || wrapper.current === null) return;\n    Array.from(wrapper.current.children).forEach(el => el.classList.remove('hiddenVisibility'));\n  }, [isOpened]);\n\n  return (\n    <div\n      ref={wrapper}\n      className={classNames('toolbarWrapper p-absolute d-flex', { isOpened })}\n      style={{\n        maxWidth: isOpened ? 'none' : '100%',\n        // minWidth: `${itemWidth}px`,\n      }}\n    >\n      <select\n        aria-label=\"Size\"\n        className=\"ql-size ql-select ql-textselect\"\n        defaultValue=\"16px\"\n        onChange={e => e.persist()}\n      >\n        {fontSizes.map(size => (\n          <option\n            key={size}\n            value={`${size}px`}\n          >\n            {size}\n            px\n          </option>\n        ))}\n      </select>\n      <div className=\"ql-divider\" />\n      <button\n        aria-label=\"Bold\"\n        className={`ql-bold ql-button${getVisibleClass(SELECT_WIDTH + BUTTON_WIDTH)}`}\n        type=\"button\"\n      />\n      <button\n        aria-label=\"Italic\"\n        className={`ql-italic ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 2))}`}\n        type=\"button\"\n      />\n      <button\n        aria-label=\"Underline\"\n        className={`ql-underline ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 3))}`}\n        type=\"button\"\n      />\n      <select\n        aria-label=\"Text Color\"\n        className={`ql-color ql-select${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 4))}`}\n        defaultValue=\"\"\n        onChange={e => e.persist()}\n      />\n      <div className=\"ql-divider\" />\n      <select\n        aria-label=\"Alignment\"\n        className={`ql-align ql-select${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 5))}`}\n        defaultValue=\"\"\n        onChange={e => e.persist()}\n      />\n      <button\n        aria-label=\"Ordered List\"\n        className={`ql-list ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 6))}`}\n        type=\"button\"\n        value=\"ordered\"\n      />\n      <button\n        aria-label=\"Bullet List\"\n        className={`ql-list ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 7))}`}\n        type=\"button\"\n        value=\"bullet\"\n      />\n      <button\n        aria-label=\"Link\"\n        className={`ql-link ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 8))}`}\n        type=\"button\"\n      />\n      {overflow && !isOpened && (\n        <button\n          aria-label=\"More Options\"\n          className=\"qlMore\"\n          onClick={onClickMore}\n          type=\"button\"\n        >\n          &gt;&gt;\n        </button>\n      )}\n    </div>\n  );\n};\n\nCustomToolbar.propTypes = {\n  itemWidth: PropTypes.number,\n};\n\nCustomToolbar.defaultProps = {\n  itemWidth: 0,\n};\n\nexport default CustomToolbar;\n"],"names":["SELECT_WIDTH","BUTTON_WIDTH","BAR_WIDTH","CustomToolbar","itemWidth","overflow","useState","isOpened","setIsOpened","onClickMore","useCallback","wrapper","useRef","getVisibleClass","limit","useLayoutEffect","current","Array","from","children","forEach","el","classList","remove","_jsxs","classNames","maxWidth","_jsx","e","persist","fontSizes","map","size","propTypes","PropTypes","number","defaultProps"],"mappings":"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"}
+{"version":3,"file":"CustomToolbar.js","sources":["../../../../../src/components/TextEditor/CustomToolbar/CustomToolbar.js"],"sourcesContent":["import {\n  useState, useCallback, useLayoutEffect, useRef,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { fontSizes } from '../../../constants/fonts';\n\nconst SELECT_WIDTH = 70;\nconst BUTTON_WIDTH = 26;\nconst BAR_WIDTH = SELECT_WIDTH + (BUTTON_WIDTH * 8);\n\nconst CustomToolbar = ({ itemWidth = 0 }) => {\n  const overflow = BAR_WIDTH > itemWidth;\n  const [isOpened, setIsOpened] = useState(overflow ? false : true);\n  const onClickMore = useCallback(() => setIsOpened(true), []);\n  const wrapper = useRef();\n\n  function getVisibleClass(limit) {\n    return overflow && itemWidth < limit ? ' hiddenVisibility' : '';\n  }\n\n  useLayoutEffect(() => {\n    if (!isOpened || wrapper.current === null) return;\n    Array.from(wrapper.current.children).forEach(el => el.classList.remove('hiddenVisibility'));\n  }, [isOpened]);\n\n  return (\n    <div\n      ref={wrapper}\n      className={classNames('toolbarWrapper p-absolute d-flex', { isOpened })}\n      style={{\n        maxWidth: isOpened ? 'none' : '100%',\n        // minWidth: `${itemWidth}px`,\n      }}\n    >\n      <select\n        aria-label=\"Size\"\n        className=\"ql-size ql-select ql-textselect\"\n        defaultValue=\"16px\"\n        onChange={e => e.persist()}\n      >\n        {fontSizes.map(size => (\n          <option\n            key={size}\n            value={`${size}px`}\n          >\n            {size}\n            px\n          </option>\n        ))}\n      </select>\n      <div className=\"ql-divider\" />\n      <button\n        aria-label=\"Bold\"\n        className={`ql-bold ql-button${getVisibleClass(SELECT_WIDTH + BUTTON_WIDTH)}`}\n        type=\"button\"\n      />\n      <button\n        aria-label=\"Italic\"\n        className={`ql-italic ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 2))}`}\n        type=\"button\"\n      />\n      <button\n        aria-label=\"Underline\"\n        className={`ql-underline ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 3))}`}\n        type=\"button\"\n      />\n      <select\n        aria-label=\"Text Color\"\n        className={`ql-color ql-select${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 4))}`}\n        defaultValue=\"\"\n        onChange={e => e.persist()}\n      />\n      <div className=\"ql-divider\" />\n      <select\n        aria-label=\"Alignment\"\n        className={`ql-align ql-select${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 5))}`}\n        defaultValue=\"\"\n        onChange={e => e.persist()}\n      />\n      <button\n        aria-label=\"Ordered List\"\n        className={`ql-list ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 6))}`}\n        type=\"button\"\n        value=\"ordered\"\n      />\n      <button\n        aria-label=\"Bullet List\"\n        className={`ql-list ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 7))}`}\n        type=\"button\"\n        value=\"bullet\"\n      />\n      <button\n        aria-label=\"Link\"\n        className={`ql-link ql-button${getVisibleClass(SELECT_WIDTH + (BUTTON_WIDTH * 8))}`}\n        type=\"button\"\n      />\n      {overflow && !isOpened && (\n        <button\n          aria-label=\"More Options\"\n          className=\"qlMore\"\n          onClick={onClickMore}\n          type=\"button\"\n        >\n          &gt;&gt;\n        </button>\n      )}\n    </div>\n  );\n};\n\nCustomToolbar.propTypes = {\n  itemWidth: PropTypes.number,\n};\n\nexport default CustomToolbar;\n"],"names":["SELECT_WIDTH","BUTTON_WIDTH","BAR_WIDTH","CustomToolbar","itemWidth","overflow","useState","isOpened","setIsOpened","onClickMore","useCallback","wrapper","useRef","getVisibleClass","limit","useLayoutEffect","current","Array","from","children","forEach","el","classList","remove","_jsxs","classNames","maxWidth","_jsx","e","persist","fontSizes","map","size","propTypes","PropTypes","number"],"mappings":"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"}

package/lib/esm/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js

@@ -4,8 +4,10 @@ import CustomToolbar from './CustomToolbar.js';
 import { jsx } from 'react/jsx-runtime';
 
 var CustomToolbarWrapper = function CustomToolbarWrapper(_ref) {
-  var isTextEditorOpen = _ref.isTextEditorOpen,
-      itemWidth = _ref.itemWidth;
+  var _ref$isTextEditorOpen = _ref.isTextEditorOpen,
+      isTextEditorOpen = _ref$isTextEditorOpen === void 0 ? false : _ref$isTextEditorOpen,
+      _ref$itemWidth = _ref.itemWidth,
+      itemWidth = _ref$itemWidth === void 0 ? 0 : _ref$itemWidth;
   return isTextEditorOpen && /*#__PURE__*/jsx("div", {
     id: "toolbar",
     style: {
@@ -23,10 +25,6 @@ CustomToolbarWrapper.propTypes = {
   isTextEditorOpen: PropTypes.bool,
   itemWidth: PropTypes.number
 };
-CustomToolbarWrapper.defaultProps = {
-  isTextEditorOpen: false,
-  itemWidth: 0
-};
 var CustomToolbarWrapper$1 = /*#__PURE__*/memo(CustomToolbarWrapper);
 
 export default CustomToolbarWrapper$1;

package/lib/esm/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomToolbarWrapper.js","sources":["../../../../../src/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport CustomToolbar from './CustomToolbar';\n\n// This wrapper is needed to prevent the re-render\n// of the toolbar id div since it breaks the editor\nconst CustomToolbarWrapper = ({\n  isTextEditorOpen,\n  itemWidth,\n}) => isTextEditorOpen && (\n  <div\n    id=\"toolbar\"\n    style={{\n      pointerEvents: 'auto',\n      position: 'absolute',\n      top: '100%',\n    }}\n  >\n    <CustomToolbar itemWidth={itemWidth} />\n  </div>\n);\n\nCustomToolbarWrapper.propTypes = {\n  isTextEditorOpen: PropTypes.bool,\n  itemWidth: PropTypes.number,\n};\n\nCustomToolbarWrapper.defaultProps = {\n  isTextEditorOpen: false,\n  itemWidth: 0,\n};\n\nexport default memo(CustomToolbarWrapper);\n"],"names":["CustomToolbarWrapper","isTextEditorOpen","itemWidth","_jsx","pointerEvents","position","top","propTypes","PropTypes","bool","number","defaultProps","memo"],"mappings":";;;;;AAMA,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAuB;AAAA,MAC3BC,gBAD2B,QAC3BA,gBAD2B;AAAA,MAE3BC,SAF2B,QAE3BA,SAF2B;AAAA,SAGvBD,gBAAgB,iBACpBE;AACE,IAAA,EAAE,EAAC,SADL;AAEE,IAAA,KAAK,EAAE;AACLC,MAAAA,aAAa,EAAE,MADV;AAELC,MAAAA,QAAQ,EAAE,UAFL;AAGLC,MAAAA,GAAG,EAAE;AAHA,KAFT;AAAA,2BAQEH,IAAC,aAAD;AAAe,MAAA,SAAS,EAAED;AAA1B;AARF,IAJ2B;AAAA,CAA7B;;AAgBAF,oBAAoB,CAACO,SAArB,GAAiC;AAC/BN,EAAAA,gBAAgB,EAAEO,SAAS,CAACC,IADG;AAE/BP,EAAAA,SAAS,EAAEM,SAAS,CAACE;AAFU,CAAjC;AAKAV,oBAAoB,CAACW,YAArB,GAAoC;AAClCV,EAAAA,gBAAgB,EAAE,KADgB;AAElCC,EAAAA,SAAS,EAAE;AAFuB,CAApC;AAKA,0CAAeU,IAAI,CAACZ,oBAAD,CAAnB;;;;"}
+{"version":3,"file":"CustomToolbarWrapper.js","sources":["../../../../../src/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport CustomToolbar from './CustomToolbar';\n\n// This wrapper is needed to prevent the re-render\n// of the toolbar id div since it breaks the editor\nconst CustomToolbarWrapper = ({\n  isTextEditorOpen = false,\n  itemWidth = 0,\n}) => isTextEditorOpen && (\n  <div\n    id=\"toolbar\"\n    style={{\n      pointerEvents: 'auto',\n      position: 'absolute',\n      top: '100%',\n    }}\n  >\n    <CustomToolbar itemWidth={itemWidth} />\n  </div>\n);\n\nCustomToolbarWrapper.propTypes = {\n  isTextEditorOpen: PropTypes.bool,\n  itemWidth: PropTypes.number,\n};\n\nexport default memo(CustomToolbarWrapper);\n"],"names":["CustomToolbarWrapper","isTextEditorOpen","itemWidth","_jsx","pointerEvents","position","top","propTypes","PropTypes","bool","number","memo"],"mappings":";;;;;AAMA,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAuB;AAAA,mCAC3BC,gBAD2B;AAAA,MAC3BA,gBAD2B,sCACR,KADQ;AAAA,4BAE3BC,SAF2B;AAAA,MAE3BA,SAF2B,+BAEf,CAFe;AAAA,SAGvBD,gBAAgB,iBACpBE;AACE,IAAA,EAAE,EAAC,SADL;AAEE,IAAA,KAAK,EAAE;AACLC,MAAAA,aAAa,EAAE,MADV;AAELC,MAAAA,QAAQ,EAAE,UAFL;AAGLC,MAAAA,GAAG,EAAE;AAHA,KAFT;AAAA,2BAQEH,IAAC,aAAD;AAAe,MAAA,SAAS,EAAED;AAA1B;AARF,IAJ2B;AAAA,CAA7B;;AAgBAF,oBAAoB,CAACO,SAArB,GAAiC;AAC/BN,EAAAA,gBAAgB,EAAEO,SAAS,CAACC,IADG;AAE/BP,EAAAA,SAAS,EAAEM,SAAS,CAACE;AAFU,CAAjC;AAKA,0CAAeC,IAAI,CAACX,oBAAD,CAAnB;;;;"}

package/lib/esm/components/TextEditor/QuillEditor.js

@@ -66,9 +66,11 @@ var QuillEditor = /*#__PURE__*/function (_React$PureComponent) {
       }
     });
 
-    _defineProperty(_assertThisInitialized(_this), "handleSetContent", function (value) {
-      var setContent = _this.props.setContent;
-      setContent(domPurify.sanitize(value));
+    _defineProperty(_assertThisInitialized(_this), "handleSetContent", function (value, delta, source) {
+      if (source === 'user') {
+        var setContent = _this.props.setContent;
+        setContent(domPurify.sanitize(value));
+      }
     });
 
     _this.quill = /*#__PURE__*/React.createRef();
@@ -119,17 +121,10 @@ QuillEditor.formats = formats;
 QuillEditor.propTypes = {
   content: PropTypes.string,
   handleSave: PropTypes.func,
-  placeholder: PropTypes.string,
+  placeholder: PropTypes.string.isRequired,
   setContent: PropTypes.func,
   setIsTextEditorOpen: PropTypes.func
 };
-QuillEditor.defaultProps = {
-  content: '',
-  handleSave: function handleSave() {},
-  placeholder: 'Click to edit text',
-  setContent: function setContent() {},
-  setIsTextEditorOpen: function setIsTextEditorOpen() {}
-};
 
 export default QuillEditor;
 //# sourceMappingURL=QuillEditor.js.map

package/lib/esm/components/TextEditor/QuillEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"QuillEditor.js","sources":["../../../../src/components/TextEditor/QuillEditor.js"],"sourcesContent":["import React from 'react';\nimport ReactQuill from 'react-quill';\nimport domPurify from 'dompurify';\nimport PropTypes from 'prop-types';\nimport { formats, modules } from './textEditorConstants';\nimport { fontSizes } from '../../constants/fonts';\nimport 'react-quill/dist/quill.snow.css';\n\nconst Size = ReactQuill.Quill.import('attributors/style/size');\nSize.whitelist = fontSizes.map(s => `${s}px`);\nReactQuill.Quill.register(Size, true);\n\nclass QuillEditor extends React.PureComponent {\n  constructor(props) {\n    super(props);\n\n    this.quill = React.createRef();\n  }\n\n  componentDidMount() {\n    if (this.quill.current !== null) {\n      const { content } = this.props;\n      const editor = this.quill.current.getEditor();\n      editor.setSelection(0, content.length);\n    }\n  }\n\n  componentWillUnmount() {\n    this.saveAndQuit();\n  }\n\n  saveAndQuit = () => {\n    const { content, handleSave, setIsTextEditorOpen } = this.props;\n    setIsTextEditorOpen(false);\n    handleSave(content);\n  }\n\n  handleKeyDown = e => {\n    e.stopPropagation();\n    if (e.keyCode === 27) {\n      this.saveAndQuit();\n    }\n  }\n\n  handleSetContent = value => {\n    const { setContent } = this.props;\n    setContent(domPurify.sanitize(value));\n  }\n\n  render() {\n    const { content, placeholder } = this.props;\n\n    return (\n      <div\n        className=\"f-all\"\n        onKeyDown={this.handleKeyDown}\n      >\n        <ReactQuill\n          ref={this.quill}\n          formats={QuillEditor.formats}\n          modules={QuillEditor.modules}\n          onChange={this.handleSetContent}\n          placeholder={placeholder}\n          preserveWhitespace\n          value={content}\n        />\n      </div>\n    );\n  }\n}\n\nQuillEditor.modules = modules;\nQuillEditor.formats = formats;\n\nQuillEditor.propTypes = {\n  content: PropTypes.string,\n  handleSave: PropTypes.func,\n  placeholder: PropTypes.string,\n  setContent: PropTypes.func,\n  setIsTextEditorOpen: PropTypes.func,\n};\n\nQuillEditor.defaultProps = {\n  content: '',\n  handleSave: () => {},\n  placeholder: 'Click to edit text',\n  setContent: () => {},\n  setIsTextEditorOpen: () => {},\n};\n\nexport default QuillEditor;\n"],"names":["Size","ReactQuill","Quill","import","whitelist","fontSizes","map","s","register","QuillEditor","props","content","handleSave","setIsTextEditorOpen","e","stopPropagation","keyCode","saveAndQuit","value","setContent","domPurify","sanitize","quill","React","createRef","current","editor","getEditor","setSelection","length","placeholder","_jsx","handleKeyDown","formats","modules","handleSetContent","PureComponent","propTypes","PropTypes","string","func","defaultProps"],"mappings":"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"}
+{"version":3,"file":"QuillEditor.js","sources":["../../../../src/components/TextEditor/QuillEditor.js"],"sourcesContent":["import React from 'react';\nimport ReactQuill from 'react-quill';\nimport domPurify from 'dompurify';\nimport PropTypes from 'prop-types';\nimport { formats, modules } from './textEditorConstants';\nimport { fontSizes } from '../../constants/fonts';\nimport 'react-quill/dist/quill.snow.css';\n\nconst Size = ReactQuill.Quill.import('attributors/style/size');\nSize.whitelist = fontSizes.map(s => `${s}px`);\nReactQuill.Quill.register(Size, true);\n\nclass QuillEditor extends React.PureComponent {\n  constructor(props) {\n    super(props);\n\n    this.quill = React.createRef();\n  }\n\n  componentDidMount() {\n    if (this.quill.current !== null) {\n      const { content } = this.props;\n      const editor = this.quill.current.getEditor();\n      editor.setSelection(0, content.length);\n    }\n  }\n\n  componentWillUnmount() {\n    this.saveAndQuit();\n  }\n\n  saveAndQuit = () => {\n    const { content, handleSave, setIsTextEditorOpen } = this.props;\n    setIsTextEditorOpen(false);\n    handleSave(content);\n  }\n\n  handleKeyDown = e => {\n    e.stopPropagation();\n    if (e.keyCode === 27) {\n      this.saveAndQuit();\n    }\n  }\n\n  handleSetContent = (value, delta, source) => {\n    if (source === 'user') {\n      const { setContent } = this.props;\n      setContent(domPurify.sanitize(value));\n    }\n  }\n\n  render() {\n    const { content, placeholder } = this.props;\n\n    return (\n      <div\n        className=\"f-all\"\n        onKeyDown={this.handleKeyDown}\n      >\n        <ReactQuill\n          ref={this.quill}\n          formats={QuillEditor.formats}\n          modules={QuillEditor.modules}\n          onChange={this.handleSetContent}\n          placeholder={placeholder}\n          preserveWhitespace\n          value={content}\n        />\n      </div>\n    );\n  }\n}\n\nQuillEditor.modules = modules;\nQuillEditor.formats = formats;\n\nQuillEditor.propTypes = {\n  content: PropTypes.string,\n  handleSave: PropTypes.func,\n  placeholder: PropTypes.string.isRequired,\n  setContent: PropTypes.func,\n  setIsTextEditorOpen: PropTypes.func,\n};\n\nexport default QuillEditor;\n"],"names":["Size","ReactQuill","Quill","import","whitelist","fontSizes","map","s","register","QuillEditor","props","content","handleSave","setIsTextEditorOpen","e","stopPropagation","keyCode","saveAndQuit","value","delta","source","setContent","domPurify","sanitize","quill","React","createRef","current","editor","getEditor","setSelection","length","placeholder","_jsx","handleKeyDown","formats","modules","handleSetContent","PureComponent","propTypes","PropTypes","string","func","isRequired"],"mappings":"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"}

package/lib/esm/components/TextEditor/TextEditor.js

@@ -2,7 +2,7 @@ import { useState, useCallback, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import domPurify from 'dompurify';
 import QuillEditor from './QuillEditor.js';
-import { useBuilderContext } from '../../utils/builderContext.js';
+import { useBuilderStore } from '../../contexts/BuilderContext.js';
 import { jsx } from 'react/jsx-runtime';
 
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -18,10 +18,14 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 var TextEditor = function TextEditor(_ref) {
-  var content = _ref.content,
-      handleSave = _ref.handleSave,
-      isLocked = _ref.isLocked,
-      isSelected = _ref.isSelected,
+  var _ref$content = _ref.content,
+      content = _ref$content === void 0 ? '' : _ref$content,
+      _ref$handleSave = _ref.handleSave,
+      handleSave = _ref$handleSave === void 0 ? function () {} : _ref$handleSave,
+      _ref$isLocked = _ref.isLocked,
+      isLocked = _ref$isLocked === void 0 ? false : _ref$isLocked,
+      _ref$isSelected = _ref.isSelected,
+      isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
       placeholder = _ref.placeholder;
 
   var _useState = useState(domPurify.sanitize(content)),
@@ -29,15 +33,17 @@ var TextEditor = function TextEditor(_ref) {
       _content = _useState2[0],
       setContent = _useState2[1];
 
-  var _useBuilderContext = useBuilderContext(),
-      isTextEditorOpen = _useBuilderContext.isTextEditorOpen,
-      setIsTextEditorOpen = _useBuilderContext.setIsTextEditorOpen;
-
+  var isTextEditorOpen = useBuilderStore(function (state) {
+    return state.isTextEditorOpen;
+  });
+  var setIsTextEditorOpen = useBuilderStore(function (state) {
+    return state.setIsTextEditorOpen;
+  });
   var onClick = useCallback(function () {
     if (isSelected && !isLocked) {
       setIsTextEditorOpen(true);
     }
-  }, [isSelected, isLocked]);
+  }, [isSelected, isLocked, setIsTextEditorOpen]);
   var isNotEmpty = useMemo(function () {
     var el = document.createElement('div');
     el.innerHTML = _content;
@@ -64,14 +70,7 @@ TextEditor.propTypes = {
   handleSave: PropTypes.func,
   isLocked: PropTypes.bool,
   isSelected: PropTypes.bool,
-  placeholder: PropTypes.string
-};
-TextEditor.defaultProps = {
-  content: '',
-  handleSave: function handleSave() {},
-  isLocked: false,
-  isSelected: false,
-  placeholder: 'Click to edit text'
+  placeholder: PropTypes.string.isRequired
 };
 
 export default TextEditor;

package/lib/esm/components/TextEditor/TextEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextEditor.js","sources":["../../../../src/components/TextEditor/TextEditor.js"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport domPurify from 'dompurify';\nimport QuillEditor from './QuillEditor';\nimport { useBuilderContext } from '../../utils/builderContext';\n\nconst TextEditor = ({\n  content,\n  handleSave,\n  isLocked,\n  isSelected,\n  placeholder,\n}) => {\n  const [_content, setContent] = useState(domPurify.sanitize(content));\n\n  const { isTextEditorOpen, setIsTextEditorOpen } = useBuilderContext();\n\n  const onClick = useCallback(() => {\n    if (isSelected && !isLocked) {\n      setIsTextEditorOpen(true);\n    }\n  }, [isSelected, isLocked]);\n\n  const isNotEmpty = useMemo(() => {\n    const el = document.createElement('div');\n    el.innerHTML = _content;\n    return !!el.innerText;\n  }, [_content]);\n\n  return isSelected && isTextEditorOpen ? (\n    <QuillEditor\n      content={_content}\n      handleSave={handleSave}\n      placeholder={placeholder}\n      setContent={setContent}\n      setIsTextEditorOpen={setIsTextEditorOpen}\n    />\n  ) : (\n    <div\n      className={`f-all ql-editor${isNotEmpty ? '' : ' isEmptyTextElement'}`}\n      dangerouslySetInnerHTML={{\n        __html: isNotEmpty ? _content : placeholder,\n      }}\n      onClick={onClick}\n      onKeyDown={() => {}}\n    />\n  );\n};\n\nTextEditor.propTypes = {\n  content: PropTypes.string,\n  handleSave: PropTypes.func,\n  isLocked: PropTypes.bool,\n  isSelected: PropTypes.bool,\n  placeholder: PropTypes.string,\n};\n\nTextEditor.defaultProps = {\n  content: '',\n  handleSave: () => {},\n  isLocked: false,\n  isSelected: false,\n  placeholder: 'Click to edit text',\n};\n\nexport default TextEditor;\n"],"names":["TextEditor","content","handleSave","isLocked","isSelected","placeholder","useState","domPurify","sanitize","_content","setContent","useBuilderContext","isTextEditorOpen","setIsTextEditorOpen","onClick","useCallback","isNotEmpty","useMemo","el","document","createElement","innerHTML","innerText","_jsx","__html","propTypes","PropTypes","string","func","bool","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;IAMMA,UAAU,GAAG,SAAbA,UAAa,OAMb;AAAA,MALJC,OAKI,QALJA,OAKI;AAAA,MAJJC,UAII,QAJJA,UAII;AAAA,MAHJC,QAGI,QAHJA,QAGI;AAAA,MAFJC,UAEI,QAFJA,UAEI;AAAA,MADJC,WACI,QADJA,WACI;;AACJ,kBAA+BC,QAAQ,CAACC,SAAS,CAACC,QAAV,CAAmBP,OAAnB,CAAD,CAAvC;AAAA;AAAA,MAAOQ,QAAP;AAAA,MAAiBC,UAAjB;;AAEA,2BAAkDC,iBAAiB,EAAnE;AAAA,MAAQC,gBAAR,sBAAQA,gBAAR;AAAA,MAA0BC,mBAA1B,sBAA0BA,mBAA1B;;AAEA,MAAMC,OAAO,GAAGC,WAAW,CAAC,YAAM;AAChC,QAAIX,UAAU,IAAI,CAACD,QAAnB,EAA6B;AAC3BU,MAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD;AACF,GAJ0B,EAIxB,CAACT,UAAD,EAAaD,QAAb,CAJwB,CAA3B;AAMA,MAAMa,UAAU,GAAGC,OAAO,CAAC,YAAM;AAC/B,QAAMC,EAAE,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAX;AACAF,IAAAA,EAAE,CAACG,SAAH,GAAeZ,QAAf;AACA,WAAO,CAAC,CAACS,EAAE,CAACI,SAAZ;AACD,GAJyB,EAIvB,CAACb,QAAD,CAJuB,CAA1B;AAMA,SAAOL,UAAU,IAAIQ,gBAAd,gBACLW,IAAC,WAAD;AACE,IAAA,OAAO,EAAEd,QADX;AAEE,IAAA,UAAU,EAAEP,UAFd;AAGE,IAAA,WAAW,EAAEG,WAHf;AAIE,IAAA,UAAU,EAAEK,UAJd;AAKE,IAAA,mBAAmB,EAAEG;AALvB,IADK,gBASLU;AACE,IAAA,SAAS,2BAAoBP,UAAU,GAAG,EAAH,GAAQ,qBAAtC,CADX;AAEE,IAAA,uBAAuB,EAAE;AACvBQ,MAAAA,MAAM,EAAER,UAAU,GAAGP,QAAH,GAAcJ;AADT,KAF3B;AAKE,IAAA,OAAO,EAAES,OALX;AAME,IAAA,SAAS,EAAE,qBAAM;AANnB,IATF;AAkBD;;AAEDd,UAAU,CAACyB,SAAX,GAAuB;AACrBxB,EAAAA,OAAO,EAAEyB,SAAS,CAACC,MADE;AAErBzB,EAAAA,UAAU,EAAEwB,SAAS,CAACE,IAFD;AAGrBzB,EAAAA,QAAQ,EAAEuB,SAAS,CAACG,IAHC;AAIrBzB,EAAAA,UAAU,EAAEsB,SAAS,CAACG,IAJD;AAKrBxB,EAAAA,WAAW,EAAEqB,SAAS,CAACC;AALF,CAAvB;AAQA3B,UAAU,CAAC8B,YAAX,GAA0B;AACxB7B,EAAAA,OAAO,EAAE,EADe;AAExBC,EAAAA,UAAU,EAAE,sBAAM,EAFM;AAGxBC,EAAAA,QAAQ,EAAE,KAHc;AAIxBC,EAAAA,UAAU,EAAE,KAJY;AAKxBC,EAAAA,WAAW,EAAE;AALW,CAA1B;;;;"}
+{"version":3,"file":"TextEditor.js","sources":["../../../../src/components/TextEditor/TextEditor.js"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport domPurify from 'dompurify';\nimport QuillEditor from './QuillEditor';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\n\nconst TextEditor = ({\n  content = '',\n  handleSave = () => {},\n  isLocked = false,\n  isSelected = false,\n  placeholder,\n}) => {\n  const [_content, setContent] = useState(domPurify.sanitize(content));\n\n  const isTextEditorOpen = useBuilderStore(state => state.isTextEditorOpen);\n  const setIsTextEditorOpen = useBuilderStore(state => state.setIsTextEditorOpen);\n\n  const onClick = useCallback(() => {\n    if (isSelected && !isLocked) {\n      setIsTextEditorOpen(true);\n    }\n  }, [isSelected, isLocked, setIsTextEditorOpen]);\n\n  const isNotEmpty = useMemo(() => {\n    const el = document.createElement('div');\n    el.innerHTML = _content;\n    return !!el.innerText;\n  }, [_content]);\n\n  return isSelected && isTextEditorOpen ? (\n    <QuillEditor\n      content={_content}\n      handleSave={handleSave}\n      placeholder={placeholder}\n      setContent={setContent}\n      setIsTextEditorOpen={setIsTextEditorOpen}\n    />\n  ) : (\n    <div\n      className={`f-all ql-editor${isNotEmpty ? '' : ' isEmptyTextElement'}`}\n      dangerouslySetInnerHTML={{\n        __html: isNotEmpty ? _content : placeholder,\n      }}\n      onClick={onClick}\n      onKeyDown={() => {}}\n    />\n  );\n};\n\nTextEditor.propTypes = {\n  content: PropTypes.string,\n  handleSave: PropTypes.func,\n  isLocked: PropTypes.bool,\n  isSelected: PropTypes.bool,\n  placeholder: PropTypes.string.isRequired,\n};\n\nexport default TextEditor;\n"],"names":["TextEditor","content","handleSave","isLocked","isSelected","placeholder","useState","domPurify","sanitize","_content","setContent","isTextEditorOpen","useBuilderStore","state","setIsTextEditorOpen","onClick","useCallback","isNotEmpty","useMemo","el","document","createElement","innerHTML","innerText","_jsx","__html","propTypes","PropTypes","string","func","bool","isRequired"],"mappings":";;;;;;;;;;;;;;;;;;;IAMMA,UAAU,GAAG,SAAbA,UAAa,OAMb;AAAA,0BALJC,OAKI;AAAA,MALJA,OAKI,6BALM,EAKN;AAAA,6BAJJC,UAII;AAAA,MAJJA,UAII,gCAJS,YAAM,EAIf;AAAA,2BAHJC,QAGI;AAAA,MAHJA,QAGI,8BAHO,KAGP;AAAA,6BAFJC,UAEI;AAAA,MAFJA,UAEI,gCAFS,KAET;AAAA,MADJC,WACI,QADJA,WACI;;AACJ,kBAA+BC,QAAQ,CAACC,SAAS,CAACC,QAAV,CAAmBP,OAAnB,CAAD,CAAvC;AAAA;AAAA,MAAOQ,QAAP;AAAA,MAAiBC,UAAjB;;AAEA,MAAMC,gBAAgB,GAAGC,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMG,mBAAmB,GAAGF,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,mBAAV;AAAA,GAAN,CAA3C;AAEA,MAAMC,OAAO,GAAGC,WAAW,CAAC,YAAM;AAChC,QAAIZ,UAAU,IAAI,CAACD,QAAnB,EAA6B;AAC3BW,MAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD;AACF,GAJ0B,EAIxB,CAACV,UAAD,EAAaD,QAAb,EAAuBW,mBAAvB,CAJwB,CAA3B;AAMA,MAAMG,UAAU,GAAGC,OAAO,CAAC,YAAM;AAC/B,QAAMC,EAAE,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAX;AACAF,IAAAA,EAAE,CAACG,SAAH,GAAeb,QAAf;AACA,WAAO,CAAC,CAACU,EAAE,CAACI,SAAZ;AACD,GAJyB,EAIvB,CAACd,QAAD,CAJuB,CAA1B;AAMA,SAAOL,UAAU,IAAIO,gBAAd,gBACLa,IAAC,WAAD;AACE,IAAA,OAAO,EAAEf,QADX;AAEE,IAAA,UAAU,EAAEP,UAFd;AAGE,IAAA,WAAW,EAAEG,WAHf;AAIE,IAAA,UAAU,EAAEK,UAJd;AAKE,IAAA,mBAAmB,EAAEI;AALvB,IADK,gBASLU;AACE,IAAA,SAAS,2BAAoBP,UAAU,GAAG,EAAH,GAAQ,qBAAtC,CADX;AAEE,IAAA,uBAAuB,EAAE;AACvBQ,MAAAA,MAAM,EAAER,UAAU,GAAGR,QAAH,GAAcJ;AADT,KAF3B;AAKE,IAAA,OAAO,EAAEU,OALX;AAME,IAAA,SAAS,EAAE,qBAAM;AANnB,IATF;AAkBD;;AAEDf,UAAU,CAAC0B,SAAX,GAAuB;AACrBzB,EAAAA,OAAO,EAAE0B,SAAS,CAACC,MADE;AAErB1B,EAAAA,UAAU,EAAEyB,SAAS,CAACE,IAFD;AAGrB1B,EAAAA,QAAQ,EAAEwB,SAAS,CAACG,IAHC;AAIrB1B,EAAAA,UAAU,EAAEuB,SAAS,CAACG,IAJD;AAKrBzB,EAAAA,WAAW,EAAEsB,SAAS,CAACC,MAAV,CAAiBG;AALT,CAAvB;;;;"}

package/lib/esm/components/withClickOutside.js

@@ -4,8 +4,9 @@ import 'core-js/modules/es.function.name.js';
 import 'core-js/modules/es.object.keys.js';
 import 'core-js/modules/es.string.includes.js';
 import 'core-js/modules/es.string.iterator.js';
-import { useRef, useEffect } from 'react';
+import { useRef, useCallback, useEffect } from 'react';
 import PropTypes from 'prop-types';
+import { EVENT_IGNORED_ROLES } from '../constants/eventIgnoredRoles.js';
 import { jsx } from 'react/jsx-runtime';
 
 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; }
@@ -20,18 +21,21 @@ function getDisplayName(WrappedComponent) {
 
 function withClickOutside(WrappedComponent) {
   function WithClickOutside(props) {
-    var exceptionalClasses = props.exceptionalClasses,
+    var _props$exceptionalCla = props.exceptionalClasses,
+        exceptionalClasses = _props$exceptionalCla === void 0 ? null : _props$exceptionalCla,
         onClickOutside = props.onClickOutside,
-        withClickOutsideWrapperClass = props.withClickOutsideWrapperClass;
+        _props$withClickOutsi = props.withClickOutsideWrapperClass,
+        withClickOutsideWrapperClass = _props$withClickOutsi === void 0 ? null : _props$withClickOutsi;
     var wrapper = useRef(null);
-
-    var handleClickOutside = function handleClickOutside(event) {
+    var handleClickOutside = useCallback(function (event) {
       var classList = event.target.classList;
 
       if (exceptionalClasses && (classList.contains(exceptionalClasses) || Array.from(classList).some(function (xClass) {
         return exceptionalClasses.includes(xClass);
       }) || exceptionalClasses.some(function (item) {
         return event.target.closest(".".concat(item));
+      }) || EVENT_IGNORED_ROLES.some(function (role) {
+        return event.target.closest("[role=".concat(role, "]"));
       }))) {
         return;
       }
@@ -39,14 +43,13 @@ function withClickOutside(WrappedComponent) {
       if (wrapper.current && !wrapper.current.contains(event.target)) {
         onClickOutside(event);
       }
-    };
-
+    }, [exceptionalClasses, onClickOutside]);
     useEffect(function () {
       window.addEventListener('mousedown', handleClickOutside, true);
       return function () {
         window.removeEventListener('mousedown', handleClickOutside, true);
       };
-    }, []); // should we memoize this?
+    }, [handleClickOutside]); // should we memoize this?
 
     var propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];
     var componentName = getDisplayName(WrappedComponent);
@@ -77,10 +80,6 @@ function withClickOutside(WrappedComponent) {
     onClickOutside: PropTypes.func.isRequired,
     withClickOutsideWrapperClass: PropTypes.string
   };
-  WithClickOutside.defaultProps = {
-    exceptionalClasses: null,
-    withClickOutsideWrapperClass: null
-  };
   WithClickOutside.displayName = "inlineEdit(".concat(getDisplayName(WrappedComponent), ")");
   return WithClickOutside;
 }

package/lib/esm/components/withClickOutside.js.map

@@ -1 +1 @@
-{"version":3,"file":"withClickOutside.js","sources":["../../../src/components/withClickOutside.js"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nfunction getDisplayName(WrappedComponent) {\n  return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n}\n\nfunction withClickOutside(WrappedComponent) {\n  function WithClickOutside(props) {\n    const {\n      exceptionalClasses,\n      onClickOutside,\n      withClickOutsideWrapperClass,\n    } = props;\n\n    const wrapper = useRef(null);\n\n    const handleClickOutside = event => {\n      const { classList } = event.target;\n      if (\n        exceptionalClasses\n        && (\n          classList.contains(exceptionalClasses)\n          || Array.from(classList).some(xClass => exceptionalClasses.includes(xClass))\n          || exceptionalClasses.some(item => event.target.closest(`.${item}`))\n        )\n      ) {\n        return;\n      }\n\n      if (wrapper.current && !wrapper.current.contains(event.target)) {\n        onClickOutside(event);\n      }\n    };\n\n    useEffect(() => {\n      window.addEventListener('mousedown', handleClickOutside, true);\n      return () => {\n        window.removeEventListener('mousedown', handleClickOutside, true);\n      };\n    }, []);\n\n    // should we memoize this?\n    const propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];\n    const componentName = getDisplayName(WrappedComponent);\n    if (componentName === 'Resizable') {\n      // beceause resizable wrapper directly passes props to an html el\n      propsToFilter.push('onClickOutside');\n    }\n    const filteredProps = Object.keys(props).reduce((allProps, propKey) => {\n      const _allProps = allProps;\n      if (propsToFilter.indexOf(propKey) === -1) {\n        _allProps[propKey] = props[propKey];\n      }\n      return _allProps;\n    }, {});\n\n    return (\n      <div\n        ref={wrapper}\n        className={withClickOutsideWrapperClass}\n      >\n        <WrappedComponent\n          {...filteredProps}\n        />\n      </div>\n    );\n  }\n\n  WithClickOutside.propTypes = {\n    exceptionalClasses: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.arrayOf(PropTypes.string),\n    ]),\n    onClickOutside: PropTypes.func.isRequired,\n    withClickOutsideWrapperClass: PropTypes.string,\n  };\n\n  WithClickOutside.defaultProps = {\n    exceptionalClasses: null,\n    withClickOutsideWrapperClass: null,\n  };\n\n  WithClickOutside.displayName = `inlineEdit(${getDisplayName(WrappedComponent)})`;\n\n  return WithClickOutside;\n}\n\nexport default withClickOutside;\n"],"names":["getDisplayName","WrappedComponent","displayName","name","withClickOutside","WithClickOutside","props","exceptionalClasses","onClickOutside","withClickOutsideWrapperClass","wrapper","useRef","handleClickOutside","event","classList","target","contains","Array","from","some","xClass","includes","item","closest","current","useEffect","window","addEventListener","removeEventListener","propsToFilter","componentName","push","filteredProps","Object","keys","reduce","allProps","propKey","_allProps","indexOf","_jsx","propTypes","PropTypes","oneOfType","string","arrayOf","func","isRequired","defaultProps"],"mappings":"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"}
+{"version":3,"file":"withClickOutside.js","sources":["../../../src/components/withClickOutside.js"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { EVENT_IGNORED_ROLES } from '../constants/eventIgnoredRoles';\n\nfunction getDisplayName(WrappedComponent) {\n  return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n}\n\nfunction withClickOutside(WrappedComponent) {\n  function WithClickOutside(props) {\n    const {\n      exceptionalClasses = null,\n      onClickOutside,\n      withClickOutsideWrapperClass = null,\n    } = props;\n\n    const wrapper = useRef(null);\n\n    const handleClickOutside = useCallback(event => {\n      const { classList } = event.target;\n      if (\n        exceptionalClasses\n        && (\n          classList.contains(exceptionalClasses)\n          || Array.from(classList).some(xClass => exceptionalClasses.includes(xClass))\n          || exceptionalClasses.some(item => event.target.closest(`.${item}`))\n          || EVENT_IGNORED_ROLES.some(role => event.target.closest(`[role=${role}]`))\n        )\n      ) {\n        return;\n      }\n\n      if (wrapper.current && !wrapper.current.contains(event.target)) {\n        onClickOutside(event);\n      }\n    }, [exceptionalClasses, onClickOutside]);\n\n    useEffect(() => {\n      window.addEventListener('mousedown', handleClickOutside, true);\n      return () => {\n        window.removeEventListener('mousedown', handleClickOutside, true);\n      };\n    }, [handleClickOutside]);\n\n    // should we memoize this?\n    const propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];\n    const componentName = getDisplayName(WrappedComponent);\n    if (componentName === 'Resizable') {\n      // beceause resizable wrapper directly passes props to an html el\n      propsToFilter.push('onClickOutside');\n    }\n    const filteredProps = Object.keys(props).reduce((allProps, propKey) => {\n      const _allProps = allProps;\n      if (propsToFilter.indexOf(propKey) === -1) {\n        _allProps[propKey] = props[propKey];\n      }\n      return _allProps;\n    }, {});\n\n    return (\n      <div\n        ref={wrapper}\n        className={withClickOutsideWrapperClass}\n      >\n        <WrappedComponent\n          {...filteredProps}\n        />\n      </div>\n    );\n  }\n\n  WithClickOutside.propTypes = {\n    exceptionalClasses: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.arrayOf(PropTypes.string),\n    ]),\n    onClickOutside: PropTypes.func.isRequired,\n    withClickOutsideWrapperClass: PropTypes.string,\n  };\n\n  WithClickOutside.displayName = `inlineEdit(${getDisplayName(WrappedComponent)})`;\n\n  return WithClickOutside;\n}\n\nexport default withClickOutside;\n"],"names":["getDisplayName","WrappedComponent","displayName","name","withClickOutside","WithClickOutside","props","exceptionalClasses","onClickOutside","withClickOutsideWrapperClass","wrapper","useRef","handleClickOutside","useCallback","event","classList","target","contains","Array","from","some","xClass","includes","item","closest","EVENT_IGNORED_ROLES","role","current","useEffect","window","addEventListener","removeEventListener","propsToFilter","componentName","push","filteredProps","Object","keys","reduce","allProps","propKey","_allProps","indexOf","_jsx","propTypes","PropTypes","oneOfType","string","arrayOf","func","isRequired"],"mappings":"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"}