@proyecto-viviana/ui 0.6.3 → 0.8.0-rc.1

package/dist/_chunk/dialog.jsx

@@ -1,20 +1,51 @@
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/AlertDialog.tsx
+/*
+* Copyright 2024 Adobe. All rights reserved.
+* This file is licensed to you under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License. You may obtain a copy
+* of the License at http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software distributed under
+* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+* OF ANY KIND, either express or implied. See the License for the specific language
+* governing permissions and limitations under the License.
+*/
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/CloseButton.tsx
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/CustomDialog.tsx
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/Dialog.tsx
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/DialogContainer.tsx
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/DialogTrigger.tsx
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/FullscreenDialog.tsx
+// Ported to SolidJS for Proyecto Viviana; based on packages/@react-spectrum/s2/src/Modal.tsx
 import { t as mergeStyles } from "./runtime.jsx";
-import { useTheme } from "../provider/index.jsx";
+import { o as useTheme } from "./provider.jsx";
 import { l as ButtonGroupContext } from "./s2-action-button-styles.jsx";
 import { t as s2IntlStrings } from "./intl.jsx";
 import { CenterBaseline } from "../icon/center-baseline.jsx";
 import { pressScale } from "../pressScale.jsx";
 import { t as IconContext } from "./spectrum-icon.jsx";
 import { ImageContext } from "../image/index.jsx";
-import { d as Heading$1, f as HeadingContext, i as FooterContext, n as ContentContext, o as HeaderContext, t as Content } from "./text.jsx";
+import { i as FooterContext, l as Heading$1, n as ContentContext, o as HeaderContext, t as Content, u as HeadingContext } from "./text.jsx";
 import { i as Button$1 } from "./button.jsx";
 import { t as Cross } from "./Cross.jsx";
 import { ButtonGroup } from "../buttongroup/index.jsx";
-import { t as AlertTriangleIcon } from "./AlertTriangleIcon.jsx";
-import { t as AlertDiamondIcon } from "./AlertDiamondIcon.jsx";
-import { Show, createContext, splitProps, useContext } from "solid-js";
-import { createStringFormatter } from "@proyecto-viviana/solidaria";
-import { Button, ButtonContext, Dialog, DialogContext, DialogTrigger, Heading, Modal, ModalOverlay, useDialogTrigger } from "@proyecto-viviana/solidaria-components";
+import { AlertTriangleIcon } from "../icon/s2wf-icons/AlertTriangleIcon.jsx";
+import { AlertDiamondIcon } from "../icon/s2wf-icons/AlertDiamondIcon.jsx";
+import { Show, createContext, useContext } from "solid-js";
+import { splitProps } from "@proyecto-viviana/solidaria/utils";
+import { Button, ButtonContext, Dialog, DialogContext, DialogTrigger, Heading, Modal, ModalOverlay, TextContext, evaluateRenderChildren, useDialogTrigger } from "@proyecto-viviana/solidaria-components";
+import { createStringFormatter, filterDOMProps as filterDOMProps$1 } from "@proyecto-viviana/solidaria";
 //#region src/dialog/Dialog.tsx
 const DialogContext$1 = createContext(null);
 const DialogContainerContext = createContext(null);
@@ -54,101 +85,106 @@ function joinClass(...classes) {
 }
 const dialogOverlay = function anonymous(props) {
 	let rules = " ";
-	if (props.colorScheme === "dark") rules += " -ICUGx-_pa151";
-	else if (props.colorScheme === "light") rules += " -ICUGx-_pb151";
-	else if (props.colorScheme === "light dark") rules += " -ICUGx-_pc151";
-	rules += " _pK8eoyd151";
-	if (props.colorScheme === "dark") rules += " -NvXmrd-_ZLmU151";
-	else if (props.colorScheme === "light") rules += " -NvXmrd-_ZN8Gi4c151";
+	if (props.colorScheme === "dark") rules += " -ICUGx-_pa17";
+	else if (props.colorScheme === "light") rules += " -ICUGx-_pb17";
 	else if (props.colorScheme === "light dark") {
-		rules += " -NvXmrd-_ZN8Gi4c151";
-		rules += " -NvXmrd-D1v0V_ZLmU151";
+		rules += " -ICUGx-_pb17";
+		rules += " -ICUGx-D1v0V_pa17";
 	}
-	if (props.colorScheme === "dark") rules += " -j9blY-_ZN8Gi4c151";
-	else if (props.colorScheme === "light") rules += " -j9blY-_ZLmU151";
+	rules += " _pK8eoyd17";
+	if (props.colorScheme === "dark") rules += " -NvXmrd-_ZLmU17";
+	else if (props.colorScheme === "light") rules += " -NvXmrd-_ZN8Gi4c17";
 	else if (props.colorScheme === "light dark") {
-		rules += " -j9blY-_ZLmU151";
-		rules += " -j9blY-D1v0V_ZN8Gi4c151";
+		rules += " -NvXmrd-_ZN8Gi4c17";
+		rules += " -NvXmrd-D1v0V_ZLmU17";
 	}
-	rules += " _Pb151";
-	rules += " Wr151";
-	rules += " _lr151";
-	rules += " _Ar151";
-	rules += " _zr151";
-	rules += " _9v0rurc151";
-	rules += " _Bb151";
-	rules += " g8151";
-	if (props.isExiting) rules += " _Ia151";
-	else if (props.isEntering) rules += " _Ia151";
-	rules += " Yf151";
-	if (props.isExiting) rules += " Xa151";
-	else rules += " Xd151";
-	rules += " _2b151";
+	if (props.colorScheme === "dark") rules += " -j9blY-_ZN8Gi4c17";
+	else if (props.colorScheme === "light") rules += " -j9blY-_ZLmU17";
+	else if (props.colorScheme === "light dark") {
+		rules += " -j9blY-_ZLmU17";
+		rules += " -j9blY-D1v0V_ZN8Gi4c17";
+	}
+	rules += " _Pb17";
+	rules += " Wr17";
+	rules += " _lr17";
+	rules += " _Ar17";
+	rules += " _zr17";
+	rules += " _9v0rurc17";
+	rules += " _Bb17";
+	rules += " g817";
+	if (props.isExiting) rules += " _Ia17";
+	else if (props.isEntering) rules += " _Ia17";
+	rules += " Yf17";
+	if (props.isExiting) rules += " Xa17";
+	else rules += " Xd17";
+	rules += " _2b17";
 	return rules;
 };
 const dialogModalWrapper = function anonymous(props) {
 	let rules = " ";
-	rules += " _Pb151";
-	rules += " Wr151";
-	rules += " _lr151";
-	rules += " _Ar151";
-	rules += " _zr151";
-	rules += " _97Iyurc151";
-	rules += " Za151";
-	rules += " FjBYic151";
-	rules += " sd151";
-	if (props.size === "fullscreenTakeover") rules += " ed151";
-	else rules += " eb151";
-	rules += " _Ca151";
-	rules += " _Ob151";
+	rules += " _Pb17";
+	rules += " Wr17";
+	rules += " _lr17";
+	rules += " _Ar17";
+	rules += " _zr17";
+	rules += " _97Iyurc17";
+	rules += " Za17";
+	rules += " FjBYic17";
+	rules += " sd17";
+	if (props.size === "fullscreenTakeover") rules += " ed17";
+	else rules += " eb17";
+	rules += " _Ca17";
+	rules += " _Ob17";
 	return rules;
 };
 const dialogModal = function anonymous(props) {
 	let rules = " ";
-	rules += " sd151";
-	rules += " _ta151";
-	rules += " _Oa151";
-	if (props.size === "fullscreenTakeover") rules += " od151";
-	else rules += " oe151";
-	if (props.size === "fullscreenTakeover") rules += " nd151";
-	else rules += " ne151";
-	if (props.size === "fullscreenTakeover") rules += " kd151";
-	else rules += " ke151";
-	if (props.size === "fullscreenTakeover") rules += " jd151";
-	else rules += " je151";
-	if (props.size === "fullscreenTakeover") rules += " Za151";
-	else if (props.size === "fullscreen") rules += " ZGqsG7b151";
-	else if (props.size === "XL") rules += " ZbRWaYd151";
-	else if (props.size === "L") rules += " Zb4QY4151";
-	else if (props.size === "M") rules += " ZILqIYb151";
-	else if (props.size === "S") rules += " ZA151";
-	if (props.size === "fullscreenTakeover") rules += " Fb151";
-	else if (props.size === "fullscreen") rules += " FGqsG7b151";
-	if (props.size === "fullscreenTakeover") rules += " Lp151";
-	else if (props.size === "fullscreen") rules += " Lp151";
-	else rules += " Lc151";
-	if (props.size === "fullscreenTakeover") rules += " Ki151";
-	else if (props.size === "fullscreen") rules += " Ki151";
-	else rules += " KjVOfn151";
-	if (props.size === "fullscreenTakeover") rules += " QILlin151";
-	rules += " -Ovbhqd-g9ORGnd151";
-	rules += " gEzkoQe151";
-	rules += " -Jvcevd-Nbc1hc151";
-	rules += " _Lf151";
-	rules += " _Mb151";
-	rules += " Oj151";
-	if (props.isExiting) rules += " _Ia151";
-	else if (props.isEntering) rules += " _Ia151";
+	rules += " sd17";
+	rules += " _ta17";
+	rules += " _Oa17";
+	if (props.size === "fullscreenTakeover") rules += " od17";
+	else rules += " oQvqurc17";
+	if (props.size === "fullscreenTakeover") rules += " nd17";
+	else rules += " nQvqurc17";
+	if (props.size === "fullscreenTakeover") rules += " kd17";
+	else rules += " kQvqurc17";
+	if (props.size === "fullscreenTakeover") rules += " jd17";
+	else rules += " jQvqurc17";
+	if (props.size === "fullscreenTakeover") rules += " Za17";
+	else if (props.size === "fullscreen") rules += " ZGqsG7b17";
+	else if (props.size === "XL") rules += " ZbRWaYd17";
+	else if (props.size === "L") rules += " Zb4QY417";
+	else if (props.size === "M") rules += " ZILqIYb17";
+	else if (props.size === "S") rules += " ZA17";
+	if (props.size === "fullscreenTakeover") rules += " Fb17";
+	else if (props.size === "fullscreen") rules += " FGqsG7b17";
+	if (props.size === "fullscreenTakeover") rules += " Lp17";
+	else if (props.size === "fullscreen") rules += " Lp17";
+	else rules += " Lc17";
+	if (props.size === "fullscreenTakeover") rules += " Ki17";
+	else if (props.size === "fullscreen") rules += " Ki17";
+	else rules += " KjVOfn17";
+	if (props.size === "fullscreenTakeover") rules += " QILlin17";
+	rules += " -Ovbhqd-gBNUKmd17";
+	rules += " gEzkoQe17";
+	rules += " -Jvcevd-0bAVIe17";
+	if (props.size === "fullscreenTakeover") rules += " _nd17";
+	else rules += " _nmHdxkc17";
+	rules += " _Lf17";
+	rules += " _Mb17";
+	rules += " Oj17";
+	if (props.isExiting) rules += " _Ia17";
+	else if (props.isEntering) rules += " _Ia17";
 	if (props.isEntering) {
-		rules += " -_8PloMd-w151";
-		rules += " __Ya151";
+		rules += " -_8PloMd-w17";
+		rules += " __Ya17";
 	}
-	rules += " YmenWad151";
-	if (props.isExiting) rules += " Xa151";
-	else rules += " Xd151";
-	rules += " _2b151";
-	if (props.isExiting) rules += " _1a151";
-	else rules += " _1b151";
+	rules += " YmenWad17";
+	if (props.isExiting) rules += " Xa17";
+	else rules += " Xd17";
+	rules += " _2b17";
+	if (props.isExiting) rules += " _1a17";
+	else rules += " _1b17";
 	return rules;
 };
 function dialogOverlayLayoutStyle(colorScheme) {
@@ -170,22 +206,22 @@ function dialogModalWrapperLayoutStyle(colorScheme) {
 		"color-scheme": colorScheme
 	};
 }
-const dialogInner = " sd151 _ta151 _ub151 K40ub4c151 _oa151 _Le151 uk151 ucJ9TBTb151 ud3Euai151 uea151 ugb151 uhd151 uje151 u2NhKxcl151 uic151 oi151 ni151 ki151 ji151 _Na151 Pa151";
-const dialogImage = " Za151 FC151 _va151 _Hb151";
+const dialogInner = " sd17 _ta17 _ub17 K40ub4c17 _oa17 _Le17 uk17 ucJ9TBTb17 ud3Euai17 uea17 ugb17 uhd17 uje17 u2NhKxcl17 uic17 oi17 ni17 ki17 ji17 _Na17 Pa17";
+const dialogImage = " Za17 FC17 _va17 _Hb17";
 const dialogTop = function anonymous(props) {
 	let rules = " ";
-	rules += " sd151";
-	rules += " ed151";
-	rules += " qg151";
-	rules += " Te151";
-	rules += " Sk151";
-	if (props.isDismissible) rules += " Re151";
-	else rules += " Rk151";
+	rules += " sd17";
+	rules += " ed17";
+	rules += " qg17";
+	rules += " Te17";
+	rules += " Sk17";
+	if (props.isDismissible) rules += " Re17";
+	else rules += " Rk17";
 	return rules;
 };
-const dialogHeaderWrapper = " sd151 _ub151 Na151 Jz151 GC151 Ue151 qj151 _ta151 _tnc151 ed151 enb151";
-const dialogHeading = " _ub151 Jy151 Gy151 uiWD3ad151 ucJ9TBTb151 ud3Euai151 uea151 ugb151 uhd151 uje151 u2NhKxcl151 uic151 -_6BNtrc-g151 vx151 xd151 _xa151 xX0cczbc151 _xX0cczba151 xfd151 _xfa151 xfX0cczbc151 _xfX0cczba151 _Fd151 _FnuYUweb151 pHKLAu151";
-const dialogHeader = " Jy151 Gy151 Iy151 Hy151 uk151 ucJ9TBTb151 ud3Euai151 uea151 ugb151 uhd151 uje151 u2NhKxcl151 uic151 -_6BNtrc-c151 vx151 xb151 _xa151 _Fb151 _FnuYUwec151 pHKLAu151";
+const dialogHeaderWrapper = " sd17 _ub17 Na17 Jz17 GC17 Ue17 qj17 _ta17 _tnc17 ed17 enb17";
+const dialogHeading = " _ub17 Jy17 Gy17 uiWD3ad17 ucJ9TBTb17 ud3Euai17 uea17 ugb17 uhd17 uje17 u2NhKxcl17 uic17 -_6BNtrc-g17 vx17 xd17 _xa17 xX0cczbc17 _xX0cczba17 xfd17 _xfa17 xfX0cczbc17 _xfX0cczba17 _Fd17 _FnuYUweb17 pmiKvLd17";
+const dialogHeader = " Jy17 Gy17 Iy17 Hy17 uk17 ucJ9TBTb17 ud3Euai17 uea17 ugb17 uhd17 uje17 u2NhKxcl17 uic17 -_6BNtrc-c17 vx17 xb17 _xa17 _Fb17 _FnuYUwec17 pmiKvLd17";
 const closeButton = function anonymous(props, overrides) {
 	let rules = " ";
 	let width = false;
@@ -196,107 +232,111 @@ const closeButton = function anonymous(props, overrides) {
 		if (p[1] === "_v") flexShrink = true;
 		rules += p[0];
 	}
-	if (props.isFocusVisible) rules += " _Lf151";
-	else rules += " _Le151";
-	if (props.isStaticColor) rules += " Oe151";
-	else rules += " O8KaFke151";
-	rules += " Olc151";
-	rules += " _Mc151";
-	rules += " _Kd151";
-	if (props.staticColor === "white") rules += " -Ovbhqd-gcwrnr151";
-	else if (props.staticColor === "black") rules += " -Ovbhqd-g4hn3s151";
-	rules += " sd151";
-	rules += " eb151";
-	rules += " _Ca151";
+	if (props.isFocusVisible) rules += " _Lf17";
+	else rules += " _Le17";
+	if (props.isStaticColor) rules += " Oe17";
+	else rules += " Or2Mazb17";
+	rules += " Olc17";
+	rules += " _Mc17";
+	rules += " _Kd17";
+	if (props.staticColor === "white") rules += " -Ovbhqd-gcwrnr17";
+	else if (props.staticColor === "black") rules += " -Ovbhqd-g4hn3s17";
+	rules += " sd17";
+	rules += " eb17";
+	rules += " _Ca17";
 	if (props.size === "XL") {
-		if (!width) rules += " ZF151";
+		if (!width) rules += " ZF17";
 	} else if (props.size === "L") {
-		if (!width) rules += " Zw151";
+		if (!width) rules += " Zw17";
 	} else if (props.size === "S") {
-		if (!width) rules += " Zo151";
+		if (!width) rules += " Zo17";
 	} else if (props.size === "XS") {
-		if (!width) rules += " Zm151";
-	} else if (!width) rules += " ZC151";
-	if (props.size === "XL") rules += " Fz151";
-	else if (props.size === "L") rules += " Fv151";
-	else if (props.size === "S") rules += " Fp151";
-	else if (props.size === "XS") rules += " Fn151";
-	else rules += " Fx151";
-	if (!flexShrink) rules += " _va151";
-	rules += " og151";
-	rules += " ng151";
-	rules += " kg151";
-	rules += " jg151";
-	rules += " Td151";
-	rules += " Qd151";
-	rules += " Sd151";
-	rules += " Rd151";
-	rules += " _je151";
-	rules += " Yd151";
-	rules += " Xb151";
-	rules += " _2b151";
-	if (props.isPressed) if (props.isStaticColor) rules += " gg151";
-	else rules += " gG1H3ce151";
-	else if (props.isFocusVisible) if (props.isStaticColor) rules += " gg151";
-	else rules += " gG1H3ce151";
-	else if (props.isHovered) if (props.isStaticColor) rules += " gg151";
-	else rules += " gG1H3ce151";
-	else rules += " g9151";
-	if (props.isStaticColor) if (props.isDisabled) rules += " -_8sjo0b-pi151";
-	else rules += " -_8sjo0b-px151";
-	else if (props.isDisabled) rules += " -_8sjo0b-pUvnvv151";
-	else if (props.isPressed) rules += " -_8sjo0b-pMwyHo151";
-	else if (props.isFocusVisible) rules += " -_8sjo0b-pMwyHo151";
-	else if (props.isHovered) rules += " -_8sjo0b-pMwyHo151";
-	else rules += " -_8sjo0b-pHKLAu151";
-	if (props.isDisabled) rules += " -_8sjo0b-lpc151";
-	else rules += " -_8sjo0b-lpb151";
-	rules += " __ca151";
+		if (!width) rules += " Zm17";
+	} else if (!width) rules += " ZC17";
+	if (props.size === "XL") rules += " Fz17";
+	else if (props.size === "L") rules += " Fv17";
+	else if (props.size === "S") rules += " Fp17";
+	else if (props.size === "XS") rules += " Fn17";
+	else rules += " Fx17";
+	if (!flexShrink) rules += " _va17";
+	rules += " og17";
+	rules += " ng17";
+	rules += " kg17";
+	rules += " jg17";
+	rules += " Td17";
+	rules += " Qd17";
+	rules += " Sd17";
+	rules += " Rd17";
+	rules += " _je17";
+	rules += " Yd17";
+	rules += " Xb17";
+	rules += " _2b17";
+	if (props.isPressed) {
+		if (props.isStaticColor) rules += " gg17";
+		else rules += " g8DRfdc17";
+	} else if (props.isFocusVisible) {
+		if (props.isStaticColor) rules += " gg17";
+		else rules += " g8DRfdc17";
+	} else if (props.isHovered) {
+		if (props.isStaticColor) rules += " gg17";
+		else rules += " g8DRfdc17";
+	} else rules += " g917";
+	if (props.isStaticColor) {
+		if (props.isDisabled) rules += " -_8sjo0b-pi17";
+		else rules += " -_8sjo0b-pl17";
+	} else if (props.isDisabled) rules += " -_8sjo0b-p8H6Pad17";
+	else if (props.isPressed) rules += " -_8sjo0b-pBJTC6c17";
+	else if (props.isFocusVisible) rules += " -_8sjo0b-pBJTC6c17";
+	else if (props.isHovered) rules += " -_8sjo0b-pBJTC6c17";
+	else rules += " -_8sjo0b-pmiKvLd17";
+	if (props.isDisabled) rules += " -_8sjo0b-lpc17";
+	else rules += " -_8sjo0b-lpb17";
+	rules += " __ca17";
 	return rules;
 };
-const dialogCloseButtonMargin = " Gx151";
-const dialogContent = " _ub151 Ma151 Pa151 Sk151 Rk151 uk151 ucJ9TBTb151 ud3Euai151 uea151 ugb151 uhd151 uje151 u2NhKxcl151 uic151 -_6BNtrc-c151 vx151 xb151 _xa151 _Fb151 _FnuYUwec151 pHKLAu151";
-const dialogFooterWrapper = " sd151 _ub151 eb151 _wb151 Uj151 qj151 Sk151 Rk151 Td151 Qk151";
-const dialogFooter = " sd151 Ue151 qe151 _Cb151 eb151 JA151 Tf151 _kb151 iG1H3ce151";
-const dialogButtonGroup = " IM151 La151";
-const fullscreenDialogInner = " se151 Eskifrb151 Ma151 Fb151 uk151 ucJ9TBTb151 ud3Euai151 uea151 ugb151 uhd151 uje151 u2NhKxcl151 uic151 -_6BNtrc-c151 vx151 xb151 _xa151 _Fb151 _FnuYUwec151 pHKLAu151 _Le151";
-const fullscreenDialogHeader = " sd151 eb151 Uj151 qj151 Sk151 Rk151 Th151 Qh151 hb151 iG1H3ce151";
-const fullscreenDialogContent = " Ma151 _Na151 Pa151 Tk151 Qk151 Sk151 Rk151";
+const dialogCloseButtonMargin = " Gx17";
+const dialogContent = " _ub17 Ma17 Pa17 Sk17 Rk17 uk17 ucJ9TBTb17 ud3Euai17 uea17 ugb17 uhd17 uje17 u2NhKxcl17 uic17 -_6BNtrc-c17 vx17 xb17 _xa17 _Fb17 _FnuYUwec17 pmiKvLd17";
+const dialogFooterWrapper = " sd17 _ub17 eb17 _wb17 Uj17 qj17 Sk17 Rk17 Tk17 Tad17 Qk17";
+const dialogFooter = " sd17 Ue17 qe17 _Cb17 eb17 JA17 Tf17 _kb17 iaCI3de17";
+const dialogButtonGroup = " IM17 La17";
+const fullscreenDialogInner = " se17 Eskifrb17 Ma17 Fb17 uk17 ucJ9TBTb17 ud3Euai17 uea17 ugb17 uhd17 uje17 u2NhKxcl17 uic17 -_6BNtrc-c17 vx17 xb17 _xa17 _Fb17 _FnuYUwec17 pmiKvLd17 _Le17";
+const fullscreenDialogHeader = " sd17 eb17 Uj17 qj17 Sk17 Rk17 Th17 Qh17 hb17 iaCI3de17";
+const fullscreenDialogContent = " Ma17 _Na17 Pa17 Tk17 Qk17 Sk17 Rk17";
 const customDialog = function anonymous(props) {
 	let rules = " ";
-	if (props.padding === "none") rules += " Td151";
+	if (props.padding === "none") rules += " Td17";
 	else if (props.padding === "default") {
-		rules += " Th151";
-		rules += " Tnk151";
+		rules += " Th17";
+		rules += " Tnk17";
 	}
-	if (props.padding === "none") rules += " Qd151";
+	if (props.padding === "none") rules += " Qd17";
 	else if (props.padding === "default") {
-		rules += " Qh151";
-		rules += " Qnk151";
+		rules += " Qh17";
+		rules += " Qnk17";
 	}
-	if (props.padding === "none") rules += " Sd151";
+	if (props.padding === "none") rules += " Sd17";
 	else if (props.padding === "default") {
-		rules += " Sh151";
-		rules += " Snk151";
+		rules += " Sh17";
+		rules += " Snk17";
 	}
-	if (props.padding === "none") rules += " Rd151";
+	if (props.padding === "none") rules += " Rd17";
 	else if (props.padding === "default") {
-		rules += " Rh151";
-		rules += " Rnk151";
+		rules += " Rh17";
+		rules += " Rnk17";
 	}
-	rules += " _oa151";
-	rules += " _Le151";
-	rules += " oi151";
-	rules += " ni151";
-	rules += " ki151";
-	rules += " ji151";
-	rules += " _Na151";
-	rules += " Pa151";
-	rules += " _Pc151";
-	rules += " Za151";
-	rules += " Fb151";
-	rules += " L40ub4c151";
-	rules += " K40ub4c151";
+	rules += " _oa17";
+	rules += " _Le17";
+	rules += " oi17";
+	rules += " ni17";
+	rules += " ki17";
+	rules += " ji17";
+	rules += " _Na17";
+	rules += " Pa17";
+	rules += " _Pc17";
+	rules += " Za17";
+	rules += " Fb17";
+	rules += " L40ub4c17";
+	rules += " K40ub4c17";
 	return rules;
 };
 function DialogModal(props) {
@@ -316,19 +356,19 @@ function DialogModal(props) {
     </ModalOverlay>;
 }
 function SlotProviders(props) {
-	return <ImageContext.Provider value={props.image ?? null}>
-      <HeadingContext.Provider value={props.heading ?? null}>
-        <HeaderContext.Provider value={props.header ?? null}>
-          <ContentContext.Provider value={props.content ?? null}>
-            <FooterContext.Provider value={props.footer ?? null}>
-              <ButtonGroupContext.Provider value={props.buttonGroup ?? null}>
+	return <ImageContext value={props.image ?? null}>
+      <HeadingContext value={props.heading ?? null}>
+        <HeaderContext value={props.header ?? null}>
+          <ContentContext value={props.content ?? null}>
+            <FooterContext value={props.footer ?? null}>
+              <ButtonGroupContext value={props.buttonGroup ?? null}>
                 {props.children}
-              </ButtonGroupContext.Provider>
-            </FooterContext.Provider>
-          </ContentContext.Provider>
-        </HeaderContext.Provider>
-      </HeadingContext.Provider>
-    </ImageContext.Provider>;
+              </ButtonGroupContext>
+            </FooterContext>
+          </ContentContext>
+        </HeaderContext>
+      </HeadingContext>
+    </ImageContext>;
 }
 function DialogHeaderSlots(props) {
 	const headlessContext = useContext(DialogContext);
@@ -340,8 +380,19 @@ function DialogHeaderSlots(props) {
       {props.children}
     </SlotProviders>;
 }
+function descriptionIdFromRacText(racText) {
+	if (!racText || typeof racText !== "object" || !("slots" in racText)) return {};
+	const description = racText.slots?.description;
+	if (!description || typeof description !== "object") return {};
+	const id = "id" in description ? description.id : void 0;
+	return typeof id === "string" ? { id } : {};
+}
 function DialogContentSlots(props) {
-	return <SlotProviders image={{ hidden: true }} heading={{ slots: { title: { isHidden: true } } }} header={{ isHidden: true }} content={{ styles: dialogContent }} footer={{ isHidden: true }} buttonGroup={{ isHidden: true }}>
+	const racText = useContext(TextContext);
+	return <SlotProviders image={{ hidden: true }} heading={{ slots: { title: { isHidden: true } } }} header={{ isHidden: true }} content={{
+		styles: dialogContent,
+		...descriptionIdFromRacText(racText)
+	}} footer={{ isHidden: true }} buttonGroup={{ isHidden: true }}>
       {props.children}
     </SlotProviders>;
 }
@@ -366,7 +417,7 @@ function DialogImageSlots(props) {
     </SlotProviders>;
 }
 function renderDialogChildren(children, renderProps) {
-	return typeof children === "function" ? children(renderProps) : children;
+	return evaluateRenderChildren(children, renderProps);
 }
 function resolveDialogClose(localOnClose, containerContext, close) {
 	return () => {
@@ -403,21 +454,21 @@ function resolveDialogClose(localOnClose, containerContext, close) {
 	const isDismissible = () => local.isDismissible ?? local.isDismissable ?? triggerOptions?.isDismissible ?? false;
 	const isKeyboardDismissDisabled = () => local.isKeyboardDismissDisabled ?? triggerOptions?.isKeyboardDismissDisabled ?? false;
 	const hasLegacyTitle = () => local.title !== void 0 && local.title !== null;
-	const className = () => joinClass("comparison-spectrum-Dialog", dialogInner, resolveStyles(local.styles), local.UNSAFE_className, local.class);
+	const className = () => joinClass(dialogInner, resolveStyles(local.styles), local.UNSAFE_className, local.class);
 	return <DialogModal size={size()} isDismissible={isDismissible()} isKeyboardDismissDisabled={isKeyboardDismissDisabled()} isOpen={containerContext ? true : void 0} onOpenChange={containerContext ? (open) => !open && containerContext.dismiss() : void 0}>
       <Dialog {...rest} class={className()} style={local.UNSAFE_style} data-size={size()} children={(renderProps) => {
 		const { close } = renderProps;
 		const handleDismiss = resolveDialogClose(local.onClose, containerContext, close);
 		const renderedChildren = () => renderDialogChildren(local.children, { close: handleDismiss });
-		return <DialogContext$1.Provider value={{ close: handleDismiss }}>
-              <ButtonContext.Provider value={{ slots: {
+		return <DialogContext$1 value={{ close: handleDismiss }}>
+              <ButtonContext value={{ slots: {
 			default: {},
 			close: { onPress: () => handleDismiss() }
 		} }}>
                 <Show when={!hasLegacyTitle()} fallback={<>
                       <div class={dialogTop({ isDismissible: isDismissible() })}>
                         <div class={dialogHeaderWrapper}>
-                          <Heading level={2} class={dialogHeading}>
+                          <Heading slot="title" class={dialogHeading}>
                             {local.title}
                           </Heading>
                         </div>
@@ -443,8 +494,8 @@ function resolveDialogClose(localOnClose, containerContext, close) {
                     </DialogFooterSlots>
                   </div>
                 </Show>
-              </ButtonContext.Provider>
-            </DialogContext$1.Provider>;
+              </ButtonContext>
+            </DialogContext$1>;
 	}} />
     </DialogModal>;
 }
@@ -469,16 +520,16 @@ function DialogTriggerChildren(props) {
 		isKeyboardDismissDisabled: props.isKeyboardDismissDisabled
 	});
 	return <DialogTrigger isOpen={props.isOpen} defaultOpen={props.defaultOpen} onOpenChange={props.onOpenChange}>
-      <DialogTriggerOptionsContext.Provider value={options()}>
+      <DialogTriggerOptionsContext value={options()}>
         <DialogTriggerChildren {...props} />
-      </DialogTriggerOptionsContext.Provider>
+      </DialogTriggerOptionsContext>
     </DialogTrigger>;
 }
 function DialogContainer(props) {
 	return <Show when={props.children}>
-      <DialogContainerContext.Provider value={{ dismiss: props.onDismiss }}>
+      <DialogContainerContext value={{ dismiss: props.onDismiss }}>
         {props.children}
-      </DialogContainerContext.Provider>
+      </DialogContainerContext>
     </Show>;
 }
 const closeButtonIconSize = {
@@ -527,14 +578,14 @@ function FullscreenDialog(props) {
 	]);
 	const containerContext = useContext(DialogContainerContext);
 	const size = () => local.variant ?? "fullscreen";
-	const className = () => joinClass("comparison-spectrum-FullscreenDialog", fullscreenDialogInner, resolveStyles(local.styles), local.UNSAFE_className, local.class);
+	const className = () => joinClass(fullscreenDialogInner, resolveStyles(local.styles), local.UNSAFE_className, local.class);
 	return <DialogModal size={size()} isKeyboardDismissDisabled={local.isKeyboardDismissDisabled} isOpen={containerContext ? true : void 0} onOpenChange={containerContext ? (open) => !open && containerContext.dismiss() : void 0}>
       <Dialog {...rest} class={className()} style={local.UNSAFE_style} data-variant={size()} children={(renderProps) => {
 		const { close } = renderProps;
 		const handleDismiss = resolveDialogClose(local.onClose, containerContext, close);
 		const renderedChildren = () => renderDialogChildren(local.children, { close: handleDismiss });
-		return <DialogContext$1.Provider value={{ close: handleDismiss }}>
-              <ButtonContext.Provider value={{ slots: {
+		return <DialogContext$1 value={{ close: handleDismiss }}>
+              <ButtonContext value={{ slots: {
 			default: {},
 			close: { onPress: () => handleDismiss() }
 		} }}>
@@ -545,8 +596,8 @@ function FullscreenDialog(props) {
                 <div class={fullscreenDialogContent}>
                   <DialogContentSlots>{renderedChildren()}</DialogContentSlots>
                 </div>
-              </ButtonContext.Provider>
-            </DialogContext$1.Provider>;
+              </ButtonContext>
+            </DialogContext$1>;
 	}} />
     </DialogModal>;
 }
@@ -569,20 +620,20 @@ function CustomDialog(props) {
 	const size = () => normalizeCustomDialogSize(local.size);
 	const isDismissible = () => local.isDismissible ?? local.isDismissable ?? triggerOptions?.isDismissible ?? false;
 	const isKeyboardDismissDisabled = () => local.isKeyboardDismissDisabled ?? triggerOptions?.isKeyboardDismissDisabled ?? false;
-	const className = () => joinClass("comparison-spectrum-CustomDialog", customDialog({ padding: local.padding ?? "default" }), resolveStyles(local.styles), local.UNSAFE_className, local.class);
+	const className = () => joinClass(customDialog({ padding: local.padding ?? "default" }), resolveStyles(local.styles), local.UNSAFE_className, local.class);
 	return <DialogModal size={size()} isDismissible={isDismissible()} isKeyboardDismissDisabled={isKeyboardDismissDisabled()} isOpen={containerContext ? true : void 0} onOpenChange={containerContext ? (open) => !open && containerContext.dismiss() : void 0}>
       <Dialog {...rest} class={className()} style={local.UNSAFE_style} data-size={size()} children={(renderProps) => {
 		const { close } = renderProps;
 		const handleDismiss = resolveDialogClose(local.onClose, containerContext, close);
 		const renderedChildren = () => renderDialogChildren(local.children, { close: handleDismiss });
-		return <DialogContext$1.Provider value={{ close: handleDismiss }}>
-              <ButtonContext.Provider value={{ slots: {
+		return <DialogContext$1 value={{ close: handleDismiss }}>
+              <ButtonContext value={{ slots: {
 			default: {},
 			close: { onPress: () => handleDismiss() }
 		} }}>
                 <DialogTitleSlots>{renderedChildren()}</DialogTitleSlots>
-              </ButtonContext.Provider>
-            </DialogContext$1.Provider>;
+              </ButtonContext>
+            </DialogContext$1>;
 	}} />
     </DialogModal>;
 }
@@ -595,9 +646,9 @@ function CustomDialog(props) {
 //#region src/dialog/AlertDialog.tsx
 const icon = function anonymous(props) {
 	let rules = " ";
-	rules += " Hv151";
-	if (props.variant === "warning") rules += " -_8sjo0b-tz7uc2d151";
-	else if (props.variant === "error") rules += " -_8sjo0b-tQQET4151";
+	rules += " Hv17";
+	if (props.variant === "warning") rules += " -_8sjo0b-ty6wNQe17";
+	else if (props.variant === "error") rules += " -_8sjo0b-tZozxeb17";
 	return rules;
 };
 function primaryVariant(variant) {
@@ -612,7 +663,7 @@ function runAction(close, action) {
 /**
 * A dialog that requires user acknowledgement before proceeding.
 */ function AlertDialog(props) {
-	const [local] = splitProps(props, [
+	const [local, rest] = splitProps(props, [
 		"title",
 		"children",
 		"trigger",
@@ -638,9 +689,10 @@ function runAction(close, action) {
 	const variant = () => local.variant ?? "confirmation";
 	const isDismissible = () => local.isDismissible ?? local.isDismissable ?? false;
 	const primaryActionLabel = () => local.primaryActionLabel ?? "Confirm";
-	const dialog = () => <Dialog$1 role="alertdialog" size={local.size ?? "M"} isDismissible={isDismissible()} class={local.class}>
+	const domProps = () => filterDOMProps$1(rest, { labelable: true });
+	const dialog = () => <Dialog$1 {...domProps()} role="alertdialog" size={local.size ?? "M"} isDismissible={isDismissible()} class={local.class}>
       {({ close }) => <>
-          <IconContext.Provider value={{ styles: () => icon({ variant: variant() }) }}>
+          <IconContext value={{ styles: () => icon({ variant: variant() }) }}>
             <Heading$1 slot="title">
               <CenterBaseline>
                 <Show when={variant() === "error"}>
@@ -652,7 +704,7 @@ function runAction(close, action) {
                 {local.title}
               </CenterBaseline>
             </Heading$1>
-          </IconContext.Provider>
+          </IconContext>
           <Content>{local.children}</Content>
           <ButtonGroup>
             <Show when={local.cancelLabel}>