@react-stately/datepicker 3.8.0 → 3.9.1

package/dist/main.js

@@ -1,13 +1,53 @@
+var $a16eae39a66f3afd$exports = require("./ar-AE.main.js");
+var $be973442240b2918$exports = require("./bg-BG.main.js");
+var $a1709037331f64d7$exports = require("./cs-CZ.main.js");
+var $1896523498fa2f44$exports = require("./da-DK.main.js");
+var $169837a5a815615d$exports = require("./de-DE.main.js");
+var $cfb55132d6925036$exports = require("./el-GR.main.js");
+var $384a6c8de1da1e62$exports = require("./en-US.main.js");
+var $be8241903709dc6e$exports = require("./es-ES.main.js");
+var $63e1eb192205ecbf$exports = require("./et-EE.main.js");
+var $41dc33071b9981dc$exports = require("./fi-FI.main.js");
+var $c75ba81d7768253e$exports = require("./fr-FR.main.js");
+var $f678f4bf27dcdd12$exports = require("./he-IL.main.js");
+var $d23f6e75dc589b55$exports = require("./hr-HR.main.js");
+var $439e34e0a9a3f4c1$exports = require("./hu-HU.main.js");
+var $449973ba87982f00$exports = require("./it-IT.main.js");
+var $902560907618d6e6$exports = require("./ja-JP.main.js");
+var $8c0f39c970bc2860$exports = require("./ko-KR.main.js");
+var $db03bc54746c5caa$exports = require("./lt-LT.main.js");
+var $3f356a0921f4d37a$exports = require("./lv-LV.main.js");
+var $1265d19da9735bfb$exports = require("./nb-NO.main.js");
+var $7b57f991f3f6edd1$exports = require("./nl-NL.main.js");
+var $04fe5f1360210d7c$exports = require("./pl-PL.main.js");
+var $e64ffd0cafbe4c46$exports = require("./pt-BR.main.js");
+var $f7b4a5fc25c8f238$exports = require("./pt-PT.main.js");
+var $cf72ee454c27a2e7$exports = require("./ro-RO.main.js");
+var $a41511fa599c2cbe$exports = require("./ru-RU.main.js");
+var $2fedc389afac088d$exports = require("./sk-SK.main.js");
+var $b0aebb8d8c040cc9$exports = require("./sl-SI.main.js");
+var $67017d9b82b5d17e$exports = require("./sr-SP.main.js");
+var $833e86f5dac82c23$exports = require("./sv-SE.main.js");
+var $5b72687d362158b0$exports = require("./tr-TR.main.js");
+var $5d2b1be67024bd70$exports = require("./uk-UA.main.js");
+var $644f5cd034787834$exports = require("./zh-CN.main.js");
+var $11c20589c8b82ee8$exports = require("./zh-TW.main.js");
 var $h2qOe$internationalizeddate = require("@internationalized/date");
+var $h2qOe$reactstatelyform = require("@react-stately/form");
 var $h2qOe$reactstatelyoverlays = require("@react-stately/overlays");
 var $h2qOe$reactstatelyutils = require("@react-stately/utils");
 var $h2qOe$react = require("react");
 var $h2qOe$internationalizedstring = require("@internationalized/string");
 
+
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
 
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+
 $parcel$export(module.exports, "useDatePickerState", () => $aaab7a647e17e1fd$export$87194bb378cc3ac2);
 $parcel$export(module.exports, "useDateFieldState", () => $596a1f0f523d6752$export$60e84778edff6d26);
 $parcel$export(module.exports, "useDateRangePickerState", () => $7072d26f58deb33b$export$e50a61c1de9f574);
@@ -44,9 +84,144 @@ $parcel$export(module.exports, "useTimeFieldState", () => $2654e87be0231a69$expo
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */ 
+var $5294278fb5cc815e$exports = {};
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
-function $50d5d6a623389320$export$eac50920cf2fd59a(value, minValue, maxValue) {
-    return value != null && (minValue != null && value.compare(minValue) < 0 || maxValue != null && value.compare(maxValue) > 0);
+
+
+
+
+
+
+
+
+$5294278fb5cc815e$exports = {
+    "ar-AE": $a16eae39a66f3afd$exports,
+    "bg-BG": $be973442240b2918$exports,
+    "cs-CZ": $a1709037331f64d7$exports,
+    "da-DK": $1896523498fa2f44$exports,
+    "de-DE": $169837a5a815615d$exports,
+    "el-GR": $cfb55132d6925036$exports,
+    "en-US": $384a6c8de1da1e62$exports,
+    "es-ES": $be8241903709dc6e$exports,
+    "et-EE": $63e1eb192205ecbf$exports,
+    "fi-FI": $41dc33071b9981dc$exports,
+    "fr-FR": $c75ba81d7768253e$exports,
+    "he-IL": $f678f4bf27dcdd12$exports,
+    "hr-HR": $d23f6e75dc589b55$exports,
+    "hu-HU": $439e34e0a9a3f4c1$exports,
+    "it-IT": $449973ba87982f00$exports,
+    "ja-JP": $902560907618d6e6$exports,
+    "ko-KR": $8c0f39c970bc2860$exports,
+    "lt-LT": $db03bc54746c5caa$exports,
+    "lv-LV": $3f356a0921f4d37a$exports,
+    "nb-NO": $1265d19da9735bfb$exports,
+    "nl-NL": $7b57f991f3f6edd1$exports,
+    "pl-PL": $04fe5f1360210d7c$exports,
+    "pt-BR": $e64ffd0cafbe4c46$exports,
+    "pt-PT": $f7b4a5fc25c8f238$exports,
+    "ro-RO": $cf72ee454c27a2e7$exports,
+    "ru-RU": $a41511fa599c2cbe$exports,
+    "sk-SK": $2fedc389afac088d$exports,
+    "sl-SI": $b0aebb8d8c040cc9$exports,
+    "sr-SP": $67017d9b82b5d17e$exports,
+    "sv-SE": $833e86f5dac82c23$exports,
+    "tr-TR": $5b72687d362158b0$exports,
+    "uk-UA": $5d2b1be67024bd70$exports,
+    "zh-CN": $644f5cd034787834$exports,
+    "zh-TW": $11c20589c8b82ee8$exports
+};
+
+
+
+
+
+const $50d5d6a623389320$var$dictionary = new (0, $h2qOe$internationalizedstring.LocalizedStringDictionary)((0, (/*@__PURE__*/$parcel$interopDefault($5294278fb5cc815e$exports))));
+function $50d5d6a623389320$var$getLocale() {
+    // Match browser language setting here, NOT react-aria's I18nProvider, so that we match other browser-provided
+    // validation messages, which to not respect our provider's language.
+    // @ts-ignore
+    return typeof navigator !== "undefined" && (navigator.language || navigator.userLanguage) || "en-US";
+}
+function $50d5d6a623389320$export$f18627323ab57ac0(value, minValue, maxValue, isDateUnavailable, options) {
+    let rangeOverflow = value != null && maxValue != null && value.compare(maxValue) > 0;
+    let rangeUnderflow = value != null && minValue != null && value.compare(minValue) < 0;
+    let isUnavailable = value != null && (isDateUnavailable === null || isDateUnavailable === void 0 ? void 0 : isDateUnavailable(value)) || false;
+    let isInvalid = rangeOverflow || rangeUnderflow || isUnavailable;
+    let errors = [];
+    if (isInvalid) {
+        let locale = $50d5d6a623389320$var$getLocale();
+        let strings = (0, $h2qOe$internationalizedstring.LocalizedStringDictionary).getGlobalDictionaryForPackage("@react-stately/datepicker") || $50d5d6a623389320$var$dictionary;
+        let formatter = new (0, $h2qOe$internationalizedstring.LocalizedStringFormatter)(locale, strings);
+        let dateFormatter = new (0, $h2qOe$internationalizeddate.DateFormatter)(locale, $50d5d6a623389320$export$7e319ea407e63bc0({}, options));
+        let timeZone = dateFormatter.resolvedOptions().timeZone;
+        if (rangeUnderflow) errors.push(formatter.format("rangeUnderflow", {
+            minValue: dateFormatter.format(minValue.toDate(timeZone))
+        }));
+        if (rangeOverflow) errors.push(formatter.format("rangeOverflow", {
+            maxValue: dateFormatter.format(maxValue.toDate(timeZone))
+        }));
+        if (isUnavailable) errors.push(formatter.format("unavailableDate"));
+    }
+    return {
+        isInvalid: isInvalid,
+        validationErrors: errors,
+        validationDetails: {
+            badInput: isUnavailable,
+            customError: false,
+            patternMismatch: false,
+            rangeOverflow: rangeOverflow,
+            rangeUnderflow: rangeUnderflow,
+            stepMismatch: false,
+            tooLong: false,
+            tooShort: false,
+            typeMismatch: false,
+            valueMissing: false,
+            valid: !isInvalid
+        }
+    };
+}
+function $50d5d6a623389320$export$80ff8fc0ae339c13(value, minValue, maxValue, isDateUnavailable, options) {
+    let startValidation = $50d5d6a623389320$export$f18627323ab57ac0(value === null || value === void 0 ? void 0 : value.start, minValue, maxValue, isDateUnavailable, options);
+    let endValidation = $50d5d6a623389320$export$f18627323ab57ac0(value === null || value === void 0 ? void 0 : value.end, minValue, maxValue, isDateUnavailable, options);
+    let result = (0, $h2qOe$reactstatelyform.mergeValidation)(startValidation, endValidation);
+    if (value.end != null && value.start != null && value.end.compare(value.start) < 0) result = (0, $h2qOe$reactstatelyform.mergeValidation)(result, {
+        isInvalid: true,
+        validationErrors: [
+            $50d5d6a623389320$var$dictionary.getStringForLocale("rangeReversed", $50d5d6a623389320$var$getLocale())
+        ],
+        validationDetails: {
+            ...(0, $h2qOe$reactstatelyform.VALID_VALIDITY_STATE),
+            rangeUnderflow: true,
+            rangeOverflow: true,
+            valid: false
+        }
+    });
+    return result;
 }
 const $50d5d6a623389320$var$DEFAULT_FIELD_OPTIONS = {
     year: "numeric",
@@ -137,8 +312,8 @@ function $50d5d6a623389320$export$2440da353cedad43(v, granularity) {
 
 
 
+
 function $aaab7a647e17e1fd$export$87194bb378cc3ac2(props) {
-    var _props_isDateUnavailable;
     let overlayState = (0, $h2qOe$reactstatelyoverlays.useOverlayTriggerState)(props);
     let [value, setValue] = (0, $h2qOe$reactstatelyutils.useControlledState)(props.value, props.defaultValue || null, props.onChange);
     let v = value || props.placeholderValue;
@@ -155,10 +330,42 @@ function $aaab7a647e17e1fd$export$87194bb378cc3ac2(props) {
     }
     // props.granularity must actually exist in the value if one is provided.
     if (v && !(granularity in v)) throw new Error("Invalid granularity " + granularity + " for value " + v.toString());
+    let showEra = (value === null || value === void 0 ? void 0 : value.calendar.identifier) === "gregory" && value.era === "BC";
+    let formatOpts = (0, $h2qOe$react.useMemo)(()=>({
+            granularity: granularity,
+            timeZone: defaultTimeZone,
+            hideTimeZone: props.hideTimeZone,
+            hourCycle: props.hourCycle,
+            shouldForceLeadingZeros: props.shouldForceLeadingZeros,
+            showEra: showEra
+        }), [
+        granularity,
+        props.hourCycle,
+        props.shouldForceLeadingZeros,
+        defaultTimeZone,
+        props.hideTimeZone,
+        showEra
+    ]);
+    let { minValue: minValue, maxValue: maxValue, isDateUnavailable: isDateUnavailable } = props;
+    let builtinValidation = (0, $h2qOe$react.useMemo)(()=>(0, $50d5d6a623389320$export$f18627323ab57ac0)(value, minValue, maxValue, isDateUnavailable, formatOpts), [
+        value,
+        minValue,
+        maxValue,
+        isDateUnavailable,
+        formatOpts
+    ]);
+    let validation = (0, $h2qOe$reactstatelyform.useFormValidationState)({
+        ...props,
+        value: value,
+        builtinValidation: builtinValidation
+    });
+    let isValueInvalid = validation.displayValidation.isInvalid;
+    let validationState = props.validationState || (isValueInvalid ? "invalid" : null);
     let commitValue = (date, time)=>{
         setValue("timeZone" in time ? time.set((0, $h2qOe$internationalizeddate.toCalendarDate)(date)) : (0, $h2qOe$internationalizeddate.toCalendarDateTime)(date, time));
         setSelectedDate(null);
         setSelectedTime(null);
+        validation.commitValidation();
     };
     // Intercept setValue to make sure the Time section is not changed by date selection in Calendar
     let selectDate = (newValue)=>{
@@ -166,16 +373,18 @@ function $aaab7a647e17e1fd$export$87194bb378cc3ac2(props) {
         if (hasTime) {
             if (selectedTime || shouldClose) commitValue(newValue, selectedTime || (0, $50d5d6a623389320$export$c5221a78ef73c5e9)(props.placeholderValue));
             else setSelectedDate(newValue);
-        } else setValue(newValue);
+        } else {
+            setValue(newValue);
+            validation.commitValidation();
+        }
         if (shouldClose) overlayState.setOpen(false);
     };
     let selectTime = (newValue)=>{
         if (selectedDate && newValue) commitValue(selectedDate, newValue);
         else setSelectedTime(newValue);
     };
-    let isValueInvalid = props.isInvalid || props.validationState === "invalid" || (0, $50d5d6a623389320$export$eac50920cf2fd59a)(value, props.minValue, props.maxValue) || value && ((_props_isDateUnavailable = props.isDateUnavailable) === null || _props_isDateUnavailable === void 0 ? void 0 : _props_isDateUnavailable.call(props, value));
-    let validationState = props.validationState || (isValueInvalid ? "invalid" : null);
     return {
+        ...validation,
         value: value,
         setValue: setValue,
         dateValue: selectedDate,
@@ -196,13 +405,7 @@ function $aaab7a647e17e1fd$export$87194bb378cc3ac2(props) {
         isInvalid: isValueInvalid,
         formatValue (locale, fieldOptions) {
             if (!dateValue) return "";
-            let formatOptions = (0, $50d5d6a623389320$export$7e319ea407e63bc0)(fieldOptions, {
-                granularity: granularity,
-                timeZone: defaultTimeZone,
-                hideTimeZone: props.hideTimeZone,
-                hourCycle: props.hourCycle,
-                showEra: value.calendar.identifier === "gregory" && value.era === "BC"
-            });
+            let formatOptions = (0, $50d5d6a623389320$export$7e319ea407e63bc0)(fieldOptions, formatOpts);
             let formatter = new (0, $h2qOe$internationalizeddate.DateFormatter)(locale, formatOptions);
             return formatter.format(dateValue);
         }
@@ -222,6 +425,7 @@ function $aaab7a647e17e1fd$export$87194bb378cc3ac2(props) {
  * governing permissions and limitations under the License.
  */ 
 
+
 /*
  * Copyright 2020 Adobe. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -248,9 +452,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "dd"
     },
     am: {
-        year: "ዓዓዓዓ",
-        month: "ሚሜ",
-        day: "ቀቀ"
+        year: "\u12D3\u12D3\u12D3\u12D3",
+        month: "\u121A\u121C",
+        day: "\u1240\u1240"
     },
     an: {
         year: "aaaa",
@@ -258,9 +462,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "dd"
     },
     ar: {
-        year: "سنة",
-        month: "شهر",
-        day: "يوم"
+        year: "\u0633\u0646\u0629",
+        month: "\u0634\u0647\u0631",
+        day: "\u064A\u0648\u0645"
     },
     ast: {
         year: "aaaa",
@@ -273,18 +477,18 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "gg"
     },
     be: {
-        year: "гггг",
-        month: "мм",
-        day: "дд"
+        year: "\u0433\u0433\u0433\u0433",
+        month: "\u043C\u043C",
+        day: "\u0434\u0434"
     },
     bg: {
-        year: "гггг",
-        month: "мм",
-        day: "дд"
+        year: "\u0433\u0433\u0433\u0433",
+        month: "\u043C\u043C",
+        day: "\u0434\u0434"
     },
     bn: {
         year: "yyyy",
-        month: "মিমি",
+        month: "\u09AE\u09BF\u09AE\u09BF",
         day: "dd"
     },
     br: {
@@ -308,9 +512,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "q'q'"
     },
     ckb: {
-        year: "ساڵ",
-        month: "مانگ",
-        day: "ڕۆژ"
+        year: "\u0633\u0627\u06B5",
+        month: "\u0645\u0627\u0646\u06AF",
+        day: "\u0695\u06C6\u0698"
     },
     cs: {
         year: "rrrr",
@@ -335,12 +539,12 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
     dsb: {
         year: "llll",
         month: "mm",
-        day: "źź"
+        day: "\u017A\u017A"
     },
     el: {
-        year: "εεεε",
-        month: "μμ",
-        day: "ηη"
+        year: "\u03B5\u03B5\u03B5\u03B5",
+        month: "\u03BC\u03BC",
+        day: "\u03B7\u03B7"
     },
     en: {
         year: "yyyy",
@@ -368,9 +572,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "ee"
     },
     fa: {
-        year: "سال",
-        month: "ماه",
-        day: "روز"
+        year: "\u0633\u0627\u0644",
+        month: "\u0645\u0627\u0647",
+        day: "\u0631\u0648\u0632"
     },
     ff: {
         year: "hhhh",
@@ -408,9 +612,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "dd"
     },
     he: {
-        year: "שנה",
-        month: "חודש",
-        day: "יום"
+        year: "\u05E9\u05E0\u05D4",
+        month: "\u05D7\u05D5\u05D3\u05E9",
+        day: "\u05D9\u05D5\u05DD"
     },
     hr: {
         year: "gggg",
@@ -443,29 +647,29 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "gg"
     },
     ja: {
-        year: " 年 ",
-        month: "月",
-        day: "日"
+        year: " \u5E74 ",
+        month: "\u6708",
+        day: "\u65E5"
     },
     ka: {
-        year: "წწწწ",
-        month: "თთ",
-        day: "რრ"
+        year: "\u10EC\u10EC\u10EC\u10EC",
+        month: "\u10D7\u10D7",
+        day: "\u10E0\u10E0"
     },
     kk: {
-        year: "жжжж",
-        month: "аа",
-        day: "кк"
+        year: "\u0436\u0436\u0436\u0436",
+        month: "\u0430\u0430",
+        day: "\u043A\u043A"
     },
     kn: {
-        year: "ವವವವ",
-        month: "ಮಿಮೀ",
-        day: "ದಿದಿ"
+        year: "\u0CB5\u0CB5\u0CB5\u0CB5",
+        month: "\u0CAE\u0CBF\u0CAE\u0CC0",
+        day: "\u0CA6\u0CBF\u0CA6\u0CBF"
     },
     ko: {
-        year: "연도",
-        month: "월",
-        day: "일"
+        year: "\uC5F0\uB3C4",
+        month: "\uC6D4",
+        day: "\uC77C"
     },
     lb: {
         year: "jjjj",
@@ -473,9 +677,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "dd"
     },
     lo: {
-        year: "ປປປປ",
-        month: "ດດ",
-        day: "ວວ"
+        year: "\u0E9B\u0E9B\u0E9B\u0E9B",
+        month: "\u0E94\u0E94",
+        day: "\u0EA7\u0EA7"
     },
     lt: {
         year: "mmmm",
@@ -493,9 +697,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "dd"
     },
     ml: {
-        year: "വർഷം",
-        month: "മാസം",
-        day: "തീയതി"
+        year: "\u0D35\u0D7C\u0D37\u0D02",
+        month: "\u0D2E\u0D3E\u0D38\u0D02",
+        day: "\u0D24\u0D40\u0D2F\u0D24\u0D3F"
     },
     ms: {
         year: "tttt",
@@ -543,9 +747,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "zz"
     },
     ru: {
-        year: "гггг",
-        month: "мм",
-        day: "дд"
+        year: "\u0433\u0433\u0433\u0433",
+        month: "\u043C\u043C",
+        day: "\u0434\u0434"
     },
     sc: {
         year: "aaaa",
@@ -568,9 +772,9 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "dd"
     },
     sr: {
-        year: "гггг",
-        month: "мм",
-        day: "дд"
+        year: "\u0433\u0433\u0433\u0433",
+        month: "\u043C\u043C",
+        day: "\u0434\u0434"
     },
     sv: {
         year: "\xe5\xe5\xe5\xe5",
@@ -583,14 +787,14 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "dd"
     },
     tg: {
-        year: "сссс",
-        month: "мм",
-        day: "рр"
+        year: "\u0441\u0441\u0441\u0441",
+        month: "\u043C\u043C",
+        day: "\u0440\u0440"
     },
     th: {
-        year: "ปปปป",
-        month: "ดด",
-        day: "วว"
+        year: "\u0E1B\u0E1B\u0E1B\u0E1B",
+        month: "\u0E14\u0E14",
+        day: "\u0E27\u0E27"
     },
     tr: {
         year: "yyyy",
@@ -598,19 +802,19 @@ const $e1e8ada727fae1a1$var$placeholders = new (0, $h2qOe$internationalizedstrin
         day: "gg"
     },
     uk: {
-        year: "рррр",
-        month: "мм",
-        day: "дд"
+        year: "\u0440\u0440\u0440\u0440",
+        month: "\u043C\u043C",
+        day: "\u0434\u0434"
     },
     "zh-CN": {
-        year: "年",
-        month: "月",
-        day: "日"
+        year: "\u5E74",
+        month: "\u6708",
+        day: "\u65E5"
     },
     "zh-TW": {
-        year: "年",
-        month: "月",
-        day: "日"
+        year: "\u5E74",
+        month: "\u6708",
+        day: "\u65E5"
     }
 }, "en");
 function $e1e8ada727fae1a1$export$d3f5c5e0a5023fa0(field, value, locale) {
@@ -618,7 +822,7 @@ function $e1e8ada727fae1a1$export$d3f5c5e0a5023fa0(field, value, locale) {
     if (field === "era" || field === "dayPeriod") return value;
     if (field === "year" || field === "month" || field === "day") return $e1e8ada727fae1a1$var$placeholders.getStringForLocale(field, locale);
     // For time fields (e.g. hour, minute, etc.), use two dashes as the placeholder.
-    return "––";
+    return "\u2013\u2013";
 }
 
 
@@ -647,7 +851,7 @@ const $596a1f0f523d6752$var$TYPE_MAPPING = {
     dayperiod: "dayPeriod"
 };
 function $596a1f0f523d6752$export$60e84778edff6d26(props) {
-    let { locale: locale, createCalendar: createCalendar, hideTimeZone: hideTimeZone, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired } = props;
+    let { locale: locale, createCalendar: createCalendar, hideTimeZone: hideTimeZone, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, minValue: minValue, maxValue: maxValue, isDateUnavailable: isDateUnavailable } = props;
     let v = props.value || props.defaultValue || props.placeholderValue;
     let [granularity, defaultTimeZone] = (0, $50d5d6a623389320$export$2440da353cedad43)(v, props.granularity);
     let timeZone = defaultTimeZone || "UTC";
@@ -672,8 +876,9 @@ function $596a1f0f523d6752$export$60e84778edff6d26(props) {
     let [placeholderDate, setPlaceholderDate] = (0, $h2qOe$react.useState)(()=>(0, $50d5d6a623389320$export$66aa2b09de4b1ea5)(props.placeholderValue, granularity, calendar, defaultTimeZone));
     let val = calendarValue || placeholderDate;
     let showEra = calendar.identifier === "gregory" && val.era === "BC";
-    var _props_maxGranularity;
-    let formatOpts = (0, $h2qOe$react.useMemo)(()=>({
+    let formatOpts = (0, $h2qOe$react.useMemo)(()=>{
+        var _props_maxGranularity;
+        return {
             granularity: granularity,
             maxGranularity: (_props_maxGranularity = props.maxGranularity) !== null && _props_maxGranularity !== void 0 ? _props_maxGranularity : "year",
             timeZone: defaultTimeZone,
@@ -681,7 +886,8 @@ function $596a1f0f523d6752$export$60e84778edff6d26(props) {
             hourCycle: props.hourCycle,
             showEra: showEra,
             shouldForceLeadingZeros: props.shouldForceLeadingZeros
-        }), [
+        };
+    }, [
         props.maxGranularity,
         granularity,
         props.hourCycle,
@@ -809,10 +1015,23 @@ function $596a1f0f523d6752$export$60e84778edff6d26(props) {
             if (validKeys.length >= allKeys.length || validKeys.length === allKeys.length - 1 && allSegments.dayPeriod && !validSegments.dayPeriod) setValue(displayValue);
         } else setValue($596a1f0f523d6752$var$addSegment(displayValue, type, amount, resolvedOptions));
     };
-    let isValueInvalid = props.isInvalid || props.validationState === "invalid" || (0, $50d5d6a623389320$export$eac50920cf2fd59a)(calendarValue, props.minValue, props.maxValue);
+    let builtinValidation = (0, $h2qOe$react.useMemo)(()=>(0, $50d5d6a623389320$export$f18627323ab57ac0)(value, minValue, maxValue, isDateUnavailable, formatOpts), [
+        value,
+        minValue,
+        maxValue,
+        isDateUnavailable,
+        formatOpts
+    ]);
+    let validation = (0, $h2qOe$reactstatelyform.useFormValidationState)({
+        ...props,
+        value: value,
+        builtinValidation: builtinValidation
+    });
+    let isValueInvalid = validation.displayValidation.isInvalid;
     let validationState = props.validationState || (isValueInvalid ? "invalid" : null);
-    var _props_maxGranularity1;
+    var _props_maxGranularity;
     return {
+        ...validation,
         value: calendarValue,
         dateValue: dateValue,
         calendar: calendar,
@@ -822,7 +1041,7 @@ function $596a1f0f523d6752$export$60e84778edff6d26(props) {
         validationState: validationState,
         isInvalid: isValueInvalid,
         granularity: granularity,
-        maxGranularity: (_props_maxGranularity1 = props.maxGranularity) !== null && _props_maxGranularity1 !== void 0 ? _props_maxGranularity1 : "year",
+        maxGranularity: (_props_maxGranularity = props.maxGranularity) !== null && _props_maxGranularity !== void 0 ? _props_maxGranularity : "year",
         isDisabled: isDisabled,
         isReadOnly: isReadOnly,
         isRequired: isRequired,
@@ -1035,8 +1254,9 @@ function $596a1f0f523d6752$var$setSegment(value, part, segmentValue, options) {
 
 
 
+
 function $7072d26f58deb33b$export$e50a61c1de9f574(props) {
-    var _props_isDateUnavailable, _props_isDateUnavailable1;
+    var _value_start, _value_end;
     let overlayState = (0, $h2qOe$reactstatelyoverlays.useOverlayTriggerState)(props);
     let [controlledValue, setControlledValue] = (0, $h2qOe$reactstatelyutils.useControlledState)(props.value, props.defaultValue || null, props.onChange);
     let [placeholderValue, setPlaceholderValue] = (0, $h2qOe$react.useState)(()=>controlledValue || {
@@ -1061,7 +1281,7 @@ function $7072d26f58deb33b$export$e50a61c1de9f574(props) {
         else setControlledValue(null);
     };
     let v = (value === null || value === void 0 ? void 0 : value.start) || (value === null || value === void 0 ? void 0 : value.end) || props.placeholderValue;
-    let [granularity] = (0, $50d5d6a623389320$export$2440da353cedad43)(v, props.granularity);
+    let [granularity, defaultTimeZone] = (0, $50d5d6a623389320$export$2440da353cedad43)(v, props.granularity);
     let hasTime = granularity === "hour" || granularity === "minute" || granularity === "second";
     var _props_shouldCloseOnSelect;
     let shouldCloseOnSelect = (_props_shouldCloseOnSelect = props.shouldCloseOnSelect) !== null && _props_shouldCloseOnSelect !== void 0 ? _props_shouldCloseOnSelect : true;
@@ -1078,6 +1298,7 @@ function $7072d26f58deb33b$export$e50a61c1de9f574(props) {
         });
         setSelectedDateRange(null);
         setSelectedTimeRange(null);
+        validation.commitValidation();
     };
     // Intercept setValue to make sure the Time section is not changed by date selection in Calendar
     let setDateRange = (range)=>{
@@ -1088,17 +1309,56 @@ function $7072d26f58deb33b$export$e50a61c1de9f574(props) {
                 end: (timeRange === null || timeRange === void 0 ? void 0 : timeRange.end) || (0, $50d5d6a623389320$export$c5221a78ef73c5e9)(props.placeholderValue)
             });
             else setSelectedDateRange(range);
-        } else if (range.start && range.end) setValue(range);
-        else setSelectedDateRange(range);
+        } else if (range.start && range.end) {
+            setValue(range);
+            validation.commitValidation();
+        } else setSelectedDateRange(range);
         if (shouldClose) overlayState.setOpen(false);
     };
     let setTimeRange = (range)=>{
         if ((dateRange === null || dateRange === void 0 ? void 0 : dateRange.start) && (dateRange === null || dateRange === void 0 ? void 0 : dateRange.end) && range.start && range.end) commitValue(dateRange, range);
         else setSelectedTimeRange(range);
     };
-    let isValueInvalid = props.isInvalid || props.validationState === "invalid" || value != null && ((0, $50d5d6a623389320$export$eac50920cf2fd59a)(value.start, props.minValue, props.maxValue) || (0, $50d5d6a623389320$export$eac50920cf2fd59a)(value.end, props.minValue, props.maxValue) || value.end != null && value.start != null && value.end.compare(value.start) < 0 || (value === null || value === void 0 ? void 0 : value.start) && ((_props_isDateUnavailable = props.isDateUnavailable) === null || _props_isDateUnavailable === void 0 ? void 0 : _props_isDateUnavailable.call(props, value.start)) || (value === null || value === void 0 ? void 0 : value.end) && ((_props_isDateUnavailable1 = props.isDateUnavailable) === null || _props_isDateUnavailable1 === void 0 ? void 0 : _props_isDateUnavailable1.call(props, value.end)));
+    let showEra = (value === null || value === void 0 ? void 0 : (_value_start = value.start) === null || _value_start === void 0 ? void 0 : _value_start.calendar.identifier) === "gregory" && value.start.era === "BC" || (value === null || value === void 0 ? void 0 : (_value_end = value.end) === null || _value_end === void 0 ? void 0 : _value_end.calendar.identifier) === "gregory" && value.end.era === "BC";
+    let formatOpts = (0, $h2qOe$react.useMemo)(()=>({
+            granularity: granularity,
+            timeZone: defaultTimeZone,
+            hideTimeZone: props.hideTimeZone,
+            hourCycle: props.hourCycle,
+            shouldForceLeadingZeros: props.shouldForceLeadingZeros,
+            showEra: showEra
+        }), [
+        granularity,
+        props.hourCycle,
+        props.shouldForceLeadingZeros,
+        defaultTimeZone,
+        props.hideTimeZone,
+        showEra
+    ]);
+    let { minValue: minValue, maxValue: maxValue, isDateUnavailable: isDateUnavailable } = props;
+    let builtinValidation = (0, $h2qOe$react.useMemo)(()=>(0, $50d5d6a623389320$export$80ff8fc0ae339c13)(value, minValue, maxValue, isDateUnavailable, formatOpts), [
+        value,
+        minValue,
+        maxValue,
+        isDateUnavailable,
+        formatOpts
+    ]);
+    let validation = (0, $h2qOe$reactstatelyform.useFormValidationState)({
+        ...props,
+        value: controlledValue,
+        name: (0, $h2qOe$react.useMemo)(()=>[
+                props.startName,
+                props.endName
+            ], [
+            props.startName,
+            props.endName
+        ]),
+        builtinValidation: builtinValidation
+    });
+    let isValueInvalid = validation.displayValidation.isInvalid;
     let validationState = props.validationState || (isValueInvalid ? "invalid" : null);
     return {
+        ...validation,
         value: value,
         setValue: setValue,
         dateRange: dateRange,
@@ -1217,7 +1477,7 @@ function $7072d26f58deb33b$export$e50a61c1de9f574(props) {
 
 
 function $2654e87be0231a69$export$fd53cef0cc796101(props) {
-    let { placeholderValue: placeholderValue = new (0, $h2qOe$internationalizeddate.Time)(), minValue: minValue, maxValue: maxValue, granularity: granularity } = props;
+    let { placeholderValue: placeholderValue = new (0, $h2qOe$internationalizeddate.Time)(), minValue: minValue, maxValue: maxValue, granularity: granularity, validate: validate } = props;
     let [value, setValue] = (0, $h2qOe$reactstatelyutils.useControlledState)(props.value, props.defaultValue, props.onChange);
     let v = value || placeholderValue;
     let day = v && "day" in v ? v : undefined;
@@ -1258,7 +1518,11 @@ function $2654e87be0231a69$export$fd53cef0cc796101(props) {
         maxGranularity: "hour",
         placeholderValue: placeholderDate,
         // Calendar should not matter for time fields.
-        createCalendar: ()=>new (0, $h2qOe$internationalizeddate.GregorianCalendar)()
+        createCalendar: ()=>new (0, $h2qOe$internationalizeddate.GregorianCalendar)(),
+        validate: (0, $h2qOe$react.useCallback)(()=>validate === null || validate === void 0 ? void 0 : validate(value), [
+            validate,
+            value
+        ])
     });
     return {
         ...state,