@jotforminc/dnd-builder 2.9.13 → 2.9.15
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
CHANGED
|
@@ -2,6 +2,20 @@
|
|
|
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.9.15](https://github.com/jotform/dnd-builder/compare/v2.9.14...v2.9.15) (2025-12-02)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
* **Image:** update image URL handling to use additionalProps for dynamic source ([e65156c](https://github.com/jotform/dnd-builder/commit/e65156c431422eda6cb6f3797dfa4612f1f7b206))
|
|
11
|
+
|
|
12
|
+
### [2.9.14](https://github.com/jotform/dnd-builder/compare/v2.9.12...v2.9.14) (2025-12-02)
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
### Bug Fixes
|
|
16
|
+
|
|
17
|
+
* **dnd-builder:** page element id added for selector usage ([6167a48](https://github.com/jotform/dnd-builder/commit/6167a4847f7685e8dc9b3af2670a51c161dfcc8e))
|
|
18
|
+
|
|
5
19
|
### [2.9.13](https://github.com/jotform/dnd-builder/compare/v2.9.12...v2.9.13) (2025-11-21)
|
|
6
20
|
|
|
7
21
|
|
|
@@ -117,10 +117,11 @@ var ImageElement = function ImageElement(_ref2) {
|
|
|
117
117
|
url = item.url;
|
|
118
118
|
var additionalProps = itemAccessor(item);
|
|
119
119
|
var defaultURL = (additionalProps === null || additionalProps === void 0 ? void 0 : additionalProps.defaultURL) || DEFAULT_LOGO_SRC;
|
|
120
|
+
var imageUrl = (additionalProps === null || additionalProps === void 0 ? void 0 : additionalProps.url) || url;
|
|
120
121
|
React.useEffect(function () {
|
|
121
122
|
setIsLoading(true);
|
|
122
123
|
setIsErrored(false);
|
|
123
|
-
}, [
|
|
124
|
+
}, [imageUrl, setIsLoading, setIsErrored]); // TODO :: do we want to show a loading placeholder?
|
|
124
125
|
|
|
125
126
|
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
126
127
|
children: [/*#__PURE__*/jsxRuntime.jsx("div", {
|
|
@@ -136,7 +137,7 @@ var ImageElement = function ImageElement(_ref2) {
|
|
|
136
137
|
onLoad: function onLoad() {
|
|
137
138
|
return setIsLoading(false);
|
|
138
139
|
},
|
|
139
|
-
src:
|
|
140
|
+
src: imageUrl || defaultURL,
|
|
140
141
|
style: _objectSpread(_objectSpread({}, imageStyle), {}, {
|
|
141
142
|
borderRadius: "".concat(roundedCorners, "px"),
|
|
142
143
|
display: isErrored ? 'none' : '',
|
|
@@ -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 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 }, [
|
|
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 const imageUrl = additionalProps?.url || url;\n\n useEffect(() => {\n setIsLoading(true);\n setIsErrored(false);\n }, [imageUrl, 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={imageUrl || 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","imageUrl","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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"}
|
|
@@ -113,10 +113,11 @@ var ImageElement = function ImageElement(_ref2) {
|
|
|
113
113
|
url = item.url;
|
|
114
114
|
var additionalProps = itemAccessor(item);
|
|
115
115
|
var defaultURL = (additionalProps === null || additionalProps === void 0 ? void 0 : additionalProps.defaultURL) || DEFAULT_LOGO_SRC;
|
|
116
|
+
var imageUrl = (additionalProps === null || additionalProps === void 0 ? void 0 : additionalProps.url) || url;
|
|
116
117
|
useEffect(function () {
|
|
117
118
|
setIsLoading(true);
|
|
118
119
|
setIsErrored(false);
|
|
119
|
-
}, [
|
|
120
|
+
}, [imageUrl, setIsLoading, setIsErrored]); // TODO :: do we want to show a loading placeholder?
|
|
120
121
|
|
|
121
122
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
122
123
|
children: [/*#__PURE__*/jsx("div", {
|
|
@@ -132,7 +133,7 @@ var ImageElement = function ImageElement(_ref2) {
|
|
|
132
133
|
onLoad: function onLoad() {
|
|
133
134
|
return setIsLoading(false);
|
|
134
135
|
},
|
|
135
|
-
src:
|
|
136
|
+
src: imageUrl || defaultURL,
|
|
136
137
|
style: _objectSpread(_objectSpread({}, imageStyle), {}, {
|
|
137
138
|
borderRadius: "".concat(roundedCorners, "px"),
|
|
138
139
|
display: isErrored ? 'none' : '',
|
|
@@ -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 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 }, [
|
|
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 const imageUrl = additionalProps?.url || url;\n\n useEffect(() => {\n setIsLoading(true);\n setIsErrored(false);\n }, [imageUrl, 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={imageUrl || 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","imageUrl","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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"}
|