@povio/ui 3.4.0-rc.9 → 4.0.0-rc.2

package/dist/components/overlays/BottomSheet/BottomSheet.js

@@ -1,328 +0,0 @@
-import { UIConfig } from "../../../config/uiConfig.context.js";
-import { BottomSheetHeader } from "./BottomSheetHeader.js";
-import { useStateAndRef } from "../../../hooks/useStateAndRef.js";
-import { DomUtils } from "../../../utils/dom.utils.js";
-import { clsx } from "clsx";
-import { useEffect, useMemo, useRef, useState } from "react";
-import { Dialog, DialogTrigger, Modal, ModalOverlay } from "react-aria-components";
-import { c } from "react/compiler-runtime";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { useResizeObserver, useViewportSize } from "@react-aria/utils";
-import { AnimatePresence, animate, motion, useDragControls, useMotionValue } from "motion/react";
-//#region src/components/overlays/BottomSheet/BottomSheet.tsx
-var MotionModal = motion.create(Modal);
-var MotionModalOverlay = motion.create(ModalOverlay);
-var inertiaTransition = {
-	type: "inertia",
-	bounceStiffness: 300,
-	bounceDamping: 40,
-	timeConstant: 300
-};
-var staticTransition = {
-	duration: .5,
-	ease: [
-		.32,
-		.72,
-		0,
-		1
-	]
-};
-var KEYBOARD_INSET_THRESHOLD = 48;
-var BottomSheetBase = ({ isOpen, onOpenChange, onStateChange, isDismissable = true, isScrollable = true, height = "full", label, portalContainerRef, children, footer, hideHeader, hideThumb: hideThumbProp, sheetMarginTop = 96, sheetMarginBottom = 128, closeDragThreshold: closeDragThresholdProp, closeVelocityThreshold: closeVelocityThresholdProp, shouldCloseOnInteractOutside, containerClassName, overlayClassName, headerTypography: headerTypographyProp }) => {
-	const uiConfig = UIConfig.useConfig();
-	const closeDragThreshold = closeDragThresholdProp ?? uiConfig.bottomSheet.closeDragThreshold;
-	const closeVelocityThreshold = closeVelocityThresholdProp ?? uiConfig.bottomSheet.closeVelocityThreshold;
-	const hideThumb = hideThumbProp ?? uiConfig.bottomSheet.hideThumb;
-	const headerTypography = headerTypographyProp ?? uiConfig.bottomSheet.headerTypography;
-	const viewport = useViewportSize();
-	const { sheetHeight, windowHeight } = useMemo(() => {
-		return {
-			sheetHeight: viewport.height - sheetMarginTop,
-			windowHeight: Math.max(window.innerHeight, viewport.height) - sheetMarginTop
-		};
-	}, [viewport.height, sheetMarginTop]);
-	const y = useMotionValue(sheetHeight);
-	const dragControls = useDragControls();
-	const closeVelocityRef = useRef(true);
-	const overlayRef = useRef(null);
-	const containerRef = useRef(null);
-	const dialogRef = useRef(null);
-	const focusTrapRef = useRef(null);
-	const [footerElement, footerRef, setFooterElement] = useStateAndRef(null);
-	const [footerHeight, setFooterHeight] = useState(0);
-	const [keyboardInset, setKeyboardInset] = useState(0);
-	useEffect(() => {
-		if (!isOpen) {
-			setKeyboardInset(0);
-			return;
-		}
-		const vv = window.visualViewport;
-		if (!vv) return;
-		const update = () => {
-			const naturalHeight = vv.height * Math.max(vv.scale, 1);
-			const next = Math.max(0, window.innerHeight - naturalHeight);
-			setKeyboardInset(next > KEYBOARD_INSET_THRESHOLD ? Math.round(next) : 0);
-		};
-		update();
-		vv.addEventListener("resize", update);
-		vv.addEventListener("scroll", update);
-		return () => {
-			vv.removeEventListener("resize", update);
-			vv.removeEventListener("scroll", update);
-		};
-	}, [isOpen]);
-	useEffect(() => {
-		if (!footerElement) return;
-		const onResize = () => {
-			setFooterHeight(footerElement.offsetHeight || 0);
-		};
-		onResize();
-		const observer = new ResizeObserver(onResize);
-		observer.observe(footerElement);
-		return () => {
-			observer.disconnect();
-		};
-	}, [footerElement]);
-	const oldHeightRef = useRef(0);
-	useResizeObserver({
-		ref: dialogRef,
-		onResize: () => {
-			const rect = dialogRef.current?.getBoundingClientRect();
-			if (!rect || oldHeightRef.current === rect.height) return;
-			oldHeightRef.current = rect.height;
-			if (y.get() < 0) {
-				y.stop();
-				animate(y, 0);
-			}
-		}
-	});
-	return /* @__PURE__ */ jsx(AnimatePresence, { children: isOpen && /* @__PURE__ */ jsxs(MotionModalOverlay, {
-		isOpen: true,
-		UNSTABLE_portalContainer: portalContainerRef?.current,
-		className: clsx("fixed top-0 left-0 z-bottom-sheet w-screen h-dvh", containerClassName),
-		style: { "--bottom-sheet-keyboard-inset": `${keyboardInset}px` },
-		onOpenChange,
-		isDismissable,
-		ref: overlayRef,
-		shouldCloseOnInteractOutside,
-		children: [/* @__PURE__ */ jsx(motion.div, {
-			className: clsx("pointer-events-none absolute inset-0 bg-support-overlay", overlayClassName),
-			animate: { opacity: 1 },
-			initial: { opacity: 0 },
-			exit: { opacity: 0 }
-		}), /* @__PURE__ */ jsx(MotionModal, {
-			isDismissable,
-			className: clsx("pointer-events-none flex h-full w-full flex-col items-stretch justify-end outline-none will-change-transform"),
-			animate: {
-				y: 0,
-				opacity: 1
-			},
-			initial: {
-				y: windowHeight,
-				opacity: 1
-			},
-			exit: {
-				y: windowHeight,
-				opacity: 1
-			},
-			onAnimationComplete: (data) => {
-				onStateChange?.(data.y === 0 ? "opened" : "closed");
-			},
-			onAnimationStart: (data_0) => {
-				onStateChange?.(data_0.y === 0 ? "opening" : "closing");
-			},
-			transition: staticTransition,
-			style: {
-				y,
-				height: "calc(100dvh - var(--bottom-sheet-keyboard-inset, 0px))",
-				minHeight: "calc(100dvh - var(--bottom-sheet-keyboard-inset, 0px))"
-			},
-			drag: "y",
-			dragListener: false,
-			dragControls,
-			dragElastic: {
-				top: 0,
-				bottom: .5
-			},
-			dragConstraints: {
-				top: 0,
-				bottom: 0
-			},
-			onUpdate: (latest) => {
-				if (!latest || !footerRef.current) return;
-				footerRef.current?.style.setProperty("--scroll-position", `${(latest.y || 0).toFixed(0)}px`);
-			},
-			onDragStart: () => {
-				if (document.activeElement && DomUtils.isKeyboardInput(document.activeElement)) focusTrapRef.current?.focus();
-				y.animation?.stop();
-				closeVelocityRef.current = true;
-				containerRef.current?.style.setProperty("pointer-events", "none");
-			},
-			onDragEnd: (e, { velocity }) => {
-				containerRef.current?.style.removeProperty("pointer-events");
-				const yValue = y.get();
-				if (yValue > 0) {
-					const dragPastThreshold = yValue > closeDragThreshold;
-					if (closeVelocityRef.current && velocity.y > closeVelocityThreshold || dragPastThreshold) onOpenChange?.(false);
-					else animate(y, 0, {
-						...inertiaTransition,
-						min: 0,
-						max: 0
-					});
-				}
-			},
-			children: /* @__PURE__ */ jsx(Dialog, {
-				className: "relative flex min-h-0 flex-1 flex-col items-stretch outline-none",
-				ref: dialogRef,
-				"aria-label": label,
-				children: ({ close }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
-					/* @__PURE__ */ jsx("div", {
-						style: { minHeight: `${sheetMarginTop}px` },
-						className: clsx("shrink-0", height === "auto" && "grow")
-					}),
-					/* @__PURE__ */ jsxs("div", {
-						className: clsx("pointer-events-auto relative flex min-h-0 flex-col items-stretch rounded-t-xl bg-elevation-fill-default-1", height === "full" && "flex-1"),
-						children: [
-							/* @__PURE__ */ jsx("div", {
-								className: clsx("absolute bottom-full left-0 w-full outline-none", isDismissable ? "h-0" : "h-screen"),
-								ref: focusTrapRef,
-								tabIndex: -1
-							}),
-							/* @__PURE__ */ jsxs("div", {
-								className: "flex max-h-full min-h-0 flex-col items-stretch",
-								ref: containerRef,
-								children: [/* @__PURE__ */ jsx(BottomSheetHeader, {
-									label,
-									dragControls,
-									onClose: close,
-									isDismissable,
-									hideHeader,
-									hideThumb,
-									headerTypography
-								}), typeof children === "function" ? children(close) : children]
-							}),
-							/* @__PURE__ */ jsx("div", {
-								className: "shrink-0",
-								style: { height: `${footerHeight + (isScrollable ? 0 : sheetMarginBottom)}px` }
-							}),
-							/* @__PURE__ */ jsx("div", { className: "absolute top-full h-screen w-full bg-elevation-fill-default-1" })
-						]
-					}),
-					footer && /* @__PURE__ */ jsx(motion.div, {
-						animate: { opacity: 1 },
-						initial: { opacity: 0 },
-						exit: { opacity: 0 },
-						ref: setFooterElement,
-						className: clsx("pointer-events-auto absolute z-overlay-above w-full bg-elevation-fill-default-2", "top-[calc(100dvh-var(--bottom-sheet-keyboard-inset,0))] left-0 translate-y-[calc(-100%-var(--scroll-position,0))]"),
-						children: footer
-					})
-				] })
-			})
-		})]
-	}) });
-};
-var BottomSheet = (t0) => {
-	const $ = c(30);
-	let children;
-	let isOpen;
-	let onOpenChange;
-	let portalContainerRef;
-	let rest;
-	let trigger;
-	if ($[0] !== t0) {
-		({isOpen, portalContainerRef, onOpenChange, trigger, children, ...rest} = t0);
-		$[0] = t0;
-		$[1] = children;
-		$[2] = isOpen;
-		$[3] = onOpenChange;
-		$[4] = portalContainerRef;
-		$[5] = rest;
-		$[6] = trigger;
-	} else {
-		children = $[1];
-		isOpen = $[2];
-		onOpenChange = $[3];
-		portalContainerRef = $[4];
-		rest = $[5];
-		trigger = $[6];
-	}
-	const [isSheetOpen, setIsSheetOpen] = useState(!!isOpen);
-	const hasTrigger = !!trigger;
-	let t1;
-	let t2;
-	if ($[7] !== hasTrigger || $[8] !== isOpen) {
-		t1 = () => {
-			if (hasTrigger) setIsSheetOpen(!!isOpen);
-		};
-		t2 = [isOpen, hasTrigger];
-		$[7] = hasTrigger;
-		$[8] = isOpen;
-		$[9] = t1;
-		$[10] = t2;
-	} else {
-		t1 = $[9];
-		t2 = $[10];
-	}
-	useEffect(t1, t2);
-	if (trigger) {
-		let t3;
-		if ($[11] !== onOpenChange) {
-			t3 = (open) => {
-				setIsSheetOpen(open);
-				onOpenChange?.(open);
-			};
-			$[11] = onOpenChange;
-			$[12] = t3;
-		} else t3 = $[12];
-		const handleOpenChange = t3;
-		let t4;
-		if ($[13] !== children || $[14] !== handleOpenChange || $[15] !== isSheetOpen || $[16] !== portalContainerRef || $[17] !== rest) {
-			t4 = /* @__PURE__ */ jsx(BottomSheetBase, {
-				isOpen: isSheetOpen,
-				onOpenChange: handleOpenChange,
-				portalContainerRef,
-				...rest,
-				children
-			});
-			$[13] = children;
-			$[14] = handleOpenChange;
-			$[15] = isSheetOpen;
-			$[16] = portalContainerRef;
-			$[17] = rest;
-			$[18] = t4;
-		} else t4 = $[18];
-		let t5;
-		if ($[19] !== handleOpenChange || $[20] !== isSheetOpen || $[21] !== t4 || $[22] !== trigger) {
-			t5 = /* @__PURE__ */ jsxs(DialogTrigger, {
-				isOpen: isSheetOpen,
-				onOpenChange: handleOpenChange,
-				children: [trigger, t4]
-			});
-			$[19] = handleOpenChange;
-			$[20] = isSheetOpen;
-			$[21] = t4;
-			$[22] = trigger;
-			$[23] = t5;
-		} else t5 = $[23];
-		return t5;
-	}
-	let t3;
-	if ($[24] !== children || $[25] !== isOpen || $[26] !== onOpenChange || $[27] !== portalContainerRef || $[28] !== rest) {
-		t3 = /* @__PURE__ */ jsx(BottomSheetBase, {
-			isOpen,
-			onOpenChange,
-			portalContainerRef,
-			...rest,
-			children
-		});
-		$[24] = children;
-		$[25] = isOpen;
-		$[26] = onOpenChange;
-		$[27] = portalContainerRef;
-		$[28] = rest;
-		$[29] = t3;
-	} else t3 = $[29];
-	return t3;
-};
-//#endregion
-export { BottomSheet };

package/dist/components/overlays/BottomSheet/BottomSheetHeader.d.ts

@@ -1,13 +0,0 @@
-import { DragControls } from 'motion/react';
-import { ReactNode } from 'react';
-import { TypographyVariantProps } from '../../text/Typography/typography.cva';
-export interface BottomSheetHeaderProps {
-    label?: ReactNode;
-    isDismissable?: boolean;
-    dragControls?: DragControls;
-    hideHeader?: boolean;
-    hideThumb?: boolean;
-    headerTypography?: TypographyVariantProps;
-    onClose?: () => void;
-}
-export declare const BottomSheetHeader: ({ label, dragControls, isDismissable, hideThumb, hideHeader, headerTypography, onClose, }: BottomSheetHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/overlays/BottomSheet/BottomSheetHeader.js

@@ -1,78 +0,0 @@
-import { Typography } from "../../text/Typography/Typography.js";
-import "../../../config/i18n.js";
-import { X } from "lucide-react";
-import { clsx } from "clsx";
-import { Button } from "react-aria-components";
-import { c } from "react/compiler-runtime";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useTranslation } from "react-i18next";
-//#region src/components/overlays/BottomSheet/BottomSheetHeader.tsx
-var BottomSheetHeader = (t0) => {
-	const $ = c(17);
-	const { label, dragControls, isDismissable, hideThumb, hideHeader, headerTypography, onClose } = t0;
-	const { t } = useTranslation("ui");
-	const t1 = !isDismissable && "pt-list-height-title-top";
-	let t2;
-	if ($[0] !== t1) {
-		t2 = clsx("pb-list-height-title-bottom", t1);
-		$[0] = t1;
-		$[1] = t2;
-	} else t2 = $[1];
-	let t3;
-	if ($[2] !== dragControls || $[3] !== hideThumb || $[4] !== isDismissable) {
-		t3 = isDismissable && !hideThumb && /* @__PURE__ */ jsx("div", {
-			className: "flex shrink-0 cursor-grab touch-none justify-center px-list-side-title pt-list-height-title-top pb-2-5",
-			onPointerDown: (e) => {
-				e.preventDefault();
-				dragControls?.start(e);
-			},
-			"aria-hidden": true,
-			children: /* @__PURE__ */ jsx("div", { className: "h-1 w-16 shrink-0 rounded-full bg-elevation-fill-default-3" })
-		});
-		$[2] = dragControls;
-		$[3] = hideThumb;
-		$[4] = isDismissable;
-		$[5] = t3;
-	} else t3 = $[5];
-	let t4;
-	if ($[6] !== headerTypography || $[7] !== hideHeader || $[8] !== isDismissable || $[9] !== label || $[10] !== onClose || $[11] !== t) {
-		t4 = !hideHeader && /* @__PURE__ */ jsxs("div", {
-			className: "flex justify-between px-list-side-title",
-			children: [/* @__PURE__ */ jsx(Typography, {
-				size: "label-2",
-				variant: "prominent-1",
-				...headerTypography,
-				children: label
-			}), onClose && isDismissable && /* @__PURE__ */ jsx(Button, {
-				onPress: onClose,
-				"aria-label": t(_temp),
-				className: "-m-2 shrink-0 p-2 text-interactive-text-secondary-idle focus-visible:outline-interactive-text-secondary-focus",
-				children: /* @__PURE__ */ jsx(X, { className: "size-6" })
-			})]
-		});
-		$[6] = headerTypography;
-		$[7] = hideHeader;
-		$[8] = isDismissable;
-		$[9] = label;
-		$[10] = onClose;
-		$[11] = t;
-		$[12] = t4;
-	} else t4 = $[12];
-	let t5;
-	if ($[13] !== t2 || $[14] !== t3 || $[15] !== t4) {
-		t5 = /* @__PURE__ */ jsxs("div", {
-			className: t2,
-			children: [t3, t4]
-		});
-		$[13] = t2;
-		$[14] = t3;
-		$[15] = t4;
-		$[16] = t5;
-	} else t5 = $[16];
-	return t5;
-};
-function _temp($) {
-	return $.ui.closeAlt;
-}
-//#endregion
-export { BottomSheetHeader };

package/dist/components/overlays/Drawer/Drawer.d.ts

@@ -1,15 +0,0 @@
-import { ReactNode, RefObject } from 'react';
-export interface DrawerProps {
-    label: string;
-    isOpen?: boolean;
-    portalContainerRef?: RefObject<HTMLElement>;
-    onOpenChange?: (isOpen: boolean) => void;
-    trigger?: ReactNode;
-    children: (close: () => void) => ReactNode;
-    isDismissable?: boolean;
-    overlayClassName?: string;
-    dialogClassName?: string;
-    className?: string;
-    shouldCloseOnInteractOutside?: () => boolean;
-}
-export declare const Drawer: ({ label, isOpen, portalContainerRef, onOpenChange, trigger, children, isDismissable, overlayClassName, dialogClassName, className, shouldCloseOnInteractOutside, }: DrawerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/overlays/Drawer/Drawer.js

@@ -1,95 +0,0 @@
-import { modalOverlay } from "../Modal/modal.cva.js";
-import { clsx } from "clsx";
-import { Dialog, DialogTrigger, Modal, ModalOverlay } from "react-aria-components";
-import { c } from "react/compiler-runtime";
-import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/overlays/Drawer/Drawer.tsx
-var Drawer = (t0) => {
-	const $ = c(25);
-	const { label, isOpen, portalContainerRef, onOpenChange, trigger, children, isDismissable, overlayClassName, dialogClassName, className, shouldCloseOnInteractOutside } = t0;
-	if (trigger) {
-		let t1;
-		if ($[0] !== children || $[1] !== className || $[2] !== dialogClassName || $[3] !== isDismissable || $[4] !== label || $[5] !== overlayClassName || $[6] !== portalContainerRef || $[7] !== shouldCloseOnInteractOutside) {
-			t1 = /* @__PURE__ */ jsx(DrawerOverlay, {
-				label,
-				portalContainerRef,
-				isDismissable,
-				overlayClassName,
-				dialogClassName,
-				className,
-				shouldCloseOnInteractOutside,
-				children
-			});
-			$[0] = children;
-			$[1] = className;
-			$[2] = dialogClassName;
-			$[3] = isDismissable;
-			$[4] = label;
-			$[5] = overlayClassName;
-			$[6] = portalContainerRef;
-			$[7] = shouldCloseOnInteractOutside;
-			$[8] = t1;
-		} else t1 = $[8];
-		let t2;
-		if ($[9] !== isOpen || $[10] !== onOpenChange || $[11] !== t1 || $[12] !== trigger) {
-			t2 = /* @__PURE__ */ jsxs(DialogTrigger, {
-				isOpen,
-				onOpenChange,
-				children: [trigger, t1]
-			});
-			$[9] = isOpen;
-			$[10] = onOpenChange;
-			$[11] = t1;
-			$[12] = trigger;
-			$[13] = t2;
-		} else t2 = $[13];
-		return t2;
-	}
-	let t1;
-	if ($[14] !== children || $[15] !== className || $[16] !== dialogClassName || $[17] !== isDismissable || $[18] !== isOpen || $[19] !== label || $[20] !== onOpenChange || $[21] !== overlayClassName || $[22] !== portalContainerRef || $[23] !== shouldCloseOnInteractOutside) {
-		t1 = /* @__PURE__ */ jsx(DrawerOverlay, {
-			isOpen,
-			onOpenChange,
-			portalContainerRef,
-			isDismissable,
-			overlayClassName,
-			dialogClassName,
-			className,
-			label,
-			shouldCloseOnInteractOutside,
-			children
-		});
-		$[14] = children;
-		$[15] = className;
-		$[16] = dialogClassName;
-		$[17] = isDismissable;
-		$[18] = isOpen;
-		$[19] = label;
-		$[20] = onOpenChange;
-		$[21] = overlayClassName;
-		$[22] = portalContainerRef;
-		$[23] = shouldCloseOnInteractOutside;
-		$[24] = t1;
-	} else t1 = $[24];
-	return t1;
-};
-var DrawerOverlay = ({ label, isOpen, onOpenChange, portalContainerRef, children, isDismissable, overlayClassName, dialogClassName, className, shouldCloseOnInteractOutside }) => {
-	return /* @__PURE__ */ jsx(ModalOverlay, {
-		isOpen,
-		onOpenChange,
-		UNSTABLE_portalContainer: portalContainerRef?.current,
-		className: clsx(modalOverlay(), "z-drawer", overlayClassName),
-		isDismissable,
-		shouldCloseOnInteractOutside,
-		children: /* @__PURE__ */ jsx(Modal, {
-			className: clsx("fixed inset-y-0 right-0 z-drawer w-fit entering:animate-drawer-enter-right exiting:animate-drawer-exit-right bg-elevation-fill-default-1", className),
-			children: /* @__PURE__ */ jsx(Dialog, {
-				"aria-label": label,
-				className: clsx("outline-none", dialogClassName),
-				children: ({ close }) => children(close)
-			})
-		})
-	});
-};
-//#endregion
-export { Drawer };

package/dist/components/overlays/Modal/Modal.d.ts

@@ -1,15 +0,0 @@
-import { PropsWithChildren, RefObject } from 'react';
-import { ModalVariantProps } from './modal.cva';
-export interface ModalProps extends ModalVariantProps {
-    isOpen: boolean;
-    portalContainerRef?: RefObject<HTMLElement>;
-    onClose: () => void;
-    modalClassName?: string;
-    closeIconClassName?: string;
-    overlayClassName?: string;
-    showCloseIcon?: boolean;
-    isDismissable?: boolean;
-    isKeyboardDismissable?: boolean;
-    shouldCloseOnInteractOutside?: () => boolean;
-}
-export declare const Modal: ({ isOpen, portalContainerRef, onClose, aside, children, modalClassName, closeIconClassName, overlayClassName, showCloseIcon, isDismissable, isKeyboardDismissable, shouldCloseOnInteractOutside, }: PropsWithChildren<ModalProps>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/overlays/Modal/Modal.js

@@ -1,55 +0,0 @@
-import { UIOverrides } from "../../../config/uiOverrides.context.js";
-import { InlineIconButton } from "../../buttons/InlineIconButton/InlineIconButton.js";
-import "../../../config/i18n.js";
-import { modalContentDefinition, modalMainDefinition, modalOverlayDefinition } from "./modal.cva.js";
-import { X } from "lucide-react";
-import { clsx } from "clsx";
-import { Dialog, Modal, ModalOverlay } from "react-aria-components";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useTranslation } from "react-i18next";
-//#region src/components/overlays/Modal/Modal.tsx
-var Modal$1 = ({ isOpen, portalContainerRef, onClose, aside, children, modalClassName, closeIconClassName, overlayClassName, showCloseIcon, isDismissable = true, isKeyboardDismissable, shouldCloseOnInteractOutside }) => {
-	const { t } = useTranslation("ui");
-	const modalMainCva = UIOverrides.useCva("modal.mainCva", modalMainDefinition);
-	const modalContentCva = UIOverrides.useCva("modal.contentCva", modalContentDefinition);
-	const modalOverlayCva = UIOverrides.useCva("modal.overlayCva", modalOverlayDefinition);
-	return /* @__PURE__ */ jsx(ModalOverlay, {
-		UNSTABLE_portalContainer: portalContainerRef?.current,
-		className: modalOverlayCva({
-			aside,
-			className: overlayClassName
-		}),
-		isDismissable,
-		isKeyboardDismissDisabled: !(isKeyboardDismissable ?? isDismissable),
-		isOpen,
-		shouldCloseOnInteractOutside: () => {
-			if (shouldCloseOnInteractOutside) {
-				if (portalContainerRef?.current) return false;
-				return shouldCloseOnInteractOutside();
-			}
-			return !portalContainerRef?.current;
-		},
-		onOpenChange: (open) => {
-			if (!open) onClose();
-		},
-		children: /* @__PURE__ */ jsx(Modal, {
-			className: modalMainCva({ aside }),
-			children: /* @__PURE__ */ jsxs(Dialog, {
-				className: modalContentCva({
-					aside,
-					className: modalClassName
-				}),
-				children: [showCloseIcon && /* @__PURE__ */ jsx(InlineIconButton, {
-					color: "secondary",
-					onPress: onClose,
-					icon: X,
-					className: clsx("absolute top-0 right-0 p-modal-gap-desktop-modal-close-icon-top-right", closeIconClassName),
-					label: t(($) => $.ui.modal.closeBtn),
-					disableTooltip: true
-				}), children]
-			})
-		})
-	});
-};
-//#endregion
-export { Modal$1 as Modal };

package/dist/components/overlays/Modal/modal.cva.d.ts

@@ -1,37 +0,0 @@
-import { UIOverrides } from '../../../config/uiOverrides.context';
-export declare const modalContentDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly aside: {
-            readonly left: "h-screen rounded-none border-r";
-            readonly right: "h-screen rounded-none border-l";
-            readonly center: "rounded-modal-rounding-default border";
-        };
-    }>;
-};
-export type ModalConfig = NonNullable<typeof modalContentDefinition.config>;
-export interface ModalVariantProps extends UIOverrides.VariantProps<ModalConfig> {
-}
-export declare const modalOverlayDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly aside: {
-            readonly left: "p-0";
-            readonly right: "p-0";
-            readonly center: "p-4";
-        };
-    }>;
-};
-export declare const modalOverlay: (props?: ({
-    readonly aside?: "left" | "right" | "center" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export declare const modalMainDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly aside: {
-            readonly left: "entering:animate-drawer-enter-left exiting:animate-drawer-exit-left justify-start";
-            readonly right: "entering:animate-drawer-enter-right exiting:animate-drawer-exit-right justify-end";
-            readonly center: "justify-center";
-        };
-    }>;
-};

package/dist/components/overlays/Modal/modal.cva.js

@@ -1,44 +0,0 @@
-import { UIOverrides } from "../../../config/uiOverrides.context.js";
-import { cva } from "class-variance-authority";
-//#region src/components/overlays/Modal/modal.cva.ts
-var modalContentDefinition = UIOverrides.defineConfig({
-	base: [
-		"relative flex flex-col items-center gap-modal-gap-content px-modal-side-mobile py-modal-height-mobile md:px-modal-side-desktop md:py-modal-height-desktop",
-		"w-fit max-w-full [&>*]:max-w-full",
-		"border-elevation-outline-default-1 bg-elevation-fill-default-1 outline-none",
-		"pointer-events-auto"
-	],
-	config: {
-		variants: { aside: {
-			left: "h-screen rounded-none border-r",
-			right: "h-screen rounded-none border-l",
-			center: "rounded-modal-rounding-default border"
-		} },
-		defaultVariants: { aside: "center" }
-	}
-});
-var modalOverlayDefinition = UIOverrides.defineConfig({
-	base: ["fixed inset-0 z-modal flex h-(--visual-viewport-height) w-screen overflow-y-auto bg-support-overlay"],
-	config: {
-		variants: { aside: {
-			left: "p-0",
-			right: "p-0",
-			center: "p-4"
-		} },
-		defaultVariants: { aside: "center" }
-	}
-});
-var modalOverlay = cva(modalOverlayDefinition.base, modalOverlayDefinition.config);
-var modalMainDefinition = UIOverrides.defineConfig({
-	base: ["pointer-events-none my-auto flex w-full"],
-	config: {
-		variants: { aside: {
-			left: "entering:animate-drawer-enter-left exiting:animate-drawer-exit-left justify-start",
-			right: "entering:animate-drawer-enter-right exiting:animate-drawer-exit-right justify-end",
-			center: "justify-center"
-		} },
-		defaultVariants: { aside: "center" }
-	}
-});
-//#endregion
-export { modalContentDefinition, modalMainDefinition, modalOverlay, modalOverlayDefinition };