@proyecto-viviana/ui 0.6.2 → 0.8.0-rc.0

package/dist/calendar/DatePicker.js

@@ -1,24 +1,42 @@
-import { useProviderProps, useTheme } from "../provider/index.js";
+/*
+* 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/DatePicker.tsx
+import { a as useProviderProps, o as useTheme } from "../_chunk/provider.js";
 import { n as getSlottedContextProps } from "../_chunk/spectrum-context.js";
+import { t as s2IntlStrings } from "../_chunk/intl.js";
 import { CenterBaseline } from "../icon/center-baseline.js";
 import { pressScale } from "../pressScale.js";
 import { Calendar as Calendar$1 } from "./index.js";
 import { t as AlertTriangleIcon } from "../_chunk/AlertTriangleIcon.js";
-import { t as Asterisk } from "../_chunk/macro-83d341382c2b3adbe4d61fd2d4cbcef9c975a50a2015d8b838b815a76d3721ad.js";
-/* empty css                                                                               */
+import { t as Asterisk } from "../_chunk/macro-d2704bd5d9b60d26ff1e50aa3db378885d30e50caf8dc7b31cfaf5dd36a09d85.js";
 /* empty css                                                                               */
 /* empty css                                                                               */
 /* empty css                                                                               */
 /* empty css                                                                               */
 import { TimeField as TimeField$1 } from "./TimeField.js";
-import { t as CalendarIcon } from "../_chunk/macro-f52adb040970e0b99f7bd8dde6e51b70e1b115fe15bbc8b13b9bcacf4fa1119f.js";
+import { t as CalendarIcon } from "../_chunk/macro-0c970980e41c1a2911feef26e26be361cf5bfcdd5b643f899eba4120e6d57d69.js";
 /* empty css                                                                               */
-import { className, createComponent, effect, getNextElement, getNextMarker, insert, memo, mergeProps, runHydrationEvents, spread, template } from "solid-js/web";
-import { Show, createContext, createSignal, mergeProps as mergeProps$1, splitProps, useContext } from "solid-js";
-import { createHover, useLocale } from "@proyecto-viviana/solidaria";
+import { className, createComponent, effect, getNextElement, getNextMarker, insert, memo, mergeProps, readShallow, runHydrationEvents, scope, spread, template } from "@solidjs/web";
+import { Show, createContext, createSignal, useContext } from "solid-js";
+import { splitProps } from "@proyecto-viviana/solidaria/utils";
 import { DateInput, DatePicker as DatePicker$1, DatePickerButton, DatePickerContent, DatePickerDescription, DatePickerErrorMessage, DatePickerLabel, DateSegment, useDatePickerContext } from "@proyecto-viviana/solidaria-components";
+import { createHover, createStringFormatter, mergeProps as mergeProps$2, useLocale } from "@proyecto-viviana/solidaria";
 //#region src/calendar/DatePicker.tsx
-var _tmpl$ = /*#__PURE__*/ template(`<div>`), _tmpl$2 = /*#__PURE__*/ template(`<span class=" _7c151">&nbsp;<!$><!/>`), _tmpl$3 = /*#__PURE__*/ template(`<span data-slot=contextualHelp class=" _7c151">`), _tmpl$4 = /*#__PURE__*/ template(`<div><!$><!/><!$><!/>`), _tmpl$5 = /*#__PURE__*/ template(`<div class=" _ub151 _vb151 Na151 Fb151 _Na151 Pc151 -dLGswc-h3TDrc151 sd151 eb151 __Wb151">`), _tmpl$6 = /*#__PURE__*/ template(`<div class=" Td151 Qd151 Sd151 Rd151 _oa151 _Le151 oi151 ni151 ki151 ji151 _Na151 Pa151 _Pc151 Za151 L40ub4c151 K40ub4c151"><div class=" Sf151 Rf151 Th151 Qh151 _Na151 Pa151 sd151 _ta151 Ul151 ql151 _oa151 Za151 Fb151"><!$><!/><!$><!/>`);
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+var _tmpl$2 = /* @__PURE__ */ template(`<span class=" _7c17">&nbsp;<!$><!/>`);
+var _tmpl$3 = /* @__PURE__ */ template(`<span data-slot=contextualHelp class=" _7c17">`);
+var _tmpl$4 = /* @__PURE__ */ template(`<div><!$><!/><!$><!/>`);
+var _tmpl$5 = /* @__PURE__ */ template(`<div class=" _ub17 _vb17 Na17 Fb17 _Na17 Pc17 -dLGswc-h3TDrc17 sd17 eb17 __Wb17">`);
+var _tmpl$6 = /* @__PURE__ */ template(`<div class=" Td17 Qd17 Sd17 Rd17 _oa17 _Le17 oi17 ni17 ki17 ji17 _Na17 Pa17 _Pc17 Za17 L40ub4c17 K40ub4c17"><div class=" Sf17 Rf17 Th17 Qh17 _Na17 Pa17 sd17 _ta17 Ul17 ql17 _oa17 Za17 Fb17"><!$><!/><!$><!/>`);
 const DatePickerContext = createContext(null);
 function normalizeDatePickerSize(size) {
 	switch (size) {
@@ -68,532 +86,535 @@ const datePickerRoot = function anonymous(props, overrides) {
 		if (p[1] === "_P") position = true;
 		rules += p[0];
 	}
-	rules += " se151";
+	rules += " se17";
 	if (props.isInForm) {
-		if (!gridColumnStart) rules += " z2mU151";
+		if (!gridColumnStart) rules += " z2mU17";
 	}
 	if (props.isInForm) {
 		if (props.labelPosition === "side") {
-			if (!gridColumnEnd) rules += " yvoofG151";
+			if (!gridColumnEnd) rules += " yvoofG17";
 		}
 	}
-	if (props.isInForm) rules += " DLwlgod151";
-	else if (props.labelPosition === "side") rules += " DPlN5qb151";
-	else if (props.labelPosition === "top") rules += " DM8Mfn151";
-	if (props.labelPosition === "side") rules += " EPlN5qb151";
-	else if (props.labelPosition === "top") rules += " E4w1sLc151";
-	if (props.labelPosition === "side") rules += " CfFpp6c151";
-	else if (props.labelPosition === "top") rules += " C1xyRcb151";
+	if (props.isInForm) rules += " DLwlgod17";
+	else if (props.labelPosition === "side") rules += " DPlN5qb17";
+	else if (props.labelPosition === "top") rules += " DM8Mfn17";
+	if (props.labelPosition === "side") rules += " EPlN5qb17";
+	else if (props.labelPosition === "top") rules += " E4w1sLc17";
+	if (props.labelPosition === "side") rules += " CfFpp6c17";
+	else if (props.labelPosition === "top") rules += " C1xyRcb17";
 	if (props.size === "XL") {
-		rules += " -_6BNtrc-e151";
-		rules += " vx151";
+		rules += " -_6BNtrc-e17";
+		rules += " vx17";
 	} else if (props.size === "L") {
-		rules += " -_6BNtrc-d151";
-		rules += " vx151";
+		rules += " -_6BNtrc-d17";
+		rules += " vx17";
 	} else if (props.size === "S") {
-		rules += " -_6BNtrc-b151";
-		rules += " vx151";
+		rules += " -_6BNtrc-b17";
+		rules += " vx17";
 	} else if (props.size === "XS") {
-		rules += " -_6BNtrc-a151";
-		rules += " vx151";
+		rules += " -_6BNtrc-a17";
+		rules += " vx17";
 	} else {
-		rules += " -_6BNtrc-c151";
-		rules += " vx151";
+		rules += " -_6BNtrc-c17";
+		rules += " vx17";
 	}
-	rules += " ea151";
-	rules += " _Fd151";
-	rules += " _FnuYUweb151";
-	if (props.size === "XL") rules += " -BhX7R-Fz151";
-	else if (props.size === "L") rules += " -BhX7R-Fv151";
-	else if (props.size === "S") rules += " -BhX7R-Fp151";
-	else if (props.size === "XS") rules += " -BhX7R-Fn151";
-	else rules += " -BhX7R-Fx151";
-	rules += " -AJjOLd-UVkF0Db151";
-	rules += " qg151";
-	rules += " __ca151";
-	if (!position) rules += " _Pc151";
+	rules += " ea17";
+	rules += " _Fd17";
+	rules += " _FnuYUweb17";
+	if (props.size === "XL") rules += " -BhX7R-Fz17";
+	else if (props.size === "L") rules += " -BhX7R-Fv17";
+	else if (props.size === "S") rules += " -BhX7R-Fp17";
+	else if (props.size === "XS") rules += " -BhX7R-Fn17";
+	else rules += " -BhX7R-Fx17";
+	rules += " -AJjOLd-UVkF0Db17";
+	rules += " qg17";
+	rules += " __ca17";
+	if (!position) rules += " _Pc17";
 	return rules;
 };
 const datePickerLabelWrapper = function anonymous(props) {
 	let rules = " ";
-	rules += " zv6x9r151";
-	rules += " yv6x9r151";
-	rules += " Bv6x9r151";
-	rules += " Av6x9r151";
-	rules += " sf151";
-	if (props.labelPosition === "top") rules += " QgOnRt151";
-	if (props.labelPosition === "top") rules += " _qb151";
+	rules += " zv6x9r17";
+	rules += " yv6x9r17";
+	rules += " Bv6x9r17";
+	rules += " Av6x9r17";
+	rules += " sf17";
+	if (props.labelPosition === "top") rules += " QgOnRt17";
+	if (props.labelPosition === "top") rules += " _qb17";
 	return rules;
 };
 const datePickerLabel = function anonymous(props) {
 	let rules = " ";
-	rules += " uxe7h4151";
+	rules += " uxe7h417";
 	if (props.size === "XL") {
-		rules += " -_6BNtrc-e151";
-		rules += " vx151";
+		rules += " -_6BNtrc-e17";
+		rules += " vx17";
 	} else if (props.size === "L") {
-		rules += " -_6BNtrc-d151";
-		rules += " vx151";
+		rules += " -_6BNtrc-d17";
+		rules += " vx17";
 	} else if (props.size === "S") {
-		rules += " -_6BNtrc-b151";
-		rules += " vx151";
+		rules += " -_6BNtrc-b17";
+		rules += " vx17";
 	} else if (props.size === "XS") {
-		rules += " -_6BNtrc-a151";
-		rules += " vx151";
+		rules += " -_6BNtrc-a17";
+		rules += " vx17";
 	} else {
-		rules += " -_6BNtrc-c151";
-		rules += " vx151";
+		rules += " -_6BNtrc-c17";
+		rules += " vx17";
 	}
 	if (props.size === "XL") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "L") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "S") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "XS") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	}
 	if (props.size === "XL") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "L") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "S") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "XS") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	}
-	if (props.isStaticColor) rules += " pl151";
-	else if (props.isDisabled) rules += " pUvnvv151";
-	else rules += " pUUi0Fe151";
-	rules += " plb151";
-	rules += " ri151";
+	if (props.isStaticColor) rules += " pl17";
+	else if (props.isDisabled) rules += " p8H6Pad17";
+	else rules += " ptacXCd17";
+	rules += " plb17";
+	rules += " ri17";
 	return rules;
 };
 const datePickerFieldGroup = function anonymous(props) {
 	let rules = " ";
-	if (props.isFocusVisible) rules += " _Lf151";
-	else rules += " _Le151";
-	rules += " O8KaFke151";
-	rules += " Olc151";
-	rules += " _Mc151";
-	rules += " _Kd151";
-	rules += " uxe7h4151";
+	if (props.isFocusVisible) rules += " _Lf17";
+	else rules += " _Le17";
+	rules += " Or2Mazb17";
+	rules += " Olc17";
+	rules += " _Mc17";
+	rules += " _Kd17";
+	rules += " uxe7h417";
 	if (props.size === "XL") {
-		rules += " -_6BNtrc-e151";
-		rules += " vx151";
+		rules += " -_6BNtrc-e17";
+		rules += " vx17";
 	} else if (props.size === "L") {
-		rules += " -_6BNtrc-d151";
-		rules += " vx151";
+		rules += " -_6BNtrc-d17";
+		rules += " vx17";
 	} else if (props.size === "S") {
-		rules += " -_6BNtrc-b151";
-		rules += " vx151";
+		rules += " -_6BNtrc-b17";
+		rules += " vx17";
 	} else if (props.size === "XS") {
-		rules += " -_6BNtrc-a151";
-		rules += " vx151";
+		rules += " -_6BNtrc-a17";
+		rules += " vx17";
 	} else {
-		rules += " -_6BNtrc-c151";
-		rules += " vx151";
+		rules += " -_6BNtrc-c17";
+		rules += " vx17";
 	}
-	rules += " xb151";
-	rules += " _xa151";
+	rules += " xb17";
+	rules += " _xa17";
 	if (props.size === "XL") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "L") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "S") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "XS") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	}
 	if (props.isDisabled) {
-		rules += " pUvnvv151";
-		rules += " plc151";
+		rules += " p8H6Pad17";
+		rules += " plc17";
 	} else {
-		if (props.isPressed) rules += " pMwyHo151";
-		else if (props.isFocusVisible) rules += " pMwyHo151";
-		else if (props.isHovered) rules += " pMwyHo151";
-		else rules += " pHKLAu151";
-		rules += " plb151";
+		if (props.isPressed) rules += " pBJTC6c17";
+		else if (props.isFocusVisible) rules += " pBJTC6c17";
+		else if (props.isHovered) rules += " pBJTC6c17";
+		else rules += " pmiKvLd17";
+		rules += " plb17";
 	}
-	rules += " sd151";
-	rules += " eb151";
-	rules += " _oa151";
-	rules += " SMBFGYc151";
-	rules += " RfBFGYc151";
-	if (props.size === "XL") rules += " Nl151";
-	else if (props.size === "L") rules += " Nj151";
-	else if (props.size === "S") rules += " Nf151";
-	else if (props.size === "XS") rules += " Ne151";
-	else rules += " Nk151";
-	rules += " ob151";
-	rules += " nb151";
-	rules += " kb151";
-	rules += " jb151";
-	rules += " _kb151";
-	rules += " hb151";
-	rules += " mCPFGYc151";
-	rules += " l5OFGYc151";
-	rules += " _jf151";
+	rules += " sd17";
+	rules += " eb17";
+	rules += " _oa17";
+	rules += " SMBFGYc17";
+	rules += " RfBFGYc17";
+	if (props.size === "XL") rules += " Nl17";
+	else if (props.size === "L") rules += " Nj17";
+	else if (props.size === "S") rules += " Nf17";
+	else if (props.size === "XS") rules += " Ne17";
+	else rules += " Nk17";
+	rules += " ob17";
+	rules += " nb17";
+	rules += " kb17";
+	rules += " jb17";
+	rules += " _kb17";
+	rules += " hb17";
+	rules += " mCPFGYc17";
+	rules += " l5OFGYc17";
+	rules += " _jf17";
 	if (props.isDisabled) {
-		rules += " ifbAdGe151";
-		rules += " ilc151";
+		rules += " iSNu3ze17";
+		rules += " ilc17";
 	} else if (props.isFocusWithin) {
-		if (props.isInvalid) rules += " iQxdzb151";
-		else rules += " iMwyHo151";
-		rules += " ild151";
+		if (props.isInvalid) rules += " ilIkJnc17";
+		else rules += " iBJTC6c17";
+		rules += " ild17";
 	} else if (props.isInvalid) {
-		if (props.isPressed) rules += " iQxdzb151";
-		else if (props.isFocusVisible) rules += " iQxdzb151";
-		else if (props.isHovered) rules += " iQxdzb151";
-		else rules += " iYjUhNc151";
-		rules += " ile151";
-	} else rules += " iAv83Hb151";
-	rules += " gHPXipd151";
-	rules += " gl1kG7o151";
-	rules += " _iRvAxPd151";
-	rules += " _ilc151";
-	rules += " __mrmLYsd151";
-	rules += " FRuFGYc151";
-	rules += " zXcEWr151";
-	rules += " yXcEWr151";
-	rules += " BXcEWr151";
-	rules += " AXcEWr151";
-	if (props.isQuiet) rules += " _qd151";
-	else rules += " _qtb151";
-	if (props.size === "XL") rules += " -Anxdcc-Zt151";
-	else if (props.size === "L") rules += " -Anxdcc-ZStdtne151";
-	else if (props.size === "S") rules += " -Anxdcc-Zr151";
-	else rules += " -Anxdcc-Z3fn9H151";
-	rules += " __v6TNLWb151";
-	rules += " Yd151";
-	rules += " Xb151";
-	rules += " _2b151";
-	rules += " __Wb151";
-	if (props.isDisabled) rules += " ri151";
-	else rules += " rD151";
-	if (props.size === "XL") rules += " -F_-Fz151";
-	else if (props.size === "L") rules += " -F_-Fv151";
-	else if (props.size === "S") rules += " -F_-Fp151";
-	else if (props.size === "XS") rules += " -F_-Fn151";
-	else rules += " -F_-Fx151";
-	rules += " -S_-Sv151";
-	if (props.size === "XL") rules += " -R_-R1DOfn151";
-	else if (props.size === "L") rules += " -R_-R1DOfn151";
-	else if (props.size === "M") rules += " -R_-Rp151";
-	else if (props.size === "S") rules += " -R_-Rj151";
-	rules += " -m_-mb151";
-	rules += " -l_-lb151";
+		if (props.isPressed) rules += " ilIkJnc17";
+		else if (props.isFocusVisible) rules += " ilIkJnc17";
+		else if (props.isHovered) rules += " ilIkJnc17";
+		else rules += " iuNtkec17";
+		rules += " ile17";
+	} else rules += " iAv83Hb17";
+	rules += " gHPXipd17";
+	rules += " gl1kG7o17";
+	rules += " _iRvAxPd17";
+	rules += " _ilc17";
+	rules += " __mh0dLcd17";
+	rules += " FRuFGYc17";
+	rules += " zXcEWr17";
+	rules += " yXcEWr17";
+	rules += " BXcEWr17";
+	rules += " AXcEWr17";
+	if (props.isQuiet) rules += " _qd17";
+	else rules += " _qtb17";
+	if (props.size === "XL") rules += " -Anxdcc-Zt17";
+	else if (props.size === "L") rules += " -Anxdcc-ZStdtne17";
+	else if (props.size === "S") rules += " -Anxdcc-Zr17";
+	else rules += " -Anxdcc-Z3fn9H17";
+	rules += " __v6TNLWb17";
+	rules += " Yd17";
+	rules += " Xb17";
+	rules += " _2b17";
+	rules += " __Wb17";
+	if (props.isDisabled) rules += " ri17";
+	else rules += " rD17";
+	if (props.size === "XL") rules += " -F_-Fz17";
+	else if (props.size === "L") rules += " -F_-Fv17";
+	else if (props.size === "S") rules += " -F_-Fp17";
+	else if (props.size === "XS") rules += " -F_-Fn17";
+	else rules += " -F_-Fx17";
+	rules += " -S_-Sv17";
+	if (props.size === "XL") rules += " -R_-R1DOfn17";
+	else if (props.size === "L") rules += " -R_-R1DOfn17";
+	else if (props.size === "M") rules += " -R_-Rp17";
+	else if (props.size === "S") rules += " -R_-Rj17";
+	rules += " -m_-mb17";
+	rules += " -l_-lb17";
 	return rules;
 };
 const dateSegment = function anonymous(props) {
 	let rules = " ";
-	rules += " _Le151";
-	rules += " -zNggOc-RWHrbc151";
-	if (props.isFocused) rules += " g8KaFke151";
-	else rules += " g9151";
-	if (props.isFocused) rules += " gle151";
-	else rules += " gl9151";
-	if (props.isDisabled) rules += " pUvnvv151";
-	else if (props.isFocused) rules += " px151";
-	if (props.isDisabled) rules += " plc151";
-	else if (props.isFocused) rules += " ple151";
-	rules += " oLvNfn151";
-	rules += " nLvNfn151";
-	rules += " kLvNfn151";
-	rules += " jLvNfn151";
-	if (props.isPunctuation) rules += " Sd151";
-	else rules += " Sj151";
-	if (props.isPunctuation) rules += " Rd151";
-	else rules += " Rj151";
-	rules += " Tj151";
-	rules += " Qj151";
-	rules += " _yb151";
+	rules += " _Le17";
+	rules += " -zNggOc-RWHrbc17";
+	if (props.isFocused) rules += " gr2Mazb17";
+	else rules += " g917";
+	if (props.isFocused) rules += " gle17";
+	else rules += " gl917";
+	if (props.isDisabled) rules += " p8H6Pad17";
+	else if (props.isFocused) rules += " px17";
+	if (props.isDisabled) rules += " plc17";
+	else if (props.isFocused) rules += " ple17";
+	rules += " oLvNfn17";
+	rules += " nLvNfn17";
+	rules += " kLvNfn17";
+	rules += " jLvNfn17";
+	if (props.isPunctuation) rules += " Sd17";
+	else rules += " Sj17";
+	if (props.isPunctuation) rules += " Rd17";
+	else rules += " Rj17";
+	rules += " Tj17";
+	rules += " Qj17";
+	rules += " _yb17";
 	return rules;
 };
-const fieldErrorIcon = " ZuUmpre151 FuUmpre151 It151 Isu151 HAxCW0c151 _va151 -_8sjo0b-tQQET4151 -_8sjo0b-ltQBRyrc151";
-const requiredIcon = " -_8sjo0b-t5ZbAob151";
-const calendarIcon = " -_8sjo0b-t5ZbAob151 Za8Mfn151 Fa8Mfn151";
+const fieldErrorIcon = " ZObNfn17 FObNfn17 It17 Isu17 HAxCW0c17 _va17 -_8sjo0b-tlIkJnc17 -_8sjo0b-ltQBRyrc17";
+const requiredIcon = " -_8sjo0b-t5ZbAob17";
+const calendarIcon = " -_8sjo0b-t5ZbAob17 Za8Mfn17 Fa8Mfn17";
 const calendarButton = function anonymous(props) {
 	let rules = " ";
-	if (props.isFocusVisible) rules += " _Lf151";
-	else rules += " _Le151";
-	rules += " O8KaFke151";
-	rules += " Olc151";
-	rules += " _Mc151";
-	rules += " _Kd151";
-	rules += " osmOfn151";
-	rules += " nsmOfn151";
-	rules += " ksmOfn151";
-	rules += " jsmOfn151";
-	rules += " _Pc151";
-	if (props.size === "XL") rules += " uxe7h4151";
-	else if (props.size === "L") rules += " uxe7h4151";
-	else if (props.size === "M") rules += " uxe7h4151";
-	else if (props.size === "S") rules += " uxe7h4151";
+	if (props.isFocusVisible) rules += " _Lf17";
+	else rules += " _Le17";
+	rules += " Or2Mazb17";
+	rules += " Olc17";
+	rules += " _Mc17";
+	rules += " _Kd17";
+	rules += " osmOfn17";
+	rules += " nsmOfn17";
+	rules += " ksmOfn17";
+	rules += " jsmOfn17";
+	rules += " _Pc17";
+	if (props.size === "XL") rules += " uxe7h417";
+	else if (props.size === "L") rules += " uxe7h417";
+	else if (props.size === "M") rules += " uxe7h417";
+	else if (props.size === "S") rules += " uxe7h417";
 	if (props.size === "XL") {
-		rules += " -_6BNtrc-e151";
-		rules += " vx151";
+		rules += " -_6BNtrc-e17";
+		rules += " vx17";
 	} else if (props.size === "L") {
-		rules += " -_6BNtrc-d151";
-		rules += " vx151";
+		rules += " -_6BNtrc-d17";
+		rules += " vx17";
 	} else if (props.size === "M") {
-		rules += " -_6BNtrc-c151";
-		rules += " vx151";
+		rules += " -_6BNtrc-c17";
+		rules += " vx17";
 	} else if (props.size === "S") {
-		rules += " -_6BNtrc-b151";
-		rules += " vx151";
+		rules += " -_6BNtrc-b17";
+		rules += " vx17";
 	}
 	if (props.size === "XL") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "L") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "M") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "S") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	}
 	if (props.size === "XL") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "L") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "M") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "S") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	}
-	if (props.isDisabled) rules += " pUvnvv151";
-	else if (props.isPressed) rules += " pMwyHo151";
-	else if (props.isFocusVisible) rules += " pMwyHo151";
-	else if (props.isHovered) rules += " pMwyHo151";
-	else rules += " pHKLAu151";
-	rules += " pla151";
-	rules += " ri151";
-	rules += " sd151";
-	rules += " _Wa151";
-	rules += " _je151";
-	rules += " eb151";
-	rules += " _Ca151";
-	if (props.size === "XL") rules += " ZC151";
-	else if (props.size === "L") rules += " Zo151";
-	else if (props.size === "M") rules += " Zm151";
-	else if (props.size === "S") rules += " Zu151";
-	rules += " Fd151";
-	rules += " Iw151";
-	rules += " fa151";
-	rules += " _va151";
-	rules += " Yd151";
-	rules += " Yle151";
-	rules += " Xb151";
-	rules += " Xlb151";
-	rules += " _2b151";
-	rules += " _2lb151";
-	if (props.isDisabled) rules += " gkDWoNd151";
-	else if (props.isOpen) rules += " gG1H3ce151";
-	else if (props.isPressed) rules += " gG1H3ce151";
-	else if (props.isFocusVisible) rules += " gG1H3ce151";
-	else if (props.isHovered) rules += " gG1H3ce151";
-	else rules += " gkDWoNd151";
-	if (props.isDisabled) rules += " gld151";
-	else if (props.isOpen) rules += " gle151";
-	else if (props.isHovered) rules += " gle151";
-	else rules += " glc151";
+	if (props.isDisabled) rules += " p8H6Pad17";
+	else if (props.isPressed) rules += " pBJTC6c17";
+	else if (props.isFocusVisible) rules += " pBJTC6c17";
+	else if (props.isHovered) rules += " pBJTC6c17";
+	else rules += " pmiKvLd17";
+	rules += " pla17";
+	rules += " ri17";
+	rules += " sd17";
+	rules += " _Wa17";
+	rules += " _je17";
+	rules += " eb17";
+	rules += " _Ca17";
+	if (props.size === "XL") rules += " ZC17";
+	else if (props.size === "L") rules += " Zo17";
+	else if (props.size === "M") rules += " Zm17";
+	else if (props.size === "S") rules += " Zu17";
+	rules += " Fd17";
+	rules += " Iw17";
+	rules += " fa17";
+	rules += " _va17";
+	rules += " Yd17";
+	rules += " Yle17";
+	rules += " Xb17";
+	rules += " Xlb17";
+	rules += " _2b17";
+	rules += " _2lb17";
+	if (props.isDisabled) rules += " gLX7Xt17";
+	else if (props.isOpen) rules += " g8DRfdc17";
+	else if (props.isPressed) rules += " g8DRfdc17";
+	else if (props.isFocusVisible) rules += " g8DRfdc17";
+	else if (props.isHovered) rules += " g8DRfdc17";
+	else rules += " gLX7Xt17";
+	if (props.isDisabled) rules += " gld17";
+	else if (props.isOpen) rules += " gle17";
+	else if (props.isHovered) rules += " gle17";
+	else rules += " glc17";
 	return rules;
 };
 const helpText = function anonymous(props) {
 	let rules = " ";
-	rules += " zzBWQ8d151";
-	rules += " yzBWQ8d151";
-	rules += " BzBWQ8d151";
-	rules += " AzBWQ8d151";
-	rules += " sd151";
-	rules += " Jy151";
-	rules += " Gy151";
-	rules += " Iy151";
-	rules += " Hy151";
-	rules += " ea151";
-	rules += " Uc151";
-	rules += " Usd151";
-	rules += " qc151";
-	rules += " qsd151";
-	if (props.size === "XL") rules += " uxe7h4151";
-	else if (props.size === "L") rules += " uxe7h4151";
-	else if (props.size === "S") rules += " uxe7h4151";
-	else if (props.size === "XS") rules += " uxe7h4151";
-	else rules += " uxe7h4151";
+	rules += " zzBWQ8d17";
+	rules += " yzBWQ8d17";
+	rules += " BzBWQ8d17";
+	rules += " AzBWQ8d17";
+	rules += " sd17";
+	rules += " Jy17";
+	rules += " Gy17";
+	rules += " Iy17";
+	rules += " Hy17";
+	rules += " ea17";
+	rules += " Uc17";
+	rules += " Usd17";
+	rules += " qc17";
+	rules += " qsd17";
+	if (props.size === "XL") rules += " uxe7h417";
+	else if (props.size === "L") rules += " uxe7h417";
+	else if (props.size === "S") rules += " uxe7h417";
+	else if (props.size === "XS") rules += " uxe7h417";
+	else rules += " uxe7h417";
 	if (props.size === "XL") {
-		rules += " -_6BNtrc-e151";
-		rules += " vx151";
+		rules += " -_6BNtrc-e17";
+		rules += " vx17";
 	} else if (props.size === "L") {
-		rules += " -_6BNtrc-d151";
-		rules += " vx151";
+		rules += " -_6BNtrc-d17";
+		rules += " vx17";
 	} else if (props.size === "S") {
-		rules += " -_6BNtrc-b151";
-		rules += " vx151";
+		rules += " -_6BNtrc-b17";
+		rules += " vx17";
 	} else if (props.size === "XS") {
-		rules += " -_6BNtrc-a151";
-		rules += " vx151";
+		rules += " -_6BNtrc-a17";
+		rules += " vx17";
 	} else {
-		rules += " -_6BNtrc-c151";
-		rules += " vx151";
+		rules += " -_6BNtrc-c17";
+		rules += " vx17";
 	}
 	if (props.size === "XL") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "L") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "S") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else if (props.size === "XS") {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	} else {
-		rules += " xb151";
-		rules += " _xa151";
+		rules += " xb17";
+		rules += " _xa17";
 	}
 	if (props.size === "XL") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "L") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "S") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else if (props.size === "XS") {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	} else {
-		rules += " _Fd151";
-		rules += " _FnuYUweb151";
+		rules += " _Fd17";
+		rules += " _FnuYUweb17";
 	}
 	if (props.isDisabled) {
-		rules += " pUvnvv151";
-		rules += " plc151";
+		rules += " p8H6Pad17";
+		rules += " plc17";
 	} else if (props.isInvalid) {
-		rules += " pYjUhNc151";
-		rules += " plQBRyrc151";
-	} else rules += " pUUi0Fe151";
-	rules += " -_8sjo0b-t5ZbAob151";
-	rules += " _qb151";
-	rules += " TgOnRt151";
-	if (props.isDisabled) rules += " ri151";
-	else rules += " rD151";
+		rules += " plIkJnc17";
+		rules += " plQBRyrc17";
+	} else rules += " pLw1gcc17";
+	rules += " -_8sjo0b-t5ZbAob17";
+	rules += " _qb17";
+	rules += " TgOnRt17";
+	if (props.isDisabled) rules += " ri17";
+	else rules += " rD17";
 	return rules;
 };
 const datePickerPopover = 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 += " -ICUGx-_pb17";
+		rules += " -ICUGx-D1v0V_pa17";
+	}
+	rules += " _pK8eoyd17";
+	if (props.colorScheme === "dark") rules += " -NvXmrd-_ZLmU17";
+	else if (props.colorScheme === "light") rules += " -NvXmrd-_ZN8Gi4c17";
 	else if (props.colorScheme === "light dark") {
-		rules += " -NvXmrd-_ZN8Gi4c151";
-		rules += " -NvXmrd-D1v0V_ZLmU151";
+		rules += " -NvXmrd-_ZN8Gi4c17";
+		rules += " -NvXmrd-D1v0V_ZLmU17";
 	}
-	if (props.colorScheme === "dark") rules += " -j9blY-_ZN8Gi4c151";
-	else if (props.colorScheme === "light") rules += " -j9blY-_ZLmU151";
+	if (props.colorScheme === "dark") rules += " -j9blY-_ZN8Gi4c17";
+	else if (props.colorScheme === "light") rules += " -j9blY-_ZLmU17";
 	else if (props.colorScheme === "light dark") {
-		rules += " -j9blY-_ZLmU151";
-		rules += " -j9blY-D1v0V_ZN8Gi4c151";
+		rules += " -j9blY-_ZLmU17";
+		rules += " -j9blY-D1v0V_ZN8Gi4c17";
 	}
-	rules += " -Ovbhqd-g9ORGnd151";
-	rules += " -Ovbhqd-lga151";
-	rules += " gEzkoQe151";
-	rules += " -Jvcevd-Nbc1hc151";
-	rules += " _nfRoCnb151";
-	rules += " oY4qurc151";
-	rules += " nY4qurc151";
-	rules += " kY4qurc151";
-	rules += " jY4qurc151";
-	rules += " sd151";
-	rules += " ZK151";
-	rules += " LEmL1Zb151";
-	rules += " Td151";
-	rules += " Qd151";
-	rules += " Sd151";
-	rules += " Rd151";
-	rules += " Ma151";
-	rules += " _Ne151";
-	rules += " Pe151";
-	rules += " _oa151";
-	rules += " _Bb151";
-	rules += " _Lf151";
-	rules += " _Mb151";
-	rules += " OLNnmzc151";
-	rules += " Ola151";
-	if (props.isExiting) rules += " _Ia151";
-	else if (props.isEntering) rules += " _Ia151";
+	rules += " -Ovbhqd-g9ORGnd17";
+	rules += " -Ovbhqd-lga17";
+	rules += " gEzkoQe17";
+	rules += " -Jvcevd-Nbc1hc17";
+	rules += " _nPP9Zse17";
+	rules += " oY4qurc17";
+	rules += " nY4qurc17";
+	rules += " kY4qurc17";
+	rules += " jY4qurc17";
+	rules += " sd17";
+	rules += " ZK17";
+	rules += " LEmL1Zb17";
+	rules += " Td17";
+	rules += " Qd17";
+	rules += " Sd17";
+	rules += " Rd17";
+	rules += " Ma17";
+	rules += " _Ne17";
+	rules += " Pe17";
+	rules += " _oa17";
+	rules += " _Bb17";
+	rules += " _Lf17";
+	rules += " _Mb17";
+	rules += " OzZV8ic17";
+	rules += " Ola17";
+	if (props.isExiting) rules += " _Ia17";
+	else if (props.isEntering) rules += " _Ia17";
 	if (props.placement === "bottom") {
 		if (props.isExiting) {
-			rules += " -_8PloMd-l151";
-			rules += " __Ya151";
+			rules += " -_8PloMd-l17";
+			rules += " __Ya17";
 		} else if (props.isEntering) {
-			rules += " -_8PloMd-l151";
-			rules += " __Ya151";
+			rules += " -_8PloMd-l17";
+			rules += " __Ya17";
 		}
 	} else if (props.placement === "top") {
 		if (props.isExiting) {
-			rules += " -_8PloMd-F151";
-			rules += " __Ya151";
+			rules += " -_8PloMd-F17";
+			rules += " __Ya17";
 		} else if (props.isEntering) {
-			rules += " -_8PloMd-F151";
-			rules += " __Ya151";
+			rules += " -_8PloMd-F17";
+			rules += " __Ya17";
 		}
 	}
 	if (props.placement === "right") {
 		if (props.isExiting) {
-			rules += " -_7PloMd-m151";
-			rules += " __Ya151";
+			rules += " -_7PloMd-m17";
+			rules += " __Ya17";
 		} else if (props.isEntering) {
-			rules += " -_7PloMd-m151";
-			rules += " __Ya151";
+			rules += " -_7PloMd-m17";
+			rules += " __Ya17";
 		}
 	} else if (props.placement === "left") {
 		if (props.isExiting) {
-			rules += " -_7PloMd-G151";
-			rules += " __Ya151";
+			rules += " -_7PloMd-G17";
+			rules += " __Ya17";
 		} else if (props.isEntering) {
-			rules += " -_7PloMd-G151";
-			rules += " __Ya151";
+			rules += " -_7PloMd-G17";
+			rules += " __Ya17";
 		}
 	}
-	rules += " YmenWad151";
-	rules += " Xc151";
-	if (props.isExiting) rules += " _2c151";
-	if (props.isExiting) rules += " _Ob151";
+	rules += " YmenWad17";
+	rules += " Xc17";
+	if (props.isExiting) rules += " _2c17";
+	if (props.isExiting) rules += " _Ob17";
 	return rules;
 };
 const datePickerCalendarPopoverStyle = {
@@ -609,17 +630,20 @@ const datePickerCalendarPopoverStyle = {
 * `pickerAria.groupProps`. A context-consuming component (not inline JSX in the
 * DatePicker body) so `useDatePickerContext()` resolves the provider inside
 * `HeadlessDatePicker`. The styled class/style/onClick layer on top.
-*/
-function DatePickerFieldGroup(props) {
+*/ function DatePickerFieldGroup(props) {
 	const datePicker = useDatePickerContext();
 	const { isHovered, hoverProps } = createHover({ get isDisabled() {
 		return props.isDisabled;
 	} });
-	return (() => {
-		var _el$ = getNextElement(_tmpl$);
-		spread(_el$, mergeProps(() => datePicker.pickerAria.groupProps, hoverProps, {
-			"role": "presentation",
-			get ["class"]() {
+	var _el$ = getNextElement(_tmpl$);
+	spread(_el$, [
+		() => {
+			return datePicker.pickerAria.groupProps;
+		},
+		hoverProps,
+		{
+			role: "presentation",
+			get "class"() {
 				return datePickerFieldGroup({
 					size: props.size,
 					isInvalid: props.isInvalid,
@@ -633,17 +657,30 @@ function DatePickerFieldGroup(props) {
 			get onClick() {
 				return props.onClick;
 			},
-			get ["data-hovered"]() {
+			get "data-hovered"() {
 				return isHovered() ? "true" : void 0;
 			}
-		}), false, true);
-		insert(_el$, () => props.children);
-		runHydrationEvents();
-		return _el$;
-	})();
+		}
+	], true);
+	insert(_el$, scope(() => {
+		return props.children;
+	}));
+	runHydrationEvents();
+	return _el$;
 }
 function DatePicker(props) {
-	const [local, calendarProps, rest] = splitProps(mergeProps$1(useProviderProps(props), getSlottedContextProps(useContext(DatePickerContext), props.slot) ?? {}, props), [
+	const providerProps = useProviderProps(props);
+	const [flags] = splitProps(providerProps, [
+		"isQuiet",
+		"isEmphasized",
+		"isDisabled",
+		"isRequired",
+		"isReadOnly",
+		"validationState"
+	]);
+	const contextProps = getSlottedContextProps(useContext(DatePickerContext), props.slot);
+	const merged = mergeProps$2(flags, contextProps ?? {}, props);
+	const [local, calendarProps, rest] = splitProps(merged, [
 		"size",
 		"class",
 		"label",
@@ -699,7 +736,7 @@ function DatePicker(props) {
 		get isInvalid() {
 			return isInvalid();
 		},
-		"class": (renderProps) => [local.class, datePickerRoot({
+		class: (renderProps) => [local.class, datePickerRoot({
 			...renderProps,
 			size: size(),
 			labelPosition: "top",
@@ -712,50 +749,64 @@ function DatePicker(props) {
 						return local.label;
 					},
 					get children() {
-						var _el$2 = getNextElement(_tmpl$4), _el$8 = _el$2.firstChild, [_el$9, _co$2] = getNextMarker(_el$8.nextSibling), _el$0 = _el$9.nextSibling, [_el$1, _co$3] = getNextMarker(_el$0.nextSibling);
+						var _el$2 = getNextElement(_tmpl$4);
+						var _el$8 = _el$2.firstChild;
+						var [_el$9, _el$10] = getNextMarker(_el$8.nextSibling);
+						var _el$12 = _el$9.nextSibling;
+						var [_el$13, _el$14] = getNextMarker(_el$12.nextSibling);
 						insert(_el$2, createComponent(DatePickerLabel, {
-							get ["class"]() {
+							get "class"() {
 								return datePickerLabel({
 									size: size(),
 									isDisabled: isDisabled()
 								});
 							},
 							get children() {
-								return [memo(() => local.label), createComponent(Show, {
+								return [memo(() => {
+									return local.label;
+								}), createComponent(Show, {
 									get when() {
 										return rest.isRequired;
 									},
 									get children() {
-										var _el$3 = getNextElement(_tmpl$2), _el$5 = _el$3.firstChild.nextSibling, [_el$6, _co$] = getNextMarker(_el$5.nextSibling);
+										var _el$3 = getNextElement(_tmpl$2);
+										var _el$5 = _el$3.firstChild.nextSibling;
+										var [_el$6, _el$7] = getNextMarker(_el$5.nextSibling);
 										insert(_el$3, createComponent(Asterisk, {
 											get size() {
-												return memo(() => size() === "S")() ? "M" : size();
+												return memo(() => {
+													return size() === "S";
+												})() ? "M" : size();
 											},
 											styles: requiredIcon,
 											get style() {
 												return requiredIconStyle(size());
 											},
 											"aria-hidden": "true"
-										}), _el$6, _co$);
+										}), _el$6, _el$7);
 										return _el$3;
 									}
 								})];
 							}
-						}), _el$9, _co$2);
+						}), _el$9, _el$10);
 						insert(_el$2, createComponent(Show, {
 							get when() {
 								return local.contextualHelp;
 							},
 							get children() {
-								var _el$7 = getNextElement(_tmpl$3);
-								insert(_el$7, () => local.contextualHelp);
-								return _el$7;
+								var _el$11 = getNextElement(_tmpl$3);
+								insert(_el$11, () => {
+									return local.contextualHelp;
+								});
+								return _el$11;
 							}
-						}), _el$1, _co$3);
-						effect(() => className(_el$2, datePickerLabelWrapper({
+						}), _el$13, _el$14);
+						effect(() => readShallow(datePickerLabelWrapper({
 							size: size(),
 							labelPosition: "top"
-						})));
+						})), (_v$, _$p) => {
+							className(_el$2, _v$, _$p);
+						});
 						return _el$2;
 					}
 				}),
@@ -785,19 +836,19 @@ function DatePicker(props) {
 					get children() {
 						return [
 							(() => {
-								var _el$10 = getNextElement(_tmpl$5);
-								insert(_el$10, createComponent(DateInput, {
-									"class": "",
+								var _el$15 = getNextElement(_tmpl$5);
+								insert(_el$15, createComponent(DateInput, {
+									class: "",
 									children: (segment) => createComponent(DateSegment, {
 										segment,
-										"class": ({ isFocused, isDisabled }) => dateSegment({
+										class: ({ isFocused, isDisabled }) => dateSegment({
 											isFocused,
 											isDisabled,
 											isPunctuation: segment.type === "literal"
 										})
 									})
 								}));
-								return _el$10;
+								return _el$15;
 							})(),
 							createComponent(Show, {
 								get when() {
@@ -811,12 +862,8 @@ function DatePicker(props) {
 							}),
 							createComponent(DatePickerButton, {
 								ref: setButtonEl,
-								"class": ({ isDisabled, isOpen, isHovered, isPressed, isFocusVisible }) => calendarButton({
-									isDisabled,
-									isOpen,
-									isHovered,
-									isPressed,
-									isFocusVisible,
+								class: (renderProps) => calendarButton({
+									...renderProps,
 									size: size()
 								}),
 								get style() {
@@ -849,11 +896,13 @@ function DatePicker(props) {
 				}),
 				createComponent(Show, {
 					get when() {
-						return memo(() => !!local.description)() && !isInvalid();
+						return memo(() => {
+							return !!local.description;
+						})() ? !isInvalid() : local.description;
 					},
 					get children() {
 						return createComponent(DatePickerDescription, {
-							get ["class"]() {
+							get "class"() {
 								return helpText({
 									size: size(),
 									isInvalid: false,
@@ -868,11 +917,13 @@ function DatePicker(props) {
 				}),
 				createComponent(Show, {
 					get when() {
-						return memo(() => !!isInvalid())() && local.errorMessage;
+						return memo(() => {
+							return !!isInvalid();
+						})() ? local.errorMessage : isInvalid();
 					},
 					get children() {
 						return createComponent(DatePickerErrorMessage, {
-							get ["class"]() {
+							get "class"() {
 								return helpText({
 									size: size(),
 									isInvalid: true,
@@ -892,31 +943,41 @@ function DatePicker(props) {
 function DatePickerPopup(props) {
 	const theme = useTheme();
 	const datePicker = useDatePickerContext();
+	const stringFormatter = createStringFormatter(s2IntlStrings, "@react-spectrum/s2");
 	const timeGranularity = () => datePicker.datePickerState.granularity === "day" ? "minute" : datePicker.datePickerState.granularity;
 	return createComponent(DatePickerContent, {
-		"class": (rp) => datePickerPopover({
+		class: (rp) => datePickerPopover({
 			colorScheme: theme.colorScheme,
-			placement: rp.placement ?? void 0,
+			placement: rp.placement ?? "bottom",
 			isEntering: rp.isEntering,
 			isExiting: rp.isExiting
 		}),
 		get children() {
-			var _el$11 = getNextElement(_tmpl$6), _el$12 = _el$11.firstChild, _el$13 = _el$12.firstChild, [_el$14, _co$4] = getNextMarker(_el$13.nextSibling), _el$15 = _el$14.nextSibling, [_el$16, _co$5] = getNextMarker(_el$15.nextSibling);
-			insert(_el$12, createComponent(Calendar$1, mergeProps({
+			var _el$16 = getNextElement(_tmpl$6);
+			var _el$17 = _el$16.firstChild;
+			var _el$18 = _el$17.firstChild;
+			var [_el$19, _el$20] = getNextMarker(_el$18.nextSibling);
+			var _el$21 = _el$19.nextSibling;
+			var [_el$22, _el$23] = getNextMarker(_el$21.nextSibling);
+			insert(_el$17, createComponent(Calendar$1, mergeProps({
 				size: "md",
 				get visibleMonths() {
 					return props.maxVisibleMonths;
 				},
 				UNSAFE_style: datePickerCalendarPopoverStyle
-			}, () => props.calendarProps ?? {})), _el$14, _co$4);
-			insert(_el$12, createComponent(Show, {
+			}, () => {
+				return props.calendarProps ?? {};
+			})), _el$19, _el$20);
+			insert(_el$17, createComponent(Show, {
 				get when() {
 					return props.hasTime;
 				},
 				get children() {
 					return createComponent(TimeField$1, {
 						size: "md",
-						label: "Time",
+						get label() {
+							return stringFormatter().format("datepicker.time");
+						},
 						get value() {
 							return datePicker.datePickerState.timeValue() ?? void 0;
 						},
@@ -934,8 +995,8 @@ function DatePickerPopup(props) {
 						}
 					});
 				}
-			}), _el$16, _co$5);
-			return _el$11;
+			}), _el$22, _el$23);
+			return _el$16;
 		}
 	});
 }