@cube-dev/ui-kit 0.57.0 → 0.59.0

package/cjs/components/overlays/Dialog/Dialog.js

@@ -1,200 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.57.0
- * Released under the MIT license.
- */
-
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Dialog = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("@react-spectrum/utils");
-const react_aria_1 = require("react-aria");
-const react_1 = require("react");
-const react_aria_2 = require("react-aria");
-const react_focus_lock_1 = __importDefault(require("react-focus-lock"));
-const tasty_1 = require("../../../tasty");
-const react_2 = require("../../../utils/react");
-const actions_1 = require("../../actions");
-const OpenTransition_1 = require("../Modal/OpenTransition");
-const icons_1 = require("../../../icons");
-const context_1 = require("./context");
-const STYLES_LIST = [...tasty_1.BASE_STYLES, ...tasty_1.DIMENSION_STYLES, ...tasty_1.BLOCK_STYLES];
-const DialogElement = (0, tasty_1.tasty)({
-    as: 'section',
-    styles: {
-        pointerEvents: 'auto',
-        position: {
-            '': 'relative',
-            '[data-type="panel"]': 'absolute',
-        },
-        display: 'flex',
-        placeItems: 'stretch',
-        placeContent: 'stretch',
-        width: {
-            '': '288px @dialog-size 90vw',
-            '[data-type="fullscreen"]': '90vw 90vw',
-            '[data-type="fullscreenTakeover"]': '100vw 100vw',
-            '[data-type="panel"]': 'auto',
-        },
-        height: {
-            '': 'auto 90vh',
-            '[data-type="fullscreen"]': '90vh 90vh',
-            '[data-type="fullscreenTakeover"] | [data-type="panel"]': '100vh 100vh',
-            '[data-type="panel"]': 'auto',
-        },
-        gap: 0,
-        flow: 'column',
-        radius: {
-            '': '(@large-radius + 1bw)',
-            '[data-type="tray"]': '(@large-radius + 1bw) top',
-            '[data-type="fullscreenTakeover"]': '0r',
-        },
-        fill: '#white',
-        shadow: {
-            '': '0 2x 4x #shadow',
-            '[data-type="popover"] | [data-type="panel"]': '0px .5x 2x #shadow',
-        },
-        top: {
-            '': false,
-            '[data-type="modal"]': '((50vh - 50%) / -3)',
-            '[data-type="panel"]': 'auto',
-        },
-        placeSelf: 'stretch',
-        '@dialog-heading-padding-v': {
-            '': '2x',
-            '[data-type="popover"]': '1x',
-        },
-        '@dialog-content-padding-v': {
-            '': '3x',
-            '[data-type="popover"]': '2x',
-        },
-        '@dialog-padding-h': {
-            '': '3x',
-            '[data-type="popover"]': '2x',
-        },
-        '@dialog-footer-v': {
-            '': '2x',
-            '[data-type="popover"]': '1x',
-        },
-        '@dialog-content-gap': '3x',
-    },
-});
-const CLOSE_BUTTON_STYLES = {
-    display: 'flex',
-    position: 'absolute',
-    top: '1x',
-    right: '1x',
-    width: '5x',
-    height: '5x',
-    placeContent: 'center',
-};
-const sizeMap = {
-    S: 'small',
-    M: 'medium',
-    L: 'large',
-};
-const sizePxMap = {
-    small: 360,
-    medium: 479,
-    large: 798,
-};
-const intlMessages = {
-    'en-US': {
-        dismiss: 'Dismiss',
-        alert: 'Alert',
-    },
-};
-/**
- * Dialogs are windows containing contextual information, tasks, or workflows that appear over the user interface.
- * Depending on the kind of Dialog, further interactions may be blocked until the Dialog is acknowledged.
- */
-exports.Dialog = (0, react_1.forwardRef)(function Dialog(props, ref) {
-    const transitionContext = (0, OpenTransition_1.useOpenTransitionContext)();
-    const isEntered = transitionContext?.transitionState === 'entered';
-    const context = (0, context_1.useDialogContext)();
-    const content = (0, react_1.useMemo)(() => {
-        return (0, jsx_runtime_1.jsx)(DialogContent, { ...props, ref: ref }, "content");
-    }, [props, ref]);
-    return (
-    // This component is actually traps the focus inside the dialog.
-    (0, jsx_runtime_1.jsx)(react_focus_lock_1.default, { returnFocus: true, disabled: !isEntered || context.type === 'panel', children: (0, jsx_runtime_1.jsx)(react_aria_1.FocusScope, { restoreFocus: true, children: content }) }));
-});
-const DialogContent = (0, react_1.forwardRef)(function DialogContent(props, ref) {
-    let { type = 'modal', ...contextProps } = (0, context_1.useDialogContext)();
-    let { qa, children, size = 'S', isDismissable = contextProps.isDismissable, onDismiss = contextProps.onClose, closeIcon, closeButtonStyles, ...otherProps } = props;
-    const [isCloseDisabled, setIsCloseDisabled] = (0, react_1.useState)(true);
-    size = sizeMap[size.toUpperCase()] || size;
-    const styles = (0, tasty_1.extractStyles)(otherProps, STYLES_LIST);
-    let formatMessage = (0, react_aria_2.useMessageFormatter)(intlMessages);
-    let domRef = (0, utils_1.useDOMRef)(ref);
-    let { dialogProps, titleProps } = (0, react_aria_2.useDialog)((0, react_2.mergeProps)(contextProps, props), domRef);
-    // 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;
-    if (type === 'popover' || type === 'tray') {
-        dismissButton = (0, jsx_runtime_1.jsx)(react_aria_1.DismissButton, { onDismiss: onDismiss });
-    }
-    const focusManager = (0, react_aria_1.useFocusManager)();
-    // Focus the first focusable element in the dialog when it opens
-    (0, react_1.useEffect)(() => {
-        if (contextProps.isOpen) {
-            setTimeout(() => {
-                focusManager?.focusFirst();
-                setIsCloseDisabled(false);
-            });
-        }
-        else {
-            setIsCloseDisabled(true);
-        }
-    }, [contextProps.isOpen]);
-    // let hasHeader = useHasChild('[data-id="Header"]', domRef);
-    // let hasFooter = useHasChild('[data-id="Footer"]', domRef);
-    let slots = {
-        heading: {
-            level: 2,
-            preset: 'h4',
-            ...titleProps,
-        },
-        content: {
-            styles: {
-                flexGrow: 1,
-                padding: '@dialog-content-padding-v @dialog-padding-h',
-                gap: '@dialog-content-gap',
-                height: {
-                    '': 'max (100% - (2 * @dialog-content-padding-v))',
-                    ':last-child': 'max (100% - @dialog-content-padding-v)',
-                },
-            },
-        },
-        header: {
-            ellipsis: true,
-            styles: {
-                display: 'flex',
-                flow: 'row',
-                gap: '1x',
-                placeItems: 'baseline stretch',
-                placeContent: 'space-between',
-                padding: `@dialog-heading-padding-v ${isDismissable ? '(@dialog-padding-h + 4x)' : '@dialog-padding-h'} @dialog-heading-padding-v @dialog-padding-h`,
-                border: 'bottom',
-            },
-        },
-        footer: {
-            styles: {
-                display: 'flex',
-                gap: '1x',
-                flow: 'row',
-                placeItems: 'baseline stretch',
-                placeContent: 'space-between',
-                padding: '@dialog-footer-v @dialog-padding-h',
-            },
-        },
-    };
-    return ((0, jsx_runtime_1.jsxs)(DialogElement, { ref: domRef, "data-id": "Dialog", "data-qa": qa || 'Dialog', styles: styles, as: "section", ...dialogProps, tabIndex: undefined, mods: { dismissable: isDismissable }, style: { '--dialog-size': `${sizePxMap[size] || 288}px` }, "data-type": type, "data-size": size, children: [dismissButton, (0, jsx_runtime_1.jsxs)(react_2.SlotProvider, { slots: slots, children: [isDismissable && ((0, jsx_runtime_1.jsx)(actions_1.Button, { isDisabled: isCloseDisabled, qa: "ModalCloseButton", type: "neutral", styles: CLOSE_BUTTON_STYLES, icon: closeIcon || (0, jsx_runtime_1.jsx)(icons_1.CloseIcon, {}), label: formatMessage('dismiss'), onPress: () => onDismiss && onDismiss() })), children] })] }));
-});
-
-        

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

@@ -1,42 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.57.0
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DialogContainer = DialogContainer;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Modal_1 = require("../Modal/Modal");
-const context_1 = require("./context");
-/**
- * A DialogContainer accepts a single Dialog as a child, and manages to show and hide
- * it in a modal.
- * Useful in cases where there is no trigger element
- * or when the trigger unmounts while the dialog is open.
- */
-function DialogContainer(props) {
-    const { children, type = 'modal', onDismiss, isDismissable, isKeyboardDismissDisabled, isOpen, } = props;
-    const childArray = react_1.Children.toArray(children);
-    if (childArray.length > 1) {
-        throw new Error('Only a single child can be passed to DialogContainer.');
-    }
-    const lastChild = (0, react_1.useRef)();
-    const child = (0, react_1.isValidElement)(childArray[0]) ? childArray[0] : null;
-    if (child) {
-        lastChild.current = child;
-    }
-    const isActuallyOpened = typeof isOpen !== 'boolean' ? !!child : isOpen;
-    const context = {
-        type,
-        onClose: onDismiss,
-        isDismissable,
-        isOpen,
-    };
-    return ((0, jsx_runtime_1.jsx)(Modal_1.Modal, { isOpen: isActuallyOpened, type: type, isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, onClose: isDismissable ? onDismiss : undefined, children: (0, jsx_runtime_1.jsx)(context_1.DialogContext.Provider, { value: context, children: child }) }));
-}
-
-        

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

@@ -1,49 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.57.0
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DialogForm = DialogForm;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Title_1 = require("../../content/Title");
-const form_1 = require("../../form");
-const Content_1 = require("../../content/Content");
-const actions_1 = require("../../actions");
-const actions_2 = require("../../actions");
-const Header_1 = require("../../content/Header");
-const context_1 = require("./context");
-const Dialog_1 = require("./Dialog");
-/**
- * DialogForms are a specific type of Dialog. They contain forms to fill.
- */
-function DialogForm(props) {
-    let { qa, name, form, defaultValues, onDismiss, onSubmit, onSubmitFailed, onValuesChange, labelStyles, labelPosition, requiredMark, isRequired, necessityIndicator, necessityLabel, isReadOnly, validationState, validateTrigger, children, danger, noActions, submitProps, cancelProps, preserve, title, size, closeIcon, ...dialogProps } = props;
-    [form] = (0, form_1.useForm)(form);
-    const { onClose } = (0, context_1.useDialogContext)();
-    function onLocalDismiss() {
-        onClose?.();
-        onDismiss?.();
-        if (!preserve) {
-            // let animations finish before resetting the form
-            setTimeout(() => {
-                form?.resetFields();
-            }, 250);
-        }
-    }
-    return ((0, jsx_runtime_1.jsxs)(Dialog_1.Dialog, { qa: `${qa || ''}Dialog`, size: size, closeIcon: closeIcon, ...dialogProps, children: [(0, jsx_runtime_1.jsx)(Header_1.Header, { children: (0, jsx_runtime_1.jsx)(Title_1.Title, { ellipsis: true, children: title }) }), (0, jsx_runtime_1.jsx)(Content_1.Content, { children: (0, jsx_runtime_1.jsxs)(form_1.Form, { qa: qa || 'DialogForm', form: form, name: name, defaultValues: defaultValues, labelStyles: labelStyles, labelPosition: labelPosition, requiredMark: requiredMark, isRequired: isRequired, necessityIndicator: necessityIndicator, necessityLabel: necessityLabel, isReadOnly: isReadOnly, validationState: validationState, validateTrigger: validateTrigger, onSubmit: async (data) => {
-                        await onSubmit?.(data);
-                        onClose?.();
-                        if (!preserve) {
-                            // let animations finish before resetting the form
-                            setTimeout(() => {
-                                form.resetFields();
-                            }, 250);
-                        }
-                    }, onSubmitFailed: onSubmitFailed, onValuesChange: onValuesChange, children: [typeof children === 'function' ? children(onLocalDismiss) : children, !noActions ? ((0, jsx_runtime_1.jsxs)(actions_2.ButtonGroup, { children: [(0, jsx_runtime_1.jsx)(form_1.SubmitButton, { qa: `${qa || ''}SubmitButton`, theme: danger ? 'danger' : undefined, label: "Submit", ...(submitProps || {}) }), (0, jsx_runtime_1.jsx)(actions_1.Button, { qa: `${qa || ''}CancelButton`, label: "Cancel", onPress: onLocalDismiss, ...(cancelProps || {}) })] })) : undefined] }) })] }));
-}
-
-        

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

@@ -1,133 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.57.0
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DialogTrigger = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const react_stately_1 = require("react-stately");
-const interactions_1 = require("@react-aria/interactions");
-const utils_1 = require("@react-spectrum/utils");
-const react_aria_1 = require("react-aria");
-const index_1 = require("../../../utils/react/index");
-const Modal_1 = require("../Modal");
-const context_1 = require("./context");
-function DialogTrigger(props) {
-    let { children, type = 'modal', mobileType = type === 'popover' ? 'modal' : type, hideArrow, targetRef, onDismiss, isDismissable = true, isKeyboardDismissDisabled, styles, mobileViewport = 700, hideOnClose, shouldCloseOnInteractOutside, ...positionProps } = props;
-    if (!Array.isArray(children) || children.length > 2) {
-        throw new Error('DialogTrigger must have exactly 2 children');
-    }
-    // if a function is passed as the second child, it won't appear in toArray
-    let [trigger, content] = children;
-    // On small devices, show a modal or tray instead of a popover.
-    let isMobile = (0, utils_1.useMediaQuery)(`(max-width: ${mobileViewport}px)`);
-    if (isMobile) {
-        // handle cases where desktop popovers need a close button for the mobile modal view
-        if (type !== 'modal' && mobileType === 'modal') {
-            isDismissable = true;
-        }
-        type = mobileType;
-    }
-    let state = (0, react_stately_1.useOverlayTriggerState)(props);
-    if (typeof trigger === 'function') {
-        trigger = trigger(state);
-    }
-    let wasOpen = (0, react_1.useRef)(false);
-    let isExiting = (0, react_1.useRef)(false);
-    let onExiting = () => (isExiting.current = true);
-    let onExited = () => (isExiting.current = false);
-    wasOpen.current = state.isOpen;
-    (0, react_1.useEffect)(() => {
-        return () => {
-            if ((wasOpen.current || isExiting.current) &&
-                type !== 'popover' &&
-                type !== 'tray') {
-                console.warn('CubeUIKit: A DialogTrigger unmounted while open. This is likely due to being placed within a trigger that unmounts or inside a conditional. Consider using a DialogContainer instead.');
-            }
-        };
-    }, []);
-    function onClose(action) {
-        if (isDismissable) {
-            onDismiss && onDismiss(action);
-            state.close();
-        }
-    }
-    if (type === 'popover') {
-        return ((0, jsx_runtime_1.jsx)(PopoverTrigger, { ...positionProps, hideOnClose: hideOnClose, state: state, styles: styles, targetRef: targetRef, trigger: trigger, content: content, isKeyboardDismissDisabled: isKeyboardDismissDisabled, hideArrow: hideArrow, shouldCloseOnInteractOutside: shouldCloseOnInteractOutside, onClose: onClose }));
-    }
-    let renderOverlay = () => {
-        switch (type) {
-            case 'panel':
-            case 'fullscreen':
-            case 'fullscreenTakeover':
-            case 'modal':
-                return ((0, jsx_runtime_1.jsx)(Modal_1.Modal, { hideOnClose: hideOnClose, isOpen: state.isOpen, isDismissable: isDismissable, type: type, isKeyboardDismissDisabled: isKeyboardDismissDisabled, styles: styles, shouldCloseOnInteractOutside: shouldCloseOnInteractOutside, onClose: onClose, onExiting: onExiting, onExited: onExited, children: typeof content === 'function' ? content(state.close) : content }));
-            case 'tray':
-                return ((0, jsx_runtime_1.jsx)(Modal_1.Tray, { hideOnClose: hideOnClose, isOpen: state.isOpen, isKeyboardDismissDisabled: isKeyboardDismissDisabled, styles: styles, onClose: onClose, children: typeof content === 'function' ? content(state.close) : content }));
-        }
-    };
-    return ((0, jsx_runtime_1.jsx)(DialogTriggerBase, { type: type, state: state, isDismissable: isDismissable, trigger: trigger, overlay: renderOverlay(), hideOnClose: hideOnClose, onClose: onClose }));
-}
-/**
- * DialogTrigger serves as a wrapper around a Dialog and its associated trigger, linking the Dialog's
- * open state with the trigger's press state. Additionally, it allows you to customize the type and
- * positioning of the Dialog.
- */
-let _DialogTrigger = DialogTrigger;
-exports.DialogTrigger = _DialogTrigger;
-function PopoverTrigger(allProps) {
-    let { state, styles, targetRef, trigger, content, hideArrow, onClose, isKeyboardDismissDisabled, hideOnClose, shouldCloseOnInteractOutside, keepOpenOnScroll, ...props } = allProps;
-    let triggerRef = (0, react_1.useRef)(null);
-    let overlayRef = (0, react_1.useRef)(null);
-    let { overlayProps: popoverProps, placement, arrowProps, updatePosition, } = (0, react_aria_1.useOverlayPosition)({
-        targetRef: targetRef || triggerRef,
-        overlayRef: overlayRef,
-        placement: props.placement,
-        containerPadding: props.containerPadding,
-        offset: props.offset || 8,
-        crossOffset: props.crossOffset,
-        shouldFlip: props.shouldFlip,
-        isOpen: state.isOpen,
-    });
-    let overlayTriggerState = state;
-    if (keepOpenOnScroll) {
-        overlayTriggerState = { ...state, close: updatePosition };
-    }
-    let { triggerProps, overlayProps } = (0, react_aria_1.useOverlayTrigger)({ type: 'dialog' }, overlayTriggerState, triggerRef);
-    let triggerPropsWithRef = {
-        ...triggerProps,
-        ref: targetRef ? undefined : triggerRef,
-    };
-    let overlay = ((0, jsx_runtime_1.jsx)(Modal_1.Popover, { ref: overlayRef, styles: styles, hideOnClose: hideOnClose, isOpen: state.isOpen, style: popoverProps.style, placement: placement, arrowProps: arrowProps, isKeyboardDismissDisabled: isKeyboardDismissDisabled, hideArrow: hideArrow, updatePosition: updatePosition, shouldCloseOnInteractOutside: shouldCloseOnInteractOutside, onClose: onClose, children: typeof content === 'function' ? content(state.close) : content }));
-    return ((0, jsx_runtime_1.jsx)(DialogTriggerBase, { type: "popover", state: state, triggerProps: triggerPropsWithRef, dialogProps: overlayProps, trigger: trigger, overlay: overlay, onClose: onClose }));
-}
-function DialogTriggerBase(props) {
-    const ref = (0, index_1.useCombinedRefs)(props.ref);
-    let { type, state, onClose, isDismissable, dialogProps = {}, triggerProps = {}, overlay, trigger, hideOnClose, } = props;
-    let context = {
-        type,
-        onClose,
-        isDismissable,
-        isOpen: state.isOpen,
-        ...dialogProps,
-    };
-    // Restore focus manually when the dialog closes and has `hideOnClose` set to true
-    (0, react_1.useEffect)(() => {
-        if (!state.isOpen && hideOnClose) {
-            setTimeout(() => {
-                ref.current?.focus();
-            });
-        }
-    }, [state.isOpen, ref.current]);
-    return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(interactions_1.PressResponder, { ref: ref, ...triggerProps, isPressed: state.isOpen &&
-                    type !== 'modal' &&
-                    type !== 'fullscreen' &&
-                    type !== 'fullscreenTakeover', onPress: state.toggle, children: trigger }), (0, jsx_runtime_1.jsx)(context_1.DialogContext.Provider, { value: context, children: overlay })] }));
-}
-
-        

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

@@ -1,24 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.57.0
- * Released under the MIT license.
- */
-
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DialogContext = void 0;
-exports.useDialogContext = useDialogContext;
-const react_1 = require("react");
-const tiny_invariant_1 = __importDefault(require("tiny-invariant"));
-exports.DialogContext = (0, react_1.createContext)({});
-function useDialogContext() {
-    const dialogContext = (0, react_1.useContext)(exports.DialogContext);
-    (0, tiny_invariant_1.default)(dialogContext !== null, '');
-    return dialogContext;
-}
-
-        

package/cjs/components/overlays/Dialog/dialog-container.js

@@ -1,63 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.57.0
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDialogContainer = useDialogContainer;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const index_1 = require("../../../_internal/index");
-const DialogContainer_1 = require("./DialogContainer");
-/**
- * Generic hook to manage a dialog component.
- *
- * @param Component - A React component that represents the dialog content. It must accept props of type P.
- * @returns An object with `open` function to open the dialog with provided props and `rendered` JSX element to include in your component tree.
- */
-function useDialogContainer(Component) {
-    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
-    const [componentProps, setComponentProps] = (0, react_1.useState)(null);
-    const [containerProps, setContainerProps] = (0, react_1.useState)(null);
-    const setupRef = (0, react_1.useRef)(false);
-    function setupCheck() {
-        if (!setupRef.current) {
-            throw new Error('useDialogContainer: DialogContainer must be rendered. Use `rendered` property to include it in your component tree.');
-        }
-    }
-    // 'open' accepts props required by the Component and opens the dialog
-    const open = (0, index_1.useEvent)((props, containerProps) => {
-        setupCheck();
-        setComponentProps(props);
-        setContainerProps(containerProps ?? null);
-        setIsOpen(true);
-    });
-    const update = (0, index_1.useEvent)((props, containerProps) => {
-        setupCheck();
-        setComponentProps(props);
-        setContainerProps(containerProps ?? null);
-    });
-    const close = (0, index_1.useEvent)(() => {
-        setIsOpen(false);
-    });
-    // Render the dialog only when componentProps is set
-    const renderedDialog = (0, react_1.useMemo)(() => {
-        if (!componentProps)
-            return null;
-        return ((0, jsx_runtime_1.jsx)(DialogContainer_1.DialogContainer, { isOpen: isOpen, onDismiss: close, ...(containerProps ?? {}), children: (0, jsx_runtime_1.jsx)(Component, { ...componentProps }) }));
-    }, [componentProps, containerProps, isOpen]);
-    return {
-        open,
-        update,
-        close,
-        get rendered() {
-            setupRef.current = true;
-            return renderedDialog;
-        },
-    };
-}
-
-        

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

@@ -1,30 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.57.0
- * Released under the MIT license.
- */
-
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./DialogContainer"), exports);
-__exportStar(require("./DialogForm"), exports);
-__exportStar(require("./DialogTrigger"), exports);
-__exportStar(require("./Dialog"), exports);
-__exportStar(require("./dialog-container"), exports);
-
-        

package/cjs/components/overlays/Modal/Modal.js

@@ -1,97 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.57.0
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Modal = exports.OVERLAY_WRAPPER_STYLES = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("@react-spectrum/utils");
-const react_1 = require("react");
-const react_aria_1 = require("react-aria");
-const tasty_1 = require("../../../tasty");
-const react_2 = require("../../../utils/react");
-const Underlay_1 = require("./Underlay");
-const Overlay_1 = require("./Overlay");
-exports.OVERLAY_WRAPPER_STYLES = {
-    position: 'fixed',
-    display: 'grid',
-    left: 0,
-    top: 0,
-    placeItems: {
-        '': 'center',
-        '[data-type="fullscreen"]': 'center',
-        '[data-type="fullscreenTakeover"] | [data-type="panel"]': 'stretch',
-    },
-    boxSizing: 'border-box',
-    width: '100vw',
-    height: '100dvh',
-    pointerEvents: 'none',
-    zIndex: 10,
-    transition: {
-        '': 'visibility .5s steps(2, start)',
-        open: 'visibility 0s linear',
-    },
-};
-const ModalWrapperElement = (0, tasty_1.tasty)({
-    qa: 'ModalWrapper',
-    styles: exports.OVERLAY_WRAPPER_STYLES,
-});
-const ModalElement = (0, tasty_1.tasty)({
-    styles: {
-        display: {
-            '': 'none',
-            'entering | entered': 'grid',
-            exiting: 'grid',
-            exited: 'none',
-        },
-        zIndex: 10,
-        height: {
-            '': 'max 90dvh',
-            '[data-type="fullscreenTakeover"] | [data-type="panel"]': '100dvh 100dvh',
-            '[data-type="fullscreen"]': '90dvh 90dvh',
-            '[data-type="fullscreenTakeover"]': '100dvh 100dvh',
-            '[data-type="panel"]': 'auto',
-        },
-        width: {
-            '': '288px 90vw',
-            '[data-type="panel"]': 'auto',
-        },
-        pointerEvents: 'none',
-        transition: 'opacity .25s linear, transform .25s ease-in-out',
-        transform: {
-            '': 'initial',
-            '[data-type="modal"] & !open': 'translate(0, -3x) scale(1, 1)',
-            '([data-type^="fullscreen"] | [data-type="panel"]) & !open': 'translate(0, 0) scale(1.02, 1.02)',
-        },
-        opacity: {
-            '': 0,
-            open: 0.9999,
-        },
-    },
-});
-function Modal(props, ref) {
-    let { qa, children, onClose, type, styles, ...otherProps } = props;
-    let domRef = (0, utils_1.useDOMRef)(ref);
-    let { overlayProps, underlayProps } = (0, react_aria_1.useOverlay)({ ...props }, domRef);
-    return ((0, jsx_runtime_1.jsxs)(Overlay_1.Overlay, { ...otherProps, children: [type !== 'fullscreenTakeover' && type !== 'panel' && ((0, jsx_runtime_1.jsx)(Underlay_1.Underlay, { ...underlayProps })), (0, jsx_runtime_1.jsx)(ModalWrapper, { ref: domRef, qa: qa, type: type, overlayProps: overlayProps, styles: styles, onClose: onClose, children: children })] }));
-}
-let ModalWrapper = (0, react_1.forwardRef)(function ModalWrapper(props, ref) {
-    let { qa, children, isOpen, type, placement, styles, overlayProps, transitionState, ...otherProps } = props;
-    (0, react_aria_1.usePreventScroll)({ isDisabled: transitionState !== 'entered' });
-    let { modalProps } = (0, react_aria_1.useModal)({ isDisabled: transitionState !== 'entered' });
-    return ((0, jsx_runtime_1.jsx)(ModalWrapperElement, { "data-type": type, "data-placement": placement, children: (0, jsx_runtime_1.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, ...(0, react_2.mergeProps)(otherProps, overlayProps, modalProps), ref: ref, children: children }) }));
-});
-let _Modal = (0, react_1.forwardRef)(Modal);
-exports.Modal = _Modal;
-
-