@esri/calcite-components 1.0.0-next.653 → 1.0.0-next.655

package/dist/components/calcite-tab-nav.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { T as TabNav, d as defineCustomElement$1 } from './tab-nav.js';
 

package/dist/components/calcite-tab-title.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { T as TabTitle, d as defineCustomElement$1 } from './tab-title.js';
 

package/dist/components/calcite-tab.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { T as Tab, d as defineCustomElement$1 } from './tab.js';
 

package/dist/components/calcite-tabs.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { T as Tabs, d as defineCustomElement$1 } from './tabs.js';
 

package/dist/components/calcite-tile-select-group.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client/index.js';
 import { u as updateHostInteraction } from './interactive.js';

package/dist/components/calcite-tile-select.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client/index.js';
 import { g as guid } from './guid.js';
@@ -64,9 +64,8 @@ const TileSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   //--------------------------------------------------------------------------
   /** Sets focus on the component. */
   async setFocus() {
-    var _a;
     await componentLoaded(this);
-    (_a = this.input) === null || _a === void 0 ? void 0 : _a.setFocus();
+    this.input?.setFocus();
   }
   //--------------------------------------------------------------------------
   //

package/dist/components/calcite-tile.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { T as Tile, d as defineCustomElement$1 } from './tile.js';
 

package/dist/components/calcite-time-picker.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { T as TimePicker, d as defineCustomElement$1 } from './time-picker.js';
 

package/dist/components/calcite-tip-group.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client/index.js';
 

package/dist/components/calcite-tip-manager.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client/index.js';
 import { c as getElementDir, t as toAriaBoolean } from './dom.js';
@@ -108,13 +108,11 @@ const TipManager = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   //
   // --------------------------------------------------------------------------
   connectedCallback() {
-    var _a;
     this.setUpTips();
-    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el, { childList: true, subtree: true });
+    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });
   }
   disconnectedCallback() {
-    var _a;
-    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+    this.mutationObserver?.disconnect();
   }
   // --------------------------------------------------------------------------
   //
@@ -163,7 +161,7 @@ const TipManager = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   updateGroupTitle() {
     const selectedTip = this.tips[this.selectedIndex];
     const tipParent = selectedTip.closest("calcite-tip-group");
-    this.groupTitle = (tipParent === null || tipParent === void 0 ? void 0 : tipParent.groupTitle) || this.intlDefaultTitle || TEXT.defaultGroupTitle;
+    this.groupTitle = tipParent?.groupTitle || this.intlDefaultTitle || TEXT.defaultGroupTitle;
   }
   // --------------------------------------------------------------------------
   //

package/dist/components/calcite-tip.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client/index.js';
 import { b as getSlotted } from './dom.js';
@@ -71,9 +71,8 @@ const Tip = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   //
   // --------------------------------------------------------------------------
   renderHeader() {
-    var _a;
     const { heading, headingLevel, el } = this;
-    const parentLevel = (_a = el.closest("calcite-tip-manager")) === null || _a === void 0 ? void 0 : _a.headingLevel;
+    const parentLevel = el.closest("calcite-tip-manager")?.headingLevel;
     const relativeLevel = parentLevel ? constrainHeadingLevel(parentLevel + 1) : null;
     const level = headingLevel || relativeLevel;
     return heading ? (h("header", { class: CSS.header }, h(Heading, { class: CSS.heading, level: level }, heading))) : null;

package/dist/components/calcite-tooltip.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { T as Tooltip, d as defineCustomElement$1 } from './tooltip.js';
 

package/dist/components/calcite-tree-item.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client/index.js';
 import { b as getSlotted, c as getElementDir, C as CSS_UTILITY, t as toAriaBoolean, m as filterDirectChildren, n as nodeListToArray } from './dom.js';
@@ -55,13 +55,12 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       items.forEach((item) => (item.parentExpanded = expanded));
     };
     this.updateAncestorTree = () => {
-      var _a;
       if (this.selected && this.selectionMode === "ancestors") {
         const ancestors = [];
         let parent = this.parentTreeItem;
         while (parent) {
           ancestors.push(parent);
-          parent = (_a = parent.parentElement) === null || _a === void 0 ? void 0 : _a.closest("calcite-tree-item");
+          parent = parent.parentElement?.closest("calcite-tree-item");
         }
         ancestors.forEach((item) => (item.indeterminate = true));
         return;
@@ -93,8 +92,7 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   //
   //--------------------------------------------------------------------------
   connectedCallback() {
-    var _a;
-    this.parentTreeItem = (_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.closest("calcite-tree-item");
+    this.parentTreeItem = this.el.parentElement?.closest("calcite-tree-item");
     if (this.parentTreeItem) {
       const { expanded } = this.parentTreeItem;
       this.updateParentIsExpanded(this.parentTreeItem, expanded);
@@ -105,7 +103,6 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     disconnectConditionalSlotComponent(this);
   }
   componentWillRender() {
-    var _a;
     this.hasChildren = !!this.el.querySelector("calcite-tree");
     this.depth = 0;
     let parentTree = this.el.closest("calcite-tree");
@@ -117,7 +114,7 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.lines = parentTree.lines;
     let nextParentTree;
     while (parentTree) {
-      nextParentTree = (_a = parentTree.parentElement) === null || _a === void 0 ? void 0 : _a.closest("calcite-tree");
+      nextParentTree = parentTree.parentElement?.closest("calcite-tree");
       if (nextParentTree === parentTree) {
         break;
       }
@@ -219,7 +216,7 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       case "Home":
         root = this.el.closest("calcite-tree:not([child])");
         const firstNode = root.querySelector("calcite-tree-item");
-        firstNode === null || firstNode === void 0 ? void 0 : firstNode.focus();
+        firstNode?.focus();
         break;
       case "End":
         root = this.el.closest("calcite-tree:not([child])");
@@ -229,7 +226,7 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
           currentNode = currentTree.children[root.children.length - 1];
           currentTree = nodeListToArray(currentNode.children).find((el) => el.matches("calcite-tree"));
         }
-        currentNode === null || currentNode === void 0 ? void 0 : currentNode.focus();
+        currentNode?.focus();
         break;
     }
   }

package/dist/components/calcite-tree.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.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client/index.js';
 import { f as focusElement, n as nodeListToArray, l as getRootNode } from './dom.js';
 
 function isTreeItem(element) {
-  return element === null || element === void 0 ? void 0 : element.matches("calcite-tree-item");
+  return element?.matches("calcite-tree-item");
 }
 function getEnabledSiblingItem(el, direction) {
   const directionProp = direction === "down" ? "nextElementSibling" : "previousElementSibling";
@@ -42,8 +42,7 @@ const Tree = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   //
   //--------------------------------------------------------------------------
   componentWillRender() {
-    var _a;
-    const parent = (_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.closest("calcite-tree");
+    const parent = this.el.parentElement?.closest("calcite-tree");
     this.lines = parent ? parent.lines : this.lines;
     this.scale = parent ? parent.scale : this.scale;
     this.selectionMode = parent ? parent.selectionMode : this.selectionMode;
@@ -160,7 +159,6 @@ const Tree = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     event.stopPropagation();
   }
   keyDownHandler(event) {
-    var _a;
     const root = this.el.closest("calcite-tree:not([child])");
     const target = event.target;
     if (!(root === this.el && target.tagName === "CALCITE-TREE-ITEM" && this.el.contains(target))) {
@@ -202,7 +200,7 @@ const Tree = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       if (target.hasChildren) {
         if (target.expanded && getRootNode(this.el).activeElement === target) {
           // When focus is on an open node, moves focus to the first child node.
-          (_a = getEnabledSiblingItem(target.querySelector("calcite-tree-item"), "down")) === null || _a === void 0 ? void 0 : _a.focus();
+          getEnabledSiblingItem(target.querySelector("calcite-tree-item"), "down")?.focus();
           event.preventDefault();
         }
         else {

package/dist/components/calcite-value-list-item.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client/index.js';
 import { I as ICON_TYPES } from './resources2.js';
@@ -99,9 +99,8 @@ const ValueListItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /** Set focus on the component. */
   async setFocus() {
-    var _a;
     await componentLoaded(this);
-    (_a = this.pickListItem) === null || _a === void 0 ? void 0 : _a.setFocus();
+    this.pickListItem?.setFocus();
   }
   calciteListItemChangeHandler(event) {
     // adjust item payload from wrapped item before bubbling

package/dist/components/calcite-value-list.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client/index.js';
 import { S as Sortable } from './sortable.esm.js';
@@ -57,10 +57,10 @@ function getScreenReaderText(item, status, valueList) {
 function getHandleAndItemElement(event) {
   const handle = event
     .composedPath()
-    .find((item) => { var _a; return ((_a = item.dataset) === null || _a === void 0 ? void 0 : _a.jsHandle) !== undefined; });
+    .find((item) => item.dataset?.jsHandle !== undefined);
   const item = event
     .composedPath()
-    .find((item) => { var _a; return ((_a = item.tagName) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === "calcite-value-list-item"; });
+    .find((item) => item.tagName?.toLowerCase() === "calcite-value-list-item");
   return { handle, item };
 }
 function replacePlaceholders(text, label, position, total) {
@@ -127,7 +127,7 @@ const ValueList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       }
       this.items = this.getItems();
       this.calciteListOrderChange.emit(this.items.map(({ value }) => value));
-      requestAnimationFrame(() => handle === null || handle === void 0 ? void 0 : handle.focus());
+      requestAnimationFrame(() => handle?.focus());
       item.handleActivated = true;
       this.updateHandleAriaLabel(handle, getScreenReaderText(item, "change", this));
     };
@@ -136,7 +136,7 @@ const ValueList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     this.handleFocusIn = (event) => {
       const { handle, item } = getHandleAndItemElement(event);
-      if (!(item === null || item === void 0 ? void 0 : item.handleActivated) && item && handle) {
+      if (!item?.handleActivated && item && handle) {
         this.updateHandleAriaLabel(handle, getScreenReaderText(item, "idle", this));
       }
     };
@@ -233,8 +233,7 @@ const ValueList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     });
   }
   cleanUpDragAndDrop() {
-    var _a;
-    (_a = this.sortable) === null || _a === void 0 ? void 0 : _a.destroy();
+    this.sortable?.destroy();
     this.sortable = null;
   }
   handleBlur() {

package/dist/components/checkbox.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client/index.js';
 import { g as guid } from './guid.js';
@@ -84,9 +84,8 @@ const Checkbox = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   //--------------------------------------------------------------------------
   /** Sets focus on the component. */
   async setFocus() {
-    var _a;
     await componentLoaded(this);
-    (_a = this.toggleEl) === null || _a === void 0 ? void 0 : _a.focus();
+    this.toggleEl?.focus();
   }
   //--------------------------------------------------------------------------
   //

package/dist/components/chip.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client/index.js';
 import { b as getSlotted } from './dom.js';
@@ -80,9 +80,8 @@ const Chip = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   //--------------------------------------------------------------------------
   /** Sets focus on the component. */
   async setFocus() {
-    var _a;
     await componentLoaded(this);
-    (_a = this.closeButton) === null || _a === void 0 ? void 0 : _a.focus();
+    this.closeButton?.focus();
   }
   //--------------------------------------------------------------------------
   //

package/dist/components/color-picker-hex-input.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client/index.js';
 import { i as isValidHex, a as isLonghandHex, r as rgbToHex, n as normalizeHex, b as hexChar } from './utils.js';

package/dist/components/color-picker-swatch.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client/index.js';
 import { h as getThemeName } from './dom.js';

package/dist/components/conditionalSlot.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { forceUpdate } from '@stencil/core/internal/client/index.js';
 import { c as createObserver } from './observers.js';

package/dist/components/date-picker-day.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client/index.js';
 import { o as closestElementCrossShadowBoundary, c as getElementDir, C as CSS_UTILITY } from './dom.js';

package/dist/components/date-picker-month-header.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client/index.js';
 import { h as getOrder, e as dateFromRange, n as nextMonth, p as prevMonth } from './date.js';
@@ -12,6 +12,19 @@ import { o as closestElementCrossShadowBoundary } from './dom.js';
 import { d as defineCustomElement$1 } from './icon.js';
 
 const BUDDHIST_CALENDAR_YEAR_OFFSET = 543;
+const CSS = {
+  header: "header",
+  month: "month",
+  chevron: "chevron",
+  suffix: "suffix",
+  yearSuffix: "year--suffix",
+  yearWrap: "year-wrap",
+  textReverse: "text--reverse"
+};
+const ICON = {
+  chevronLeft: "chevron-left",
+  chevronRight: "chevron-right"
+};
 
 const datePickerMonthHeaderCss = "@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-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-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)}:host([hidden]){display:none}:host{display:block}.header{display:flex;justify-content:space-between;padding-block:0px;padding-inline:0.25rem}:host([scale=s]) .text{margin-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=s]) .chevron{block-size:2.25rem}:host([scale=m]) .text{margin-block:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host([scale=m]) .chevron{block-size:3rem}:host([scale=l]) .text{margin-block:1rem;font-size:var(--calcite-font-size-1);line-height:1.5rem}:host([scale=l]) .chevron{block-size:3.5rem}.chevron{margin-inline:-0.25rem;box-sizing:content-box;display:flex;flex-grow:0;cursor:pointer;align-items:center;justify-content:center;border-style:none;background-color:var(--calcite-ui-foreground-1);padding-inline:0.25rem;color:var(--calcite-ui-text-3);outline:2px solid transparent;outline-offset:2px;outline-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;inline-size:14.2857142857%}.chevron:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}.chevron:hover,.chevron:focus{background-color:var(--calcite-ui-foreground-2);fill:var(--calcite-ui-text-1);color:var(--calcite-ui-text-1)}.chevron:active{background-color:var(--calcite-ui-foreground-3)}.chevron[aria-disabled=true]{pointer-events:none;opacity:0}.text{margin-block:auto;display:flex;inline-size:100%;flex:1 1 auto;align-items:center;justify-content:center;text-align:center;line-height:1}.text--reverse{flex-direction:row-reverse}.month,.year,.suffix{margin-inline:0.25rem;margin-block:auto;display:inline-block;background-color:var(--calcite-ui-foreground-1);font-weight:var(--calcite-font-weight-medium);line-height:1.25;color:var(--calcite-ui-text-1);font-size:inherit}.year{position:relative;inline-size:2.5rem;border-style:none;background-color:transparent;text-align:center;font-family:inherit;outline-color:transparent}.year:hover{transition-duration:100ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-property:outline-color;outline:2px solid var(--calcite-ui-border-2);outline-offset:2px}.year:focus{outline:2px solid var(--calcite-ui-brand);outline-offset:2px}.year--suffix{text-align:start}.year-wrap{position:relative}.suffix{inset-block-start:0px;white-space:nowrap;text-align:start;inset-inline-start:0}";
 
@@ -104,10 +117,9 @@ const DatePickerMonthHeader = /*@__PURE__*/ proxyCustomElement(class extends HTM
     this.setNextPrevMonthDates();
   }
   render() {
-    return h("div", { class: "header" }, this.renderContent());
+    return h("div", { class: CSS.header }, this.renderContent());
   }
   renderContent() {
-    var _a;
     if (!this.activeDate || !this.localeData) {
       return null;
     }
@@ -126,11 +138,11 @@ const DatePickerMonthHeader = /*@__PURE__*/ proxyCustomElement(class extends HTM
     const iconScale = this.scale === "l" ? "m" : "s";
     const order = getOrder(unitOrder);
     const reverse = order.indexOf("y") < order.indexOf("m");
-    const suffix = (_a = this.localeData.year) === null || _a === void 0 ? void 0 : _a.suffix;
-    return (h(Fragment, null, h("a", { "aria-disabled": `${this.prevMonthDate.getMonth() === activeMonth}`, "aria-label": this.intlPrevMonth, class: "chevron", href: "#", onClick: this.prevMonthClick, onKeyDown: this.prevMonthKeydown, role: "button", tabindex: this.prevMonthDate.getMonth() === activeMonth ? -1 : 0 }, h("calcite-icon", { "flip-rtl": true, icon: "chevron-left", scale: iconScale })), h("div", { class: { text: true, "text--reverse": reverse } }, h(Heading, { class: "month", level: this.headingLevel }, localizedMonth), h("span", { class: "year-wrap" }, h("input", { "aria-label": this.intlYear, class: {
+    const suffix = this.localeData.year?.suffix;
+    return (h(Fragment, null, h("a", { "aria-disabled": `${this.prevMonthDate.getMonth() === activeMonth}`, "aria-label": this.intlPrevMonth, class: CSS.chevron, href: "#", onClick: this.prevMonthClick, onKeyDown: this.prevMonthKeydown, role: "button", tabindex: this.prevMonthDate.getMonth() === activeMonth ? -1 : 0 }, h("calcite-icon", { "flip-rtl": true, icon: ICON.chevronLeft, scale: iconScale })), h("div", { class: { text: true, [CSS.textReverse]: reverse } }, h(Heading, { class: CSS.month, level: this.headingLevel }, localizedMonth), h("span", { class: CSS.yearWrap }, h("input", { "aria-label": this.intlYear, class: {
         year: true,
-        "year--suffix": !!suffix
-      }, inputmode: "numeric", maxlength: "4", minlength: "1", onChange: this.onYearChange, onInput: this.onYearInput, onKeyDown: this.onYearKey, pattern: "\\d*", ref: (el) => (this.yearInput = el), type: "text", value: localizedYear }), suffix && h("span", { class: "suffix" }, suffix))), h("a", { "aria-disabled": `${this.nextMonthDate.getMonth() === activeMonth}`, "aria-label": this.intlNextMonth, class: "chevron", href: "#", onClick: this.nextMonthClick, onKeyDown: this.nextMonthKeydown, role: "button", tabindex: this.nextMonthDate.getMonth() === activeMonth ? -1 : 0 }, h("calcite-icon", { "flip-rtl": true, icon: "chevron-right", scale: iconScale }))));
+        [CSS.yearSuffix]: !!suffix
+      }, inputmode: "numeric", maxlength: "4", minlength: "1", onChange: this.onYearChange, onInput: this.onYearInput, onKeyDown: this.onYearKey, pattern: "\\d*", ref: (el) => (this.yearInput = el), type: "text", value: localizedYear }), suffix && h("span", { class: CSS.suffix }, suffix))), h("a", { "aria-disabled": `${this.nextMonthDate.getMonth() === activeMonth}`, "aria-label": this.intlNextMonth, class: CSS.chevron, href: "#", onClick: this.nextMonthClick, onKeyDown: this.nextMonthKeydown, role: "button", tabindex: this.nextMonthDate.getMonth() === activeMonth ? -1 : 0 }, h("calcite-icon", { "flip-rtl": true, icon: ICON.chevronRight, scale: iconScale }))));
   }
   setNextPrevMonthDates() {
     if (!this.activeDate) {

package/dist/components/date-picker-month.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client/index.js';
 import { f as sameDate, e as dateFromRange, i as inRange } from './date.js';
@@ -270,10 +270,9 @@ const DatePickerMonth = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
    * @param ref
    */
   renderDateDay(active, day, date, currentMonth, ref) {
-    var _a;
     const isFocusedOnStart = this.isFocusedOnStart();
     const isHoverInRange = this.isHoverInRange() ||
-      (!this.endDate && this.hoverRange && sameDate((_a = this.hoverRange) === null || _a === void 0 ? void 0 : _a.end, this.startDate));
+      (!this.endDate && this.hoverRange && sameDate(this.hoverRange?.end, this.startDate));
     return (h("calcite-date-picker-day", { active: active, class: {
         "hover--inside-range": this.startDate && isHoverInRange,
         "hover--outside-range": this.startDate && !isHoverInRange,
@@ -282,13 +281,12 @@ const DatePickerMonth = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
       }, currentMonth: currentMonth, day: day, disabled: !inRange(date, this.min, this.max), endOfRange: this.isEndOfRange(date), highlighted: this.betweenSelectedRange(date), key: date.toDateString(), onCalciteDaySelect: this.daySelect, onCalciteInternalDayHover: this.dayHover, range: !!this.startDate && !!this.endDate && !sameDate(this.startDate, this.endDate), rangeHover: this.isRangeHover(date), ref: (el) => {
         // when moving via keyboard, focus must be updated on active date
         if (ref && active && this.activeFocus) {
-          el === null || el === void 0 ? void 0 : el.focus();
+          el?.focus();
         }
       }, scale: this.scale, selected: this.isSelected(date), startOfRange: this.isStartOfRange(date), value: date }));
   }
   isFocusedOnStart() {
-    var _a;
-    return ((_a = this.hoverRange) === null || _a === void 0 ? void 0 : _a.focused) === "start";
+    return this.hoverRange?.focused === "start";
   }
   isHoverInRange() {
     if (!this.hoverRange) {

package/dist/components/date-picker.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { getAssetPath, proxyCustomElement, HTMLElement, createEvent, h, Host, Build } from '@stencil/core/internal/client/index.js';
 import { g as getSupportedLocale, c as connectLocalized, d as disconnectLocalized, n as numberStringFormatter } from './locale.js';
@@ -187,16 +187,15 @@ const DatePicker = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
      * Reset active date and close
      */
     this.reset = () => {
-      var _a, _b, _c, _d, _e, _f;
       if (!Array.isArray(this.valueAsDate) &&
         this.valueAsDate &&
-        ((_a = this.valueAsDate) === null || _a === void 0 ? void 0 : _a.getTime()) !== ((_b = this.activeDate) === null || _b === void 0 ? void 0 : _b.getTime())) {
+        this.valueAsDate?.getTime() !== this.activeDate?.getTime()) {
         this.activeDate = new Date(this.valueAsDate);
       }
-      if (this.startAsDate && ((_c = this.startAsDate) === null || _c === void 0 ? void 0 : _c.getTime()) !== ((_d = this.activeStartDate) === null || _d === void 0 ? void 0 : _d.getTime())) {
+      if (this.startAsDate && this.startAsDate?.getTime() !== this.activeStartDate?.getTime()) {
         this.activeStartDate = new Date(this.startAsDate);
       }
-      if (this.endAsDate && ((_e = this.endAsDate) === null || _e === void 0 ? void 0 : _e.getTime()) !== ((_f = this.activeEndDate) === null || _f === void 0 ? void 0 : _f.getTime())) {
+      if (this.endAsDate && this.endAsDate?.getTime() !== this.activeEndDate?.getTime()) {
         this.activeEndDate = new Date(this.endAsDate);
       }
     };
@@ -356,7 +355,6 @@ const DatePicker = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.onMaxChanged(this.max);
   }
   render() {
-    var _a;
     const date = dateFromRange(this.range && Array.isArray(this.valueAsDate) ? this.valueAsDate[0] : this.valueAsDate, this.minAsDate, this.maxAsDate);
     let activeDate = this.getActiveDate(date, this.minAsDate, this.maxAsDate);
     const endDate = this.range && Array.isArray(this.valueAsDate)
@@ -364,7 +362,7 @@ const DatePicker = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       : null;
     const activeEndDate = this.getActiveEndDate(endDate, this.minAsDate, this.maxAsDate);
     if ((this.activeRange === "end" ||
-      (((_a = this.hoverRange) === null || _a === void 0 ? void 0 : _a.focused) === "end" && (!this.proximitySelectionDisabled || endDate))) &&
+      (this.hoverRange?.focused === "end" && (!this.proximitySelectionDisabled || endDate))) &&
       activeEndDate) {
       activeDate = activeEndDate;
     }

package/dist/components/date.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 import { n as numberStringFormatter } from './locale.js';
 

package/dist/components/debounce.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.653
+ * v1.0.0-next.655
  */
 /** Detect free variable `global` from Node.js. */
 var freeGlobal = typeof global == 'object' && global && global.Object === Object && global;