@esri/calcite-components 2.13.0 → 2.14.0-next.1

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

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { t as toAriaBoolean } from './dom.js';
@@ -65,9 +65,9 @@ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class DropdownItem extends
     }
     render() {
         const { href, selectionMode, label, iconFlipRtl } = this;
-        const iconStartEl = (h("calcite-icon", { key: '1ec1c941651dda8f39fa15427592141f04180f3e', class: CSS.iconStart, flipRtl: iconFlipRtl === "start" || iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
-        const contentNode = (h("span", { key: '3ab167ed4054ca34b4e13e72b752af6cf25522ae', class: CSS.itemContent }, h("slot", { key: '88cf44809fb48450c66cc8f105bbda008a78157d' })));
-        const iconEndEl = (h("calcite-icon", { key: '32fb27182943a032c0037f1f878a95c194d2dff1', class: CSS.iconEnd, flipRtl: iconFlipRtl === "end" || iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
+        const iconStartEl = (h("calcite-icon", { key: '3fc27ffa2c4dbecb2294a18deb33daa0522f23c5', class: CSS.iconStart, flipRtl: iconFlipRtl === "start" || iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
+        const contentNode = (h("span", { key: '2a81a8fe77367c4e0c096b5674700e9d7457b79c', class: CSS.itemContent }, h("slot", { key: '3c3d08cd024fa43db529cd534986ccd5eb407a8f' })));
+        const iconEndEl = (h("calcite-icon", { key: 'd8ef4e66f3f054ddd967950468e5b7ad3732b094', class: CSS.iconEnd, flipRtl: iconFlipRtl === "end" || iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
         const slottedContent = this.iconStart && this.iconEnd
             ? [iconStartEl, contentNode, iconEndEl]
             : this.iconStart
@@ -85,7 +85,7 @@ const DropdownItem = /*@__PURE__*/ proxyCustomElement(class DropdownItem extends
                     : "menuitem";
         const itemAria = selectionMode !== "none" ? toAriaBoolean(this.selected) : null;
         const { disabled } = this;
-        return (h(Host, { key: 'beec8e51bf18bdcab1928181828b372cc70bb7ee', "aria-checked": itemAria, "aria-label": !href ? label : "", role: itemRole, tabIndex: disabled ? -1 : 0 }, h(InteractiveContainer, { key: '5cbbd1074d6c571f4cac3a99e4a2c09bf113db55', disabled: disabled }, h("div", { key: 'bff025aeb280c9d0d829e5cf4d94e9392604e607', class: {
+        return (h(Host, { key: 'ede51c19d0cb6e5b5b238e722e22e0474eb3fdd3', "aria-checked": itemAria, "aria-label": !href ? label : "", role: itemRole, tabIndex: disabled ? -1 : 0 }, h(InteractiveContainer, { key: '78062d555543e0d43b45c4970f64ca4f01b8f0a6', disabled: disabled }, h("div", { key: '531dfceeddd2058290d06e4f6c2fccdbba68676d', class: {
                 [CSS.container]: true,
                 [CSS.containerNone]: selectionMode === "none",
             } }, selectionMode !== "none" ? (h("calcite-icon", { class: CSS.icon, icon: selectionMode === "multiple" ? "check" : "bullet-point", scale: getIconScale(this.scale) })) : null, contentEl))));

package/dist/components/calcite-dropdown.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { D as Dropdown, d as defineCustomElement$1 } from './dropdown.js';
 

package/dist/components/calcite-fab.js

@@ -1,10 +1,10 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { e as focusElement } from './dom.js';
+import { d as focusElement } from './dom.js';
 import { u as updateHostInteraction, I as InteractiveContainer } from './interactive.js';
 import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { d as defineCustomElement$4 } from './button.js';
@@ -69,7 +69,7 @@ const Fab = /*@__PURE__*/ proxyCustomElement(class Fab extends HTMLElement {
     render() {
         const { appearance, kind, disabled, loading, scale, textEnabled, icon, label, text, iconFlipRtl, } = this;
         const title = !textEnabled ? label || text || null : null;
-        return (h(InteractiveContainer, { key: '7953bd06defeddfed5530500901609524f7b58fd', disabled: disabled }, h("calcite-button", { key: 'c2bbe2be5e2ac375abab75024005f1eb5afed51c', appearance: appearance === "solid" ? "solid" : "outline-fill", class: CSS.button, disabled: disabled, iconFlipRtl: iconFlipRtl ? "start" : null, iconStart: icon, kind: kind, label: label, loading: loading, ref: (buttonEl) => {
+        return (h(InteractiveContainer, { key: '192a90c2b8b340b44f046488905389d67dcf0770', disabled: disabled }, h("calcite-button", { key: 'b65d5e57449807c5d2857817cadbb4f591424d0d', appearance: appearance === "solid" ? "solid" : "outline-fill", class: CSS.button, disabled: disabled, iconFlipRtl: iconFlipRtl ? "start" : null, iconStart: icon, kind: kind, label: label, loading: loading, ref: (buttonEl) => {
                 this.buttonEl = buttonEl;
             }, round: true, scale: scale, title: title, type: "button", width: "auto" }, this.textEnabled ? this.text : null)));
     }

package/dist/components/calcite-filter.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { F as Filter, d as defineCustomElement$1 } from './filter2.js';
 

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

@@ -1,10 +1,10 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { a as getElementDir } from './dom.js';
+import { g as getElementDir } from './dom.js';
 import { u as updateHostInteraction, I as InteractiveContainer } from './interactive.js';
 import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale.js';
@@ -189,7 +189,7 @@ const FlowItem = /*@__PURE__*/ proxyCustomElement(class FlowItem extends HTMLEle
     }
     render() {
         const { collapsed, collapseDirection, collapsible, closable, closed, description, disabled, heading, headingLevel, loading, menuOpen, messages, overlayPositioning, beforeClose, } = this;
-        return (h(Host, { key: '2e7872bb2687db0b67ddbf375f8ec0beaabbda36' }, h(InteractiveContainer, { key: 'a9418954405a2cec2092bae3be5d77f02306e3c9', disabled: disabled }, h("calcite-panel", { key: 'd563c751421bf2d66c03286deaa613e09f585546', beforeClose: beforeClose, closable: closable, closed: closed, collapseDirection: collapseDirection, collapsed: collapsed, collapsible: collapsible, description: description, disabled: disabled, heading: heading, headingLevel: headingLevel, loading: loading, menuOpen: menuOpen, messageOverrides: messages, onCalcitePanelClose: this.handleInternalPanelClose, onCalcitePanelScroll: this.handleInternalPanelScroll, onCalcitePanelToggle: this.handleInternalPanelToggle, overlayPositioning: overlayPositioning, ref: this.setContainerRef, scale: this.scale }, this.renderBackButton(), h("slot", { key: 'c506ec8bb4debbd6a9da6c7941878de49776f614', name: SLOTS.actionBar, slot: SLOTS$1.actionBar }), h("slot", { key: 'e76e55e654ff878acff734bdf387402a9e262159', name: SLOTS.alerts, slot: SLOTS$1.alerts }), h("slot", { key: 'f7ab8839d7b101e31087130ebf3e36af1ec7da24', name: SLOTS.headerActionsStart, slot: SLOTS$1.headerActionsStart }), h("slot", { key: '2932c4c15b168732356b8e55fcc3064f5b3f4cf5', name: SLOTS.headerActionsEnd, slot: SLOTS$1.headerActionsEnd }), h("slot", { key: '1ef8a9050683022733695445092f8c626487d87b', name: SLOTS.headerContent, slot: SLOTS$1.headerContent }), h("slot", { key: '24c0ab570a601a6c0edfb0c820e580fd24b158ce', name: SLOTS.headerMenuActions, slot: SLOTS$1.headerMenuActions }), h("slot", { key: 'ec55bbe7ba939a6efb35225850c37a1aadb97275', name: SLOTS.fab, slot: SLOTS$1.fab }), h("slot", { key: 'aa0bfec47656ef9f7f575cd933897a7909e5badc', name: SLOTS.contentTop, slot: SLOTS$1.contentTop }), h("slot", { key: 'e23532d080e2df529c2aeb6af043c6efe7a0ab6d', name: SLOTS.contentBottom, slot: SLOTS$1.contentBottom }), h("slot", { key: 'db6ffc0d9300c77067a4c88ab277de685c7713af', name: SLOTS.footerStart, slot: SLOTS$1.footerStart }), h("slot", { key: '5f249356da9292f34c4036d0d0741f048fe999e9', name: SLOTS.footer, slot: SLOTS$1.footer }), h("slot", { key: '7476137bacc0f3be5c97682c5027f74d73254765', name: SLOTS.footerEnd, slot: SLOTS$1.footerEnd }), h("slot", { key: '58f60a46c42a05abe9b100a57d478d991e4f25bc', name: SLOTS.footerActions, slot: SLOTS$1.footerActions }), h("slot", { key: '926a8d94b76b6fcdef6dfd219ba8180c44f81c35' })))));
+        return (h(Host, { key: 'ccd0d6750da15fa4e81b417396d016d5d43e1a0f' }, h(InteractiveContainer, { key: '690e621242766e53607612c83a396422dffba869', disabled: disabled }, h("calcite-panel", { key: 'd4b422cbc57c48870d6758c2cbe280ef20e9be50', beforeClose: beforeClose, closable: closable, closed: closed, collapseDirection: collapseDirection, collapsed: collapsed, collapsible: collapsible, description: description, disabled: disabled, heading: heading, headingLevel: headingLevel, loading: loading, menuOpen: menuOpen, messageOverrides: messages, onCalcitePanelClose: this.handleInternalPanelClose, onCalcitePanelScroll: this.handleInternalPanelScroll, onCalcitePanelToggle: this.handleInternalPanelToggle, overlayPositioning: overlayPositioning, ref: this.setContainerRef, scale: this.scale }, this.renderBackButton(), h("slot", { key: '7d12c24d58e306b7a3a0bb75fa2680203c5f07f0', name: SLOTS.actionBar, slot: SLOTS$1.actionBar }), h("slot", { key: 'd3b730b9af055b17776ec3633c91291d086e9823', name: SLOTS.alerts, slot: SLOTS$1.alerts }), h("slot", { key: 'fc73b4e4891e7f86a82db85fb7a118d8102ee80e', name: SLOTS.headerActionsStart, slot: SLOTS$1.headerActionsStart }), h("slot", { key: 'e914d4f7db54c46e3155d9adda31876694a6d09a', name: SLOTS.headerActionsEnd, slot: SLOTS$1.headerActionsEnd }), h("slot", { key: 'be5fe36c5fbcec038c9994df61441356b071374d', name: SLOTS.headerContent, slot: SLOTS$1.headerContent }), h("slot", { key: '2f98458f7eef28cb34ee35233880fdb3cbb12432', name: SLOTS.headerMenuActions, slot: SLOTS$1.headerMenuActions }), h("slot", { key: 'd97b8c5944fec5ea4d96ddf695f89dceb744fc37', name: SLOTS.fab, slot: SLOTS$1.fab }), h("slot", { key: '938d06a678afca84cc1671ec42aa59eff29b682d', name: SLOTS.contentTop, slot: SLOTS$1.contentTop }), h("slot", { key: '154e247f26947d66669c39bc01a26f0db7ce6caa', name: SLOTS.contentBottom, slot: SLOTS$1.contentBottom }), h("slot", { key: 'd9c9aa3f347a6ca0b8587bb9006677da7dce5a62', name: SLOTS.footerStart, slot: SLOTS$1.footerStart }), h("slot", { key: 'b44116298ad9a597dfd33c5d2742382cfcbc6aec', name: SLOTS.footer, slot: SLOTS$1.footer }), h("slot", { key: '908a2c098342cd820deec0e0b48093bc1b31124f', name: SLOTS.footerEnd, slot: SLOTS$1.footerEnd }), h("slot", { key: '01199ddbff68aa0871c3d1bfe3cd6df4a9b446fe', name: SLOTS.footerActions, slot: SLOTS$1.footerActions }), h("slot", { key: '1359b4fd8cadb797a192c1356181adbaa28cfd12' })))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return this; }

package/dist/components/calcite-flow.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { c as createObserver } from './observers.js';
@@ -136,7 +136,7 @@ const Flow = /*@__PURE__*/ proxyCustomElement(class Flow extends HTMLElement {
             [CSS.frameAdvancing]: flowDirection === "advancing",
             [CSS.frameRetreating]: flowDirection === "retreating",
         };
-        return (h("div", { key: '01fbee965d48cb54fa5bd1b53a3435538df84332', class: frameDirectionClasses }, h("slot", { key: '495880eceeb04387dd1352aa00337f037ab0636c' })));
+        return (h("div", { key: 'eab0291ab671900012c3c39d607073bcc407a9e7', class: frameDirectionClasses }, h("slot", { key: '64a8f4ae41fd76633c85ee2d43256e1d3cead0f9' })));
     }
     get el() { return this; }
     static get style() { return CalciteFlowStyle0; }

package/dist/components/calcite-graph.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { G as Graph, d as defineCustomElement$1 } from './graph.js';
 

package/dist/components/calcite-handle.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { H as Handle, d as defineCustomElement$1 } from './handle.js';
 

package/dist/components/calcite-icon.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { I as Icon, d as defineCustomElement$1 } from './icon.js';
 

package/dist/components/calcite-inline-editable.js

@@ -1,16 +1,15 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { g as getSlotted } from './dom.js';
 import { u as updateHostInteraction, I as InteractiveContainer } from './interactive.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label.js';
+import { g as getLabelText, c as connectLabel, d as disconnectLabel } from './label.js';
 import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale.js';
-import { c as createObserver } from './observers.js';
 import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n.js';
+import { b as slotChangeGetAssignedElements } from './dom.js';
 import { d as defineCustomElement$4 } from './button.js';
 import { d as defineCustomElement$3 } from './icon.js';
 import { d as defineCustomElement$2 } from './loader.js';
@@ -36,7 +35,21 @@ const InlineEditable = /*@__PURE__*/ proxyCustomElement(class InlineEditable ext
         this.calciteInlineEditableEditCancel = createEvent(this, "calciteInlineEditableEditCancel", 6);
         this.calciteInlineEditableEditConfirm = createEvent(this, "calciteInlineEditableEditConfirm", 6);
         this.calciteInternalInlineEditableEnableEditingChange = createEvent(this, "calciteInternalInlineEditableEnableEditingChange", 6);
-        this.mutationObserver = createObserver("mutation", () => this.mutationObserverCallback());
+        //--------------------------------------------------------------------------
+        //
+        //  Private Methods
+        //
+        //--------------------------------------------------------------------------
+        this.handleDefaultSlotChange = (event) => {
+            const inputElement = slotChangeGetAssignedElements(event).filter((el) => el.matches("calcite-input"))[0];
+            this.inputElement = inputElement;
+            if (!inputElement) {
+                return;
+            }
+            inputElement.disabled = this.disabled;
+            inputElement.label = inputElement.label || getLabelText(this);
+            this.scale = this.scale || this.inputElement?.scale;
+        };
         this.enableEditing = () => {
             this.valuePriorToEditing = this.inputElement?.value;
             this.editingEnabled = true;
@@ -144,8 +157,6 @@ const InlineEditable = /*@__PURE__*/ proxyCustomElement(class InlineEditable ext
         connectLabel(this);
         connectLocalized(this);
         connectMessages(this);
-        this.mutationObserver?.observe(this.el, { childList: true });
-        this.mutationObserverCallback();
     }
     async componentWillLoad() {
         setUpLoadableComponent(this);
@@ -158,18 +169,17 @@ const InlineEditable = /*@__PURE__*/ proxyCustomElement(class InlineEditable ext
         disconnectLabel(this);
         disconnectLocalized(this);
         disconnectMessages(this);
-        this.mutationObserver?.disconnect();
     }
     componentDidRender() {
         updateHostInteraction(this);
     }
     render() {
-        return (h(InteractiveContainer, { key: '2b20c0c889e02709ab25fed13afe8cc03a0ad5a5', disabled: this.disabled }, h("div", { key: '31a6ae689e94a21c34718d848e43e7e848c82c33', class: CSS.wrapper, onClick: this.enableEditingHandler, onKeyDown: this.escapeKeyHandler }, h("div", { key: '21d48b4543d362c8253987aa04aa88b91dcbebd2', class: CSS.inputWrapper }, h("slot", { key: '1b0e62cefa8959014d776a55e882d89c1038d72e' })), h("div", { key: 'c10288b692a896c7d4a924fb3a99d5d1a0b8b655', class: CSS.controlsWrapper }, h("calcite-button", { key: '7b8312b37c3e1aa9e07b6cbad9f116c0e3b63438', appearance: "transparent", class: CSS.enableEditingButton, disabled: this.disabled, iconStart: "pencil", kind: "neutral", label: this.messages.enableEditing, onClick: this.enableEditingHandler, ref: (el) => (this.enableEditingButton = el), scale: this.scale, style: {
+        return (h(InteractiveContainer, { key: '47aba29a11e02b4397e7000f87b4fd963a3e8455', disabled: this.disabled }, h("div", { key: '16e546006242b0e18ef1ff8dea5c2a4fa2e2325e', class: CSS.wrapper, onClick: this.enableEditingHandler, onKeyDown: this.escapeKeyHandler }, h("div", { key: '173571cae937a972b47bee08b2dd8d7c9e6aff39', class: CSS.inputWrapper }, h("slot", { key: '1d1ec5c1d142093ff9c5585111707233ff5f1d88', onSlotchange: this.handleDefaultSlotChange })), h("div", { key: '3ede5ac03a835a485d5d8794b8b37c17c92526e9', class: CSS.controlsWrapper }, h("calcite-button", { key: '15ef87ec641f62f9fc8e2bb4ff5e750c9152a61c', appearance: "transparent", class: CSS.enableEditingButton, disabled: this.disabled, iconStart: "pencil", kind: "neutral", label: this.messages.enableEditing, onClick: this.enableEditingHandler, ref: (el) => (this.enableEditingButton = el), scale: this.scale, style: {
                 opacity: this.editingEnabled ? "0" : "1",
                 width: this.editingEnabled ? "0" : "inherit",
             }, type: "button" }), this.shouldShowControls && [
-            h("div", { key: '96dc366959dff0b01f2b6720d04137d978b480ba', class: CSS.cancelEditingButtonWrapper }, h("calcite-button", { key: '74263d601b8f410497061c2a61ad9a7cc0950651', appearance: "transparent", class: CSS.cancelEditingButton, disabled: this.disabled, iconStart: "x", kind: "neutral", label: this.messages.cancelEditing, onClick: this.cancelEditingHandler, ref: (el) => (this.cancelEditingButton = el), scale: this.scale, type: "button" })),
-            h("calcite-button", { key: 'b6b0853810cb99eb88c908487078cc74e05f48bc', appearance: "solid", class: CSS.confirmChangesButton, disabled: this.disabled, iconStart: "check", kind: "brand", label: this.messages.confirmChanges, loading: this.loading, onClick: this.confirmChangesHandler, ref: (el) => (this.confirmEditingButton = el), scale: this.scale, type: "button" }),
+            h("div", { key: 'fc37081fd7ba722a4d2f30d3a3dc91b4a6adb127', class: CSS.cancelEditingButtonWrapper }, h("calcite-button", { key: '7e3e3ff26034d053d7994b0fedf4c2dc2991312b', appearance: "transparent", class: CSS.cancelEditingButton, disabled: this.disabled, iconStart: "x", kind: "neutral", label: this.messages.cancelEditing, onClick: this.cancelEditingHandler, ref: (el) => (this.cancelEditingButton = el), scale: this.scale, type: "button" })),
+            h("calcite-button", { key: 'e6d5fd66a37b89c83e700bd62616f705380d0515', appearance: "solid", class: CSS.confirmChangesButton, disabled: this.disabled, iconStart: "check", kind: "brand", label: this.messages.confirmChanges, loading: this.loading, onClick: this.confirmChangesHandler, ref: (el) => (this.confirmEditingButton = el), scale: this.scale, type: "button" }),
         ]))));
     }
     //--------------------------------------------------------------------------
@@ -195,29 +205,9 @@ const InlineEditable = /*@__PURE__*/ proxyCustomElement(class InlineEditable ext
         await componentFocusable(this);
         this.el?.focus();
     }
-    //--------------------------------------------------------------------------
-    //
-    //  Private Methods
-    //
-    //--------------------------------------------------------------------------
-    mutationObserverCallback() {
-        this.updateSlottedInput();
-        this.scale = this.scale || this.inputElement?.scale;
-    }
     onLabelClick() {
         this.setFocus();
     }
-    updateSlottedInput() {
-        const inputElement = getSlotted(this.el, {
-            matches: "calcite-input",
-        });
-        this.inputElement = inputElement;
-        if (!inputElement) {
-            return;
-        }
-        this.inputElement.disabled = this.disabled;
-        this.inputElement.label = this.inputElement.label || getLabelText(this);
-    }
     get shouldShowControls() {
         return this.editingEnabled && this.controls;
     }

package/dist/components/calcite-inline-editable.js.map

@@ -1 +1 @@
-{"file":"calcite-inline-editable.js","mappings":"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","names":[],"sources":["src/components/inline-editable/resources.ts","src/components/inline-editable/inline-editable.scss?tag=calcite-inline-editable&encapsulation=shadow","src/components/inline-editable/inline-editable.tsx"],"sourcesContent":["export const CSS = {\n  wrapper: \"wrapper\",\n  confirmChangesButton: \"confirm-changes-button\",\n  cancelEditingButton: \"cancel-editing-button\",\n  inputWrapper: \"input-wrapper\",\n  cancelEditingButtonWrapper: \"cancel-editing-button-wrapper\",\n  enableEditingButton: \"enable-editing-button\",\n  controlsWrapper: \"controls-wrapper\",\n};\n",":host {\n  @apply block;\n}\n\n:host([scale=\"s\"]) {\n  .controls-wrapper {\n    @apply h-6;\n  }\n}\n\n:host([scale=\"m\"]) {\n  .controls-wrapper {\n    @apply h-8;\n  }\n}\n\n:host([scale=\"l\"]) {\n  .controls-wrapper {\n    @apply h-11;\n  }\n}\n\n:host(:not([editing-enabled]):not([disabled])) {\n  .wrapper {\n    &:hover {\n      @apply bg-foreground-2;\n    }\n  }\n}\n\n.wrapper {\n  @apply bg-foreground-1\n    transition-default\n    box-border\n    flex\n    justify-between;\n\n  .input-wrapper {\n    @apply flex-1;\n  }\n}\n\n.controls-wrapper {\n  @apply flex;\n}\n\n@include disabled() {\n  .cancel-editing-button-wrapper {\n    @apply border-color-2;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { getSlotted } from \"../../utils/dom\";\nimport {\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { connectLabel, disconnectLabel, getLabelText, LabelableComponent } from \"../../utils/label\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport { createObserver } from \"../../utils/observers\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Scale } from \"../interfaces\";\nimport { InlineEditableMessages } from \"./assets/inline-editable/t9n\";\nimport { CSS } from \"./resources\";\n\n/**\n * @slot - A slot for adding a `calcite-input`.\n */\n@Component({\n  tag: \"calcite-inline-editable\",\n  shadow: {\n    delegatesFocus: true,\n  },\n  styleUrl: \"inline-editable.scss\",\n  assetsDirs: [\"assets\"],\n})\nexport class InlineEditable\n  implements\n    InteractiveComponent,\n    LabelableComponent,\n    LoadableComponent,\n    LocalizedComponent,\n    T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Props\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  @Watch(\"disabled\")\n  disabledWatcher(disabled: boolean): void {\n    if (this.inputElement) {\n      this.inputElement.disabled = disabled;\n    }\n  }\n\n  /**\n   * When `true`, inline editing is enabled on the component.\n   */\n  @Prop({ mutable: true, reflect: true }) editingEnabled = false;\n\n  @Watch(\"editingEnabled\")\n  editingEnabledWatcher(newValue: boolean, oldValue: boolean): void {\n    if (this.inputElement) {\n      this.inputElement.editingEnabled = newValue;\n    }\n    if (!newValue && !!oldValue) {\n      this.shouldEmitCancel = true;\n    }\n  }\n\n  /** When `true`, a busy indicator is displayed. */\n  @Prop({ mutable: true, reflect: true }) loading = false;\n\n  /** When `true` and `editingEnabled` is `true`, displays save and cancel controls on the component. */\n  @Prop({ reflect: true }) controls = false;\n\n  /** Specifies the size of the component. Defaults to the scale of the wrapped `calcite-input` or the scale of the closest wrapping component with a set scale. */\n  @Prop({ reflect: true, mutable: true }) scale: Scale;\n\n  /** Specifies a callback to be executed prior to disabling editing via the controls. When provided, the component's loading state will be handled automatically. */\n  @Prop() afterConfirm: () => Promise<void>;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: InlineEditableMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<InlineEditableMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback() {\n    connectLabel(this);\n    connectLocalized(this);\n    connectMessages(this);\n    this.mutationObserver?.observe(this.el, { childList: true });\n    this.mutationObserverCallback();\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback() {\n    disconnectLabel(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.mutationObserver?.disconnect();\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  render(): VNode {\n    return (\n      <InteractiveContainer disabled={this.disabled}>\n        <div\n          class={CSS.wrapper}\n          onClick={this.enableEditingHandler}\n          onKeyDown={this.escapeKeyHandler}\n        >\n          <div class={CSS.inputWrapper}>\n            <slot />\n          </div>\n          <div class={CSS.controlsWrapper}>\n            <calcite-button\n              appearance=\"transparent\"\n              class={CSS.enableEditingButton}\n              disabled={this.disabled}\n              iconStart=\"pencil\"\n              kind=\"neutral\"\n              label={this.messages.enableEditing}\n              onClick={this.enableEditingHandler}\n              ref={(el) => (this.enableEditingButton = el)}\n              scale={this.scale}\n              style={{\n                opacity: this.editingEnabled ? \"0\" : \"1\",\n                width: this.editingEnabled ? \"0\" : \"inherit\",\n              }}\n              type=\"button\"\n            />\n            {this.shouldShowControls && [\n              <div class={CSS.cancelEditingButtonWrapper}>\n                <calcite-button\n                  appearance=\"transparent\"\n                  class={CSS.cancelEditingButton}\n                  disabled={this.disabled}\n                  iconStart=\"x\"\n                  kind=\"neutral\"\n                  label={this.messages.cancelEditing}\n                  onClick={this.cancelEditingHandler}\n                  ref={(el) => (this.cancelEditingButton = el)}\n                  scale={this.scale}\n                  type=\"button\"\n                />\n              </div>,\n              <calcite-button\n                appearance=\"solid\"\n                class={CSS.confirmChangesButton}\n                disabled={this.disabled}\n                iconStart=\"check\"\n                kind=\"brand\"\n                label={this.messages.confirmChanges}\n                loading={this.loading}\n                onClick={this.confirmChangesHandler}\n                ref={(el) => (this.confirmEditingButton = el)}\n                scale={this.scale}\n                type=\"button\"\n              />,\n            ]}\n          </div>\n        </div>\n      </InteractiveContainer>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emits when the component's \"cancel editing\" button is pressed.\n   */\n  @Event({ cancelable: false }) calciteInlineEditableEditCancel: EventEmitter<void>;\n\n  /**\n   * Emits when the component's \"confirm edits\" button is pressed.\n   */\n  @Event({ cancelable: false }) calciteInlineEditableEditConfirm: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false })\n  calciteInternalInlineEditableEnableEditingChange: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalInputBlur\")\n  blurHandler(): void {\n    if (!this.controls) {\n      this.disableEditing();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteInlineEditableElement;\n\n  private inputElement: HTMLCalciteInputElement;\n\n  private valuePriorToEditing: string;\n\n  private shouldEmitCancel: boolean;\n\n  private enableEditingButton: HTMLCalciteButtonElement;\n\n  private cancelEditingButton: HTMLCalciteButtonElement;\n\n  private confirmEditingButton: HTMLCalciteButtonElement;\n\n  labelEl: HTMLCalciteLabelElement;\n\n  mutationObserver = createObserver(\"mutation\", () => this.mutationObserverCallback());\n\n  @State() defaultMessages: InlineEditableMessages;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    this.el?.focus();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  mutationObserverCallback(): void {\n    this.updateSlottedInput();\n    this.scale = this.scale || this.inputElement?.scale;\n  }\n\n  onLabelClick(): void {\n    this.setFocus();\n  }\n\n  updateSlottedInput(): void {\n    const inputElement: HTMLCalciteInputElement = getSlotted(this.el, {\n      matches: \"calcite-input\",\n    });\n\n    this.inputElement = inputElement;\n\n    if (!inputElement) {\n      return;\n    }\n\n    this.inputElement.disabled = this.disabled;\n    this.inputElement.label = this.inputElement.label || getLabelText(this);\n  }\n\n  private get shouldShowControls(): boolean {\n    return this.editingEnabled && this.controls;\n  }\n\n  private enableEditing = () => {\n    this.valuePriorToEditing = this.inputElement?.value;\n    this.editingEnabled = true;\n    this.inputElement?.setFocus();\n    this.calciteInternalInlineEditableEnableEditingChange.emit();\n  };\n\n  private disableEditing = () => {\n    this.editingEnabled = false;\n  };\n\n  private cancelEditing = () => {\n    if (this.inputElement) {\n      this.inputElement.value = this.valuePriorToEditing;\n    }\n    this.disableEditing();\n    this.enableEditingButton.setFocus();\n    if (!this.editingEnabled && !!this.shouldEmitCancel) {\n      this.calciteInlineEditableEditCancel.emit();\n    }\n  };\n\n  private escapeKeyHandler = async (event: KeyboardEvent) => {\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (event.key === \"Escape\") {\n      event.preventDefault();\n      this.cancelEditing();\n    }\n\n    if (event.key === \"Tab\" && this.shouldShowControls) {\n      if (!event.shiftKey && event.target === this.inputElement) {\n        event.preventDefault();\n        this.cancelEditingButton.setFocus();\n      }\n      if (!!event.shiftKey && event.target === this.cancelEditingButton) {\n        event.preventDefault();\n        this.inputElement?.setFocus();\n      }\n    }\n  };\n\n  private cancelEditingHandler = async (event: MouseEvent) => {\n    event.preventDefault();\n    this.cancelEditing();\n  };\n\n  private enableEditingHandler = async (event: MouseEvent) => {\n    if (\n      this.disabled ||\n      event.target === this.cancelEditingButton ||\n      event.target === this.confirmEditingButton\n    ) {\n      return;\n    }\n\n    event.preventDefault();\n    if (!this.editingEnabled) {\n      this.enableEditing();\n    }\n  };\n\n  private confirmChangesHandler = async (event: MouseEvent) => {\n    event.preventDefault();\n    this.calciteInlineEditableEditConfirm.emit();\n    try {\n      if (this.afterConfirm) {\n        this.loading = true;\n        await this.afterConfirm();\n        this.disableEditing();\n        this.enableEditingButton.setFocus();\n      }\n    } catch (error) {\n      // we handle error in finally block\n    } finally {\n      this.loading = false;\n    }\n  };\n}\n"],"version":3}
+{"file":"calcite-inline-editable.js","mappings":"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","names":[],"sources":["src/components/inline-editable/resources.ts","src/components/inline-editable/inline-editable.scss?tag=calcite-inline-editable&encapsulation=shadow","src/components/inline-editable/inline-editable.tsx"],"sourcesContent":["export const CSS = {\n  wrapper: \"wrapper\",\n  confirmChangesButton: \"confirm-changes-button\",\n  cancelEditingButton: \"cancel-editing-button\",\n  inputWrapper: \"input-wrapper\",\n  cancelEditingButtonWrapper: \"cancel-editing-button-wrapper\",\n  enableEditingButton: \"enable-editing-button\",\n  controlsWrapper: \"controls-wrapper\",\n};\n",":host {\n  @apply block;\n}\n\n:host([scale=\"s\"]) {\n  .controls-wrapper {\n    @apply h-6;\n  }\n}\n\n:host([scale=\"m\"]) {\n  .controls-wrapper {\n    @apply h-8;\n  }\n}\n\n:host([scale=\"l\"]) {\n  .controls-wrapper {\n    @apply h-11;\n  }\n}\n\n:host(:not([editing-enabled]):not([disabled])) {\n  .wrapper {\n    &:hover {\n      @apply bg-foreground-2;\n    }\n  }\n}\n\n.wrapper {\n  @apply bg-foreground-1\n    transition-default\n    box-border\n    flex\n    justify-between;\n\n  .input-wrapper {\n    @apply flex-1;\n  }\n}\n\n.controls-wrapper {\n  @apply flex;\n}\n\n@include disabled() {\n  .cancel-editing-button-wrapper {\n    @apply border-color-2;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { connectLabel, disconnectLabel, getLabelText, LabelableComponent } from \"../../utils/label\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Scale } from \"../interfaces\";\nimport { slotChangeGetAssignedElements } from \"../../utils/dom\";\nimport { InlineEditableMessages } from \"./assets/inline-editable/t9n\";\nimport { CSS } from \"./resources\";\n\n/**\n * @slot - A slot for adding a `calcite-input`.\n */\n@Component({\n  tag: \"calcite-inline-editable\",\n  shadow: {\n    delegatesFocus: true,\n  },\n  styleUrl: \"inline-editable.scss\",\n  assetsDirs: [\"assets\"],\n})\nexport class InlineEditable\n  implements\n    InteractiveComponent,\n    LabelableComponent,\n    LoadableComponent,\n    LocalizedComponent,\n    T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Props\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  @Watch(\"disabled\")\n  disabledWatcher(disabled: boolean): void {\n    if (this.inputElement) {\n      this.inputElement.disabled = disabled;\n    }\n  }\n\n  /**\n   * When `true`, inline editing is enabled on the component.\n   */\n  @Prop({ mutable: true, reflect: true }) editingEnabled = false;\n\n  @Watch(\"editingEnabled\")\n  editingEnabledWatcher(newValue: boolean, oldValue: boolean): void {\n    if (this.inputElement) {\n      this.inputElement.editingEnabled = newValue;\n    }\n    if (!newValue && !!oldValue) {\n      this.shouldEmitCancel = true;\n    }\n  }\n\n  /** When `true`, a busy indicator is displayed. */\n  @Prop({ mutable: true, reflect: true }) loading = false;\n\n  /** When `true` and `editingEnabled` is `true`, displays save and cancel controls on the component. */\n  @Prop({ reflect: true }) controls = false;\n\n  /** Specifies the size of the component. Defaults to the scale of the wrapped `calcite-input` or the scale of the closest wrapping component with a set scale. */\n  @Prop({ reflect: true, mutable: true }) scale: Scale;\n\n  /** Specifies a callback to be executed prior to disabling editing via the controls. When provided, the component's loading state will be handled automatically. */\n  @Prop() afterConfirm: () => Promise<void>;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: InlineEditableMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<InlineEditableMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback() {\n    connectLabel(this);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback() {\n    disconnectLabel(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  render(): VNode {\n    return (\n      <InteractiveContainer disabled={this.disabled}>\n        <div\n          class={CSS.wrapper}\n          onClick={this.enableEditingHandler}\n          onKeyDown={this.escapeKeyHandler}\n        >\n          <div class={CSS.inputWrapper}>\n            <slot onSlotchange={this.handleDefaultSlotChange} />\n          </div>\n          <div class={CSS.controlsWrapper}>\n            <calcite-button\n              appearance=\"transparent\"\n              class={CSS.enableEditingButton}\n              disabled={this.disabled}\n              iconStart=\"pencil\"\n              kind=\"neutral\"\n              label={this.messages.enableEditing}\n              onClick={this.enableEditingHandler}\n              ref={(el) => (this.enableEditingButton = el)}\n              scale={this.scale}\n              style={{\n                opacity: this.editingEnabled ? \"0\" : \"1\",\n                width: this.editingEnabled ? \"0\" : \"inherit\",\n              }}\n              type=\"button\"\n            />\n            {this.shouldShowControls && [\n              <div class={CSS.cancelEditingButtonWrapper}>\n                <calcite-button\n                  appearance=\"transparent\"\n                  class={CSS.cancelEditingButton}\n                  disabled={this.disabled}\n                  iconStart=\"x\"\n                  kind=\"neutral\"\n                  label={this.messages.cancelEditing}\n                  onClick={this.cancelEditingHandler}\n                  ref={(el) => (this.cancelEditingButton = el)}\n                  scale={this.scale}\n                  type=\"button\"\n                />\n              </div>,\n              <calcite-button\n                appearance=\"solid\"\n                class={CSS.confirmChangesButton}\n                disabled={this.disabled}\n                iconStart=\"check\"\n                kind=\"brand\"\n                label={this.messages.confirmChanges}\n                loading={this.loading}\n                onClick={this.confirmChangesHandler}\n                ref={(el) => (this.confirmEditingButton = el)}\n                scale={this.scale}\n                type=\"button\"\n              />,\n            ]}\n          </div>\n        </div>\n      </InteractiveContainer>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emits when the component's \"cancel editing\" button is pressed.\n   */\n  @Event({ cancelable: false }) calciteInlineEditableEditCancel: EventEmitter<void>;\n\n  /**\n   * Emits when the component's \"confirm edits\" button is pressed.\n   */\n  @Event({ cancelable: false }) calciteInlineEditableEditConfirm: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false })\n  calciteInternalInlineEditableEnableEditingChange: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalInputBlur\")\n  blurHandler(): void {\n    if (!this.controls) {\n      this.disableEditing();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteInlineEditableElement;\n\n  private inputElement: HTMLCalciteInputElement;\n\n  private valuePriorToEditing: string;\n\n  private shouldEmitCancel: boolean;\n\n  private enableEditingButton: HTMLCalciteButtonElement;\n\n  private cancelEditingButton: HTMLCalciteButtonElement;\n\n  private confirmEditingButton: HTMLCalciteButtonElement;\n\n  labelEl: HTMLCalciteLabelElement;\n\n  @State() defaultMessages: InlineEditableMessages;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    this.el?.focus();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  handleDefaultSlotChange = (event: Event): void => {\n    const inputElement = slotChangeGetAssignedElements(event).filter(\n      (el): el is HTMLCalciteInputElement => el.matches(\"calcite-input\"),\n    )[0];\n\n    this.inputElement = inputElement;\n\n    if (!inputElement) {\n      return;\n    }\n\n    inputElement.disabled = this.disabled;\n    inputElement.label = inputElement.label || getLabelText(this);\n    this.scale = this.scale || this.inputElement?.scale;\n  };\n\n  onLabelClick(): void {\n    this.setFocus();\n  }\n\n  private get shouldShowControls(): boolean {\n    return this.editingEnabled && this.controls;\n  }\n\n  private enableEditing = () => {\n    this.valuePriorToEditing = this.inputElement?.value;\n    this.editingEnabled = true;\n    this.inputElement?.setFocus();\n    this.calciteInternalInlineEditableEnableEditingChange.emit();\n  };\n\n  private disableEditing = () => {\n    this.editingEnabled = false;\n  };\n\n  private cancelEditing = () => {\n    if (this.inputElement) {\n      this.inputElement.value = this.valuePriorToEditing;\n    }\n    this.disableEditing();\n    this.enableEditingButton.setFocus();\n    if (!this.editingEnabled && !!this.shouldEmitCancel) {\n      this.calciteInlineEditableEditCancel.emit();\n    }\n  };\n\n  private escapeKeyHandler = async (event: KeyboardEvent) => {\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (event.key === \"Escape\") {\n      event.preventDefault();\n      this.cancelEditing();\n    }\n\n    if (event.key === \"Tab\" && this.shouldShowControls) {\n      if (!event.shiftKey && event.target === this.inputElement) {\n        event.preventDefault();\n        this.cancelEditingButton.setFocus();\n      }\n      if (!!event.shiftKey && event.target === this.cancelEditingButton) {\n        event.preventDefault();\n        this.inputElement?.setFocus();\n      }\n    }\n  };\n\n  private cancelEditingHandler = async (event: MouseEvent) => {\n    event.preventDefault();\n    this.cancelEditing();\n  };\n\n  private enableEditingHandler = async (event: MouseEvent) => {\n    if (\n      this.disabled ||\n      event.target === this.cancelEditingButton ||\n      event.target === this.confirmEditingButton\n    ) {\n      return;\n    }\n\n    event.preventDefault();\n    if (!this.editingEnabled) {\n      this.enableEditing();\n    }\n  };\n\n  private confirmChangesHandler = async (event: MouseEvent) => {\n    event.preventDefault();\n    this.calciteInlineEditableEditConfirm.emit();\n    try {\n      if (this.afterConfirm) {\n        this.loading = true;\n        await this.afterConfirm();\n        this.disableEditing();\n        this.enableEditingButton.setFocus();\n      }\n    } catch (error) {\n      // we handle error in finally block\n    } finally {\n      this.loading = false;\n    }\n  };\n}\n"],"version":3}

package/dist/components/calcite-input-date-picker.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { j as datePartsFromISO, k as datePartsFromLocalizedString, l as dateFromLocalizedString, i as inRange, a as dateToISO, d as dateFromISO, b as dateFromRange } from './date.js';
@@ -543,23 +543,23 @@ const InputDatePicker = /*@__PURE__*/ proxyCustomElement(class InputDatePicker e
             locale: effectiveLocale,
             useGrouping: false,
         };
-        return (h(Host, { key: 'b31ae837415083aa63451c5f32b78253b1d6af1e', onBlur: this.blurHandler, onKeyDown: this.keyDownHandler }, h(InteractiveContainer, { key: '7315a0e5773a1ef96c00b48b138c8afd50aca28a', disabled: this.disabled }, this.localeData && (h("div", { key: '022f86001938e2994ab523b30a2e3cb379a550b4', class: CSS.inputContainer }, h("div", { key: '4a3add7824ea7ec41b75ddd5e9b847afa1ca0708', class: CSS.inputWrapper, "data-position": "start", onClick: this.onInputWrapperClick, onPointerDown: this.onInputWrapperPointerDown, ref: this.setStartWrapper }, h("calcite-input-text", { key: 'd415c8d890333f76793fc5f804111c0a72f4d3c8', "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-describedby": this.placeholderTextId, "aria-errormessage": IDS.validationMessage, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", "aria-invalid": toAriaBoolean(this.status === "invalid"), class: {
+        return (h(Host, { key: 'af6a411d495acdf0b96d6aef7fcbc4a16dbee824', onBlur: this.blurHandler, onKeyDown: this.keyDownHandler }, h(InteractiveContainer, { key: '276559025b59e684be33145fdc1ebb54fc497905', disabled: this.disabled }, this.localeData && (h("div", { key: '929abf4e68279ff6e121864678bb8256c35f3fac', class: CSS.inputContainer }, h("div", { key: '0b6c5aff1ee9c34f3384a756e24e0fd42402ff20', class: CSS.inputWrapper, "data-position": "start", onClick: this.onInputWrapperClick, onPointerDown: this.onInputWrapperPointerDown, ref: this.setStartWrapper }, h("calcite-input-text", { key: '88fc779558736b876d689c81f54625b12b2b3053', "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-describedby": this.placeholderTextId, "aria-errormessage": IDS.validationMessage, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", "aria-invalid": toAriaBoolean(this.status === "invalid"), class: {
                 [CSS.input]: true,
                 [CSS.inputNoBottomBorder]: this.layout === "vertical" && this.range,
             }, disabled: disabled, icon: "calendar", onCalciteInputTextInput: this.calciteInternalInputInputHandler, onCalciteInternalInputTextBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputTextFocus: this.startInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, ref: this.setStartInput, role: "combobox", scale: this.scale, status: this.status }), !this.readOnly &&
-            this.renderToggleIcon(this.open && this.focusedInput === "start"), h("span", { key: '7d5b86f35bde88b757f9a46485ce37bf8317ac88', "aria-hidden": "true", class: CSS.assistiveText, id: this.placeholderTextId }, "Date Format: ", this.localeData?.placeholder)), h("div", { key: '8d38fc155dcc3851865e699645f64e3278519f02', "aria-hidden": toAriaBoolean(!this.open), "aria-label": messages.chooseDate, "aria-live": "polite", "aria-modal": "true", class: {
+            this.renderToggleIcon(this.open && this.focusedInput === "start"), h("span", { key: '63defeb887ec40a1a1444047a574b150530db269', "aria-hidden": "true", class: CSS.assistiveText, id: this.placeholderTextId }, "Date Format: ", this.localeData?.placeholder)), h("div", { key: '29d287235f5f8080420470ab82800c3fc62d687a', "aria-hidden": toAriaBoolean(!this.open), "aria-label": messages.chooseDate, "aria-live": "polite", "aria-modal": "true", class: {
                 [CSS.menu]: true,
                 [CSS.menuActive]: this.open,
-            }, id: this.dialogId, ref: this.setFloatingEl, role: "dialog" }, h("div", { key: '92b37e521a0d2e0e8fb30ca129a53e75d26e9dd6', class: {
+            }, id: this.dialogId, ref: this.setFloatingEl, role: "dialog" }, h("div", { key: '2c3591bab4ba0dddae4d212e450d7f50ad8c08fc', class: {
                 [CSS.calendarWrapper]: true,
                 [CSS.calendarWrapperEnd]: this.focusedInput === "end",
                 [FloatingCSS.animation]: true,
                 [FloatingCSS.animationActive]: this.open,
-            }, ref: this.setTransitionEl }, h("calcite-date-picker", { key: '35aa39e5552eff762bb58368b4cbe1069692ee38', 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, ref: this.setDatePickerRef, scale: this.scale, tabIndex: this.open ? undefined : -1, valueAsDate: this.valueAsDate }))), this.range && this.layout === "horizontal" && (h("div", { key: '386b0a687fc16a4f96ef9cc199aca653ab90071b', class: CSS.horizontalArrowContainer }, h("calcite-icon", { key: '65b1d5b9e7b77f524ef40cd1f0efda3776db33e1', flipRtl: true, icon: "arrow-right", scale: getIconScale(this.scale) }))), this.range && this.layout === "vertical" && this.scale !== "s" && (h("div", { key: '50b0b98f4d51c5866557ab5691692a42704d08f2', class: CSS.verticalArrowContainer }, h("calcite-icon", { key: '48758a61b800c61109b492d77ca468519ad65227', icon: "arrow-down", scale: getIconScale(this.scale) }))), this.range && (h("div", { key: 'af12058d6a8d299fd988ae4ac7fc0422d05342c6', class: CSS.inputWrapper, "data-position": "end", onClick: this.onInputWrapperClick, onPointerDown: this.onInputWrapperPointerDown, ref: this.setEndWrapper }, h("calcite-input-text", { key: '38c68e0df3d516ea5b840a1a937d1af6d1c971b0', "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-errormessage": IDS.validationMessage, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", "aria-invalid": toAriaBoolean(this.status === "invalid"), class: {
+            }, ref: this.setTransitionEl }, h("calcite-date-picker", { key: 'c1c74964ba43e80365bd5e4774dbf9e353f28960', 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, ref: this.setDatePickerRef, scale: this.scale, tabIndex: this.open ? undefined : -1, valueAsDate: this.valueAsDate }))), this.range && this.layout === "horizontal" && (h("div", { key: '2bdc3a8473b8e21ac202966ed8940216386a86dd', class: CSS.horizontalArrowContainer }, h("calcite-icon", { key: 'fd80a1723c5132f6ecb73b850c2f29906783dc2f', flipRtl: true, icon: "arrow-right", scale: getIconScale(this.scale) }))), this.range && this.layout === "vertical" && this.scale !== "s" && (h("div", { key: '4bc93f2e6983024e186ec3deddf38d5e375940a6', class: CSS.verticalArrowContainer }, h("calcite-icon", { key: '7496a51302115c2ae7e5a4b67db033bcbfe190e4', icon: "arrow-down", scale: getIconScale(this.scale) }))), this.range && (h("div", { key: '6a4bca2721c6ee243175dccbd3e55ab30715599b', class: CSS.inputWrapper, "data-position": "end", onClick: this.onInputWrapperClick, onPointerDown: this.onInputWrapperPointerDown, ref: this.setEndWrapper }, h("calcite-input-text", { key: '095b3d8b969e616e87d5de66c884d7ea8c8231e6', "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-errormessage": IDS.validationMessage, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", "aria-invalid": toAriaBoolean(this.status === "invalid"), class: {
                 [CSS.input]: true,
                 [CSS.inputBorderTopColorOne]: this.layout === "vertical" && this.range,
             }, disabled: disabled, icon: "calendar", onCalciteInputTextInput: this.calciteInternalInputInputHandler, onCalciteInternalInputTextBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputTextFocus: this.endInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, ref: this.setEndInput, role: "combobox", scale: this.scale, status: this.status }), !this.readOnly &&
-            this.renderToggleIcon(this.open && this.focusedInput === "end"))))), h(HiddenFormInputSlot, { key: '65e98114397e07a95ccf82217412360be3a36d96', component: this }), this.validationMessage && this.status === "invalid" ? (h(Validation, { icon: this.validationIcon, id: IDS.validationMessage, message: this.validationMessage, scale: this.scale, status: this.status })) : null)));
+            this.renderToggleIcon(this.open && this.focusedInput === "end"))))), h(HiddenFormInputSlot, { key: 'b7c073ea8c135ee82bdb267701ad5c7fbea96af4', component: this }), this.validationMessage && this.status === "invalid" ? (h(Validation, { icon: this.validationIcon, id: IDS.validationMessage, message: this.validationMessage, scale: this.scale, status: this.status })) : null)));
     }
     renderToggleIcon(open) {
         return (

package/dist/components/calcite-input-message.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { I as InputMessage, d as defineCustomElement$1 } from './input-message.js';
 

package/dist/components/calcite-input-number.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { I as InputNumber, d as defineCustomElement$1 } from './input-number.js';
 

package/dist/components/calcite-input-text.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { I as InputText, d as defineCustomElement$1 } from './input-text.js';
 

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

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form.js';
@@ -1833,7 +1833,7 @@ const InputTimePicker = /*@__PURE__*/ proxyCustomElement(class InputTimePicker e
     // --------------------------------------------------------------------------
     render() {
         const { disabled, messages, readOnly } = this;
-        return (h(Host, { key: '7d5021d0867938190a71ecc258687504668aa919', onBlur: this.hostBlurHandler, onKeyDown: this.keyDownHandler }, h(InteractiveContainer, { key: '3df503ada54e8259f0e4e7013191942e4bc17020', disabled: this.disabled }, h("div", { key: '748dd86d90db29b4baaa1af42839b3b234e54d0b', class: "input-wrapper", onClick: this.onInputWrapperClick }, h("calcite-input-text", { key: 'af404dc58cb00afb62ecef587db4426bfc7b3495', "aria-autocomplete": "none", "aria-errormessage": IDS.validationMessage, "aria-haspopup": "dialog", "aria-invalid": toAriaBoolean(this.status === "invalid"), disabled: disabled, icon: "clock", label: getLabelText(this), lang: this.effectiveLocale, onCalciteInputTextInput: this.calciteInternalInputInputHandler, onCalciteInternalInputTextFocus: this.calciteInternalInputFocusHandler, readOnly: readOnly, ref: this.setInputEl, role: "combobox", scale: this.scale, status: this.status }, !this.readOnly && this.renderToggleIcon(this.open))), h("calcite-popover", { key: '93f1e3a580ad988617e4959a2e379f03a5128bf0', autoClose: true, focusTrapDisabled: true, label: messages.chooseTime, lang: this.effectiveLocale, onCalcitePopoverBeforeClose: this.popoverBeforeCloseHandler, onCalcitePopoverBeforeOpen: this.popoverBeforeOpenHandler, onCalcitePopoverClose: this.popoverCloseHandler, onCalcitePopoverOpen: this.popoverOpenHandler, overlayPositioning: this.overlayPositioning, placement: this.placement, ref: this.setCalcitePopoverEl, referenceElement: this.calciteInputEl, triggerDisabled: true }, h("calcite-time-picker", { key: '264696f0f4187f69999b4d751ffbe02759214e78', lang: this.effectiveLocale, messageOverrides: this.messageOverrides, numberingSystem: this.numberingSystem, onCalciteInternalTimePickerChange: this.timePickerChangeHandler, ref: this.setCalciteTimePickerEl, scale: this.scale, step: this.step, tabIndex: this.open ? undefined : -1, value: this.value })), h(HiddenFormInputSlot, { key: '73e605e12a6de2c5480e392cbfbea09025243111', component: this }), this.validationMessage && this.status === "invalid" ? (h(Validation, { icon: this.validationIcon, id: IDS.validationMessage, message: this.validationMessage, scale: this.scale, status: this.status })) : null)));
+        return (h(Host, { key: 'a9c59ea31724da7dc11c329c56bb8b75e63cd0bd', onBlur: this.hostBlurHandler, onKeyDown: this.keyDownHandler }, h(InteractiveContainer, { key: '03239bf75c69f3684e57d42189eb2a6e9b8df242', disabled: this.disabled }, h("div", { key: '7377ce3d946a38bf42fe8b8cb40b62bb8ee4cf7c', class: "input-wrapper", onClick: this.onInputWrapperClick }, h("calcite-input-text", { key: '02daf661f8c30963f5a152bbba8fae3742f55a2f', "aria-autocomplete": "none", "aria-errormessage": IDS.validationMessage, "aria-haspopup": "dialog", "aria-invalid": toAriaBoolean(this.status === "invalid"), disabled: disabled, icon: "clock", label: getLabelText(this), lang: this.effectiveLocale, onCalciteInputTextInput: this.calciteInternalInputInputHandler, onCalciteInternalInputTextFocus: this.calciteInternalInputFocusHandler, readOnly: readOnly, ref: this.setInputEl, role: "combobox", scale: this.scale, status: this.status }, !this.readOnly && this.renderToggleIcon(this.open))), h("calcite-popover", { key: '4dbf1dcd32bf112e1516e3cf6942f97ca5df4100', autoClose: true, focusTrapDisabled: true, label: messages.chooseTime, lang: this.effectiveLocale, onCalcitePopoverBeforeClose: this.popoverBeforeCloseHandler, onCalcitePopoverBeforeOpen: this.popoverBeforeOpenHandler, onCalcitePopoverClose: this.popoverCloseHandler, onCalcitePopoverOpen: this.popoverOpenHandler, overlayPositioning: this.overlayPositioning, placement: this.placement, ref: this.setCalcitePopoverEl, referenceElement: this.calciteInputEl, triggerDisabled: true }, h("calcite-time-picker", { key: '886390a2d65c8f8f9489338abd61e6ba1f772f52', lang: this.effectiveLocale, messageOverrides: this.messageOverrides, numberingSystem: this.numberingSystem, onCalciteInternalTimePickerChange: this.timePickerChangeHandler, ref: this.setCalciteTimePickerEl, scale: this.scale, step: this.step, tabIndex: this.open ? undefined : -1, value: this.value })), h(HiddenFormInputSlot, { key: '6b2c11d9dc1fa04ee6ef77004b1466eeb009cb52', component: this }), this.validationMessage && this.status === "invalid" ? (h(Validation, { icon: this.validationIcon, id: IDS.validationMessage, message: this.validationMessage, scale: this.scale, status: this.status })) : null)));
     }
     renderToggleIcon(open) {
         return (h("span", { class: CSS.toggleIcon, slot: "action" }, h("calcite-icon", { icon: open ? "chevron-up" : "chevron-down", scale: getIconScale(this.scale) })));

package/dist/components/calcite-input-time-zone.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { c as connectLabel, d as disconnectLabel } from './label.js';
@@ -448,11 +448,11 @@ const InputTimeZone = /*@__PURE__*/ proxyCustomElement(class InputTimeZone exten
         this.overrideSelectedLabelForRegion(this.open);
     }
     render() {
-        return (h(Host, { key: 'b94fb2d93cdcaf0c44bbd2a0c7deaf59701078bf' }, h(InteractiveContainer, { key: '45246bbab441e9daf0e372832e74d7660039c770', disabled: this.disabled }, h("calcite-combobox", { key: '294e44d8ab01079651c417f7808348e584f135b7', clearDisabled: !this.clearable, disabled: this.disabled, label: this.messages.chooseTimeZone, lang: this.effectiveLocale, maxItems: this.maxItems, onCalciteComboboxBeforeClose: this.onComboboxBeforeClose, onCalciteComboboxBeforeOpen: this.onComboboxBeforeOpen, onCalciteComboboxChange: this.onComboboxChange, onCalciteComboboxClose: this.onComboboxClose, onCalciteComboboxOpen: this.onComboboxOpen, overlayPositioning: this.overlayPositioning, placeholder: this.mode === "name"
+        return (h(Host, { key: '01e92ff0b71928757d2c4a47cbf691ca8b47fd4b' }, h(InteractiveContainer, { key: 'e8c840862e0a1d977393dbf30d684c236f4893c2', disabled: this.disabled }, h("calcite-combobox", { key: '0766faea4458022bb0642534a74ab743c4c97f4b', clearDisabled: !this.clearable, disabled: this.disabled, label: this.messages.chooseTimeZone, lang: this.effectiveLocale, maxItems: this.maxItems, onCalciteComboboxBeforeClose: this.onComboboxBeforeClose, onCalciteComboboxBeforeOpen: this.onComboboxBeforeOpen, onCalciteComboboxChange: this.onComboboxChange, onCalciteComboboxClose: this.onComboboxClose, onCalciteComboboxOpen: this.onComboboxOpen, overlayPositioning: this.overlayPositioning, placeholder: this.mode === "name"
                 ? this.messages.namePlaceholder
                 : this.mode === "offset"
                     ? this.messages.offsetPlaceholder
-                    : this.messages.regionPlaceholder, placeholderIcon: "search", readOnly: this.readOnly, ref: this.setComboboxRef, scale: this.scale, selectionMode: this.clearable ? "single" : "single-persist", status: this.status, "validation-icon": this.validationIcon, "validation-message": this.validationMessage }, this.renderItems()), h(HiddenFormInputSlot, { key: '0b7a0694166f1d5b36b780d3436dad15d466bc3c', component: this }))));
+                    : this.messages.regionPlaceholder, placeholderIcon: "search", readOnly: this.readOnly, ref: this.setComboboxRef, scale: this.scale, selectionMode: this.clearable ? "single" : "single-persist", status: this.status, "validation-icon": this.validationIcon, "validation-message": this.validationMessage }, this.renderItems()), h(HiddenFormInputSlot, { key: '7fb8724e1183f6341fc0167338f0ddd681f57f1c', component: this }))));
     }
     renderItems() {
         if (this.mode === "region") {

package/dist/components/calcite-input.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { I as Input, d as defineCustomElement$1 } from './input2.js';
 

package/dist/components/calcite-label.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { L as Label, d as defineCustomElement$1 } from './label2.js';
 

package/dist/components/calcite-link.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { L as Link, d as defineCustomElement$1 } from './link.js';
 

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

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { u as updateHostInteraction, I as InteractiveContainer } from './interactive.js';
@@ -48,7 +48,7 @@ const ListItemGroup = /*@__PURE__*/ proxyCustomElement(class ListItemGroup exten
     // --------------------------------------------------------------------------
     render() {
         const { disabled, heading } = this;
-        return (h(Host, { key: 'e1e0304c3d4fe02909fd0075de2e4f5ef806be39' }, h(InteractiveContainer, { key: '5fb0861fb58de90808e98b7061d3c906c822203c', disabled: disabled }, h("tr", { key: 'c77af78f937c3135601df2c4574b858662d5fcdb', class: CSS.container }, h("td", { key: 'f1ae6b9e09e78f87b814287f8eaeb0a105575c7a', class: CSS.heading, colSpan: MAX_COLUMNS }, heading)), h("slot", { key: '7346d5d774173403910eddd35bf700ccd1437c4f', onSlotchange: this.handleDefaultSlotChange }))));
+        return (h(Host, { key: '620fb4faa44dccf67d64d3665200a5314b98f14e' }, h(InteractiveContainer, { key: '9fd1d5aba9ec1267f82e15da4339c3319a3dbce9', disabled: disabled }, h("tr", { key: '1f34e056f55a8f8a6c6f1f82995156101c7d4b1e', class: CSS.container }, h("td", { key: '9dad6ae33ac05a1e72281c81567fdc085b314be4', class: CSS.heading, colSpan: MAX_COLUMNS }, heading)), h("slot", { key: '9638537609d9ee09b077a8c8cceca50596cb0813', onSlotchange: this.handleDefaultSlotChange }))));
     }
     get el() { return this; }
     static get style() { return CalciteListItemGroupStyle0; }

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

@@ -1,10 +1,10 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as slotChangeHasAssignedElement, E as getFirstTabbable, a as getElementDir, t as toAriaBoolean } from './dom.js';
+import { s as slotChangeHasAssignedElement, D as getFirstTabbable, g as getElementDir, t as toAriaBoolean } from './dom.js';
 import { u as updateHostInteraction, I as InteractiveContainer } from './interactive.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale.js';
 import { u as updateMessages, c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n.js';
@@ -395,7 +395,7 @@ const ListItem = /*@__PURE__*/ proxyCustomElement(class ListItem extends HTMLEle
         const showBorder = selectionMode !== "none" && selectionAppearance === "border";
         const borderSelected = showBorder && selected;
         const borderUnselected = showBorder && !selected;
-        return (h(Host, { key: 'a610ab740c82b6088400839884d58d4d867829db' }, h(InteractiveContainer, { key: 'f05bf10e82fab03ddfdaf3ab2e100dcbd6d69c63', disabled: disabled }, h("div", { key: '4bf63ed08d2a4a049e060d26d3699656558d495e', class: { [CSS.wrapper]: true, [CSS.wrapperBordered]: bordered } }, h("tr", { key: 'd231a113c3bd8ee7f67c2ffb0cf804c142a95fb9', "aria-expanded": openable ? toAriaBoolean(open) : null, "aria-label": label, "aria-level": level, "aria-posinset": setPosition, "aria-selected": toAriaBoolean(selected), "aria-setsize": setSize, class: {
+        return (h(Host, { key: 'b9cb3f307c53ed1a2ab8c686a2e75aa628b9927f' }, h(InteractiveContainer, { key: 'dee15703644ea7682d8d809377ace638d5e6d114', disabled: disabled }, h("div", { key: '9a5497471aa6253aa8fe9831244d28d6987429ea', class: { [CSS.wrapper]: true, [CSS.wrapperBordered]: bordered } }, h("tr", { key: '4f255718fcf599595fa46b721a877d0735240127', "aria-expanded": openable ? toAriaBoolean(open) : null, "aria-label": label, "aria-level": level, "aria-posinset": setPosition, "aria-selected": toAriaBoolean(selected), "aria-setsize": setSize, class: {
                 [CSS.container]: true,
                 [CSS.containerHover]: true,
                 [CSS.containerBorder]: showBorder,