@jotforminc/dnd-builder 2.5.8 → 2.5.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +10 -0
- package/lib/cjs/components/Builder/SearchInput.js +6 -1
- package/lib/cjs/components/Builder/SearchInput.js.map +1 -1
- package/lib/cjs/components/Elements/Image.js +1 -1
- package/lib/cjs/components/Elements/Image.js.map +1 -1
- package/lib/cjs/styles/_jfSearchInput.scss +2 -2
- package/lib/esm/components/Builder/SearchInput.js +6 -1
- package/lib/esm/components/Builder/SearchInput.js.map +1 -1
- package/lib/esm/components/Elements/Image.js +1 -1
- package/lib/esm/components/Elements/Image.js.map +1 -1
- package/lib/esm/styles/_jfSearchInput.scss +2 -2
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
### [2.5.9](https://github.com/jotform/dnd-builder/compare/v2.5.6...v2.5.9) (2023-08-23)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
* **dnd-builder:** missing translations ([54d8fef](https://github.com/jotform/dnd-builder/commit/54d8feff7ad433504e7b6841ccb5c2e3eeefbb4c))
|
|
11
|
+
* **dnd-builder:** missing translations and search bar icon spacing ([c6a44b7](https://github.com/jotform/dnd-builder/commit/c6a44b79ce89758fcba239688202a4ba0ad1857b))
|
|
12
|
+
* **dnd-builder:** replace images with cdn ([4ac3bb3](https://github.com/jotform/dnd-builder/commit/4ac3bb35ca283ff50a42f8a9e6ce86fd45ca4259))
|
|
13
|
+
* **dnd-builder:** replace images with cdn ([f7d1e4c](https://github.com/jotform/dnd-builder/commit/f7d1e4c1e1f2c9dd76f19528a9a7dc2b5bf24e74))
|
|
14
|
+
|
|
5
15
|
### [2.5.8](https://github.com/jotform/dnd-builder/compare/v2.5.6...v2.5.8) (2023-07-26)
|
|
6
16
|
|
|
7
17
|
|
|
@@ -8,6 +8,7 @@ var PropTypes = require('prop-types');
|
|
|
8
8
|
var Fuse = require('fuse.js/dist/fuse.common');
|
|
9
9
|
var search = require('../../assets/search.svg.js');
|
|
10
10
|
var close = require('../../assets/svg/close.svg.js');
|
|
11
|
+
var hooks = require('../../utils/hooks.js');
|
|
11
12
|
var jsxRuntime = require('react/jsx-runtime');
|
|
12
13
|
|
|
13
14
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -31,6 +32,10 @@ var SearchInput = function SearchInput(_ref) {
|
|
|
31
32
|
var elements = _ref.elements,
|
|
32
33
|
searchKeys = _ref.searchKeys,
|
|
33
34
|
setElements = _ref.setElements;
|
|
35
|
+
|
|
36
|
+
var _useTranslatedTexts = hooks.useTranslatedTexts(),
|
|
37
|
+
SEARCH = _useTranslatedTexts.SEARCH;
|
|
38
|
+
|
|
34
39
|
var searchInputRef = React.useRef(null);
|
|
35
40
|
|
|
36
41
|
var _useState = React.useState(''),
|
|
@@ -89,7 +94,7 @@ var SearchInput = function SearchInput(_ref) {
|
|
|
89
94
|
className: "js-searchInput section-search-input",
|
|
90
95
|
onChange: onSearchChange,
|
|
91
96
|
onKeyDown: handleKeyDown,
|
|
92
|
-
placeholder:
|
|
97
|
+
placeholder: SEARCH,
|
|
93
98
|
type: "text",
|
|
94
99
|
value: searchValue
|
|
95
100
|
}), /*#__PURE__*/jsxRuntime.jsx("button", {
|
|
@@ -1 +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
|
|
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';\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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"}
|
|
@@ -1 +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
|
|
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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"}
|
|
@@ -6,6 +6,7 @@ import PropTypes from 'prop-types';
|
|
|
6
6
|
import Fuse from 'fuse.js/dist/fuse.common';
|
|
7
7
|
import SvgSearch from '../../assets/search.svg.js';
|
|
8
8
|
import SvgClose from '../../assets/svg/close.svg.js';
|
|
9
|
+
import { useTranslatedTexts } from '../../utils/hooks.js';
|
|
9
10
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
10
11
|
|
|
11
12
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
@@ -24,6 +25,10 @@ var SearchInput = function SearchInput(_ref) {
|
|
|
24
25
|
var elements = _ref.elements,
|
|
25
26
|
searchKeys = _ref.searchKeys,
|
|
26
27
|
setElements = _ref.setElements;
|
|
28
|
+
|
|
29
|
+
var _useTranslatedTexts = useTranslatedTexts(),
|
|
30
|
+
SEARCH = _useTranslatedTexts.SEARCH;
|
|
31
|
+
|
|
27
32
|
var searchInputRef = useRef(null);
|
|
28
33
|
|
|
29
34
|
var _useState = useState(''),
|
|
@@ -82,7 +87,7 @@ var SearchInput = function SearchInput(_ref) {
|
|
|
82
87
|
className: "js-searchInput section-search-input",
|
|
83
88
|
onChange: onSearchChange,
|
|
84
89
|
onKeyDown: handleKeyDown,
|
|
85
|
-
placeholder:
|
|
90
|
+
placeholder: SEARCH,
|
|
86
91
|
type: "text",
|
|
87
92
|
value: searchValue
|
|
88
93
|
}), /*#__PURE__*/jsx("button", {
|
|
@@ -1 +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
|
|
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';\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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"}
|
|
@@ -1 +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
|
|
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":";;;;;;;;;;;;;;;;;;;;;;AAUA,IAAMA,SAAS,GAAG,OAAlB;AAEA,IAAMC,gBAAgB,GAAG,wFAAzB;AAEA,IAAMC,iBAAiB,GAAG;AACxBC,EAAAA,MAAM,EAAE,SADgB;AAExBC,EAAAA,KAAK,EAAE;AAFiB,CAA1B;AAKA,IAAMC,UAAU,GAAG;AACjBF,EAAAA,MAAM,EAAE,MADS;AAEjBC,EAAAA,KAAK,EAAE;AAFU,CAAnB;AAKA,IAAME,QAAQ,GAAG,CACf;AACEC,EAAAA,QAAQ,EAAE;AACRC,IAAAA,GAAG,EAAE;AADG,GADZ;AAIEC,EAAAA,aAAa,EAAE;AACb,QAAI;AACFN,MAAAA,MAAM,EAAE;AACNO,QAAAA,IAAI,EAAE,SADA;AAENC,QAAAA,KAAK,EAAE;AAFD,OADN;AAKFP,MAAAA,KAAK,EAAE;AACLM,QAAAA,IAAI,EAAE,SADD;AAELC,QAAAA,KAAK,EAAE;AAFF;AALL;AADS,GAJjB;AAgBEC,EAAAA,GAAG,EAAE,KAhBP;AAiBEC,EAAAA,OAAO,EAAE,SAjBX;AAkBEC,EAAAA,IAAI,EAAE;AAlBR,CADe,EAqBf;AACEP,EAAAA,QAAQ,EAAE;AACRC,IAAAA,GAAG,EAAE;AADG,GADZ;AAIEI,EAAAA,GAAG,EAAE,cAJP;AAKEG,EAAAA,KAAK,EAAE,MALT;AAMEF,EAAAA,OAAO,EAAE,SANX;AAOEC,EAAAA,IAAI,EAAE,cAPR;AAQEH,EAAAA,KAAK,EAAE,eAACK,CAAD;AAAA,QAAMb,MAAN,QAAMA,MAAN;AAAA,QAAcC,KAAd,QAAcA,KAAd;AAAA,qBAA6BA,KAA7B,cAAsCD,MAAtC;AAAA;AART,CArBe,EA+Bf;AACEI,EAAAA,QAAQ,EAAE;AACRC,IAAAA,GAAG,EAAE;AADG,GADZ;AAIEI,EAAAA,GAAG,EAAE,gBAJP;AAKEG,EAAAA,KAAK,EAAE,iBALT;AAMEE,EAAAA,KAAK,EAAE,CAAC,CAAD,EAAI,EAAJ,CANT;AAOEJ,EAAAA,OAAO,EAAE,SAPX;AAQEK,EAAAA,QAAQ,EAAE;AACRC,IAAAA,SAAS,EAAE;AADH,GARZ;AAWEC,EAAAA,MAAM,EAAE,IAXV;AAYEN,EAAAA,IAAI,EAAE;AAZR,CA/Be,EA6Cf;AACEP,EAAAA,QAAQ,EAAE;AACRC,IAAAA,GAAG,EAAE;AADG,GADZ;AAIEI,EAAAA,GAAG,EAAE,SAJP;AAKEG,EAAAA,KAAK,EAAE,SALT;AAMEE,EAAAA,KAAK,EAAE,CAAC,CAAD,EAAI,GAAJ,CANT;AAOEJ,EAAAA,OAAO,EAAE,SAPX;AAQEC,EAAAA,IAAI,EAAE;AARR,CA7Ce,EAuDf;AACEF,EAAAA,GAAG,EAAE,KADP;AAEEG,EAAAA,KAAK,EAAE,WAFT;AAGEF,EAAAA,OAAO,EAAE,WAHX;AAIEK,EAAAA,QAAQ,EAAE;AAAEV,IAAAA,GAAG,EAAE;AAAP,GAJZ;AAKEM,EAAAA,IAAI,EAAE,eALR;AAMEO,EAAAA,kBAAkB,EAAE;AANtB,CAvDe,CAAjB;IAiEaC,YAAY,GAAG,SAAfA,YAAe,QAA4B;AAAA,MAAzBC,IAAyB,SAAzBA,IAAyB;AAAA,MAAnBC,YAAmB,SAAnBA,YAAmB;;AACtD,kBAAkCC,QAAQ,CAAC,IAAD,CAA1C;AAAA;AAAA,MAAOC,SAAP;AAAA,MAAkBC,YAAlB;;AACA,mBAAkCF,QAAQ,CAAC,KAAD,CAA1C;AAAA;AAAA,MAAOG,SAAP;AAAA,MAAkBC,YAAlB;;AAEA,MACEC,OADF,GAIIP,IAJJ,CACEO,OADF;AAAA,MAEEC,cAFF,GAIIR,IAJJ,CAEEQ,cAFF;AAAA,MAGEvB,GAHF,GAIIe,IAJJ,CAGEf,GAHF;AAMA,MAAMwB,eAAe,GAAGR,YAAY,CAACD,IAAD,CAApC;AACA,MAAMU,UAAU,GAAG,CAAAD,eAAe,SAAf,IAAAA,eAAe,WAAf,YAAAA,eAAe,CAAEC,UAAjB,KAA+BhC,gBAAlD;AAEAiC,EAAAA,SAAS,CAAC,YAAM;AACdP,IAAAA,YAAY,CAAC,IAAD,CAAZ;AACAE,IAAAA,YAAY,CAAC,KAAD,CAAZ;AACD,GAHQ,EAGN,CAACrB,GAAD,EAAMmB,YAAN,EAAoBE,YAApB,CAHM,CAAT,CAbsD;;AAoBtD,sBACEM;AAAA,4BACEC;AACE,MAAA,KAAK,kCACAlC,iBADA;AAEHmC,QAAAA,OAAO,EAAEX,SAAS,IAAIE,SAAb,GAAyB,MAAzB,GAAkC;AAFxC,QADP;AAAA,6BAMEQ;AACE,QAAA,GAAG,EAAC,aADN;AAEE,QAAA,OAAO,EAAE,mBAAM;AACbT,UAAAA,YAAY,CAAC,KAAD,CAAZ;AACAE,UAAAA,YAAY,CAAC,IAAD,CAAZ;AACD,SALH;AAME,QAAA,MAAM,EAAE;AAAA,iBAAMF,YAAY,CAAC,KAAD,CAAlB;AAAA,SANV;AAOE,QAAA,GAAG,EAAEnB,GAAG,IAAIyB,UAPd;AAQE,QAAA,KAAK,kCACA5B,UADA;AAEHiC,UAAAA,YAAY,YAAKP,cAAL,OAFT;AAGHM,UAAAA,OAAO,EAAET,SAAS,GAAG,MAAH,GAAY,EAH3B;AAIHE,UAAAA,OAAO,EAAES,UAAU,CAACT,OAAD;AAJhB;AARP;AANF,MADF,EAuBGF,SAAS,iBACRQ;AACE,MAAA,KAAK,kCACAlC,iBADA;AAEHsC,QAAAA,UAAU,EAAE,SAFT;AAGHC,QAAAA,UAAU,EAAE,KAHT;AAIHC,QAAAA,SAAS,EAAE;AAJR,QADP;AAAA;AAAA,MAxBJ;AAAA,IADF;AAsCD;AAEDpB,YAAY,CAACqB,SAAb,GAAyB;AACvBpB,EAAAA,IAAI,EAAEqB,KAAK,CAAC;AACVX,IAAAA,UAAU,EAAEY,MADF;AAEV1C,IAAAA,MAAM,EAAE2C,SAAS,CAAC,CAChBC,MADgB,EAEhBF,MAFgB,CAAD,CAFP;AAMVG,IAAAA,EAAE,EAAEH,MANM;AAOVf,IAAAA,OAAO,EAAEgB,SAAS,CAAC,CACjBC,MADiB,EAEjBF,MAFiB,CAAD,CAPR;AAWVd,IAAAA,cAAc,EAAEe,SAAS,CAAC,CACxBC,MADwB,EAExBF,MAFwB,CAAD,CAXf;AAeVrC,IAAAA,GAAG,EAAEqC,MAfK;AAgBVzC,IAAAA,KAAK,EAAE0C,SAAS,CAAC,CACfC,MADe,EAEfF,MAFe,CAAD;AAhBN,GAAD,CADY;AAsBvBrB,EAAAA,YAAY,EAAEyB;AAtBS,CAAzB;AAyBA3B,YAAY,CAAC4B,YAAb,GAA4B;AAC1B3B,EAAAA,IAAI,EAAE;AACJO,IAAAA,OAAO,EAAE;AADL,GADoB;AAI1BN,EAAAA,YAAY,EAAE,wBAAM;AAJM,CAA5B;AAOA,IAAM2B,OAAO,GAAG;AACdhD,EAAAA,MAAM,EAAE,GADM;AAEdiD,EAAAA,QAAQ,EAAEpD,SAFI;AAGd8B,EAAAA,OAAO,EAAE,CAHK;AAIdC,EAAAA,cAAc,EAAE,CAJF;AAKdvB,EAAAA,GAAG,EAAE,EALS;AAMdJ,EAAAA,KAAK,EAAE;AANO,CAAhB;AASA,YAAe;AACbiD,EAAAA,SAAS,eAAEC,IAAI,CAAChC,YAAD,CADF;AAEb6B,EAAAA,OAAO,EAAPA,OAFa;AAGbC,EAAAA,QAAQ,EAAEpD,SAHG;AAIbM,EAAAA,QAAQ,EAARA;AAJa,CAAf;;;;;"}
|