@cube-dev/ui-kit 0.114.0 → 0.115.0

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

@@ -1,134 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createContext, useContext, useMemo, useRef, useState } from 'react';
-import invariant from 'tiny-invariant';
-import { AlertDialogZone } from './AlertDialogZone.js';
-const DialogApiContext = createContext(null);
-/**
- * @internal Do not use it in your code!
- */
-export function AlertDialogApiProvider(props) {
-    const [openedDialog, setOpenedDialog] = useState(null);
-    const id = useRef(0);
-    const api = useMemo(() => ({
-        open: (dialogProps, params = {}) => {
-            const { onDismiss, ...restProps } = dialogProps;
-            const { cancelToken } = params;
-            const currentId = ++id.current;
-            const currentDialog = {
-                props: null,
-                meta: { id: currentId, isClosed: false, isVisible: true },
-            };
-            const close = () => {
-                if (currentDialog.meta.isClosed)
-                    return;
-                currentDialog.meta.isClosed = true;
-                params.cancelToken?.removeEventListener('abort', close);
-                setOpenedDialog((currentState) => currentState?.meta.id !== currentId
-                    ? currentState
-                    : {
-                        props: currentState.props,
-                        meta: { ...currentState.meta, isVisible: false },
-                    });
-                setTimeout(() => setOpenedDialog((currentState) => currentState?.meta.id !== currentId ? currentState : null), 300);
-            };
-            if (cancelToken?.aborted)
-                return new Promise(() => { });
-            cancelToken?.addEventListener('abort', close, { once: true });
-            currentDialog.meta.promise = new Promise((resolve, reject) => {
-                currentDialog.meta.resolve = (status) => {
-                    close();
-                    resolve(status);
-                };
-                currentDialog.meta.reject = (reason) => {
-                    close();
-                    reject(reason);
-                };
-            });
-            currentDialog.props = {
-                ...restProps,
-                onDismiss: (e) => {
-                    onDismiss?.(e);
-                    currentDialog.meta.reject(undefined);
-                },
-            };
-            setOpenedDialog((openedDialog) => {
-                // we already have opened dialog, so we reject opening another
-                if (openedDialog !== null) {
-                    currentDialog.meta.reject(new Error("Another dialog is already opened. It's a bad practice to open more than one <AlertDialog /> at the same time"));
-                    return openedDialog;
-                }
-                return currentDialog;
-            });
-            return currentDialog.meta.promise;
-        },
-    }), []);
-    return (_jsxs(DialogApiContext.Provider, { value: api, children: [_jsx(AlertDialogZone, { openedDialog: openedDialog }), props.children] }));
-}
-/**
- * Hook gives the ability to open `<AlertDialog />` imperatively.
- *
- * ***Important*** it's commonly a bad practice when you open multiple dialogs in a row;
- * that means this api will reject all dialogs when there is already open one
- *
- * @example calling in a side effect
- * const alertDialogAPI = useAlertDialogAPI();
- *
- * useEffect(() => {
- *   const abortDialog = new AbortController();
- *   const openedDialog = alertDialogAPI.open({
- *     title: 'Are you sure?',
- *     content: <Paragraph>Test content</Paragraph>
- *   }, {
- *      cancelToken: abortDialog.signal
- *   });
- *
- *   openedDialog
- *     .then((status) => {
- *       // User confirmed or used secondary action
- *       if (status === 'confirm') {
- *         // Handle confirm
- *       } else if (status === 'secondary') {
- *         // Handle secondary action
- *       }
- *     })
- *     .catch(() => {
- *       // User cancelled or dismissed the dialog
- *       // Handle cancel/dismiss
- *     })
- *
- *   return () => {
- *     abortDialog.abort();
- *   }
- * }, [])
- *
- * @example opening dialog on Button click.
- * const alertDialogAPI = useAlertDialogAPI();
- *
- * const onPress = useCallback(() => {
- *   alertDialogAPI.open({...})
- *     .then((status) => {
- *       if (status === 'confirm') {
- *         // Handle confirm
- *       }
- *     })
- *     .catch(() => {
- *       // Handle cancel/dismiss
- *     })
- * }, [])
- *
- * return <Button onPress={onPress}>New issue</Button>
- */
-export function useAlertDialogAPI() {
-    const api = useContext(DialogApiContext);
-    invariant(api !== null, "You can't use DialogApi outside of <Root /> component. Please, check if your component is descendant of <Root/> component");
-    return api;
-}
-
-        

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

@@ -1,66 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Portal } from '../../portal/index.js';
-import { DialogContainer } from '../Dialog/index.js';
-import { AlertDialog } from './AlertDialog.js';
-const PORTAL_KEY = 'AlertDialogZone';
-/**
- * @internal Do not use it
- */
-export function AlertDialogZone(props) {
-    const { openedDialog } = props;
-    if (openedDialog === null)
-        return _jsx(Portal, {}, PORTAL_KEY);
-    const { type, isDismissable = true, actions, onDismiss, content, ...options } = openedDialog.props;
-    const { resolve, reject, isVisible, dialogType } = openedDialog.meta;
-    const _actions = (() => {
-        const mergeActionProps = (action, status) => {
-            if (typeof action === 'undefined') {
-                return undefined;
-            }
-            if (typeof action === 'boolean') {
-                return (action
-                    ? { onPress: () => resolve(status) }
-                    : false);
-            }
-            const onPress = action.onPress;
-            return {
-                ...action,
-                onPress: (e) => {
-                    onPress?.(e);
-                    resolve(status);
-                },
-            };
-        };
-        if (typeof actions === 'undefined')
-            return {};
-        return {
-            confirm: mergeActionProps(actions.confirm, 'confirm'),
-            secondary: mergeActionProps(actions.secondary, 'secondary'),
-            cancel: typeof actions.cancel === 'undefined'
-                ? undefined
-                : typeof actions.cancel === 'boolean'
-                    ? actions.cancel
-                        ? { onPress: () => reject(undefined) }
-                        : false
-                    : {
-                        ...actions.cancel,
-                        onPress: (e) => {
-                            actions.cancel.onPress?.(e);
-                            reject(undefined);
-                        },
-                    },
-        };
-    })();
-    return (_jsx(Portal, { children: _jsx(DialogContainer, { isOpen: isVisible, isDismissable: isDismissable, type: type, onDismiss: onDismiss, children: _jsx(AlertDialog, { noActions: dialogType === 'form', actions: _actions, isHidden: !isVisible, content: typeof content === 'function'
-                    ? content({ resolve, reject })
-                    : content, ...options }) }) }, PORTAL_KEY));
-}
-
-        

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

@@ -1,12 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-export * from './AlertDialogApiProvider.js';
-export * from './AlertDialogZone.js';
-export * from './AlertDialog.js';
-
-        

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

@@ -1,10 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-export {};
-
-        

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

@@ -1,240 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { createFocusManager } from '@react-aria/focus';
-import { useDOMRef } from '@react-spectrum/utils';
-import { forwardRef, useEffect, useMemo, useRef } from 'react';
-import { DismissButton, FocusScope, useDialog, useMessageFormatter, } from 'react-aria';
-import { CloseIcon } from '../../../icons/index.js';
-import { BASE_STYLES, BLOCK_STYLES, DIMENSION_STYLES, extractStyles, FLOW_STYLES, tasty, } from '../../../tasty/index.js';
-import { mergeProps, SlotProvider } from '../../../utils/react/index.js';
-import { ItemButton } from '../../actions/index.js';
-import { useOpenTransitionContext } from '../Modal/OpenTransition.js';
-import { useDialogContext } from './context.js';
-const STYLES_LIST = [
-    ...BASE_STYLES,
-    ...DIMENSION_STYLES,
-    ...BLOCK_STYLES,
-    ...FLOW_STYLES,
-];
-const DialogElement = tasty({
-    as: 'section',
-    styles: {
-        display: 'flex',
-        flow: 'column',
-        fill: '#white',
-        pointerEvents: 'auto',
-        outline: 0,
-        position: {
-            '': 'relative',
-            'type=panel': 'absolute',
-        },
-        width: {
-            '': '$min-dialog-size $dialog-size (100dvw - 8x)',
-            'type=fullscreen': '(100dvw - 8x) (100dvw - 8x)',
-            'type=fullscreenTakeover': '100dvw 100dvw',
-            'type=panel': 'auto',
-        },
-        height: {
-            '': 'auto (100dvh - 8x)',
-            'type=fullscreen': '(100dvh - 8x) (100dvh - 8x)',
-            'type=fullscreenTakeover | type=panel': '100dvh 100dvh',
-            'type=popover': 'initial initial (50dvh - 5x)',
-        },
-        gap: 0,
-        border: {
-            '': false,
-            'type=popover': true,
-        },
-        radius: {
-            '': '1cr',
-            'type=tray': '1cr top',
-            'type=fullscreenTakeover': '0r',
-        },
-        shadow: {
-            '': '$dialog-shadow',
-            'type=popover | type=panel': '$card-shadow',
-        },
-        top: {
-            '': false,
-            'type=modal': '((50vh - 50%) / -3)',
-            'type=panel': 'auto',
-        },
-        '$dialog-title-padding-v': {
-            '': '1.5x',
-            'type=popover': '1x',
-        },
-        '$dialog-content-padding-v': {
-            '': '1.5x',
-            'type=popover': '1x',
-        },
-        '$dialog-padding-h': {
-            '': '1.5x',
-            'type=popover': '1x',
-        },
-        '$dialog-footer-v': {
-            '': '1.5x',
-            'type=popover': '1x',
-        },
-        '$dialog-content-gap': {
-            '': '1.5x',
-            'type=popover': '1x',
-        },
-    },
-});
-const CloseButton = tasty(ItemButton, {
-    qa: 'ModalCloseButton',
-    type: 'neutral',
-    styles: {
-        position: 'absolute',
-        top: '1x',
-        right: '1x',
-    },
-});
-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.
- */
-export const Dialog = forwardRef(function Dialog(props, ref) {
-    const transitionContext = useOpenTransitionContext();
-    const isEntered = transitionContext?.transitionState === 'entered';
-    const context = useDialogContext();
-    const content = useMemo(() => {
-        return _jsx(DialogContent, { ...props, ref: ref }, "content");
-    }, [props, ref]);
-    const shouldContainFocus = isEntered && context.type !== 'panel';
-    // Track the element that was focused before the dialog opened
-    // This handles hideOnClose case where FocusScope doesn't unmount
-    const previouslyFocusedRef = useRef(null);
-    // Capture the focused element when dialog opens
-    useEffect(() => {
-        if (context.isOpen) {
-            previouslyFocusedRef.current = document.activeElement;
-        }
-    }, [context.isOpen]);
-    // Restore focus when dialog closes (for hideOnClose case where component stays mounted)
-    useEffect(() => {
-        if (!context.isOpen && previouslyFocusedRef.current) {
-            const elementToFocus = previouslyFocusedRef.current;
-            // Use setTimeout to ensure this runs after the close transition
-            setTimeout(() => {
-                elementToFocus?.focus?.();
-            });
-            previouslyFocusedRef.current = null;
-        }
-    }, [context.isOpen]);
-    return (
-    // This component traps the focus inside the dialog and restores it on close.
-    _jsx(FocusScope, { restoreFocus: true, contain: shouldContainFocus, children: content }));
-});
-const DialogContent = forwardRef(function DialogContent(props, ref) {
-    let { type = 'modal', ...contextProps } = useDialogContext();
-    let { qa, children, size = 'M', isDismissable = contextProps.isDismissable, onDismiss = contextProps.onClose, closeIcon, closeButtonStyles, style, ...otherProps } = props;
-    size = sizeMap[size.toUpperCase()] || size;
-    const styles = extractStyles(otherProps, STYLES_LIST);
-    let formatMessage = useMessageFormatter(intlMessages);
-    let domRef = useDOMRef(ref);
-    let { dialogProps, titleProps } = useDialog(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 = _jsx(DismissButton, { onDismiss: onDismiss });
-    }
-    // Focus the first focusable element in the dialog when it opens
-    useEffect(() => {
-        if (contextProps.isOpen) {
-            setTimeout(() => {
-                if (domRef.current &&
-                    !domRef.current.contains(document.activeElement)) {
-                    // Priority 1: autofocus input or primary button
-                    const priorityElement = domRef.current.querySelector('input[data-autofocus], button[type="submit"], button[data-type="primary"]');
-                    if (priorityElement) {
-                        priorityElement.focus();
-                    }
-                    else {
-                        // Fallback: focus first tabbable element, or dialog itself
-                        const focusManager = createFocusManager(domRef);
-                        if (!focusManager.focusFirst({ tabbable: true })) {
-                            domRef.current.focus();
-                        }
-                    }
-                }
-            });
-        }
-    }, [contextProps.isOpen]);
-    // let hasHeader = useHasChild('[data-id="Header"]', domRef);
-    // let hasFooter = useHasChild('[data-id="Footer"]', domRef);
-    let slots = {
-        title: {
-            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: 'center stretch',
-                placeContent: 'space-between',
-                padding: `$dialog-title-padding-v ${isDismissable ? '($dialog-padding-h + 4x)' : '$dialog-padding-h'} $dialog-title-padding-v $dialog-padding-h`,
-                border: 'bottom',
-            },
-        },
-        footer: {
-            styles: {
-                display: 'flex',
-                gap: '1x',
-                flow: 'row-reverse',
-                placeItems: 'baseline stretch',
-                placeContent: 'space-between',
-                padding: '$dialog-footer-v $dialog-padding-h',
-            },
-        },
-        buttonGroup: {
-            styles: {
-                flow: 'row-reverse',
-            },
-        },
-    };
-    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] || sizePxMap.small}px`,
-            ...style,
-        }, "data-type": type, "data-size": size, children: [dismissButton, _jsxs(SlotProvider, { slots: slots, children: [isDismissable && (_jsx(CloseButton, { icon: closeIcon || _jsx(CloseIcon, { size: 20 }), label: formatMessage('dismiss'), onPress: () => onDismiss && onDismiss() })), children] })] }));
-});
-
-        

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

@@ -1,39 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Children, isValidElement, useRef, } from 'react';
-import { Modal } from '../Modal/index.js';
-import { DialogContext } from './context.js';
-/**
- * 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.
- */
-export function DialogContainer(props) {
-    const { children, type = 'modal', onDismiss, isDismissable = true, isKeyboardDismissDisabled, isOpen, hideOnClose, } = props;
-    const childArray = Children.toArray(children);
-    if (childArray.length > 1) {
-        throw new Error('Only a single child can be passed to DialogContainer.');
-    }
-    const lastChild = useRef(null);
-    const child = 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 (_jsx(Modal, { isOpen: isActuallyOpened, type: type, hideOnClose: hideOnClose, isDismissable: isDismissable, isKeyboardDismissDisabled: isKeyboardDismissDisabled, onClose: isDismissable ? onDismiss : undefined, children: _jsx(DialogContext.Provider, { value: context, children: child }) }));
-}
-
-        

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

@@ -1,45 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, ButtonGroup } from '../../actions/index.js';
-import { Content } from '../../content/Content.js';
-import { Header } from '../../content/Header.js';
-import { Title } from '../../content/Title.js';
-import { Form, SubmitButton, useForm, } from '../../form/index.js';
-import { useDialogContext } from './context.js';
-import { Dialog } from './Dialog.js';
-/**
- * DialogForms are a specific type of Dialog. They contain forms to fill.
- */
-export function DialogForm(props) {
-    let { qa, name, form, defaultValues, onDismiss, onSubmit, onSubmitFailed, onValuesChange, labelStyles, labelPosition, requiredMark, necessityIndicator, necessityLabel, isReadOnly, validationState, validateTrigger, children, danger, noActions, submitProps, cancelProps, preserve, title, size, closeIcon, ...dialogProps } = props;
-    [form] = useForm(form);
-    const { onClose } = useDialogContext();
-    function onLocalDismiss() {
-        onClose?.();
-        onDismiss?.();
-        if (!preserve) {
-            // let animations finish before resetting the form
-            setTimeout(() => {
-                form?.resetFields();
-            }, 250);
-        }
-    }
-    return (_jsxs(Dialog, { qa: `${qa || ''}Dialog`, size: size, closeIcon: closeIcon, ...dialogProps, children: [_jsx(Header, { children: _jsx(Title, { ellipsis: true, children: title }) }), _jsx(Content, { children: _jsxs(Form, { qa: qa || 'DialogForm', form: form, name: name, defaultValues: defaultValues, labelStyles: labelStyles, labelPosition: labelPosition, requiredMark: requiredMark, 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 ? (_jsxs(ButtonGroup, { children: [_jsx(SubmitButton, { qa: `${qa || ''}SubmitButton`, theme: danger ? 'danger' : undefined, label: "Submit", ...(submitProps || {}) }), _jsx(Button, { qa: `${qa || ''}CancelButton`, label: "Cancel", onPress: onLocalDismiss, ...(cancelProps || {}) })] })) : undefined] }) })] }));
-}
-
-        

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

@@ -1,132 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.114.0
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { PressResponder } from '@react-aria/interactions';
-import { useMediaQuery } from '@react-spectrum/utils';
-import { Fragment, useEffect, useRef } from 'react';
-import { useOverlayPosition, useOverlayTrigger, } from 'react-aria';
-import { useOverlayTriggerState } from 'react-stately';
-import { useCombinedRefs } from '../../../utils/react/index.js';
-import { Modal, Popover, Tray } from '../Modal/index.js';
-import { DialogContext } from './context.js';
-/**
- * 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.
- */
-export 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 = 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 = useOverlayTriggerState(props);
-    if (typeof trigger === 'function') {
-        trigger = trigger(state);
-    }
-    let wasOpen = useRef(false);
-    let isExiting = useRef(false);
-    let onExiting = () => (isExiting.current = true);
-    let onExited = () => (isExiting.current = false);
-    wasOpen.current = state.isOpen;
-    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 (_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 (_jsx(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 (_jsx(Tray, { hideOnClose: hideOnClose, isOpen: state.isOpen, isKeyboardDismissDisabled: isKeyboardDismissDisabled, styles: styles, onClose: onClose, children: typeof content === 'function' ? content(state.close) : content }));
-        }
-    };
-    return (_jsx(DialogTriggerBase, { type: type, state: state, isDismissable: isDismissable, trigger: trigger, overlay: renderOverlay(), hideOnClose: hideOnClose, onClose: onClose }));
-}
-function PopoverTrigger(allProps) {
-    let { state, styles, targetRef, trigger, content, hideArrow, onClose, isKeyboardDismissDisabled, hideOnClose, shouldCloseOnInteractOutside, keepOpenOnScroll, ...props } = allProps;
-    let triggerRef = useRef(null);
-    let overlayRef = useRef(null);
-    let { overlayProps: popoverProps, placement, arrowProps, updatePosition, } = useOverlayPosition({
-        targetRef: targetRef || triggerRef,
-        overlayRef: overlayRef,
-        placement: props.placement,
-        containerPadding: props.containerPadding,
-        offset: props.offset || 8,
-        crossOffset: props.crossOffset,
-        shouldFlip: props.shouldFlip,
-        shouldUpdatePosition: props.shouldUpdatePosition,
-        isOpen: state.isOpen,
-    });
-    let overlayTriggerState = state;
-    if (keepOpenOnScroll) {
-        overlayTriggerState = { ...state, close: updatePosition };
-    }
-    let { triggerProps, overlayProps } = useOverlayTrigger({ type: 'dialog' }, overlayTriggerState, triggerRef);
-    let triggerPropsWithRef = {
-        ...triggerProps,
-        ref: targetRef ? undefined : triggerRef,
-    };
-    let overlay = (_jsx(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 (_jsx(DialogTriggerBase, { type: "popover", state: state, triggerProps: triggerPropsWithRef, dialogProps: overlayProps, trigger: trigger, overlay: overlay, onClose: onClose }));
-}
-function DialogTriggerBase(props) {
-    const ref = useCombinedRefs(props.ref);
-    const wasOpenRef = useRef(false);
-    let { type, state, onClose, isDismissable, dialogProps = {}, triggerProps = {}, overlay, trigger, } = props;
-    let context = {
-        type,
-        onClose,
-        isDismissable,
-        isOpen: state.isOpen,
-        ...dialogProps,
-    };
-    // Restore focus manually when the dialog closes
-    useEffect(() => {
-        if (!state.isOpen && wasOpenRef.current) {
-            wasOpenRef.current = false;
-            ref.current?.focus();
-        }
-        else if (state.isOpen) {
-            wasOpenRef.current = true;
-        }
-    }, [state.isOpen]);
-    return (_jsxs(Fragment, { children: [_jsx(PressResponder, { ref: ref, ...triggerProps, isPressed: state.isOpen &&
-                    type !== 'modal' &&
-                    type !== 'fullscreen' &&
-                    type !== 'fullscreenTakeover', onPress: state.toggle, children: trigger }), _jsx(DialogContext.Provider, { value: context, children: overlay })] }));
-}
-
-