@esri/calcite-components 1.5.0-next.8 → 1.5.0

package/dist/cjs/{calcite-input-time-picker.calcite-time-picker-1cb31a73.js → calcite-input-time-picker.calcite-time-picker-30d9d752.js}

@@ -1,20 +1,20 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.5.0-next.8
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.5.0
  */
 'use strict';
 
-const index = require('./index-1a221706.js');
-const form = require('./form-fd8e8f3a.js');
-const guid = require('./guid-cd4104aa.js');
-const interactive = require('./interactive-05230447.js');
-const key = require('./key-b78bfb11.js');
-const label = require('./label-bbd59060.js');
-const loadable = require('./loadable-f115fa18.js');
-const locale$1 = require('./locale-02aab000.js');
-const focusTrapComponent = require('./focusTrapComponent-4b8bbf57.js');
-const t9n = require('./t9n-6073e099.js');
+const index = require('./index-9f8ce657.js');
+const form = require('./form-c8a8a683.js');
+const guid = require('./guid-1a635f47.js');
+const interactive = require('./interactive-793314f0.js');
+const key = require('./key-e590036d.js');
+const label = require('./label-22e5c734.js');
+const loadable = require('./loadable-d46f87a1.js');
+const locale$1 = require('./locale-7c3cc149.js');
+const focusTrapComponent = require('./focusTrapComponent-7a217706.js');
+const t9n = require('./t9n-8444b9f7.js');
 
 const maxTenthForMinuteAndSecond = 5;
 function createLocaleDateTimeFormatter(locale, numberingSystem, includeSeconds = true) {
@@ -22,7 +22,7 @@ function createLocaleDateTimeFormatter(locale, numberingSystem, includeSeconds =
     hour: "2-digit",
     minute: "2-digit",
     timeZone: "UTC",
-    numberingSystem: locale$1.getSupportedNumberingSystem(numberingSystem)
+    numberingSystem: locale$1.getSupportedNumberingSystem(numberingSystem),
   };
   if (includeSeconds) {
     options.second = "2-digit";
@@ -128,7 +128,7 @@ function localizeTimePart({ value, part, locale, numberingSystem }) {
   const parts = formatter.formatToParts(date);
   return getLocalizedTimePart(part, parts);
 }
-function localizeTimeString({ value, locale, numberingSystem, includeSeconds = true }) {
+function localizeTimeString({ value, locale, numberingSystem, includeSeconds = true, }) {
   if (!isValidTime(value)) {
     return null;
   }
@@ -137,7 +137,7 @@ function localizeTimeString({ value, locale, numberingSystem, includeSeconds = t
   const formatter = createLocaleDateTimeFormatter(locale, numberingSystem, includeSeconds);
   return formatter?.format(dateFromTimeString) || null;
 }
-function localizeTimeStringToParts({ value, locale, numberingSystem }) {
+function localizeTimeStringToParts({ value, locale, numberingSystem, }) {
   if (!isValidTime(value)) {
     return null;
   }
@@ -153,7 +153,7 @@ function localizeTimeStringToParts({ value, locale, numberingSystem }) {
       localizedMinuteSuffix: getLocalizedTimePart("minuteSuffix", parts),
       localizedSecond: getLocalizedTimePart("second", parts),
       localizedSecondSuffix: getLocalizedTimePart("secondSuffix", parts),
-      localizedMeridiem: getLocalizedTimePart("meridiem", parts)
+      localizedMeridiem: getLocalizedTimePart("meridiem", parts),
     };
   }
   return null;
@@ -177,13 +177,13 @@ function parseTimeString(value) {
     return {
       hour,
       minute,
-      second
+      second,
     };
   }
   return {
     hour: null,
     minute: null,
-    second: null
+    second: null,
   };
 }
 function toISOTimeString(value, includeSeconds = true) {
@@ -199,7 +199,7 @@ function toISOTimeString(value, includeSeconds = true) {
 }
 
 const CSS$1 = {
-  toggleIcon: "toggle-icon"
+  toggleIcon: "toggle-icon",
 };
 
 var SECONDS_A_MINUTE = 60;
@@ -618,35 +618,86 @@ var Dayjs = /*#__PURE__*/function () {
       return isLowercase ? m.toLowerCase() : m;
     };
 
-    var matches = {
-      YY: String(this.$y).slice(-2),
-      YYYY: Utils.s(this.$y, 4, '0'),
-      M: $M + 1,
-      MM: Utils.s($M + 1, 2, '0'),
-      MMM: getShort(locale.monthsShort, $M, months, 3),
-      MMMM: getShort(months, $M),
-      D: this.$D,
-      DD: Utils.s(this.$D, 2, '0'),
-      d: String(this.$W),
-      dd: getShort(locale.weekdaysMin, this.$W, weekdays, 2),
-      ddd: getShort(locale.weekdaysShort, this.$W, weekdays, 3),
-      dddd: weekdays[this.$W],
-      H: String($H),
-      HH: Utils.s($H, 2, '0'),
-      h: get$H(1),
-      hh: get$H(2),
-      a: meridiemFunc($H, $m, true),
-      A: meridiemFunc($H, $m, false),
-      m: String($m),
-      mm: Utils.s($m, 2, '0'),
-      s: String(this.$s),
-      ss: Utils.s(this.$s, 2, '0'),
-      SSS: Utils.s(this.$ms, 3, '0'),
-      Z: zoneStr // 'ZZ' logic below
+    var matches = function matches(match) {
+      switch (match) {
+        case 'YY':
+          return String(_this3.$y).slice(-2);
 
+        case 'YYYY':
+          return Utils.s(_this3.$y, 4, '0');
+
+        case 'M':
+          return $M + 1;
+
+        case 'MM':
+          return Utils.s($M + 1, 2, '0');
+
+        case 'MMM':
+          return getShort(locale.monthsShort, $M, months, 3);
+
+        case 'MMMM':
+          return getShort(months, $M);
+
+        case 'D':
+          return _this3.$D;
+
+        case 'DD':
+          return Utils.s(_this3.$D, 2, '0');
+
+        case 'd':
+          return String(_this3.$W);
+
+        case 'dd':
+          return getShort(locale.weekdaysMin, _this3.$W, weekdays, 2);
+
+        case 'ddd':
+          return getShort(locale.weekdaysShort, _this3.$W, weekdays, 3);
+
+        case 'dddd':
+          return weekdays[_this3.$W];
+
+        case 'H':
+          return String($H);
+
+        case 'HH':
+          return Utils.s($H, 2, '0');
+
+        case 'h':
+          return get$H(1);
+
+        case 'hh':
+          return get$H(2);
+
+        case 'a':
+          return meridiemFunc($H, $m, true);
+
+        case 'A':
+          return meridiemFunc($H, $m, false);
+
+        case 'm':
+          return String($m);
+
+        case 'mm':
+          return Utils.s($m, 2, '0');
+
+        case 's':
+          return String(_this3.$s);
+
+        case 'ss':
+          return Utils.s(_this3.$s, 2, '0');
+
+        case 'SSS':
+          return Utils.s(_this3.$ms, 3, '0');
+
+        case 'Z':
+          return zoneStr;
+      }
+
+      return null;
     };
+
     return str.replace(REGEX_FORMAT, function (match, $1) {
-      return $1 || matches[match] || zoneStr.replace(':', '');
+      return $1 || matches(match) || zoneStr.replace(':', '');
     }); // 'ZZ'
   };
 
@@ -657,14 +708,57 @@ var Dayjs = /*#__PURE__*/function () {
   };
 
   _proto.diff = function diff(input, units, _float) {
-    var _C$Y$C$M$C$Q$C$W$C$D$;
+    var _this4 = this;
 
     var unit = Utils.p(units);
     var that = dayjs(input);
     var zoneDelta = (that.utcOffset() - this.utcOffset()) * MILLISECONDS_A_MINUTE;
     var diff = this - that;
-    var result = Utils.m(this, that);
-    result = (_C$Y$C$M$C$Q$C$W$C$D$ = {}, _C$Y$C$M$C$Q$C$W$C$D$[Y] = result / 12, _C$Y$C$M$C$Q$C$W$C$D$[M] = result, _C$Y$C$M$C$Q$C$W$C$D$[Q] = result / 3, _C$Y$C$M$C$Q$C$W$C$D$[W] = (diff - zoneDelta) / MILLISECONDS_A_WEEK, _C$Y$C$M$C$Q$C$W$C$D$[D] = (diff - zoneDelta) / MILLISECONDS_A_DAY, _C$Y$C$M$C$Q$C$W$C$D$[H] = diff / MILLISECONDS_A_HOUR, _C$Y$C$M$C$Q$C$W$C$D$[MIN] = diff / MILLISECONDS_A_MINUTE, _C$Y$C$M$C$Q$C$W$C$D$[S] = diff / MILLISECONDS_A_SECOND, _C$Y$C$M$C$Q$C$W$C$D$)[unit] || diff; // milliseconds
+
+    var getMonth = function getMonth() {
+      return Utils.m(_this4, that);
+    };
+
+    var result;
+
+    switch (unit) {
+      case Y:
+        result = getMonth() / 12;
+        break;
+
+      case M:
+        result = getMonth();
+        break;
+
+      case Q:
+        result = getMonth() / 3;
+        break;
+
+      case W:
+        result = (diff - zoneDelta) / MILLISECONDS_A_WEEK;
+        break;
+
+      case D:
+        result = (diff - zoneDelta) / MILLISECONDS_A_DAY;
+        break;
+
+      case H:
+        result = diff / MILLISECONDS_A_HOUR;
+        break;
+
+      case MIN:
+        result = diff / MILLISECONDS_A_MINUTE;
+        break;
+
+      case S:
+        result = diff / MILLISECONDS_A_SECOND;
+        break;
+
+      default:
+        result = diff; // milliseconds
+
+        break;
+    }
 
     return _float ? result : Utils.a(result);
   };
@@ -1269,60 +1363,60 @@ const updateLocale = (function (option, Dayjs, dayjs) {
   };
 });
 
-const inputTimePickerCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-right{0%{opacity:0;transform:translate3D(-5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-left{0%{opacity:0;transform:translate3D(5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-right{animation-name:in-right}.calcite-animate__in-left{animation-name:in-left}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing);--calcite-floating-ui-z-index:var(--calcite-app-z-index-dropdown)}:host([hidden]){display:none}:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline-block;-webkit-user-select:none;user-select:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}::slotted(input[slot=hidden-form-input]){margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}:host([scale=s]){--calcite-toggle-spacing:0.5rem}:host([scale=m]){--calcite-toggle-spacing:0.75rem}:host([scale=l]){--calcite-toggle-spacing:1rem}.input-wrapper{position:relative}.toggle-icon{position:absolute;display:flex;inline-size:1rem;cursor:pointer;align-items:center;inset-inline-end:0;inset-block:0;padding-inline:var(--calcite-toggle-spacing)}";
+const inputTimePickerCss = ":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline-block;-webkit-user-select:none;user-select:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}::slotted(input[slot=hidden-form-input]){margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}:host([scale=s]){--calcite-toggle-spacing:0.5rem}:host([scale=m]){--calcite-toggle-spacing:0.75rem}:host([scale=l]){--calcite-toggle-spacing:1rem}.input-wrapper{position:relative}.toggle-icon{position:absolute;display:flex;inline-size:1rem;cursor:pointer;align-items:center;inset-inline-end:0;inset-block:0;padding-inline:var(--calcite-toggle-spacing)}:host([hidden]){display:none}[hidden]{display:none}";
 
 // some bundlers (e.g., Webpack) need dynamic import paths to be static
 const supportedDayJsLocaleToLocaleConfigImport = new Map([
-  ["ar", () => Promise.resolve().then(function () { return require('./ar-7e78d33e.js'); })],
-  ["bg", () => Promise.resolve().then(function () { return require('./bg-df697dd0.js'); })],
-  ["bs", () => Promise.resolve().then(function () { return require('./bs-02eb9175.js'); })],
-  ["ca", () => Promise.resolve().then(function () { return require('./ca-7ba7eafb.js'); })],
-  ["cs", () => Promise.resolve().then(function () { return require('./cs-c1874622.js'); })],
-  ["da", () => Promise.resolve().then(function () { return require('./da-9ca790a2.js'); })],
-  ["de", () => Promise.resolve().then(function () { return require('./de-92a527ae.js'); })],
-  ["de-at", () => Promise.resolve().then(function () { return require('./de-at-760d3fc7.js'); })],
-  ["de-ch", () => Promise.resolve().then(function () { return require('./de-ch-1ff4fef7.js'); })],
-  ["el", () => Promise.resolve().then(function () { return require('./el-ab386519.js'); })],
+  ["ar", () => Promise.resolve().then(function () { return require('./ar-feb9ceca.js'); })],
+  ["bg", () => Promise.resolve().then(function () { return require('./bg-f89dfdac.js'); })],
+  ["bs", () => Promise.resolve().then(function () { return require('./bs-4b71f72f.js'); })],
+  ["ca", () => Promise.resolve().then(function () { return require('./ca-45d0ed0c.js'); })],
+  ["cs", () => Promise.resolve().then(function () { return require('./cs-4b7798bd.js'); })],
+  ["da", () => Promise.resolve().then(function () { return require('./da-2466c137.js'); })],
+  ["de", () => Promise.resolve().then(function () { return require('./de-4a4549ff.js'); })],
+  ["de-at", () => Promise.resolve().then(function () { return require('./de-at-70b170c7.js'); })],
+  ["de-ch", () => Promise.resolve().then(function () { return require('./de-ch-a6327ea6.js'); })],
+  ["el", () => Promise.resolve().then(function () { return require('./el-8560472c.js'); })],
   ["en", () => Promise.resolve().then(function () { return en$1; })],
-  ["en-au", () => Promise.resolve().then(function () { return require('./en-au-b8d52933.js'); })],
-  ["en-ca", () => Promise.resolve().then(function () { return require('./en-ca-6f339158.js'); })],
-  ["en-gb", () => Promise.resolve().then(function () { return require('./en-gb-31653a40.js'); })],
-  ["es", () => Promise.resolve().then(function () { return require('./es-d38694fc.js'); })],
-  ["es-mx", () => Promise.resolve().then(function () { return require('./es-mx-13420c4f.js'); })],
-  ["et", () => Promise.resolve().then(function () { return require('./et-36d50eaf.js'); })],
-  ["fi", () => Promise.resolve().then(function () { return require('./fi-c93eac67.js'); })],
-  ["fr", () => Promise.resolve().then(function () { return require('./fr-15ca0afe.js'); })],
-  ["fr-ch", () => Promise.resolve().then(function () { return require('./fr-ch-75339188.js'); })],
-  ["he", () => Promise.resolve().then(function () { return require('./he-4b886d69.js'); })],
-  ["hi", () => Promise.resolve().then(function () { return require('./hi-367e7017.js'); })],
-  ["hr", () => Promise.resolve().then(function () { return require('./hr-cb78cf66.js'); })],
-  ["hu", () => Promise.resolve().then(function () { return require('./hu-074973f8.js'); })],
-  ["id", () => Promise.resolve().then(function () { return require('./id-47e8ec09.js'); })],
-  ["it", () => Promise.resolve().then(function () { return require('./it-55b2f4cb.js'); })],
-  ["it-ch", () => Promise.resolve().then(function () { return require('./it-ch-a25a2eb6.js'); })],
-  ["ja", () => Promise.resolve().then(function () { return require('./ja-62020a28.js'); })],
-  ["ko", () => Promise.resolve().then(function () { return require('./ko-69314e76.js'); })],
-  ["lt", () => Promise.resolve().then(function () { return require('./lt-1ef5383f.js'); })],
-  ["lv", () => Promise.resolve().then(function () { return require('./lv-d0dd57a7.js'); })],
-  ["mk", () => Promise.resolve().then(function () { return require('./mk-8f11e431.js'); })],
-  ["nl", () => Promise.resolve().then(function () { return require('./nl-f68555b2.js'); })],
-  ["nb", () => Promise.resolve().then(function () { return require('./nb-be781d44.js'); })],
-  ["pl", () => Promise.resolve().then(function () { return require('./pl-8463c686.js'); })],
-  ["pt", () => Promise.resolve().then(function () { return require('./pt-2250b710.js'); })],
-  ["pt-br", () => Promise.resolve().then(function () { return require('./pt-br-b84950ee.js'); })],
-  ["ro", () => Promise.resolve().then(function () { return require('./ro-f40403e0.js'); })],
-  ["ru", () => Promise.resolve().then(function () { return require('./ru-1b5bf9bb.js'); })],
-  ["sk", () => Promise.resolve().then(function () { return require('./sk-668e91a0.js'); })],
-  ["sl", () => Promise.resolve().then(function () { return require('./sl-49e52723.js'); })],
-  ["sr", () => Promise.resolve().then(function () { return require('./sr-8a035670.js'); })],
-  ["sv", () => Promise.resolve().then(function () { return require('./sv-fc96980c.js'); })],
-  ["th", () => Promise.resolve().then(function () { return require('./th-ae782acc.js'); })],
-  ["tr", () => Promise.resolve().then(function () { return require('./tr-06f2b321.js'); })],
-  ["uk", () => Promise.resolve().then(function () { return require('./uk-0d38824b.js'); })],
-  ["vi", () => Promise.resolve().then(function () { return require('./vi-625546e3.js'); })],
-  ["zh-cn", () => Promise.resolve().then(function () { return require('./zh-cn-4de5506d.js'); })],
-  ["zh-hk", () => Promise.resolve().then(function () { return require('./zh-hk-a02659db.js'); })],
-  ["zh-tw", () => Promise.resolve().then(function () { return require('./zh-tw-24095026.js'); })]
+  ["en-au", () => Promise.resolve().then(function () { return require('./en-au-d9fa0446.js'); })],
+  ["en-ca", () => Promise.resolve().then(function () { return require('./en-ca-7591f85e.js'); })],
+  ["en-gb", () => Promise.resolve().then(function () { return require('./en-gb-5e40fe51.js'); })],
+  ["es", () => Promise.resolve().then(function () { return require('./es-8a460492.js'); })],
+  ["es-mx", () => Promise.resolve().then(function () { return require('./es-mx-ae6f2d54.js'); })],
+  ["et", () => Promise.resolve().then(function () { return require('./et-78274162.js'); })],
+  ["fi", () => Promise.resolve().then(function () { return require('./fi-61aad834.js'); })],
+  ["fr", () => Promise.resolve().then(function () { return require('./fr-77009092.js'); })],
+  ["fr-ch", () => Promise.resolve().then(function () { return require('./fr-ch-5d01f51d.js'); })],
+  ["he", () => Promise.resolve().then(function () { return require('./he-7045f045.js'); })],
+  ["hi", () => Promise.resolve().then(function () { return require('./hi-074ec003.js'); })],
+  ["hr", () => Promise.resolve().then(function () { return require('./hr-669decd6.js'); })],
+  ["hu", () => Promise.resolve().then(function () { return require('./hu-134015d1.js'); })],
+  ["id", () => Promise.resolve().then(function () { return require('./id-03937715.js'); })],
+  ["it", () => Promise.resolve().then(function () { return require('./it-adbd27d2.js'); })],
+  ["it-ch", () => Promise.resolve().then(function () { return require('./it-ch-25c9e1e8.js'); })],
+  ["ja", () => Promise.resolve().then(function () { return require('./ja-8ea54597.js'); })],
+  ["ko", () => Promise.resolve().then(function () { return require('./ko-788d1284.js'); })],
+  ["lt", () => Promise.resolve().then(function () { return require('./lt-67f272cf.js'); })],
+  ["lv", () => Promise.resolve().then(function () { return require('./lv-607d835c.js'); })],
+  ["mk", () => Promise.resolve().then(function () { return require('./mk-6c281ecb.js'); })],
+  ["nl", () => Promise.resolve().then(function () { return require('./nl-08ac2b61.js'); })],
+  ["nb", () => Promise.resolve().then(function () { return require('./nb-770d2ac4.js'); })],
+  ["pl", () => Promise.resolve().then(function () { return require('./pl-a49d052b.js'); })],
+  ["pt", () => Promise.resolve().then(function () { return require('./pt-64426b43.js'); })],
+  ["pt-br", () => Promise.resolve().then(function () { return require('./pt-br-cad4fd70.js'); })],
+  ["ro", () => Promise.resolve().then(function () { return require('./ro-2f98c827.js'); })],
+  ["ru", () => Promise.resolve().then(function () { return require('./ru-23622748.js'); })],
+  ["sk", () => Promise.resolve().then(function () { return require('./sk-dfa9ba58.js'); })],
+  ["sl", () => Promise.resolve().then(function () { return require('./sl-8fb67a20.js'); })],
+  ["sr", () => Promise.resolve().then(function () { return require('./sr-515d97f2.js'); })],
+  ["sv", () => Promise.resolve().then(function () { return require('./sv-b977c7fd.js'); })],
+  ["th", () => Promise.resolve().then(function () { return require('./th-a3d3bf05.js'); })],
+  ["tr", () => Promise.resolve().then(function () { return require('./tr-38ef1b42.js'); })],
+  ["uk", () => Promise.resolve().then(function () { return require('./uk-e9946342.js'); })],
+  ["vi", () => Promise.resolve().then(function () { return require('./vi-cb142c0e.js'); })],
+  ["zh-cn", () => Promise.resolve().then(function () { return require('./zh-cn-ac74a6ba.js'); })],
+  ["zh-hk", () => Promise.resolve().then(function () { return require('./zh-hk-2c3476ce.js'); })],
+  ["zh-tw", () => Promise.resolve().then(function () { return require('./zh-tw-d30b8d31.js'); })],
 ]);
 dayjs.extend(customParseFormat);
 dayjs.extend(localeData);
@@ -1357,7 +1451,7 @@ const InputTimePicker = class {
         value: this.value,
         locale: this.effectiveLocale,
         numberingSystem: this.numberingSystem,
-        includeSeconds: this.shouldIncludeSeconds()
+        includeSeconds: this.shouldIncludeSeconds(),
       });
       if (localizedTimeString !== inputValue) {
         this.setInputValue(localizedTimeString);
@@ -1376,7 +1470,7 @@ const InputTimePicker = class {
         locale$1.numberStringFormatter.numberFormatOptions = {
           locale,
           numberingSystem,
-          useGrouping: false
+          useGrouping: false,
         };
         const valueInNumberingSystem = locale$1.numberStringFormatter
           .delocalize(target.value)
@@ -1398,7 +1492,7 @@ const InputTimePicker = class {
         value,
         locale: this.effectiveLocale,
         numberingSystem: this.numberingSystem,
-        includeSeconds
+        includeSeconds,
       }));
     };
     this.popoverCloseHandler = () => {
@@ -1406,7 +1500,7 @@ const InputTimePicker = class {
         onDeactivate: () => {
           this.calciteInputEl.setFocus();
           this.focusOnOpen = false;
-        }
+        },
       });
     };
     this.popoverOpenHandler = () => {
@@ -1416,7 +1510,7 @@ const InputTimePicker = class {
             this.calciteTimePickerEl.setFocus();
             this.focusOnOpen = false;
           }
-        }
+        },
       });
     };
     this.keyDownHandler = (event) => {
@@ -1438,7 +1532,7 @@ const InputTimePicker = class {
           value: this.value,
           locale: this.effectiveLocale,
           numberingSystem: this.numberingSystem,
-          includeSeconds: this.shouldIncludeSeconds()
+          includeSeconds: this.shouldIncludeSeconds(),
         });
         if (newValue && this.calciteInputEl.value !== localizedTimeString) {
           this.setInputValue(localizedTimeString);
@@ -1467,8 +1561,8 @@ const InputTimePicker = class {
         focusTrapEl: el,
         focusTrapOptions: {
           initialFocus: false,
-          setReturnFocus: false
-        }
+          setReturnFocus: false,
+        },
       });
     };
     this.setInputValue = (newInputValue) => {
@@ -1499,7 +1593,7 @@ const InputTimePicker = class {
           value: oldValue,
           locale: this.effectiveLocale,
           numberingSystem: this.numberingSystem,
-          includeSeconds: this.shouldIncludeSeconds()
+          includeSeconds: this.shouldIncludeSeconds(),
         }));
       }
     };
@@ -1517,7 +1611,7 @@ const InputTimePicker = class {
           value: this.value,
           includeSeconds,
           locale: this.effectiveLocale,
-          numberingSystem: this.numberingSystem
+          numberingSystem: this.numberingSystem,
         })
         : "");
     };
@@ -1573,7 +1667,7 @@ const InputTimePicker = class {
       value: this.value,
       locale: this.effectiveLocale,
       numberingSystem,
-      includeSeconds: this.shouldIncludeSeconds()
+      includeSeconds: this.shouldIncludeSeconds(),
     }));
   }
   stepWatcher(newStep, oldStep) {
@@ -1594,7 +1688,7 @@ const InputTimePicker = class {
       value: this.value,
       locale,
       numberingSystem: this.numberingSystem,
-      includeSeconds: this.shouldIncludeSeconds()
+      includeSeconds: this.shouldIncludeSeconds(),
     }));
   }
   // --------------------------------------------------------------------------
@@ -1604,7 +1698,7 @@ const InputTimePicker = class {
   // --------------------------------------------------------------------------
   /** Sets focus on the component. */
   async setFocus() {
-    await loadable.componentLoaded(this);
+    await loadable.componentFocusable(this);
     this.el.focus();
   }
   /**
@@ -1655,23 +1749,23 @@ const InputTimePicker = class {
           L: "DD/MM/YYYY",
           LL: "D MMMM YYYY",
           LLL: "D MMMM YYYY HH:mm A",
-          LLLL: "dddd D MMMM YYYY HH:mm A"
-        }
+          LLLL: "dddd D MMMM YYYY HH:mm A",
+        },
       };
     }
     if (locale === "en-au") {
       return {
-        meridiem: (hour) => (hour > 12 ? "pm" : "am")
+        meridiem: (hour) => (hour > 12 ? "pm" : "am"),
       };
     }
     if (locale === "en-ca") {
       return {
-        meridiem: (hour) => (hour > 12 ? "p.m." : "a.m.")
+        meridiem: (hour) => (hour > 12 ? "p.m." : "a.m."),
       };
     }
     if (locale === "el") {
       return {
-        meridiem: (hour) => (hour > 12 ? "μ.μ." : "π.μ.")
+        meridiem: (hour) => (hour > 12 ? "μ.μ." : "π.μ."),
       };
     }
     if (locale === "hi") {
@@ -1682,31 +1776,31 @@ const InputTimePicker = class {
           L: "DD/MM/YYYY",
           LL: "D MMMM YYYY",
           LLL: "D MMMM YYYY, h:mm A",
-          LLLL: "dddd, D MMMM YYYY, h:mm A"
+          LLLL: "dddd, D MMMM YYYY, h:mm A",
         },
-        meridiem: (hour) => (hour > 12 ? "pm" : "am")
+        meridiem: (hour) => (hour > 12 ? "pm" : "am"),
       };
     }
     if (locale === "ko") {
       return {
-        meridiem: (hour) => (hour > 12 ? "오후" : "오전")
+        meridiem: (hour) => (hour > 12 ? "오후" : "오전"),
       };
     }
     if (locale === "zh-tw") {
       return {
         formats: {
           LT: "AHH:mm",
-          LTS: "AHH:mm:ss"
-        }
+          LTS: "AHH:mm:ss",
+        },
       };
     }
     if (locale === "zh-hk") {
       return {
         formats: {
           LT: "AHH:mm",
-          LTS: "AHH:mm:ss"
+          LTS: "AHH:mm:ss",
         },
-        meridiem: (hour) => (hour > 12 ? "下午" : "上午")
+        meridiem: (hour) => (hour > 12 ? "下午" : "上午"),
       };
     }
   }
@@ -1745,7 +1839,7 @@ const InputTimePicker = class {
         value: this.value,
         locale: this.effectiveLocale,
         numberingSystem: this.numberingSystem,
-        includeSeconds: this.shouldIncludeSeconds()
+        includeSeconds: this.shouldIncludeSeconds(),
       }));
     }
   }
@@ -1822,10 +1916,10 @@ const CSS = {
   "scale-m": "scale-m",
   "scale-l": "scale-l",
   timePicker: "time-picker",
-  meridiemStart: "meridiem--start"
+  meridiemStart: "meridiem--start",
 };
 
-const timePickerCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-right{0%{opacity:0;transform:translate3D(-5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-left{0%{opacity:0;transform:translate3D(5px, 0, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-right{animation-name:in-right}.calcite-animate__in-left{animation-name:in-left}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing);--calcite-floating-ui-z-index:var(--calcite-app-z-index-dropdown)}:host([hidden]){display:none}:host{display:inline-block}.time-picker{display:flex;-webkit-user-select:none;user-select:none;align-items:center;background-color:var(--calcite-ui-foreground-1);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);--tw-shadow:0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 6px 20px -4px var(--tw-shadow-color), 0 4px 12px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);border-radius:var(--calcite-border-radius)}.time-picker .column{display:flex;flex-direction:column}.time-picker .meridiem--start{order:-1}.time-picker .button{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;background-color:var(--calcite-ui-foreground-1)}.time-picker .button:hover,.time-picker .button:focus{background-color:var(--calcite-ui-foreground-2);outline:2px solid transparent;outline-offset:2px;z-index:var(--calcite-app-z-index-header);outline-offset:0}.time-picker .button:active{background-color:var(--calcite-ui-foreground-3)}.time-picker .button.top-left{border-start-start-radius:var(--calcite-border-radius)}.time-picker .button.bottom-left{border-end-start-radius:var(--calcite-border-radius)}.time-picker .button.top-right{border-start-end-radius:var(--calcite-border-radius)}.time-picker .button.bottom-right{border-end-end-radius:var(--calcite-border-radius)}.time-picker .button calcite-icon{color:var(--calcite-ui-text-3)}.time-picker .input{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;background-color:var(--calcite-ui-foreground-1);font-weight:var(--calcite-font-weight-medium)}.time-picker .input:hover{box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-2);z-index:var(--calcite-app-z-index-header)}.time-picker .input:focus,.time-picker .input:hover:focus{outline:2px solid transparent;outline-offset:2px;box-shadow:inset 0 0 0 2px var(--calcite-ui-brand);z-index:var(--calcite-app-z-index-header);outline-offset:0}.time-picker.scale-s{font-size:var(--calcite-font-size--1)}.time-picker.scale-s .button,.time-picker.scale-s .input{padding-inline:0.75rem;padding-block:0.25rem}.time-picker.scale-s:not(.show-meridiem) .delimiter:last-child{padding-inline-end:0.75rem}.time-picker.scale-m{font-size:var(--calcite-font-size-0)}.time-picker.scale-m .button,.time-picker.scale-m .input{padding-inline:1rem;padding-block:0.5rem}.time-picker.scale-m:not(.show-meridiem) .delimiter:last-child{padding-inline-end:1rem}.time-picker.scale-l{font-size:var(--calcite-font-size-1)}.time-picker.scale-l .button,.time-picker.scale-l .input{padding-inline:1.25rem;padding-block:0.75rem}.time-picker.scale-l:not(.show-meridiem) .delimiter:last-child{padding-inline-end:1.25rem}";
+const timePickerCss = ":host{display:inline-block}.time-picker{display:flex;-webkit-user-select:none;user-select:none;align-items:center;background-color:var(--calcite-ui-foreground-1);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);--tw-shadow:0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);--tw-shadow-colored:0 6px 20px -4px var(--tw-shadow-color), 0 4px 12px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);border-radius:var(--calcite-border-radius)}.time-picker .column{display:flex;flex-direction:column}.time-picker .meridiem--start{order:-1}.time-picker .button{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;background-color:var(--calcite-ui-foreground-1)}.time-picker .button:hover,.time-picker .button:focus{background-color:var(--calcite-ui-foreground-2);outline:2px solid transparent;outline-offset:2px;z-index:var(--calcite-app-z-index-header);outline-offset:0}.time-picker .button:active{background-color:var(--calcite-ui-foreground-3)}.time-picker .button.top-left{border-start-start-radius:var(--calcite-border-radius)}.time-picker .button.bottom-left{border-end-start-radius:var(--calcite-border-radius)}.time-picker .button.top-right{border-start-end-radius:var(--calcite-border-radius)}.time-picker .button.bottom-right{border-end-end-radius:var(--calcite-border-radius)}.time-picker .button calcite-icon{color:var(--calcite-ui-text-3)}.time-picker .input{display:inline-flex;cursor:pointer;align-items:center;justify-content:center;background-color:var(--calcite-ui-foreground-1);font-weight:var(--calcite-font-weight-medium)}.time-picker .input:hover{box-shadow:inset 0 0 0 2px var(--calcite-ui-foreground-2);z-index:var(--calcite-app-z-index-header)}.time-picker .input:focus,.time-picker .input:hover:focus{outline:2px solid transparent;outline-offset:2px;box-shadow:inset 0 0 0 2px var(--calcite-ui-brand);z-index:var(--calcite-app-z-index-header);outline-offset:0}.time-picker.scale-s{font-size:var(--calcite-font-size--1)}.time-picker.scale-s .button,.time-picker.scale-s .input{padding-inline:0.75rem;padding-block:0.25rem}.time-picker.scale-s:not(.show-meridiem) .delimiter:last-child{padding-inline-end:0.75rem}.time-picker.scale-m{font-size:var(--calcite-font-size-0)}.time-picker.scale-m .button,.time-picker.scale-m .input{padding-inline:1rem;padding-block:0.5rem}.time-picker.scale-m:not(.show-meridiem) .delimiter:last-child{padding-inline-end:1rem}.time-picker.scale-l{font-size:var(--calcite-font-size-1)}.time-picker.scale-l .button,.time-picker.scale-l .input{padding-inline:1.25rem;padding-block:0.75rem}.time-picker.scale-l:not(.show-meridiem) .delimiter:last-child{padding-inline-end:1.25rem}:host([hidden]){display:none}[hidden]{display:none}";
 
 function capitalize(str) {
   return str.charAt(0).toUpperCase() + str.slice(1);
@@ -2088,7 +2182,7 @@ const TimePicker = class {
       if (isValidTime(value)) {
         const { hour, minute, second } = parseTimeString(value);
         const { effectiveLocale: locale, numberingSystem } = this;
-        const { localizedHour, localizedHourSuffix, localizedMinute, localizedMinuteSuffix, localizedSecond, localizedSecondSuffix, localizedMeridiem } = localizeTimeStringToParts({ value, locale, numberingSystem });
+        const { localizedHour, localizedHourSuffix, localizedMinute, localizedMinuteSuffix, localizedSecond, localizedSecondSuffix, localizedMeridiem, } = localizeTimeStringToParts({ value, locale, numberingSystem });
         this.localizedHour = localizedHour;
         this.localizedHourSuffix = localizedHourSuffix;
         this.localizedMinute = localizedMinute;
@@ -2145,7 +2239,7 @@ const TimePicker = class {
             value: this.hour,
             part: "hour",
             locale,
-            numberingSystem
+            numberingSystem,
           });
         }
       }
@@ -2155,7 +2249,7 @@ const TimePicker = class {
           value: this[key],
           part: key,
           locale,
-          numberingSystem
+          numberingSystem,
         });
       }
       if (this.hour && this.minute) {
@@ -2290,7 +2384,7 @@ const TimePicker = class {
    * Sets focus on the component's first focusable element.
    */
   async setFocus() {
-    await loadable.componentLoaded(this);
+    await loadable.componentFocusable(this);
     this.el?.focus();
   }
   // --------------------------------------------------------------------------
@@ -2302,7 +2396,7 @@ const TimePicker = class {
     this.showSecond = this.step < 60;
   }
   async focusPart(target) {
-    await loadable.componentLoaded(this);
+    await loadable.componentFocusable(this);
     this[`${target || "hour"}El`]?.focus();
   }
   buttonActivated(event) {
@@ -2341,7 +2435,7 @@ const TimePicker = class {
     this.meridiemOrder = this.getMeridiemOrder(getTimeParts({
       value: "0:00:00",
       locale: this.effectiveLocale,
-      numberingSystem: this.numberingSystem
+      numberingSystem: this.numberingSystem,
     }));
   }
   async componentWillLoad() {
@@ -2370,58 +2464,58 @@ const TimePicker = class {
         [CSS.timePicker]: true,
         [CSS.showMeridiem]: showMeridiem,
         [CSS.showSecond]: this.showSecond,
-        [CSS[`scale-${this.scale}`]]: true
+        [CSS[`scale-${this.scale}`]]: true,
       }, dir: "ltr" }, index.h("div", { class: CSS.column, role: "group" }, index.h("span", { "aria-label": this.messages.hourUp, class: {
         [CSS.button]: true,
         [CSS.buttonHourUp]: true,
-        [CSS.buttonTopLeft]: true
+        [CSS.buttonTopLeft]: true,
       }, onClick: this.incrementHour, onKeyDown: this.hourUpButtonKeyDownHandler, role: "button" }, index.h("calcite-icon", { icon: "chevron-up", scale: iconScale })), index.h("span", { "aria-label": this.messages.hour, "aria-valuemax": "23", "aria-valuemin": "1", "aria-valuenow": (hourIsNumber && parseInt(this.hour)) || "0", "aria-valuetext": this.hour, class: {
         [CSS.input]: true,
-        [CSS.hour]: true
+        [CSS.hour]: true,
       }, onFocus: this.focusHandler, onKeyDown: this.hourKeyDownHandler, role: "spinbutton", tabIndex: 0,
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setHourEl }, this.localizedHour || "--"), index.h("span", { "aria-label": this.messages.hourDown, class: {
         [CSS.button]: true,
         [CSS.buttonHourDown]: true,
-        [CSS.buttonBottomLeft]: true
+        [CSS.buttonBottomLeft]: true,
       }, onClick: this.decrementHour, onKeyDown: this.hourDownButtonKeyDownHandler, role: "button" }, index.h("calcite-icon", { icon: "chevron-down", scale: iconScale }))), index.h("span", { class: CSS.delimiter }, this.localizedHourSuffix), index.h("div", { class: CSS.column, role: "group" }, index.h("span", { "aria-label": this.messages.minuteUp, class: {
         [CSS.button]: true,
-        [CSS.buttonMinuteUp]: true
+        [CSS.buttonMinuteUp]: true,
       }, onClick: this.incrementMinute, onKeyDown: this.minuteUpButtonKeyDownHandler, role: "button", tabIndex: -1 }, index.h("calcite-icon", { icon: "chevron-up", scale: iconScale })), index.h("span", { "aria-label": this.messages.minute, "aria-valuemax": "12", "aria-valuemin": "1", "aria-valuenow": (minuteIsNumber && parseInt(this.minute)) || "0", "aria-valuetext": this.minute, class: {
         [CSS.input]: true,
-        [CSS.minute]: true
+        [CSS.minute]: true,
       }, onFocus: this.focusHandler, onKeyDown: this.minuteKeyDownHandler, role: "spinbutton", tabIndex: 0,
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setMinuteEl }, this.localizedMinute || "--"), index.h("span", { "aria-label": this.messages.minuteDown, class: {
         [CSS.button]: true,
-        [CSS.buttonMinuteDown]: true
+        [CSS.buttonMinuteDown]: true,
       }, onClick: this.decrementMinute, onKeyDown: this.minuteDownButtonKeyDownHandler, role: "button" }, index.h("calcite-icon", { icon: "chevron-down", scale: iconScale }))), this.showSecond && index.h("span", { class: CSS.delimiter }, this.localizedMinuteSuffix), this.showSecond && (index.h("div", { class: CSS.column, role: "group" }, index.h("span", { "aria-label": this.messages.secondUp, class: {
         [CSS.button]: true,
-        [CSS.buttonSecondUp]: true
+        [CSS.buttonSecondUp]: true,
       }, onClick: this.incrementSecond, onKeyDown: this.secondUpButtonKeyDownHandler, role: "button" }, index.h("calcite-icon", { icon: "chevron-up", scale: iconScale })), index.h("span", { "aria-label": this.messages.second, "aria-valuemax": "59", "aria-valuemin": "0", "aria-valuenow": (secondIsNumber && parseInt(this.second)) || "0", "aria-valuetext": this.second, class: {
         [CSS.input]: true,
-        [CSS.second]: true
+        [CSS.second]: true,
       }, onFocus: this.focusHandler, onKeyDown: this.secondKeyDownHandler, role: "spinbutton", tabIndex: 0,
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setSecondEl }, this.localizedSecond || "--"), index.h("span", { "aria-label": this.messages.secondDown, class: {
         [CSS.button]: true,
-        [CSS.buttonSecondDown]: true
+        [CSS.buttonSecondDown]: true,
       }, onClick: this.decrementSecond, onKeyDown: this.secondDownButtonKeyDownHandler, role: "button" }, index.h("calcite-icon", { icon: "chevron-down", scale: iconScale })))), this.localizedSecondSuffix && (index.h("span", { class: CSS.delimiter }, this.localizedSecondSuffix)), showMeridiem && (index.h("div", { class: {
         [CSS.column]: true,
-        [CSS.meridiemStart]: this.meridiemOrder === 0
+        [CSS.meridiemStart]: this.meridiemOrder === 0,
       }, role: "group" }, index.h("span", { "aria-label": this.messages.meridiemUp, class: {
         [CSS.button]: true,
         [CSS.buttonMeridiemUp]: true,
-        [CSS.buttonTopRight]: true
+        [CSS.buttonTopRight]: true,
       }, onClick: this.incrementMeridiem, onKeyDown: this.meridiemUpButtonKeyDownHandler, role: "button" }, index.h("calcite-icon", { icon: "chevron-up", scale: iconScale })), index.h("span", { "aria-label": this.messages.meridiem, "aria-valuemax": "2", "aria-valuemin": "1", "aria-valuenow": (this.meridiem === "PM" && "2") || "1", "aria-valuetext": this.meridiem, class: {
         [CSS.input]: true,
-        [CSS.meridiem]: true
+        [CSS.meridiem]: true,
       }, onFocus: this.focusHandler, onKeyDown: this.meridiemKeyDownHandler, role: "spinbutton", tabIndex: 0,
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setMeridiemEl }, this.localizedMeridiem || "--"), index.h("span", { "aria-label": this.messages.meridiemDown, class: {
         [CSS.button]: true,
         [CSS.buttonMeridiemDown]: true,
-        [CSS.buttonBottomRight]: true
+        [CSS.buttonBottomRight]: true,
       }, onClick: this.decrementMeridiem, onKeyDown: this.meridiemDownButtonKeyDownHandler, role: "button" }, index.h("calcite-icon", { icon: "chevron-down", scale: iconScale }))))));
   }
   static get delegatesFocus() { return true; }