@tenancy.nz/ui 1.0.4 → 1.0.6

package/dist/esm/components/Card.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import CardContent from './CardContent.js';
 import Media from './Media.js';
@@ -25,27 +24,19 @@ function Card(_ref) {
   var rest = _objectSpread2({
     elevate: elevate
   }, others);
-  return /* @__PURE__ */jsxs(Paper, _objectSpread2(_objectSpread2({
+  return /* @__PURE__ */React.createElement(Paper, _objectSpread2({
     elevate: false,
     outlined: true
-  }, rest), {}, {
-    children: [onClick &&
-    // <ActionArea onClick={onClick}>
-    /* @__PURE__ */
-    jsxs(StyledCardMedia, {
-      children: [imgContent, !imgContent && /* @__PURE__ */jsx(Media, {
-        src: imgSrc,
-        title: title
-      })]
-    }), !onClick && /* @__PURE__ */jsx(StyledCardMedia, {
-      children: /* @__PURE__ */jsx(Media, {
-        src: imgSrc,
-        title: title
-      })
-    }), /* @__PURE__ */jsx(CardContent, {
-      children: children
-    })]
-  }));
+  }, rest), onClick &&
+  // <ActionArea onClick={onClick}>
+  /* @__PURE__ */
+  React.createElement(StyledCardMedia, null, imgContent, !imgContent && /* @__PURE__ */React.createElement(Media, {
+    src: imgSrc,
+    title: title
+  })), !onClick && /* @__PURE__ */React.createElement(StyledCardMedia, null, /* @__PURE__ */React.createElement(Media, {
+    src: imgSrc,
+    title: title
+  })), /* @__PURE__ */React.createElement(CardContent, null, children));
 }
 Card.propTypes = {
   /**

package/dist/esm/components/CardContent.js

@@ -1,14 +1,11 @@
 "use strict";
-import { jsx } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { StyledCardContent } from './CardContent.styled.js';
 
 function CardContent(_ref) {
   var children = _ref.children;
-  return /* @__PURE__ */jsx(StyledCardContent, {
-    children: children
-  });
+  return /* @__PURE__ */React.createElement(StyledCardContent, null, children);
 }
 CardContent.propTypes = {
   /**

package/dist/esm/components/Checkbox.js

@@ -1,6 +1,5 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
 import Stack from '@mui/material/Stack';
 import Box from './Box.js';
 import FormLabel from './FormLabel.js';
@@ -32,26 +31,22 @@ function Checkbox(_ref) {
     size: size,
     name: name
   }, rest);
-  return /* @__PURE__ */jsxs(Stack, {
+  return /* @__PURE__ */React.createElement(Stack, {
     direction: "row",
     gap: "10px",
-    alignItems: "flex-start",
-    children: [/* @__PURE__ */jsx(Box, {
-      children: /* @__PURE__ */jsx(StyledCheckbox, _objectSpread2(_objectSpread2({}, props), {}, {
-        disableRipple: true
-      }))
-    }), /* @__PURE__ */jsx(FormLabel, {
-      htmlFor: id,
-      size: size,
-      disabled: disabled,
-      margin: "none",
-      sx: {
-        mt: "2px",
-        fontWeight: "500"
-      },
-      children: label
-    })]
-  });
+    alignItems: "flex-start"
+  }, /* @__PURE__ */React.createElement(Box, null, /* @__PURE__ */React.createElement(StyledCheckbox, _objectSpread2(_objectSpread2({}, props), {}, {
+    disableRipple: true
+  }))), /* @__PURE__ */React.createElement(FormLabel, {
+    htmlFor: id,
+    size: size,
+    disabled: disabled,
+    margin: "none",
+    sx: {
+      mt: "2px",
+      fontWeight: "500"
+    }
+  }, label));
 }
 
 export { Checkbox as default };

package/dist/esm/components/CircularProgress.js

@@ -1,12 +1,11 @@
 "use strict";
 import { extends as _extends, objectDestructuringEmpty as _objectDestructuringEmpty, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import CircularProgress$1 from '@mui/material/CircularProgress';
 
 function CircularProgress(_ref) {
   var rest = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
-  return /* @__PURE__ */jsx(CircularProgress$1, _objectSpread2({}, rest));
+  return /* @__PURE__ */React.createElement(CircularProgress$1, _objectSpread2({}, rest));
 }
 
 export { CircularProgress as default };

package/dist/esm/components/CollapsedText.js

@@ -1,7 +1,6 @@
 "use strict";
 import { slicedToArray as _slicedToArray } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { useState, useEffect } from 'react';
+import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import Grid from '@mui/material/Grid';
 import { StyledCollapse, StyledButtonWrapper, StyledArrowDownIcon } from './CollapsedText.styled.js';
@@ -32,43 +31,35 @@ function CollapsedText(_ref) {
       setCollapsedSize(collapsedLines * lineHeight);
     }
   }, [collapsedLines, lineHeight]);
-  return /* @__PURE__ */jsxs(Fragment, {
-    children: [/* @__PURE__ */jsx(StyledCollapse, {
-      backgroundColor: backgroundColor,
-      collapsedSize: collapsedSize,
-      in: open,
-      lineHeight: lineHeight,
-      children: children
-    }), /* @__PURE__ */jsx(Grid, {
-      container: true,
-      justify: buttonJustify,
-      children: /* @__PURE__ */jsx(Grid, {
-        item: true,
-        children: /* @__PURE__ */jsx(StyledButtonWrapper, {
-          children: /* @__PURE__ */jsx(Button, {
-            color: "primaryAlt",
-            variant: "outlined",
-            size: "small",
-            onClick: function onClick() {
-              return setOpen(!open);
-            },
-            endIcon: buttonJustify === "flex-end" ? /* @__PURE__ */jsx(StyledArrowDownIcon, {
-              open: open
-            }) : null,
-            startIcon: buttonJustify !== "flex-end" ? /* @__PURE__ */jsx(StyledArrowDownIcon, {
-              open: open
-            }) : null,
-            children: function () {
-              if (buttonLabel && buttonLabel.open && buttonLabel.closed) {
-                return open ? buttonLabel.open : buttonLabel.closed;
-              }
-              return open ? "Less" : "More";
-            }()
-          })
-        })
-      })
-    })]
-  });
+  return /* @__PURE__ */React.createElement(React.Fragment, null, /* @__PURE__ */React.createElement(StyledCollapse, {
+    backgroundColor: backgroundColor,
+    collapsedSize: collapsedSize,
+    in: open,
+    lineHeight: lineHeight
+  }, children), /* @__PURE__ */React.createElement(Grid, {
+    container: true,
+    justify: buttonJustify
+  }, /* @__PURE__ */React.createElement(Grid, {
+    item: true
+  }, /* @__PURE__ */React.createElement(StyledButtonWrapper, null, /* @__PURE__ */React.createElement(Button, {
+    color: "primaryAlt",
+    variant: "outlined",
+    size: "small",
+    onClick: function onClick() {
+      return setOpen(!open);
+    },
+    endIcon: buttonJustify === "flex-end" ? /* @__PURE__ */React.createElement(StyledArrowDownIcon, {
+      open: open
+    }) : null,
+    startIcon: buttonJustify !== "flex-end" ? /* @__PURE__ */React.createElement(StyledArrowDownIcon, {
+      open: open
+    }) : null
+  }, function () {
+    if (buttonLabel && buttonLabel.open && buttonLabel.closed) {
+      return open ? buttonLabel.open : buttonLabel.closed;
+    }
+    return open ? "Less" : "More";
+  }())))));
 }
 CollapsedText.propTypes = {
   /**

package/dist/esm/components/Confirmation.js

@@ -1,5 +1,4 @@
 "use strict";
-import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
 import Button from './Button.js';
 import Heading from './Heading.js';
@@ -25,36 +24,30 @@ function Confirmation(_ref) {
     severity = _ref$severity === void 0 ? "default" : _ref$severity,
     _ref$title = _ref.title,
     title = _ref$title === void 0 ? "Are you sure?" : _ref$title;
-  var actions = /* @__PURE__ */jsxs(React.Fragment, {
-    children: [onCancel && cancelBtnText && /* @__PURE__ */jsx(Button, {
-      onClick: onCancel,
-      color: "primaryAlt",
-      variant: "outlined",
-      size: "small",
-      loading: cancelling,
-      children: cancelBtnText
-    }), onConfirm && confirmBtnText && /* @__PURE__ */jsx(Button, {
-      onClick: onConfirm,
-      color: severity === "default" ? "primary" : severity,
-      size: "small",
-      loading: confirming,
-      children: confirmBtnText
-    })]
-  });
-  return /* @__PURE__ */jsx(Modal, {
+  var actions = /* @__PURE__ */React.createElement(React.Fragment, null, onCancel && cancelBtnText && /* @__PURE__ */React.createElement(Button, {
+    onClick: onCancel,
+    color: "primaryAlt",
+    variant: "outlined",
+    size: "small",
+    loading: cancelling
+  }, cancelBtnText), onConfirm && confirmBtnText && /* @__PURE__ */React.createElement(Button, {
+    onClick: onConfirm,
+    color: severity === "default" ? "primary" : severity,
+    size: "small",
+    loading: confirming
+  }, confirmBtnText));
+  return /* @__PURE__ */React.createElement(Modal, {
     maxWidth: "xs",
     open: open,
-    heading: /* @__PURE__ */jsx(Heading, {
+    heading: /* @__PURE__ */React.createElement(Heading, {
       as: "h5",
-      gutterBottom: false,
-      children: title
-    }),
+      gutterBottom: false
+    }, title),
     actions: actions,
-    content: /* @__PURE__ */jsx(Text, {
+    content: /* @__PURE__ */React.createElement(Text, {
       as: "div",
-      variant: "body2",
-      children: message
-    })
+      variant: "body2"
+    }, message)
   });
 }
 

package/dist/esm/components/Container.js

@@ -1,7 +1,6 @@
 "use strict";
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
-import 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import MuiContainer from '@mui/material/Container';
 
@@ -9,9 +8,7 @@ var _excluded = ["children"];
 function Container(_ref) {
   var children = _ref.children,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /* @__PURE__ */jsx(MuiContainer, _objectSpread2(_objectSpread2({}, rest), {}, {
-    children: children
-  }));
+  return /* @__PURE__ */React.createElement(MuiContainer, _objectSpread2({}, rest), children);
 }
 Container.propTypes = {
   /**

package/dist/esm/components/CroppedImageInput.js

@@ -1,7 +1,6 @@
 "use strict";
 import { slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { useState, useRef, useEffect, useCallback, createElement } from 'react';
+import React, { useState, useRef, useEffect, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import useMediaQuery from '@mui/material/useMediaQuery';
 import { AnimatePresence, motion } from 'framer-motion';
@@ -278,172 +277,151 @@ function CroppedImageInput(_ref) {
     }
     return false;
   };
-  return /* @__PURE__ */jsxs(Fragment, {
-    children: [/* @__PURE__ */jsx(FileViewer, _objectSpread2(_objectSpread2({}, fileViewerProps), {}, {
-      file: {
-        url: documentFile,
-        filetype: filetype
-      },
-      open: viewDocument,
-      onClose: function onClose() {
-        return setViewDocument(false);
-      }
-    })), /* @__PURE__ */jsx(FormControl, {
-      name: name,
-      fullWidth: true,
-      label: label,
-      helperText: helperText,
-      helperTextPlacement: helperTextPlacement,
-      disabled: disabled,
-      required: required,
-      showError: showError,
-      errorMessage: errorMessage,
-      edges: edges,
-      children: /* @__PURE__ */jsxs("div", {
-        children: [/* @__PURE__ */createElement("input", _objectSpread2(_objectSpread2({
-          type: "hidden",
-          ref: input
-        }, inputProps), {}, {
-          key: "hidden-input"
-        })), saving || cancelling && /* @__PURE__ */jsx(StyledCircularProgress, {}, "loading"), /* @__PURE__ */jsxs(AnimatePresence, {
-          exitBeforeEnter: true,
-          children: [(croppedImage || documentFile) && !showError && /* @__PURE__ */createElement(StyledSavedImage, _objectSpread2(_objectSpread2({}, fade), {}, {
-            key: "saved-image",
-            edges: edges
-          }), /* @__PURE__ */jsxs(Grid, {
-            container: true,
-            alignItems: "center",
-            spacing: 5,
-            children: [/* @__PURE__ */jsxs(Grid, {
-              item: true,
-              xs: 12,
-              md: 11,
-              children: [croppedImage && /* @__PURE__ */jsx("img", {
-                src: croppedImage,
-                alt: ""
-              }), documentFile && /* @__PURE__ */jsx(Grid, {
-                item: true,
-                xs: 12,
-                md: 1,
-                style: {
-                  justifyContent: "center",
-                  alignItems: "center"
-                },
-                children: /* @__PURE__ */jsx(IconButton, {
-                  onClick: function onClick() {
-                    return setViewDocument(true);
-                  },
-                  children: /* @__PURE__ */jsx(StyledFileIcon, {})
-                })
-              })]
-            }), /* @__PURE__ */jsx(Grid, {
-              item: true,
-              xs: 12,
-              md: 1,
-              children: /* @__PURE__ */jsx(StyledDeleteIcon, {
-                children: /* @__PURE__ */jsx(DeleteIcon, {})
-              })
-            })]
-          })), !src && !documentFile && !croppedImage && (openInDialog ? /* @__PURE__ */createElement(motion.div, _objectSpread2(_objectSpread2({}, fade), {}, {
-            key: "upload-button"
-          }), /* @__PURE__ */jsx(FileUploadButton, {
-            onUpload: onDrop,
-            fullWidth: !isNotMobile,
-            children: dropzoneLabel
-          })) : /* @__PURE__ */createElement(motion.div, _objectSpread2(_objectSpread2({}, fade), {}, {
-            key: "dropzone"
-          }), /* @__PURE__ */jsx(DropZone, {
-            loading: loading,
-            disabled: disabled,
-            onDrop: onDrop,
-            edges: edges,
-            dropzoneLabel: dropzoneLabel,
-            dropzoneDescription: dropzoneDescription,
-            dropzoneProps: _objectSpread2(_objectSpread2({
-              accept: ["image/*"]
-            }, dropzoneProps), {}, {
-              maxFiles: 1
-            })
-          }))), src !== null && documentFile === null && (!croppedImage || showError) && (openInDialog ? /* @__PURE__ */jsxs(Modal, {
-            open: true,
-            fullWidth: true,
-            fullScreen: true,
-            children: [/* @__PURE__ */jsx(ModalHeader, {
-              onClose: handleCancel,
-              children: /* @__PURE__ */jsx(Heading, {
-                as: "h4",
-                children: "Crop Image"
-              })
-            }), /* @__PURE__ */jsx(ModalContent, {
-              children: /* @__PURE__ */jsxs(Box, {
-                pl: 2.5,
-                pr: 2.5,
-                pb: 2.5,
-                children: [/* @__PURE__ */jsx(StyledEditor, {
-                  edges: edges,
-                  showError: showError,
-                  children: /* @__PURE__ */jsx(ReactCrop, {
-                    crop: crop,
-                    style: {
-                      width: "100%"
-                    },
-                    onChange: handleCropChange,
-                    onImageLoaded: handleImageLoaded,
-                    renderSelectionAddon: cropGuide,
-                    children: /* @__PURE__ */jsx("img", {
-                      src: src,
-                      alt: ""
-                    })
-                  })
-                }), /* @__PURE__ */jsx(CroppedImageInputActions, {
-                  handleCancel: handleCancel,
-                  cancelling: cancelling,
-                  cancelButtonProps: cancelButtonProps,
-                  handleImageSave: handleImageSave,
-                  saving: saving,
-                  saveButtonProps: saveButtonProps,
-                  disabled: disabled
-                })]
-              })
-            })]
-          }) : /* @__PURE__ */createElement(motion.div, _objectSpread2(_objectSpread2({}, fade), {}, {
-            key: "editor"
-          }), /* @__PURE__ */jsx(StyledEditor, {
-            edges: edges,
-            showError: showError,
-            children: /* @__PURE__ */jsx(ReactCrop, {
-              crop: crop,
-              style: {
-                width: "100%"
-              },
-              onChange: handleCropChange,
-              renderSelectionAddon: cropGuide,
-              children: /* @__PURE__ */jsx("img", {
-                src: src,
-                alt: "",
-                onLoad: handleImageLoaded
-              })
-            })
-          })))]
-        })]
-      })
-    }, "form-control"), (!openInDialog && src !== null && (!croppedImage || showError) || !openInDialog && showActions) && /* @__PURE__ */jsx(CroppedImageInputActions, {
-      handleCancel: handleCancel,
-      cancelling: cancelling,
-      cancelButtonProps: cancelButtonProps,
-      handleImageSave: handleImageSave,
-      saving: saving,
-      saveButtonProps: saveButtonProps,
-      disabled: disabled
-    }), /* @__PURE__ */jsx(Confirmation, {
-      open: confirmDelete,
-      onCancel: function onCancel() {
-        return setConfirmDelete(false);
-      },
-      onConfirm: handleDelete,
-      message: "Are you sure you want to remove the attached image?"
-    })]
-  });
+  return /* @__PURE__ */React.createElement(React.Fragment, null, /* @__PURE__ */React.createElement(FileViewer, _objectSpread2(_objectSpread2({}, fileViewerProps), {}, {
+    file: {
+      url: documentFile,
+      filetype: filetype
+    },
+    open: viewDocument,
+    onClose: function onClose() {
+      return setViewDocument(false);
+    }
+  })), /* @__PURE__ */React.createElement(FormControl, {
+    key: "form-control",
+    name: name,
+    fullWidth: true,
+    label: label,
+    helperText: helperText,
+    helperTextPlacement: helperTextPlacement,
+    disabled: disabled,
+    required: required,
+    showError: showError,
+    errorMessage: errorMessage,
+    edges: edges
+  }, /* @__PURE__ */React.createElement("div", null, /* @__PURE__ */React.createElement("input", _objectSpread2(_objectSpread2({
+    type: "hidden",
+    ref: input
+  }, inputProps), {}, {
+    key: "hidden-input"
+  })), saving || cancelling && /* @__PURE__ */React.createElement(StyledCircularProgress, {
+    key: "loading"
+  }), /* @__PURE__ */React.createElement(AnimatePresence, {
+    exitBeforeEnter: true
+  }, (croppedImage || documentFile) && !showError && /* @__PURE__ */React.createElement(StyledSavedImage, _objectSpread2(_objectSpread2({}, fade), {}, {
+    key: "saved-image",
+    edges: edges
+  }), /* @__PURE__ */React.createElement(Grid, {
+    container: true,
+    alignItems: "center",
+    spacing: 5
+  }, /* @__PURE__ */React.createElement(Grid, {
+    item: true,
+    xs: 12,
+    md: 11
+  }, croppedImage && /* @__PURE__ */React.createElement("img", {
+    src: croppedImage,
+    alt: ""
+  }), documentFile && /* @__PURE__ */React.createElement(Grid, {
+    item: true,
+    xs: 12,
+    md: 1,
+    style: {
+      justifyContent: "center",
+      alignItems: "center"
+    }
+  }, /* @__PURE__ */React.createElement(IconButton, {
+    onClick: function onClick() {
+      return setViewDocument(true);
+    }
+  }, /* @__PURE__ */React.createElement(StyledFileIcon, null)))), /* @__PURE__ */React.createElement(Grid, {
+    item: true,
+    xs: 12,
+    md: 1
+  }, /* @__PURE__ */React.createElement(StyledDeleteIcon, null, /* @__PURE__ */React.createElement(DeleteIcon, null))))), !src && !documentFile && !croppedImage && (openInDialog ? /* @__PURE__ */React.createElement(motion.div, _objectSpread2(_objectSpread2({}, fade), {}, {
+    key: "upload-button"
+  }), /* @__PURE__ */React.createElement(FileUploadButton, {
+    onUpload: onDrop,
+    fullWidth: !isNotMobile
+  }, dropzoneLabel)) : /* @__PURE__ */React.createElement(motion.div, _objectSpread2(_objectSpread2({}, fade), {}, {
+    key: "dropzone"
+  }), /* @__PURE__ */React.createElement(DropZone, {
+    loading: loading,
+    disabled: disabled,
+    onDrop: onDrop,
+    edges: edges,
+    dropzoneLabel: dropzoneLabel,
+    dropzoneDescription: dropzoneDescription,
+    dropzoneProps: _objectSpread2(_objectSpread2({
+      accept: ["image/*"]
+    }, dropzoneProps), {}, {
+      maxFiles: 1
+    })
+  }))), src !== null && documentFile === null && (!croppedImage || showError) && (openInDialog ? /* @__PURE__ */React.createElement(Modal, {
+    open: true,
+    fullWidth: true,
+    fullScreen: true
+  }, /* @__PURE__ */React.createElement(ModalHeader, {
+    onClose: handleCancel
+  }, /* @__PURE__ */React.createElement(Heading, {
+    as: "h4"
+  }, "Crop Image")), /* @__PURE__ */React.createElement(ModalContent, null, /* @__PURE__ */React.createElement(Box, {
+    pl: 2.5,
+    pr: 2.5,
+    pb: 2.5
+  }, /* @__PURE__ */React.createElement(StyledEditor, {
+    edges: edges,
+    showError: showError
+  }, /* @__PURE__ */React.createElement(ReactCrop, {
+    crop: crop,
+    style: {
+      width: "100%"
+    },
+    onChange: handleCropChange,
+    onImageLoaded: handleImageLoaded,
+    renderSelectionAddon: cropGuide
+  }, /* @__PURE__ */React.createElement("img", {
+    src: src,
+    alt: ""
+  }))), /* @__PURE__ */React.createElement(CroppedImageInputActions, {
+    handleCancel: handleCancel,
+    cancelling: cancelling,
+    cancelButtonProps: cancelButtonProps,
+    handleImageSave: handleImageSave,
+    saving: saving,
+    saveButtonProps: saveButtonProps,
+    disabled: disabled
+  })))) : /* @__PURE__ */React.createElement(motion.div, _objectSpread2(_objectSpread2({}, fade), {}, {
+    key: "editor"
+  }), /* @__PURE__ */React.createElement(StyledEditor, {
+    edges: edges,
+    showError: showError
+  }, /* @__PURE__ */React.createElement(ReactCrop, {
+    crop: crop,
+    style: {
+      width: "100%"
+    },
+    onChange: handleCropChange,
+    renderSelectionAddon: cropGuide
+  }, /* @__PURE__ */React.createElement("img", {
+    src: src,
+    alt: "",
+    onLoad: handleImageLoaded
+  })))))))), (!openInDialog && src !== null && (!croppedImage || showError) || !openInDialog && showActions) && /* @__PURE__ */React.createElement(CroppedImageInputActions, {
+    handleCancel: handleCancel,
+    cancelling: cancelling,
+    cancelButtonProps: cancelButtonProps,
+    handleImageSave: handleImageSave,
+    saving: saving,
+    saveButtonProps: saveButtonProps,
+    disabled: disabled
+  }), /* @__PURE__ */React.createElement(Confirmation, {
+    open: confirmDelete,
+    onCancel: function onCancel() {
+      return setConfirmDelete(false);
+    },
+    onConfirm: handleDelete,
+    message: "Are you sure you want to remove the attached image?"
+  }));
 }
 CroppedImageInput.propTypes = {
   /**