@cube-dev/ui-kit 0.16.0 → 0.16.1

package/es/components/forms/Slider/Slider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/Slider/SliderBase.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/Slider/SliderInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/Slider/SliderThumb.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/Slider/SliderTrack.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/Slider/elements.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/Slider/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/Slider/types.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/Switch/Switch.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/TextArea/TextArea.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/TextInput/TextInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/TextInput/TextInputBase.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/forms/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/layout/Flex.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/layout/Flow.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/layout/Grid.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/layout/Prefix.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/layout/Space.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/layout/Suffix.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/navigation/LegacyTabs/LegacyTabs.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/navigation/Link/Link.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/organisms/FileTabs/FileTabs.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/organisms/Modal/Modal.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/organisms/StatsCard/StatsCard.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/other/Base64Upload/Base64Upload.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/other/CloudLogo/CloudLogo.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/AlertDialog/AlertDialog.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/AlertDialog/AlertDialogApiProvider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/AlertDialog/AlertDialogZone.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/AlertDialog/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/AlertDialog/types.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/Dialog/Dialog.js

@@ -1,21 +1,23 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from 'styled-components';
 import { useDOMRef } from '@react-spectrum/utils';
 import { DismissButton } from '@react-aria/overlays';
-import { FocusScope } from '@react-aria/focus';
 import { forwardRef } from 'react';
 import { useDialog } from '@react-aria/dialog';
 import { useMessageFormatter } from '@react-aria/i18n';
 import { CloseOutlined } from '@ant-design/icons';
+import FocusLock from 'react-focus-lock';
 import { BASE_STYLES, BLOCK_STYLES, DIMENSION_STYLES, extractStyles, tasty, } from '../../../tasty';
 import { mergeProps, SlotProvider } from '../../../utils/react';
 import { Button } from '../../actions';
+import { useOpenTransitionContext } from '../Modal/OpenTransition';
 import { useDialogContext } from './context';
 const STYLES_LIST = [...BASE_STYLES, ...DIMENSION_STYLES, ...BLOCK_STYLES];
 const DialogElement = tasty({
@@ -72,6 +74,9 @@ const DialogElement = tasty({
         '@dialog-content-gap': '3x',
     },
 });
+const StyledFocusLock = styled(FocusLock) `
+  display: contents;
+`;
 const CLOSE_BUTTON_STYLES = {
     display: 'flex',
     position: 'absolute',
@@ -102,6 +107,11 @@ const intlMessages = {
  * Depending on the kind of Dialog, further interactions may be blocked until the Dialog is acknowledged.
  */
 export const Dialog = forwardRef(function Dialog(props, ref) {
+    const transitionContext = useOpenTransitionContext();
+    const isEntered = transitionContext?.transitionState === 'entered';
+    return (_jsx(StyledFocusLock, { returnFocus: true, disabled: !isEntered, children: _jsx(DialogContent, { ...props, ref: ref }, "content") }, void 0));
+});
+const DialogContent = forwardRef(function DialogContent(props, ref) {
     let { type = 'modal', ...contextProps } = useDialogContext();
     let { qa, children, size = 'S', isDismissable = contextProps.isDismissable, onDismiss = contextProps.onClose, closeIcon, closeButtonStyles, ...otherProps } = props;
     size = sizeMap[size.toUpperCase()] || size;
@@ -109,7 +119,6 @@ export const Dialog = forwardRef(function Dialog(props, ref) {
     let formatMessage = useMessageFormatter(intlMessages);
     let domRef = useDOMRef(ref);
     let { dialogProps, titleProps } = useDialog(mergeProps(contextProps, props), domRef);
-    // console.log(dialogProps);
     // If rendered in a popover or tray there won't be a visible dismiss button,
     // so we render a hidden one for screen readers.
     let dismissButton;
@@ -158,7 +167,7 @@ export const Dialog = forwardRef(function Dialog(props, ref) {
             },
         },
     };
-    return (_jsx(FocusScope, { contain: true, restoreFocus: true, children: _jsxs(DialogElement, { ref: domRef, "data-id": "Dialog", "data-qa": qa || 'Dialog', styles: styles, as: "section", ...dialogProps, mods: { dismissable: isDismissable }, style: { '--dialog-size': `${sizePxMap[size] || 288}px` }, "data-type": type, "data-size": size, children: [dismissButton, _jsxs(SlotProvider, { slots: slots, children: [isDismissable && (_jsx(Button, { qa: "ModalCloseButton", type: "neutral", styles: CLOSE_BUTTON_STYLES, icon: closeIcon || _jsx(CloseOutlined, {}, void 0), label: formatMessage('dismiss'), onPress: () => onDismiss && onDismiss() }, void 0)), children] }, void 0)] }, void 0) }, void 0));
+    return (_jsxs(DialogElement, { ref: domRef, "data-id": "Dialog", "data-qa": qa || 'Dialog', styles: styles, as: "section", ...dialogProps, mods: { dismissable: isDismissable }, style: { '--dialog-size': `${sizePxMap[size] || 288}px` }, "data-type": type, "data-size": size, children: [dismissButton, _jsxs(SlotProvider, { slots: slots, children: [isDismissable && (_jsx(Button, { qa: "ModalCloseButton", type: "neutral", styles: CLOSE_BUTTON_STYLES, icon: closeIcon || _jsx(CloseOutlined, {}, void 0), label: formatMessage('dismiss'), onPress: () => onDismiss && onDismiss() }, void 0)), children] }, void 0)] }, void 0));
 });
 
         

package/es/components/overlays/Dialog/DialogContainer.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/Dialog/DialogForm.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/Dialog/DialogTrigger.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 
@@ -14,7 +14,7 @@ import { useOverlayPosition, useOverlayTrigger } from '@react-aria/overlays';
 import { Modal, Popover, Tray } from '../Modal';
 import { DialogContext } from './context';
 function DialogTrigger(props) {
-    let { children, type = 'modal', mobileType = type === 'popover' ? 'modal' : type, hideArrow, targetRef, onDismiss, isDismissable = true, isKeyboardDismissDisabled, styles, mobileViewport = 700, ...positionProps } = props;
+    let { children, type = 'modal', mobileType = type === 'popover' ? 'modal' : type, hideArrow, targetRef, onDismiss, isDismissable = true, isKeyboardDismissDisabled, styles, mobileViewport = 700, hideOnClose, ...positionProps } = props;
     if (!Array.isArray(children) || children.length > 2) {
         throw new Error('DialogTrigger must have exactly 2 children');
     }
@@ -51,7 +51,7 @@ function DialogTrigger(props) {
         }
     }
     if (type === 'popover') {
-        return (_jsx(PopoverTrigger, { ...positionProps, state: state, targetRef: targetRef, trigger: trigger, content: content, isKeyboardDismissDisabled: isKeyboardDismissDisabled, hideArrow: hideArrow, onClose: onClose }, void 0));
+        return (_jsx(PopoverTrigger, { ...positionProps, hideOnClose: hideOnClose, state: state, targetRef: targetRef, trigger: trigger, content: content, isKeyboardDismissDisabled: isKeyboardDismissDisabled, hideArrow: hideArrow, onClose: onClose }, void 0));
     }
     let renderOverlay = () => {
         switch (type) {
@@ -59,9 +59,9 @@ function DialogTrigger(props) {
             case 'fullscreen':
             case 'fullscreenTakeover':
             case 'modal':
-                return (_jsx(Modal, { isOpen: state.isOpen, isDismissable: isDismissable, type: type, isKeyboardDismissDisabled: isKeyboardDismissDisabled, styles: styles, onClose: onClose, onExiting: onExiting, onExited: onExited, children: typeof content === 'function' ? content(state.close) : content }, void 0));
+                return (_jsx(Modal, { hideOnClose: hideOnClose, isOpen: state.isOpen, isDismissable: isDismissable, type: type, isKeyboardDismissDisabled: isKeyboardDismissDisabled, styles: styles, onClose: onClose, onExiting: onExiting, onExited: onExited, children: typeof content === 'function' ? content(state.close) : content }, void 0));
             case 'tray':
-                return (_jsx(Tray, { isOpen: state.isOpen, isKeyboardDismissDisabled: isKeyboardDismissDisabled, styles: styles, onClose: onClose, children: typeof content === 'function' ? content(state.close) : content }, void 0));
+                return (_jsx(Tray, { hideOnClose: hideOnClose, isOpen: state.isOpen, isKeyboardDismissDisabled: isKeyboardDismissDisabled, styles: styles, onClose: onClose, children: typeof content === 'function' ? content(state.close) : content }, void 0));
         }
     };
     return (_jsx(DialogTriggerBase, { type: type, state: state, isDismissable: isDismissable, trigger: trigger, overlay: renderOverlay(), onClose: onClose }, void 0));
@@ -74,10 +74,10 @@ function DialogTrigger(props) {
 let _DialogTrigger = DialogTrigger;
 export { _DialogTrigger as DialogTrigger };
 function PopoverTrigger(allProps) {
-    let { state, targetRef, trigger, content, hideArrow, onClose, isKeyboardDismissDisabled, ...props } = allProps;
+    let { state, targetRef, trigger, content, hideArrow, onClose, isKeyboardDismissDisabled, hideOnClose, ...props } = allProps;
     let triggerRef = useRef(null);
     let overlayRef = useRef(null);
-    let { overlayProps: popoverProps, placement, arrowProps, } = useOverlayPosition({
+    let { overlayProps: popoverProps, placement, arrowProps, updatePosition, } = useOverlayPosition({
         targetRef: targetRef || triggerRef,
         overlayRef: overlayRef,
         placement: props.placement,
@@ -92,7 +92,7 @@ function PopoverTrigger(allProps) {
         ...triggerProps,
         ref: targetRef ? undefined : triggerRef,
     };
-    let overlay = (_jsx(Popover, { ref: overlayRef, isOpen: state.isOpen, style: popoverProps.style, placement: placement, arrowProps: arrowProps, isKeyboardDismissDisabled: isKeyboardDismissDisabled, hideArrow: hideArrow, onClose: onClose, children: typeof content === 'function' ? content(state.close) : content }, void 0));
+    let overlay = (_jsx(Popover, { ref: overlayRef, hideOnClose: hideOnClose, isOpen: state.isOpen, style: popoverProps.style, placement: placement, arrowProps: arrowProps, isKeyboardDismissDisabled: isKeyboardDismissDisabled, hideArrow: hideArrow, updatePosition: updatePosition, onClose: onClose, children: typeof content === 'function' ? content(state.close) : content }, void 0));
     return (_jsx(DialogTriggerBase, { type: "popover", state: state, triggerProps: triggerPropsWithRef, dialogProps: overlayProps, trigger: trigger, overlay: overlay, onClose: onClose }, void 0));
 }
 function DialogTriggerBase(props) {

package/es/components/overlays/Dialog/context.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/Dialog/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 

package/es/components/overlays/Modal/Modal.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 
@@ -28,7 +28,10 @@ export const OVERLAY_WRAPPER_STYLES = {
     height: '100dvh',
     pointerEvents: 'none',
     zIndex: 2,
-    transition: 'visibility 0ms linear .13s',
+    transition: {
+        '': 'visibility .5s steps(2, start)',
+        open: 'visibility 0s linear',
+    },
 };
 const ModalWrapperElement = tasty({
     qa: 'ModalWrapper',
@@ -36,7 +39,12 @@ const ModalWrapperElement = tasty({
 });
 const ModalElement = tasty({
     styles: {
-        display: 'grid',
+        display: {
+            '': 'none',
+            'entering | entered': 'grid',
+            exiting: 'grid',
+            exited: 'none',
+        },
         zIndex: 2,
         height: {
             '': 'max 90dvh',
@@ -48,7 +56,7 @@ const ModalElement = tasty({
             width: '288px 90vw',
         },
         pointerEvents: 'none',
-        transition: 'opacity .25s linear, visibility 0ms linear, transform .25s ease-in-out',
+        transition: 'opacity .25s linear, transform .25s ease-in-out',
         transform: {
             '': 'translate(0, 0) scale(1, 1)',
             '[data-type="modal"] & !open': 'translate(0, -3x) scale(1, 1)',
@@ -67,10 +75,16 @@ function Modal(props, ref) {
     return (_jsxs(Overlay, { ...otherProps, children: [type !== 'fullscreenTakeover' && _jsx(Underlay, { ...underlayProps }, void 0), _jsx(ModalWrapper, { ref: domRef, qa: qa, type: type, overlayProps: overlayProps, styles: styles, onClose: onClose, children: children }, void 0)] }, void 0));
 }
 let ModalWrapper = forwardRef(function ModalWrapper(props, ref) {
-    let { qa, children, isOpen, type, placement, styles, overlayProps, ...otherProps } = props;
-    usePreventScroll();
-    let { modalProps } = useModal();
-    return (_jsx(ModalWrapperElement, { mods: { open: isOpen }, "data-type": type, "data-placement": placement, children: _jsx(ModalElement, { qa: qa || 'Modal', styles: styles, mods: { open: isOpen }, "data-type": type, "data-placement": placement, ...mergeProps(otherProps, overlayProps, modalProps), ref: ref, children: children }, void 0) }, void 0));
+    let { qa, children, isOpen, type, placement, styles, overlayProps, transitionState, ...otherProps } = props;
+    usePreventScroll({ isDisabled: transitionState !== 'entered' });
+    let { modalProps } = useModal({ isDisabled: transitionState !== 'entered' });
+    return (_jsx(ModalWrapperElement, { "data-type": type, "data-placement": placement, children: _jsx(ModalElement, { qa: qa || 'Modal', styles: styles, mods: {
+                open: isOpen,
+                entering: transitionState === 'entering',
+                exiting: transitionState === 'exiting',
+                exited: transitionState === 'exited',
+                entered: transitionState === 'entered',
+            }, "data-type": type, "data-placement": placement, ...mergeProps(otherProps, overlayProps, modalProps), ref: ref, children: children }, void 0) }, void 0));
 });
 let _Modal = forwardRef(Modal);
 export { _Modal as Modal };

package/es/components/overlays/Modal/OpenTransition.js

@@ -1,19 +1,27 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Children, cloneElement } from 'react';
+import { Children, cloneElement, createContext, useContext, } from 'react';
 import { Transition } from 'react-transition-group';
 const OPEN_STATES = {
     entering: false,
     entered: true,
 };
+const OpenTransitionContext = createContext(null);
+export function useOpenTransitionContext() {
+    return useContext(OpenTransitionContext);
+}
 export function OpenTransition(props) {
-    return (_jsx(Transition, { timeout: { enter: 0, exit: 350 }, ...props, children: (state) => Children.map(props.children, (child) => child && cloneElement(child, { isOpen: !!OPEN_STATES[state] })) }, void 0));
+    return (_jsx(Transition, { timeout: { enter: 0, exit: 350 }, ...props, children: (state) => (_jsx(OpenTransitionContext.Provider, { value: { transitionState: state }, children: Children.map(props.children, (child) => child &&
+                cloneElement(child, {
+                    isOpen: !!OPEN_STATES[state],
+                    transitionState: state,
+                })) }, void 0)) }, void 0));
 }
 
         

package/es/components/overlays/Modal/Overlay.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.16.0
+ * @cube-dev/ui-kit v0.16.1
  * Released under the MIT license.
  */
 
@@ -11,7 +11,7 @@ import { createPortal } from 'react-dom';
 import { Provider, useProviderProps } from '../../../provider';
 import { OpenTransition } from './OpenTransition';
 function Overlay(props, ref) {
-    let { children, isOpen, container = null, onEnter, onEntering, onEntered, onExit, onExiting, onExited, } = props;
+    let { children, isOpen, container = null, onEnter, onEntering, onEntered, onExit, onExiting, onExited, hideOnClose = false, } = props;
     let [exited, setExited] = useState(!isOpen);
     let { root } = useProviderProps({});
     let handleEntered = useCallback(() => {
@@ -26,7 +26,9 @@ function Overlay(props, ref) {
     let mountOverlay = isOpen || !exited;
     if (!mountOverlay) {
         // Don't bother showing anything if we don't have to.
-        return null;
+        if (!hideOnClose) {
+            return null;
+        }
     }
     let contents = (_jsx(Provider, { ref: ref, children: _jsx(OpenTransition, { appear: true, in: isOpen, onExit: onExit, onExiting: onExiting, onExited: handleExited, onEnter: onEnter, onEntering: onEntering, onEntered: handleEntered, children: children }, void 0) }, void 0));
     return createPortal(contents, container || root || document.body);