@esri/calcite-components 1.3.0-next.12 → 1.3.0-next.13

package/dist/esm/calcite-filter.entry.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.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, F as Fragment, a as getElement } from './index-d726db8d.js';
-import { f as filter } from './filter-029dc842.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-23bc5e22.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-cc57c66f.js';
-import { u as updateMessages, s as setUpMessages, c as connectMessages, d as disconnectMessages } from './t9n-955f6ef8.js';
-import { d as debounce } from './debounce-2d701360.js';
-import './dom-9b9f8bc6.js';
-import './guid-9eeebd0c.js';
-import './resources-7680e255.js';
-import './key-d06349b5.js';
-import './observers-07d5c052.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment, a as getElement } from './index-49aca689.js';
+import { f as filter } from './filter-5ff357e4.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-07fadc27.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-a43dcb99.js';
+import { u as updateMessages, s as setUpMessages, c as connectMessages, d as disconnectMessages } from './t9n-e75a680f.js';
+import { d as debounce } from './debounce-fdbd181f.js';
+import './dom-00068eb7.js';
+import './guid-3b59c7f8.js';
+import './resources-68b088c8.js';
+import './key-23e88631.js';
+import './observers-1c1a0dc0.js';
 
 const CSS = {
   container: "container",

package/dist/esm/calcite-flow-item.entry.js

@@ -1,19 +1,19 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { b as getElementDir } from './dom-9b9f8bc6.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-23bc5e22.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-cc57c66f.js';
-import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-955f6ef8.js';
-import { S as SLOTS$1 } from './resources-1f0dc886.js';
-import './guid-9eeebd0c.js';
-import './resources-7680e255.js';
-import './key-d06349b5.js';
-import './observers-07d5c052.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-49aca689.js';
+import { b as getElementDir } from './dom-00068eb7.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-07fadc27.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-a43dcb99.js';
+import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-e75a680f.js';
+import { S as SLOTS$1 } from './resources-0132987d.js';
+import './guid-3b59c7f8.js';
+import './resources-68b088c8.js';
+import './key-23e88631.js';
+import './observers-1c1a0dc0.js';
 
 const CSS = {
   backButton: "back-button"

package/dist/esm/calcite-flow.entry.js

@@ -1,10 +1,10 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, h, a as getElement } from './index-d726db8d.js';
-import { c as createObserver } from './observers-07d5c052.js';
+import { r as registerInstance, h, a as getElement } from './index-49aca689.js';
+import { c as createObserver } from './observers-1c1a0dc0.js';
 
 const CSS = {
   frame: "frame",

package/dist/esm/calcite-graph_2.entry.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.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, h, a as getElement, f as forceUpdate, c as createEvent, H as Host } from './index-d726db8d.js';
-import { g as guid } from './guid-9eeebd0c.js';
-import { c as createObserver } from './observers-07d5c052.js';
-import { i as isPrimaryPointerButton, v as intersects } from './dom-9b9f8bc6.js';
-import { c as connectForm, d as disconnectForm, a as afterConnectDefaultValueSet, H as HiddenFormInputSlot } from './form-d983a411.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { i as isActivationKey } from './key-d06349b5.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c72fa5ad.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-23bc5e22.js';
-import { n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized } from './locale-cc57c66f.js';
-import { d as decimalPlaces, c as clamp } from './math-9c0aa43d.js';
-import './resources-7680e255.js';
+import { r as registerInstance, h, a as getElement, f as forceUpdate, c as createEvent, H as Host } from './index-49aca689.js';
+import { g as guid } from './guid-3b59c7f8.js';
+import { c as createObserver } from './observers-1c1a0dc0.js';
+import { i as isPrimaryPointerButton, v as intersects } from './dom-00068eb7.js';
+import { c as connectForm, d as disconnectForm, a as afterConnectDefaultValueSet, H as HiddenFormInputSlot } from './form-0304447d.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { i as isActivationKey } from './key-23e88631.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-2a42ea18.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-07fadc27.js';
+import { n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized } from './locale-a43dcb99.js';
+import { d as decimalPlaces, c as clamp } from './math-f792cdb4.js';
+import './resources-68b088c8.js';
 
 /**
  * Calculate slope of the tangents

package/dist/esm/calcite-handle.entry.js

@@ -1,17 +1,17 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-d726db8d.js';
-import { t as toAriaBoolean } from './dom-9b9f8bc6.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-23bc5e22.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-cc57c66f.js';
-import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-955f6ef8.js';
-import './guid-9eeebd0c.js';
-import './resources-7680e255.js';
-import './key-d06349b5.js';
-import './observers-07d5c052.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-49aca689.js';
+import { t as toAriaBoolean } from './dom-00068eb7.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-07fadc27.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-a43dcb99.js';
+import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-e75a680f.js';
+import './guid-3b59c7f8.js';
+import './resources-68b088c8.js';
+import './key-23e88631.js';
+import './observers-1c1a0dc0.js';
 
 const CSS = {
   handle: "handle",

package/dist/esm/calcite-icon.entry.js

@@ -1,13 +1,13 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.12
+ * v1.3.0-next.13
  */
-import { g as getAssetPath, r as registerInstance, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { b as getElementDir, t as toAriaBoolean } from './dom-9b9f8bc6.js';
-import { c as createObserver } from './observers-07d5c052.js';
-import './guid-9eeebd0c.js';
-import './resources-7680e255.js';
+import { g as getAssetPath, r as registerInstance, h, H as Host, a as getElement } from './index-49aca689.js';
+import { b as getElementDir, t as toAriaBoolean } from './dom-00068eb7.js';
+import { c as createObserver } from './observers-1c1a0dc0.js';
+import './guid-3b59c7f8.js';
+import './resources-68b088c8.js';
 
 const CSS = {
   icon: "icon",

package/dist/esm/calcite-inline-editable.entry.js

@@ -1,19 +1,19 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, a as getElement } from './index-d726db8d.js';
-import { g as getSlotted } from './dom-9b9f8bc6.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c72fa5ad.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-23bc5e22.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-cc57c66f.js';
-import { c as createObserver } from './observers-07d5c052.js';
-import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-955f6ef8.js';
-import './guid-9eeebd0c.js';
-import './resources-7680e255.js';
-import './key-d06349b5.js';
+import { r as registerInstance, c as createEvent, h, a as getElement } from './index-49aca689.js';
+import { g as getSlotted } from './dom-00068eb7.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-2a42ea18.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-07fadc27.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-a43dcb99.js';
+import { c as createObserver } from './observers-1c1a0dc0.js';
+import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-e75a680f.js';
+import './guid-3b59c7f8.js';
+import './resources-68b088c8.js';
+import './key-23e88631.js';
 
 const CSS = {
   wrapper: "wrapper",

package/dist/esm/calcite-input-date-picker.entry.js

@@ -1,24 +1,25 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { d as datePartsFromLocalizedString, a as dateFromLocalizedString, i as inRange, b as dateToISO, g as getValueAsDateRange, c as dateFromISO, e as getLocaleData, f as dateFromRange } from './utils-9295f93b.js';
-import { t as toAriaBoolean } from './dom-9b9f8bc6.js';
-import { f as filterComputedPlacements, c as connectFloatingUI, d as defaultMenuPlacement, r as reposition, a as disconnectFloatingUI, F as FloatingCSS } from './floating-ui-ca2e9747.js';
-import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-d983a411.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { n as numberKeys } from './key-d06349b5.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c72fa5ad.js';
-import { c as componentLoaded, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-23bc5e22.js';
-import { n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized } from './locale-cc57c66f.js';
-import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent-a628a645.js';
-import { c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n-955f6ef8.js';
-import { g as guid } from './guid-9eeebd0c.js';
-import './resources-7680e255.js';
-import './debounce-2d701360.js';
-import './observers-07d5c052.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-49aca689.js';
+import { d as datePartsFromLocalizedString, a as dateFromLocalizedString, i as inRange, b as dateToISO, g as getValueAsDateRange, c as dateFromISO, e as getLocaleData, f as dateFromRange } from './utils-4bd8997b.js';
+import { t as toAriaBoolean } from './dom-00068eb7.js';
+import { f as filterComputedPlacements, c as connectFloatingUI, d as defaultMenuPlacement, r as reposition, a as disconnectFloatingUI, F as FloatingCSS } from './floating-ui-d6763292.js';
+import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-0304447d.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { n as numberKeys } from './key-23e88631.js';
+import { c as connectLabel, d as disconnectLabel } from './label-2a42ea18.js';
+import { c as componentLoaded, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-07fadc27.js';
+import { n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized } from './locale-a43dcb99.js';
+import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent-50860bfb.js';
+import { c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n-e75a680f.js';
+import { c as connectFocusTrap, d as deactivateFocusTrap, a as activateFocusTrap } from './focusTrapComponent-94a49313.js';
+import { g as guid } from './guid-3b59c7f8.js';
+import './resources-68b088c8.js';
+import './debounce-fdbd181f.js';
+import './observers-1c1a0dc0.js';
 
 const CSS = {
   menu: "menu-container",
@@ -54,12 +55,8 @@ const InputDatePicker = class {
     this.calciteInternalInputBlurHandler = () => {
       this.commitValue();
     };
-    //--------------------------------------------------------------------------
-    //
-    //  Private State/Props
-    //
-    //--------------------------------------------------------------------------
     this.dialogId = `date-picker-dialog--${guid()}`;
+    this.focusOnOpen = false;
     this.lastBlurredInput = "none";
     this.userChangedValue = false;
     this.openTransitionProp = "opacity";
@@ -111,15 +108,18 @@ const InputDatePicker = class {
         }
         if (submitForm(this)) {
           event.preventDefault();
+          this.restoreInputFocus();
         }
       }
       else if (key === "ArrowDown") {
         this.open = true;
+        this.focusOnOpen = true;
         event.preventDefault();
       }
       else if (key === "Escape") {
         this.open = false;
         event.preventDefault();
+        this.restoreInputFocus();
       }
     };
     this.startInputFocus = () => {
@@ -134,10 +134,8 @@ const InputDatePicker = class {
       this.focusedInput = "end";
     };
     this.setFloatingEl = (el) => {
-      if (el) {
-        this.floatingEl = el;
-        connectFloatingUI(this, this.referenceEl, this.floatingEl);
-      }
+      this.floatingEl = el;
+      connectFloatingUI(this, this.referenceEl, this.floatingEl);
     };
     this.setStartWrapper = (el) => {
       this.startWrapper = el;
@@ -147,6 +145,16 @@ const InputDatePicker = class {
       this.endWrapper = el;
       this.setReferenceEl();
     };
+    this.setDatePickerRef = (el) => {
+      this.datePickerEl = el;
+      connectFocusTrap(this, {
+        focusTrapEl: el,
+        focusTrapOptions: {
+          initialFocus: false,
+          setReturnFocus: false
+        }
+      });
+    };
     /**
      * Event handler for when the selected date changes
      *
@@ -159,6 +167,7 @@ const InputDatePicker = class {
       event.stopPropagation();
       this.setValue(event.target.valueAsDate);
       this.localizeInputValues();
+      this.restoreInputFocus();
     };
     this.handleDateRangeChange = (event) => {
       if (!this.range) {
@@ -168,12 +177,7 @@ const InputDatePicker = class {
       const value = event.target.valueAsDate;
       this.setRangeValue(value);
       this.localizeInputValues();
-      if (this.shouldFocusRangeEnd()) {
-        this.endInput?.setFocus();
-      }
-      else if (this.shouldFocusRangeStart()) {
-        this.startInput?.setFocus();
-      }
+      this.restoreInputFocus();
     };
     this.setInputValue = (newValue, input = "start") => {
       const inputEl = this[`${input}Input`];
@@ -249,6 +253,7 @@ const InputDatePicker = class {
         .join("")
       : "";
     this.disabled = false;
+    this.focusTrapDisabled = false;
     this.form = undefined;
     this.readOnly = false;
     this.value = "";
@@ -277,6 +282,12 @@ const InputDatePicker = class {
     this.focusedInput = "start";
     this.localeData = undefined;
   }
+  handleFocusTrapDisabled(focusTrapDisabled) {
+    if (!this.open) {
+      return;
+    }
+    focusTrapDisabled ? deactivateFocusTrap(this) : activateFocusTrap(this);
+  }
   handleDisabledAndReadOnlyChange(value) {
     if (!value) {
       this.open = false;
@@ -432,6 +443,7 @@ const InputDatePicker = class {
     this.reposition(true);
   }
   disconnectedCallback() {
+    deactivateFocusTrap(this);
     disconnectLabel(this);
     disconnectForm(this);
     disconnectFloatingUI(this, this.referenceEl, this.floatingEl);
@@ -451,7 +463,7 @@ const InputDatePicker = class {
     };
     return (h(Host, { onBlur: this.deactivate, onKeyDown: this.keyDownHandler }, this.localeData && (h("div", { class: "input-container" }, h("div", { class: "input-wrapper", onClick: this.onInputWrapperClick,
       // eslint-disable-next-line react/jsx-sort-props
-      ref: this.setStartWrapper }, h("calcite-input", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: `input ${this.layout === "vertical" && this.range ? `no-bottom-border` : ``}`, disabled: disabled, icon: "calendar", label: getLabelText(this), "number-button-type": "none", numberingSystem: numberingSystem, onCalciteInputInput: this.calciteInternalInputInputHandler, onCalciteInternalInputBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputFocus: this.startInputFocus, onFocus: this.startEndInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, role: "combobox", scale: this.scale, type: "text",
+      ref: this.setStartWrapper }, h("calcite-input", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: `input ${this.layout === "vertical" && this.range ? `no-bottom-border` : ``}`, disabled: disabled, icon: "calendar", "number-button-type": "none", numberingSystem: numberingSystem, onCalciteInputInput: this.calciteInternalInputInputHandler, onCalciteInternalInputBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputFocus: this.startInputFocus, onFocus: this.startEndInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, role: "combobox", scale: this.scale, type: "text",
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setStartInput }), this.renderToggleIcon(this.open && this.focusedInput === "start")), h("div", { "aria-hidden": toAriaBoolean(!this.open), "aria-label": messages.chooseDate, "aria-live": "polite", "aria-modal": "true", class: {
         [CSS.menu]: true,
@@ -465,7 +477,9 @@ const InputDatePicker = class {
         [FloatingCSS.animationActive]: this.open
       },
       // eslint-disable-next-line react/jsx-sort-props
-      ref: this.setTransitionEl }, h("calcite-date-picker", { activeDate: this.datePickerActiveDate, activeRange: this.focusedInput, headingLevel: this.headingLevel, max: this.max, maxAsDate: this.maxAsDate, messageOverrides: this.messageOverrides, min: this.min, minAsDate: this.minAsDate, numberingSystem: numberingSystem, onCalciteDatePickerChange: this.handleDateChange, onCalciteDatePickerRangeChange: this.handleDateRangeChange, proximitySelectionDisabled: this.proximitySelectionDisabled, range: this.range, scale: this.scale, tabIndex: 0, valueAsDate: this.valueAsDate }))), this.range && this.layout === "horizontal" && (h("div", { class: "horizontal-arrow-container" }, h("calcite-icon", { flipRtl: true, icon: "arrow-right", scale: this.scale === "l" ? "m" : "s" }))), this.range && this.layout === "vertical" && this.scale !== "s" && (h("div", { class: "vertical-arrow-container" }, h("calcite-icon", { icon: "arrow-down", scale: this.scale === "l" ? "m" : "s" }))), this.range && (h("div", { class: "input-wrapper", onClick: this.onInputWrapperClick,
+      ref: this.setTransitionEl }, h("calcite-date-picker", { activeDate: this.datePickerActiveDate, activeRange: this.focusedInput, headingLevel: this.headingLevel, max: this.max, maxAsDate: this.maxAsDate, messageOverrides: this.messageOverrides, min: this.min, minAsDate: this.minAsDate, numberingSystem: numberingSystem, onCalciteDatePickerChange: this.handleDateChange, onCalciteDatePickerRangeChange: this.handleDateRangeChange, proximitySelectionDisabled: this.proximitySelectionDisabled, range: this.range, scale: this.scale, tabIndex: this.open ? undefined : -1, valueAsDate: this.valueAsDate,
+      // eslint-disable-next-line react/jsx-sort-props
+      ref: this.setDatePickerRef }))), this.range && this.layout === "horizontal" && (h("div", { class: "horizontal-arrow-container" }, h("calcite-icon", { flipRtl: true, icon: "arrow-right", scale: this.scale === "l" ? "m" : "s" }))), this.range && this.layout === "vertical" && this.scale !== "s" && (h("div", { class: "vertical-arrow-container" }, h("calcite-icon", { icon: "arrow-down", scale: this.scale === "l" ? "m" : "s" }))), this.range && (h("div", { class: "input-wrapper", onClick: this.onInputWrapperClick,
       // eslint-disable-next-line react/jsx-sort-props
       ref: this.setEndWrapper }, h("calcite-input", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: {
         input: true,
@@ -492,6 +506,14 @@ const InputDatePicker = class {
     this.calciteInputDatePickerBeforeOpen.emit();
   }
   onOpen() {
+    activateFocusTrap(this, {
+      onActivate: () => {
+        if (this.focusOnOpen) {
+          this.datePickerEl.setFocus();
+          this.focusOnOpen = false;
+        }
+      }
+    });
     this.calciteInputDatePickerOpen.emit();
   }
   onBeforeClose() {
@@ -499,6 +521,9 @@ const InputDatePicker = class {
   }
   onClose() {
     this.calciteInputDatePickerClose.emit();
+    deactivateFocusTrap(this);
+    this.restoreInputFocus();
+    this.focusOnOpen = false;
   }
   commitValue() {
     const { focusedInput, value } = this;
@@ -555,15 +580,23 @@ const InputDatePicker = class {
     this.localizeInputValues();
   }
   shouldFocusRangeStart() {
-    const startValue = this.value[0] || undefined;
-    const endValue = this.value[1] || undefined;
+    const startValue = this.value[0];
+    const endValue = this.value[1];
     return !!(endValue && !startValue && this.focusedInput === "end" && this.startInput);
   }
   shouldFocusRangeEnd() {
-    const startValue = this.value[0] || undefined;
-    const endValue = this.value[1] || undefined;
+    const startValue = this.value[0];
+    const endValue = this.value[1];
     return !!(startValue && !endValue && this.focusedInput === "start" && this.endInput);
   }
+  restoreInputFocus() {
+    if (!this.range) {
+      this.startInput.setFocus();
+      return;
+    }
+    const focusedInput = this.focusedInput === "start" ? this.startInput : this.endInput;
+    focusedInput.setFocus();
+  }
   localizeInputValues() {
     const date = dateFromRange((this.range
       ? (Array.isArray(this.valueAsDate) && this.valueAsDate[0]) || undefined
@@ -583,6 +616,7 @@ const InputDatePicker = class {
   static get assetsDirs() { return ["assets"]; }
   get el() { return getElement(this); }
   static get watchers() { return {
+    "focusTrapDisabled": ["handleFocusTrapDisabled"],
     "disabled": ["handleDisabledAndReadOnlyChange"],
     "readOnly": ["handleDisabledAndReadOnlyChange"],
     "value": ["valueWatcher"],

package/dist/esm/calcite-input-message.entry.js

@@ -1,12 +1,12 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { e as setRequestedIcon } from './dom-9b9f8bc6.js';
-import './guid-9eeebd0c.js';
-import './resources-7680e255.js';
+import { r as registerInstance, h, H as Host, a as getElement } from './index-49aca689.js';
+import { e as setRequestedIcon } from './dom-00068eb7.js';
+import './guid-3b59c7f8.js';
+import './resources-68b088c8.js';
 
 var StatusIconDefaults;
 (function (StatusIconDefaults) {

package/dist/esm/calcite-input-number.entry.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.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { g as getSlotted, i as isPrimaryPointerButton, e as setRequestedIcon, b as getElementDir } from './dom-9b9f8bc6.js';
-import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-d983a411.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { n as numberKeys } from './key-d06349b5.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c72fa5ad.js';
-import { a as setComponentLoaded, s as setUpLoadableComponent, c as componentLoaded } from './loadable-23bc5e22.js';
-import { n as numberStringFormatter, i as isValidNumber, p as parseNumberString, s as sanitizeNumberString, a as defaultNumberingSystem, c as connectLocalized, d as disconnectLocalized, B as BigDecimal } from './locale-cc57c66f.js';
-import { c as createObserver } from './observers-07d5c052.js';
-import { C as CSS_UTILITY } from './resources-7680e255.js';
-import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-955f6ef8.js';
-import './guid-9eeebd0c.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-49aca689.js';
+import { g as getSlotted, i as isPrimaryPointerButton, e as setRequestedIcon, b as getElementDir } from './dom-00068eb7.js';
+import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-0304447d.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { n as numberKeys } from './key-23e88631.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-2a42ea18.js';
+import { a as setComponentLoaded, s as setUpLoadableComponent, c as componentLoaded } from './loadable-07fadc27.js';
+import { n as numberStringFormatter, i as isValidNumber, p as parseNumberString, s as sanitizeNumberString, a as defaultNumberingSystem, c as connectLocalized, d as disconnectLocalized, B as BigDecimal } from './locale-a43dcb99.js';
+import { c as createObserver } from './observers-1c1a0dc0.js';
+import { C as CSS_UTILITY } from './resources-68b088c8.js';
+import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-e75a680f.js';
+import './guid-3b59c7f8.js';
 
 const CSS = {
   loader: "loader",

package/dist/esm/calcite-input-text.entry.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.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { g as getSlotted, e as setRequestedIcon, b as getElementDir } from './dom-9b9f8bc6.js';
-import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-d983a411.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c72fa5ad.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-23bc5e22.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-cc57c66f.js';
-import { c as createObserver } from './observers-07d5c052.js';
-import { C as CSS_UTILITY } from './resources-7680e255.js';
-import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-955f6ef8.js';
-import './guid-9eeebd0c.js';
-import './key-d06349b5.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-49aca689.js';
+import { g as getSlotted, e as setRequestedIcon, b as getElementDir } from './dom-00068eb7.js';
+import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-0304447d.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-2a42ea18.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-07fadc27.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-a43dcb99.js';
+import { c as createObserver } from './observers-1c1a0dc0.js';
+import { C as CSS_UTILITY } from './resources-68b088c8.js';
+import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-e75a680f.js';
+import './guid-3b59c7f8.js';
+import './key-23e88631.js';
 
 const CSS = {
   loader: "loader",

package/dist/esm/calcite-input-time-picker_2.entry.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.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-d983a411.js';
-import { g as guid } from './guid-9eeebd0c.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { n as numberKeys, i as isActivationKey } from './key-d06349b5.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c72fa5ad.js';
-import { c as componentLoaded, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-23bc5e22.js';
-import { b as getDateTimeFormat, i as isValidNumber, e as getSupportedNumberingSystem, n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized } from './locale-cc57c66f.js';
-import { u as updateMessages, c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n-955f6ef8.js';
-import './dom-9b9f8bc6.js';
-import './resources-7680e255.js';
-import './observers-07d5c052.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-49aca689.js';
+import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-0304447d.js';
+import { g as guid } from './guid-3b59c7f8.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { n as numberKeys, i as isActivationKey } from './key-23e88631.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-2a42ea18.js';
+import { c as componentLoaded, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-07fadc27.js';
+import { b as getDateTimeFormat, i as isValidNumber, e as getSupportedNumberingSystem, n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized } from './locale-a43dcb99.js';
+import { u as updateMessages, c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n-e75a680f.js';
+import './dom-00068eb7.js';
+import './resources-68b088c8.js';
+import './observers-1c1a0dc0.js';
 
 const maxTenthForMinuteAndSecond = 5;
 function createLocaleDateTimeFormatter(locale, numberingSystem, includeSeconds = true) {

package/dist/esm/calcite-input.entry.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.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { g as getSlotted, i as isPrimaryPointerButton, e as setRequestedIcon, b as getElementDir } from './dom-9b9f8bc6.js';
-import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-d983a411.js';
-import { u as updateHostInteraction } from './interactive-b83ebf8e.js';
-import { n as numberKeys } from './key-d06349b5.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c72fa5ad.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-23bc5e22.js';
-import { n as numberStringFormatter, i as isValidNumber, p as parseNumberString, s as sanitizeNumberString, a as defaultNumberingSystem, c as connectLocalized, d as disconnectLocalized, B as BigDecimal } from './locale-cc57c66f.js';
-import { c as createObserver } from './observers-07d5c052.js';
-import { C as CSS_UTILITY } from './resources-7680e255.js';
-import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-955f6ef8.js';
-import './guid-9eeebd0c.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-49aca689.js';
+import { g as getSlotted, i as isPrimaryPointerButton, e as setRequestedIcon, b as getElementDir } from './dom-00068eb7.js';
+import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-0304447d.js';
+import { u as updateHostInteraction } from './interactive-9b29ffaa.js';
+import { n as numberKeys } from './key-23e88631.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-2a42ea18.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentLoaded } from './loadable-07fadc27.js';
+import { n as numberStringFormatter, i as isValidNumber, p as parseNumberString, s as sanitizeNumberString, a as defaultNumberingSystem, c as connectLocalized, d as disconnectLocalized, B as BigDecimal } from './locale-a43dcb99.js';
+import { c as createObserver } from './observers-1c1a0dc0.js';
+import { C as CSS_UTILITY } from './resources-68b088c8.js';
+import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-e75a680f.js';
+import './guid-3b59c7f8.js';
 
 const CSS = {
   loader: "loader",

package/dist/esm/calcite-label.entry.js

@@ -1,13 +1,13 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.12
+ * v1.3.0-next.13
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-d726db8d.js';
-import { l as labelConnectedEvent, a as labelDisconnectedEvent } from './label-c72fa5ad.js';
-import './dom-9b9f8bc6.js';
-import './guid-9eeebd0c.js';
-import './resources-7680e255.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-49aca689.js';
+import { l as labelConnectedEvent, a as labelDisconnectedEvent } from './label-2a42ea18.js';
+import './dom-00068eb7.js';
+import './guid-3b59c7f8.js';
+import './resources-68b088c8.js';
 
 const CSS = {
   container: "container"