@dossierhq/design/lib/components/Dialog2/Dialog2.js

The design system for Dossier.

'use client';
import { jsx as _jsx } from "react/jsx-runtime";
import { Dialog as ReactAriaDialog, DialogTrigger as ReactAriaDialogTrigger, Modal as ReactAriaModal, } from 'react-aria-components';
import { toClassName } from '../../utils/ClassNameUtils.js';
import { toSizeClassName } from '../../utils/LayoutPropsUtils.js';
const widthClassNameMap = {
    narrow: toSizeClassName({ width: '100%', maxWidth: '40rem' }),
    wide: toSizeClassName({ width: '100%' }),
};
const heightClassNameMap = {
    fill: toSizeClassName({ height: '100vh' }),
};
export const Dialog2 = ({ width, height, children }) => {
    const modalClassName = toClassName('react-aria-Modal', widthClassNameMap[width ?? 'narrow'], height && heightClassNameMap[height]);
    const dialogClassName = toClassName('react-aria-Dialog', width === 'wide' && 'container', height === 'fill' && 'is-height-100');
    return (_jsx(ReactAriaModal, { className: modalClassName, children: _jsx(ReactAriaDialog, { className: dialogClassName, children: children }) }));
};
Dialog2.Trigger = (props) => {
    return _jsx(ReactAriaDialogTrigger, { ...props });
};
Dialog2.Trigger.displayName = 'Dialog2.Trigger';
//# sourceMappingURL=Dialog2.js.map