@esri/solutions-components 0.10.27 → 0.10.29

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

@@ -3,33 +3,33 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement, a as getAssetPath } from './index-b793d9aa.js';
-import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-0cbc7172.js';
-import { s as slotChangeHasAssignedElement, f as focusFirstTabbable, g as getSlotted, t as toAriaBoolean } from './dom-42a638f6.js';
-import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-b2a41b8b.js';
-import { c as connectLocalized, d as disconnectLocalized, g as getSupportedLocale, n as numberStringFormatter, a as getDateTimeFormat, f as getDateFormatSupportedLocale, b as getSupportedNumberingSystem } from './locale-a53a7bc6.js';
-import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-b33c486a.js';
-import { H as Heading } from './Heading-cae0b34c.js';
-import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-1a9b14b8.js';
-import { o as onToggleOpenCloseComponent } from './openCloseComponent-9d44719e.js';
-import { d as dateFromISO, g as getDaysDiff, a as dateToISO, b as dateFromRange, s as setEndOfDay, c as datePartsFromISO, e as datePartsFromLocalizedString, f as dateFromLocalizedString, i as inRange } from './date-f0c83d13.js';
-import { i as isBrowser } from './browser-a791205e.js';
-import { f as filterValidFlipPlacements, c as connectFloatingUI, d as defaultMenuPlacement, r as reposition, a as disconnectFloatingUI, F as FloatingCSS } from './floating-ui-a14930d0.js';
-import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-46367137.js';
-import { n as numberKeys } from './key-d6dfb50e.js';
-import { c as connectLabel, d as disconnectLabel } from './label-f2ec1100.js';
-import { c as connectFocusTrap, d as deactivateFocusTrap, a as activateFocusTrap } from './focusTrapComponent-c1def619.js';
-import { g as guid } from './guid-42656051.js';
-import { g as getIconScale } from './component-d35983a4.js';
-import { V as Validation } from './Validation-bd0a53ec.js';
-import { s as syncHiddenFormInput } from './input-7f3fc18b.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement, a as getAssetPath } from './index-904bc599.js';
+import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-8a0b08ef.js';
+import { s as slotChangeHasAssignedElement, f as focusFirstTabbable, o as getSlotted, t as toAriaBoolean } from './dom-75c641a7.js';
+import { u as updateHostInteraction, I as InteractiveContainer } from './interactive-98ed6b6f.js';
+import { c as connectLocalized, d as disconnectLocalized, g as getSupportedLocale, n as numberStringFormatter, a as getDateTimeFormat, f as getDateFormatSupportedLocale, b as getSupportedNumberingSystem } from './locale-24516fec.js';
+import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-9a5d28cf.js';
+import { H as Heading } from './Heading-80b3be96.js';
+import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-7cb2fc6f.js';
+import { o as onToggleOpenCloseComponent } from './openCloseComponent-f642bffd.js';
+import { d as defaultEndMenuPlacement, f as filterValidFlipPlacements, c as connectFloatingUI, a as defaultMenuPlacement, r as reposition, b as disconnectFloatingUI, F as FloatingCSS } from './floating-ui-93b345b1.js';
+import { d as dateFromISO, g as getDaysDiff, a as dateToISO, b as dateFromRange, s as setEndOfDay, c as datePartsFromISO, e as datePartsFromLocalizedString, f as dateFromLocalizedString, i as inRange } from './date-4fc03f44.js';
+import { i as isBrowser } from './browser-b67d8df6.js';
+import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-d45062d8.js';
+import { n as numberKeys } from './key-e6b442de.js';
+import { c as connectLabel, d as disconnectLabel } from './label-272c5973.js';
+import { c as connectFocusTrap, d as deactivateFocusTrap, a as activateFocusTrap } from './focusTrapComponent-35b3348c.js';
+import { g as guid } from './guid-b0fb1de3.js';
+import { g as getIconScale } from './component-83541c88.js';
+import { V as Validation } from './Validation-cf136c56.js';
+import { s as syncHiddenFormInput } from './input-e01adc49.js';
 import { l as loadModules } from './loadModules-03ba7abe.js';
-import { g as getMessages } from './locale-a34f9f04.js';
+import { g as getMessages } from './locale-ce177eb8.js';
 import { g as getMode } from './mode-8c5f5dc9.js';
-import './observers-6cac5525.js';
-import './resources-745dec87.js';
+import './observers-c83631e8.js';
+import './resources-8e2ed936.js';
 import './debounce-6e9ade8c.js';
-import './config-8d1c3431.js';
+import './config-16813c92.js';
 import './esri-loader-c6842c6b.js';
 import './_commonjsHelpers-089957fe.js';
 import './languageUtil-2b6e191a.js';
@@ -37,7 +37,7 @@ import './languageUtil-2b6e191a.js';
 /*!
  * 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.12.2
+ * v2.13.0
  */
 const IDS$1 = {
     content: "content",
@@ -118,6 +118,8 @@ const Block = class {
         this.iconFlipRtl = undefined;
         this.iconStart = undefined;
         this.loading = false;
+        this.menuFlipPlacements = undefined;
+        this.menuPlacement = defaultEndMenuPlacement;
         this.open = false;
         this.status = undefined;
         this.description = undefined;
@@ -170,13 +172,11 @@ const Block = class {
     // --------------------------------------------------------------------------
     connectedCallback() {
         connectConditionalSlotComponent(this);
-        connectInteractive(this);
         connectLocalized(this);
         connectMessages(this);
         this.transitionEl = this.el;
     }
     disconnectedCallback() {
-        disconnectInteractive(this);
         disconnectLocalized(this);
         disconnectMessages(this);
         disconnectConditionalSlotComponent(this);
@@ -238,16 +238,16 @@ const Block = class {
         return (h("calcite-icon", { class: iconClass, flipRtl: flipRtl, icon: iconValue, key: iconValue, scale: "s" }));
     }
     render() {
-        const { collapsible, el, loading, open, heading, messages, description } = this;
+        const { collapsible, el, loading, open, heading, messages, description, menuFlipPlacements, menuPlacement, } = this;
         const toggleLabel = open ? messages.collapse : messages.expand;
-        const headerContent = (h("header", { key: '91deb640f5a591cd70dbb6328cdc588a40b600d5', class: { [CSS$3.header]: true, [CSS$3.headerHasText]: !!(heading || description) }, id: IDS$1.header }, this.renderIcon("start"), this.renderContentStart(), this.renderLoaderStatusIcon(), this.renderTitle()));
+        const headerContent = (h("header", { key: '439d2866f9c5f13cfd8020812203a6cdf86c964f', class: { [CSS$3.header]: true, [CSS$3.headerHasText]: !!(heading || description) }, id: IDS$1.header }, this.renderIcon("start"), this.renderContentStart(), this.renderLoaderStatusIcon(), this.renderTitle()));
         const hasControl = !!getSlotted(el, SLOTS.control);
         const hasMenuActions = !!getSlotted(el, SLOTS.headerMenuActions);
         const collapseIcon = open ? ICONS.opened : ICONS.closed;
-        const headerNode = (h("div", { key: 'ebba82b4e065978eaa9ed1e59f05ad80843cc9ab', class: CSS$3.headerContainer }, this.dragHandle ? h("calcite-handle", { label: heading }) : null, collapsible ? (h("button", { "aria-controls": IDS$1.content, "aria-describedby": IDS$1.header, "aria-expanded": collapsible ? toAriaBoolean(open) : null, class: CSS$3.toggle, id: IDS$1.toggle, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, h("div", { class: CSS$3.iconEndContainer }, this.renderIcon("end"), h("calcite-icon", { class: CSS$3.toggleIcon, icon: collapseIcon, scale: "s" })))) : this.iconEnd ? (h("div", null, headerContent, h("div", { class: CSS$3.iconEndContainer }, this.renderIcon("end")))) : (headerContent), hasControl ? (h("div", { "aria-labelledby": IDS$1.header, class: CSS$3.controlContainer }, h("slot", { name: SLOTS.control }))) : null, hasMenuActions ? (h("calcite-action-menu", { label: messages.options, overlayPositioning: this.overlayPositioning }, h("slot", { name: SLOTS.headerMenuActions }))) : null, this.renderActionsEnd()));
-        return (h(Host, { key: 'b5c12059b36785bf45ce61e7309a35278b928088' }, h(InteractiveContainer, { key: '90a5013ca2e30dadbd76c146700a53391f3aea62', disabled: this.disabled }, h("article", { key: '825f15336afb992c7ea8c718b5ffad7c4bf2507e', "aria-busy": toAriaBoolean(loading), class: {
+        const headerNode = (h("div", { key: 'a9721a9e145db53a215262190d2f7e46472edec6', class: CSS$3.headerContainer }, this.dragHandle ? h("calcite-handle", { label: heading }) : null, collapsible ? (h("button", { "aria-controls": IDS$1.content, "aria-describedby": IDS$1.header, "aria-expanded": collapsible ? toAriaBoolean(open) : null, class: CSS$3.toggle, id: IDS$1.toggle, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, h("div", { class: CSS$3.iconEndContainer }, this.renderIcon("end"), h("calcite-icon", { class: CSS$3.toggleIcon, icon: collapseIcon, scale: "s" })))) : this.iconEnd ? (h("div", null, headerContent, h("div", { class: CSS$3.iconEndContainer }, this.renderIcon("end")))) : (headerContent), hasControl ? (h("div", { "aria-labelledby": IDS$1.header, class: CSS$3.controlContainer }, h("slot", { name: SLOTS.control }))) : null, hasMenuActions ? (h("calcite-action-menu", { flipPlacements: menuFlipPlacements ?? ["top", "bottom"], label: messages.options, overlayPositioning: this.overlayPositioning, placement: menuPlacement }, h("slot", { name: SLOTS.headerMenuActions }))) : null, this.renderActionsEnd()));
+        return (h(Host, { key: 'cdf7c69cc630466cfd4fb0078735f1e685fde512' }, h(InteractiveContainer, { key: 'ae5b2a044fb337bb2c5c12bee2c9ed4b10e5c373', disabled: this.disabled }, h("article", { key: '01c5c5499d62361cfe26d8b6a878034f0805787b', "aria-busy": toAriaBoolean(loading), class: {
                 [CSS$3.container]: true,
-            } }, headerNode, h("section", { key: '4f690563d78615b68a225456aaae593af6adb826', "aria-labelledby": IDS$1.toggle, class: CSS$3.content, hidden: !open, id: IDS$1.content }, this.renderScrim())))));
+            } }, headerNode, h("section", { key: 'e72271e369055329e4447d15c2deec25599332ec', "aria-labelledby": IDS$1.toggle, class: CSS$3.content, hidden: !open, id: IDS$1.content }, this.renderScrim())))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -262,7 +262,7 @@ Block.style = CalciteBlockStyle0;
 /*!
  * 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.12.2
+ * v2.13.0
  */
 const HEADING_LEVEL = 2;
 const DATE_PICKER_FORMAT_OPTIONS = { dateStyle: "full" };
@@ -270,7 +270,7 @@ const DATE_PICKER_FORMAT_OPTIONS = { dateStyle: "full" };
 /*!
  * 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.12.2
+ * v2.13.0
  */
 /**
  * CLDR cache.
@@ -652,7 +652,7 @@ const DatePicker = class {
                 ? endDate || this.maxAsDate
                 : this.maxAsDate
             : this.maxAsDate;
-        return (h(Host, { key: '52087d405fc20cd885910944004caef0e4b4e33b', onBlur: this.resetActiveDates, onKeyDown: this.keyDownHandler }, this.renderCalendar(activeDate, maxDate, minDate, date, endDate)));
+        return (h(Host, { key: '32213cf1e0848af340d9a7cdaf0838f88d04e0cb', onBlur: this.resetActiveDates, onKeyDown: this.keyDownHandler }, this.renderCalendar(activeDate, maxDate, minDate, date, endDate)));
     }
     effectiveLocaleChange() {
         updateMessages(this, this.effectiveLocale);
@@ -746,7 +746,7 @@ DatePicker.style = CalciteDatePickerStyle0;
 /*!
  * 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.12.2
+ * v2.13.0
  */
 /**
  * Specifies if an ISO string date (YYYY-MM-DD) has two digit year.
@@ -776,7 +776,7 @@ function normalizeToCurrentCentury(twoDigitYear) {
 /*!
  * 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.12.2
+ * v2.13.0
  */
 const CSS$2 = {
     assistiveText: "assistive-text",
@@ -1189,7 +1189,6 @@ const InputDatePicker = class {
     //
     // --------------------------------------------------------------------------
     connectedCallback() {
-        connectInteractive(this);
         connectLocalized(this);
         this.handleDateTimeFormatChange();
         const { open } = this;
@@ -1215,10 +1214,10 @@ const InputDatePicker = class {
             }
         }
         else if (this.valueAsDate) {
-            if (this.range) {
-                this.setRangeValue(this.valueAsDate);
+            if (this.range && Array.isArray(this.valueAsDate)) {
+                this.value = [dateToISO(this.valueAsDate[0]), dateToISO(this.valueAsDate[1])];
             }
-            else if (!Array.isArray(this.valueAsDate)) {
+            else if (!this.range && !Array.isArray(this.valueAsDate)) {
                 this.value = dateToISO(this.valueAsDate);
             }
         }
@@ -1249,7 +1248,6 @@ const InputDatePicker = class {
     }
     disconnectedCallback() {
         deactivateFocusTrap(this);
-        disconnectInteractive(this);
         disconnectLabel(this);
         disconnectForm(this);
         disconnectFloatingUI(this, this.referenceEl, this.floatingEl);
@@ -1266,23 +1264,23 @@ const InputDatePicker = class {
             locale: effectiveLocale,
             useGrouping: false,
         };
-        return (h(Host, { key: '38f3ea7b3206b0b5d404c6691d54811ce9e09753', onBlur: this.blurHandler, onKeyDown: this.keyDownHandler }, h(InteractiveContainer, { key: '64296d7cf55e492e041eee729d969733f0aeeede', disabled: this.disabled }, this.localeData && (h("div", { key: 'bb1244e8a1ac6e32bc71f08a98d8007b17a3332d', class: CSS$2.inputContainer }, h("div", { key: 'fcb3e2430616bae57d9e09ea1f631bdb6c9810f0', class: CSS$2.inputWrapper, "data-position": "start", onClick: this.onInputWrapperClick, onPointerDown: this.onInputWrapperPointerDown, ref: this.setStartWrapper }, h("calcite-input-text", { key: '4c1e9dea4f553f206251bafefd05993b5c897b41', "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: 'b31ae837415083aa63451c5f32b78253b1d6af1e', onBlur: this.blurHandler, onKeyDown: this.keyDownHandler }, h(InteractiveContainer, { key: '7315a0e5773a1ef96c00b48b138c8afd50aca28a', disabled: this.disabled }, this.localeData && (h("div", { key: '022f86001938e2994ab523b30a2e3cb379a550b4', class: CSS$2.inputContainer }, h("div", { key: '4a3add7824ea7ec41b75ddd5e9b847afa1ca0708', class: CSS$2.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: {
                 [CSS$2.input]: true,
                 [CSS$2.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: '705abe452a2f49cc167f1051ca193b397d6cef9f', "aria-hidden": "true", class: CSS$2.assistiveText, id: this.placeholderTextId }, "Date Format: ", this.localeData?.placeholder)), h("div", { key: 'bf71124065fdfefa0a6024e245aee31eee3a5b5e', "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: '7d5b86f35bde88b757f9a46485ce37bf8317ac88', "aria-hidden": "true", class: CSS$2.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: {
                 [CSS$2.menu]: true,
                 [CSS$2.menuActive]: this.open,
-            }, id: this.dialogId, ref: this.setFloatingEl, role: "dialog" }, h("div", { key: '9803f72d5454230914a2604cceb3b1d30fd32083', class: {
+            }, id: this.dialogId, ref: this.setFloatingEl, role: "dialog" }, h("div", { key: '92b37e521a0d2e0e8fb30ca129a53e75d26e9dd6', class: {
                 [CSS$2.calendarWrapper]: true,
                 [CSS$2.calendarWrapperEnd]: this.focusedInput === "end",
                 [FloatingCSS.animation]: true,
                 [FloatingCSS.animationActive]: this.open,
-            }, ref: this.setTransitionEl }, h("calcite-date-picker", { key: '667c3488db40269e60d79f28f374a6cf9ff610da', 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: '1c657ea9c4b667035d58a13bffb784489586bbdd', class: CSS$2.horizontalArrowContainer }, h("calcite-icon", { key: '970d61e19c5372d503ef070fcbd30817b2231c86', flipRtl: true, icon: "arrow-right", scale: getIconScale(this.scale) }))), this.range && this.layout === "vertical" && this.scale !== "s" && (h("div", { key: 'b5c83aafbddb396900c44b97d642b0c1c7b2a27b', class: CSS$2.verticalArrowContainer }, h("calcite-icon", { key: 'b00438be61ed6f73b1c0b074ff1a8b26ce32e7e2', icon: "arrow-down", scale: getIconScale(this.scale) }))), this.range && (h("div", { key: '38a7533192d085470cef7e59d091cebe8088980d', class: CSS$2.inputWrapper, "data-position": "end", onClick: this.onInputWrapperClick, onPointerDown: this.onInputWrapperPointerDown, ref: this.setEndWrapper }, h("calcite-input-text", { key: '03fbeddd6785ce5e6abb29d9c40ee34842376e31', "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: '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$2.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$2.verticalArrowContainer }, h("calcite-icon", { key: '48758a61b800c61109b492d77ca468519ad65227', icon: "arrow-down", scale: getIconScale(this.scale) }))), this.range && (h("div", { key: 'af12058d6a8d299fd988ae4ac7fc0422d05342c6', class: CSS$2.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: {
                 [CSS$2.input]: true,
                 [CSS$2.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: '9086e6f1f425cb7c583bf8f195b877e42c6a6aa6', 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: '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)));
     }
     renderToggleIcon(open) {
         return (

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

@@ -3,25 +3,25 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { r as registerInstance, f as forceUpdate, h, g as getElement } from './index-b793d9aa.js';
-import { s as submitForm, r as resetForm, f as findAssociatedForm } from './form-46367137.js';
-import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-b2a41b8b.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-f2ec1100.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-1a9b14b8.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-a53a7bc6.js';
-import { c as createObserver } from './observers-6cac5525.js';
-import { g as getIconScale } from './component-d35983a4.js';
-import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-b33c486a.js';
-import { t as toAriaBoolean } from './dom-42a638f6.js';
-import { i as isBrowser } from './browser-a791205e.js';
-import './key-d6dfb50e.js';
-import './guid-42656051.js';
-import './resources-745dec87.js';
+import { r as registerInstance, f as forceUpdate, h, g as getElement } from './index-904bc599.js';
+import { s as submitForm, r as resetForm, f as findAssociatedForm } from './form-d45062d8.js';
+import { u as updateHostInteraction, I as InteractiveContainer } from './interactive-98ed6b6f.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-272c5973.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-7cb2fc6f.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-24516fec.js';
+import { c as createObserver } from './observers-c83631e8.js';
+import { g as getIconScale } from './component-83541c88.js';
+import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-9a5d28cf.js';
+import { i as isBrowser } from './browser-b67d8df6.js';
+import { t as toAriaBoolean } from './dom-75c641a7.js';
+import './key-e6b442de.js';
+import './guid-b0fb1de3.js';
+import './resources-8e2ed936.js';
 
 /*!
  * 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.12.2
+ * v2.13.0
  */
 const CSS = {
     buttonLoader: "calcite-button--loader",
@@ -118,7 +118,6 @@ const Button = class {
     //
     //--------------------------------------------------------------------------
     async connectedCallback() {
-        connectInteractive(this);
         connectLocalized(this);
         connectMessages(this);
         this.setupTextContentObserver();
@@ -127,7 +126,6 @@ const Button = class {
     }
     disconnectedCallback() {
         this.mutationObserver?.disconnect();
-        disconnectInteractive(this);
         disconnectLabel(this);
         disconnectLocalized(this);
         disconnectMessages(this);
@@ -153,16 +151,20 @@ const Button = class {
         const Tag = childElType;
         const loaderNode = this.loading ? (h("div", { class: CSS.buttonLoader }, h("calcite-loader", { class: this.loading ? CSS.loadingIn : CSS.loadingOut, inline: true, label: this.messages.loading, scale: this.scale === "l" ? "m" : "s" }))) : null;
         const noStartEndIcons = !this.iconStart && !this.iconEnd;
-        const iconStartEl = (h("calcite-icon", { key: '4d22fe0db49aa06f71162b2ef64d4011b1b818d8', class: { [CSS.icon]: true, [CSS.iconStart]: true }, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
-        const iconEndEl = (h("calcite-icon", { key: '95c15bea3179d091058d225e80477956fcb27e63', class: { [CSS.icon]: true, [CSS.iconEnd]: true }, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
-        const contentEl = (h("span", { key: '6399f9291ba542a304a2813cda9ad21de0a19c36', class: CSS.content, ref: (el) => (this.contentEl = el) }, h("slot", { key: '818ff928ab9c8d722763ec6c1fdbf6b0d60ef210' })));
-        return (h(InteractiveContainer, { key: 'a6799ecea681f5e1929237fd26f91cc6895ae291', disabled: this.disabled }, h(Tag, { key: '042f056a472a091f4728127d079089dbb262d572', "aria-disabled": childElType === "a" ? toAriaBoolean(this.disabled || this.loading) : null, "aria-expanded": this.el.getAttribute("aria-expanded"), "aria-label": !this.loading ? getLabelText(this) : this.messages.loading, "aria-live": "polite", class: {
+        const iconStartEl = (h("calcite-icon", { key: 'f1036c0a1bf5740fe63806e3559ea66fac29b726', class: { [CSS.icon]: true, [CSS.iconStart]: true }, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
+        const iconEndEl = (h("calcite-icon", { key: 'd2c22ecf9ca23426b4c4a3b42d623f35ee988a44', class: { [CSS.icon]: true, [CSS.iconEnd]: true }, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
+        const contentEl = (h("span", { key: 'd1803021f5fa106c9e296402ec0a1498ecdf36c7', class: CSS.content, ref: (el) => (this.contentEl = el) }, h("slot", { key: 'd2f729c16f9c803ffa109b68d58a22a4383dd426' })));
+        return (h(InteractiveContainer, { key: '2757c795d29f812cf11def4df108837b9971dcdb', disabled: this.disabled }, h(Tag, { key: 'e67a4882c8a0c13d6b5f98bc8c5b53c10ba36e3e', "aria-busy": toAriaBoolean(this.loading), "aria-expanded": this.el.ariaExpanded ? this.el.ariaExpanded : null, "aria-label": !this.loading ? getLabelText(this) : this.messages.loading, "aria-live": "polite", class: {
                 [CSS.buttonPadding]: noStartEndIcons,
                 [CSS.buttonPaddingShrunk]: !noStartEndIcons,
                 [CSS.contentSlotted]: this.hasContent,
                 [CSS.iconStartEmpty]: !this.iconStart,
                 [CSS.iconEndEmpty]: !this.iconEnd,
-            }, disabled: childElType === "button" ? this.disabled || this.loading : null, download: childElType === "a" && (this.download === "" || this.download) ? this.download : null, href: childElType === "a" && this.href, name: childElType === "button" && this.name, onClick: this.handleClick, ref: this.setChildEl, rel: childElType === "a" && this.rel, tabIndex: this.disabled ? -1 : null, target: childElType === "a" && this.target, title: this.tooltipText, type: childElType === "button" && this.type }, loaderNode, this.iconStart ? iconStartEl : null, this.hasContent ? contentEl : null, this.iconEnd ? iconEndEl : null)));
+            }, disabled: childElType === "button" ? this.disabled : null, download: childElType === "a"
+                ? this.download === true || this.download === ""
+                    ? ""
+                    : this.download || null
+                : null, href: childElType === "a" && this.href, name: childElType === "button" && this.name, onClick: this.handleClick, ref: this.setChildEl, rel: childElType === "a" && this.rel, tabIndex: this.disabled ? -1 : null, target: childElType === "a" && this.target, title: this.tooltipText, type: childElType === "button" && this.type }, loaderNode, this.iconStart ? iconStartEl : null, this.hasContent ? contentEl : null, this.iconEnd ? iconEndEl : null)));
     }
     //--------------------------------------------------------------------------
     //

package/dist/esm/calcite-card-group.entry.js

@@ -3,15 +3,15 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-b793d9aa.js';
-import { b as focusElementInGroup, d as focusElement, t as toAriaBoolean } from './dom-42a638f6.js';
-import { c as connectInteractive, u as updateHostInteraction, d as disconnectInteractive, I as InteractiveContainer } from './interactive-b2a41b8b.js';
-import { a as setComponentLoaded, s as setUpLoadableComponent, b as componentLoaded } from './loadable-1a9b14b8.js';
-import './guid-42656051.js';
-import './resources-745dec87.js';
-import './browser-a791205e.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-904bc599.js';
+import { b as focusElementInGroup, d as focusElement } from './dom-75c641a7.js';
+import { u as updateHostInteraction, I as InteractiveContainer } from './interactive-98ed6b6f.js';
+import { a as setComponentLoaded, s as setUpLoadableComponent, b as componentLoaded } from './loadable-7cb2fc6f.js';
+import './guid-b0fb1de3.js';
+import './resources-8e2ed936.js';
+import './browser-b67d8df6.js';
 
-const cardGroupCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{--calcite-card-group-gap:var(--calcite-size-md);display:block}.container{display:flex;flex-wrap:wrap;gap:var(--calcite-card-group-gap)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";
+const cardGroupCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block}.container{display:flex;flex-wrap:wrap;gap:var(--calcite-card-group-space, var(--calcite-card-group-gap, var(--calcite-size-md)))}:host([hidden]){display:none}[hidden]{display:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}";
 const CalciteCardGroupStyle0 = cardGroupCss;
 
 const CardGroup = class {
@@ -85,18 +85,12 @@ const CardGroup = class {
     //  Lifecycle
     //
     //--------------------------------------------------------------------------
-    connectedCallback() {
-        connectInteractive(this);
-    }
     componentDidRender() {
         updateHostInteraction(this);
     }
     componentDidLoad() {
         setComponentLoaded(this);
     }
-    disconnectedCallback() {
-        disconnectInteractive(this);
-    }
     async componentWillLoad() {
         setUpLoadableComponent(this);
     }
@@ -151,7 +145,7 @@ const CardGroup = class {
     //--------------------------------------------------------------------------
     render() {
         const role = this.selectionMode === "none" || this.selectionMode === "multiple" ? "group" : "radiogroup";
-        return (h(Host, { key: 'f7d72ac0d0c8b0cec9b1c5c048ed2a8ee304d9e2' }, h(InteractiveContainer, { key: 'b477bbced684168f1e68c1fe0d8511a689653995', disabled: this.disabled }, h("div", { key: 'ce0aa841b96ad23886e109203a14ac2b0e54b948', "aria-disabled": toAriaBoolean(this.disabled), "aria-label": this.label, class: "container", role: role }, h("slot", { key: '338c12be0a5a675daf911aad6049aff6319d3064', onSlotchange: this.updateItemsOnSlotChange, ref: (el) => (this.slotRefEl = el) })))));
+        return (h(Host, { key: '2aa2152806418f305065d23ec9779668086f10c9' }, h(InteractiveContainer, { key: '64717db7b05788f5448b898ab9bfc2a553ed6ac9', disabled: this.disabled }, h("div", { key: 'f6725d6c8942a0c69aed287bee24d79fd42c7e89', "aria-label": this.label, class: "container", role: role }, h("slot", { key: 'a88d6f133fdceafba10ceb9517428b3c7ee8cffb', onSlotchange: this.updateItemsOnSlotChange, ref: (el) => (this.slotRefEl = el) })))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

@@ -3,22 +3,22 @@
  * Licensed under the Apache License, Version 2.0
  * http://www.apache.org/licenses/LICENSE-2.0
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-b793d9aa.js';
-import { s as slotChangeHasAssignedElement, g as getSlotted, t as toAriaBoolean } from './dom-42a638f6.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-a53a7bc6.js';
-import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-b33c486a.js';
-import { c as componentFocusable, a as setComponentLoaded, s as setUpLoadableComponent } from './loadable-1a9b14b8.js';
-import { c as connectInteractive, u as updateHostInteraction, d as disconnectInteractive, I as InteractiveContainer } from './interactive-b2a41b8b.js';
-import { i as isActivationKey } from './key-d6dfb50e.js';
-import './guid-42656051.js';
-import './resources-745dec87.js';
-import './observers-6cac5525.js';
-import './browser-a791205e.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-904bc599.js';
+import { s as slotChangeHasAssignedElement, t as toAriaBoolean } from './dom-75c641a7.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-24516fec.js';
+import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-9a5d28cf.js';
+import { c as componentFocusable, a as setComponentLoaded, s as setUpLoadableComponent } from './loadable-7cb2fc6f.js';
+import { u as updateHostInteraction, I as InteractiveContainer } from './interactive-98ed6b6f.js';
+import { i as isActivationKey } from './key-e6b442de.js';
+import './guid-b0fb1de3.js';
+import './resources-8e2ed936.js';
+import './observers-c83631e8.js';
+import './browser-b67d8df6.js';
 
 /*!
  * 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.12.2
+ * v2.13.0
  */
 const CSS = {
     container: "container",
@@ -50,7 +50,7 @@ const ICONS = {
     unselectedSingle: "circle",
 };
 
-const cardCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block;max-inline-size:100%;--calcite-card-corner-radius:var(--calcite-corner-radius-sharp);--calcite-card-background-color:var(--calcite-color-foreground-1);--calcite-card-border-color:var(--calcite-color-border-3);--calcite-card-shadow:var(--calcite-shadow-none);--calcite-card-accent-color-selected:var(--calcite-color-brand);--calcite-card-selection-background-color:transparent;--calcite-card-selection-background-color-hover:var(--calcite-color-transparent-hover);--calcite-card-selection-background-color-active:var(--calcite-color-transparent-press);--calcite-card-selection-background-color-selected:transparent;--calcite-card-selection-icon-color:var(--calcite-color-text-3);--calcite-card-selection-icon-color-hover:var(--calcite-color-text-2);--calcite-card-selection-icon-color-selected:var(--calcite-color-brand)}.content-wrapper{position:relative;display:flex;block-size:100%;flex-direction:column;justify-content:space-between;overflow:hidden;border:var(--calcite-border-width-sm) solid var(--calcite-card-border-color);border-radius:var(--calcite-card-corner-radius);background-color:var(--calcite-card-background-color);box-shadow:var(--calcite-card-shadow);pointer-events:none}::slotted(*){pointer-events:auto}:host(:not([selectable])) .content-wrapper:not(.non-interactive){outline-color:transparent}:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.container{position:relative;display:flex;flex:1 1 auto;flex-direction:column}:host([loading]) .content-wrapper *:not(calcite-loader):not(.calcite-card-loader-container){pointer-events:none;opacity:0}:host([loading]) .calcite-card-loader-container{position:absolute;inset:0px;display:flex;align-items:center}.header{display:flex;flex-direction:row;align-items:flex-start}.footer{margin-block-start:auto;display:flex;flex-direction:row;align-content:space-between;justify-content:space-between;padding-inline:var(--calcite-spacing-md);padding-block-start:var(--calcite-spacing-xxs);padding-block-end:var(--calcite-spacing-md)}.header-text-container{display:flex;inline-size:100%;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem}.header-text-container:not(:only-child){padding-inline-end:0.125rem}.footer{margin-block-start:auto;flex-direction:row;align-content:space-between;justify-content:space-between;padding-inline:0.75rem;padding-block:0.25rem 0.75rem}.card-content{block-size:auto;font-size:var(--calcite-font-size--2);line-height:1.375}.has-slotted-content{padding:0.75rem}:host([selected]) .content-wrapper{box-shadow:inset 0 -4px 0 0 var(--calcite-card-accent-color-selected)}:host([selectable]) .header{padding-inline-end:var(--calcite-spacing-xxxl)}slot[name=title]::slotted(*),*::slotted([slot=title]){margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}slot[name=subtitle]::slotted(*),*::slotted([slot=subtitle]){margin:0px;margin-block-start:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}slot[name=heading]::slotted(*),*::slotted([slot=heading]){margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}slot[name=description]::slotted(*),*::slotted([slot=description]){margin:0px;margin-block-start:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}slot[name=thumbnail]::slotted(img),img::slotted([slot=thumbnail]){min-inline-size:100%;max-inline-size:100%}slot[name=footer-start]::slotted(*),*::slotted([slot=footer-start]){align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375;margin-inline-end:auto}slot[name=footer-end]::slotted(*),*::slotted([slot=footer-end]){align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375}.checkbox-wrapper-deprecated{pointer-events:auto;position:absolute;inset-block-start:var(--calcite-spacing-sm);inset-inline-end:var(--calcite-spacing-sm);margin:0;padding:0}.checkbox-wrapper{pointer-events:auto;margin:0.5rem;cursor:pointer;padding:0.5rem;outline-color:transparent;background-color:var(--calcite-card-selection-background-color);display:flex;align-items:center;justify-items:center;--calcite-icon-color:var(--calcite-card-selection-icon-color)}.checkbox-wrapper:hover{background-color:var(--calcite-card-selection-background-color-hover);--calcite-icon-color:var(--calcite-card-selection-icon-color-hover)}.checkbox-wrapper:active{background-color:var(--calcite-card-selection-background-color-active)}.checkbox-wrapper calcite-icon{pointer-events:none}:host([selected]) .checkbox-wrapper{--calcite-icon-color:var(--calcite-card-selection-icon-color-selected);background-color:var(--calcite-card-selection-background-color-selected)}:host([selected]) .checkbox-wrapper:hover{background-color:var(--calcite-card-selection-background-color-hover)}:host([selected]) .checkbox-wrapper:active{background-color:var(--calcite-card-selection-background-color-active)}:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper{background-color:var(--calcite-card-selection-background-color-hover);--calcite-icon-color:var(--calcite-card-selection-icon-color-hover)}:host([selected]:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper{background-color:var(--calcite-card-selection-background-color-active);--calcite-icon-color:var(--calcite-card-selection-icon-color-selected)}.thumbnail-wrapper{display:flex}.content-wrapper.inline{flex-direction:row}.content-wrapper.inline>.container{inline-size:60%}.content-wrapper.inline>.thumbnail-wrapper{inline-size:40%;align-items:flex-start}.content-wrapper.inline slot[name=thumbnail]::slotted(img),.content-wrapper.inline img::slotted([slot=thumbnail]){inline-size:100%}slot[name=footer-start]::slotted(*),slot[name=footer-end]::slotted(*){display:flex;gap:0.25rem}:host([hidden]){display:none}[hidden]{display:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}";
+const cardCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block;max-inline-size:100%}.content-wrapper{position:relative;display:flex;block-size:100%;flex-direction:column;justify-content:space-between;overflow:hidden;border:var(--calcite-border-width-sm) solid var(--calcite-card-border-color, var(--calcite-color-border-3));border-radius:var(--calcite-card-corner-radius, var(--calcite-corner-radius-sharp));background-color:var(--calcite-card-background-color, var(--calcite-color-foreground-1));box-shadow:var(--calcite-card-shadow, var(--calcite-shadow-none));pointer-events:none}::slotted(*){pointer-events:auto}:host(:not([selectable])) .content-wrapper:not(.non-interactive){outline-color:transparent}:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.container{position:relative;display:flex;flex:1 1 auto;flex-direction:column}:host([loading]) .content-wrapper *:not(calcite-loader):not(.calcite-card-loader-container){pointer-events:none;opacity:0}:host([loading]) .calcite-card-loader-container{position:absolute;inset:0px;display:flex;align-items:center}.header{display:flex;flex-direction:row;align-items:flex-start}.footer{margin-block-start:auto;display:flex;flex-direction:row;align-content:space-between;justify-content:space-between;padding-inline:var(--calcite-spacing-md);padding-block-start:var(--calcite-spacing-xxs);padding-block-end:var(--calcite-spacing-md)}.header-text-container{display:flex;inline-size:100%;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem}.header-text-container:not(:only-child){padding-inline-end:0.125rem}.footer{margin-block-start:auto;flex-direction:row;align-content:space-between;justify-content:space-between;padding-inline:0.75rem;padding-block:0.25rem 0.75rem}.card-content{block-size:auto;font-size:var(--calcite-font-size--2);line-height:1.375}.has-slotted-content{padding:0.75rem}:host([selected]) .content-wrapper{box-shadow:inset 0 -4px 0 0 var(--calcite-card-accent-color-selected, var(--calcite-color-brand))}:host([selectable]) .header{padding-inline-end:var(--calcite-spacing-xxxl)}slot[name=title]::slotted(*),*::slotted([slot=title]){margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}slot[name=subtitle]::slotted(*),*::slotted([slot=subtitle]){margin:0px;margin-block-start:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}slot[name=heading]::slotted(*),*::slotted([slot=heading]){margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}slot[name=description]::slotted(*),*::slotted([slot=description]){margin:0px;margin-block-start:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}slot[name=thumbnail]::slotted(img),img::slotted([slot=thumbnail]){min-inline-size:100%;max-inline-size:100%}slot[name=footer-start]::slotted(*),*::slotted([slot=footer-start]){align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375;margin-inline-end:auto}slot[name=footer-end]::slotted(*),*::slotted([slot=footer-end]){align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375}.checkbox-wrapper-deprecated{pointer-events:auto;position:absolute;inset-block-start:var(--calcite-spacing-sm);inset-inline-end:var(--calcite-spacing-sm);margin:0;padding:0;color:var(--calcite-card-selection-color, var(--calcite-color-text-3))}.checkbox-wrapper-deprecated:hover{background-color:var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));color:var(--calcite-card-selection-color-hover, var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2)))}.checkbox-wrapper-deprecated:active{background-color:var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press))}.checkbox-wrapper{pointer-events:auto;margin:0.5rem;cursor:pointer;padding:0.5rem;outline-color:transparent;display:flex;align-items:center;justify-items:center;color:var(--calcite-card-selection-color, var(--calcite-color-text-3))}.checkbox-wrapper:hover{background-color:var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));color:var(--calcite-card-selection-color-hover, var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2)))}.checkbox-wrapper:active{background-color:var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press))}.checkbox-wrapper calcite-icon{pointer-events:none}:host([selected]) .checkbox-wrapper-deprecated,:host([selected]) .checkbox-wrapper{color:var(--calcite-card-accent-color-selected, var(--calcite-card-selection-icon-color-selected, var(--calcite-color-brand)))}:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper-deprecated,:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper{background-color:var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));color:var(--calcite-card-selection-color-hover, var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2)))}:host([selected]:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper-deprecated,:host([selected]:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper{background-color:var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press));color:var(--calcite-card-accent-color-selected, var(--calcite-card-selection-icon-color-selected, var(--calcite-color-brand)))}.thumbnail-wrapper{display:flex}.content-wrapper.inline{flex-direction:row}.content-wrapper.inline>.container{inline-size:60%}.content-wrapper.inline>.thumbnail-wrapper{inline-size:40%;align-items:flex-start}.content-wrapper.inline slot[name=thumbnail]::slotted(img),.content-wrapper.inline img::slotted([slot=thumbnail]){inline-size:100%}slot[name=footer-start]::slotted(*),slot[name=footer-end]::slotted(*){display:flex;gap:0.25rem}:host([hidden]){display:none}[hidden]{display:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}";
 const CalciteCardStyle0 = cardCss;
 
 const Card = class {
@@ -63,6 +63,27 @@ const Card = class {
         //  Private Methods
         //
         //--------------------------------------------------------------------------
+        this.handleThumbnailSlotChange = (event) => {
+            this.hasThumbnail = slotChangeHasAssignedElement(event);
+        };
+        this.handleHeadingSlotChange = (event) => {
+            this.hasHeading = slotChangeHasAssignedElement(event);
+        };
+        this.handleDescriptionSlotChange = (event) => {
+            this.hasDescription = slotChangeHasAssignedElement(event);
+        };
+        this.handleTitleSlotChange = (event) => {
+            this.hasTitle = slotChangeHasAssignedElement(event);
+        };
+        this.handleSubtitleSlotChange = (event) => {
+            this.hasSubtitle = slotChangeHasAssignedElement(event);
+        };
+        this.handleFooterStartSlotChange = (event) => {
+            this.hasFooterStart = slotChangeHasAssignedElement(event);
+        };
+        this.handleFooterEndSlotChange = (event) => {
+            this.hasFooterEnd = slotChangeHasAssignedElement(event);
+        };
         this.handleDefaultSlotChange = (event) => {
             this.hasContent = slotChangeHasAssignedElement(event);
         };
@@ -121,6 +142,13 @@ const Card = class {
         this.selectionMode = "none";
         this.messageOverrides = undefined;
         this.effectiveLocale = undefined;
+        this.hasThumbnail = false;
+        this.hasHeading = false;
+        this.hasDescription = false;
+        this.hasSubtitle = false;
+        this.hasTitle = false;
+        this.hasFooterStart = false;
+        this.hasFooterEnd = false;
         this.defaultMessages = undefined;
         this.hasContent = false;
     }
@@ -145,7 +173,6 @@ const Card = class {
     //
     // --------------------------------------------------------------------------
     connectedCallback() {
-        connectInteractive(this);
         connectLocalized(this);
         connectMessages(this);
     }
@@ -156,7 +183,6 @@ const Card = class {
         updateHostInteraction(this);
     }
     disconnectedCallback() {
-        disconnectInteractive(this);
         disconnectLocalized(this);
         disconnectMessages(this);
     }
@@ -171,7 +197,7 @@ const Card = class {
         return (h("calcite-label", { class: CSS.checkboxWrapperDeprecated }, h("calcite-checkbox", { checked: this.selected, label: this.messages.select, onClick: this.selectCardDeprecated, onKeyDown: this.cardSelectKeyDownDeprecated })));
     }
     renderThumbnail() {
-        return getSlotted(this.el, SLOTS.thumbnail) ? (h("section", { class: CSS.thumbnailWrapper }, h("slot", { name: SLOTS.thumbnail }))) : null;
+        return (h("section", { class: CSS.thumbnailWrapper, hidden: !this.hasThumbnail }, h("slot", { name: SLOTS.thumbnail, onSlotchange: this.handleThumbnailSlotChange })));
     }
     renderSelectionIcon() {
         const icon = this.selectionMode === "multiple" && this.selected
@@ -184,21 +210,14 @@ const Card = class {
         return (h("div", { class: CSS.checkboxWrapper, onPointerDown: this.cardSelectClick, tabIndex: -1 }, h("calcite-icon", { icon: icon, scale: "s" })));
     }
     renderHeader() {
-        const { el } = this;
-        const heading = getSlotted(el, SLOTS.heading);
-        const description = getSlotted(el, SLOTS.description);
-        const hasHeader = heading || description;
-        const subtitle = getSlotted(el, SLOTS.subtitle);
-        const title = getSlotted(el, SLOTS.title);
-        const hasDeprecatedHeader = subtitle || title;
-        return hasHeader || hasDeprecatedHeader ? (h("header", { class: CSS.header }, this.selectable ? this.renderCheckboxDeprecated() : null, h("div", { class: CSS.headerTextContainer }, h("slot", { key: "heading-slot", name: SLOTS.heading }), h("slot", { key: "description-slot", name: SLOTS.description }), h("slot", { key: "deprecated-title-slot", name: SLOTS.title }), h("slot", { key: "deprecated-subtitle-slot", name: SLOTS.subtitle })), this.selectionMode !== "none" && this.renderSelectionIcon())) : null;
+        const hasHeader = this.hasHeading || this.hasDescription;
+        const hasDeprecatedHeader = this.hasSubtitle || this.hasTitle;
+        const showHeader = hasHeader || hasDeprecatedHeader;
+        return (h("header", { class: CSS.header, hidden: !showHeader }, this.selectable ? this.renderCheckboxDeprecated() : null, h("div", { class: CSS.headerTextContainer }, h("slot", { name: SLOTS.heading, onSlotchange: this.handleHeadingSlotChange }), h("slot", { name: SLOTS.description, onSlotchange: this.handleDescriptionSlotChange }), h("slot", { name: SLOTS.title, onSlotchange: this.handleTitleSlotChange }), h("slot", { name: SLOTS.subtitle, onSlotchange: this.handleSubtitleSlotChange })), this.selectionMode !== "none" && this.renderSelectionIcon()));
     }
     renderFooter() {
-        const { el } = this;
-        const startFooter = getSlotted(el, SLOTS.footerStart);
-        const endFooter = getSlotted(el, SLOTS.footerEnd);
-        const hasFooter = startFooter || endFooter;
-        return hasFooter ? (h("footer", { class: CSS.footer }, h("slot", { name: SLOTS.footerStart }), h("slot", { name: SLOTS.footerEnd }))) : null;
+        const hasFooter = this.hasFooterStart || this.hasFooterEnd;
+        return (h("footer", { class: CSS.footer, hidden: !hasFooter }, h("slot", { name: SLOTS.footerStart, onSlotchange: this.handleFooterStartSlotChange }), h("slot", { name: SLOTS.footerEnd, onSlotchange: this.handleFooterEndSlotChange })));
     }
     render() {
         const thumbnailInline = this.thumbnailPosition.startsWith("inline");
@@ -208,10 +227,10 @@ const Card = class {
             : this.selectionMode !== "none"
                 ? "radio"
                 : undefined;
-        return (h(Host, { key: 'e33b76130cd91d3caa6662f1f58b79d238c708fb' }, h(InteractiveContainer, { key: '772da2a3a1274eb467d1febb915ffb97953beae7', disabled: this.disabled }, h("div", { key: 'b9fdbb51cfb07964479d0f723add39b8a2384f86', "aria-checked": this.selectionMode !== "none" ? toAriaBoolean(this.selected) : undefined, "aria-disabled": this.disabled, "aria-label": this.label, class: { [CSS.contentWrapper]: true, inline: thumbnailInline }, onClick: this.cardBodyClickHandler, onKeyDown: this.keyDownHandler, ref: (el) => (this.containerEl = el), role: role, tabIndex: !this.selectable || this.disabled ? 0 : -1 }, this.loading ? (h("div", { "aria-live": "polite", class: "calcite-card-loader-container" }, h("calcite-loader", { label: this.messages.loading }))) : null, thumbnailStart && this.renderThumbnail(), h("section", { key: '51cfe132a589ec65b39544b4c1246545b0b864f2', "aria-busy": toAriaBoolean(this.loading), class: { [CSS.container]: true } }, this.renderHeader(), h("div", { key: 'c256998e330a949d47a12b23127c68cba081854e', class: {
+        return (h(Host, { key: 'dbb99f5c06440d5f7100f89bfef1febbd8d01f3e' }, h(InteractiveContainer, { key: '6fef7f69921c33bab4c66d34c0691821c837cc82', disabled: this.disabled }, h("div", { key: 'bcd3a1fecbfc39a15102099db8e6943b0e2207c5', "aria-checked": this.selectionMode !== "none" ? toAriaBoolean(this.selected) : undefined, "aria-label": this.label, class: { [CSS.contentWrapper]: true, inline: thumbnailInline }, onClick: this.cardBodyClickHandler, onKeyDown: this.keyDownHandler, ref: (el) => (this.containerEl = el), role: role, tabIndex: !this.selectable || this.disabled ? 0 : -1 }, this.loading ? (h("div", { "aria-live": "polite", class: "calcite-card-loader-container" }, h("calcite-loader", { label: this.messages.loading }))) : null, thumbnailStart && this.renderThumbnail(), h("section", { key: '81c5383f8b09ce6372fd94a0e3c9e91c502a18bc', "aria-busy": toAriaBoolean(this.loading), class: { [CSS.container]: true } }, this.renderHeader(), h("div", { key: '12d9564007bc07a3e0643ec0b097cab856968e02', class: {
                 [CSS.cardContent]: true,
                 [CSS.hasSlottedContent]: this.hasContent,
-            } }, h("slot", { key: '17fb9b0a9919f09a474d3c54818e770be9a85b77', onSlotchange: this.handleDefaultSlotChange })), this.renderFooter()), !thumbnailStart && this.renderThumbnail()))));
+            } }, h("slot", { key: '1c500b0005123c768bfb77eecb62a0166c5e178f', onSlotchange: this.handleDefaultSlotChange })), this.renderFooter()), !thumbnailStart && this.renderThumbnail()))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }