npm - @pie-element/drawing-response - Versions diffs - 7.22.5-next.6 → 7.23.0 - Mend

@pie-element/drawing-response 7.22.5-next.6 → 7.23.0

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.

Files changed (10) hide show

package/CHANGELOG.md +11 -0
package/configure/CHANGELOG.md +11 -0
package/configure/lib/image-container.js +39 -11
package/configure/lib/image-container.js.map +1 -1
package/configure/lib/root.js +2 -1
package/configure/lib/root.js.map +1 -1
package/configure/package.json +1 -1
package/configure/src/image-container.jsx +25 -5
package/configure/src/root.jsx +1 -0
package/package.json +2 -2

package/CHANGELOG.md CHANGED Viewed

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+# [7.23.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/drawing-response@7.22.4...@pie-element/drawing-response@7.23.0) (2024-09-11)
+### Features
+* upload images for drawing-response and only store url in db, not full base64 PD-4067 ([429b47d](https://github.com/pie-framework/pie-elements/commit/429b47d309052cbec17cb592df0ae9bc878e590a))
 ## [7.22.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/drawing-response@7.22.3...@pie-element/drawing-response@7.22.4) (2024-09-10)

package/configure/CHANGELOG.md CHANGED Viewed

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+# [7.22.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/drawing-response-configure@7.21.4...@pie-element/drawing-response-configure@7.22.0) (2024-09-11)
+### Features
+* upload images for drawing-response and only store url in db, not full base64 PD-4067 ([429b47d](https://github.com/pie-framework/pie-elements/commit/429b47d309052cbec17cb592df0ae9bc878e590a))
 ## [7.21.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/drawing-response-configure@7.21.3...@pie-element/drawing-response-configure@7.21.4) (2024-09-10)

package/configure/lib/image-container.js CHANGED Viewed

@@ -37,6 +37,10 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -57,14 +61,25 @@ var ImageContainer = /*#__PURE__*/function (_Component) {
     (0, _classCallCheck2["default"])(this, ImageContainer);
     _this = _super.call(this, props);
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleFileRead", function (file) {
-      var onImageUpload = _this.props.onImageUpload;
+      var _this$props = _this.props,
+          onImageUpload = _this$props.onImageUpload,
+          insertImage = _this$props.insertImage;
       var reader = new FileReader();
       reader.onloadend = function () {
-        onImageUpload(reader.result);
+        return onImageUpload(reader.result);
       };
       reader.readAsDataURL(file);
+      if (insertImage) {
+        insertImage(_objectSpread(_objectSpread({}, _this.fakeImageHandler), {}, {
+          getChosenFile: function getChosenFile() {
+            return file;
+          },
+          isPasted: true
+        }));
+      }
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleUploadImage", function (e) {
       e.preventDefault();
@@ -124,7 +139,11 @@ var ImageContainer = /*#__PURE__*/function (_Component) {
       });
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleInputClick", function () {
-      return _this.input.click();
+      var insertImage = _this.props.insertImage;
+      if (insertImage) {
+        insertImage(_this.fakeImageHandler);
+      }
     });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleOnImageLoad", function (_ref) {
       var _ref$target = _ref.target,
@@ -132,9 +151,9 @@ var ImageContainer = /*#__PURE__*/function (_Component) {
           offsetWidth = _ref$target.offsetWidth,
           naturalHeight = _ref$target.naturalHeight,
           naturalWidth = _ref$target.naturalWidth;
-      var _this$props = _this.props,
-          onUpdateImageDimension = _this$props.onUpdateImageDimension,
-          imageDimensions = _this$props.imageDimensions;
+      var _this$props2 = _this.props,
+          onUpdateImageDimension = _this$props2.onUpdateImageDimension,
+          imageDimensions = _this$props2.imageDimensions;
       var resizeHandle = _this.resize;
       var dimensions = {
         height: imageDimensions && imageDimensions.height || offsetHeight || naturalHeight,
@@ -201,6 +220,14 @@ var ImageContainer = /*#__PURE__*/function (_Component) {
       dragEnabled: true,
       dropzoneActive: false
     };
+    _this.fakeImageHandler = {
+      cancel: function cancel() {},
+      done: function done(a, url) {
+        return _this.props.onImageUpload(url);
+      },
+      fileChosen: function fileChosen() {},
+      progress: function progress() {}
+    };
     return _this;
   }
@@ -241,10 +268,10 @@ var ImageContainer = /*#__PURE__*/function (_Component) {
     value: function render() {
       var _this3 = this;
-      var _this$props2 = this.props,
-          classes = _this$props2.classes,
-          imageUrl = _this$props2.imageUrl,
-          imageDimensions = _this$props2.imageDimensions;
+      var _this$props3 = this.props,
+          classes = _this$props3.classes,
+          imageUrl = _this$props3.imageUrl,
+          imageDimensions = _this$props3.imageDimensions;
       var _this$state2 = this.state,
           dropzoneActive = _this$state2.dropzoneActive,
           dragEnabled = _this$state2.dragEnabled,
@@ -359,7 +386,8 @@ ImageContainer.propTypes = {
   classes: _propTypes["default"].object.isRequired,
   imageUrl: _propTypes["default"].string.isRequired,
   onImageUpload: _propTypes["default"].func.isRequired,
-  onUpdateImageDimension: _propTypes["default"].func.isRequired
+  onUpdateImageDimension: _propTypes["default"].func.isRequired,
+  insertImage: _propTypes["default"].func
 };
 var _default = (0, _styles.withStyles)(styles)(ImageContainer);

package/configure/lib/image-container.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/image-container.jsx"],"names":["isImage","file","imageType","type","match","ImageContainer","props","onImageUpload","reader","FileReader","onloadend","result","readAsDataURL","e","preventDefault","target","files","handleFileRead","setState","dropzoneActive","dataTransfer","items","kind","getAsFile","makeDropzoneInactive","state","makeDropzoneActive","dragEnabled","input","click","offsetHeight","offsetWidth","naturalHeight","naturalWidth","onUpdateImageDimension","imageDimensions","resizeHandle","resize","dimensions","height","width","imageAspectRatio","addEventListener","initialiseResize","window","startResizing","stopResizing","handleEnableDrag","removeEventListener","box","image","maxImageWidth","maxImageHeight","bounds","getBoundingClientRect","x","clientX","left","y","clientY","top","fitsContainer","hasMinimumWidth","style","handleDisableDrag","imageSection","positionInfo","label","classes","handleInputClick","handleUploadImage","ref","imageUrl","base","boxActive","onDragExit","handleOnDragExit","onDragLeave","onDragOver","handleOnDragOver","onDrop","handleOnDrop","toolbar","renderUploadControl","drawableHeight","imageContainer","handleOnImageLoad","undefined","maxWidth","maxHeight","centered","Component","PropTypes","object","styles","theme","marginTop","spacing","unit","border","borderRadius","alignItems","display","flexDirection","justifyContent","minHeight","position","borderBottom","borderRight","bottom","cursor","right","backgroundColor","borderTopLeftRadius","borderTopRightRadius","padding","propTypes","isRequired","string","func"],"mappings":"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","sourcesContent":["import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\n\nimport Button from './button';\n\nconst isImage = (file) => {\n const imageType = /image./;\n return file.type.match(imageType);\n};\n\nexport class ImageContainer extends Component {\n\n static propTypes = {\n imageDimensions: PropTypes.object,\n };\n\n static defaultProps = {};\n\n constructor(props) {\n super(props);\n this.state = {\n maxImageWidth: '100%',\n maxImageHeight: 'auto',\n dragEnabled: true,\n dropzoneActive: false,\n };\n }\n\n componentDidMount() {\n if (this.imageSection) {\n const positionInfo = this.imageSection.getBoundingClientRect();\n const { height, width } = positionInfo;\n this.setState({\n maxImageWidth: width,\n maxImageHeight: height,\n });\n }\n }\n\n handleFileRead = (file) => {\n const { onImageUpload } = this.props;\n const reader = new FileReader();\n reader.onloadend = () => {\n onImageUpload(reader.result);\n };\n reader.readAsDataURL(file);\n };\n\n handleUploadImage = (e) => {\n e.preventDefault();\n const file = e.target.files[0];\n this.handleFileRead(file);\n };\n\n makeDropzoneActive = () => this.setState({ dropzoneActive: true });\n\n makeDropzoneInactive = () => this.setState({ dropzoneActive: false });\n\n handleOnDrop = (e) => {\n e.preventDefault();\n const { items, files } = e.dataTransfer;\n\n if (items && items[0].kind === 'file') {\n const file = items[0].getAsFile();\n if (isImage(file)) {\n this.handleFileRead(file);\n }\n } else if (isImage(files[0])) {\n this.handleFileRead(files[0]);\n }\n\n this.makeDropzoneInactive();\n };\n\n handleOnDragOver = (e) => {\n e.preventDefault();\n const { dropzoneActive } = this.state;\n\n if (!dropzoneActive) {\n this.makeDropzoneActive();\n }\n };\n\n handleOnDragExit = (e) => {\n e.preventDefault();\n this.makeDropzoneInactive();\n };\n\n handleEnableDrag = () => this.setState({ dragEnabled: true });\n handleDisableDrag = () => this.setState({ dragEnabled: false });\n handleInputClick = () => this.input.click();\n\n handleOnImageLoad = ({ target: { offsetHeight, offsetWidth, naturalHeight, naturalWidth } }) => {\n const { onUpdateImageDimension, imageDimensions } = this.props;\n const resizeHandle = this.resize;\n\n const dimensions = {\n height: (imageDimensions && imageDimensions.height) \|\| offsetHeight \|\| naturalHeight,\n width: (imageDimensions && imageDimensions.width) \|\| offsetWidth \|\| naturalWidth,\n };\n\n // check if aspect ratio is not respected on replacing image\n const imageAspectRatio = naturalWidth / naturalHeight;\n\n if (dimensions.width !== dimensions.height imageAspectRatio) {\n dimensions.width = dimensions.height * imageAspectRatio;\n }\n\n this.setState({ dimensions });\n onUpdateImageDimension(dimensions);\n\n resizeHandle.addEventListener('mousedown', this.initialiseResize, false);\n };\n\n initialiseResize = () => {\n window.addEventListener('mousemove', this.startResizing, false);\n window.addEventListener('mouseup', this.stopResizing, false);\n };\n\n stopResizing = () => {\n const { onUpdateImageDimension } = this.props;\n const { dimensions } = this.state;\n\n this.handleEnableDrag();\n onUpdateImageDimension(dimensions);\n\n window.removeEventListener('mousemove', this.startResizing, false);\n window.removeEventListener('mouseup', this.stopResizing, false);\n };\n\n startResizing = (e) => {\n const box = this.image;\n const { maxImageWidth, maxImageHeight, dimensions } = this.state;\n\n const bounds = e.target.getBoundingClientRect();\n const x = e.clientX - bounds.left;\n const y = e.clientY - bounds.top;\n\n const imageAspectRatio = dimensions.width / dimensions.height;\n const fitsContainer = x <= maxImageWidth + 5 && x / imageAspectRatio <= maxImageHeight + 5;\n const hasMinimumWidth = x > 150 && y > 150;\n\n if (fitsContainer && hasMinimumWidth && box) {\n box.style.width = `${x}px`;\n box.style.height = `${x / imageAspectRatio}px`;\n\n this.setState({\n dimensions: {\n width: x,\n height: x / imageAspectRatio,\n },\n });\n }\n\n this.handleDisableDrag();\n };\n\n renderUploadControl(label) {\n const { classes } = this.props;\n\n return (\n <div>\n <Button label={label} onClick={this.handleInputClick} />\n <input\n accept=\"image/*\"\n className={classes.input}\n onChange={this.handleUploadImage}\n ref={(ref) => {\n this.input = ref;\n }}\n type=\"file\"\n />\n </div>\n );\n }\n\n render() {\n const { classes, imageUrl, imageDimensions } = this.props;\n const { dropzoneActive, dragEnabled, maxImageHeight, maxImageWidth } = this.state;\n\n return (\n <div className={classes.base}>\n <div\n className={`${classes.box} ${dropzoneActive ? classes.boxActive : ''}`}\n {...(dragEnabled\n ? {\n onDragExit: this.handleOnDragExit,\n onDragLeave: this.handleOnDragExit,\n onDragOver: this.handleOnDragOver,\n onDrop: this.handleOnDrop,\n }\n : {})}\n >\n <div className={classes.toolbar}>{this.renderUploadControl(imageUrl ? 'Replace Image' : 'Upload Image')}</div>\n\n <div\n ref={(ref) => {\n this.imageSection = ref;\n }}\n className={classes.drawableHeight}\n >\n {imageUrl ? (\n <div className={classes.imageContainer}>\n <img\n className={classes.image}\n height=\"auto\"\n onLoad={this.handleOnImageLoad}\n ref={(ref) => {\n this.image = ref;\n }}\n src={imageUrl}\n style={{\n width: imageDimensions && imageDimensions.width ? imageDimensions.width : undefined,\n maxWidth: maxImageWidth,\n maxHeight: maxImageHeight,\n }}\n alt=\"\"\n />\n <div\n ref={(ref) => {\n this.resize = ref;\n }}\n className={classes.resize}\n />\n </div>\n ) : (\n <div className={`${classes.drawableHeight} ${classes.centered}`}>\n <label>Drag and drop or upload image from computer</label>\n <br />\n {this.renderUploadControl('Upload Image')}\n </div>\n )}\n </div>\n </div>\n </div>\n );\n }\n}\n\nconst styles = (theme) => ({\n base: {\n marginTop: theme.spacing.unit,\n },\n box: {\n border: '1px solid #E0E1E6',\n borderRadius: '5px',\n },\n boxActive: {\n border: '1px solid #0032C2',\n },\n centered: {\n alignItems: 'center',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n },\n drawableHeight: {\n minHeight: 350,\n },\n image: {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'center',\n },\n imageContainer: {\n position: 'relative',\n width: 'fit-content',\n },\n resize: {\n borderBottom: '1px solid #727272',\n borderRight: '1px solid #727272',\n bottom: '-10px',\n cursor: 'se-resize',\n height: '10px',\n position: 'absolute',\n right: '-10px',\n width: '10px',\n },\n input: {\n display: 'none',\n },\n toolbar: {\n backgroundColor: '#ECEDF1',\n borderBottom: '1px solid #E0E1E6',\n borderTopLeftRadius: '5px',\n borderTopRightRadius: '5px',\n display: 'flex',\n padding: '12px 8px',\n },\n});\n\nImageContainer.propTypes = {\n classes: PropTypes.object.isRequired,\n imageUrl: PropTypes.string.isRequired,\n onImageUpload: PropTypes.func.isRequired,\n onUpdateImageDimension: PropTypes.func.isRequired,\n};\n\nexport default withStyles(styles)(ImageContainer);\n"],"file":"image-container.js"}
1	+ {"version":3,"sources":["../src/image-container.jsx"],"names":["isImage","file","imageType","type","match","ImageContainer","props","onImageUpload","insertImage","reader","FileReader","onloadend","result","readAsDataURL","fakeImageHandler","getChosenFile","isPasted","e","preventDefault","target","files","handleFileRead","setState","dropzoneActive","dataTransfer","items","kind","getAsFile","makeDropzoneInactive","state","makeDropzoneActive","dragEnabled","offsetHeight","offsetWidth","naturalHeight","naturalWidth","onUpdateImageDimension","imageDimensions","resizeHandle","resize","dimensions","height","width","imageAspectRatio","addEventListener","initialiseResize","window","startResizing","stopResizing","handleEnableDrag","removeEventListener","box","image","maxImageWidth","maxImageHeight","bounds","getBoundingClientRect","x","clientX","left","y","clientY","top","fitsContainer","hasMinimumWidth","style","handleDisableDrag","cancel","done","a","url","fileChosen","progress","imageSection","positionInfo","label","classes","handleInputClick","input","handleUploadImage","ref","imageUrl","base","boxActive","onDragExit","handleOnDragExit","onDragLeave","onDragOver","handleOnDragOver","onDrop","handleOnDrop","toolbar","renderUploadControl","drawableHeight","imageContainer","handleOnImageLoad","undefined","maxWidth","maxHeight","centered","Component","PropTypes","object","styles","theme","marginTop","spacing","unit","border","borderRadius","alignItems","display","flexDirection","justifyContent","minHeight","position","borderBottom","borderRight","bottom","cursor","right","backgroundColor","borderTopLeftRadius","borderTopRightRadius","padding","propTypes","isRequired","string","func"],"mappings":"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","sourcesContent":["import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\n\nimport Button from './button';\n\nconst isImage = (file) => {\n const imageType = /image./;\n return file.type.match(imageType);\n};\n\nexport class ImageContainer extends Component {\n\n static propTypes = {\n imageDimensions: PropTypes.object,\n };\n\n static defaultProps = {};\n\n constructor(props) {\n super(props);\n this.state = {\n maxImageWidth: '100%',\n maxImageHeight: 'auto',\n dragEnabled: true,\n dropzoneActive: false,\n };\n this.fakeImageHandler = {\n cancel: () => {},\n done: (a, url) => this.props.onImageUpload(url),\n fileChosen: () => {},\n progress: () => {},\n };\n }\n\n componentDidMount() {\n if (this.imageSection) {\n const positionInfo = this.imageSection.getBoundingClientRect();\n const { height, width } = positionInfo;\n this.setState({\n maxImageWidth: width,\n maxImageHeight: height,\n });\n }\n }\n\n handleFileRead = (file) => {\n const { onImageUpload, insertImage } = this.props;\n const reader = new FileReader();\n\n reader.onloadend = () => onImageUpload(reader.result);\n reader.readAsDataURL(file);\n\n if (insertImage) {\n insertImage({\n ...this.fakeImageHandler,\n getChosenFile: () => file,\n isPasted: true,\n });\n }\n };\n\n handleUploadImage = (e) => {\n e.preventDefault();\n const file = e.target.files[0];\n this.handleFileRead(file);\n };\n\n makeDropzoneActive = () => this.setState({ dropzoneActive: true });\n\n makeDropzoneInactive = () => this.setState({ dropzoneActive: false });\n\n handleOnDrop = (e) => {\n e.preventDefault();\n const { items, files } = e.dataTransfer;\n\n if (items && items[0].kind === 'file') {\n const file = items[0].getAsFile();\n if (isImage(file)) {\n this.handleFileRead(file);\n }\n } else if (isImage(files[0])) {\n this.handleFileRead(files[0]);\n }\n\n this.makeDropzoneInactive();\n };\n\n handleOnDragOver = (e) => {\n e.preventDefault();\n const { dropzoneActive } = this.state;\n\n if (!dropzoneActive) {\n this.makeDropzoneActive();\n }\n };\n\n handleOnDragExit = (e) => {\n e.preventDefault();\n this.makeDropzoneInactive();\n };\n\n handleEnableDrag = () => this.setState({ dragEnabled: true });\n handleDisableDrag = () => this.setState({ dragEnabled: false });\n handleInputClick = () => {\n const { insertImage } = this.props;\n\n if (insertImage) {\n insertImage(this.fakeImageHandler);\n }\n };\n\n handleOnImageLoad = ({ target: { offsetHeight, offsetWidth, naturalHeight, naturalWidth } }) => {\n const { onUpdateImageDimension, imageDimensions } = this.props;\n const resizeHandle = this.resize;\n\n const dimensions = {\n height: (imageDimensions && imageDimensions.height) \|\| offsetHeight \|\| naturalHeight,\n width: (imageDimensions && imageDimensions.width) \|\| offsetWidth \|\| naturalWidth,\n };\n\n // check if aspect ratio is not respected on replacing image\n const imageAspectRatio = naturalWidth / naturalHeight;\n\n if (dimensions.width !== dimensions.height imageAspectRatio) {\n dimensions.width = dimensions.height * imageAspectRatio;\n }\n\n this.setState({ dimensions });\n onUpdateImageDimension(dimensions);\n\n resizeHandle.addEventListener('mousedown', this.initialiseResize, false);\n };\n\n initialiseResize = () => {\n window.addEventListener('mousemove', this.startResizing, false);\n window.addEventListener('mouseup', this.stopResizing, false);\n };\n\n stopResizing = () => {\n const { onUpdateImageDimension } = this.props;\n const { dimensions } = this.state;\n\n this.handleEnableDrag();\n onUpdateImageDimension(dimensions);\n\n window.removeEventListener('mousemove', this.startResizing, false);\n window.removeEventListener('mouseup', this.stopResizing, false);\n };\n\n startResizing = (e) => {\n const box = this.image;\n const { maxImageWidth, maxImageHeight, dimensions } = this.state;\n\n const bounds = e.target.getBoundingClientRect();\n const x = e.clientX - bounds.left;\n const y = e.clientY - bounds.top;\n\n const imageAspectRatio = dimensions.width / dimensions.height;\n const fitsContainer = x <= maxImageWidth + 5 && x / imageAspectRatio <= maxImageHeight + 5;\n const hasMinimumWidth = x > 150 && y > 150;\n\n if (fitsContainer && hasMinimumWidth && box) {\n box.style.width = `${x}px`;\n box.style.height = `${x / imageAspectRatio}px`;\n\n this.setState({\n dimensions: {\n width: x,\n height: x / imageAspectRatio,\n },\n });\n }\n\n this.handleDisableDrag();\n };\n\n renderUploadControl(label) {\n const { classes } = this.props;\n\n return (\n <div>\n <Button label={label} onClick={this.handleInputClick} />\n <input\n accept=\"image/*\"\n className={classes.input}\n onChange={this.handleUploadImage}\n ref={(ref) => {\n this.input = ref;\n }}\n type=\"file\"\n />\n </div>\n );\n }\n\n render() {\n const { classes, imageUrl, imageDimensions } = this.props;\n const { dropzoneActive, dragEnabled, maxImageHeight, maxImageWidth } = this.state;\n\n return (\n <div className={classes.base}>\n <div\n className={`${classes.box} ${dropzoneActive ? classes.boxActive : ''}`}\n {...(dragEnabled\n ? {\n onDragExit: this.handleOnDragExit,\n onDragLeave: this.handleOnDragExit,\n onDragOver: this.handleOnDragOver,\n onDrop: this.handleOnDrop,\n }\n : {})}\n >\n <div className={classes.toolbar}>{this.renderUploadControl(imageUrl ? 'Replace Image' : 'Upload Image')}</div>\n\n <div\n ref={(ref) => {\n this.imageSection = ref;\n }}\n className={classes.drawableHeight}\n >\n {imageUrl ? (\n <div className={classes.imageContainer}>\n <img\n className={classes.image}\n height=\"auto\"\n onLoad={this.handleOnImageLoad}\n ref={(ref) => {\n this.image = ref;\n }}\n src={imageUrl}\n style={{\n width: imageDimensions && imageDimensions.width ? imageDimensions.width : undefined,\n maxWidth: maxImageWidth,\n maxHeight: maxImageHeight,\n }}\n alt=\"\"\n />\n <div\n ref={(ref) => {\n this.resize = ref;\n }}\n className={classes.resize}\n />\n </div>\n ) : (\n <div className={`${classes.drawableHeight} ${classes.centered}`}>\n <label>Drag and drop or upload image from computer</label>\n <br />\n {this.renderUploadControl('Upload Image')}\n </div>\n )}\n </div>\n </div>\n </div>\n );\n }\n}\n\nconst styles = (theme) => ({\n base: {\n marginTop: theme.spacing.unit,\n },\n box: {\n border: '1px solid #E0E1E6',\n borderRadius: '5px',\n },\n boxActive: {\n border: '1px solid #0032C2',\n },\n centered: {\n alignItems: 'center',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n },\n drawableHeight: {\n minHeight: 350,\n },\n image: {\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'center',\n },\n imageContainer: {\n position: 'relative',\n width: 'fit-content',\n },\n resize: {\n borderBottom: '1px solid #727272',\n borderRight: '1px solid #727272',\n bottom: '-10px',\n cursor: 'se-resize',\n height: '10px',\n position: 'absolute',\n right: '-10px',\n width: '10px',\n },\n input: {\n display: 'none',\n },\n toolbar: {\n backgroundColor: '#ECEDF1',\n borderBottom: '1px solid #E0E1E6',\n borderTopLeftRadius: '5px',\n borderTopRightRadius: '5px',\n display: 'flex',\n padding: '12px 8px',\n },\n});\n\nImageContainer.propTypes = {\n classes: PropTypes.object.isRequired,\n imageUrl: PropTypes.string.isRequired,\n onImageUpload: PropTypes.func.isRequired,\n onUpdateImageDimension: PropTypes.func.isRequired,\n insertImage: PropTypes.func,\n};\n\nexport default withStyles(styles)(ImageContainer);\n"],"file":"image-container.js"}

package/configure/lib/root.js CHANGED Viewed

@@ -236,7 +236,8 @@ var Root = /*#__PURE__*/function (_React$Component) {
         imageUrl: model.imageUrl,
         onUpdateImageDimension: this.onUpdateImageDimension,
         onImageUpload: this.onImageUpload,
-        imageDimensions: model.imageDimensions
+        imageDimensions: model.imageDimensions,
+        insertImage: imageSupport && imageSupport.add
       })));
     }
   }]);

package/configure/lib/root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/root.jsx"],"names":["Panel","settings","toggle","dropdown","Root","prompt","props","model","onModelChanged","update","teacherInstructions","dimensions","imageDimensions","imageUrl","classes","configuration","imageSupport","onConfigurationChanged","uploadSoundSupport","baseInputConfiguration","backgroundImage","contentDimensions","maxImageWidth","maxImageHeight","settingsPanelDisabled","spellCheck","withRubric","language","languageChoices","mathMlOptions","backgroundImageEnabled","errors","promptEnabled","spellCheckEnabled","teacherInstructionsEnabled","toolbarEditorPosition","promptError","teacherInstructionsError","defaultImageMaxWidth","defaultImageMaxHeight","toolbarOpts","position","panelSettings","label","enabled","options","panelProperties","rubricEnabled","getPluginProps","Settings","Properties","promptHolder","onTeacherInstructionsChanged","inputConfiguration","errorText","onPromptChanged","onUpdateImageDimension","onImageUpload","React","Component","styles","theme","paddingTop","spacing","unit","marginBottom","width","fontSize","typography","color","palette","error","main","propTypes","PropTypes","object","isRequired","shape","add","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { settings, layout, InputContainer } from '@pie-lib/pie-toolbox/config-ui';\nimport PropTypes from 'prop-types';\nimport { EditableHtml } from '@pie-lib/pie-toolbox/editable-html';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\n\nimport ImageContainer from './image-container';\nimport cloneDeep from 'lodash/cloneDeep';\n\nconst { Panel, toggle, dropdown } = settings;\n\nexport class Root extends React.Component {\n onPromptChanged = (prompt) => {\n const { model, onModelChanged } = this.props;\n const update = cloneDeep(model);\n\n onModelChanged({ ...update, prompt });\n };\n\n onTeacherInstructionsChanged = (teacherInstructions) => {\n const { model, onModelChanged } = this.props;\n\n onModelChanged({ ...model, teacherInstructions });\n };\n\n onUpdateImageDimension = (dimensions) => {\n const { model, onModelChanged } = this.props;\n\n onModelChanged({ ...model, imageDimensions: dimensions });\n };\n\n onImageUpload = (imageUrl) => {\n const { model, onModelChanged } = this.props;\n\n onModelChanged({ ...model, imageUrl });\n };\n\n render() {\n const { classes, configuration, imageSupport, model, onConfigurationChanged, onModelChanged, uploadSoundSupport } =\n this.props;\n const {\n baseInputConfiguration = {},\n backgroundImage = {},\n contentDimensions = {},\n maxImageWidth = {},\n maxImageHeight = {},\n prompt = {},\n settingsPanelDisabled,\n spellCheck = {},\n teacherInstructions = {},\n withRubric = {},\n language = {},\n languageChoices = {},\n mathMlOptions = {},\n } = configuration \|\| {};\n const {\n backgroundImageEnabled,\n errors = {},\n promptEnabled,\n spellCheckEnabled,\n teacherInstructionsEnabled,\n toolbarEditorPosition,\n } = model \|\| {};\n const { prompt: promptError, teacherInstructions: teacherInstructionsError } = errors;\n\n const defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;\n const defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;\n\n const toolbarOpts = {\n position: toolbarEditorPosition === 'top' ? 'top' : 'bottom',\n };\n\n const panelSettings = {\n backgroundImageEnabled: backgroundImage.settings && toggle(backgroundImage.label),\n promptEnabled: prompt.settings && toggle(prompt.label),\n 'language.enabled': language.settings && toggle(language.label, true),\n language: language.settings && language.enabled && dropdown(languageChoices.label, languageChoices.options),\n };\n\n const panelProperties = {\n teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),\n spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),\n rubricEnabled: withRubric?.settings && toggle(withRubric?.label),\n };\n\n const getPluginProps = (props = {}) => ({\n ...baseInputConfiguration,\n ...props,\n });\n\n return (\n <layout.ConfigLayout\n dimensions={contentDimensions}\n hideSettings={settingsPanelDisabled}\n settings={\n <Panel\n model={model}\n onChangeModel={onModelChanged}\n configuration={configuration}\n onChangeConfiguration={onConfigurationChanged}\n groups={{\n Settings: panelSettings,\n Properties: panelProperties,\n }}\n />\n }\n >\n {teacherInstructionsEnabled && (\n <InputContainer label={teacherInstructions.label} className={classes.promptHolder}>\n <EditableHtml\n markup={model.teacherInstructions \|\| ''}\n onChange={this.onTeacherInstructionsChanged}\n imageSupport={imageSupport}\n nonEmpty={false}\n error={teacherInstructionsError}\n toolbarOpts={toolbarOpts}\n pluginProps={getPluginProps(teacherInstructions?.inputConfiguration)}\n spellCheck={spellCheckEnabled}\n maxImageWidth={(maxImageWidth && maxImageWidth.teacherInstructions) \|\| defaultImageMaxWidth}\n maxImageHeight={(maxImageHeight && maxImageHeight.teacherInstructions) \|\| defaultImageMaxHeight}\n uploadSoundSupport={uploadSoundSupport}\n languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n mathMlOptions={mathMlOptions}\n />\n {teacherInstructionsError && <div className={classes.errorText}>{teacherInstructionsError}</div>}\n </InputContainer>\n )}\n\n {promptEnabled && (\n <InputContainer label=\"Item Stem\" className={classes.promptHolder}>\n <EditableHtml\n markup={model.prompt}\n onChange={this.onPromptChanged}\n error={promptError}\n toolbarOpts={toolbarOpts}\n spellCheck={spellCheckEnabled}\n pluginProps={getPluginProps(prompt?.inputConfiguration)}\n imageSupport={imageSupport}\n maxImageWidth={defaultImageMaxWidth}\n maxImageHeight={defaultImageMaxHeight}\n uploadSoundSupport={uploadSoundSupport}\n languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n mathMlOptions={mathMlOptions}\n />\n {promptError && <div className={classes.errorText}>{promptError}</div>}\n </InputContainer>\n )}\n\n {backgroundImageEnabled && (\n <React.Fragment>\n <Typography variant=\"subheading\">Define Background Image</Typography>\n\n <ImageContainer\n imageUrl={model.imageUrl}\n onUpdateImageDimension={this.onUpdateImageDimension}\n onImageUpload={this.onImageUpload}\n imageDimensions={model.imageDimensions}\n />\n </React.Fragment>\n )}\n </layout.ConfigLayout>\n );\n }\n}\n\nconst styles = (theme) => ({\n promptHolder: {\n paddingTop: theme.spacing.unit * 2,\n marginBottom: theme.spacing.unit * 2,\n width: '100%',\n },\n errorText: {\n fontSize: theme.typography.fontSize - 2,\n color: theme.palette.error.main,\n paddingTop: theme.spacing.unit,\n },\n});\n\nRoot.propTypes = {\n classes: PropTypes.object.isRequired,\n configuration: PropTypes.object,\n model: PropTypes.object.isRequired,\n imageSupport: PropTypes.shape({\n add: PropTypes.func,\n delete: PropTypes.func,\n }),\n uploadSoundSupport: PropTypes.shape({\n add: PropTypes.func,\n delete: PropTypes.func,\n }),\n onModelChanged: PropTypes.func.isRequired,\n onConfigurationChanged: PropTypes.func.isRequired,\n};\n\nexport default withStyles(styles)(Root);\n"],"file":"root.js"}
1	+ {"version":3,"sources":["../src/root.jsx"],"names":["Panel","settings","toggle","dropdown","Root","prompt","props","model","onModelChanged","update","teacherInstructions","dimensions","imageDimensions","imageUrl","classes","configuration","imageSupport","onConfigurationChanged","uploadSoundSupport","baseInputConfiguration","backgroundImage","contentDimensions","maxImageWidth","maxImageHeight","settingsPanelDisabled","spellCheck","withRubric","language","languageChoices","mathMlOptions","backgroundImageEnabled","errors","promptEnabled","spellCheckEnabled","teacherInstructionsEnabled","toolbarEditorPosition","promptError","teacherInstructionsError","defaultImageMaxWidth","defaultImageMaxHeight","toolbarOpts","position","panelSettings","label","enabled","options","panelProperties","rubricEnabled","getPluginProps","Settings","Properties","promptHolder","onTeacherInstructionsChanged","inputConfiguration","errorText","onPromptChanged","onUpdateImageDimension","onImageUpload","add","React","Component","styles","theme","paddingTop","spacing","unit","marginBottom","width","fontSize","typography","color","palette","error","main","propTypes","PropTypes","object","isRequired","shape","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { settings, layout, InputContainer } from '@pie-lib/pie-toolbox/config-ui';\nimport PropTypes from 'prop-types';\nimport { EditableHtml } from '@pie-lib/pie-toolbox/editable-html';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\n\nimport ImageContainer from './image-container';\nimport cloneDeep from 'lodash/cloneDeep';\n\nconst { Panel, toggle, dropdown } = settings;\n\nexport class Root extends React.Component {\n onPromptChanged = (prompt) => {\n const { model, onModelChanged } = this.props;\n const update = cloneDeep(model);\n\n onModelChanged({ ...update, prompt });\n };\n\n onTeacherInstructionsChanged = (teacherInstructions) => {\n const { model, onModelChanged } = this.props;\n\n onModelChanged({ ...model, teacherInstructions });\n };\n\n onUpdateImageDimension = (dimensions) => {\n const { model, onModelChanged } = this.props;\n\n onModelChanged({ ...model, imageDimensions: dimensions });\n };\n\n onImageUpload = (imageUrl) => {\n const { model, onModelChanged } = this.props;\n\n onModelChanged({ ...model, imageUrl });\n };\n\n render() {\n const { classes, configuration, imageSupport, model, onConfigurationChanged, onModelChanged, uploadSoundSupport } =\n this.props;\n const {\n baseInputConfiguration = {},\n backgroundImage = {},\n contentDimensions = {},\n maxImageWidth = {},\n maxImageHeight = {},\n prompt = {},\n settingsPanelDisabled,\n spellCheck = {},\n teacherInstructions = {},\n withRubric = {},\n language = {},\n languageChoices = {},\n mathMlOptions = {},\n } = configuration \|\| {};\n const {\n backgroundImageEnabled,\n errors = {},\n promptEnabled,\n spellCheckEnabled,\n teacherInstructionsEnabled,\n toolbarEditorPosition,\n } = model \|\| {};\n const { prompt: promptError, teacherInstructions: teacherInstructionsError } = errors;\n\n const defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;\n const defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;\n\n const toolbarOpts = {\n position: toolbarEditorPosition === 'top' ? 'top' : 'bottom',\n };\n\n const panelSettings = {\n backgroundImageEnabled: backgroundImage.settings && toggle(backgroundImage.label),\n promptEnabled: prompt.settings && toggle(prompt.label),\n 'language.enabled': language.settings && toggle(language.label, true),\n language: language.settings && language.enabled && dropdown(languageChoices.label, languageChoices.options),\n };\n\n const panelProperties = {\n teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),\n spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),\n rubricEnabled: withRubric?.settings && toggle(withRubric?.label),\n };\n\n const getPluginProps = (props = {}) => ({\n ...baseInputConfiguration,\n ...props,\n });\n\n return (\n <layout.ConfigLayout\n dimensions={contentDimensions}\n hideSettings={settingsPanelDisabled}\n settings={\n <Panel\n model={model}\n onChangeModel={onModelChanged}\n configuration={configuration}\n onChangeConfiguration={onConfigurationChanged}\n groups={{\n Settings: panelSettings,\n Properties: panelProperties,\n }}\n />\n }\n >\n {teacherInstructionsEnabled && (\n <InputContainer label={teacherInstructions.label} className={classes.promptHolder}>\n <EditableHtml\n markup={model.teacherInstructions \|\| ''}\n onChange={this.onTeacherInstructionsChanged}\n imageSupport={imageSupport}\n nonEmpty={false}\n error={teacherInstructionsError}\n toolbarOpts={toolbarOpts}\n pluginProps={getPluginProps(teacherInstructions?.inputConfiguration)}\n spellCheck={spellCheckEnabled}\n maxImageWidth={(maxImageWidth && maxImageWidth.teacherInstructions) \|\| defaultImageMaxWidth}\n maxImageHeight={(maxImageHeight && maxImageHeight.teacherInstructions) \|\| defaultImageMaxHeight}\n uploadSoundSupport={uploadSoundSupport}\n languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n mathMlOptions={mathMlOptions}\n />\n {teacherInstructionsError && <div className={classes.errorText}>{teacherInstructionsError}</div>}\n </InputContainer>\n )}\n\n {promptEnabled && (\n <InputContainer label=\"Item Stem\" className={classes.promptHolder}>\n <EditableHtml\n markup={model.prompt}\n onChange={this.onPromptChanged}\n error={promptError}\n toolbarOpts={toolbarOpts}\n spellCheck={spellCheckEnabled}\n pluginProps={getPluginProps(prompt?.inputConfiguration)}\n imageSupport={imageSupport}\n maxImageWidth={defaultImageMaxWidth}\n maxImageHeight={defaultImageMaxHeight}\n uploadSoundSupport={uploadSoundSupport}\n languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n mathMlOptions={mathMlOptions}\n />\n {promptError && <div className={classes.errorText}>{promptError}</div>}\n </InputContainer>\n )}\n\n {backgroundImageEnabled && (\n <React.Fragment>\n <Typography variant=\"subheading\">Define Background Image</Typography>\n\n <ImageContainer\n imageUrl={model.imageUrl}\n onUpdateImageDimension={this.onUpdateImageDimension}\n onImageUpload={this.onImageUpload}\n imageDimensions={model.imageDimensions}\n insertImage={imageSupport && imageSupport.add}\n />\n </React.Fragment>\n )}\n </layout.ConfigLayout>\n );\n }\n}\n\nconst styles = (theme) => ({\n promptHolder: {\n paddingTop: theme.spacing.unit * 2,\n marginBottom: theme.spacing.unit * 2,\n width: '100%',\n },\n errorText: {\n fontSize: theme.typography.fontSize - 2,\n color: theme.palette.error.main,\n paddingTop: theme.spacing.unit,\n },\n});\n\nRoot.propTypes = {\n classes: PropTypes.object.isRequired,\n configuration: PropTypes.object,\n model: PropTypes.object.isRequired,\n imageSupport: PropTypes.shape({\n add: PropTypes.func,\n delete: PropTypes.func,\n }),\n uploadSoundSupport: PropTypes.shape({\n add: PropTypes.func,\n delete: PropTypes.func,\n }),\n onModelChanged: PropTypes.func.isRequired,\n onConfigurationChanged: PropTypes.func.isRequired,\n};\n\nexport default withStyles(styles)(Root);\n"],"file":"root.js"}

package/configure/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/drawing-response-configure",
   "private": true,
-  "version": "7.21.4",
+  "version": "7.22.0",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",

package/configure/src/image-container.jsx CHANGED Viewed

@@ -25,6 +25,12 @@ export class ImageContainer extends Component {
       dragEnabled: true,
       dropzoneActive: false,
     };
+    this.fakeImageHandler = {
+      cancel: () => {},
+      done: (a, url) => this.props.onImageUpload(url),
+      fileChosen: () => {},
+      progress: () => {},
+    };
   }
   componentDidMount() {
@@ -39,12 +45,19 @@ export class ImageContainer extends Component {
   }
   handleFileRead = (file) => {
-    const { onImageUpload } = this.props;
+    const { onImageUpload, insertImage } = this.props;
     const reader = new FileReader();
-    reader.onloadend = () => {
-      onImageUpload(reader.result);
-    };
+    reader.onloadend = () => onImageUpload(reader.result);
     reader.readAsDataURL(file);
+    if (insertImage) {
+      insertImage({
+        ...this.fakeImageHandler,
+        getChosenFile: () => file,
+        isPasted: true,
+      });
+    }
   };
   handleUploadImage = (e) => {
@@ -89,7 +102,13 @@ export class ImageContainer extends Component {
   handleEnableDrag = () => this.setState({ dragEnabled: true });
   handleDisableDrag = () => this.setState({ dragEnabled: false });
-  handleInputClick = () => this.input.click();
+  handleInputClick = () => {
+    const { insertImage } = this.props;
+    if (insertImage) {
+      insertImage(this.fakeImageHandler);
+    }
+  };
   handleOnImageLoad = ({ target: { offsetHeight, offsetWidth, naturalHeight, naturalWidth } }) => {
     const { onUpdateImageDimension, imageDimensions } = this.props;
@@ -295,6 +314,7 @@ ImageContainer.propTypes = {
   imageUrl: PropTypes.string.isRequired,
   onImageUpload: PropTypes.func.isRequired,
   onUpdateImageDimension: PropTypes.func.isRequired,
+  insertImage: PropTypes.func,
 };
 export default withStyles(styles)(ImageContainer);

package/configure/src/root.jsx CHANGED Viewed

@@ -156,6 +156,7 @@ export class Root extends React.Component {
               onUpdateImageDimension={this.onUpdateImageDimension}
               onImageUpload={this.onImageUpload}
               imageDimensions={model.imageDimensions}
+              insertImage={imageSupport && imageSupport.add}
             />
           </React.Fragment>
         )}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pie-element/drawing-response",
-  "version": "7.22.5-next.6+ce1514236",
+  "version": "7.23.0",
   "description": "",
   "repository": "pie-framework/pie-elements",
   "publishConfig": {
@@ -23,7 +23,7 @@
   },
   "author": "pie framework developers",
   "license": "ISC",
-  "gitHead": "ce1514236adc03d8dd762b8af4a6196f741e34d1",
+  "gitHead": "7b5b0ced0f6b03349090ef59093c962447e47444",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },