@jotforminc/dnd-builder 2.5.7 → 2.5.9

package/lib/esm/components/Builder/SearchInput.js

@@ -6,6 +6,7 @@ import PropTypes from 'prop-types';
 import Fuse from 'fuse.js/dist/fuse.common';
 import SvgSearch from '../../assets/search.svg.js';
 import SvgClose from '../../assets/svg/close.svg.js';
+import { useTranslatedTexts } from '../../utils/hooks.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -24,6 +25,10 @@ var SearchInput = function SearchInput(_ref) {
   var elements = _ref.elements,
       searchKeys = _ref.searchKeys,
       setElements = _ref.setElements;
+
+  var _useTranslatedTexts = useTranslatedTexts(),
+      SEARCH = _useTranslatedTexts.SEARCH;
+
   var searchInputRef = useRef(null);
 
   var _useState = useState(''),
@@ -82,7 +87,7 @@ var SearchInput = function SearchInput(_ref) {
         className: "js-searchInput section-search-input",
         onChange: onSearchChange,
         onKeyDown: handleKeyDown,
-        placeholder: "Search",
+        placeholder: SEARCH,
         type: "text",
         value: searchValue
       }), /*#__PURE__*/jsx("button", {

package/lib/esm/components/Builder/SearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.js","sources":["../../../../src/components/Builder/SearchInput.js"],"sourcesContent":["import {\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  useMemo,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport Fuse from 'fuse.js/dist/fuse.common';\nimport SearchIcon from '../../assets/search.svg';\nimport CrossIcon from '../../assets/svg/close.svg';\n\nconst SearchInput = ({\n  elements,\n  searchKeys,\n  setElements,\n}) => {\n  const searchInputRef = useRef(null);\n  const [searchValue, setSearchValue] = useState('');\n\n  const searchEngine = useMemo(() => {\n    return new Fuse(elements, { keys: searchKeys, threshold: 0.4 });\n  }, [elements, searchKeys]);\n\n  useEffect(() => {\n    setElements(elements);\n    setSearchValue('');\n  }, [elements]);\n\n  const onSearchButtonClick = useCallback(() => {\n    if (searchValue) {\n      setSearchValue('');\n      setElements(elements);\n    }\n    if (searchInputRef.current) {\n      searchInputRef.current.focus();\n    }\n  }, [searchValue]);\n\n  const onSearchChange = useCallback(e => {\n    const _searchValue = e.target.value;\n    setSearchValue(_searchValue);\n\n    if (!_searchValue || !searchKeys) {\n      return setElements(elements);\n    }\n\n    const filteredElements = searchEngine.search(_searchValue).map(i => i.item);\n\n    setElements(filteredElements.length ? filteredElements : 'noResult');\n  }, [elements, searchKeys]);\n\n  const handleKeyDown = useCallback(e => {\n    e.stopPropagation();\n    if (e.key === 'Escape' && searchInputRef.current) {\n      setSearchValue('');\n      setElements(elements);\n      searchInputRef.current.blur();\n    }\n  }, [elements]);\n\n  return (\n    <div className=\"jfReport-searchContainer\">\n      <div className=\"jfReport-search p-relative\">\n        <input\n          ref={searchInputRef}\n          className=\"js-searchInput section-search-input\"\n          onChange={onSearchChange}\n          onKeyDown={handleKeyDown}\n          placeholder=\"Search\"\n          type=\"text\"\n          value={searchValue}\n        />\n        <button\n          className=\"section-search-button search-icon\"\n          onClick={onSearchButtonClick}\n          type=\"button\"\n        >\n          <SearchIcon className=\"section-search-icon\" />\n        </button>\n        {searchValue && (\n          <button\n            className=\"section-search-button search-delete\"\n            onClick={onSearchButtonClick}\n            type=\"button\"\n          >\n            <CrossIcon className=\"section-search-icon delete\" />\n          </button>\n        )}\n      </div>\n    </div>\n  );\n};\n\nSearchInput.propTypes = {\n  elements: PropTypes.arrayOf(PropTypes.shape({})),\n  searchKeys: PropTypes.arrayOf(PropTypes.shape({\n    name: PropTypes.string,\n    weight: PropTypes.number,\n  })),\n  setElements: PropTypes.func,\n};\n\nSearchInput.defaultProps = {\n  elements: [],\n  searchKeys: [],\n  setElements: f => f,\n};\n\nexport default SearchInput;\n"],"names":["SearchInput","elements","searchKeys","setElements","searchInputRef","useRef","useState","searchValue","setSearchValue","searchEngine","useMemo","Fuse","keys","threshold","useEffect","onSearchButtonClick","useCallback","current","focus","onSearchChange","e","_searchValue","target","value","filteredElements","search","map","i","item","length","handleKeyDown","stopPropagation","key","blur","_jsx","_jsxs","SearchIcon","CrossIcon","propTypes","PropTypes","arrayOf","shape","name","string","weight","number","func","defaultProps","f"],"mappings":";;;;;;;;;;;;;;;;;;;;;;IAYMA,WAAW,GAAG,SAAdA,WAAc,OAId;AAAA,MAHJC,QAGI,QAHJA,QAGI;AAAA,MAFJC,UAEI,QAFJA,UAEI;AAAA,MADJC,WACI,QADJA,WACI;AACJ,MAAMC,cAAc,GAAGC,MAAM,CAAC,IAAD,CAA7B;;AACA,kBAAsCC,QAAQ,CAAC,EAAD,CAA9C;AAAA;AAAA,MAAOC,WAAP;AAAA,MAAoBC,cAApB;;AAEA,MAAMC,YAAY,GAAGC,OAAO,CAAC,YAAM;AACjC,WAAO,IAAIC,IAAJ,CAASV,QAAT,EAAmB;AAAEW,MAAAA,IAAI,EAAEV,UAAR;AAAoBW,MAAAA,SAAS,EAAE;AAA/B,KAAnB,CAAP;AACD,GAF2B,EAEzB,CAACZ,QAAD,EAAWC,UAAX,CAFyB,CAA5B;AAIAY,EAAAA,SAAS,CAAC,YAAM;AACdX,IAAAA,WAAW,CAACF,QAAD,CAAX;AACAO,IAAAA,cAAc,CAAC,EAAD,CAAd;AACD,GAHQ,EAGN,CAACP,QAAD,CAHM,CAAT;AAKA,MAAMc,mBAAmB,GAAGC,WAAW,CAAC,YAAM;AAC5C,QAAIT,WAAJ,EAAiB;AACfC,MAAAA,cAAc,CAAC,EAAD,CAAd;AACAL,MAAAA,WAAW,CAACF,QAAD,CAAX;AACD;;AACD,QAAIG,cAAc,CAACa,OAAnB,EAA4B;AAC1Bb,MAAAA,cAAc,CAACa,OAAf,CAAuBC,KAAvB;AACD;AACF,GARsC,EAQpC,CAACX,WAAD,CARoC,CAAvC;AAUA,MAAMY,cAAc,GAAGH,WAAW,CAAC,UAAAI,CAAC,EAAI;AACtC,QAAMC,YAAY,GAAGD,CAAC,CAACE,MAAF,CAASC,KAA9B;AACAf,IAAAA,cAAc,CAACa,YAAD,CAAd;;AAEA,QAAI,CAACA,YAAD,IAAiB,CAACnB,UAAtB,EAAkC;AAChC,aAAOC,WAAW,CAACF,QAAD,CAAlB;AACD;;AAED,QAAMuB,gBAAgB,GAAGf,YAAY,CAACgB,MAAb,CAAoBJ,YAApB,EAAkCK,GAAlC,CAAsC,UAAAC,CAAC;AAAA,aAAIA,CAAC,CAACC,IAAN;AAAA,KAAvC,CAAzB;AAEAzB,IAAAA,WAAW,CAACqB,gBAAgB,CAACK,MAAjB,GAA0BL,gBAA1B,GAA6C,UAA9C,CAAX;AACD,GAXiC,EAW/B,CAACvB,QAAD,EAAWC,UAAX,CAX+B,CAAlC;AAaA,MAAM4B,aAAa,GAAGd,WAAW,CAAC,UAAAI,CAAC,EAAI;AACrCA,IAAAA,CAAC,CAACW,eAAF;;AACA,QAAIX,CAAC,CAACY,GAAF,KAAU,QAAV,IAAsB5B,cAAc,CAACa,OAAzC,EAAkD;AAChDT,MAAAA,cAAc,CAAC,EAAD,CAAd;AACAL,MAAAA,WAAW,CAACF,QAAD,CAAX;AACAG,MAAAA,cAAc,CAACa,OAAf,CAAuBgB,IAAvB;AACD;AACF,GAPgC,EAO9B,CAAChC,QAAD,CAP8B,CAAjC;AASA,sBACEiC;AAAK,IAAA,SAAS,EAAC,0BAAf;AAAA,2BACEC;AAAK,MAAA,SAAS,EAAC,4BAAf;AAAA,8BACED;AACE,QAAA,GAAG,EAAE9B,cADP;AAEE,QAAA,SAAS,EAAC,qCAFZ;AAGE,QAAA,QAAQ,EAAEe,cAHZ;AAIE,QAAA,SAAS,EAAEW,aAJb;AAKE,QAAA,WAAW,EAAC,QALd;AAME,QAAA,IAAI,EAAC,MANP;AAOE,QAAA,KAAK,EAAEvB;AAPT,QADF,eAUE2B;AACE,QAAA,SAAS,EAAC,mCADZ;AAEE,QAAA,OAAO,EAAEnB,mBAFX;AAGE,QAAA,IAAI,EAAC,QAHP;AAAA,+BAKEmB,IAACE,SAAD;AAAY,UAAA,SAAS,EAAC;AAAtB;AALF,QAVF,EAiBG7B,WAAW,iBACV2B;AACE,QAAA,SAAS,EAAC,qCADZ;AAEE,QAAA,OAAO,EAAEnB,mBAFX;AAGE,QAAA,IAAI,EAAC,QAHP;AAAA,+BAKEmB,IAACG,QAAD;AAAW,UAAA,SAAS,EAAC;AAArB;AALF,QAlBJ;AAAA;AADF,IADF;AA+BD;;AAEDrC,WAAW,CAACsC,SAAZ,GAAwB;AACtBrC,EAAAA,QAAQ,EAAEsC,SAAS,CAACC,OAAV,CAAkBD,SAAS,CAACE,KAAV,CAAgB,EAAhB,CAAlB,CADY;AAEtBvC,EAAAA,UAAU,EAAEqC,SAAS,CAACC,OAAV,CAAkBD,SAAS,CAACE,KAAV,CAAgB;AAC5CC,IAAAA,IAAI,EAAEH,SAAS,CAACI,MAD4B;AAE5CC,IAAAA,MAAM,EAAEL,SAAS,CAACM;AAF0B,GAAhB,CAAlB,CAFU;AAMtB1C,EAAAA,WAAW,EAAEoC,SAAS,CAACO;AAND,CAAxB;AASA9C,WAAW,CAAC+C,YAAZ,GAA2B;AACzB9C,EAAAA,QAAQ,EAAE,EADe;AAEzBC,EAAAA,UAAU,EAAE,EAFa;AAGzBC,EAAAA,WAAW,EAAE,qBAAA6C,CAAC;AAAA,WAAIA,CAAJ;AAAA;AAHW,CAA3B;;;;"}
+{"version":3,"file":"SearchInput.js","sources":["../../../../src/components/Builder/SearchInput.js"],"sourcesContent":["import {\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  useMemo,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport Fuse from 'fuse.js/dist/fuse.common';\nimport SearchIcon from '../../assets/search.svg';\nimport CrossIcon from '../../assets/svg/close.svg';\nimport { useTranslatedTexts } from '../../utils/hooks';\n\nconst SearchInput = ({\n  elements,\n  searchKeys,\n  setElements,\n}) => {\n  const { SEARCH } = useTranslatedTexts();\n  const searchInputRef = useRef(null);\n  const [searchValue, setSearchValue] = useState('');\n\n  const searchEngine = useMemo(() => {\n    return new Fuse(elements, { keys: searchKeys, threshold: 0.4 });\n  }, [elements, searchKeys]);\n\n  useEffect(() => {\n    setElements(elements);\n    setSearchValue('');\n  }, [elements]);\n\n  const onSearchButtonClick = useCallback(() => {\n    if (searchValue) {\n      setSearchValue('');\n      setElements(elements);\n    }\n    if (searchInputRef.current) {\n      searchInputRef.current.focus();\n    }\n  }, [searchValue]);\n\n  const onSearchChange = useCallback(e => {\n    const _searchValue = e.target.value;\n    setSearchValue(_searchValue);\n\n    if (!_searchValue || !searchKeys) {\n      return setElements(elements);\n    }\n\n    const filteredElements = searchEngine.search(_searchValue).map(i => i.item);\n\n    setElements(filteredElements.length ? filteredElements : 'noResult');\n  }, [elements, searchKeys]);\n\n  const handleKeyDown = useCallback(e => {\n    e.stopPropagation();\n    if (e.key === 'Escape' && searchInputRef.current) {\n      setSearchValue('');\n      setElements(elements);\n      searchInputRef.current.blur();\n    }\n  }, [elements]);\n\n  return (\n    <div className=\"jfReport-searchContainer\">\n      <div className=\"jfReport-search p-relative\">\n        <input\n          ref={searchInputRef}\n          className=\"js-searchInput section-search-input\"\n          onChange={onSearchChange}\n          onKeyDown={handleKeyDown}\n          placeholder={SEARCH}\n          type=\"text\"\n          value={searchValue}\n        />\n        <button\n          className=\"section-search-button search-icon\"\n          onClick={onSearchButtonClick}\n          type=\"button\"\n        >\n          <SearchIcon className=\"section-search-icon\" />\n        </button>\n        {searchValue && (\n          <button\n            className=\"section-search-button search-delete\"\n            onClick={onSearchButtonClick}\n            type=\"button\"\n          >\n            <CrossIcon className=\"section-search-icon delete\" />\n          </button>\n        )}\n      </div>\n    </div>\n  );\n};\n\nSearchInput.propTypes = {\n  elements: PropTypes.arrayOf(PropTypes.shape({})),\n  searchKeys: PropTypes.arrayOf(PropTypes.shape({\n    name: PropTypes.string,\n    weight: PropTypes.number,\n  })),\n  setElements: PropTypes.func,\n};\n\nSearchInput.defaultProps = {\n  elements: [],\n  searchKeys: [],\n  setElements: f => f,\n};\n\nexport default SearchInput;\n"],"names":["SearchInput","elements","searchKeys","setElements","useTranslatedTexts","SEARCH","searchInputRef","useRef","useState","searchValue","setSearchValue","searchEngine","useMemo","Fuse","keys","threshold","useEffect","onSearchButtonClick","useCallback","current","focus","onSearchChange","e","_searchValue","target","value","filteredElements","search","map","i","item","length","handleKeyDown","stopPropagation","key","blur","_jsx","_jsxs","SearchIcon","CrossIcon","propTypes","PropTypes","arrayOf","shape","name","string","weight","number","func","defaultProps","f"],"mappings":"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"}

package/lib/esm/components/Elements/Image.js

@@ -86,7 +86,7 @@ var settings = [{
   type: 'slider'
 }, {
   key: 'url',
-  label: 'Enter Url',
+  label: 'Enter URL',
   section: 'ENTER URL',
   showWhen: {
     url: ''

package/lib/esm/components/Elements/Image.js.map

@@ -1 +1 @@
-{"version":3,"file":"Image.js","sources":["../../../../src/components/Elements/Image.js"],"sourcesContent":["/* eslint max-len: [\"error\", { \"code\": 120 }] */\nimport { memo, useState, useEffect } from 'react';\nimport {\n  func,\n  number,\n  oneOfType,\n  shape,\n  string,\n} from 'prop-types';\n\nconst ITEM_TYPE = 'image';\n\nconst DEFAULT_LOGO_SRC = 'https://www.jotform.com/resources/assets/icon/jotform-logomark-transparent-400x400.png';\n\nconst imageWrapperStyle = {\n  height: 'inherit',\n  width: 'inherit',\n};\n\nconst imageStyle = {\n  height: '100%',\n  width: '100%',\n};\n\nconst settings = [\n  {\n    hideWhen: {\n      url: '',\n    },\n    ifValueEquals: {\n      '': {\n        height: {\n          cast: 'integer',\n          value: 400,\n        },\n        width: {\n          cast: 'integer',\n          value: 400,\n        },\n      },\n    },\n    key: 'url',\n    section: 'GENERAL',\n    type: 'imageThumbnailWithDelete',\n  },\n  {\n    hideWhen: {\n      url: '',\n    },\n    key: 'sizeSettings',\n    label: 'Size',\n    section: 'GENERAL',\n    type: 'sizeSettings',\n    value: (_, { height, width }) => `${width}x${height}`,\n  },\n  {\n    hideWhen: {\n      url: '',\n    },\n    key: 'roundedCorners',\n    label: 'Rounded Corners',\n    range: [0, 30],\n    section: 'GENERAL',\n    showWhen: {\n      shapeType: 'rectangle',\n    },\n    simple: true,\n    type: 'slider',\n  },\n  {\n    hideWhen: {\n      url: '',\n    },\n    key: 'opacity',\n    label: 'Opacity',\n    range: [0, 100],\n    section: 'GENERAL',\n    type: 'slider',\n  },\n  {\n    key: 'url',\n    label: 'Enter Url',\n    section: 'ENTER URL',\n    showWhen: { url: '' },\n    type: 'enterImageURL',\n    useImageSizeUpdate: true,\n  },\n];\n\nexport const ImageElement = ({ item, itemAccessor }) => {\n  const [isLoading, setIsLoading] = useState(true);\n  const [isErrored, setIsErrored] = useState(false);\n\n  const {\n    opacity,\n    roundedCorners,\n    url,\n  } = item;\n\n  const additionalProps = itemAccessor(item);\n  const defaultURL = additionalProps?.defaultURL || DEFAULT_LOGO_SRC;\n\n  useEffect(() => {\n    setIsLoading(true);\n    setIsErrored(false);\n  }, [url, setIsLoading, setIsErrored]);\n\n  // TODO :: do we want to show a loading placeholder?\n\n  return (\n    <>\n      <div\n        style={{\n          ...imageWrapperStyle,\n          display: isLoading || isErrored ? 'none' : 'block',\n        }}\n      >\n        <img\n          alt=\"reportImage\"\n          onError={() => {\n            setIsLoading(false);\n            setIsErrored(true);\n          }}\n          onLoad={() => setIsLoading(false)}\n          src={url || defaultURL}\n          style={{\n            ...imageStyle,\n            borderRadius: `${roundedCorners}px`,\n            display: isErrored ? 'none' : '',\n            opacity: parseFloat(opacity),\n          }}\n        />\n      </div>\n      {isErrored && (\n        <div\n          style={{\n            ...imageWrapperStyle,\n            background: '#fafafa',\n            paddingTop: '40%',\n            textAlign: 'center',\n          }}\n        >\n          Image was not loaded!\n        </div>\n      )}\n    </>\n  );\n};\n\nImageElement.propTypes = {\n  item: shape({\n    defaultURL: string,\n    height: oneOfType([\n      number,\n      string,\n    ]),\n    id: string,\n    opacity: oneOfType([\n      number,\n      string,\n    ]),\n    roundedCorners: oneOfType([\n      number,\n      string,\n    ]),\n    url: string,\n    width: oneOfType([\n      number,\n      string,\n    ]),\n  }),\n  itemAccessor: func,\n};\n\nImageElement.defaultProps = {\n  item: {\n    opacity: 1,\n  },\n  itemAccessor: () => {},\n};\n\nconst details = {\n  height: 400,\n  itemType: ITEM_TYPE,\n  opacity: 1,\n  roundedCorners: 0,\n  url: '',\n  width: 400,\n};\n\nexport default {\n  Component: memo(ImageElement),\n  details,\n  itemType: ITEM_TYPE,\n  settings,\n};\n"],"names":["ITEM_TYPE","DEFAULT_LOGO_SRC","imageWrapperStyle","height","width","imageStyle","settings","hideWhen","url","ifValueEquals","cast","value","key","section","type","label","_","range","showWhen","shapeType","simple","useImageSizeUpdate","ImageElement","item","itemAccessor","useState","isLoading","setIsLoading","isErrored","setIsErrored","opacity","roundedCorners","additionalProps","defaultURL","useEffect","_jsxs","_jsx","display","borderRadius","parseFloat","background","paddingTop","textAlign","propTypes","shape","string","oneOfType","number","id","func","defaultProps","details","itemType","Component","memo"],"mappings":"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"}
+{"version":3,"file":"Image.js","sources":["../../../../src/components/Elements/Image.js"],"sourcesContent":["/* eslint max-len: [\"error\", { \"code\": 120 }] */\nimport { memo, useState, useEffect } from 'react';\nimport {\n  func,\n  number,\n  oneOfType,\n  shape,\n  string,\n} from 'prop-types';\n\nconst ITEM_TYPE = 'image';\n\nconst DEFAULT_LOGO_SRC = 'https://www.jotform.com/resources/assets/icon/jotform-logomark-transparent-400x400.png';\n\nconst imageWrapperStyle = {\n  height: 'inherit',\n  width: 'inherit',\n};\n\nconst imageStyle = {\n  height: '100%',\n  width: '100%',\n};\n\nconst settings = [\n  {\n    hideWhen: {\n      url: '',\n    },\n    ifValueEquals: {\n      '': {\n        height: {\n          cast: 'integer',\n          value: 400,\n        },\n        width: {\n          cast: 'integer',\n          value: 400,\n        },\n      },\n    },\n    key: 'url',\n    section: 'GENERAL',\n    type: 'imageThumbnailWithDelete',\n  },\n  {\n    hideWhen: {\n      url: '',\n    },\n    key: 'sizeSettings',\n    label: 'Size',\n    section: 'GENERAL',\n    type: 'sizeSettings',\n    value: (_, { height, width }) => `${width}x${height}`,\n  },\n  {\n    hideWhen: {\n      url: '',\n    },\n    key: 'roundedCorners',\n    label: 'Rounded Corners',\n    range: [0, 30],\n    section: 'GENERAL',\n    showWhen: {\n      shapeType: 'rectangle',\n    },\n    simple: true,\n    type: 'slider',\n  },\n  {\n    hideWhen: {\n      url: '',\n    },\n    key: 'opacity',\n    label: 'Opacity',\n    range: [0, 100],\n    section: 'GENERAL',\n    type: 'slider',\n  },\n  {\n    key: 'url',\n    label: 'Enter URL',\n    section: 'ENTER URL',\n    showWhen: { url: '' },\n    type: 'enterImageURL',\n    useImageSizeUpdate: true,\n  },\n];\n\nexport const ImageElement = ({ item, itemAccessor }) => {\n  const [isLoading, setIsLoading] = useState(true);\n  const [isErrored, setIsErrored] = useState(false);\n\n  const {\n    opacity,\n    roundedCorners,\n    url,\n  } = item;\n\n  const additionalProps = itemAccessor(item);\n  const defaultURL = additionalProps?.defaultURL || DEFAULT_LOGO_SRC;\n\n  useEffect(() => {\n    setIsLoading(true);\n    setIsErrored(false);\n  }, [url, setIsLoading, setIsErrored]);\n\n  // TODO :: do we want to show a loading placeholder?\n\n  return (\n    <>\n      <div\n        style={{\n          ...imageWrapperStyle,\n          display: isLoading || isErrored ? 'none' : 'block',\n        }}\n      >\n        <img\n          alt=\"reportImage\"\n          onError={() => {\n            setIsLoading(false);\n            setIsErrored(true);\n          }}\n          onLoad={() => setIsLoading(false)}\n          src={url || defaultURL}\n          style={{\n            ...imageStyle,\n            borderRadius: `${roundedCorners}px`,\n            display: isErrored ? 'none' : '',\n            opacity: parseFloat(opacity),\n          }}\n        />\n      </div>\n      {isErrored && (\n        <div\n          style={{\n            ...imageWrapperStyle,\n            background: '#fafafa',\n            paddingTop: '40%',\n            textAlign: 'center',\n          }}\n        >\n          Image was not loaded!\n        </div>\n      )}\n    </>\n  );\n};\n\nImageElement.propTypes = {\n  item: shape({\n    defaultURL: string,\n    height: oneOfType([\n      number,\n      string,\n    ]),\n    id: string,\n    opacity: oneOfType([\n      number,\n      string,\n    ]),\n    roundedCorners: oneOfType([\n      number,\n      string,\n    ]),\n    url: string,\n    width: oneOfType([\n      number,\n      string,\n    ]),\n  }),\n  itemAccessor: func,\n};\n\nImageElement.defaultProps = {\n  item: {\n    opacity: 1,\n  },\n  itemAccessor: () => {},\n};\n\nconst details = {\n  height: 400,\n  itemType: ITEM_TYPE,\n  opacity: 1,\n  roundedCorners: 0,\n  url: '',\n  width: 400,\n};\n\nexport default {\n  Component: memo(ImageElement),\n  details,\n  itemType: ITEM_TYPE,\n  settings,\n};\n"],"names":["ITEM_TYPE","DEFAULT_LOGO_SRC","imageWrapperStyle","height","width","imageStyle","settings","hideWhen","url","ifValueEquals","cast","value","key","section","type","label","_","range","showWhen","shapeType","simple","useImageSizeUpdate","ImageElement","item","itemAccessor","useState","isLoading","setIsLoading","isErrored","setIsErrored","opacity","roundedCorners","additionalProps","defaultURL","useEffect","_jsxs","_jsx","display","borderRadius","parseFloat","background","paddingTop","textAlign","propTypes","shape","string","oneOfType","number","id","func","defaultProps","details","itemType","Component","memo"],"mappings":"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"}

package/lib/esm/components/Elements/RichText.js

@@ -4,6 +4,7 @@ import TextEditor from '../TextEditor/TextEditor.js';
 import { fontTypes } from '../../constants/fonts.js';
 import { useBuilderContext } from '../../utils/builderContext.js';
 import { divider } from '../../utils/staticSettings.js';
+import { useTranslatedTexts } from '../../utils/hooks.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; }
@@ -44,6 +45,9 @@ var RichTextElement = function RichTextElement(_ref) {
   var _useBuilderContext = useBuilderContext(),
       isTextEditorOpen = _useBuilderContext.isTextEditorOpen;
 
+  var _useTranslatedTexts = useTranslatedTexts(),
+      CLICK_TO_EDIT_TEXT = _useTranslatedTexts.CLICK_TO_EDIT_TEXT;
+
   var textStyle = {
     fontFamily: fontFamily,
     opacity: opacity
@@ -75,7 +79,7 @@ var RichTextElement = function RichTextElement(_ref) {
       handleSave: handleSave,
       isLocked: isLocked,
       isSelected: isSelected,
-      placeholder: "Click to edit text"
+      placeholder: CLICK_TO_EDIT_TEXT
     })
   });
 };

package/lib/esm/components/Elements/RichText.js.map

@@ -1 +1 @@
-{"version":3,"file":"RichText.js","sources":["../../../../src/components/Elements/RichText.js"],"sourcesContent":["import {\n  memo, useEffect, useRef, useCallback,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport TextEditor from '../TextEditor';\nimport { fontTypes } from '../../constants/fonts';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { divider } from '../../utils/staticSettings';\n\nconst ITEM_TYPE = 'text';\n\nconst settings = [\n  {\n    key: 'fontFamily',\n    label: 'Font Family',\n    options: fontTypes.fonts,\n    section: 'GENERAL',\n    type: 'dropdown',\n  },\n  {\n    ...divider('GENERAL'),\n  },\n  {\n    key: 'opacity',\n    label: 'Opacity',\n    range: [0, 100],\n    section: 'GENERAL',\n    type: 'slider',\n  },\n];\n\nconst defaultItem = {\n  fontFamily: 'Circular',\n  opacity: 1,\n  value: '',\n};\n\nexport const RichTextElement = ({\n  isSelected,\n  item: {\n    fontFamily,\n    id,\n    isLocked,\n    opacity,\n    value,\n  },\n  onItemChange,\n}) => {\n  const reportItem = useRef({});\n  const { isTextEditorOpen } = useBuilderContext();\n\n  const textStyle = {\n    fontFamily,\n    opacity,\n  };\n\n  const handleSave = useCallback(newValue => {\n    onItemChange(\n      { id },\n      { value: newValue },\n    );\n  }, [id]);\n\n  const onFocus = e => {\n    e.currentTarget.parentElement.setAttribute('draggable', false);\n  };\n\n  useEffect(() => {\n    if (!isTextEditorOpen) {\n      reportItem.current.parentElement.setAttribute('draggable', true);\n    }\n  }, [isTextEditorOpen]);\n\n  return (\n    <div\n      ref={reportItem}\n      className=\"reportItemInner f-height\"\n      onFocus={onFocus}\n      style={textStyle}\n    >\n      <TextEditor\n        content={value}\n        handleSave={handleSave}\n        isLocked={isLocked}\n        isSelected={isSelected}\n        placeholder=\"Click to edit text\"\n      />\n    </div>\n  );\n};\n\nRichTextElement.propTypes = {\n  isSelected: PropTypes.bool,\n  item: PropTypes.shape({\n    fontFamily: PropTypes.string,\n    id: PropTypes.string,\n    isLocked: PropTypes.bool,\n    opacity: PropTypes.number,\n    value: PropTypes.string,\n  }),\n  onItemChange: PropTypes.func,\n};\n\nRichTextElement.defaultProps = {\n  isSelected: false,\n  item: {},\n  onItemChange: () => { },\n};\n\nconst details = {\n  height: 65,\n  itemType: ITEM_TYPE,\n  width: 350,\n};\n\nexport default {\n  Component: memo(RichTextElement),\n  defaultItem,\n  details,\n  itemType: ITEM_TYPE,\n  settings,\n};\n"],"names":["ITEM_TYPE","settings","key","label","options","fontTypes","fonts","section","type","divider","range","defaultItem","fontFamily","opacity","value","RichTextElement","isSelected","item","id","isLocked","onItemChange","reportItem","useRef","useBuilderContext","isTextEditorOpen","textStyle","handleSave","useCallback","newValue","onFocus","e","currentTarget","parentElement","setAttribute","useEffect","current","_jsx","propTypes","PropTypes","bool","shape","string","number","func","defaultProps","details","height","itemType","width","Component","memo"],"mappings":"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"}
+{"version":3,"file":"RichText.js","sources":["../../../../src/components/Elements/RichText.js"],"sourcesContent":["import {\n  memo, useEffect, useRef, useCallback,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport TextEditor from '../TextEditor';\nimport { fontTypes } from '../../constants/fonts';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { divider } from '../../utils/staticSettings';\nimport { useTranslatedTexts } from '../../utils/hooks';\n\nconst ITEM_TYPE = 'text';\n\nconst settings = [\n  {\n    key: 'fontFamily',\n    label: 'Font Family',\n    options: fontTypes.fonts,\n    section: 'GENERAL',\n    type: 'dropdown',\n  },\n  {\n    ...divider('GENERAL'),\n  },\n  {\n    key: 'opacity',\n    label: 'Opacity',\n    range: [0, 100],\n    section: 'GENERAL',\n    type: 'slider',\n  },\n];\n\nconst defaultItem = {\n  fontFamily: 'Circular',\n  opacity: 1,\n  value: '',\n};\n\nexport const RichTextElement = ({\n  isSelected,\n  item: {\n    fontFamily,\n    id,\n    isLocked,\n    opacity,\n    value,\n  },\n  onItemChange,\n}) => {\n  const reportItem = useRef({});\n  const { isTextEditorOpen } = useBuilderContext();\n  const { CLICK_TO_EDIT_TEXT } = useTranslatedTexts();\n\n  const textStyle = {\n    fontFamily,\n    opacity,\n  };\n\n  const handleSave = useCallback(newValue => {\n    onItemChange(\n      { id },\n      { value: newValue },\n    );\n  }, [id]);\n\n  const onFocus = e => {\n    e.currentTarget.parentElement.setAttribute('draggable', false);\n  };\n\n  useEffect(() => {\n    if (!isTextEditorOpen) {\n      reportItem.current.parentElement.setAttribute('draggable', true);\n    }\n  }, [isTextEditorOpen]);\n\n  return (\n    <div\n      ref={reportItem}\n      className=\"reportItemInner f-height\"\n      onFocus={onFocus}\n      style={textStyle}\n    >\n      <TextEditor\n        content={value}\n        handleSave={handleSave}\n        isLocked={isLocked}\n        isSelected={isSelected}\n        placeholder={CLICK_TO_EDIT_TEXT}\n      />\n    </div>\n  );\n};\n\nRichTextElement.propTypes = {\n  isSelected: PropTypes.bool,\n  item: PropTypes.shape({\n    fontFamily: PropTypes.string,\n    id: PropTypes.string,\n    isLocked: PropTypes.bool,\n    opacity: PropTypes.number,\n    value: PropTypes.string,\n  }),\n  onItemChange: PropTypes.func,\n};\n\nRichTextElement.defaultProps = {\n  isSelected: false,\n  item: {},\n  onItemChange: () => { },\n};\n\nconst details = {\n  height: 65,\n  itemType: ITEM_TYPE,\n  width: 350,\n};\n\nexport default {\n  Component: memo(RichTextElement),\n  defaultItem,\n  details,\n  itemType: ITEM_TYPE,\n  settings,\n};\n"],"names":["ITEM_TYPE","settings","key","label","options","fontTypes","fonts","section","type","divider","range","defaultItem","fontFamily","opacity","value","RichTextElement","isSelected","item","id","isLocked","onItemChange","reportItem","useRef","useBuilderContext","isTextEditorOpen","useTranslatedTexts","CLICK_TO_EDIT_TEXT","textStyle","handleSave","useCallback","newValue","onFocus","e","currentTarget","parentElement","setAttribute","useEffect","current","_jsx","propTypes","PropTypes","bool","shape","string","number","func","defaultProps","details","height","itemType","width","Component","memo"],"mappings":"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"}

package/lib/esm/components/Panels/RightPanel/RightPanel.js

@@ -1,4 +1,3 @@
-import 'core-js/modules/es.array.concat.js';
 import 'core-js/modules/es.array.find.js';
 import 'core-js/modules/es.array.from.js';
 import 'core-js/modules/es.array.includes.js';
@@ -20,7 +19,6 @@ import { REPORT_SETTINGS_ITEM_TYPE, PAGE_SETTINGS_ITEM_TYPE } from '../../../con
 import Tabs from '../../Builder/Tabs.js';
 import Settings from './Settings.js';
 import RightPanelToggler from './RightPanelToggler.js';
-import { capitalize } from '../../../utils/string.js';
 import { jsx, Fragment, jsxs } 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; }
@@ -51,12 +49,7 @@ var RightPanel = function RightPanel(_ref) {
       layoutSettings = _usePropContext.settings;
 
   var panelRef = useRef(null);
-
-  var _useTranslatedTexts = useTranslatedTexts(),
-      LAYOUT_SETTINGS = _useTranslatedTexts.LAYOUT_SETTINGS,
-      PAGE_SETTINGS = _useTranslatedTexts.PAGE_SETTINGS,
-      SETTINGS = _useTranslatedTexts.SETTINGS;
-
+  var translatedTexts = useTranslatedTexts();
   var settingMap = {
     i_: {
       details: function details(id) {
@@ -67,7 +60,8 @@ var RightPanel = function RightPanel(_ref) {
         return acceptedItems[item.itemType];
       },
       title: function title(item) {
-        return "".concat(capitalize(acceptedItems[item.itemType].title || item.itemType), " ").concat(SETTINGS);
+        // eslint-disable-next-line max-len
+        return translatedTexts["".concat((acceptedItems[item.itemType].title || item.itemType).toLocaleUpperCase(), "_SETTINGS")];
       },
       updater: onItemChange
     },
@@ -82,7 +76,7 @@ var RightPanel = function RightPanel(_ref) {
         return acceptedItems[REPORT_SETTINGS_ITEM_TYPE] || Layout;
       },
       title: function title() {
-        return LAYOUT_SETTINGS;
+        return translatedTexts.LAYOUT_SETTINGS;
       },
       updater: onSettingChange
     },
@@ -112,7 +106,7 @@ var RightPanel = function RightPanel(_ref) {
         });
       },
       title: function title() {
-        return PAGE_SETTINGS;
+        return translatedTexts.PAGE_SETTINGS;
       },
       updater: onPageChange
     }

package/lib/esm/components/Panels/RightPanel/RightPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"RightPanel.js","sources":["../../../../../src/components/Panels/RightPanel/RightPanel.js"],"sourcesContent":["import {\n  memo,\n  useEffect,\n  useRef,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport Panel from '../../Builder/Panel';\nimport Section from '../../Builder/Section';\nimport Layout from '../../../constants/reportSettings';\nimport Page from '../../../constants/pageSettings';\nimport { useBuilderContext } from '../../../utils/builderContext';\nimport { usePropContext } from '../../../utils/propContext';\nimport { findItemById, getTabsWithSettings } from '../../../utils/functions';\nimport { useTranslatedTexts } from '../../../utils/hooks';\nimport {\n  REPORT_SETTINGS_ITEM_TYPE, PAGE_SETTINGS_ITEM_TYPE,\n} from '../../../constants/itemTypes';\nimport Tabs from '../../Builder/Tabs';\nimport Settings from './Settings';\nimport RightPanelToggler from './RightPanelToggler';\nimport { capitalize } from '../../../utils/string';\n\nconst exceptionalClasses = [\n  'pageSettingSideBtn', 'paneClose', 'paneToggler', 'forZoom', 'jSheetContextMenu',\n];\n\nconst RightPanel = ({\n  itemAccessor,\n  onItemChange,\n  onPageChange,\n  onSettingChange,\n  pages,\n}) => {\n  const {\n    activeTab,\n    editedElement,\n    isRightPanelOpen,\n    isSlidesPanelOpen,\n    setActiveElement,\n    setActiveTab,\n    setIsRightPanelOpen,\n  } = useBuilderContext();\n  const { acceptedItems, settings: layoutSettings } = usePropContext();\n  const panelRef = useRef(null);\n  const { LAYOUT_SETTINGS, PAGE_SETTINGS, SETTINGS } = useTranslatedTexts();\n  const settingMap = {\n    i_: {\n      details: id => {\n        const item = findItemById(id, pages);\n        return item;\n      },\n      settings: item => {\n        return acceptedItems[item.itemType];\n      },\n      title: item => {\n        return `${capitalize(acceptedItems[item.itemType].title || item.itemType)} ${SETTINGS}`;\n      },\n      updater: onItemChange,\n    },\n    l_: {\n      details: () => {\n        return {\n          ...layoutSettings,\n          id: REPORT_SETTINGS_ITEM_TYPE,\n          itemType: REPORT_SETTINGS_ITEM_TYPE,\n        };\n      },\n      settings: () => {\n        return acceptedItems[REPORT_SETTINGS_ITEM_TYPE] || Layout;\n      },\n      title: () => LAYOUT_SETTINGS,\n      updater: onSettingChange,\n    },\n    p_: {\n      details: id => {\n        return {\n          backgroundColor: layoutSettings.reportBackgroundColor,\n          ...pages.find(page => page.id === id),\n          itemType: PAGE_SETTINGS_ITEM_TYPE,\n        };\n      },\n      settings: () => {\n        const pageItem = acceptedItems[PAGE_SETTINGS_ITEM_TYPE] || Page;\n        return {\n          ...pageItem,\n          settings: pageItem.settings.map(setting => {\n            if (setting.key === 'pageLayer') {\n              return { ...setting, setActiveElement, updater: onItemChange };\n            }\n            return setting;\n          }) || Page.settings,\n        };\n      },\n      title: () => PAGE_SETTINGS,\n      updater: onPageChange,\n    },\n  };\n\n  let editedEl;\n  let editedElId;\n  let selectedItem;\n  let element;\n  let updateFunc;\n  let title;\n\n  const panelConfig = () => {\n    selectedItem = editedEl.details(editedElId);\n    element = editedEl.settings(selectedItem);\n    updateFunc = editedEl.updater;\n    title = editedEl.title(selectedItem);\n  };\n\n  const fallback = () => {\n    setActiveElement(null);\n    editedEl = settingMap.l_;\n    editedElId = editedElement.substr(2);\n    panelConfig();\n  };\n\n  try {\n    editedEl = settingMap[editedElement.substr(0, 2)];\n    editedElId = editedElement.substr(2);\n    const checkSelectedItem = editedEl.details(editedElId);\n    if (Object.keys(checkSelectedItem).length === 0) {\n      fallback();\n    } else {\n      panelConfig();\n    }\n  } catch (e) {\n    fallback();\n  }\n\n  // Tabs\n  const tabsWithSettings = getTabsWithSettings(element, selectedItem, itemAccessor);\n  const tabs = Object.keys(tabsWithSettings);\n\n  useEffect(() => {\n    const currentTab = tabs[activeTab.right];\n    if (!tabsWithSettings[currentTab]) {\n      // This is due to conditionaly hiding tabs\n      setActiveTab('right', 0);\n    }\n  }, [activeTab, tabs]);\n\n  // Panel className\n  const panelAdditionalClassName = classNames(\n    'jfReport-settings forSettings f-height',\n    {\n      isIdle: !isRightPanelOpen,\n      otherOpened: isSlidesPanelOpen,\n    },\n  );\n\n  const onClickOutsideForPanel = e => {\n    if (editedElement.substr(0, 2) === 'i_'\n      || panelRef.current.contains(e.target)\n      || panelRef.current.contains(document.activeElement)\n      || Array.from(e.target.classList).some(xClass => exceptionalClasses.includes(xClass))\n      || exceptionalClasses.some(xClass => e.target.closest(`.${xClass}`))\n    ) {\n      return;\n    }\n    setIsRightPanelOpen(false);\n    setActiveElement(null);\n  };\n\n  useEffect(() => {\n    if (isRightPanelOpen) window.addEventListener('click', onClickOutsideForPanel, false);\n    return () => {\n      window.removeEventListener('click', onClickOutsideForPanel, false);\n    };\n  }, [isRightPanelOpen]);\n\n  return (\n    <>\n      <Panel\n        ref={panelRef}\n        additionalClassName={panelAdditionalClassName}\n      >\n        {isSlidesPanelOpen ? null : <RightPanelToggler />}\n        <div className=\"toolItemWrapper f-height d-flex dir-col\">\n          <Section title={title}>\n            <Tabs\n              panel=\"right\"\n              tabs={tabs}\n            />\n            <Settings\n              key={selectedItem.id}\n              element={element}\n              item={selectedItem}\n              itemAccessor={itemAccessor}\n              onChange={updateFunc}\n              settings={tabsWithSettings}\n              tabs={tabs}\n            />\n          </Section>\n        </div>\n      </Panel>\n    </>\n  );\n};\n\nRightPanel.propTypes = {\n  itemAccessor: PropTypes.func,\n  onItemChange: PropTypes.func,\n  onPageChange: PropTypes.func,\n  onSettingChange: PropTypes.func,\n  pages: PropTypes.arrayOf(\n    PropTypes.shape({}),\n  ),\n};\n\nRightPanel.defaultProps = {\n  itemAccessor: () => { },\n  onItemChange: () => { },\n  onPageChange: () => { },\n  onSettingChange: () => { },\n  pages: [],\n};\n\nexport default memo(RightPanel);\n"],"names":["exceptionalClasses","RightPanel","itemAccessor","onItemChange","onPageChange","onSettingChange","pages","useBuilderContext","activeTab","editedElement","isRightPanelOpen","isSlidesPanelOpen","setActiveElement","setActiveTab","setIsRightPanelOpen","usePropContext","acceptedItems","layoutSettings","settings","panelRef","useRef","useTranslatedTexts","LAYOUT_SETTINGS","PAGE_SETTINGS","SETTINGS","settingMap","i_","details","id","item","findItemById","itemType","title","capitalize","updater","l_","REPORT_SETTINGS_ITEM_TYPE","Layout","p_","backgroundColor","reportBackgroundColor","find","page","PAGE_SETTINGS_ITEM_TYPE","pageItem","Page","map","setting","key","editedEl","editedElId","selectedItem","element","updateFunc","panelConfig","fallback","substr","checkSelectedItem","Object","keys","length","e","tabsWithSettings","getTabsWithSettings","tabs","useEffect","currentTab","right","panelAdditionalClassName","classNames","isIdle","otherOpened","onClickOutsideForPanel","current","contains","target","document","activeElement","Array","from","classList","some","xClass","includes","closest","window","addEventListener","removeEventListener","_jsx","_jsxs","propTypes","PropTypes","func","arrayOf","shape","defaultProps","memo"],"mappings":"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"}
+{"version":3,"file":"RightPanel.js","sources":["../../../../../src/components/Panels/RightPanel/RightPanel.js"],"sourcesContent":["import {\n  memo,\n  useEffect,\n  useRef,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport Panel from '../../Builder/Panel';\nimport Section from '../../Builder/Section';\nimport Layout from '../../../constants/reportSettings';\nimport Page from '../../../constants/pageSettings';\nimport { useBuilderContext } from '../../../utils/builderContext';\nimport { usePropContext } from '../../../utils/propContext';\nimport { findItemById, getTabsWithSettings } from '../../../utils/functions';\nimport { useTranslatedTexts } from '../../../utils/hooks';\nimport {\n  REPORT_SETTINGS_ITEM_TYPE, PAGE_SETTINGS_ITEM_TYPE,\n} from '../../../constants/itemTypes';\nimport Tabs from '../../Builder/Tabs';\nimport Settings from './Settings';\nimport RightPanelToggler from './RightPanelToggler';\n\nconst exceptionalClasses = [\n  'pageSettingSideBtn', 'paneClose', 'paneToggler', 'forZoom', 'jSheetContextMenu',\n];\n\nconst RightPanel = ({\n  itemAccessor,\n  onItemChange,\n  onPageChange,\n  onSettingChange,\n  pages,\n}) => {\n  const {\n    activeTab,\n    editedElement,\n    isRightPanelOpen,\n    isSlidesPanelOpen,\n    setActiveElement,\n    setActiveTab,\n    setIsRightPanelOpen,\n  } = useBuilderContext();\n  const { acceptedItems, settings: layoutSettings } = usePropContext();\n  const panelRef = useRef(null);\n  const translatedTexts = useTranslatedTexts();\n  const settingMap = {\n    i_: {\n      details: id => {\n        const item = findItemById(id, pages);\n        return item;\n      },\n      settings: item => {\n        return acceptedItems[item.itemType];\n      },\n      title: item => {\n        // eslint-disable-next-line max-len\n        return translatedTexts[`${(acceptedItems[item.itemType].title || item.itemType).toLocaleUpperCase()}_SETTINGS`];\n      },\n      updater: onItemChange,\n    },\n    l_: {\n      details: () => {\n        return {\n          ...layoutSettings,\n          id: REPORT_SETTINGS_ITEM_TYPE,\n          itemType: REPORT_SETTINGS_ITEM_TYPE,\n        };\n      },\n      settings: () => {\n        return acceptedItems[REPORT_SETTINGS_ITEM_TYPE] || Layout;\n      },\n      title: () => translatedTexts.LAYOUT_SETTINGS,\n      updater: onSettingChange,\n    },\n    p_: {\n      details: id => {\n        return {\n          backgroundColor: layoutSettings.reportBackgroundColor,\n          ...pages.find(page => page.id === id),\n          itemType: PAGE_SETTINGS_ITEM_TYPE,\n        };\n      },\n      settings: () => {\n        const pageItem = acceptedItems[PAGE_SETTINGS_ITEM_TYPE] || Page;\n        return {\n          ...pageItem,\n          settings: pageItem.settings.map(setting => {\n            if (setting.key === 'pageLayer') {\n              return { ...setting, setActiveElement, updater: onItemChange };\n            }\n            return setting;\n          }) || Page.settings,\n        };\n      },\n      title: () => translatedTexts.PAGE_SETTINGS,\n      updater: onPageChange,\n    },\n  };\n\n  let editedEl;\n  let editedElId;\n  let selectedItem;\n  let element;\n  let updateFunc;\n  let title;\n\n  const panelConfig = () => {\n    selectedItem = editedEl.details(editedElId);\n    element = editedEl.settings(selectedItem);\n    updateFunc = editedEl.updater;\n    title = editedEl.title(selectedItem);\n  };\n\n  const fallback = () => {\n    setActiveElement(null);\n    editedEl = settingMap.l_;\n    editedElId = editedElement.substr(2);\n    panelConfig();\n  };\n\n  try {\n    editedEl = settingMap[editedElement.substr(0, 2)];\n    editedElId = editedElement.substr(2);\n    const checkSelectedItem = editedEl.details(editedElId);\n    if (Object.keys(checkSelectedItem).length === 0) {\n      fallback();\n    } else {\n      panelConfig();\n    }\n  } catch (e) {\n    fallback();\n  }\n\n  // Tabs\n  const tabsWithSettings = getTabsWithSettings(element, selectedItem, itemAccessor);\n  const tabs = Object.keys(tabsWithSettings);\n\n  useEffect(() => {\n    const currentTab = tabs[activeTab.right];\n    if (!tabsWithSettings[currentTab]) {\n      // This is due to conditionaly hiding tabs\n      setActiveTab('right', 0);\n    }\n  }, [activeTab, tabs]);\n\n  // Panel className\n  const panelAdditionalClassName = classNames(\n    'jfReport-settings forSettings f-height',\n    {\n      isIdle: !isRightPanelOpen,\n      otherOpened: isSlidesPanelOpen,\n    },\n  );\n\n  const onClickOutsideForPanel = e => {\n    if (editedElement.substr(0, 2) === 'i_'\n      || panelRef.current.contains(e.target)\n      || panelRef.current.contains(document.activeElement)\n      || Array.from(e.target.classList).some(xClass => exceptionalClasses.includes(xClass))\n      || exceptionalClasses.some(xClass => e.target.closest(`.${xClass}`))\n    ) {\n      return;\n    }\n    setIsRightPanelOpen(false);\n    setActiveElement(null);\n  };\n\n  useEffect(() => {\n    if (isRightPanelOpen) window.addEventListener('click', onClickOutsideForPanel, false);\n    return () => {\n      window.removeEventListener('click', onClickOutsideForPanel, false);\n    };\n  }, [isRightPanelOpen]);\n\n  return (\n    <>\n      <Panel\n        ref={panelRef}\n        additionalClassName={panelAdditionalClassName}\n      >\n        {isSlidesPanelOpen ? null : <RightPanelToggler />}\n        <div className=\"toolItemWrapper f-height d-flex dir-col\">\n          <Section title={title}>\n            <Tabs\n              panel=\"right\"\n              tabs={tabs}\n            />\n            <Settings\n              key={selectedItem.id}\n              element={element}\n              item={selectedItem}\n              itemAccessor={itemAccessor}\n              onChange={updateFunc}\n              settings={tabsWithSettings}\n              tabs={tabs}\n            />\n          </Section>\n        </div>\n      </Panel>\n    </>\n  );\n};\n\nRightPanel.propTypes = {\n  itemAccessor: PropTypes.func,\n  onItemChange: PropTypes.func,\n  onPageChange: PropTypes.func,\n  onSettingChange: PropTypes.func,\n  pages: PropTypes.arrayOf(\n    PropTypes.shape({}),\n  ),\n};\n\nRightPanel.defaultProps = {\n  itemAccessor: () => { },\n  onItemChange: () => { },\n  onPageChange: () => { },\n  onSettingChange: () => { },\n  pages: [],\n};\n\nexport default memo(RightPanel);\n"],"names":["exceptionalClasses","RightPanel","itemAccessor","onItemChange","onPageChange","onSettingChange","pages","useBuilderContext","activeTab","editedElement","isRightPanelOpen","isSlidesPanelOpen","setActiveElement","setActiveTab","setIsRightPanelOpen","usePropContext","acceptedItems","layoutSettings","settings","panelRef","useRef","translatedTexts","useTranslatedTexts","settingMap","i_","details","id","item","findItemById","itemType","title","toLocaleUpperCase","updater","l_","REPORT_SETTINGS_ITEM_TYPE","Layout","LAYOUT_SETTINGS","p_","backgroundColor","reportBackgroundColor","find","page","PAGE_SETTINGS_ITEM_TYPE","pageItem","Page","map","setting","key","PAGE_SETTINGS","editedEl","editedElId","selectedItem","element","updateFunc","panelConfig","fallback","substr","checkSelectedItem","Object","keys","length","e","tabsWithSettings","getTabsWithSettings","tabs","useEffect","currentTab","right","panelAdditionalClassName","classNames","isIdle","otherOpened","onClickOutsideForPanel","current","contains","target","document","activeElement","Array","from","classList","some","xClass","includes","closest","window","addEventListener","removeEventListener","_jsx","_jsxs","propTypes","PropTypes","func","arrayOf","shape","defaultProps","memo"],"mappings":"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"}

package/lib/esm/components/Settings/PageLayer/LayerItem.js

@@ -2,6 +2,7 @@ import { memo, useCallback } from 'react';
 import { sortableHandle, sortableElement } from 'react-sortable-hoc';
 import classNames from 'classnames';
 import { capitalize, stripHTML } from '../../../utils/string.js';
+import { useTranslatedTexts } from '../../../utils/hooks.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import SvgDrag from '../../../assets/svg/settings/drag.svg.js';
 
@@ -22,6 +23,14 @@ var LayerItem = sortableElement(function (_ref) {
   var id = item.id,
       isVisible = item.isVisible;
   var isVisib = isVisible !== undefined ? isVisible : true;
+
+  var _useTranslatedTexts = useTranslatedTexts(),
+      CHART_ELEMENT = _useTranslatedTexts.CHART_ELEMENT,
+      CLICK_TO_EDIT_TEXT = _useTranslatedTexts.CLICK_TO_EDIT_TEXT,
+      CLIK_TO_EDIT_HEADER = _useTranslatedTexts.CLIK_TO_EDIT_HEADER,
+      PAGE_ELEMENT = _useTranslatedTexts.PAGE_ELEMENT,
+      RECTANGLE = _useTranslatedTexts.RECTANGLE;
+
   var handleItemLock = useCallback(function (_ref2) {
     var target = _ref2.target;
     onItemChange({
@@ -33,22 +42,22 @@ var LayerItem = sortableElement(function (_ref) {
 
   var itemText = function itemText(passedItem) {
     if (passedItem.itemType === 'shapes') {
-      return capitalize(passedItem.shapeType || 'Rectangle');
+      return capitalize(passedItem.shapeType || RECTANGLE);
     }
 
     if (passedItem.itemType === 'chart') {
-      return passedItem.text || 'Chart Element';
+      return passedItem.text || CHART_ELEMENT;
     }
 
     if (passedItem.itemType === 'header') {
-      return passedItem.headerText || 'Click to edit header';
+      return passedItem.headerText || CLIK_TO_EDIT_HEADER;
     }
 
     if (passedItem.itemType === 'text') {
-      return passedItem.value ? stripHTML(passedItem.value) : 'Click to edit text';
+      return passedItem.value ? stripHTML(passedItem.value) : CLICK_TO_EDIT_TEXT;
     }
 
-    return capitalize(passedItem.itemType || 'Page Element');
+    return capitalize(passedItem.itemType || PAGE_ELEMENT);
   };
 
   var content = /*#__PURE__*/jsxs("div", {

package/lib/esm/components/Settings/PageLayer/LayerItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"LayerItem.js","sources":["../../../../../src/components/Settings/PageLayer/LayerItem.js"],"sourcesContent":["import { memo, useCallback } from 'react';\nimport { sortableElement, sortableHandle } from 'react-sortable-hoc';\nimport classNames from 'classnames';\nimport { capitalize, stripHTML } from '../../../utils/string';\nimport * as icons from '../../../utils/icons';\n\nconst DragHandle = sortableHandle(() => (\n  <span className=\"jfReportSelectOption-drag\">\n    <icons.drag className=\"jfReportSVG icon-drag\" />\n  </span>\n));\n\nconst LayerItem = sortableElement(({\n  icon: Icon,\n  item,\n  onItemChange,\n  optionKey,\n  setActiveElement,\n}) => {\n  const { id, isVisible } = item;\n  const isVisib = isVisible !== undefined ? isVisible : true;\n  const handleItemLock = useCallback(({ target }) => {\n    onItemChange({ id }, { isVisible: target.checked });\n  }, [id]);\n\n  const itemText = passedItem => {\n    if (passedItem.itemType === 'shapes') {\n      return capitalize(passedItem.shapeType || 'Rectangle');\n    }\n    if (passedItem.itemType === 'chart') {\n      return passedItem.text || 'Chart Element';\n    }\n    if (passedItem.itemType === 'header') {\n      return passedItem.headerText || 'Click to edit header';\n    }\n    if (passedItem.itemType === 'text') {\n      return passedItem.value ? stripHTML(passedItem.value) : 'Click to edit text';\n    }\n    return capitalize(passedItem.itemType || 'Page Element');\n  };\n  const content = (\n    <div className=\"jfReportSelectOption\">\n      <div className=\"jfReportSelectOption-icon\">\n        <Icon />\n      </div>\n      <div className=\"jfReportSelectOption-text\">\n        {itemText(item)}\n      </div>\n    </div>\n  );\n\n  return (\n    <div\n      className={classNames('jfReportSelectOption', {\n        isSelected: isVisib,\n      })}\n      onClick={() => setActiveElement(id, false)}\n      onKeyDown={() => {}}\n    >\n      <div className=\"jfReportSelectOption-visibility\">\n        <label\n          className=\"jfReportChoice isLight hasNotText\"\n          htmlFor={optionKey}\n        >\n          <input\n            checked={isVisib}\n            className=\"jfReportChoice-input\"\n            data-option-key={optionKey}\n            id={optionKey}\n            onChange={handleItemLock}\n            type=\"checkbox\"\n          />\n          <div className=\"jfReportChoice-labelIcon\">\n            <div className=\"jfReportChoice-label checkbox\" />\n          </div>\n        </label>\n      </div>\n      <div\n        className=\"jfReportSelectOption-name\"\n        // style={{ backgroundColor: option.color }}\n      >\n        <DragHandle />\n        {content}\n      </div>\n    </div>\n  );\n});\n\nexport default memo(LayerItem);\n"],"names":["DragHandle","sortableHandle","_jsx","icons.drag","LayerItem","sortableElement","Icon","icon","item","onItemChange","optionKey","setActiveElement","id","isVisible","isVisib","undefined","handleItemLock","useCallback","target","checked","itemText","passedItem","itemType","capitalize","shapeType","text","headerText","value","stripHTML","content","_jsxs","classNames","isSelected","memo"],"mappings":";;;;;;;AAMA,IAAMA,UAAU,GAAGC,cAAc,CAAC;AAAA,sBAChCC;AAAM,IAAA,SAAS,EAAC,2BAAhB;AAAA,2BACEA,IAACC,OAAD;AAAY,MAAA,SAAS,EAAC;AAAtB;AADF,IADgC;AAAA,CAAD,CAAjC;AAMA,IAAMC,SAAS,GAAGC,eAAe,CAAC,gBAM5B;AAAA,MALEC,IAKF,QALJC,IAKI;AAAA,MAJJC,IAII,QAJJA,IAII;AAAA,MAHJC,YAGI,QAHJA,YAGI;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADJC,gBACI,QADJA,gBACI;AACJ,MAAQC,EAAR,GAA0BJ,IAA1B,CAAQI,EAAR;AAAA,MAAYC,SAAZ,GAA0BL,IAA1B,CAAYK,SAAZ;AACA,MAAMC,OAAO,GAAGD,SAAS,KAAKE,SAAd,GAA0BF,SAA1B,GAAsC,IAAtD;AACA,MAAMG,cAAc,GAAGC,WAAW,CAAC,iBAAgB;AAAA,QAAbC,MAAa,SAAbA,MAAa;AACjDT,IAAAA,YAAY,CAAC;AAAEG,MAAAA,EAAE,EAAFA;AAAF,KAAD,EAAS;AAAEC,MAAAA,SAAS,EAAEK,MAAM,CAACC;AAApB,KAAT,CAAZ;AACD,GAFiC,EAE/B,CAACP,EAAD,CAF+B,CAAlC;;AAIA,MAAMQ,QAAQ,GAAG,SAAXA,QAAW,CAAAC,UAAU,EAAI;AAC7B,QAAIA,UAAU,CAACC,QAAX,KAAwB,QAA5B,EAAsC;AACpC,aAAOC,UAAU,CAACF,UAAU,CAACG,SAAX,IAAwB,WAAzB,CAAjB;AACD;;AACD,QAAIH,UAAU,CAACC,QAAX,KAAwB,OAA5B,EAAqC;AACnC,aAAOD,UAAU,CAACI,IAAX,IAAmB,eAA1B;AACD;;AACD,QAAIJ,UAAU,CAACC,QAAX,KAAwB,QAA5B,EAAsC;AACpC,aAAOD,UAAU,CAACK,UAAX,IAAyB,sBAAhC;AACD;;AACD,QAAIL,UAAU,CAACC,QAAX,KAAwB,MAA5B,EAAoC;AAClC,aAAOD,UAAU,CAACM,KAAX,GAAmBC,SAAS,CAACP,UAAU,CAACM,KAAZ,CAA5B,GAAiD,oBAAxD;AACD;;AACD,WAAOJ,UAAU,CAACF,UAAU,CAACC,QAAX,IAAuB,cAAxB,CAAjB;AACD,GAdD;;AAeA,MAAMO,OAAO,gBACXC;AAAK,IAAA,SAAS,EAAC,sBAAf;AAAA,4BACE5B;AAAK,MAAA,SAAS,EAAC,2BAAf;AAAA,6BACEA,IAAC,IAAD;AADF,MADF,eAIEA;AAAK,MAAA,SAAS,EAAC,2BAAf;AAAA,gBACGkB,QAAQ,CAACZ,IAAD;AADX,MAJF;AAAA,IADF;;AAWA,sBACEsB;AACE,IAAA,SAAS,EAAEC,UAAU,CAAC,sBAAD,EAAyB;AAC5CC,MAAAA,UAAU,EAAElB;AADgC,KAAzB,CADvB;AAIE,IAAA,OAAO,EAAE;AAAA,aAAMH,gBAAgB,CAACC,EAAD,EAAK,KAAL,CAAtB;AAAA,KAJX;AAKE,IAAA,SAAS,EAAE,qBAAM,EALnB;AAAA,4BAOEV;AAAK,MAAA,SAAS,EAAC,iCAAf;AAAA,6BACE4B;AACE,QAAA,SAAS,EAAC,mCADZ;AAEE,QAAA,OAAO,EAAEpB,SAFX;AAAA,gCAIER;AACE,UAAA,OAAO,EAAEY,OADX;AAEE,UAAA,SAAS,EAAC,sBAFZ;AAGE,6BAAiBJ,SAHnB;AAIE,UAAA,EAAE,EAAEA,SAJN;AAKE,UAAA,QAAQ,EAAEM,cALZ;AAME,UAAA,IAAI,EAAC;AANP,UAJF,eAYEd;AAAK,UAAA,SAAS,EAAC,0BAAf;AAAA,iCACEA;AAAK,YAAA,SAAS,EAAC;AAAf;AADF,UAZF;AAAA;AADF,MAPF,eAyBE4B;AACE,MAAA,SAAS,EAAC,2BADZ;AAAA;AAAA,8BAIE5B,IAAC,UAAD,KAJF,EAKG2B,OALH;AAAA,MAzBF;AAAA,IADF;AAmCD,CA1EgC,CAAjC;AA4EA,+BAAeI,IAAI,CAAC7B,SAAD,CAAnB;;;;"}
+{"version":3,"file":"LayerItem.js","sources":["../../../../../src/components/Settings/PageLayer/LayerItem.js"],"sourcesContent":["import { memo, useCallback } from 'react';\nimport { sortableElement, sortableHandle } from 'react-sortable-hoc';\nimport classNames from 'classnames';\nimport { capitalize, stripHTML } from '../../../utils/string';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst DragHandle = sortableHandle(() => (\n  <span className=\"jfReportSelectOption-drag\">\n    <icons.drag className=\"jfReportSVG icon-drag\" />\n  </span>\n));\n\nconst LayerItem = sortableElement(({\n  icon: Icon,\n  item,\n  onItemChange,\n  optionKey,\n  setActiveElement,\n}) => {\n  const { id, isVisible } = item;\n  const isVisib = isVisible !== undefined ? isVisible : true;\n  const {\n    CHART_ELEMENT,\n    CLICK_TO_EDIT_TEXT,\n    CLIK_TO_EDIT_HEADER,\n    PAGE_ELEMENT,\n    RECTANGLE,\n  } = useTranslatedTexts();\n\n  const handleItemLock = useCallback(({ target }) => {\n    onItemChange({ id }, { isVisible: target.checked });\n  }, [id]);\n\n  const itemText = passedItem => {\n    if (passedItem.itemType === 'shapes') {\n      return capitalize(passedItem.shapeType || RECTANGLE);\n    }\n    if (passedItem.itemType === 'chart') {\n      return passedItem.text || CHART_ELEMENT;\n    }\n    if (passedItem.itemType === 'header') {\n      return passedItem.headerText || CLIK_TO_EDIT_HEADER;\n    }\n    if (passedItem.itemType === 'text') {\n      return passedItem.value ? stripHTML(passedItem.value) : CLICK_TO_EDIT_TEXT;\n    }\n    return capitalize(passedItem.itemType || PAGE_ELEMENT);\n  };\n  const content = (\n    <div className=\"jfReportSelectOption\">\n      <div className=\"jfReportSelectOption-icon\">\n        <Icon />\n      </div>\n      <div className=\"jfReportSelectOption-text\">\n        {itemText(item)}\n      </div>\n    </div>\n  );\n\n  return (\n    <div\n      className={classNames('jfReportSelectOption', {\n        isSelected: isVisib,\n      })}\n      onClick={() => setActiveElement(id, false)}\n      onKeyDown={() => {}}\n    >\n      <div className=\"jfReportSelectOption-visibility\">\n        <label\n          className=\"jfReportChoice isLight hasNotText\"\n          htmlFor={optionKey}\n        >\n          <input\n            checked={isVisib}\n            className=\"jfReportChoice-input\"\n            data-option-key={optionKey}\n            id={optionKey}\n            onChange={handleItemLock}\n            type=\"checkbox\"\n          />\n          <div className=\"jfReportChoice-labelIcon\">\n            <div className=\"jfReportChoice-label checkbox\" />\n          </div>\n        </label>\n      </div>\n      <div\n        className=\"jfReportSelectOption-name\"\n        // style={{ backgroundColor: option.color }}\n      >\n        <DragHandle />\n        {content}\n      </div>\n    </div>\n  );\n});\n\nexport default memo(LayerItem);\n"],"names":["DragHandle","sortableHandle","_jsx","icons.drag","LayerItem","sortableElement","Icon","icon","item","onItemChange","optionKey","setActiveElement","id","isVisible","isVisib","undefined","useTranslatedTexts","CHART_ELEMENT","CLICK_TO_EDIT_TEXT","CLIK_TO_EDIT_HEADER","PAGE_ELEMENT","RECTANGLE","handleItemLock","useCallback","target","checked","itemText","passedItem","itemType","capitalize","shapeType","text","headerText","value","stripHTML","content","_jsxs","classNames","isSelected","memo"],"mappings":"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"}

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

@@ -119,14 +119,13 @@ 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() {}
 };

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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,IAAMA,IAAI,GAAGC,UAAU,CAACC,KAAX,CAAiBC,MAAjB,CAAwB,wBAAxB,CAAb;AACAH,IAAI,CAACI,SAAL,GAAiBC,SAAS,CAACC,GAAV,CAAc,UAAAC,CAAC;AAAA,mBAAOA,CAAP;AAAA,CAAf,CAAjB;AACAN,UAAU,CAACC,KAAX,CAAiBM,QAAjB,CAA0BR,IAA1B,EAAgC,IAAhC;;IAEMS;;;;;AACJ,uBAAYC,KAAZ,EAAmB;AAAA;;AAAA;;AACjB,8BAAMA,KAAN;;AADiB,kEAkBL,YAAM;AAClB,wBAAqD,MAAKA,KAA1D;AAAA,UAAQC,OAAR,eAAQA,OAAR;AAAA,UAAiBC,UAAjB,eAAiBA,UAAjB;AAAA,UAA6BC,mBAA7B,eAA6BA,mBAA7B;AACAA,MAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACAD,MAAAA,UAAU,CAACD,OAAD,CAAV;AACD,KAtBkB;;AAAA,oEAwBH,UAAAG,CAAC,EAAI;AACnBA,MAAAA,CAAC,CAACC,eAAF;;AACA,UAAID,CAAC,CAACE,OAAF,KAAc,EAAlB,EAAsB;AACpB,cAAKC,WAAL;AACD;AACF,KA7BkB;;AAAA,uEA+BA,UAAAC,KAAK,EAAI;AAC1B,UAAQC,UAAR,GAAuB,MAAKT,KAA5B,CAAQS,UAAR;AACAA,MAAAA,UAAU,CAACC,SAAS,CAACC,QAAV,CAAmBH,KAAnB,CAAD,CAAV;AACD,KAlCkB;;AAGjB,UAAKI,KAAL,gBAAaC,KAAK,CAACC,SAAN,EAAb;AAHiB;AAIlB;;;;WAED,6BAAoB;AAClB,UAAI,KAAKF,KAAL,CAAWG,OAAX,KAAuB,IAA3B,EAAiC;AAC/B,YAAQd,OAAR,GAAoB,KAAKD,KAAzB,CAAQC,OAAR;AACA,YAAMe,MAAM,GAAG,KAAKJ,KAAL,CAAWG,OAAX,CAAmBE,SAAnB,EAAf;AACAD,QAAAA,MAAM,CAACE,YAAP,CAAoB,CAApB,EAAuBjB,OAAO,CAACkB,MAA/B;AACD;AACF;;;WAED,gCAAuB;AACrB,WAAKZ,WAAL;AACD;;;WAoBD,kBAAS;AACP,yBAAiC,KAAKP,KAAtC;AAAA,UAAQC,OAAR,gBAAQA,OAAR;AAAA,UAAiBmB,WAAjB,gBAAiBA,WAAjB;AAEA,0BACEC;AACE,QAAA,SAAS,EAAC,OADZ;AAEE,QAAA,SAAS,EAAE,KAAKC,aAFlB;AAAA,+BAIED,IAAC,UAAD;AACE,UAAA,GAAG,EAAE,KAAKT,KADZ;AAEE,UAAA,OAAO,EAAEb,WAAW,CAACwB,OAFvB;AAGE,UAAA,OAAO,EAAExB,WAAW,CAACyB,OAHvB;AAIE,UAAA,QAAQ,EAAE,KAAKC,gBAJjB;AAKE,UAAA,WAAW,EAAEL,WALf;AAME,UAAA,kBAAkB,MANpB;AAOE,UAAA,KAAK,EAAEnB;AAPT;AAJF,QADF;AAgBD;;;;EAxDuBY,KAAK,CAACa;;AA2DhC3B,WAAW,CAACyB,OAAZ,GAAsBA,OAAtB;AACAzB,WAAW,CAACwB,OAAZ,GAAsBA,OAAtB;AAEAxB,WAAW,CAAC4B,SAAZ,GAAwB;AACtB1B,EAAAA,OAAO,EAAE2B,SAAS,CAACC,MADG;AAEtB3B,EAAAA,UAAU,EAAE0B,SAAS,CAACE,IAFA;AAGtBV,EAAAA,WAAW,EAAEQ,SAAS,CAACC,MAHD;AAItBpB,EAAAA,UAAU,EAAEmB,SAAS,CAACE,IAJA;AAKtB3B,EAAAA,mBAAmB,EAAEyB,SAAS,CAACE;AALT,CAAxB;AAQA/B,WAAW,CAACgC,YAAZ,GAA2B;AACzB9B,EAAAA,OAAO,EAAE,EADgB;AAEzBC,EAAAA,UAAU,EAAE,sBAAM,EAFO;AAGzBkB,EAAAA,WAAW,EAAE,oBAHY;AAIzBX,EAAAA,UAAU,EAAE,sBAAM,EAJO;AAKzBN,EAAAA,mBAAmB,EAAE,+BAAM;AALF,CAA3B;;;;"}
+{"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.isRequired,\n  setContent: PropTypes.func,\n  setIsTextEditorOpen: PropTypes.func,\n};\n\nQuillEditor.defaultProps = {\n  content: '',\n  handleSave: () => {},\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","isRequired","defaultProps"],"mappings":"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"}

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

@@ -64,14 +64,13 @@ TextEditor.propTypes = {
   handleSave: PropTypes.func,
   isLocked: PropTypes.bool,
   isSelected: PropTypes.bool,
-  placeholder: PropTypes.string
+  placeholder: PropTypes.string.isRequired
 };
 TextEditor.defaultProps = {
   content: '',
   handleSave: function handleSave() {},
   isLocked: false,
-  isSelected: false,
-  placeholder: 'Click to edit text'
+  isSelected: false
 };
 
 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 { 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.isRequired,\n};\n\nTextEditor.defaultProps = {\n  content: '',\n  handleSave: () => {},\n  isLocked: false,\n  isSelected: false,\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","isRequired","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,MAAV,CAAiBG;AALT,CAAvB;AAQA9B,UAAU,CAAC+B,YAAX,GAA0B;AACxB9B,EAAAA,OAAO,EAAE,EADe;AAExBC,EAAAA,UAAU,EAAE,sBAAM,EAFM;AAGxBC,EAAAA,QAAQ,EAAE,KAHc;AAIxBC,EAAAA,UAAU,EAAE;AAJY,CAA1B;;;;"}

package/lib/esm/constants/texts.js

@@ -10,6 +10,10 @@ var ALL_TEXTS = {
   ADD_LINK: 'ADD LINK',
   ADD_NEW_PAGE: 'ADD SLIDE',
   BACKGROUND_COLOR: 'Background Color',
+  CHART_ELEMENT: 'Chart Element',
+  CHART_SETTINGS: 'Chart Settings',
+  CLICK_TO_EDIT_HEADER: 'Click to edit header',
+  CLICK_TO_EDIT_TEXT: 'Click to edit text',
   DELETE: 'Delete',
   DELETE_ITEM: 'Delete Item',
   DUPLICATE_ITEM: 'Duplicate Item',
@@ -18,7 +22,11 @@ var ALL_TEXTS = {
   FIT_TO_PAGE: 'Fit to Slide',
   FIT_TO_SCENE: 'Fit to Screen',
   GENERAL: 'GENERAL',
+  GRID_SETTINGS: 'Grid Settings',
+  HEADER_SETTINGS: 'Header Settings',
   HEIGHT: 'Height',
+  ICON_SETTINGS: 'Icon Settings',
+  IMAGE_SETTINGS: 'Image Settings',
   ITEM_SETTINGS: 'Item Settings',
   LAYERS: 'Layers',
   LAYOUT_SETTINGS: 'Layout Settings',
@@ -32,13 +40,16 @@ var ALL_TEXTS = {
   NO_ELEMENT_IN_PAGE: 'There is no element on this slide. You can add a new element from side menu.',
   NO_RESULT: 'No result was found',
   ORIGINAL_SIZE: 'Original Size',
+  PAGE_ELEMENT: 'Page Element',
   PAGE_SETTINGS: 'Slide Settings',
   PAGE_STYLE: 'Slide Style',
+  RECTANGLE: 'Rectangle',
   REMOVE_PAGE: 'Remove Slide',
   SEARCH: 'Search',
   SETTINGS: 'Settings',
   SHOW_ALL: 'Show All',
   SLIDES: 'Slides',
+  TEXT_SETTINGS: 'Text Settings',
   TOGGLE_OFF: 'OFF',
   TOGGLE_ON: 'ON',
   UNLOCK_ITEM: 'Unlock Item',

package/lib/esm/constants/texts.js.map

@@ -1 +1 @@
-{"version":3,"file":"texts.js","sources":["../../../src/constants/texts.js"],"sourcesContent":["/* eslint-disable max-len */\nconst ALL_TEXTS = {\n  ADD_ELEMENT: 'Add Element',\n  ADD_LINK: 'ADD LINK',\n  ADD_NEW_PAGE: 'ADD SLIDE',\n  BACKGROUND_COLOR: 'Background Color',\n  DELETE: 'Delete',\n  DELETE_ITEM: 'Delete Item',\n  DUPLICATE_ITEM: 'Duplicate Item',\n  DUPLICATE_PAGE: 'Duplicate Slide',\n  ELEMENTS: 'Elements',\n  FIT_TO_PAGE: 'Fit to Slide',\n  FIT_TO_SCENE: 'Fit to Screen',\n  GENERAL: 'GENERAL',\n  HEIGHT: 'Height',\n  ITEM_SETTINGS: 'Item Settings',\n  LAYERS: 'Layers',\n  LAYOUT_SETTINGS: 'Layout Settings',\n  LOCK_ITEM: 'Lock Item',\n  MOVE_BACKWARDS: 'Move Backwards',\n  MOVE_FORWARDS: 'Move Forwards',\n  MOVE_PAGE_DOWNWARDS: 'Move Slide Downwards',\n  MOVE_PAGE_UPWARDS: 'Move Slide Upwards',\n  MOVE_TO_BACK: 'Move to Back',\n  MOVE_TO_FRONT: 'Move to Front',\n  NO_ELEMENT_IN_PAGE: 'There is no element on this slide. You can add a new element from side menu.',\n  NO_RESULT: 'No result was found',\n  ORIGINAL_SIZE: 'Original Size',\n  PAGE_SETTINGS: 'Slide Settings',\n  PAGE_STYLE: 'Slide Style',\n  REMOVE_PAGE: 'Remove Slide',\n  SEARCH: 'Search',\n  SETTINGS: 'Settings',\n  SHOW_ALL: 'Show All',\n  SLIDES: 'Slides',\n  TOGGLE_OFF: 'OFF',\n  TOGGLE_ON: 'ON',\n  UNLOCK_ITEM: 'Unlock Item',\n  WIDTH: 'Width',\n  ZOOM_IN: 'Zoom In',\n  ZOOM_OUT: 'Zoom Out',\n};\n\nclass ModuleTexts {\n  constructor(allTexts) {\n    this._texts = allTexts;\n  }\n\n  get Texts() {\n    return this._texts;\n  }\n\n  setTexts(allTexts) {\n    this._texts = allTexts;\n  }\n}\n\nexport const SharingTextsModule = new ModuleTexts(ALL_TEXTS);\nexport default ALL_TEXTS;\n"],"names":["ALL_TEXTS","ADD_ELEMENT","ADD_LINK","ADD_NEW_PAGE","BACKGROUND_COLOR","DELETE","DELETE_ITEM","DUPLICATE_ITEM","DUPLICATE_PAGE","ELEMENTS","FIT_TO_PAGE","FIT_TO_SCENE","GENERAL","HEIGHT","ITEM_SETTINGS","LAYERS","LAYOUT_SETTINGS","LOCK_ITEM","MOVE_BACKWARDS","MOVE_FORWARDS","MOVE_PAGE_DOWNWARDS","MOVE_PAGE_UPWARDS","MOVE_TO_BACK","MOVE_TO_FRONT","NO_ELEMENT_IN_PAGE","NO_RESULT","ORIGINAL_SIZE","PAGE_SETTINGS","PAGE_STYLE","REMOVE_PAGE","SEARCH","SETTINGS","SHOW_ALL","SLIDES","TOGGLE_OFF","TOGGLE_ON","UNLOCK_ITEM","WIDTH","ZOOM_IN","ZOOM_OUT","ModuleTexts","allTexts","_texts","SharingTextsModule"],"mappings":";;;;;;AAAA;IACMA,SAAS,GAAG;AAChBC,EAAAA,WAAW,EAAE,aADG;AAEhBC,EAAAA,QAAQ,EAAE,UAFM;AAGhBC,EAAAA,YAAY,EAAE,WAHE;AAIhBC,EAAAA,gBAAgB,EAAE,kBAJF;AAKhBC,EAAAA,MAAM,EAAE,QALQ;AAMhBC,EAAAA,WAAW,EAAE,aANG;AAOhBC,EAAAA,cAAc,EAAE,gBAPA;AAQhBC,EAAAA,cAAc,EAAE,iBARA;AAShBC,EAAAA,QAAQ,EAAE,UATM;AAUhBC,EAAAA,WAAW,EAAE,cAVG;AAWhBC,EAAAA,YAAY,EAAE,eAXE;AAYhBC,EAAAA,OAAO,EAAE,SAZO;AAahBC,EAAAA,MAAM,EAAE,QAbQ;AAchBC,EAAAA,aAAa,EAAE,eAdC;AAehBC,EAAAA,MAAM,EAAE,QAfQ;AAgBhBC,EAAAA,eAAe,EAAE,iBAhBD;AAiBhBC,EAAAA,SAAS,EAAE,WAjBK;AAkBhBC,EAAAA,cAAc,EAAE,gBAlBA;AAmBhBC,EAAAA,aAAa,EAAE,eAnBC;AAoBhBC,EAAAA,mBAAmB,EAAE,sBApBL;AAqBhBC,EAAAA,iBAAiB,EAAE,oBArBH;AAsBhBC,EAAAA,YAAY,EAAE,cAtBE;AAuBhBC,EAAAA,aAAa,EAAE,eAvBC;AAwBhBC,EAAAA,kBAAkB,EAAE,8EAxBJ;AAyBhBC,EAAAA,SAAS,EAAE,qBAzBK;AA0BhBC,EAAAA,aAAa,EAAE,eA1BC;AA2BhBC,EAAAA,aAAa,EAAE,gBA3BC;AA4BhBC,EAAAA,UAAU,EAAE,aA5BI;AA6BhBC,EAAAA,WAAW,EAAE,cA7BG;AA8BhBC,EAAAA,MAAM,EAAE,QA9BQ;AA+BhBC,EAAAA,QAAQ,EAAE,UA/BM;AAgChBC,EAAAA,QAAQ,EAAE,UAhCM;AAiChBC,EAAAA,MAAM,EAAE,QAjCQ;AAkChBC,EAAAA,UAAU,EAAE,KAlCI;AAmChBC,EAAAA,SAAS,EAAE,IAnCK;AAoChBC,EAAAA,WAAW,EAAE,aApCG;AAqChBC,EAAAA,KAAK,EAAE,OArCS;AAsChBC,EAAAA,OAAO,EAAE,SAtCO;AAuChBC,EAAAA,QAAQ,EAAE;AAvCM;;IA0CZC;AACJ,uBAAYC,QAAZ,EAAsB;AAAA;;AACpB,SAAKC,MAAL,GAAcD,QAAd;AACD;;;;SAED,eAAY;AACV,aAAO,KAAKC,MAAZ;AACD;;;WAED,kBAASD,QAAT,EAAmB;AACjB,WAAKC,MAAL,GAAcD,QAAd;AACD;;;;;;IAGUE,kBAAkB,GAAG,IAAIH,WAAJ,CAAgBxC,SAAhB;;;;;"}
+{"version":3,"file":"texts.js","sources":["../../../src/constants/texts.js"],"sourcesContent":["/* eslint-disable max-len */\nconst ALL_TEXTS = {\n  ADD_ELEMENT: 'Add Element',\n  ADD_LINK: 'ADD LINK',\n  ADD_NEW_PAGE: 'ADD SLIDE',\n  BACKGROUND_COLOR: 'Background Color',\n  CHART_ELEMENT: 'Chart Element',\n  CHART_SETTINGS: 'Chart Settings',\n  CLICK_TO_EDIT_HEADER: 'Click to edit header',\n  CLICK_TO_EDIT_TEXT: 'Click to edit text',\n  DELETE: 'Delete',\n  DELETE_ITEM: 'Delete Item',\n  DUPLICATE_ITEM: 'Duplicate Item',\n  DUPLICATE_PAGE: 'Duplicate Slide',\n  ELEMENTS: 'Elements',\n  FIT_TO_PAGE: 'Fit to Slide',\n  FIT_TO_SCENE: 'Fit to Screen',\n  GENERAL: 'GENERAL',\n  GRID_SETTINGS: 'Grid Settings',\n  HEADER_SETTINGS: 'Header Settings',\n  HEIGHT: 'Height',\n  ICON_SETTINGS: 'Icon Settings',\n  IMAGE_SETTINGS: 'Image Settings',\n  ITEM_SETTINGS: 'Item Settings',\n  LAYERS: 'Layers',\n  LAYOUT_SETTINGS: 'Layout Settings',\n  LOCK_ITEM: 'Lock Item',\n  MOVE_BACKWARDS: 'Move Backwards',\n  MOVE_FORWARDS: 'Move Forwards',\n  MOVE_PAGE_DOWNWARDS: 'Move Slide Downwards',\n  MOVE_PAGE_UPWARDS: 'Move Slide Upwards',\n  MOVE_TO_BACK: 'Move to Back',\n  MOVE_TO_FRONT: 'Move to Front',\n  NO_ELEMENT_IN_PAGE: 'There is no element on this slide. You can add a new element from side menu.',\n  NO_RESULT: 'No result was found',\n  ORIGINAL_SIZE: 'Original Size',\n  PAGE_ELEMENT: 'Page Element',\n  PAGE_SETTINGS: 'Slide Settings',\n  PAGE_STYLE: 'Slide Style',\n  RECTANGLE: 'Rectangle',\n  REMOVE_PAGE: 'Remove Slide',\n  SEARCH: 'Search',\n  SETTINGS: 'Settings',\n  SHOW_ALL: 'Show All',\n  SLIDES: 'Slides',\n  TEXT_SETTINGS: 'Text Settings',\n  TOGGLE_OFF: 'OFF',\n  TOGGLE_ON: 'ON',\n  UNLOCK_ITEM: 'Unlock Item',\n  WIDTH: 'Width',\n  ZOOM_IN: 'Zoom In',\n  ZOOM_OUT: 'Zoom Out',\n};\n\nclass ModuleTexts {\n  constructor(allTexts) {\n    this._texts = allTexts;\n  }\n\n  get Texts() {\n    return this._texts;\n  }\n\n  setTexts(allTexts) {\n    this._texts = allTexts;\n  }\n}\n\nexport const SharingTextsModule = new ModuleTexts(ALL_TEXTS);\nexport default ALL_TEXTS;\n"],"names":["ALL_TEXTS","ADD_ELEMENT","ADD_LINK","ADD_NEW_PAGE","BACKGROUND_COLOR","CHART_ELEMENT","CHART_SETTINGS","CLICK_TO_EDIT_HEADER","CLICK_TO_EDIT_TEXT","DELETE","DELETE_ITEM","DUPLICATE_ITEM","DUPLICATE_PAGE","ELEMENTS","FIT_TO_PAGE","FIT_TO_SCENE","GENERAL","GRID_SETTINGS","HEADER_SETTINGS","HEIGHT","ICON_SETTINGS","IMAGE_SETTINGS","ITEM_SETTINGS","LAYERS","LAYOUT_SETTINGS","LOCK_ITEM","MOVE_BACKWARDS","MOVE_FORWARDS","MOVE_PAGE_DOWNWARDS","MOVE_PAGE_UPWARDS","MOVE_TO_BACK","MOVE_TO_FRONT","NO_ELEMENT_IN_PAGE","NO_RESULT","ORIGINAL_SIZE","PAGE_ELEMENT","PAGE_SETTINGS","PAGE_STYLE","RECTANGLE","REMOVE_PAGE","SEARCH","SETTINGS","SHOW_ALL","SLIDES","TEXT_SETTINGS","TOGGLE_OFF","TOGGLE_ON","UNLOCK_ITEM","WIDTH","ZOOM_IN","ZOOM_OUT","ModuleTexts","allTexts","_texts","SharingTextsModule"],"mappings":";;;;;;AAAA;IACMA,SAAS,GAAG;AAChBC,EAAAA,WAAW,EAAE,aADG;AAEhBC,EAAAA,QAAQ,EAAE,UAFM;AAGhBC,EAAAA,YAAY,EAAE,WAHE;AAIhBC,EAAAA,gBAAgB,EAAE,kBAJF;AAKhBC,EAAAA,aAAa,EAAE,eALC;AAMhBC,EAAAA,cAAc,EAAE,gBANA;AAOhBC,EAAAA,oBAAoB,EAAE,sBAPN;AAQhBC,EAAAA,kBAAkB,EAAE,oBARJ;AAShBC,EAAAA,MAAM,EAAE,QATQ;AAUhBC,EAAAA,WAAW,EAAE,aAVG;AAWhBC,EAAAA,cAAc,EAAE,gBAXA;AAYhBC,EAAAA,cAAc,EAAE,iBAZA;AAahBC,EAAAA,QAAQ,EAAE,UAbM;AAchBC,EAAAA,WAAW,EAAE,cAdG;AAehBC,EAAAA,YAAY,EAAE,eAfE;AAgBhBC,EAAAA,OAAO,EAAE,SAhBO;AAiBhBC,EAAAA,aAAa,EAAE,eAjBC;AAkBhBC,EAAAA,eAAe,EAAE,iBAlBD;AAmBhBC,EAAAA,MAAM,EAAE,QAnBQ;AAoBhBC,EAAAA,aAAa,EAAE,eApBC;AAqBhBC,EAAAA,cAAc,EAAE,gBArBA;AAsBhBC,EAAAA,aAAa,EAAE,eAtBC;AAuBhBC,EAAAA,MAAM,EAAE,QAvBQ;AAwBhBC,EAAAA,eAAe,EAAE,iBAxBD;AAyBhBC,EAAAA,SAAS,EAAE,WAzBK;AA0BhBC,EAAAA,cAAc,EAAE,gBA1BA;AA2BhBC,EAAAA,aAAa,EAAE,eA3BC;AA4BhBC,EAAAA,mBAAmB,EAAE,sBA5BL;AA6BhBC,EAAAA,iBAAiB,EAAE,oBA7BH;AA8BhBC,EAAAA,YAAY,EAAE,cA9BE;AA+BhBC,EAAAA,aAAa,EAAE,eA/BC;AAgChBC,EAAAA,kBAAkB,EAAE,8EAhCJ;AAiChBC,EAAAA,SAAS,EAAE,qBAjCK;AAkChBC,EAAAA,aAAa,EAAE,eAlCC;AAmChBC,EAAAA,YAAY,EAAE,cAnCE;AAoChBC,EAAAA,aAAa,EAAE,gBApCC;AAqChBC,EAAAA,UAAU,EAAE,aArCI;AAsChBC,EAAAA,SAAS,EAAE,WAtCK;AAuChBC,EAAAA,WAAW,EAAE,cAvCG;AAwChBC,EAAAA,MAAM,EAAE,QAxCQ;AAyChBC,EAAAA,QAAQ,EAAE,UAzCM;AA0ChBC,EAAAA,QAAQ,EAAE,UA1CM;AA2ChBC,EAAAA,MAAM,EAAE,QA3CQ;AA4ChBC,EAAAA,aAAa,EAAE,eA5CC;AA6ChBC,EAAAA,UAAU,EAAE,KA7CI;AA8ChBC,EAAAA,SAAS,EAAE,IA9CK;AA+ChBC,EAAAA,WAAW,EAAE,aA/CG;AAgDhBC,EAAAA,KAAK,EAAE,OAhDS;AAiDhBC,EAAAA,OAAO,EAAE,SAjDO;AAkDhBC,EAAAA,QAAQ,EAAE;AAlDM;;IAqDZC;AACJ,uBAAYC,QAAZ,EAAsB;AAAA;;AACpB,SAAKC,MAAL,GAAcD,QAAd;AACD;;;;SAED,eAAY;AACV,aAAO,KAAKC,MAAZ;AACD;;;WAED,kBAASD,QAAT,EAAmB;AACjB,WAAKC,MAAL,GAAcD,QAAd;AACD;;;;;;IAGUE,kBAAkB,GAAG,IAAIH,WAAJ,CAAgBnD,SAAhB;;;;;"}

package/lib/esm/styles/_jfSearchInput.scss

@@ -19,11 +19,11 @@
       border-radius: 0 15px 15px 0;
 
       &.search-icon {
-        left: 4px;
+        left: 8px;
       }
 
       &.search-delete {
-        right: 4px;
+        right: 8px;
 
         &:before {
           content: "";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jotforminc/dnd-builder",
-  "version": "2.5.7",
+  "version": "2.5.9",
   "files": [
     "lib"
   ],