@react-spectrum/datepicker 3.11.0 → 3.13.0

package/dist/utils.main.js

@@ -1,20 +1,24 @@
-var $61dVa$reactspectrumutils = require("@react-spectrum/utils");
-var $61dVa$reactariafocus = require("@react-aria/focus");
-var $61dVa$reactariai18n = require("@react-aria/i18n");
-var $61dVa$reactariadatepicker = require("@react-aria/datepicker");
-var $61dVa$react = require("react");
-var $61dVa$reactariautils = require("@react-aria/utils");
-var $61dVa$reactspectrumprovider = require("@react-spectrum/provider");
+var $6Arg9$reactspectrumutils = require("@react-spectrum/utils");
+var $6Arg9$reactariafocus = require("@react-aria/focus");
+var $6Arg9$react = require("react");
+var $6Arg9$reactariai18n = require("@react-aria/i18n");
+var $6Arg9$reactariadatepicker = require("@react-aria/datepicker");
+var $6Arg9$reactariautils = require("@react-aria/utils");
+var $6Arg9$reactspectrumprovider = require("@react-spectrum/provider");
 
 
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+
 function $parcel$export(e, n, v, s) {
   Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
 
-$parcel$export(module.exports, "useFormatHelpText", () => $4d2e419f522adb48$export$322f4580ccd8dde6);
-$parcel$export(module.exports, "useVisibleMonths", () => $4d2e419f522adb48$export$12ce2869ce471b1f);
-$parcel$export(module.exports, "useFocusManagerRef", () => $4d2e419f522adb48$export$71a23a36270e4bf0);
-$parcel$export(module.exports, "useFormattedDateWidth", () => $4d2e419f522adb48$export$31e22e3c931fc056);
+$parcel$export(module.exports, "useFormatHelpText", () => $9d3b96715dbbb2b7$export$322f4580ccd8dde6);
+$parcel$export(module.exports, "useVisibleMonths", () => $9d3b96715dbbb2b7$export$12ce2869ce471b1f);
+$parcel$export(module.exports, "useFocusManagerRef", () => $9d3b96715dbbb2b7$export$71a23a36270e4bf0);
+$parcel$export(module.exports, "useFormattedDateWidth", () => $9d3b96715dbbb2b7$export$31e22e3c931fc056);
 /*
  * Copyright 2020 Adobe. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -32,17 +36,25 @@ $parcel$export(module.exports, "useFormattedDateWidth", () => $4d2e419f522adb48$
 
 
 
-function $4d2e419f522adb48$export$322f4580ccd8dde6(props) {
-    let formatter = (0, $61dVa$reactariai18n.useDateFormatter)({
+function $9d3b96715dbbb2b7$export$322f4580ccd8dde6(props) {
+    let formatter = (0, $6Arg9$reactariai18n.useDateFormatter)({
         dateStyle: 'short'
     });
-    let displayNames = (0, $61dVa$reactariadatepicker.useDisplayNames)();
-    return (0, $61dVa$react.useMemo)(()=>{
+    let displayNames = (0, $6Arg9$reactariadatepicker.useDisplayNames)();
+    return (0, $6Arg9$react.useMemo)(()=>{
         if (props.description) return props.description;
-        if (props.showFormatHelpText) return formatter.formatToParts(new Date()).map((s)=>{
-            if (s.type === 'literal') return s.value;
-            return displayNames.of(s.type);
-        }).join(' ');
+        if (props.showFormatHelpText) return formatter.formatToParts(new Date()).map((s, i)=>{
+            if (s.type === 'literal') return /*#__PURE__*/ (0, ($parcel$interopDefault($6Arg9$react))).createElement("span", {
+                key: i
+            }, ` ${s.value} `);
+            return /*#__PURE__*/ (0, ($parcel$interopDefault($6Arg9$react))).createElement("span", {
+                key: i,
+                style: {
+                    unicodeBidi: 'embed',
+                    direction: 'ltr'
+                }
+            }, displayNames.of(s.type));
+        });
         return '';
     }, [
         props.description,
@@ -51,11 +63,11 @@ function $4d2e419f522adb48$export$322f4580ccd8dde6(props) {
         displayNames
     ]);
 }
-function $4d2e419f522adb48$export$12ce2869ce471b1f(maxVisibleMonths) {
-    let { scale: scale } = (0, $61dVa$reactspectrumprovider.useProvider)();
-    let [visibleMonths, setVisibleMonths] = (0, $61dVa$react.useState)($4d2e419f522adb48$var$getVisibleMonths(scale));
-    (0, $61dVa$reactariautils.useLayoutEffect)(()=>{
-        let onResize = ()=>setVisibleMonths($4d2e419f522adb48$var$getVisibleMonths(scale));
+function $9d3b96715dbbb2b7$export$12ce2869ce471b1f(maxVisibleMonths) {
+    let { scale: scale } = (0, $6Arg9$reactspectrumprovider.useProvider)();
+    let [visibleMonths, setVisibleMonths] = (0, $6Arg9$react.useState)($9d3b96715dbbb2b7$var$getVisibleMonths(scale));
+    (0, $6Arg9$reactariautils.useLayoutEffect)(()=>{
+        let onResize = ()=>setVisibleMonths($9d3b96715dbbb2b7$var$getVisibleMonths(scale));
         onResize();
         window.addEventListener('resize', onResize);
         return ()=>{
@@ -66,28 +78,28 @@ function $4d2e419f522adb48$export$12ce2869ce471b1f(maxVisibleMonths) {
     ]);
     return Math.max(1, Math.min(visibleMonths, maxVisibleMonths, 3));
 }
-function $4d2e419f522adb48$var$getVisibleMonths(scale) {
+function $9d3b96715dbbb2b7$var$getVisibleMonths(scale) {
     if (typeof window === 'undefined') return 1;
     let monthWidth = scale === 'large' ? 336 : 280;
     let gap = scale === 'large' ? 30 : 24;
     let popoverPadding = scale === 'large' ? 32 : 48;
     return Math.floor((window.innerWidth - popoverPadding * 2) / (monthWidth + gap));
 }
-function $4d2e419f522adb48$export$71a23a36270e4bf0(ref) {
-    let domRef = (0, $61dVa$react.useRef)(null);
-    (0, $61dVa$react.useImperativeHandle)(ref, ()=>({
-            ...(0, $61dVa$reactspectrumutils.createDOMRef)(domRef),
+function $9d3b96715dbbb2b7$export$71a23a36270e4bf0(ref) {
+    let domRef = (0, $6Arg9$react.useRef)(null);
+    (0, $6Arg9$react.useImperativeHandle)(ref, ()=>({
+            ...(0, $6Arg9$reactspectrumutils.createDOMRef)(domRef),
             focus () {
-                (0, $61dVa$reactariafocus.createFocusManager)(domRef).focusFirst({
+                (0, $6Arg9$reactariafocus.createFocusManager)(domRef).focusFirst({
                     tabbable: true
                 });
             }
         }));
     return domRef;
 }
-function $4d2e419f522adb48$export$31e22e3c931fc056(state) {
+function $9d3b96715dbbb2b7$export$31e22e3c931fc056(state) {
     var _useLocale;
-    let locale = (_useLocale = (0, $61dVa$reactariai18n.useLocale)()) === null || _useLocale === void 0 ? void 0 : _useLocale.locale;
+    let locale = (_useLocale = (0, $6Arg9$reactariai18n.useLocale)()) === null || _useLocale === void 0 ? void 0 : _useLocale.locale;
     let currentDate = new Date();
     let formatedDate = state.getDateFormatter(locale, {
         shouldForceLeadingZeros: true

package/dist/utils.main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAWM,SAAS,0CAAkB,KAA8E;IAC9G,IAAI,YAAY,CAAA,GAAA,qCAAe,EAAE;QAAC,WAAW;IAAO;IACpD,IAAI,eAAe,CAAA,GAAA,0CAAc;IACjC,OAAO,CAAA,GAAA,oBAAM,EAAE;QACb,IAAI,MAAM,WAAW,EACnB,OAAO,MAAM,WAAW;QAG1B,IAAI,MAAM,kBAAkB,EAC1B,OAAO,UAAU,aAAa,CAAC,IAAI,QAAQ,GAAG,CAAC,CAAA;YAC7C,IAAI,EAAE,IAAI,KAAK,WACb,OAAO,EAAE,KAAK;YAGhB,OAAO,aAAa,EAAE,CAAC,EAAE,IAAI;QAC/B,GAAG,IAAI,CAAC;QAGV,OAAO;IACT,GAAG;QAAC,MAAM,WAAW;QAAE,MAAM,kBAAkB;QAAE;QAAW;KAAa;AAC3E;AAEO,SAAS,0CAAiB,gBAAwB;IACvD,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,wCAAU;IACxB,IAAI,CAAC,eAAe,iBAAiB,GAAG,CAAA,GAAA,qBAAO,EAAE,uCAAiB;IAClE,CAAA,GAAA,qCAAc,EAAE;QACd,IAAI,WAAW,IAAM,iBAAiB,uCAAiB;QACvD;QAEA,OAAO,gBAAgB,CAAC,UAAU;QAClC,OAAO;YACL,OAAO,mBAAmB,CAAC,UAAU;QACvC;IACF,GAAG;QAAC;KAAM;IAEV,OAAO,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,eAAe,kBAAkB;AAC/D;AAEA,SAAS,uCAAiB,KAAK;IAC7B,IAAI,OAAO,WAAW,aACpB,OAAO;IAET,IAAI,aAAa,UAAU,UAAU,MAAM;IAC3C,IAAI,MAAM,UAAU,UAAU,KAAK;IACnC,IAAI,iBAAiB,UAAU,UAAU,KAAK;IAC9C,OAAO,KAAK,KAAK,CAAC,AAAC,CAAA,OAAO,UAAU,GAAG,iBAAiB,CAAA,IAAM,CAAA,aAAa,GAAE;AAC/E;AAEO,SAAS,0CAAmB,GAA8B;IAC/D,IAAI,SAAS,CAAA,GAAA,mBAAK,EAAsB;IACxC,CAAA,GAAA,gCAAkB,EAAE,KAAK,IAAO,CAAA;YAC9B,GAAG,CAAA,GAAA,sCAAW,EAAE,OAAO;YACvB;gBACE,CAAA,GAAA,wCAAiB,EAAE,QAAQ,UAAU,CAAC;oBAAC,UAAU;gBAAI;YACvD;QACF,CAAA;IACA,OAAO;AACT;AAEO,SAAS,0CAAsB,KAAK;QAC5B;IAAb,IAAI,UAAS,aAAA,CAAA,GAAA,8BAAQ,iBAAR,iCAAA,WAAa,MAAM;IAChC,IAAI,cAAc,IAAI;IACtB,IAAI,eAAe,MAAM,gBAAgB,CAAC,QAAQ;QAAC,yBAAyB;IAAI,GAAG,MAAM,CAAC,aAAa;IACvG,IAAI,kBAAmB,aAAa,MAAM;IAE1C,+CAA+C;IAC/C,8EAA8E;IAC9E,mFAAmF;IACnF,iEAAiE;IACjE,OAAQ,kBAAkB,KAAK,GAAG,CAAC,KAAK,KAAK,CAAC,kBAAkB,IAAI;AACtE","sources":["packages/@react-spectrum/datepicker/src/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {createDOMRef} from '@react-spectrum/utils';\nimport {createFocusManager} from '@react-aria/focus';\nimport {FocusableRef} from '@react-types/shared';\nimport {SpectrumDatePickerBase} from '@react-types/datepicker';\nimport {useDateFormatter, useLocale} from '@react-aria/i18n';\nimport {useDisplayNames} from '@react-aria/datepicker';\nimport {useImperativeHandle, useMemo, useRef, useState} from 'react';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useProvider} from '@react-spectrum/provider';\n\nexport function useFormatHelpText(props: Pick<SpectrumDatePickerBase<any>, 'description' | 'showFormatHelpText'>) {\n  let formatter = useDateFormatter({dateStyle: 'short'});\n  let displayNames = useDisplayNames();\n  return useMemo(() => {\n    if (props.description) {\n      return props.description;\n    }\n\n    if (props.showFormatHelpText) {\n      return formatter.formatToParts(new Date()).map(s => {\n        if (s.type === 'literal') {\n          return s.value;\n        }\n\n        return displayNames.of(s.type);\n      }).join(' ');\n    }\n\n    return '';\n  }, [props.description, props.showFormatHelpText, formatter, displayNames]);\n}\n\nexport function useVisibleMonths(maxVisibleMonths: number) {\n  let {scale} = useProvider()!;\n  let [visibleMonths, setVisibleMonths] = useState(getVisibleMonths(scale));\n  useLayoutEffect(() => {\n    let onResize = () => setVisibleMonths(getVisibleMonths(scale));\n    onResize();\n\n    window.addEventListener('resize', onResize);\n    return () => {\n      window.removeEventListener('resize', onResize);\n    };\n  }, [scale]);\n\n  return Math.max(1, Math.min(visibleMonths, maxVisibleMonths, 3));\n}\n\nfunction getVisibleMonths(scale) {\n  if (typeof window === 'undefined') {\n    return 1;\n  }\n  let monthWidth = scale === 'large' ? 336 : 280;\n  let gap = scale === 'large' ? 30 : 24;\n  let popoverPadding = scale === 'large' ? 32 : 48;\n  return Math.floor((window.innerWidth - popoverPadding * 2) / (monthWidth + gap));\n}\n\nexport function useFocusManagerRef(ref: FocusableRef<HTMLElement>) {\n  let domRef = useRef<HTMLElement | null>(null);\n  useImperativeHandle(ref, () => ({\n    ...createDOMRef(domRef),\n    focus() {\n      createFocusManager(domRef).focusFirst({tabbable: true});\n    }\n  }));\n  return domRef;\n}\n\nexport function useFormattedDateWidth(state) {\n  let locale = useLocale()?.locale;\n  let currentDate = new Date();\n  let formatedDate = state.getDateFormatter(locale, {shouldForceLeadingZeros: true}).format(currentDate, locale);\n  let totalCharacters =  formatedDate.length;\n\n  // The max of two is for times with only hours.\n  // As the length of a date grows we need to proportionally increase the width.\n  // We use the character count with 'ch' units and add extra padding to accomate for\n  // dates with months and time dashes, which are wider characters.\n  return (totalCharacters + Math.max(Math.floor(totalCharacters / 5), 2));\n}\n"],"names":[],"version":3,"file":"utils.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAWM,SAAS,0CAAkB,KAA8E;IAC9G,IAAI,YAAY,CAAA,GAAA,qCAAe,EAAE;QAAC,WAAW;IAAO;IACpD,IAAI,eAAe,CAAA,GAAA,0CAAc;IACjC,OAAO,CAAA,GAAA,oBAAM,EAAE;QACb,IAAI,MAAM,WAAW,EACnB,OAAO,MAAM,WAAW;QAG1B,IAAI,MAAM,kBAAkB,EAC1B,OACE,UAAU,aAAa,CAAC,IAAI,QAAQ,GAAG,CAAC,CAAC,GAAG;YAC1C,IAAI,EAAE,IAAI,KAAK,WACb,qBAAO,0DAAC;gBAAK,KAAK;eAAI,CAAC,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC,CAAC;YAGtC,qBAAO,0DAAC;gBAAK,KAAK;gBAAG,OAAO;oBAAC,aAAa;oBAAS,WAAW;gBAAK;eAAI,aAAa,EAAE,CAAC,EAAE,IAAI;QAC/F;QAIJ,OAAO;IACT,GAAG;QAAC,MAAM,WAAW;QAAE,MAAM,kBAAkB;QAAE;QAAW;KAAa;AAC3E;AAEO,SAAS,0CAAiB,gBAAwB;IACvD,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,wCAAU;IACxB,IAAI,CAAC,eAAe,iBAAiB,GAAG,CAAA,GAAA,qBAAO,EAAE,uCAAiB;IAClE,CAAA,GAAA,qCAAc,EAAE;QACd,IAAI,WAAW,IAAM,iBAAiB,uCAAiB;QACvD;QAEA,OAAO,gBAAgB,CAAC,UAAU;QAClC,OAAO;YACL,OAAO,mBAAmB,CAAC,UAAU;QACvC;IACF,GAAG;QAAC;KAAM;IAEV,OAAO,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,eAAe,kBAAkB;AAC/D;AAEA,SAAS,uCAAiB,KAAK;IAC7B,IAAI,OAAO,WAAW,aACpB,OAAO;IAET,IAAI,aAAa,UAAU,UAAU,MAAM;IAC3C,IAAI,MAAM,UAAU,UAAU,KAAK;IACnC,IAAI,iBAAiB,UAAU,UAAU,KAAK;IAC9C,OAAO,KAAK,KAAK,CAAC,AAAC,CAAA,OAAO,UAAU,GAAG,iBAAiB,CAAA,IAAM,CAAA,aAAa,GAAE;AAC/E;AAEO,SAAS,0CAAmB,GAA8B;IAC/D,IAAI,SAAS,CAAA,GAAA,mBAAK,EAAsB;IACxC,CAAA,GAAA,gCAAkB,EAAE,KAAK,IAAO,CAAA;YAC9B,GAAG,CAAA,GAAA,sCAAW,EAAE,OAAO;YACvB;gBACE,CAAA,GAAA,wCAAiB,EAAE,QAAQ,UAAU,CAAC;oBAAC,UAAU;gBAAI;YACvD;QACF,CAAA;IACA,OAAO;AACT;AAEO,SAAS,0CAAsB,KAAK;QAC5B;IAAb,IAAI,UAAS,aAAA,CAAA,GAAA,8BAAQ,iBAAR,iCAAA,WAAa,MAAM;IAChC,IAAI,cAAc,IAAI;IACtB,IAAI,eAAe,MAAM,gBAAgB,CAAC,QAAQ;QAAC,yBAAyB;IAAI,GAAG,MAAM,CAAC,aAAa;IACvG,IAAI,kBAAmB,aAAa,MAAM;IAE1C,+CAA+C;IAC/C,8EAA8E;IAC9E,mFAAmF;IACnF,iEAAiE;IACjE,OAAQ,kBAAkB,KAAK,GAAG,CAAC,KAAK,KAAK,CAAC,kBAAkB,IAAI;AACtE","sources":["packages/@react-spectrum/datepicker/src/utils.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {createDOMRef} from '@react-spectrum/utils';\nimport {createFocusManager} from '@react-aria/focus';\nimport {FocusableRef} from '@react-types/shared';\nimport React, {useImperativeHandle, useMemo, useRef, useState} from 'react';\nimport {SpectrumDatePickerBase} from '@react-types/datepicker';\nimport {useDateFormatter, useLocale} from '@react-aria/i18n';\nimport {useDisplayNames} from '@react-aria/datepicker';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useProvider} from '@react-spectrum/provider';\n\nexport function useFormatHelpText(props: Pick<SpectrumDatePickerBase<any>, 'description' | 'showFormatHelpText'>) {\n  let formatter = useDateFormatter({dateStyle: 'short'});\n  let displayNames = useDisplayNames();\n  return useMemo(() => {\n    if (props.description) {\n      return props.description;\n    }\n\n    if (props.showFormatHelpText) {\n      return (\n        formatter.formatToParts(new Date()).map((s, i) => {\n          if (s.type === 'literal') {\n            return <span key={i}>{` ${s.value} `}</span>;\n          }\n\n          return <span key={i} style={{unicodeBidi: 'embed', direction: 'ltr'}}>{displayNames.of(s.type)}</span>;\n        })\n      );\n    }\n\n    return '';\n  }, [props.description, props.showFormatHelpText, formatter, displayNames]);\n}\n\nexport function useVisibleMonths(maxVisibleMonths: number) {\n  let {scale} = useProvider()!;\n  let [visibleMonths, setVisibleMonths] = useState(getVisibleMonths(scale));\n  useLayoutEffect(() => {\n    let onResize = () => setVisibleMonths(getVisibleMonths(scale));\n    onResize();\n\n    window.addEventListener('resize', onResize);\n    return () => {\n      window.removeEventListener('resize', onResize);\n    };\n  }, [scale]);\n\n  return Math.max(1, Math.min(visibleMonths, maxVisibleMonths, 3));\n}\n\nfunction getVisibleMonths(scale) {\n  if (typeof window === 'undefined') {\n    return 1;\n  }\n  let monthWidth = scale === 'large' ? 336 : 280;\n  let gap = scale === 'large' ? 30 : 24;\n  let popoverPadding = scale === 'large' ? 32 : 48;\n  return Math.floor((window.innerWidth - popoverPadding * 2) / (monthWidth + gap));\n}\n\nexport function useFocusManagerRef(ref: FocusableRef<HTMLElement>) {\n  let domRef = useRef<HTMLElement | null>(null);\n  useImperativeHandle(ref, () => ({\n    ...createDOMRef(domRef),\n    focus() {\n      createFocusManager(domRef).focusFirst({tabbable: true});\n    }\n  }));\n  return domRef;\n}\n\nexport function useFormattedDateWidth(state) {\n  let locale = useLocale()?.locale;\n  let currentDate = new Date();\n  let formatedDate = state.getDateFormatter(locale, {shouldForceLeadingZeros: true}).format(currentDate, locale);\n  let totalCharacters =  formatedDate.length;\n\n  // The max of two is for times with only hours.\n  // As the length of a date grows we need to proportionally increase the width.\n  // We use the character count with 'ch' units and add extra padding to accomate for\n  // dates with months and time dashes, which are wider characters.\n  return (totalCharacters + Math.max(Math.floor(totalCharacters / 5), 2));\n}\n"],"names":[],"version":3,"file":"utils.main.js.map"}

package/dist/utils.mjs

@@ -1,10 +1,10 @@
-import {createDOMRef as $d7JPl$createDOMRef} from "@react-spectrum/utils";
-import {createFocusManager as $d7JPl$createFocusManager} from "@react-aria/focus";
-import {useDateFormatter as $d7JPl$useDateFormatter, useLocale as $d7JPl$useLocale} from "@react-aria/i18n";
-import {useDisplayNames as $d7JPl$useDisplayNames} from "@react-aria/datepicker";
-import {useMemo as $d7JPl$useMemo, useState as $d7JPl$useState, useRef as $d7JPl$useRef, useImperativeHandle as $d7JPl$useImperativeHandle} from "react";
-import {useLayoutEffect as $d7JPl$useLayoutEffect} from "@react-aria/utils";
-import {useProvider as $d7JPl$useProvider} from "@react-spectrum/provider";
+import {createDOMRef as $kDnTZ$createDOMRef} from "@react-spectrum/utils";
+import {createFocusManager as $kDnTZ$createFocusManager} from "@react-aria/focus";
+import $kDnTZ$react, {useMemo as $kDnTZ$useMemo, useState as $kDnTZ$useState, useRef as $kDnTZ$useRef, useImperativeHandle as $kDnTZ$useImperativeHandle} from "react";
+import {useDateFormatter as $kDnTZ$useDateFormatter, useLocale as $kDnTZ$useLocale} from "@react-aria/i18n";
+import {useDisplayNames as $kDnTZ$useDisplayNames} from "@react-aria/datepicker";
+import {useLayoutEffect as $kDnTZ$useLayoutEffect} from "@react-aria/utils";
+import {useProvider as $kDnTZ$useProvider} from "@react-spectrum/provider";
 
 /*
  * Copyright 2020 Adobe. All rights reserved.
@@ -23,17 +23,25 @@ import {useProvider as $d7JPl$useProvider} from "@react-spectrum/provider";
 
 
 
-function $04e96200274b03de$export$322f4580ccd8dde6(props) {
-    let formatter = (0, $d7JPl$useDateFormatter)({
+function $ea94a5cfe92db3c2$export$322f4580ccd8dde6(props) {
+    let formatter = (0, $kDnTZ$useDateFormatter)({
         dateStyle: 'short'
     });
-    let displayNames = (0, $d7JPl$useDisplayNames)();
-    return (0, $d7JPl$useMemo)(()=>{
+    let displayNames = (0, $kDnTZ$useDisplayNames)();
+    return (0, $kDnTZ$useMemo)(()=>{
         if (props.description) return props.description;
-        if (props.showFormatHelpText) return formatter.formatToParts(new Date()).map((s)=>{
-            if (s.type === 'literal') return s.value;
-            return displayNames.of(s.type);
-        }).join(' ');
+        if (props.showFormatHelpText) return formatter.formatToParts(new Date()).map((s, i)=>{
+            if (s.type === 'literal') return /*#__PURE__*/ (0, $kDnTZ$react).createElement("span", {
+                key: i
+            }, ` ${s.value} `);
+            return /*#__PURE__*/ (0, $kDnTZ$react).createElement("span", {
+                key: i,
+                style: {
+                    unicodeBidi: 'embed',
+                    direction: 'ltr'
+                }
+            }, displayNames.of(s.type));
+        });
         return '';
     }, [
         props.description,
@@ -42,11 +50,11 @@ function $04e96200274b03de$export$322f4580ccd8dde6(props) {
         displayNames
     ]);
 }
-function $04e96200274b03de$export$12ce2869ce471b1f(maxVisibleMonths) {
-    let { scale: scale } = (0, $d7JPl$useProvider)();
-    let [visibleMonths, setVisibleMonths] = (0, $d7JPl$useState)($04e96200274b03de$var$getVisibleMonths(scale));
-    (0, $d7JPl$useLayoutEffect)(()=>{
-        let onResize = ()=>setVisibleMonths($04e96200274b03de$var$getVisibleMonths(scale));
+function $ea94a5cfe92db3c2$export$12ce2869ce471b1f(maxVisibleMonths) {
+    let { scale: scale } = (0, $kDnTZ$useProvider)();
+    let [visibleMonths, setVisibleMonths] = (0, $kDnTZ$useState)($ea94a5cfe92db3c2$var$getVisibleMonths(scale));
+    (0, $kDnTZ$useLayoutEffect)(()=>{
+        let onResize = ()=>setVisibleMonths($ea94a5cfe92db3c2$var$getVisibleMonths(scale));
         onResize();
         window.addEventListener('resize', onResize);
         return ()=>{
@@ -57,28 +65,28 @@ function $04e96200274b03de$export$12ce2869ce471b1f(maxVisibleMonths) {
     ]);
     return Math.max(1, Math.min(visibleMonths, maxVisibleMonths, 3));
 }
-function $04e96200274b03de$var$getVisibleMonths(scale) {
+function $ea94a5cfe92db3c2$var$getVisibleMonths(scale) {
     if (typeof window === 'undefined') return 1;
     let monthWidth = scale === 'large' ? 336 : 280;
     let gap = scale === 'large' ? 30 : 24;
     let popoverPadding = scale === 'large' ? 32 : 48;
     return Math.floor((window.innerWidth - popoverPadding * 2) / (monthWidth + gap));
 }
-function $04e96200274b03de$export$71a23a36270e4bf0(ref) {
-    let domRef = (0, $d7JPl$useRef)(null);
-    (0, $d7JPl$useImperativeHandle)(ref, ()=>({
-            ...(0, $d7JPl$createDOMRef)(domRef),
+function $ea94a5cfe92db3c2$export$71a23a36270e4bf0(ref) {
+    let domRef = (0, $kDnTZ$useRef)(null);
+    (0, $kDnTZ$useImperativeHandle)(ref, ()=>({
+            ...(0, $kDnTZ$createDOMRef)(domRef),
             focus () {
-                (0, $d7JPl$createFocusManager)(domRef).focusFirst({
+                (0, $kDnTZ$createFocusManager)(domRef).focusFirst({
                     tabbable: true
                 });
             }
         }));
     return domRef;
 }
-function $04e96200274b03de$export$31e22e3c931fc056(state) {
+function $ea94a5cfe92db3c2$export$31e22e3c931fc056(state) {
     var _useLocale;
-    let locale = (_useLocale = (0, $d7JPl$useLocale)()) === null || _useLocale === void 0 ? void 0 : _useLocale.locale;
+    let locale = (_useLocale = (0, $kDnTZ$useLocale)()) === null || _useLocale === void 0 ? void 0 : _useLocale.locale;
     let currentDate = new Date();
     let formatedDate = state.getDateFormatter(locale, {
         shouldForceLeadingZeros: true
@@ -92,5 +100,5 @@ function $04e96200274b03de$export$31e22e3c931fc056(state) {
 }
 
 
-export {$04e96200274b03de$export$322f4580ccd8dde6 as useFormatHelpText, $04e96200274b03de$export$12ce2869ce471b1f as useVisibleMonths, $04e96200274b03de$export$71a23a36270e4bf0 as useFocusManagerRef, $04e96200274b03de$export$31e22e3c931fc056 as useFormattedDateWidth};
+export {$ea94a5cfe92db3c2$export$322f4580ccd8dde6 as useFormatHelpText, $ea94a5cfe92db3c2$export$12ce2869ce471b1f as useVisibleMonths, $ea94a5cfe92db3c2$export$71a23a36270e4bf0 as useFocusManagerRef, $ea94a5cfe92db3c2$export$31e22e3c931fc056 as useFormattedDateWidth};
 //# sourceMappingURL=utils.module.js.map

package/dist/utils.module.js

@@ -1,10 +1,10 @@
-import {createDOMRef as $d7JPl$createDOMRef} from "@react-spectrum/utils";
-import {createFocusManager as $d7JPl$createFocusManager} from "@react-aria/focus";
-import {useDateFormatter as $d7JPl$useDateFormatter, useLocale as $d7JPl$useLocale} from "@react-aria/i18n";
-import {useDisplayNames as $d7JPl$useDisplayNames} from "@react-aria/datepicker";
-import {useMemo as $d7JPl$useMemo, useState as $d7JPl$useState, useRef as $d7JPl$useRef, useImperativeHandle as $d7JPl$useImperativeHandle} from "react";
-import {useLayoutEffect as $d7JPl$useLayoutEffect} from "@react-aria/utils";
-import {useProvider as $d7JPl$useProvider} from "@react-spectrum/provider";
+import {createDOMRef as $kDnTZ$createDOMRef} from "@react-spectrum/utils";
+import {createFocusManager as $kDnTZ$createFocusManager} from "@react-aria/focus";
+import $kDnTZ$react, {useMemo as $kDnTZ$useMemo, useState as $kDnTZ$useState, useRef as $kDnTZ$useRef, useImperativeHandle as $kDnTZ$useImperativeHandle} from "react";
+import {useDateFormatter as $kDnTZ$useDateFormatter, useLocale as $kDnTZ$useLocale} from "@react-aria/i18n";
+import {useDisplayNames as $kDnTZ$useDisplayNames} from "@react-aria/datepicker";
+import {useLayoutEffect as $kDnTZ$useLayoutEffect} from "@react-aria/utils";
+import {useProvider as $kDnTZ$useProvider} from "@react-spectrum/provider";
 
 /*
  * Copyright 2020 Adobe. All rights reserved.
@@ -23,17 +23,25 @@ import {useProvider as $d7JPl$useProvider} from "@react-spectrum/provider";
 
 
 
-function $04e96200274b03de$export$322f4580ccd8dde6(props) {
-    let formatter = (0, $d7JPl$useDateFormatter)({
+function $ea94a5cfe92db3c2$export$322f4580ccd8dde6(props) {
+    let formatter = (0, $kDnTZ$useDateFormatter)({
         dateStyle: 'short'
     });
-    let displayNames = (0, $d7JPl$useDisplayNames)();
-    return (0, $d7JPl$useMemo)(()=>{
+    let displayNames = (0, $kDnTZ$useDisplayNames)();
+    return (0, $kDnTZ$useMemo)(()=>{
         if (props.description) return props.description;
-        if (props.showFormatHelpText) return formatter.formatToParts(new Date()).map((s)=>{
-            if (s.type === 'literal') return s.value;
-            return displayNames.of(s.type);
-        }).join(' ');
+        if (props.showFormatHelpText) return formatter.formatToParts(new Date()).map((s, i)=>{
+            if (s.type === 'literal') return /*#__PURE__*/ (0, $kDnTZ$react).createElement("span", {
+                key: i
+            }, ` ${s.value} `);
+            return /*#__PURE__*/ (0, $kDnTZ$react).createElement("span", {
+                key: i,
+                style: {
+                    unicodeBidi: 'embed',
+                    direction: 'ltr'
+                }
+            }, displayNames.of(s.type));
+        });
         return '';
     }, [
         props.description,
@@ -42,11 +50,11 @@ function $04e96200274b03de$export$322f4580ccd8dde6(props) {
         displayNames
     ]);
 }
-function $04e96200274b03de$export$12ce2869ce471b1f(maxVisibleMonths) {
-    let { scale: scale } = (0, $d7JPl$useProvider)();
-    let [visibleMonths, setVisibleMonths] = (0, $d7JPl$useState)($04e96200274b03de$var$getVisibleMonths(scale));
-    (0, $d7JPl$useLayoutEffect)(()=>{
-        let onResize = ()=>setVisibleMonths($04e96200274b03de$var$getVisibleMonths(scale));
+function $ea94a5cfe92db3c2$export$12ce2869ce471b1f(maxVisibleMonths) {
+    let { scale: scale } = (0, $kDnTZ$useProvider)();
+    let [visibleMonths, setVisibleMonths] = (0, $kDnTZ$useState)($ea94a5cfe92db3c2$var$getVisibleMonths(scale));
+    (0, $kDnTZ$useLayoutEffect)(()=>{
+        let onResize = ()=>setVisibleMonths($ea94a5cfe92db3c2$var$getVisibleMonths(scale));
         onResize();
         window.addEventListener('resize', onResize);
         return ()=>{
@@ -57,28 +65,28 @@ function $04e96200274b03de$export$12ce2869ce471b1f(maxVisibleMonths) {
     ]);
     return Math.max(1, Math.min(visibleMonths, maxVisibleMonths, 3));
 }
-function $04e96200274b03de$var$getVisibleMonths(scale) {
+function $ea94a5cfe92db3c2$var$getVisibleMonths(scale) {
     if (typeof window === 'undefined') return 1;
     let monthWidth = scale === 'large' ? 336 : 280;
     let gap = scale === 'large' ? 30 : 24;
     let popoverPadding = scale === 'large' ? 32 : 48;
     return Math.floor((window.innerWidth - popoverPadding * 2) / (monthWidth + gap));
 }
-function $04e96200274b03de$export$71a23a36270e4bf0(ref) {
-    let domRef = (0, $d7JPl$useRef)(null);
-    (0, $d7JPl$useImperativeHandle)(ref, ()=>({
-            ...(0, $d7JPl$createDOMRef)(domRef),
+function $ea94a5cfe92db3c2$export$71a23a36270e4bf0(ref) {
+    let domRef = (0, $kDnTZ$useRef)(null);
+    (0, $kDnTZ$useImperativeHandle)(ref, ()=>({
+            ...(0, $kDnTZ$createDOMRef)(domRef),
             focus () {
-                (0, $d7JPl$createFocusManager)(domRef).focusFirst({
+                (0, $kDnTZ$createFocusManager)(domRef).focusFirst({
                     tabbable: true
                 });
             }
         }));
     return domRef;
 }
-function $04e96200274b03de$export$31e22e3c931fc056(state) {
+function $ea94a5cfe92db3c2$export$31e22e3c931fc056(state) {
     var _useLocale;
-    let locale = (_useLocale = (0, $d7JPl$useLocale)()) === null || _useLocale === void 0 ? void 0 : _useLocale.locale;
+    let locale = (_useLocale = (0, $kDnTZ$useLocale)()) === null || _useLocale === void 0 ? void 0 : _useLocale.locale;
     let currentDate = new Date();
     let formatedDate = state.getDateFormatter(locale, {
         shouldForceLeadingZeros: true
@@ -92,5 +100,5 @@ function $04e96200274b03de$export$31e22e3c931fc056(state) {
 }
 
 
-export {$04e96200274b03de$export$322f4580ccd8dde6 as useFormatHelpText, $04e96200274b03de$export$12ce2869ce471b1f as useVisibleMonths, $04e96200274b03de$export$71a23a36270e4bf0 as useFocusManagerRef, $04e96200274b03de$export$31e22e3c931fc056 as useFormattedDateWidth};
+export {$ea94a5cfe92db3c2$export$322f4580ccd8dde6 as useFormatHelpText, $ea94a5cfe92db3c2$export$12ce2869ce471b1f as useVisibleMonths, $ea94a5cfe92db3c2$export$71a23a36270e4bf0 as useFocusManagerRef, $ea94a5cfe92db3c2$export$31e22e3c931fc056 as useFormattedDateWidth};
 //# sourceMappingURL=utils.module.js.map

package/dist/utils.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAWM,SAAS,0CAAkB,KAA8E;IAC9G,IAAI,YAAY,CAAA,GAAA,uBAAe,EAAE;QAAC,WAAW;IAAO;IACpD,IAAI,eAAe,CAAA,GAAA,sBAAc;IACjC,OAAO,CAAA,GAAA,cAAM,EAAE;QACb,IAAI,MAAM,WAAW,EACnB,OAAO,MAAM,WAAW;QAG1B,IAAI,MAAM,kBAAkB,EAC1B,OAAO,UAAU,aAAa,CAAC,IAAI,QAAQ,GAAG,CAAC,CAAA;YAC7C,IAAI,EAAE,IAAI,KAAK,WACb,OAAO,EAAE,KAAK;YAGhB,OAAO,aAAa,EAAE,CAAC,EAAE,IAAI;QAC/B,GAAG,IAAI,CAAC;QAGV,OAAO;IACT,GAAG;QAAC,MAAM,WAAW;QAAE,MAAM,kBAAkB;QAAE;QAAW;KAAa;AAC3E;AAEO,SAAS,0CAAiB,gBAAwB;IACvD,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,kBAAU;IACxB,IAAI,CAAC,eAAe,iBAAiB,GAAG,CAAA,GAAA,eAAO,EAAE,uCAAiB;IAClE,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,WAAW,IAAM,iBAAiB,uCAAiB;QACvD;QAEA,OAAO,gBAAgB,CAAC,UAAU;QAClC,OAAO;YACL,OAAO,mBAAmB,CAAC,UAAU;QACvC;IACF,GAAG;QAAC;KAAM;IAEV,OAAO,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,eAAe,kBAAkB;AAC/D;AAEA,SAAS,uCAAiB,KAAK;IAC7B,IAAI,OAAO,WAAW,aACpB,OAAO;IAET,IAAI,aAAa,UAAU,UAAU,MAAM;IAC3C,IAAI,MAAM,UAAU,UAAU,KAAK;IACnC,IAAI,iBAAiB,UAAU,UAAU,KAAK;IAC9C,OAAO,KAAK,KAAK,CAAC,AAAC,CAAA,OAAO,UAAU,GAAG,iBAAiB,CAAA,IAAM,CAAA,aAAa,GAAE;AAC/E;AAEO,SAAS,0CAAmB,GAA8B;IAC/D,IAAI,SAAS,CAAA,GAAA,aAAK,EAAsB;IACxC,CAAA,GAAA,0BAAkB,EAAE,KAAK,IAAO,CAAA;YAC9B,GAAG,CAAA,GAAA,mBAAW,EAAE,OAAO;YACvB;gBACE,CAAA,GAAA,yBAAiB,EAAE,QAAQ,UAAU,CAAC;oBAAC,UAAU;gBAAI;YACvD;QACF,CAAA;IACA,OAAO;AACT;AAEO,SAAS,0CAAsB,KAAK;QAC5B;IAAb,IAAI,UAAS,aAAA,CAAA,GAAA,gBAAQ,iBAAR,iCAAA,WAAa,MAAM;IAChC,IAAI,cAAc,IAAI;IACtB,IAAI,eAAe,MAAM,gBAAgB,CAAC,QAAQ;QAAC,yBAAyB;IAAI,GAAG,MAAM,CAAC,aAAa;IACvG,IAAI,kBAAmB,aAAa,MAAM;IAE1C,+CAA+C;IAC/C,8EAA8E;IAC9E,mFAAmF;IACnF,iEAAiE;IACjE,OAAQ,kBAAkB,KAAK,GAAG,CAAC,KAAK,KAAK,CAAC,kBAAkB,IAAI;AACtE","sources":["packages/@react-spectrum/datepicker/src/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {createDOMRef} from '@react-spectrum/utils';\nimport {createFocusManager} from '@react-aria/focus';\nimport {FocusableRef} from '@react-types/shared';\nimport {SpectrumDatePickerBase} from '@react-types/datepicker';\nimport {useDateFormatter, useLocale} from '@react-aria/i18n';\nimport {useDisplayNames} from '@react-aria/datepicker';\nimport {useImperativeHandle, useMemo, useRef, useState} from 'react';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useProvider} from '@react-spectrum/provider';\n\nexport function useFormatHelpText(props: Pick<SpectrumDatePickerBase<any>, 'description' | 'showFormatHelpText'>) {\n  let formatter = useDateFormatter({dateStyle: 'short'});\n  let displayNames = useDisplayNames();\n  return useMemo(() => {\n    if (props.description) {\n      return props.description;\n    }\n\n    if (props.showFormatHelpText) {\n      return formatter.formatToParts(new Date()).map(s => {\n        if (s.type === 'literal') {\n          return s.value;\n        }\n\n        return displayNames.of(s.type);\n      }).join(' ');\n    }\n\n    return '';\n  }, [props.description, props.showFormatHelpText, formatter, displayNames]);\n}\n\nexport function useVisibleMonths(maxVisibleMonths: number) {\n  let {scale} = useProvider()!;\n  let [visibleMonths, setVisibleMonths] = useState(getVisibleMonths(scale));\n  useLayoutEffect(() => {\n    let onResize = () => setVisibleMonths(getVisibleMonths(scale));\n    onResize();\n\n    window.addEventListener('resize', onResize);\n    return () => {\n      window.removeEventListener('resize', onResize);\n    };\n  }, [scale]);\n\n  return Math.max(1, Math.min(visibleMonths, maxVisibleMonths, 3));\n}\n\nfunction getVisibleMonths(scale) {\n  if (typeof window === 'undefined') {\n    return 1;\n  }\n  let monthWidth = scale === 'large' ? 336 : 280;\n  let gap = scale === 'large' ? 30 : 24;\n  let popoverPadding = scale === 'large' ? 32 : 48;\n  return Math.floor((window.innerWidth - popoverPadding * 2) / (monthWidth + gap));\n}\n\nexport function useFocusManagerRef(ref: FocusableRef<HTMLElement>) {\n  let domRef = useRef<HTMLElement | null>(null);\n  useImperativeHandle(ref, () => ({\n    ...createDOMRef(domRef),\n    focus() {\n      createFocusManager(domRef).focusFirst({tabbable: true});\n    }\n  }));\n  return domRef;\n}\n\nexport function useFormattedDateWidth(state) {\n  let locale = useLocale()?.locale;\n  let currentDate = new Date();\n  let formatedDate = state.getDateFormatter(locale, {shouldForceLeadingZeros: true}).format(currentDate, locale);\n  let totalCharacters =  formatedDate.length;\n\n  // The max of two is for times with only hours.\n  // As the length of a date grows we need to proportionally increase the width.\n  // We use the character count with 'ch' units and add extra padding to accomate for\n  // dates with months and time dashes, which are wider characters.\n  return (totalCharacters + Math.max(Math.floor(totalCharacters / 5), 2));\n}\n"],"names":[],"version":3,"file":"utils.module.js.map"}
+{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;AAWM,SAAS,0CAAkB,KAA8E;IAC9G,IAAI,YAAY,CAAA,GAAA,uBAAe,EAAE;QAAC,WAAW;IAAO;IACpD,IAAI,eAAe,CAAA,GAAA,sBAAc;IACjC,OAAO,CAAA,GAAA,cAAM,EAAE;QACb,IAAI,MAAM,WAAW,EACnB,OAAO,MAAM,WAAW;QAG1B,IAAI,MAAM,kBAAkB,EAC1B,OACE,UAAU,aAAa,CAAC,IAAI,QAAQ,GAAG,CAAC,CAAC,GAAG;YAC1C,IAAI,EAAE,IAAI,KAAK,WACb,qBAAO,gCAAC;gBAAK,KAAK;eAAI,CAAC,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC,CAAC;YAGtC,qBAAO,gCAAC;gBAAK,KAAK;gBAAG,OAAO;oBAAC,aAAa;oBAAS,WAAW;gBAAK;eAAI,aAAa,EAAE,CAAC,EAAE,IAAI;QAC/F;QAIJ,OAAO;IACT,GAAG;QAAC,MAAM,WAAW;QAAE,MAAM,kBAAkB;QAAE;QAAW;KAAa;AAC3E;AAEO,SAAS,0CAAiB,gBAAwB;IACvD,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,kBAAU;IACxB,IAAI,CAAC,eAAe,iBAAiB,GAAG,CAAA,GAAA,eAAO,EAAE,uCAAiB;IAClE,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,WAAW,IAAM,iBAAiB,uCAAiB;QACvD;QAEA,OAAO,gBAAgB,CAAC,UAAU;QAClC,OAAO;YACL,OAAO,mBAAmB,CAAC,UAAU;QACvC;IACF,GAAG;QAAC;KAAM;IAEV,OAAO,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,eAAe,kBAAkB;AAC/D;AAEA,SAAS,uCAAiB,KAAK;IAC7B,IAAI,OAAO,WAAW,aACpB,OAAO;IAET,IAAI,aAAa,UAAU,UAAU,MAAM;IAC3C,IAAI,MAAM,UAAU,UAAU,KAAK;IACnC,IAAI,iBAAiB,UAAU,UAAU,KAAK;IAC9C,OAAO,KAAK,KAAK,CAAC,AAAC,CAAA,OAAO,UAAU,GAAG,iBAAiB,CAAA,IAAM,CAAA,aAAa,GAAE;AAC/E;AAEO,SAAS,0CAAmB,GAA8B;IAC/D,IAAI,SAAS,CAAA,GAAA,aAAK,EAAsB;IACxC,CAAA,GAAA,0BAAkB,EAAE,KAAK,IAAO,CAAA;YAC9B,GAAG,CAAA,GAAA,mBAAW,EAAE,OAAO;YACvB;gBACE,CAAA,GAAA,yBAAiB,EAAE,QAAQ,UAAU,CAAC;oBAAC,UAAU;gBAAI;YACvD;QACF,CAAA;IACA,OAAO;AACT;AAEO,SAAS,0CAAsB,KAAK;QAC5B;IAAb,IAAI,UAAS,aAAA,CAAA,GAAA,gBAAQ,iBAAR,iCAAA,WAAa,MAAM;IAChC,IAAI,cAAc,IAAI;IACtB,IAAI,eAAe,MAAM,gBAAgB,CAAC,QAAQ;QAAC,yBAAyB;IAAI,GAAG,MAAM,CAAC,aAAa;IACvG,IAAI,kBAAmB,aAAa,MAAM;IAE1C,+CAA+C;IAC/C,8EAA8E;IAC9E,mFAAmF;IACnF,iEAAiE;IACjE,OAAQ,kBAAkB,KAAK,GAAG,CAAC,KAAK,KAAK,CAAC,kBAAkB,IAAI;AACtE","sources":["packages/@react-spectrum/datepicker/src/utils.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {createDOMRef} from '@react-spectrum/utils';\nimport {createFocusManager} from '@react-aria/focus';\nimport {FocusableRef} from '@react-types/shared';\nimport React, {useImperativeHandle, useMemo, useRef, useState} from 'react';\nimport {SpectrumDatePickerBase} from '@react-types/datepicker';\nimport {useDateFormatter, useLocale} from '@react-aria/i18n';\nimport {useDisplayNames} from '@react-aria/datepicker';\nimport {useLayoutEffect} from '@react-aria/utils';\nimport {useProvider} from '@react-spectrum/provider';\n\nexport function useFormatHelpText(props: Pick<SpectrumDatePickerBase<any>, 'description' | 'showFormatHelpText'>) {\n  let formatter = useDateFormatter({dateStyle: 'short'});\n  let displayNames = useDisplayNames();\n  return useMemo(() => {\n    if (props.description) {\n      return props.description;\n    }\n\n    if (props.showFormatHelpText) {\n      return (\n        formatter.formatToParts(new Date()).map((s, i) => {\n          if (s.type === 'literal') {\n            return <span key={i}>{` ${s.value} `}</span>;\n          }\n\n          return <span key={i} style={{unicodeBidi: 'embed', direction: 'ltr'}}>{displayNames.of(s.type)}</span>;\n        })\n      );\n    }\n\n    return '';\n  }, [props.description, props.showFormatHelpText, formatter, displayNames]);\n}\n\nexport function useVisibleMonths(maxVisibleMonths: number) {\n  let {scale} = useProvider()!;\n  let [visibleMonths, setVisibleMonths] = useState(getVisibleMonths(scale));\n  useLayoutEffect(() => {\n    let onResize = () => setVisibleMonths(getVisibleMonths(scale));\n    onResize();\n\n    window.addEventListener('resize', onResize);\n    return () => {\n      window.removeEventListener('resize', onResize);\n    };\n  }, [scale]);\n\n  return Math.max(1, Math.min(visibleMonths, maxVisibleMonths, 3));\n}\n\nfunction getVisibleMonths(scale) {\n  if (typeof window === 'undefined') {\n    return 1;\n  }\n  let monthWidth = scale === 'large' ? 336 : 280;\n  let gap = scale === 'large' ? 30 : 24;\n  let popoverPadding = scale === 'large' ? 32 : 48;\n  return Math.floor((window.innerWidth - popoverPadding * 2) / (monthWidth + gap));\n}\n\nexport function useFocusManagerRef(ref: FocusableRef<HTMLElement>) {\n  let domRef = useRef<HTMLElement | null>(null);\n  useImperativeHandle(ref, () => ({\n    ...createDOMRef(domRef),\n    focus() {\n      createFocusManager(domRef).focusFirst({tabbable: true});\n    }\n  }));\n  return domRef;\n}\n\nexport function useFormattedDateWidth(state) {\n  let locale = useLocale()?.locale;\n  let currentDate = new Date();\n  let formatedDate = state.getDateFormatter(locale, {shouldForceLeadingZeros: true}).format(currentDate, locale);\n  let totalCharacters =  formatedDate.length;\n\n  // The max of two is for times with only hours.\n  // As the length of a date grows we need to proportionally increase the width.\n  // We use the character count with 'ch' units and add extra padding to accomate for\n  // dates with months and time dashes, which are wider characters.\n  return (totalCharacters + Math.max(Math.floor(totalCharacters / 5), 2));\n}\n"],"names":[],"version":3,"file":"utils.module.js.map"}

package/dist/{vars.61240e3b.css → vars.ba84240a.css}

@@ -97,6 +97,7 @@
   border-radius: var(--spectrum-textfield-border-radius, var(--spectrum-alias-border-radius-regular));
   padding: 3px var(--spectrum-textfield-padding-x, var(--spectrum-global-dimension-size-150)) 5px calc(var(--spectrum-textfield-padding-x, var(--spectrum-global-dimension-size-150))  - 1px);
   text-indent: 0;
+  inline-size: 100%;
   height: var(--spectrum-textfield-height, var(--spectrum-alias-single-line-height));
   vertical-align: top;
   font-size: var(--spectrum-textfield-text-size, var(--spectrum-alias-font-size-default));
@@ -106,7 +107,6 @@
   -webkit-appearance: none;
   -moz-appearance: textfield;
   outline: none;
-  inline-size: 100%;
   margin: 0;
   overflow: visible;
 }
@@ -199,10 +199,10 @@
 }
 
 .zo2IKa_spectrum-Textfield--multiline .zo2IKa_spectrum-Textfield-input {
+  height: auto;
   min-height: var(--spectrum-global-dimension-size-700);
   padding: 3px var(--spectrum-textfield-padding-x, var(--spectrum-global-dimension-size-150)) 5px calc(var(--spectrum-textfield-padding-x, var(--spectrum-global-dimension-size-150))  - 1px);
   resize: none;
-  height: auto;
   overflow: auto;
 }
 
@@ -547,4 +547,4 @@
     border-color: var(--spectrum-textfield-quiet-border-color-key-focus, var(--spectrum-alias-border-color-focus));
   }
 }
-/*# sourceMappingURL=vars.61240e3b.css.map */
+/*# sourceMappingURL=vars.ba84240a.css.map */

package/dist/{vars.61240e3b.css.map → vars.ba84240a.css.map}

@@ -1 +1 @@
-{"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;AAQE;;;;;;AAWF;;;;;;;;;;;;;;;;;;;;AA4CE;;;;;;;;AAYA;;;;;;;AAWE;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAMA;;;;AAKF;;;;;AAME;;;;AAQF;;;;;AAOA;;;;;AAAA;;;;;AAOA;;;;AAIA;;;;;;;;AAUA;;;;;;;AASA;;;;AAIA;;;;AASF;;;;AAIA;;;;;AAKE;;;;AAIA;;;;;AAME;;;;AAOJ;;;;;;;;AAUE;;;;AAKF;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAOA;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AASA;;;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAaA;;;;AASE;;;;AAIE;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKF;;;;;AAQF;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAME;;;;AAiBF;;;;;;AAKE;;;;AAKA;;;;;AAIE;;;;AAMF;;;;;;AAKE;;;;AAMF;;;;AAME;;;;;AAMF;;;;;;;AASE;;;;AAKA;;;;AAdF;;;;;;;AASE;;;;AAKA;;;;AAKF;;;;AAGE;;;;AAcE;;;;;AAOJ;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAME;;;;;AAMF;;;;;AAOF;;;;AAGE;;;;AAIA;;;;AAIA;;;;AAME;;;;;AASA;;;;AASJ;;;;AAIA;;;;AAKF;EACE;;;;;;;;;;;;EAUE;;;;;EAKE;;;;;;EAKE","sources":["packages/@adobe/spectrum-css-temp/components/textfield/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.61240e3b.css.map"}
+{"mappings":"AA4DA;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAQA;;;;AAIA;;;;AAKF;;;;;;;;AAOE;;;;;;;;;;;AAqBE;;;;;AAQF;;;;AAKE;;;;;AAOJ;EACE;;;;EAIE;;;;;AAMJ;;;;;;;AAQE;;;;;;AAWF;;;;;;;;;;;;;;;;;;;;AA4CE;;;;;;;;AAYA;;;;;;;AAWE;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAJA;;;;AAIA;;;;AAMA;;;;AAKF;;;;;AAME;;;;AAQF;;;;;AAOA;;;;;AAAA;;;;;AAOA;;;;AAIA;;;;;;;;AAUA;;;;;;;AASA;;;;AAIA;;;;AASF;;;;AAIA;;;;;AAKE;;;;AAIA;;;;;AAME;;;;AAOJ;;;;;;;;AAUE;;;;AAKF;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAOA;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AASA;;;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAaA;;;;AASE;;;;AAIE;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAKF;;;;;AAQF;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAME;;;;AAiBF;;;;;;AAKE;;;;AAKA;;;;;AAIE;;;;AAMF;;;;;;AAKE;;;;AAMF;;;;AAME;;;;;AAMF;;;;;;;AASE;;;;AAKA;;;;AAdF;;;;;;;AASE;;;;AAKA;;;;AAKF;;;;AAGE;;;;AAcE;;;;;AAOJ;;;;;AAIE;;;;AAIA;;;;AAIA;;;;AAME;;;;;AAMF;;;;;AAOF;;;;AAGE;;;;AAIA;;;;AAIA;;;;AAME;;;;;AASA;;;;AASJ;;;;AAIA;;;;AAKF;EACE;;;;;;;;;;;;EAUE;;;;;EAKE;;;;;;EAKE","sources":["packages/@adobe/spectrum-css-temp/components/textfield/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"vars.ba84240a.css.map"}