@majoo-ui/react 1.50.2-rc.3 → 1.50.2

package/components/pageDialog/PageDialog.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Dialog } from '../../';
 import { FocusScopeProps } from '@radix-ui/react-dialog';
+import { PointerDownOutsideEvent, FocusOutsideEvent } from '@radix-ui/react-dismissable-layer';
 import type { DialogContentProps } from '..';
 export declare const PageDialogFooter: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {
     sm: "(min-width: 359px)";
@@ -394,6 +395,9 @@ interface PageDialogProps extends IDialog, DialogContentProps {
     isMobile?: boolean | undefined;
     /** Set default behavior when opening dialog with form. Usually used with prevent default*/
     onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus'];
+    onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus'];
+    onPointerDownOutside?: (event: PointerDownOutsideEvent) => void;
+    onInteractOutside?: (event: PointerDownOutsideEvent | FocusOutsideEvent) => void;
 }
 /**
  * PageDialog are used to focus and display content that contains one specific task that requires interaction from the user and is separate from the main page.

package/index.esm.js

@@ -4783,6 +4783,9 @@ Image.defaultProps = {
 
 const _excluded$q = ["children", "label", "color", "css", "withClick", "side", "align"];
 var _jsxFileName$P = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\tooltip\\Tooltip.js";
+const {
+  zIndices: zIndices$1
+} = foundations;
 const slideUpAndFade$1 = keyframes({
   '0%': {
     opacity: 0,
@@ -4824,6 +4827,7 @@ const slideLeftAndFade$1 = keyframes({
   }
 });
 const StyledContent$6 = styled(TooltipPrimitive.Content, {
+  zIndex: zIndices$1.tooltip,
   borderRadius: 8,
   padding: '8px',
   fontSize: '$helper',
@@ -4899,7 +4903,7 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 89,
+      lineNumber: 91,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(TooltipBase, _extends({}, rest, {
@@ -4907,7 +4911,7 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 90,
+      lineNumber: 92,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(TooltipTrigger, {
@@ -4915,7 +4919,7 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 91,
+      lineNumber: 93,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(TriggerSpan, {
@@ -4923,14 +4927,14 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 92,
+      lineNumber: 94,
       columnNumber: 11
     }
   }, children)), /*#__PURE__*/React__default.createElement(TooltipPrimitive.Portal, {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 94,
+      lineNumber: 96,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(StyledContent$6, {
@@ -4941,7 +4945,7 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 95,
+      lineNumber: 97,
       columnNumber: 11
     }
   }, label, /*#__PURE__*/React__default.createElement(StyledArrow$1, {
@@ -4950,7 +4954,7 @@ const Tooltip$1 = _ref => {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 102,
+      lineNumber: 104,
       columnNumber: 13
     }
   })))));
@@ -4972,7 +4976,7 @@ Tooltip$1.defaultProps = {
     __self: undefined,
     __source: {
       fileName: _jsxFileName$P,
-      lineNumber: 123,
+      lineNumber: 125,
       columnNumber: 13
     }
   })
@@ -14985,11 +14989,11 @@ const NativeTimePicker = ({
 
   return /*#__PURE__*/React__default.createElement(Flex$1, {
     direction: "column",
-    gap: size === 'sm' ? 4 : 5,
     align: "center",
     justify: "center",
     css: {
-      width: 'fit-content'
+      width: 'fit-content',
+      gap: size === 'sm' ? 14 : 18
     },
     __self: undefined,
     __source: {
@@ -15003,7 +15007,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 160,
+      lineNumber: 165,
       columnNumber: 7
     }
   }, /*#__PURE__*/React__default.createElement(IconStateFull$1, {
@@ -15013,7 +15017,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 161,
+      lineNumber: 166,
       columnNumber: 9
     }
   }), /*#__PURE__*/React__default.createElement(IconStateFull$1, {
@@ -15023,7 +15027,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 162,
+      lineNumber: 167,
       columnNumber: 9
     }
   })), /*#__PURE__*/React__default.createElement(Input$3, {
@@ -15034,7 +15038,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 164,
+      lineNumber: 169,
       columnNumber: 7
     }
   }), /*#__PURE__*/React__default.createElement(Time, {
@@ -15042,7 +15046,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 165,
+      lineNumber: 170,
       columnNumber: 7
     }
   }, moment(date).format(format)), /*#__PURE__*/React__default.createElement(Flex$1, {
@@ -15051,7 +15055,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 166,
+      lineNumber: 171,
       columnNumber: 7
     }
   }, /*#__PURE__*/React__default.createElement(IconStateFull$1, {
@@ -15061,7 +15065,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 167,
+      lineNumber: 172,
       columnNumber: 9
     }
   }), /*#__PURE__*/React__default.createElement(IconStateFull$1, {
@@ -15071,7 +15075,7 @@ const NativeTimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 168,
+      lineNumber: 173,
       columnNumber: 9
     }
   })));
@@ -15127,7 +15131,7 @@ const TimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 203,
+      lineNumber: 208,
       columnNumber: 5
     }
   }, /*#__PURE__*/React__default.createElement(NativeTimePicker, {
@@ -15141,7 +15145,7 @@ const TimePicker = ({
     __self: undefined,
     __source: {
       fileName: _jsxFileName$k,
-      lineNumber: 204,
+      lineNumber: 209,
       columnNumber: 7
     }
   }));
@@ -15214,7 +15218,7 @@ function InputTimePicker({
   const isMobile = useMediaQuery(`(max-width: 480px)`);
 
   function handleChange() {
-    if (!disabled) {
+    if (!disabled && !readOnly) {
       setOpenPicker(!openPicker);
     }
   }
@@ -15249,8 +15253,9 @@ function InputTimePicker({
     placeholder: placeholder,
     value: getInputPickerValue$1(value),
     defaultValue: defaultValue,
-    isPicker: true,
-    tabIndex: "-1",
+    onChange: () => {},
+    isPicker: true // tabIndex="-1"
+    ,
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
@@ -15270,7 +15275,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 54,
+      lineNumber: 55,
       columnNumber: 5
     }
   });
@@ -15282,22 +15287,22 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 66,
+      lineNumber: 67,
       columnNumber: 5
     }
-  }, disabled ? /*#__PURE__*/React__default.createElement(Box, {
+  }, disabled || readOnly ? /*#__PURE__*/React__default.createElement(Box, {
     css: css,
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 68,
+      lineNumber: 69,
       columnNumber: 9
     }
   }, renderInputGroup()) : /*#__PURE__*/React__default.createElement(PopoverTrigger, {
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 70,
+      lineNumber: 71,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Box, {
@@ -15305,14 +15310,14 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 71,
+      lineNumber: 72,
       columnNumber: 11
     }
   }, renderInputGroup())), /*#__PURE__*/React__default.createElement(PopoverContent, {
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 74,
+      lineNumber: 75,
       columnNumber: 7
     }
   }, renderTimePicker())) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Box, {
@@ -15320,7 +15325,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 78,
+      lineNumber: 79,
       columnNumber: 7
     }
   }, renderInputGroup()), /*#__PURE__*/React__default.createElement(Drawer, {
@@ -15330,7 +15335,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 79,
+      lineNumber: 80,
       columnNumber: 7
     }
   }, /*#__PURE__*/React__default.createElement(DrawerContent, {
@@ -15341,7 +15346,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 80,
+      lineNumber: 81,
       columnNumber: 9
     }
   }, /*#__PURE__*/React__default.createElement(Flex$1, {
@@ -15353,7 +15358,7 @@ function InputTimePicker({
     __self: this,
     __source: {
       fileName: _jsxFileName$j,
-      lineNumber: 86,
+      lineNumber: 87,
       columnNumber: 11
     }
   }, renderTimePicker()))));
@@ -15845,7 +15850,7 @@ function InputDatePicker({
   const isMobile = useMediaQuery(`(max-width: ${type === SINGLE_PICKER ? '480px' : '767px'})`);
 
   function handleChange() {
-    if (!disabled) {
+    if (!disabled && !readOnly) {
       setOpenPicker(!openPicker);
     }
   }
@@ -15905,7 +15910,7 @@ function InputDatePicker({
     onOpenChange: setOpenPicker,
     placement: placement
   }, {
-    children: [disabled ? jsx(Box, Object.assign({
+    children: [disabled || readOnly ? jsx(Box, Object.assign({
       css: css
     }, {
       children: renderInputGroup()
@@ -18312,9 +18317,12 @@ const PageDialog = props => {
     css,
     layer,
     isMobile: _isMobile,
-    onOpenAutoFocus
+    onOpenAutoFocus,
+    onCloseAutoFocus,
+    onPointerDownOutside,
+    onInteractOutside
   } = props,
-        rest = __rest(props, ["children", "size", "css", "layer", "isMobile", "onOpenAutoFocus"]);
+        rest = __rest(props, ["children", "size", "css", "layer", "isMobile", "onOpenAutoFocus", "onCloseAutoFocus", "onPointerDownOutside", "onInteractOutside"]);
 
   const childArray = React__default.Children.toArray(children);
   const footerChildren = findNodeChild(childArray, 'PageDialogFooter');
@@ -18347,9 +18355,27 @@ const PageDialog = props => {
             onOpenAutoFocus(e);
           }
         },
-        onCloseAutoFocus: e => e.preventDefault(),
-        onPointerDownOutside: e => e.preventDefault(),
-        onInteractOutside: e => e.preventDefault()
+        onCloseAutoFocus: e => {
+          if (!onCloseAutoFocus) {
+            e.preventDefault();
+          } else {
+            onCloseAutoFocus(e);
+          }
+        },
+        onPointerDownOutside: e => {
+          if (!onPointerDownOutside) {
+            e.preventDefault();
+          } else {
+            onPointerDownOutside(e);
+          }
+        },
+        onInteractOutside: e => {
+          if (!onInteractOutside) {
+            e.preventDefault();
+          } else {
+            onInteractOutside(e);
+          }
+        }
       }, {
         children: jsxs(Box, Object.assign({
           css: {

package/index.umd.js

@@ -4865,6 +4865,9 @@
 
   const _excluded$q = ["children", "label", "color", "css", "withClick", "side", "align"];
   var _jsxFileName$P = "C:\\Users\\Lenovo\\Documents\\code\\majoo\\majoo-ui\\packages\\react\\src\\components\\tooltip\\Tooltip.js";
+  const {
+    zIndices: zIndices$1
+  } = core.foundations;
   const slideUpAndFade$1 = keyframes({
     '0%': {
       opacity: 0,
@@ -4906,6 +4909,7 @@
     }
   });
   const StyledContent$6 = styled(TooltipPrimitive__namespace.Content, {
+    zIndex: zIndices$1.tooltip,
     borderRadius: 8,
     padding: '8px',
     fontSize: '$helper',
@@ -4981,7 +4985,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$P,
-        lineNumber: 89,
+        lineNumber: 91,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(TooltipBase, _extends({}, rest, {
@@ -4989,7 +4993,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$P,
-        lineNumber: 90,
+        lineNumber: 92,
         columnNumber: 7
       }
     }), /*#__PURE__*/React__default["default"].createElement(TooltipTrigger, {
@@ -4997,7 +5001,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$P,
-        lineNumber: 91,
+        lineNumber: 93,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(TriggerSpan, {
@@ -5005,14 +5009,14 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$P,
-        lineNumber: 92,
+        lineNumber: 94,
         columnNumber: 11
       }
     }, children)), /*#__PURE__*/React__default["default"].createElement(TooltipPrimitive__namespace.Portal, {
       __self: undefined,
       __source: {
         fileName: _jsxFileName$P,
-        lineNumber: 94,
+        lineNumber: 96,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(StyledContent$6, {
@@ -5023,7 +5027,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$P,
-        lineNumber: 95,
+        lineNumber: 97,
         columnNumber: 11
       }
     }, label, /*#__PURE__*/React__default["default"].createElement(StyledArrow$1, {
@@ -5032,7 +5036,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$P,
-        lineNumber: 102,
+        lineNumber: 104,
         columnNumber: 13
       }
     })))));
@@ -5054,7 +5058,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$P,
-        lineNumber: 123,
+        lineNumber: 125,
         columnNumber: 13
       }
     })
@@ -15231,11 +15235,11 @@
 
     return /*#__PURE__*/React__default["default"].createElement(Flex$1, {
       direction: "column",
-      gap: size === 'sm' ? 4 : 5,
       align: "center",
       justify: "center",
       css: {
-        width: 'fit-content'
+        width: 'fit-content',
+        gap: size === 'sm' ? 14 : 18
       },
       __self: undefined,
       __source: {
@@ -15249,7 +15253,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 160,
+        lineNumber: 165,
         columnNumber: 7
       }
     }, /*#__PURE__*/React__default["default"].createElement(IconStateFull$1, {
@@ -15259,7 +15263,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 161,
+        lineNumber: 166,
         columnNumber: 9
       }
     }), /*#__PURE__*/React__default["default"].createElement(IconStateFull$1, {
@@ -15269,7 +15273,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 162,
+        lineNumber: 167,
         columnNumber: 9
       }
     })), /*#__PURE__*/React__default["default"].createElement(Input$3, {
@@ -15280,7 +15284,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 164,
+        lineNumber: 169,
         columnNumber: 7
       }
     }), /*#__PURE__*/React__default["default"].createElement(Time, {
@@ -15288,7 +15292,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 165,
+        lineNumber: 170,
         columnNumber: 7
       }
     }, moment__default["default"](date).format(format)), /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -15297,7 +15301,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 166,
+        lineNumber: 171,
         columnNumber: 7
       }
     }, /*#__PURE__*/React__default["default"].createElement(IconStateFull$1, {
@@ -15307,7 +15311,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 167,
+        lineNumber: 172,
         columnNumber: 9
       }
     }), /*#__PURE__*/React__default["default"].createElement(IconStateFull$1, {
@@ -15317,7 +15321,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 168,
+        lineNumber: 173,
         columnNumber: 9
       }
     })));
@@ -15373,7 +15377,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 203,
+        lineNumber: 208,
         columnNumber: 5
       }
     }, /*#__PURE__*/React__default["default"].createElement(NativeTimePicker, {
@@ -15387,7 +15391,7 @@
       __self: undefined,
       __source: {
         fileName: _jsxFileName$k,
-        lineNumber: 204,
+        lineNumber: 209,
         columnNumber: 7
       }
     }));
@@ -15460,7 +15464,7 @@
     const isMobile = useMediaQuery(`(max-width: 480px)`);
 
     function handleChange() {
-      if (!disabled) {
+      if (!disabled && !readOnly) {
         setOpenPicker(!openPicker);
       }
     }
@@ -15495,8 +15499,9 @@
       placeholder: placeholder,
       value: getInputPickerValue$1(value),
       defaultValue: defaultValue,
-      isPicker: true,
-      tabIndex: "-1",
+      onChange: () => {},
+      isPicker: true // tabIndex="-1"
+      ,
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
@@ -15516,7 +15521,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 54,
+        lineNumber: 55,
         columnNumber: 5
       }
     });
@@ -15528,22 +15533,22 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 66,
+        lineNumber: 67,
         columnNumber: 5
       }
-    }, disabled ? /*#__PURE__*/React__default["default"].createElement(Box, {
+    }, disabled || readOnly ? /*#__PURE__*/React__default["default"].createElement(Box, {
       css: css,
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 68,
+        lineNumber: 69,
         columnNumber: 9
       }
     }, renderInputGroup()) : /*#__PURE__*/React__default["default"].createElement(PopoverTrigger, {
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 70,
+        lineNumber: 71,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(Box, {
@@ -15551,14 +15556,14 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 71,
+        lineNumber: 72,
         columnNumber: 11
       }
     }, renderInputGroup())), /*#__PURE__*/React__default["default"].createElement(PopoverContent, {
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 74,
+        lineNumber: 75,
         columnNumber: 7
       }
     }, renderTimePicker())) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Box, {
@@ -15566,7 +15571,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 78,
+        lineNumber: 79,
         columnNumber: 7
       }
     }, renderInputGroup()), /*#__PURE__*/React__default["default"].createElement(Drawer, {
@@ -15576,7 +15581,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 79,
+        lineNumber: 80,
         columnNumber: 7
       }
     }, /*#__PURE__*/React__default["default"].createElement(DrawerContent, {
@@ -15587,7 +15592,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 80,
+        lineNumber: 81,
         columnNumber: 9
       }
     }, /*#__PURE__*/React__default["default"].createElement(Flex$1, {
@@ -15599,7 +15604,7 @@
       __self: this,
       __source: {
         fileName: _jsxFileName$j,
-        lineNumber: 86,
+        lineNumber: 87,
         columnNumber: 11
       }
     }, renderTimePicker()))));
@@ -16115,7 +16120,7 @@
     var isMobile = useMediaQuery("(max-width: ".concat(type === SINGLE_PICKER ? '480px' : '767px', ")"));
 
     function handleChange() {
-      if (!disabled) {
+      if (!disabled && !readOnly) {
         setOpenPicker(!openPicker);
       }
     }
@@ -16181,7 +16186,7 @@
       onOpenChange: setOpenPicker,
       placement: placement
     }, {
-      children: [disabled ? jsxRuntime.jsx(Box, __assign({
+      children: [disabled || readOnly ? jsxRuntime.jsx(Box, __assign({
         css: css
       }, {
         children: renderInputGroup()
@@ -18646,7 +18651,10 @@
         layer = props.layer,
         _isMobile = props.isMobile,
         onOpenAutoFocus = props.onOpenAutoFocus,
-        rest = __rest(props, ["children", "size", "css", "layer", "isMobile", "onOpenAutoFocus"]);
+        onCloseAutoFocus = props.onCloseAutoFocus,
+        onPointerDownOutside = props.onPointerDownOutside,
+        onInteractOutside = props.onInteractOutside,
+        rest = __rest(props, ["children", "size", "css", "layer", "isMobile", "onOpenAutoFocus", "onCloseAutoFocus", "onPointerDownOutside", "onInteractOutside"]);
 
     var childArray = React__default["default"].Children.toArray(children);
     var footerChildren = findNodeChild(childArray, 'PageDialogFooter');
@@ -18680,13 +18688,25 @@
             }
           },
           onCloseAutoFocus: function (e) {
-            return e.preventDefault();
+            if (!onCloseAutoFocus) {
+              e.preventDefault();
+            } else {
+              onCloseAutoFocus(e);
+            }
           },
           onPointerDownOutside: function (e) {
-            return e.preventDefault();
+            if (!onPointerDownOutside) {
+              e.preventDefault();
+            } else {
+              onPointerDownOutside(e);
+            }
           },
           onInteractOutside: function (e) {
-            return e.preventDefault();
+            if (!onInteractOutside) {
+              e.preventDefault();
+            } else {
+              onInteractOutside(e);
+            }
           }
         }, {
           children: jsxRuntime.jsxs(Box, __assign({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@majoo-ui/react",
-  "version": "1.50.2-rc.3",
+  "version": "1.50.2",
   "dependencies": {
     "@majoo-ui/core": "^1.31.1",
     "@majoo-ui/helpers": "^1.30.5",