@dreamcommerce/aurora 3.0.0-140 → 3.0.0-142

package/build/cjs/packages/aurora/src/components/color_picker/components/color_label_input.js

@@ -17,7 +17,8 @@ var ColorPickerInput = function ColorPickerInput(_ref) {
   var id = _ref.id,
     name = _ref.name,
     errors = _ref.errors,
-    disabled = _ref.disabled;
+    disabled = _ref.disabled,
+    preElement = _ref.preElement;
   var _useColorPicker = use_color_picker.useColorPicker(),
     hex = _useColorPicker.hex,
     color = _useColorPicker.color,
@@ -29,6 +30,7 @@ var ColorPickerInput = function ColorPickerInput(_ref) {
   var colorName = color.name ? "".concat(t(color.name)) : "# ".concat(hex === null || hex === void 0 ? void 0 : hex.toUpperCase());
   if (isCurrentValueGradient) colorName = gradientType === color_picker_constants.GRADIENT_TYPES.linear ? t('Linear gradient') : t('Radial gradient');
   return /*#__PURE__*/React__default['default'].createElement(input.Input, {
+    preElement: preElement,
     type: "text",
     id: id,
     name: name,

package/build/cjs/packages/aurora/src/components/color_picker/components/color_label_input.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,oEAAwE;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,oEAAwE;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_content.js

@@ -22,7 +22,7 @@ var ColorPickerContent = function ColorPickerContent() {
     isCurrentValueGradient = _useColorPicker.isCurrentValueGradient;
   var colorValue = typeof color === 'string' ? color : color.value;
   return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(color_picker_header.ColorPickerHeader, null), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "aurora-flex aurora-flex-col aurora-max-w-72 aurora-py-2 aurora-px-4 aurora-border-x"
+    className: "aurora-flex aurora-flex-col aurora-max-w-72 aurora-py-2 aurora-px-4 aurora-border-x aurora-bg-neutral-0"
   }, /*#__PURE__*/React__default['default'].createElement(color_picker_impl.ColorPickerImpl, {
     value: colorValue,
     onChange: setColor,

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_footer.js

@@ -33,7 +33,7 @@ var ColorPickerFooter = function ColorPickerFooter() {
     handleSave(color_picker_utils.ColorPickerUtils.getAllColorTypes(color));
   };
   return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "aurora-flex aurora-items-center aurora-justify-between aurora-gap-2 aurora-pt-2 aurora-pb-3 aurora-px-4 aurora-border aurora-rounded-b-16"
+    className: "aurora-flex aurora-items-center aurora-justify-between aurora-gap-2 aurora-pt-2 aurora-pb-3 aurora-px-4 aurora-border aurora-rounded-b-16 aurora-bg-neutral-0"
   }, /*#__PURE__*/React__default['default'].createElement(button.Button, {
     className: "aurora-capitalize aurora-flex-1",
     variant: "secondary",

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_gradient_controls/color_picker_gradient_angle.js

@@ -31,7 +31,7 @@ var ColorPickerGradientAngle = function ColorPickerGradientAngle() {
     onChange: function onChange(e) {
       return handleDegrees(e);
     },
-    className: '!aurora-h-5 !aurora-w-10 !aurora-px-1 !aurora-text-xs aurora-rounded-4 aurora-text-center'
+    className: '!aurora-h-[18px] !aurora-w-10 !aurora-px-1 !aurora-text-xs aurora-rounded-4 aurora-text-center'
   }), /*#__PURE__*/React__default['default'].createElement("div", {
     style: {
       position: 'absolute',

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_header.js

@@ -38,7 +38,7 @@ var ColorPickerHeader = function ColorPickerHeader() {
     };
   }, [isColorPickerOpened]);
   return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "aurora-flex aurora-items-center aurora-justify-between aurora-py-2 aurora-px-4 aurora-border aurora-rounded-t-16"
+    className: "aurora-flex aurora-items-center aurora-justify-between aurora-py-2 aurora-px-4 aurora-border aurora-rounded-t-16 aurora-bg-neutral-0"
   }, /*#__PURE__*/React__default['default'].createElement(typography.Typography, {
     size: "s",
     weight: "semibold"

package/build/cjs/packages/aurora/src/components/color_picker/components/color_picker_inputs/color_picker_inputs_rgba.js

@@ -20,7 +20,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
     alphaValue = _useColorPicker.alphaValue,
     rgbaArr = _useColorPicker.rgbaArr;
   return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(input.Input, {
-    className: "!aurora-h-6 !aurora-px-2 aurora-text-xs",
+    className: "!aurora-h-6 !aurora-px-1.5 aurora-text-xs",
     type: "text",
     value: rgbaArr[0],
     onChange: function onChange(e) {
@@ -28,7 +28,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
     },
     onKeyPress: utilities.InputUtils.preventTypingLetters
   }), /*#__PURE__*/React__default['default'].createElement(input.Input, {
-    className: "!aurora-h-6 !aurora-px-2 aurora-text-xs",
+    className: "!aurora-h-6 !aurora-px-1.5 aurora-text-xs",
     type: "text",
     value: rgbaArr[1],
     onChange: function onChange(e) {
@@ -36,7 +36,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
     },
     onKeyPress: utilities.InputUtils.preventTypingLetters
   }), /*#__PURE__*/React__default['default'].createElement(input.Input, {
-    className: "!aurora-h-6 !aurora-px-2 aurora-text-xs",
+    className: "!aurora-h-6 !aurora-px-1.5 aurora-text-xs",
     type: "text",
     value: rgbaArr[2],
     onChange: function onChange(e) {
@@ -44,7 +44,7 @@ var ColorPickerInputsRgba = function ColorPickerInputsRgba() {
     },
     onKeyPress: utilities.InputUtils.preventTypingLetters
   }), /*#__PURE__*/React__default['default'].createElement(input.Input, {
-    className: "!aurora-h-6 !aurora-px-2 aurora-text-xs",
+    className: "!aurora-h-6 !aurora-px-1.5 aurora-text-xs",
     type: "text",
     value: alphaValue,
     onChange: handleOnChangeAlpha,

package/build/cjs/packages/aurora/src/components/color_picker/components/pure_color_picker.js

@@ -42,20 +42,17 @@ var ColorPickerPure = function ColorPickerPure(_ref) {
       return setIsColorPickerOpened(true);
     },
     disabled: disabled
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "color-picker__input-container aurora-relative"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "aurora-absolute aurora-top-1.5 aurora-left-2.5"
-  }, /*#__PURE__*/React__default['default'].createElement(color_picker_swatch.ColorPickerSwatch, {
-    color: color_picker_utils.ColorPickerUtils.isGradient(colorValue) ? colorValue : color_picker_utils.ColorPickerUtils.getHexValue(colorTiny),
-    cssColor: color_picker_utils.ColorPickerUtils.isGradient(colorValue) ? colorValue : color_picker_utils.ColorPickerUtils.getHexValueString(colorTiny),
-    size: "big"
-  })), /*#__PURE__*/React__default['default'].createElement(color_label_input.ColorPickerInput, {
+  }, /*#__PURE__*/React__default['default'].createElement(color_label_input.ColorPickerInput, {
     id: id,
     name: name,
     errors: errors,
-    disabled: disabled
-  }))), /*#__PURE__*/React__default['default'].createElement(popover_content.PopoverContent, {
+    disabled: disabled,
+    preElement: /*#__PURE__*/React__default['default'].createElement(color_picker_swatch.ColorPickerSwatch, {
+      color: color_picker_utils.ColorPickerUtils.isGradient(colorValue) ? colorValue : color_picker_utils.ColorPickerUtils.getHexValue(colorTiny),
+      cssColor: color_picker_utils.ColorPickerUtils.isGradient(colorValue) ? colorValue : color_picker_utils.ColorPickerUtils.getHexValueString(colorTiny),
+      size: "big"
+    })
+  })), /*#__PURE__*/React__default['default'].createElement(popover_content.PopoverContent, {
     className: "aurora-mt-2 aurora-rounded-16 aurora-overflow-hidden"
   }, /*#__PURE__*/React__default['default'].createElement(color_picker_content.ColorPickerContent, null))));
 };

package/build/cjs/packages/aurora/src/components/color_picker/components/pure_color_picker.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/controls/input_control/input_control.js

@@ -15,7 +15,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var _excluded = ["id", "name", "label", "helperText", "preElement", "postElement", "errors", "disabled", "defaultValue", "value", "placeholder", "readOnly", "type", "required", "tooltip", "onChange", "onKeyDown", "onKeyUp"];
-var InputControl = function InputControl(_ref) {
+var InputControl = /*#__PURE__*/React__default['default'].forwardRef(function (_ref, ref) {
   var id = _ref.id,
     name = _ref.name,
     label$1 = _ref.label,
@@ -46,6 +46,7 @@ var InputControl = function InputControl(_ref) {
     tooltip: tooltip,
     disabled: disabled
   }, label$1))), /*#__PURE__*/React__default['default'].createElement(input.Input, _rollupPluginBabelHelpers.objectSpread2({
+    ref: ref,
     id: id,
     name: name,
     value: value,
@@ -63,7 +64,7 @@ var InputControl = function InputControl(_ref) {
   }, props)), helperText && /*#__PURE__*/React__default['default'].createElement(helper_text.HelperText, null, helperText), errors && /*#__PURE__*/React__default['default'].createElement(error_list.ErrorList, {
     errors: errors
   }));
-};
+});
 InputControl.displayName = 'InputControl';
 
 exports.InputControl = InputControl;

package/build/cjs/packages/aurora/src/components/controls/input_control/input_control.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/image_picker/components/image_picker_input.js

@@ -22,22 +22,12 @@ var ImagePickerInput = function ImagePickerInput(_ref) {
   var _useTranslation = useTranslation.useTranslation(),
     _useTranslation2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslation, 1),
     t = _useTranslation2[0];
-  var _useState = React.useState(false),
-    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
-    isHovered = _useState2[0],
-    setIsHovered = _useState2[1];
   return /*#__PURE__*/React__default['default'].createElement("label", {
     htmlFor: id,
     onDrop: onDropFile,
     onDragOver: onDragOver,
     onDragLeave: onDragLeave,
-    onMouseEnter: function onMouseEnter() {
-      return setIsHovered(true);
-    },
-    onMouseLeave: function onMouseLeave() {
-      return setIsHovered(false);
-    },
-    className: "aurora-relative aurora-flex aurora-items-center aurora-justify-center aurora-w-full aurora-h-full aurora-cursor-pointer aurora-p-1 aurora-pb-2"
+    className: "aurora-relative aurora-flex aurora-items-center aurora-justify-center aurora-w-full aurora-h-full aurora-cursor-pointer aurora-p-1 aurora-pb-2 aurora-group/imagePickerInput"
   }, isDragOver && (/*#__PURE__*/React__default['default'].createElement("div", {
     className: cn.cn('aurora-absolute aurora-inset-0 aurora-bg-neutral-0 aurora-border-2 aurora-border-primary aurora-rounded-8 aurora-z-1 aurora-pointer-events-none')
   }, /*#__PURE__*/React__default['default'].createElement("div", {
@@ -47,7 +37,7 @@ var ImagePickerInput = function ImagePickerInput(_ref) {
   }, "".concat(t('Drop file here')))))), /*#__PURE__*/React__default['default'].createElement("div", {
     className: cn.cn('aurora-flex aurora-flex-col aurora-items-center aurora-w-full aurora-h-full aurora-pt-4 aurora-pb-3 aurora-px-1')
   }, /*#__PURE__*/React__default['default'].createElement(upload_icon.UploadLineIcon, {
-    className: cn.cn('aurora-w-5 aurora-h-5 aurora-mb-2', isHovered ? 'aurora-fill-primary' : 'aurora-fill-subtle')
+    className: "aurora-w-5 aurora-h-5 aurora-fill-subtle group-hover/imagePickerInput:aurora-fill-primary aurora-mb-2"
   }), /*#__PURE__*/React__default['default'].createElement("div", {
     className: "aurora-text-xs aurora-text-interactive aurora-font-semibold"
   }, "".concat(t('Drag a file here or browse'))), /*#__PURE__*/React__default['default'].createElement("span", {

package/build/cjs/packages/aurora/src/components/image_picker/components/image_picker_input.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,oEAAwE;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,oEAAwE;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/input/input.js

@@ -49,11 +49,11 @@ var Input = /*#__PURE__*/React__default['default'].forwardRef(function (_ref, re
     }
   }, [preElement, postElement]);
   return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: cn.cn(input_variants.inputVariants(), errors && 'aurora-border-danger aurora-border-2', disabled && 'aurora-bg-subtle aurora-text-subtle-light aurora-pointer-events-none aurora-cursor-not-allowed', type === 'number' && 'aurora-appearance-none', className)
-  }, preElement && /*#__PURE__*/React__default['default'].createElement("div", {
+    className: cn.cn(input_variants.inputVariants(), errors && 'aurora-border-danger aurora-border-2', disabled && 'aurora-bg-subtle aurora-text-subtle-light aurora-pointer-events-none aurora-cursor-not-allowed', type === 'number' && 'aurora-appearance-none')
+  }, preElement && (/*#__PURE__*/React__default['default'].createElement("div", {
     ref: preElRef,
     className: 'aurora-absolute aurora-flex aurora-h-full aurora-items-center aurora-pointer-events-none aurora-pl-2'
-  }, preElement), /*#__PURE__*/React__default['default'].createElement("input", _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, props), {}, {
+  }, preElement)), /*#__PURE__*/React__default['default'].createElement("input", _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, props), {}, {
     ref: ref,
     id: id,
     name: name,
@@ -66,15 +66,15 @@ var Input = /*#__PURE__*/React__default['default'].forwardRef(function (_ref, re
     onKeyDown: onKeyDown,
     onKeyUp: onKeyUp,
     type: type,
-    className: "aurora-h-[40px] aurora-w-full focus:aurora-outline-none focus:aurora-shadow-none aurora-px-3 aurora-rounded-6",
+    className: cn.cn("aurora-h-[40px] aurora-w-full focus:aurora-outline-none focus:aurora-shadow-none aurora-px-3 aurora-rounded-6", className),
     style: {
-      paddingLeft: preElWidth ? "".concat(preElWidth, "px") : undefined,
-      paddingRight: postElWidth ? "".concat(postElWidth, "px") : undefined
+      paddingLeft: preElWidth ? "".concat(preElWidth, "px") : '',
+      paddingRight: postElWidth ? "".concat(postElWidth, "px") : ''
     }
-  })), postElement && /*#__PURE__*/React__default['default'].createElement("div", {
+  })), postElement && (/*#__PURE__*/React__default['default'].createElement("div", {
     ref: postElRef,
     className: "aurora-absolute aurora-flex aurora-h-full aurora-right-0 aurora-pr-2 aurora-items-center"
-  }, postElement));
+  }, postElement)));
 });
 Input.displayName = 'Input';
 

package/build/cjs/packages/aurora/src/components/modal/components/modal/modal.js

@@ -5,31 +5,33 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var cn = require('../../../../utilities/cn.js');
-var ReactDOM = require('react-dom');
 var use_click_outside = require('../../../../hooks/use_click_outside.js');
+var ReactDOM = require('react-dom');
 var modal_constants = require('../../modal_constants.js');
 var modal_footer = require('./modal_footer.js');
 var modal_header = require('./modal_header.js');
 var modal_variants = require('../../modal_variants.js');
 var use_modals_context = require('../../hooks/use_modals_context.js');
+var modal_utils = require('./modal_utils.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var Modal = function Modal(_ref) {
+  var _header$hasCloseIcon;
   var name = _ref.name,
     hideAllModalsOnClose = _ref.hideAllModalsOnClose,
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? modal_constants.MODAL_WIDTH_VARIANT.m : _ref$width,
-    _ref$hasCloseIcon = _ref.hasCloseIcon,
-    hasCloseIcon = _ref$hasCloseIcon === void 0 ? true : _ref$hasCloseIcon,
     onCloseAction = _ref.onCloseAction,
     header = _ref.header,
     footer = _ref.footer,
     children = _ref.children,
     _ref$closeOnOutsideCl = _ref.closeOnOutsideClick,
-    closeOnOutsideClick = _ref$closeOnOutsideCl === void 0 ? true : _ref$closeOnOutsideCl;
+    closeOnOutsideClick = _ref$closeOnOutsideCl === void 0 ? true : _ref$closeOnOutsideCl,
+    _ref$initiallyVisible = _ref.initiallyVisible,
+    initiallyVisible = _ref$initiallyVisible === void 0 ? false : _ref$initiallyVisible;
   var _useState = React.useState(false),
     _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
     visibleClass = _useState2[0],
@@ -47,6 +49,7 @@ var Modal = function Modal(_ref) {
     addModal = _useModalsContext.addModal,
     getModal = _useModalsContext.getModal,
     hideModal = _useModalsContext.hideModal,
+    showModal = _useModalsContext.showModal,
     hideAllModals = _useModalsContext.hideAllModals;
   var $modalsManagerContainer = document.querySelector(modalsManagerContainerSelector);
   var modalRef = /*#__PURE__*/React__default['default'].createRef();
@@ -56,6 +59,9 @@ var Modal = function Modal(_ref) {
     _useState8 = _rollupPluginBabelHelpers.slicedToArray(_useState7, 2),
     renderModal = _useState8[0],
     setRenderModal = _useState8[1];
+  var closeModal = function closeModal() {
+    hideAllModalsOnClose ? hideAllModals(onCloseAction) : hideModal(name, onCloseAction);
+  };
   var handleScroll = function handleScroll() {
     if (contentRef.current) {
       var _contentRef$current = contentRef.current,
@@ -95,6 +101,10 @@ var Modal = function Modal(_ref) {
       visibilityState: modal_constants.MODAL_VISIBILITY_STATE.none,
       width: width
     });
+    if (initiallyVisible) showModal(name);
+    return function () {
+      closeModal();
+    };
   }, []);
   React.useEffect(function () {
     var showModalTimeout;
@@ -119,9 +129,6 @@ var Modal = function Modal(_ref) {
       clearTimeout(hideModalTimeout);
     };
   }, [modal]);
-  var handleCloseModal = function handleCloseModal() {
-    hideAllModalsOnClose ? hideAllModals(onCloseAction) : hideModal(name, onCloseAction);
-  };
   if (!$modalsManagerContainer) return null;
   return renderModal ? /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/React__default['default'].createElement("div", {
     ref: modalRef,
@@ -130,21 +137,19 @@ var Modal = function Modal(_ref) {
     className: cn.cn(modal_variants.modalVariants({
       width: width
     }), visibleClass ? 'aurora-opacity-100 aurora-animate-modal-slide-in' : 'aurora-opacity-0 aurora-animate-modal-slide-out')
-  }, header && /*#__PURE__*/React__default['default'].createElement(modal_header.ModalHeader, {
-    hasCloseIcon: hasCloseIcon,
-    text: header.text,
-    onClose: handleCloseModal
-  }), children && (/*#__PURE__*/React__default['default'].createElement("div", {
+  }, header ? (/*#__PURE__*/React__default['default'].createElement(modal_header.ModalHeader, {
+    hasCloseIcon: modal_utils.ModalUtils.isHeaderObject(header) ? (_header$hasCloseIcon = header.hasCloseIcon) !== null && _header$hasCloseIcon !== void 0 ? _header$hasCloseIcon : true : true,
+    onClose: closeModal
+  }, modal_utils.ModalUtils.isHeaderObject(header) ? header.content : header)) : null, children && (/*#__PURE__*/React__default['default'].createElement("div", {
     ref: setContentRef,
     className: cn.cn("aurora-overflow-y-auto custom-scrollbar first:aurora-mt-6 last:aurora-mb-6 aurora-px-6", {
       'aurora-pb-6': footer && hasScroll
     })
-  }, children)), footer && (/*#__PURE__*/React__default['default'].createElement(modal_footer.ModalFooter, {
-    text: footer.text,
+  }, children)), footer ? (/*#__PURE__*/React__default['default'].createElement(modal_footer.ModalFooter, {
     className: cn.cn('', {
       'aurora-border-t': hasScroll && !isScrolledToBottom
     })
-  }))), $modalsManagerContainer) : null;
+  }, footer)) : null), $modalsManagerContainer) : null;
 };
 
 exports.Modal = Modal;

package/build/cjs/packages/aurora/src/components/modal/components/modal/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/modal/components/modal/modal_footer.js

@@ -10,12 +10,12 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var ModalFooter = function ModalFooter(_ref) {
-  var text = _ref.text,
-    className = _ref.className;
+  var className = _ref.className,
+    children = _ref.children;
   return /*#__PURE__*/React__default['default'].createElement("footer", {
     className: cn.cn('aurora-flex aurora-items-center aurora-justify-end aurora-gap-3 aurora-pt-5 aurora-pb-6 aurora-px-6', className),
     "data-test-id": "modal-footer"
-  }, text);
+  }, children);
 };
 
 exports.ModalFooter = ModalFooter;

package/build/cjs/packages/aurora/src/components/modal/components/modal/modal_header.js

@@ -10,16 +10,15 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var ModalHeader = function ModalHeader(_ref) {
-  var _ref$text = _ref.text,
-    text = _ref$text === void 0 ? '' : _ref$text,
-    onClose = _ref.onClose,
-    hasCloseIcon = _ref.hasCloseIcon;
+  var onClose = _ref.onClose,
+    hasCloseIcon = _ref.hasCloseIcon,
+    children = _ref.children;
   return /*#__PURE__*/React__default['default'].createElement("header", {
     className: 'aurora-flex aurora-items-center aurora-justify-between aurora-pt-6 aurora-pb-5 aurora-px-6 aurora-mb-6 aurora-border-b',
     "data-test-id": "modal-header"
-  }, /*#__PURE__*/React__default['default'].createElement("h3", {
+  }, children ? /*#__PURE__*/React__default['default'].createElement("h3", {
     className: "aurora-font-bold aurora-text-xl"
-  }, text), hasCloseIcon && /*#__PURE__*/React__default['default'].createElement(modal_close_icon.ModalCloseIcon, {
+  }, children) : null, hasCloseIcon && /*#__PURE__*/React__default['default'].createElement(modal_close_icon.ModalCloseIcon, {
     onClose: onClose
   }));
 };

package/build/cjs/packages/aurora/src/components/modal/components/modal/modal_header.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/modal/components/modal/modal_utils.js

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../../../../../_virtual/_rollupPluginBabelHelpers.js');
+
+var ModalUtils = /*#__PURE__*/function () {
+  function ModalUtils() {
+    _rollupPluginBabelHelpers.classCallCheck(this, ModalUtils);
+  }
+  return _rollupPluginBabelHelpers.createClass(ModalUtils, null, [{
+    key: "isHeaderObject",
+    value: function isHeaderObject(header) {
+      return header && _rollupPluginBabelHelpers['typeof'](header) === 'object' && header.content !== undefined;
+    }
+  }]);
+}();
+
+exports.ModalUtils = ModalUtils;
+//# sourceMappingURL=modal_utils.js.map

package/build/cjs/packages/aurora/src/components/modal/components/modal/modal_utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/segmented_control/components/segmented_control_item.js

@@ -24,7 +24,7 @@ var SegmentedControlItem = /*#__PURE__*/React__default['default'].forwardRef(fun
   var context = React__default['default'].useContext(segmented_control_context.SegmentedControlContext);
   return /*#__PURE__*/React__default['default'].createElement(ToggleGroupPrimitive.Item, _rollupPluginBabelHelpers.objectSpread2({
     ref: ref,
-    className: cn.cn("[&:not(:last-child)]:after:aurora-content-[''] focus last:aurora-rounded-r-4 first:aurora-rounded-l-4 [&:not(:last-child)]:after:aurora-absolute [&:not(:last-child)]:after:aurora-block [&:not(:last-child)]:after:aurora-w-px [&:not(:last-child)]:after:aurora-bg-active [&:not(:last-child)]:after:aurora--right-px [&:not(:last-child)]:after:aurora-h-3/6\n                aurora-relative aurora-flex aurora-item aurora-basis-full aurora-items-center aurora-justify-center aurora-gap-2 hover:aurora-bg-active aurora-cursor-pointer aurora-transition-[background-color] aurora-duration-300\n                data-[state=on]:aurora-bg data-[state=on]:aurora-font-semibold\n                data-[state=on]:before:aurora-content-[''] data-[state=on]:before:aurora-block data-[state=on]:before:aurora-absolute data-[state=on]:before:aurora--left-px data-[state=on]:before:aurora--right-px data-[state=on]:before:aurora--top-px data-[state=on]:before:aurora--bottom-px data-[state=on]:before:aurora-border-active data-[state=on]:before:aurora-border-2 data-[state=on]:before:aurora-rounded-4 data-[state=on]:before:aurora-z-10\n                [&[data-state=off]>svg]:!aurora-fill-subtle", segmented_control_item_variants.segmentedControlItemVariants({
+    className: cn.cn("[&:not(:last-child)]:after:aurora-content-[''] focus last:aurora-rounded-r-4 first:aurora-rounded-l-4 [&:not(:last-child)]:after:aurora-absolute [&:not(:last-child)]:after:aurora-block [&:not(:last-child)]:after:aurora-w-px [&:not(:last-child)]:after:aurora-bg-active [&:not(:last-child)]:after:aurora--right-px [&:not(:last-child)]:after:aurora-h-3/6\n                aurora-relative aurora-flex aurora-item aurora-basis-full aurora-items-center aurora-justify-center aurora-gap-2 hover:aurora-bg-active aurora-cursor-pointer aurora-transition-[background-color] aurora-duration-300\n                data-[state=on]:aurora-bg data-[state=on]:aurora-font-semibold\n                data-[state=on]:before:aurora-content-[''] data-[state=on]:before:aurora-block data-[state=on]:before:aurora-absolute data-[state=on]:before:aurora--left-px data-[state=on]:before:aurora--right-px data-[state=on]:before:aurora--top-px data-[state=on]:before:aurora--bottom-px data-[state=on]:before:aurora-border-active data-[state=on]:before:aurora-border-2 data-[state=on]:before:aurora-rounded-4 data-[state=on]:before:aurora-z-10\n                [&[data-state=off]_svg]:!aurora-fill-subtle", segmented_control_item_variants.segmentedControlItemVariants({
       size: (_context$size = context.size) !== null && _context$size !== void 0 ? _context$size : size,
       variant: (_context$variant = context.variant) !== null && _context$variant !== void 0 ? _context$variant : variant
     }), className)

package/build/cjs/packages/aurora/src/components/sidebar/components/persistent_sidebar.js

@@ -5,13 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var cn = require('../../../utilities/cn.js');
+var use_click_outside = require('../../../hooks/use_click_outside.js');
 var use_sidebar = require('../hooks/use_sidebar.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["className", "width", "children", "TriggerButton", "side", "onScroll"];
+var _excluded = ["className", "width", "children", "TriggerButton", "side", "onScroll", "onClickOutside"];
 var PersistentSidebar = /*#__PURE__*/React__default['default'].forwardRef(function (_ref, ref) {
   var className = _ref.className,
     width = _ref.width,
@@ -19,13 +20,30 @@ var PersistentSidebar = /*#__PURE__*/React__default['default'].forwardRef(functi
     TriggerButton = _ref.TriggerButton,
     side = _ref.side,
     onScroll = _ref.onScroll,
+    onClickOutside = _ref.onClickOutside,
     props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var _useSidebar = use_sidebar.useSidebar(),
-    open = _useSidebar.open;
+    open = _useSidebar.open,
+    toggle = _useSidebar.toggle,
+    close = _useSidebar.close;
   var sidebarRef = React.useRef(null);
+  var _ref2 = onClickOutside !== null && onClickOutside !== void 0 ? onClickOutside : {},
+    config = _ref2.config,
+    onClickOutsideCallback = _ref2.callback;
   React.useImperativeHandle(ref, function () {
     return sidebarRef.current;
   });
+  use_click_outside.useClickOutside({
+    refs: [sidebarRef],
+    callback: function callback() {
+      if (open) onClickOutsideCallback === null || onClickOutsideCallback === void 0 ? void 0 : onClickOutsideCallback({
+        open: open,
+        toggle: toggle,
+        close: close
+      });
+    },
+    config: config
+  });
   return /*#__PURE__*/React__default['default'].createElement("aside", _rollupPluginBabelHelpers.objectSpread2({
     "aria-expanded": open,
     className: cn.cn('aurora-relative aurora-transition-all aurora-duration-200'),

package/build/cjs/packages/aurora/src/components/sidebar/components/persistent_sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/sidebar/components/temporal_sidebar.js

@@ -6,15 +6,15 @@ var React = require('react');
 var _rollupPluginBabelHelpers = require('../../../../../../_virtual/_rollupPluginBabelHelpers.js');
 var cn = require('../../../utilities/cn.js');
 var sidebar_constants = require('../sidebar_constants.js');
+var use_click_outside = require('../../../hooks/use_click_outside.js');
 var use_sidebar = require('../hooks/use_sidebar.js');
 var ReactDOM = require('react-dom');
-var use_click_outside = require('../../../hooks/use_click_outside.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["children", "container", "className", "width", "side", "closeOnOutsideClick", "TriggerButton", "onScroll"];
+var _excluded = ["children", "container", "className", "width", "side", "closeOnOutsideClick", "onClickOutside", "TriggerButton", "onScroll"];
 var TemporalSidebar = /*#__PURE__*/React__default['default'].forwardRef(function (_ref, ref) {
   var children = _ref.children,
     _ref$container = _ref.container,
@@ -25,13 +25,15 @@ var TemporalSidebar = /*#__PURE__*/React__default['default'].forwardRef(function
     side = _ref$side === void 0 ? sidebar_constants.SIDEBAR_SIDE.left : _ref$side,
     _ref$closeOnOutsideCl = _ref.closeOnOutsideClick,
     closeOnOutsideClick = _ref$closeOnOutsideCl === void 0 ? true : _ref$closeOnOutsideCl,
+    onClickOutside = _ref.onClickOutside,
     TriggerButton = _ref.TriggerButton,
     onScroll = _ref.onScroll,
     props = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
   var _useSidebar = use_sidebar.useSidebar(),
     open = _useSidebar.open,
     close = _useSidebar.close,
-    defaultOpen = _useSidebar.defaultOpen;
+    defaultOpen = _useSidebar.defaultOpen,
+    toggle = _useSidebar.toggle;
   var sidebarRef = React.useRef(null);
   var _useState = React.useState(!open),
     _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
@@ -47,11 +49,20 @@ var TemporalSidebar = /*#__PURE__*/React__default['default'].forwardRef(function
     if (open && side == sidebar_constants.SIDEBAR_SIDE.right) (_sidebarRef$current6 = sidebarRef.current) === null || _sidebarRef$current6 === void 0 ? void 0 : _sidebarRef$current6.classList.add('aurora-translate-x-0');
     if (!open && side == sidebar_constants.SIDEBAR_SIDE.right) (_sidebarRef$current7 = sidebarRef.current) === null || _sidebarRef$current7 === void 0 ? void 0 : _sidebarRef$current7.classList.add('aurora-translate-x-full');
   };
+  var _ref2 = onClickOutside !== null && onClickOutside !== void 0 ? onClickOutside : {},
+    config = _ref2.config,
+    onClickOutsideCallback = _ref2.callback;
   use_click_outside.useClickOutside({
     refs: [sidebarRef],
     callback: function callback() {
+      if (open) onClickOutsideCallback === null || onClickOutsideCallback === void 0 ? void 0 : onClickOutsideCallback({
+        open: open,
+        toggle: toggle,
+        close: close
+      });
       if (closeOnOutsideClick && open) close();
-    }
+    },
+    config: config
   });
   React.useEffect(function () {
     if (!defaultOpen) return;

package/build/cjs/packages/aurora/src/components/sidebar/components/temporal_sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/aurora/src/components/xhr_image_picker/xhr_image_picker.js

@@ -187,7 +187,7 @@ var XhrImagePicker = function XhrImagePicker(_ref) {
     editedImageResult: imageEditorResult
   }), isLoading && (/*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(loader.Loader, null), /*#__PURE__*/React__default['default'].createElement("span", null, "".concat(t('Transfering file...')))))), !!ImageEditor && (/*#__PURE__*/React__default['default'].createElement(modal.Modal, {
     name: modalId,
-    header: t('Edit image'),
+    header: /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, t('Edit image')),
     width: "l"
   }, renderImageEditor({
     src: imageEditorSrc,

package/build/cjs/packages/aurora/src/hooks/use_click_outside.js

@@ -4,13 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 
-/**
- * adds listener on mousedown event which detects if click was inside elemnents provided in refs array. If click was
- * made outside element callback function is called
- * @param {Array<React.RefObject<HTMLElement>>} refs array of refs
- * @param {Function} callback called when click is made outside refs elements
- * @returns {void} void
- */
 function useClickOutside(_ref) {
   var refs = _ref.refs,
     config = _ref.config,
@@ -19,7 +12,9 @@ function useClickOutside(_ref) {
     _ref2$documents = _ref2.documents,
     documents = _ref2$documents === void 0 ? [globalThis.document] : _ref2$documents,
     _ref2$blackListSelect = _ref2.blackListSelectors,
-    blackListSelectors = _ref2$blackListSelect === void 0 ? [] : _ref2$blackListSelect;
+    blackListSelectors = _ref2$blackListSelect === void 0 ? [] : _ref2$blackListSelect,
+    _ref2$eventName = _ref2.eventName,
+    eventName = _ref2$eventName === void 0 ? 'click' : _ref2$eventName;
   function handleClickOutside(event) {
     var isBlacklisted = blackListSelectors.reduce(function test(acc, blackListSelector) {
       var $el = documents.reduce(function test(acc, doc) {
@@ -36,11 +31,11 @@ function useClickOutside(_ref) {
   }
   React.useEffect(function () {
     documents.forEach(function (document) {
-      return document.addEventListener('click', handleClickOutside, true);
+      return document.addEventListener(eventName, handleClickOutside, true);
     });
     return function () {
       documents.forEach(function (document) {
-        return document.removeEventListener('click', handleClickOutside, true);
+        return document.removeEventListener(eventName, handleClickOutside, true);
       });
     };
   });

package/build/cjs/packages/aurora/src/hooks/use_click_outside.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}