@esri/calcite-components 2.1.0-next.9 → 2.2.0-next.0

package/hydrate/index.js

@@ -1,14 +1,14 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.1.0-next.9
+ * v2.2.0-next.0
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
 /*!
- Stencil Mock Doc v4.8.1 | MIT Licensed | https://stenciljs.com
+ Stencil Mock Doc v4.8.2 | MIT Licensed | https://stenciljs.com
  */
 const CONTENT_REF_ID = 'r';
 const ORG_LOCATION_ID = 'o';
@@ -5074,16 +5074,16 @@ function hydrateApp(e, t, o, n, s) {
  const r = new Set, i = new Set, d = new Set, c = e.document.createElement, $ = e.document.createElementNS, m = Promise.resolve();
  let p, h = !1;
  try {
-  function u() {
+  function f() {
    return L(this);
   }
-  function f(e) {
+  function u(e) {
    if (isValidComponent(e, t) && !getHostRef(e)) {
     const t = loadModule({
      $tagName$: e.nodeName.toLowerCase(),
      $flags$: null
     });
-    null != t && null != t.cmpMeta && (i.add(e), e.connectedCallback = u, registerHost(e, t.cmpMeta), 
+    null != t && null != t.cmpMeta && (i.add(e), e.connectedCallback = f, registerHost(e, t.cmpMeta), 
     function o(e, t) {
      if ("function" != typeof e.componentOnReady && (e.componentOnReady = componentOnReady$1), 
      "function" != typeof e.forceUpdate && (e.forceUpdate = forceUpdate), 1 & t.$flags$ && (e.shadowRoot = e), 
@@ -5121,7 +5121,7 @@ function hydrateApp(e, t, o, n, s) {
   }
   function g(e) {
    if (null != e && 1 === e.nodeType) {
-    f(e);
+    u(e);
     const t = e.children;
     for (let e = 0, o = t.length; e < o; e++) g(t[e]);
    }
@@ -5158,10 +5158,10 @@ function hydrateApp(e, t, o, n, s) {
   }
   e.document.createElement = function t(o) {
    const n = c.call(e.document, o);
-   return f(n), n;
+   return u(n), n;
   }, e.document.createElementNS = function t(o, n) {
    const s = $.call(e.document, o, n);
-   return f(s), s;
+   return u(s), s;
   }, p = global.setTimeout((function I() {
    a(`Hydrate exceeded timeout${function e(t) {
     return Array.from(t).map(waitingOnElementMsg);
@@ -5417,9 +5417,9 @@ const createElm = (e, t, o, n) => {
   r && a.appendChild(r);
   ("svg" === l.$tag$ ? isSvgMode = !1 : "foreignObject" === a.tagName && (isSvgMode = !0));
  }
- return (a["s-hn"] = hostTagName, 3 & l.$flags$ && (a["s-sr"] = !0, 
+ return a["s-hn"] = hostTagName, 3 & l.$flags$ && (a["s-sr"] = !0, 
  a["s-fs"] = null === (s = l.$attrs$) || void 0 === s ? void 0 : s.slot, a["s-cr"] = contentRef, 
- a["s-sn"] = l.$name$ || "", i = e && e.$children$ && e.$children$[o], i && i.$tag$ === l.$tag$ && e.$elm$ && putBackInOriginalLocation(e.$elm$, !1))), 
+ a["s-sn"] = l.$name$ || "", i = e && e.$children$ && e.$children$[o], i && i.$tag$ === l.$tag$ && e.$elm$ && (putBackInOriginalLocation(e.$elm$, !1))), 
  a;
 }, putBackInOriginalLocation = (e, t) => {
  var o;
@@ -5451,10 +5451,10 @@ const createElm = (e, t, o, n) => {
  null !== a ? (r = o["s-cr"]) ? r.parentNode.textContent = a : e.$text$ !== a && (o.data = a) : ((isSvgMode = "svg" === l || "foreignObject" !== l && isSvgMode), 
  ("slot" === l || updateElement(e, t, isSvgMode)), 
  null !== n && null !== s ? ((e, t, o, n) => {
-  let s, l, a = 0, r = 0, i = 0, d = 0, c = t.length - 1, $ = t[0], m = t[c], p = n.length - 1, h = n[0], u = n[p];
-  for (;a <= c && r <= p; ) if (null == $) $ = t[++a]; else if (null == m) m = t[--c]; else if (null == h) h = n[++r]; else if (null == u) u = n[--p]; else if (isSameVnode($, h)) patch($, h), 
-  $ = t[++a], h = n[++r]; else if (isSameVnode(m, u)) patch(m, u), m = t[--c], u = n[--p]; else if (isSameVnode($, u)) "slot" !== $.$tag$ && "slot" !== u.$tag$ || putBackInOriginalLocation($.$elm$.parentNode, !1), 
-  patch($, u), e.insertBefore($.$elm$, m.$elm$.nextSibling), $ = t[++a], u = n[--p]; else if (isSameVnode(m, h)) "slot" !== $.$tag$ && "slot" !== u.$tag$ || putBackInOriginalLocation(m.$elm$.parentNode, !1), 
+  let s, l, a = 0, r = 0, i = 0, d = 0, c = t.length - 1, $ = t[0], m = t[c], p = n.length - 1, h = n[0], f = n[p];
+  for (;a <= c && r <= p; ) if (null == $) $ = t[++a]; else if (null == m) m = t[--c]; else if (null == h) h = n[++r]; else if (null == f) f = n[--p]; else if (isSameVnode($, h)) patch($, h), 
+  $ = t[++a], h = n[++r]; else if (isSameVnode(m, f)) patch(m, f), m = t[--c], f = n[--p]; else if (isSameVnode($, f)) "slot" !== $.$tag$ && "slot" !== f.$tag$ || putBackInOriginalLocation($.$elm$.parentNode, !1), 
+  patch($, f), e.insertBefore($.$elm$, m.$elm$.nextSibling), $ = t[++a], f = n[--p]; else if (isSameVnode(m, h)) "slot" !== $.$tag$ && "slot" !== f.$tag$ || putBackInOriginalLocation(m.$elm$.parentNode, !1), 
   patch(m, h), e.insertBefore(m.$elm$, $.$elm$), m = t[--c], h = n[++r]; else {
    if (i = -1, BUILD.vdomKey) for (d = a; d <= c; ++d) if (t[d] && null !== t[d].$key$ && t[d].$key$ === h.$key$) {
     i = d;
@@ -5511,17 +5511,17 @@ const createElm = (e, t, o, n) => {
 }, isNodeLocatedInSlot = (e, t) => 1 === e.nodeType ? null === e.getAttribute("slot") && "" === t || e.getAttribute("slot") === t : e["s-sn"] === t || "" === t, nullifyVNodeRefs = e => {
  (e.$attrs$ && e.$attrs$.ref && e.$attrs$.ref(null), e.$children$ && e.$children$.map(nullifyVNodeRefs));
 }, renderVdom = (e, t, o = !1) => {
- var n, s;
- const l = e.$hostElement$, a = e.$cmpMeta$, r = e.$vnode$ || newVNode(null, null), i = isHost(t) ? t : h(null, null, t);
- if (hostTagName = l.tagName, BUILD.isDev  ) ;
- if (a.$attrsToReflect$ && (i.$attrs$ = i.$attrs$ || {}, a.$attrsToReflect$.map((([e, t]) => i.$attrs$[t] = l[e]))), 
- o && i.$attrs$) for (const e of Object.keys(i.$attrs$)) l.hasAttribute(e) && ![ "key", "ref", "style", "class" ].includes(e) && (i.$attrs$[e] = l[e]);
- if (i.$tag$ = null, i.$flags$ |= 4, e.$vnode$ = i, i.$elm$ = r.$elm$ = l.shadowRoot || l, 
- (scopeId = l["s-sc"]), (contentRef = l["s-cr"], 
- useNativeShadowDom = supportsShadow, checkSlotFallbackVisibility = !1), patch(r, i), 
+ var n, s, l, a;
+ const i = e.$hostElement$, d = e.$cmpMeta$, c = e.$vnode$ || newVNode(null, null), $ = isHost(t) ? t : h(null, null, t);
+ if (hostTagName = i.tagName, BUILD.isDev  ) ;
+ if (d.$attrsToReflect$ && ($.$attrs$ = $.$attrs$ || {}, d.$attrsToReflect$.map((([e, t]) => $.$attrs$[t] = i[e]))), 
+ o && $.$attrs$) for (const e of Object.keys($.$attrs$)) i.hasAttribute(e) && ![ "key", "ref", "style", "class" ].includes(e) && ($.$attrs$[e] = i[e]);
+ if ($.$tag$ = null, $.$flags$ |= 4, e.$vnode$ = $, $.$elm$ = c.$elm$ = i.shadowRoot || i, 
+ (scopeId = i["s-sc"]), (contentRef = i["s-cr"], 
+ useNativeShadowDom = supportsShadow, checkSlotFallbackVisibility = !1), patch(c, $), 
  BUILD.slotRelocation) {
   if (plt.$flags$ |= 1, checkSlotRelocate) {
-   markSlotContentForRelocation(i.$elm$);
+   markSlotContentForRelocation($.$elm$);
    for (const e of relocateNodes) {
     const t = e.$nodeToRelocate$;
     if (!t["s-ol"]) {
@@ -5530,27 +5530,28 @@ const createElm = (e, t, o, n) => {
     }
    }
    for (const e of relocateNodes) {
-    const t = e.$nodeToRelocate$, o = e.$slotRefNode$;
-    if (o) {
-     const e = o.parentNode;
-     let l = o.nextSibling;
+    const t = e.$nodeToRelocate$, r = e.$slotRefNode$;
+    if (r) {
+     const e = r.parentNode;
+     let o = r.nextSibling;
      {
-      let o = null === (n = t["s-ol"]) || void 0 === n ? void 0 : n.previousSibling;
-      for (;o; ) {
-       let n = null !== (s = o["s-nr"]) && void 0 !== s ? s : null;
+      let l = null === (n = t["s-ol"]) || void 0 === n ? void 0 : n.previousSibling;
+      for (;l; ) {
+       let n = null !== (s = l["s-nr"]) && void 0 !== s ? s : null;
        if (n && n["s-sn"] === t["s-sn"] && e === n.parentNode && (n = n.nextSibling, !n || !n["s-nr"])) {
-        l = n;
+        o = n;
         break;
        }
-       o = o.previousSibling;
+       l = l.previousSibling;
       }
      }
-     (!l && e !== t.parentNode || t.nextSibling !== l) && t !== l && (!t["s-hn"] && t["s-ol"] && (t["s-hn"] = t["s-ol"].parentNode.nodeName), 
-     e.insertBefore(t, l));
-    } else 1 === t.nodeType && (t.hidden = !0);
+     (!o && e !== t.parentNode || t.nextSibling !== o) && t !== o && (t["s-hn"] || !t["s-ol"] || (t["s-hn"] = t["s-ol"].parentNode.nodeName), 
+     e.insertBefore(t, o), 1 === t.nodeType && (t.hidden = null !== (l = t["s-ih"]) && void 0 !== l && l));
+    } else 1 === t.nodeType && (o && (t["s-ih"] = null !== (a = t.hidden) && void 0 !== a && a), 
+    t.hidden = !0);
    }
   }
-  checkSlotFallbackVisibility && updateFallbackSlotVisibility(i.$elm$), plt.$flags$ &= -2, 
+  checkSlotFallbackVisibility && updateFallbackSlotVisibility($.$elm$), plt.$flags$ &= -2, 
   relocateNodes.length = 0;
  }
 }, slotReferenceDebugNode = e => doc.createComment(`<slot${e.$name$ ? ' name="' + e.$name$ + '"' : ""}> (host=${hostTagName.toLowerCase()})`), originalLocationDebugNode = e => doc.createComment("org-location for " + (e.localName ? `<${e.localName}> (host=${e["s-hn"]})` : `[${e.textContent}]`)), attachToAncestor = (e, t) => {
@@ -7110,7 +7111,7 @@ const SLOTS$z = {
     actionsStart: "actions-start",
     actionsEnd: "actions-end",
 };
-const CSS$1h = {
+const CSS$1i = {
     icon: "icon",
     header: "header",
     headerContent: "header-content",
@@ -7178,28 +7179,28 @@ class AccordionItem {
     // --------------------------------------------------------------------------
     renderActionsStart() {
         const { el } = this;
-        return getSlotted(el, SLOTS$z.actionsStart) ? (hAsync("div", { class: CSS$1h.actionsStart }, hAsync("slot", { name: SLOTS$z.actionsStart }))) : null;
+        return getSlotted(el, SLOTS$z.actionsStart) ? (hAsync("div", { class: CSS$1i.actionsStart }, hAsync("slot", { name: SLOTS$z.actionsStart }))) : null;
     }
     renderActionsEnd() {
         const { el } = this;
-        return getSlotted(el, SLOTS$z.actionsEnd) ? (hAsync("div", { class: CSS$1h.actionsEnd }, hAsync("slot", { name: SLOTS$z.actionsEnd }))) : null;
+        return getSlotted(el, SLOTS$z.actionsEnd) ? (hAsync("div", { class: CSS$1i.actionsEnd }, hAsync("slot", { name: SLOTS$z.actionsEnd }))) : null;
     }
     render() {
         const { iconFlipRtl } = this;
         const dir = getElementDir(this.el);
-        const iconStartEl = this.iconStart ? (hAsync("calcite-icon", { class: CSS$1h.iconStart, flipRtl: iconFlipRtl === "both" || iconFlipRtl === "start", icon: this.iconStart, key: "icon-start", scale: getIconScale(this.scale) })) : null;
-        const iconEndEl = this.iconEnd ? (hAsync("calcite-icon", { class: CSS$1h.iconEnd, flipRtl: iconFlipRtl === "both" || iconFlipRtl === "end", icon: this.iconEnd, key: "icon-end", scale: getIconScale(this.scale) })) : null;
+        const iconStartEl = this.iconStart ? (hAsync("calcite-icon", { class: CSS$1i.iconStart, flipRtl: iconFlipRtl === "both" || iconFlipRtl === "start", icon: this.iconStart, key: "icon-start", scale: getIconScale(this.scale) })) : null;
+        const iconEndEl = this.iconEnd ? (hAsync("calcite-icon", { class: CSS$1i.iconEnd, flipRtl: iconFlipRtl === "both" || iconFlipRtl === "end", icon: this.iconEnd, key: "icon-end", scale: getIconScale(this.scale) })) : null;
         const { description } = this;
         return (hAsync(Host, null, hAsync("div", { class: {
                 [`icon-position--${this.iconPosition}`]: true,
                 [`icon-type--${this.iconType}`]: true,
-            } }, hAsync("div", { class: { [CSS$1h.header]: true, [CSS_UTILITY.rtl]: dir === "rtl" } }, this.renderActionsStart(), hAsync("div", { "aria-controls": IDS$2.section, "aria-expanded": toAriaBoolean(this.expanded), class: CSS$1h.headerContent, id: IDS$2.sectionToggle, onClick: this.itemHeaderClickHandler, role: "button", tabindex: "0" }, hAsync("div", { class: CSS$1h.headerContainer }, iconStartEl, hAsync("div", { class: CSS$1h.headerText }, hAsync("span", { class: CSS$1h.heading }, this.heading), description ? hAsync("span", { class: CSS$1h.description }, description) : null), iconEndEl), hAsync("calcite-icon", { class: CSS$1h.expandIcon, icon: this.iconType === "chevron"
+            } }, hAsync("div", { class: { [CSS$1i.header]: true, [CSS_UTILITY.rtl]: dir === "rtl" } }, this.renderActionsStart(), hAsync("div", { "aria-controls": IDS$2.section, "aria-expanded": toAriaBoolean(this.expanded), class: CSS$1i.headerContent, id: IDS$2.sectionToggle, onClick: this.itemHeaderClickHandler, role: "button", tabindex: "0" }, hAsync("div", { class: CSS$1i.headerContainer }, iconStartEl, hAsync("div", { class: CSS$1i.headerText }, hAsync("span", { class: CSS$1i.heading }, this.heading), description ? hAsync("span", { class: CSS$1i.description }, description) : null), iconEndEl), hAsync("calcite-icon", { class: CSS$1i.expandIcon, icon: this.iconType === "chevron"
                 ? "chevronDown"
                 : this.iconType === "caret"
                     ? "caretDown"
                     : this.expanded
                         ? "minus"
-                        : "plus", scale: getIconScale(this.scale) })), this.renderActionsEnd()), hAsync("section", { "aria-labelledby": IDS$2.sectionToggle, class: CSS$1h.content, id: IDS$2.section }, hAsync("slot", null)))));
+                        : "plus", scale: getIconScale(this.scale) })), this.renderActionsEnd()), hAsync("section", { "aria-labelledby": IDS$2.sectionToggle, class: CSS$1i.content, id: IDS$2.section }, hAsync("slot", null)))));
     }
     //--------------------------------------------------------------------------
     //
@@ -8098,7 +8099,7 @@ function defaultOnMessagesChange() {
     mergeMessages(this);
 }
 
-const CSS$1g = {
+const CSS$1h = {
     button: "button",
     buttonTextVisible: "button--text-visible",
     buttonCompact: "button--compact",
@@ -8212,39 +8213,39 @@ class Action {
     renderTextContainer() {
         const { text, textEnabled } = this;
         const textContainerClasses = {
-            [CSS$1g.textContainer]: true,
-            [CSS$1g.textContainerVisible]: textEnabled,
+            [CSS$1h.textContainer]: true,
+            [CSS$1h.textContainerVisible]: textEnabled,
         };
         return text ? (hAsync("div", { class: textContainerClasses, key: "text-container" }, text)) : null;
     }
     renderIndicatorText() {
         const { indicator, messages, indicatorId, buttonId } = this;
-        return (hAsync("div", { "aria-labelledby": buttonId, "aria-live": "polite", class: CSS$1g.indicatorText, id: indicatorId, role: "region" }, indicator ? messages.indicator : null));
+        return (hAsync("div", { "aria-labelledby": buttonId, "aria-live": "polite", class: CSS$1h.indicatorText, id: indicatorId, role: "region" }, indicator ? messages.indicator : null));
     }
     renderIconContainer() {
         const { loading, icon, scale, el, iconFlipRtl, indicator } = this;
         const loaderScale = scale === "l" ? "l" : "m";
         const calciteLoaderNode = loading ? (hAsync("calcite-loader", { inline: true, label: this.messages.loading, scale: loaderScale })) : null;
-        const calciteIconNode = icon ? (hAsync("calcite-icon", { class: { [CSS$1g.indicatorWithIcon]: indicator }, flipRtl: iconFlipRtl, icon: icon, scale: getIconScale(this.scale) })) : null;
+        const calciteIconNode = icon ? (hAsync("calcite-icon", { class: { [CSS$1h.indicatorWithIcon]: indicator }, flipRtl: iconFlipRtl, icon: icon, scale: getIconScale(this.scale) })) : null;
         const iconNode = calciteLoaderNode || calciteIconNode;
         const hasIconToDisplay = iconNode || el.children?.length;
         const slotContainerNode = (hAsync("div", { class: {
-                [CSS$1g.slotContainer]: true,
-                [CSS$1g.slotContainerHidden]: loading,
+                [CSS$1h.slotContainer]: true,
+                [CSS$1h.slotContainerHidden]: loading,
             } }, hAsync("slot", null)));
-        return hasIconToDisplay ? (hAsync("div", { "aria-hidden": "true", class: CSS$1g.iconContainer, key: "icon-container" }, iconNode, slotContainerNode)) : null;
+        return hasIconToDisplay ? (hAsync("div", { "aria-hidden": "true", class: CSS$1h.iconContainer, key: "icon-container" }, iconNode, slotContainerNode)) : null;
     }
     render() {
         const { active, compact, disabled, icon, loading, textEnabled, label, text, indicator, indicatorId, buttonId, messages, } = this;
         const ariaLabel = `${label || text}${indicator ? ` (${messages.indicator})` : ""}`;
         const buttonClasses = {
-            [CSS$1g.button]: true,
-            [CSS$1g.buttonTextVisible]: textEnabled,
-            [CSS$1g.buttonCompact]: compact,
+            [CSS$1h.button]: true,
+            [CSS$1h.buttonTextVisible]: textEnabled,
+            [CSS$1h.buttonCompact]: compact,
         };
         return (hAsync(Host, null, hAsync("button", { "aria-busy": toAriaBoolean(loading), "aria-controls": indicator ? indicatorId : null, "aria-disabled": toAriaBoolean(disabled), "aria-label": ariaLabel, "aria-pressed": toAriaBoolean(active), class: buttonClasses, disabled: disabled, id: buttonId,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: (buttonEl) => (this.buttonEl = buttonEl) }, this.renderIconContainer(), this.renderTextContainer(), !icon && indicator && hAsync("div", { class: CSS$1g.indicatorWithoutIcon, key: "indicator-no-icon" })), hAsync("slot", { name: SLOTS$y.tooltip, onSlotchange: this.handleTooltipSlotChange }), this.renderIndicatorText()));
+            ref: (buttonEl) => (this.buttonEl = buttonEl) }, this.renderIconContainer(), this.renderTextContainer(), !icon && indicator && hAsync("div", { class: CSS$1h.indicatorWithoutIcon, key: "indicator-no-icon" })), hAsync("slot", { name: SLOTS$y.tooltip, onSlotchange: this.handleTooltipSlotChange }), this.renderIndicatorText()));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -9552,11 +9553,11 @@ const SLOTS$x = {
 const ICONS$k = {
     menu: "ellipsis",
 };
-const CSS$1f = {
+const CSS$1g = {
     container: "container",
 };
 
-const CSS$1e = {
+const CSS$1f = {
     menu: "menu",
     defaultTrigger: "default-trigger",
 };
@@ -9657,7 +9658,7 @@ const ExpandToggle = ({ expanded, expandText, collapseText, toggle, el, position
     return actionNode;
 };
 
-const CSS$1d = {
+const CSS$1e = {
     actionGroupEnd: "action-group--end",
 };
 const SLOTS$v = {
@@ -9863,7 +9864,7 @@ class ActionBar {
         const expandToggleNode = !expandDisabled ? (hAsync(ExpandToggle, { collapseText: messages.collapse, el: el, expandText: messages.expand, expanded: expanded, position: position, scale: scale, toggle: toggleExpand, tooltip: this.expandTooltip,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setExpandToggleRef })) : null;
-        return (hAsync("calcite-action-group", { class: CSS$1d.actionGroupEnd, hidden: this.expandDisabled && !(this.hasActionsEnd || this.hasBottomActions), label: actionsEndGroupLabel, layout: layout, scale: scale }, hAsync("slot", { name: SLOTS$v.actionsEnd, onSlotchange: this.handleActionsEndSlotChange }), hAsync("slot", { name: SLOTS$v.bottomActions, onSlotchange: this.handleBottomActionsSlotChange }), hAsync("slot", { name: SLOTS$v.expandTooltip, onSlotchange: this.handleTooltipSlotChange }), expandToggleNode));
+        return (hAsync("calcite-action-group", { class: CSS$1e.actionGroupEnd, hidden: this.expandDisabled && !(this.hasActionsEnd || this.hasBottomActions), label: actionsEndGroupLabel, layout: layout, scale: scale }, hAsync("slot", { name: SLOTS$v.actionsEnd, onSlotchange: this.handleActionsEndSlotChange }), hAsync("slot", { name: SLOTS$v.bottomActions, onSlotchange: this.handleBottomActionsSlotChange }), hAsync("slot", { name: SLOTS$v.expandTooltip, onSlotchange: this.handleTooltipSlotChange }), expandToggleNode));
     }
     render() {
         return (hAsync(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, hAsync("slot", { onSlotchange: this.handleDefaultSlotChange }), this.renderBottomActionGroup()));
@@ -9991,7 +9992,7 @@ class ActionGroup {
         return (hAsync("calcite-action-menu", { expanded: expanded, flipPlacements: ["left", "right"], hidden: !hasMenuActions, label: messages.more, onCalciteActionMenuOpen: this.setMenuOpen, open: menuOpen, overlayPositioning: overlayPositioning, placement: layout === "horizontal" ? "bottom-start" : "leading-start", scale: scale }, hAsync("calcite-action", { icon: ICONS$k.menu, scale: scale, slot: SLOTS$w.trigger, text: messages.more, textEnabled: expanded }), hAsync("slot", { name: SLOTS$x.menuActions, onSlotchange: this.handleMenuActionsSlotChange }), hAsync("slot", { name: SLOTS$x.menuTooltip, slot: SLOTS$w.tooltip })));
     }
     render() {
-        return (hAsync("div", { "aria-label": this.label, class: CSS$1f.container, role: "group" }, hAsync("slot", null), this.renderMenu()));
+        return (hAsync("div", { "aria-label": this.label, class: CSS$1g.container, role: "group" }, hAsync("slot", null), this.renderMenu()));
     }
     static get delegatesFocus() { return true; }
     static get assetsDirs() { return ["assets"]; }
@@ -10285,7 +10286,7 @@ class ActionMenu {
     }
     renderMenuButton() {
         const { appearance, label, scale, expanded } = this;
-        const menuButtonSlot = (hAsync("slot", { name: SLOTS$w.trigger, onSlotchange: this.setMenuButtonEl }, hAsync("calcite-action", { appearance: appearance, class: CSS$1e.defaultTrigger, icon: ICONS$j.menu, scale: scale, text: label, textEnabled: expanded,
+        const menuButtonSlot = (hAsync("slot", { name: SLOTS$w.trigger, onSlotchange: this.setMenuButtonEl }, hAsync("calcite-action", { appearance: appearance, class: CSS$1f.defaultTrigger, icon: ICONS$j.menu, scale: scale, text: label, textEnabled: expanded,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setDefaultMenuButtonEl })));
         return menuButtonSlot;
@@ -10294,7 +10295,7 @@ class ActionMenu {
         const { actionElements, activeMenuItemIndex, open, menuId, menuButtonEl, label, placement, overlayPositioning, flipPlacements, } = this;
         const activeAction = actionElements[activeMenuItemIndex];
         const activeDescendantId = activeAction?.id || null;
-        return (hAsync("calcite-popover", { autoClose: true, flipPlacements: flipPlacements, focusTrapDisabled: true, label: label, offsetDistance: 0, onCalcitePopoverClose: this.handlePopoverClose, onCalcitePopoverOpen: this.handlePopoverOpen, open: open, overlayPositioning: overlayPositioning, placement: placement, pointerDisabled: true, referenceElement: menuButtonEl }, hAsync("div", { "aria-activedescendant": activeDescendantId, "aria-labelledby": menuButtonEl?.id, class: CSS$1e.menu, id: menuId, onClick: this.handleCalciteActionClick, role: "menu", tabIndex: -1 }, hAsync("slot", { onSlotchange: this.handleDefaultSlotChange }))));
+        return (hAsync("calcite-popover", { autoClose: true, flipPlacements: flipPlacements, focusTrapDisabled: true, label: label, offsetDistance: 0, onCalcitePopoverClose: this.handlePopoverClose, onCalcitePopoverOpen: this.handlePopoverOpen, open: open, overlayPositioning: overlayPositioning, placement: placement, pointerDisabled: true, referenceElement: menuButtonEl }, hAsync("div", { "aria-activedescendant": activeDescendantId, "aria-labelledby": menuButtonEl?.id, class: CSS$1f.menu, id: menuId, onClick: this.handleCalciteActionClick, role: "menu", tabIndex: -1 }, hAsync("slot", { onSlotchange: this.handleDefaultSlotChange }))));
     }
     render() {
         return (hAsync(Fragment, null, this.renderMenuButton(), this.renderMenuItems(), hAsync("slot", { name: SLOTS$w.tooltip, onSlotchange: this.updateTooltip })));
@@ -10331,7 +10332,7 @@ class ActionMenu {
     }; }
 }
 
-const CSS$1c = {
+const CSS$1d = {
     actionGroupEnd: "action-group--end",
     container: "container",
 };
@@ -10456,10 +10457,10 @@ class ActionPad {
         const expandToggleNode = !expandDisabled ? (hAsync(ExpandToggle, { collapseText: messages.collapse, el: el, expandText: messages.expand, expanded: expanded, position: position, scale: scale, toggle: toggleExpand, tooltip: this.expandTooltip,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setExpandToggleRef })) : null;
-        return expandToggleNode ? (hAsync("calcite-action-group", { class: CSS$1c.actionGroupEnd, label: actionsEndGroupLabel, layout: layout, scale: scale }, hAsync("slot", { name: SLOTS$u.expandTooltip, onSlotchange: this.handleTooltipSlotChange }), expandToggleNode)) : null;
+        return expandToggleNode ? (hAsync("calcite-action-group", { class: CSS$1d.actionGroupEnd, label: actionsEndGroupLabel, layout: layout, scale: scale }, hAsync("slot", { name: SLOTS$u.expandTooltip, onSlotchange: this.handleTooltipSlotChange }), expandToggleNode)) : null;
     }
     render() {
-        return (hAsync(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, hAsync("div", { class: CSS$1c.container }, hAsync("slot", { onSlotchange: this.handleDefaultSlotChange }), this.renderBottomActionGroup())));
+        return (hAsync(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, hAsync("div", { class: CSS$1d.container }, hAsync("slot", { onSlotchange: this.handleDefaultSlotChange }), this.renderBottomActionGroup())));
     }
     static get delegatesFocus() { return true; }
     static get assetsDirs() { return ["assets"]; }
@@ -10591,7 +10592,7 @@ const SLOTS$t = {
     message: "message",
     link: "link",
 };
-const CSS$1b = {
+const CSS$1c = {
     actionsEnd: "actions-end",
     close: "close",
     container: "container",
@@ -10753,16 +10754,16 @@ class Alert {
         const effectiveIcon = setRequestedIcon(KindIcons, this.icon, this.kind);
         const hasQueuedAlerts = this.queueLength > 1;
         return (hAsync(Host, { "aria-hidden": toAriaBoolean(hidden), "aria-label": label, "calcite-hydrated-hidden": hidden, role: role }, hAsync("div", { class: {
-                [CSS$1b.container]: true,
-                [CSS$1b.containerQueued]: queued,
-                [`${CSS$1b.container}--${placement}`]: true,
-                [CSS$1b.containerSlottedInShell]: this.slottedInShell,
+                [CSS$1c.container]: true,
+                [CSS$1c.containerQueued]: queued,
+                [`${CSS$1c.container}--${placement}`]: true,
+                [CSS$1c.containerSlottedInShell]: this.slottedInShell,
             }, onPointerEnter: this.autoClose && this.autoCloseTimeoutId ? this.handleMouseOver : null, onPointerLeave: this.autoClose && this.autoCloseTimeoutId ? this.handleMouseLeave : null,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.setTransitionEl }, effectiveIcon && this.renderIcon(effectiveIcon), hAsync("div", { class: CSS$1b.textContainer }, hAsync("slot", { name: SLOTS$t.title }), hAsync("slot", { name: SLOTS$t.message }), hAsync("slot", { name: SLOTS$t.link })), this.renderActionsEnd(), hasQueuedAlerts ? this.renderQueueCount() : null, this.renderCloseButton(), open && !queued && autoClose ? hAsync("div", { class: CSS$1b.dismissProgress }) : null)));
+            ref: this.setTransitionEl }, effectiveIcon && this.renderIcon(effectiveIcon), hAsync("div", { class: CSS$1c.textContainer }, hAsync("slot", { name: SLOTS$t.title }), hAsync("slot", { name: SLOTS$t.message }), hAsync("slot", { name: SLOTS$t.link })), this.renderActionsEnd(), hasQueuedAlerts ? this.renderQueueCount() : null, this.renderCloseButton(), open && !queued && autoClose ? hAsync("div", { class: CSS$1c.dismissProgress }) : null)));
     }
     renderCloseButton() {
-        return (hAsync("button", { "aria-label": this.messages.close, class: CSS$1b.close, key: "close", onClick: this.closeAlert, type: "button",
+        return (hAsync("button", { "aria-label": this.messages.close, class: CSS$1c.close, key: "close", onClick: this.closeAlert, type: "button",
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: (el) => (this.closeButton = el) }, hAsync("calcite-icon", { icon: "x", scale: getIconScale(this.scale) })));
     }
@@ -10770,15 +10771,15 @@ class Alert {
         const queueNumber = this.queueLength > 2 ? this.queueLength - 1 : 1;
         const queueText = numberStringFormatter.numberFormatter.format(queueNumber);
         return (hAsync("div", { class: {
-                [CSS$1b.queueCount]: true,
-                [CSS$1b.queueCountActive]: this.queueLength > 1,
+                [CSS$1c.queueCount]: true,
+                [CSS$1c.queueCountActive]: this.queueLength > 1,
             }, key: "queue-count" }, hAsync("calcite-chip", { scale: this.scale, value: queueText }, queueText)));
     }
     renderActionsEnd() {
-        return (hAsync("div", { class: CSS$1b.actionsEnd }, hAsync("slot", { name: SLOTS$t.actionsEnd, onSlotchange: this.actionsEndSlotChangeHandler })));
+        return (hAsync("div", { class: CSS$1c.actionsEnd }, hAsync("slot", { name: SLOTS$t.actionsEnd, onSlotchange: this.actionsEndSlotChangeHandler })));
     }
     renderIcon(icon) {
-        return (hAsync("div", { class: CSS$1b.icon }, hAsync("calcite-icon", { flipRtl: this.iconFlipRtl, icon: icon, scale: getIconScale(this.scale) })));
+        return (hAsync("div", { class: CSS$1c.icon }, hAsync("calcite-icon", { flipRtl: this.iconFlipRtl, icon: icon, scale: getIconScale(this.scale) })));
     }
     // when an alert is opened or closed, update queue and determine active alert
     alertSync(event) {
@@ -11249,7 +11250,7 @@ const IDS$1 = {
     toggle: "toggle",
     header: "header",
 };
-const CSS$1a = {
+const CSS$1b = {
     button: "button",
     container: "container",
     content: "content",
@@ -11399,27 +11400,27 @@ class Block {
     renderIcon() {
         const { loading, messages, status } = this;
         const hasSlottedIcon = !!getSlotted(this.el, SLOTS$s.icon);
-        return loading ? (hAsync("div", { class: CSS$1a.icon, key: "loader" }, hAsync("calcite-loader", { inline: true, label: messages.loading }))) : !!status ? (hAsync("div", { class: CSS$1a.icon, key: "status-icon" }, hAsync("calcite-icon", { class: {
-                [CSS$1a.statusIcon]: true,
-                [CSS$1a.valid]: status == "valid",
-                [CSS$1a.invalid]: status == "invalid",
-            }, icon: ICONS$h[status], scale: "s" }))) : hasSlottedIcon ? (hAsync("div", { class: CSS$1a.icon, key: "icon-slot" }, hAsync("slot", { key: "icon-slot", name: SLOTS$s.icon }))) : null;
+        return loading ? (hAsync("div", { class: CSS$1b.icon, key: "loader" }, hAsync("calcite-loader", { inline: true, label: messages.loading }))) : !!status ? (hAsync("div", { class: CSS$1b.icon, key: "status-icon" }, hAsync("calcite-icon", { class: {
+                [CSS$1b.statusIcon]: true,
+                [CSS$1b.valid]: status == "valid",
+                [CSS$1b.invalid]: status == "invalid",
+            }, icon: ICONS$h[status], scale: "s" }))) : hasSlottedIcon ? (hAsync("div", { class: CSS$1b.icon, key: "icon-slot" }, hAsync("slot", { key: "icon-slot", name: SLOTS$s.icon }))) : null;
     }
     renderTitle() {
         const { heading, headingLevel, description } = this;
-        return heading || description ? (hAsync("div", { class: CSS$1a.title }, hAsync(Heading, { class: CSS$1a.heading, level: headingLevel }, heading), description ? hAsync("div", { class: CSS$1a.description }, description) : null)) : null;
+        return heading || description ? (hAsync("div", { class: CSS$1b.title }, hAsync(Heading, { class: CSS$1b.heading, level: headingLevel }, heading), description ? hAsync("div", { class: CSS$1b.description }, description) : null)) : null;
     }
     render() {
         const { collapsible, el, loading, open, messages } = this;
         const toggleLabel = open ? messages.collapse : messages.expand;
-        const headerContent = (hAsync("header", { class: CSS$1a.header, id: IDS$1.header }, this.renderIcon(), this.renderTitle()));
+        const headerContent = (hAsync("header", { class: CSS$1b.header, id: IDS$1.header }, this.renderIcon(), this.renderTitle()));
         const hasControl = !!getSlotted(el, SLOTS$s.control);
         const hasMenuActions = !!getSlotted(el, SLOTS$s.headerMenuActions);
         const collapseIcon = open ? ICONS$h.opened : ICONS$h.closed;
-        const headerNode = (hAsync("div", { class: CSS$1a.headerContainer }, this.dragHandle ? hAsync("calcite-handle", null) : null, collapsible ? (hAsync("button", { "aria-controls": IDS$1.content, "aria-describedby": IDS$1.header, "aria-expanded": collapsible ? toAriaBoolean(open) : null, class: CSS$1a.toggle, id: IDS$1.toggle, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, hAsync("calcite-icon", { "aria-hidden": "true", class: CSS$1a.toggleIcon, icon: collapseIcon, scale: "s" }))) : (headerContent), hasControl ? (hAsync("div", { class: CSS$1a.controlContainer }, hAsync("slot", { name: SLOTS$s.control }))) : null, hasMenuActions ? (hAsync("calcite-action-menu", { label: messages.options }, hAsync("slot", { name: SLOTS$s.headerMenuActions }))) : null));
+        const headerNode = (hAsync("div", { class: CSS$1b.headerContainer }, this.dragHandle ? hAsync("calcite-handle", null) : null, collapsible ? (hAsync("button", { "aria-controls": IDS$1.content, "aria-describedby": IDS$1.header, "aria-expanded": collapsible ? toAriaBoolean(open) : null, class: CSS$1b.toggle, id: IDS$1.toggle, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, hAsync("calcite-icon", { "aria-hidden": "true", class: CSS$1b.toggleIcon, icon: collapseIcon, scale: "s" }))) : (headerContent), hasControl ? (hAsync("div", { class: CSS$1b.controlContainer }, hAsync("slot", { name: SLOTS$s.control }))) : null, hasMenuActions ? (hAsync("calcite-action-menu", { label: messages.options }, hAsync("slot", { name: SLOTS$s.headerMenuActions }))) : null));
         return (hAsync(Host, null, hAsync("article", { "aria-busy": toAriaBoolean(loading), class: {
-                [CSS$1a.container]: true,
-            } }, headerNode, hAsync("section", { "aria-labelledby": IDS$1.toggle, class: CSS$1a.content, hidden: !open, id: IDS$1.content,
+                [CSS$1b.container]: true,
+            } }, headerNode, hAsync("section", { "aria-labelledby": IDS$1.toggle, class: CSS$1b.content, hidden: !open, id: IDS$1.content,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setTransitionEl }, this.renderScrim()))));
     }
@@ -11460,7 +11461,7 @@ const IDS = {
     content: "content",
     toggle: "toggle",
 };
-const CSS$19 = {
+const CSS$1a = {
     content: "content",
     focusGuard: "focus-guard",
     invalid: "invalid",
@@ -11564,9 +11565,9 @@ class BlockSection {
         const { status } = this;
         const statusIcon = ICONS$g[status] ?? false;
         const statusIconClasses = {
-            [CSS$19.statusIcon]: true,
-            [CSS$19.valid]: status == "valid",
-            [CSS$19.invalid]: status == "invalid",
+            [CSS$1a.statusIcon]: true,
+            [CSS$1a.valid]: status == "valid",
+            [CSS$1a.invalid]: status == "invalid",
         };
         return !!statusIcon ? (hAsync("calcite-icon", { class: statusIconClasses, icon: statusIcon, scale: "s" })) : null;
     }
@@ -11580,15 +11581,15 @@ class BlockSection {
                 : ICONS$g.menuClosedRight;
         const toggleLabel = open ? messages.collapse : messages.expand;
         const headerNode = toggleDisplay === "switch" ? (hAsync("div", { class: {
-                [CSS$19.toggleSwitchContainer]: true,
+                [CSS$1a.toggleSwitchContainer]: true,
             } }, hAsync("div", { "aria-controls": IDS.content, "aria-expanded": toAriaBoolean(open), class: {
-                [CSS$19.toggle]: true,
-                [CSS$19.toggleSwitch]: true,
-            }, id: IDS.toggle, onClick: this.toggleSection, onKeyDown: this.handleHeaderKeyDown, role: "button", tabIndex: 0, title: toggleLabel }, hAsync("div", { class: CSS$19.toggleSwitchContent }, hAsync("span", { class: CSS$19.toggleSwitchText }, text)), this.renderStatusIcon()), hAsync("calcite-label", { class: CSS$19.focusGuard, layout: "inline", tabIndex: -1 }, hAsync("calcite-switch", { checked: open, label: toggleLabel, scale: "s" })))) : (hAsync("button", { "aria-controls": IDS.content, "aria-expanded": toAriaBoolean(open), class: {
-                [CSS$19.sectionHeader]: true,
-                [CSS$19.toggle]: true,
-            }, id: IDS.toggle, onClick: this.toggleSection }, hAsync("calcite-icon", { icon: arrowIcon, scale: "s" }), hAsync("span", { class: CSS$19.sectionHeaderText }, text), this.renderStatusIcon()));
-        return (hAsync(Host, null, headerNode, hAsync("section", { "aria-labelledby": IDS.toggle, class: CSS$19.content, hidden: !open, id: IDS.content }, hAsync("slot", null))));
+                [CSS$1a.toggle]: true,
+                [CSS$1a.toggleSwitch]: true,
+            }, id: IDS.toggle, onClick: this.toggleSection, onKeyDown: this.handleHeaderKeyDown, role: "button", tabIndex: 0, title: toggleLabel }, hAsync("div", { class: CSS$1a.toggleSwitchContent }, hAsync("span", { class: CSS$1a.toggleSwitchText }, text)), this.renderStatusIcon()), hAsync("calcite-label", { class: CSS$1a.focusGuard, layout: "inline", tabIndex: -1 }, hAsync("calcite-switch", { checked: open, label: toggleLabel, scale: "s" })))) : (hAsync("button", { "aria-controls": IDS.content, "aria-expanded": toAriaBoolean(open), class: {
+                [CSS$1a.sectionHeader]: true,
+                [CSS$1a.toggle]: true,
+            }, id: IDS.toggle, onClick: this.toggleSection }, hAsync("calcite-icon", { icon: arrowIcon, scale: "s" }), hAsync("span", { class: CSS$1a.sectionHeaderText }, text), this.renderStatusIcon()));
+        return (hAsync(Host, null, headerNode, hAsync("section", { "aria-labelledby": IDS.toggle, class: CSS$1a.content, hidden: !open, id: IDS.content }, hAsync("slot", null))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -12020,7 +12021,7 @@ async function associateExplicitLabelToUnlabeledComponent(label) {
     });
 }
 
-const CSS$18 = {
+const CSS$19 = {
     buttonLoader: "calcite-button--loader",
     content: "content",
     contentSlotted: "content--slotted",
@@ -12155,17 +12156,17 @@ class Button {
     render() {
         const childElType = this.href ? "a" : "button";
         const Tag = childElType;
-        const loaderNode = this.hasLoader ? (hAsync("div", { class: CSS$18.buttonLoader }, hAsync("calcite-loader", { class: this.loading ? CSS$18.loadingIn : CSS$18.loadingOut, inline: true, label: this.messages.loading, scale: this.scale === "l" ? "m" : "s" }))) : null;
+        const loaderNode = this.hasLoader ? (hAsync("div", { class: CSS$19.buttonLoader }, hAsync("calcite-loader", { class: this.loading ? CSS$19.loadingIn : CSS$19.loadingOut, inline: true, label: this.messages.loading, scale: this.scale === "l" ? "m" : "s" }))) : null;
         const noStartEndIcons = !this.iconStart && !this.iconEnd;
-        const iconStartEl = (hAsync("calcite-icon", { class: { [CSS$18.icon]: true, [CSS$18.iconStart]: true }, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
-        const iconEndEl = (hAsync("calcite-icon", { class: { [CSS$18.icon]: true, [CSS$18.iconEnd]: true }, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
-        const contentEl = (hAsync("span", { class: CSS$18.content, ref: (el) => (this.contentEl = el) }, hAsync("slot", null)));
+        const iconStartEl = (hAsync("calcite-icon", { class: { [CSS$19.icon]: true, [CSS$19.iconStart]: true }, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
+        const iconEndEl = (hAsync("calcite-icon", { class: { [CSS$19.icon]: true, [CSS$19.iconEnd]: true }, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
+        const contentEl = (hAsync("span", { class: CSS$19.content, ref: (el) => (this.contentEl = el) }, hAsync("slot", null)));
         return (hAsync(Tag, { "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: {
-                [CSS$18.buttonPadding]: noStartEndIcons,
-                [CSS$18.buttonPaddingShrunk]: !noStartEndIcons,
-                [CSS$18.contentSlotted]: this.hasContent,
-                [CSS$18.iconStartEmpty]: !this.iconStart,
-                [CSS$18.iconEndEmpty]: !this.iconEnd,
+                [CSS$19.buttonPadding]: noStartEndIcons,
+                [CSS$19.buttonPaddingShrunk]: !noStartEndIcons,
+                [CSS$19.contentSlotted]: this.hasContent,
+                [CSS$19.iconStartEmpty]: !this.iconStart,
+                [CSS$19.iconEndEmpty]: !this.iconEnd,
             }, disabled: childElType === "button" ? this.disabled || this.loading : null, href: childElType === "a" && this.href, name: childElType === "button" && this.name, onClick: this.handleClick, rel: childElType === "a" && this.rel, tabIndex: this.disabled ? -1 : null, target: childElType === "a" && this.target, title: this.tooltipText, type: childElType === "button" && this.type,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setChildEl }, loaderNode, this.iconStart ? iconStartEl : null, this.hasContent ? contentEl : null, this.iconEnd ? iconEndEl : null));
@@ -12428,7 +12429,7 @@ class CalciteMenu {
     }; }
 }
 
-const CSS$17 = {
+const CSS$18 = {
     container: "container",
     content: "content",
     dropdownVertical: "dropdown--vertical",
@@ -12474,59 +12475,58 @@ class CalciteMenuItem {
             this.hasSubmenu = this.submenuItems.length > 0;
         };
         this.keyDownHandler = async (event) => {
-            // opening and closing of submenu is handled here. Any other functionality is bubbled to parent menu.
-            if (event.key === " " || event.key === "Enter") {
-                this.selectMenuItem(event);
-                if (this.hasSubmenu &&
-                    (!this.href || (this.href && event.target === this.dropdownActionEl))) {
-                    this.open = !this.open;
+            const { hasSubmenu, href, layout, open, submenuItems } = this;
+            const key = event.key;
+            const targetIsDropdown = event.target === this.dropdownActionEl;
+            if (key === " " || key === "Enter") {
+                if (hasSubmenu && (!href || (href && targetIsDropdown))) {
+                    this.open = !open;
+                }
+                if (!(href && targetIsDropdown) && key !== "Enter") {
+                    this.selectMenuItem(event);
+                }
+                if (key === " " || (href && targetIsDropdown)) {
+                    event.preventDefault();
                 }
-                event.preventDefault();
             }
-            else if (event.key === "Escape") {
-                if (this.open) {
+            else if (key === "Escape") {
+                if (open) {
                     this.open = false;
                     return;
                 }
                 this.calciteInternalMenuItemKeyEvent.emit({ event });
                 event.preventDefault();
             }
-            else if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+            else if (key === "ArrowDown" || key === "ArrowUp") {
                 event.preventDefault();
-                if ((event.target === this.dropdownActionEl || !this.href) &&
-                    this.hasSubmenu &&
-                    !this.open &&
-                    this.layout === "horizontal") {
+                if ((targetIsDropdown || !href) && hasSubmenu && !open && layout === "horizontal") {
                     this.open = true;
                     return;
                 }
                 this.calciteInternalMenuItemKeyEvent.emit({
                     event,
-                    children: this.submenuItems,
-                    isSubmenuOpen: this.open && this.hasSubmenu,
+                    children: submenuItems,
+                    isSubmenuOpen: open && hasSubmenu,
                 });
             }
-            else if (event.key === "ArrowLeft") {
+            else if (key === "ArrowLeft") {
                 event.preventDefault();
                 this.calciteInternalMenuItemKeyEvent.emit({
                     event,
-                    children: this.submenuItems,
+                    children: submenuItems,
                     isSubmenuOpen: true,
                 });
             }
-            else if (event.key === "ArrowRight") {
+            else if (key === "ArrowRight") {
                 event.preventDefault();
-                if ((event.target === this.dropdownActionEl || !this.href) &&
-                    this.hasSubmenu &&
-                    !this.open &&
-                    this.layout === "vertical") {
+                if ((targetIsDropdown || !href) && hasSubmenu && !open && layout === "vertical") {
                     this.open = true;
                     return;
                 }
                 this.calciteInternalMenuItemKeyEvent.emit({
                     event,
-                    children: this.submenuItems,
-                    isSubmenuOpen: this.open && this.hasSubmenu,
+                    children: submenuItems,
+                    isSubmenuOpen: open && hasSubmenu,
                 });
             }
         };
@@ -12632,54 +12632,54 @@ class CalciteMenuItem {
     //
     //--------------------------------------------------------------------------
     renderIconStart() {
-        return (hAsync("calcite-icon", { class: `${CSS$17.icon} ${CSS$17.iconStart}`, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, key: CSS$17.iconStart, scale: "s" }));
+        return (hAsync("calcite-icon", { class: `${CSS$18.icon} ${CSS$18.iconStart}`, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, key: CSS$18.iconStart, scale: "s" }));
     }
     renderIconEnd() {
-        return (hAsync("calcite-icon", { class: `${CSS$17.icon} ${CSS$17.iconEnd}`, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, key: CSS$17.iconEnd, scale: "s" }));
+        return (hAsync("calcite-icon", { class: `${CSS$18.icon} ${CSS$18.iconEnd}`, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, key: CSS$18.iconEnd, scale: "s" }));
     }
     renderBreadcrumbIcon(dir) {
-        return (hAsync("calcite-icon", { class: `${CSS$17.icon} ${CSS$17.iconBreadcrumb}`, icon: dir === "rtl" ? "chevron-left" : "chevron-right", key: CSS$17.iconBreadcrumb, scale: "s" }));
+        return (hAsync("calcite-icon", { class: `${CSS$18.icon} ${CSS$18.iconBreadcrumb}`, icon: dir === "rtl" ? "chevron-left" : "chevron-right", key: CSS$18.iconBreadcrumb, scale: "s" }));
     }
     renderDropdownIcon(dir) {
         const dirChevron = dir === "rtl" ? "chevron-left" : "chevron-right";
-        return (hAsync("calcite-icon", { class: `${CSS$17.icon} ${CSS$17.iconDropdown}`, icon: this.topLevelMenuLayout === "vertical" || this.isTopLevelItem
+        return (hAsync("calcite-icon", { class: `${CSS$18.icon} ${CSS$18.iconDropdown}`, icon: this.topLevelMenuLayout === "vertical" || this.isTopLevelItem
                 ? this.open
                     ? "chevron-up"
                     : "chevron-down"
-                : dirChevron, key: CSS$17.iconDropdown, scale: "s" }));
+                : dirChevron, key: CSS$18.iconDropdown, scale: "s" }));
     }
     renderDropdownAction(dir) {
         const dirChevron = dir === "rtl" ? "chevron-left" : "chevron-right";
-        return (hAsync("calcite-action", { class: CSS$17.dropdownAction, icon: this.topLevelMenuLayout === "vertical" || this.isTopLevelItem
+        return (hAsync("calcite-action", { class: CSS$18.dropdownAction, icon: this.topLevelMenuLayout === "vertical" || this.isTopLevelItem
                 ? this.open
                     ? "chevron-up"
                     : "chevron-down"
-                : dirChevron, key: CSS$17.dropdownAction, onClick: this.clickHandler, onKeyDown: this.keyDownHandler, text: this.messages.open,
+                : dirChevron, key: CSS$18.dropdownAction, onClick: this.clickHandler, onKeyDown: this.keyDownHandler, text: this.messages.open,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: (el) => (this.dropdownActionEl = el) }));
     }
     renderSubmenuItems(dir) {
         return (hAsync("calcite-menu", { class: {
-                [CSS$17.dropdownMenuItems]: true,
-                [CSS$17.open]: this.open,
-                [CSS$17.nested]: !this.isTopLevelItem,
+                [CSS$18.dropdownMenuItems]: true,
+                [CSS$18.open]: this.open,
+                [CSS$18.nested]: !this.isTopLevelItem,
                 [CSS_UTILITY.rtl]: dir === "rtl",
-                [CSS$17.dropdownVertical]: this.topLevelMenuLayout === "vertical",
+                [CSS$18.dropdownVertical]: this.topLevelMenuLayout === "vertical",
             }, label: this.messages.submenu, layout: "vertical", role: "menu" }, hAsync("slot", { name: "submenu-item", onSlotchange: this.handleMenuItemSlotChange })));
     }
     renderHrefIcon(dir) {
-        return (hAsync("calcite-icon", { class: CSS$17.hoverHrefIcon, icon: dir === "rtl" ? "arrow-left" : "arrow-right", key: CSS$17.hoverHrefIcon, scale: "s" }));
+        return (hAsync("calcite-icon", { class: CSS$18.hoverHrefIcon, icon: dir === "rtl" ? "arrow-left" : "arrow-right", key: CSS$18.hoverHrefIcon, scale: "s" }));
     }
     renderItemContent(dir) {
         const hasHref = this.href && (this.topLevelMenuLayout === "vertical" || !this.isTopLevelItem);
-        return (hAsync(Fragment, null, this.iconStart && this.renderIconStart(), hAsync("div", { class: CSS$17.textContainer }, hAsync("span", null, this.text)), hasHref && this.renderHrefIcon(dir), this.iconEnd && this.renderIconEnd(), this.breadcrumb ? this.renderBreadcrumbIcon(dir) : null, !this.href && this.hasSubmenu ? this.renderDropdownIcon(dir) : null));
+        return (hAsync(Fragment, null, this.iconStart && this.renderIconStart(), hAsync("div", { class: CSS$18.textContainer }, hAsync("span", null, this.text)), hasHref && this.renderHrefIcon(dir), this.iconEnd && this.renderIconEnd(), this.breadcrumb ? this.renderBreadcrumbIcon(dir) : null, !this.href && this.hasSubmenu ? this.renderDropdownIcon(dir) : null));
     }
     render() {
         const dir = getElementDir(this.el);
         return (hAsync(Host, { onBlur: this.blurHandler, onFocus: this.focusHandler }, hAsync("li", { class: {
-                [CSS$17.container]: true,
-                [CSS$17.isParentVertical]: this.topLevelMenuLayout === "vertical",
-            }, role: "none" }, hAsync("div", { class: CSS$17.itemContent }, hAsync("a", { "aria-current": this.isFocused ? "page" : false, "aria-expanded": this.open, "aria-haspopup": this.hasSubmenu, "aria-label": this.label, class: { [CSS$17.layoutVertical]: this.layout === "vertical", [CSS$17.content]: true }, href: this.href, onClick: this.clickHandler, onKeyDown: this.keyDownHandler, rel: this.rel, role: "menuitem", tabIndex: this.isTopLevelItem ? 0 : -1, target: this.target,
+                [CSS$18.container]: true,
+                [CSS$18.isParentVertical]: this.topLevelMenuLayout === "vertical",
+            }, role: "none" }, hAsync("div", { class: CSS$18.itemContent }, hAsync("a", { "aria-current": this.isFocused ? "page" : false, "aria-expanded": this.open, "aria-haspopup": this.hasSubmenu, "aria-label": this.label, class: { [CSS$18.layoutVertical]: this.layout === "vertical", [CSS$18.content]: true }, href: this.href, onClick: this.clickHandler, onKeyDown: this.keyDownHandler, rel: this.rel, role: "menuitem", tabIndex: this.isTopLevelItem ? 0 : -1, target: this.target,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: (el) => (this.anchorEl = el) }, this.renderItemContent(dir)), this.href && this.hasSubmenu ? this.renderDropdownAction(dir) : null), this.renderSubmenuItems(dir))));
     }
@@ -12722,7 +12722,7 @@ class CalciteMenuItem {
     }; }
 }
 
-const CSS$16 = {
+const CSS$17 = {
     container: "container",
     containerContent: "container-content",
     hasProgress: "progress-bar",
@@ -12871,11 +12871,11 @@ class CalciteNavigation {
             this.navigationAction;
         const slotName = this.el.slot;
         return (hAsync(Host, null, hAsync("div", { class: {
-                [CSS$16.container]: true,
-                [CSS$16.secondary]: slotName === SLOTS$r.navSecondary,
-                [CSS$16.tertiary]: slotName === SLOTS$r.navTertiary,
-                [CSS$16.primary]: primaryLevelHasElements,
-            } }, hAsync("div", { class: { [CSS$16.hide]: !this.progressSlotHasElement, [SLOTS$r.progress]: true } }, hAsync("slot", { name: SLOTS$r.progress, onSlotchange: this.handleProgressSlotChange })), hAsync("div", { class: { [CSS$16.containerContent]: true, [CSS$16.hasProgress]: this.progressSlotHasElement } }, this.renderMenuAction(), hAsync("div", { class: { [CSS$16.hide]: !this.logoSlotHasElements, [SLOTS$r.logo]: true } }, hAsync("slot", { name: SLOTS$r.logo, onSlotchange: this.handleLogoSlotChange })), hAsync("slot", { name: SLOTS$r.contentStart, onSlotchange: this.handleContentStartSlotChange }), hAsync("slot", { name: SLOTS$r.contentCenter, onSlotchange: this.handleContentCenterSlotChange }), hAsync("slot", { name: SLOTS$r.contentEnd, onSlotchange: this.handleContentEndSlotChange }), hAsync("div", { class: { [CSS$16.hide]: !this.userSlotHasElements, [SLOTS$r.user]: true } }, hAsync("slot", { name: SLOTS$r.user, onSlotchange: this.handleUserSlotChange })))), hAsync(Fragment, null, hAsync("slot", { name: SLOTS$r.navSecondary, onSlotchange: this.handleSecondarySlotChange }), hAsync("slot", { name: SLOTS$r.navTertiary, onSlotchange: this.handleTertiarySlotChange }))));
+                [CSS$17.container]: true,
+                [CSS$17.secondary]: slotName === SLOTS$r.navSecondary,
+                [CSS$17.tertiary]: slotName === SLOTS$r.navTertiary,
+                [CSS$17.primary]: primaryLevelHasElements,
+            } }, hAsync("div", { class: { [CSS$17.hide]: !this.progressSlotHasElement, [SLOTS$r.progress]: true } }, hAsync("slot", { name: SLOTS$r.progress, onSlotchange: this.handleProgressSlotChange })), hAsync("div", { class: { [CSS$17.containerContent]: true, [CSS$17.hasProgress]: this.progressSlotHasElement } }, this.renderMenuAction(), hAsync("div", { class: { [CSS$17.hide]: !this.logoSlotHasElements, [SLOTS$r.logo]: true } }, hAsync("slot", { name: SLOTS$r.logo, onSlotchange: this.handleLogoSlotChange })), hAsync("slot", { name: SLOTS$r.contentStart, onSlotchange: this.handleContentStartSlotChange }), hAsync("slot", { name: SLOTS$r.contentCenter, onSlotchange: this.handleContentCenterSlotChange }), hAsync("slot", { name: SLOTS$r.contentEnd, onSlotchange: this.handleContentEndSlotChange }), hAsync("div", { class: { [CSS$17.hide]: !this.userSlotHasElements, [SLOTS$r.user]: true } }, hAsync("slot", { name: SLOTS$r.user, onSlotchange: this.handleUserSlotChange })))), hAsync(Fragment, null, hAsync("slot", { name: SLOTS$r.navSecondary, onSlotchange: this.handleSecondarySlotChange }), hAsync("slot", { name: SLOTS$r.navTertiary, onSlotchange: this.handleTertiarySlotChange }))));
     }
     get el() { return getElement(this); }
     static get style() { return navigationCss; }
@@ -12902,7 +12902,7 @@ class CalciteNavigation {
     }; }
 }
 
-const CSS$15 = {
+const CSS$16 = {
     container: "container",
     heading: "heading",
     description: "description",
@@ -12958,14 +12958,14 @@ class CalciteNavigationLogo {
     // --------------------------------------------------------------------------
     renderIcon() {
         /** Icon scale is not variable as the component does not have a scale property */
-        return hAsync("calcite-icon", { class: CSS$15.icon, flipRtl: this.iconFlipRtl, icon: this.icon, scale: "l" });
+        return hAsync("calcite-icon", { class: CSS$16.icon, flipRtl: this.iconFlipRtl, icon: this.icon, scale: "l" });
     }
     render() {
         const { heading, description, thumbnail } = this;
-        return (hAsync(Host, null, hAsync("a", { class: CSS$15.anchor, href: this.href, rel: this.rel, target: this.target }, thumbnail && hAsync("img", { alt: this.label || "", class: CSS$15.image, src: thumbnail }), this.icon && this.renderIcon(), (heading || description) && (hAsync("div", { class: CSS$15.container }, heading && (hAsync("span", { "aria-label": this.heading, class: {
-                [CSS$15.heading]: true,
-                [CSS$15.standalone]: !this.description,
-            }, key: CSS$15.heading }, heading)), description && (hAsync("span", { "aria-label": this.description, class: CSS$15.description, key: CSS$15.description }, description)))))));
+        return (hAsync(Host, null, hAsync("a", { class: CSS$16.anchor, href: this.href, rel: this.rel, target: this.target }, thumbnail && hAsync("img", { alt: this.label || "", class: CSS$16.image, src: thumbnail }), this.icon && this.renderIcon(), (heading || description) && (hAsync("div", { class: CSS$16.container }, heading && (hAsync("span", { "aria-label": this.heading, class: {
+                [CSS$16.heading]: true,
+                [CSS$16.standalone]: !this.description,
+            }, key: CSS$16.heading }, heading)), description && (hAsync("span", { "aria-label": this.description, class: CSS$16.description, key: CSS$16.description }, description)))))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
@@ -12992,7 +12992,7 @@ class CalciteNavigationLogo {
     }; }
 }
 
-const CSS$14 = {
+const CSS$15 = {
     textContainer: "text-container",
     fullName: "full-name",
     username: "username",
@@ -13039,7 +13039,7 @@ class CalciteNavigationUser {
     //
     // --------------------------------------------------------------------------
     render() {
-        return (hAsync(Host, null, hAsync("button", { "aria-label": this.label, class: CSS$14.button }, hAsync("calcite-avatar", { "full-name": this.fullName, label: this.label, thumbnail: this.thumbnail, "user-id": this.userId, username: this.username }), (this.fullName || this.username) && !this.textDisabled && (hAsync("div", { class: CSS$14.textContainer }, this.fullName && (hAsync("span", { class: CSS$14.fullName, key: CSS$14.fullName }, this.fullName)), this.username && (hAsync("span", { class: CSS$14.username, key: CSS$14.username }, this.username)))))));
+        return (hAsync(Host, null, hAsync("button", { "aria-label": this.label, class: CSS$15.button }, hAsync("calcite-avatar", { "full-name": this.fullName, label: this.label, thumbnail: this.thumbnail, "user-id": this.userId, username: this.username }), (this.fullName || this.username) && !this.textDisabled && (hAsync("div", { class: CSS$15.textContainer }, this.fullName && (hAsync("span", { class: CSS$15.fullName, key: CSS$15.fullName }, this.fullName)), this.username && (hAsync("span", { class: CSS$15.username, key: CSS$15.username }, this.username)))))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
@@ -13063,7 +13063,7 @@ class CalciteNavigationUser {
     }; }
 }
 
-const CSS$13 = {
+const CSS$14 = {
     container: "container",
     header: "header",
     footer: "footer",
@@ -13148,7 +13148,7 @@ class Card {
     render() {
         const thumbnailInline = this.thumbnailPosition.startsWith("inline");
         const thumbnailStart = this.thumbnailPosition.endsWith("start");
-        return (hAsync("div", { class: { "calcite-card-container": true, inline: thumbnailInline } }, this.loading ? (hAsync("div", { "aria-live": "polite", class: "calcite-card-loader-container" }, hAsync("calcite-loader", { label: this.messages.loading }))) : null, thumbnailStart && this.renderThumbnail(), hAsync("section", { "aria-busy": toAriaBoolean(this.loading), class: { [CSS$13.container]: true } }, this.selectable ? this.renderCheckbox() : null, this.renderHeader(), hAsync("div", { class: "card-content" }, hAsync("slot", null)), this.renderFooter()), !thumbnailStart && this.renderThumbnail()));
+        return (hAsync("div", { class: { "calcite-card-container": true, inline: thumbnailInline } }, this.loading ? (hAsync("div", { "aria-live": "polite", class: "calcite-card-loader-container" }, hAsync("calcite-loader", { label: this.messages.loading }))) : null, thumbnailStart && this.renderThumbnail(), hAsync("section", { "aria-busy": toAriaBoolean(this.loading), class: { [CSS$14.container]: true } }, this.selectable ? this.renderCheckbox() : null, this.renderHeader(), hAsync("div", { class: "card-content" }, hAsync("slot", null)), this.renderFooter()), !thumbnailStart && this.renderThumbnail()));
     }
     effectiveLocaleChange() {
         updateMessages(this);
@@ -13158,24 +13158,24 @@ class Card {
         this.calciteCardSelect.emit();
     }
     renderThumbnail() {
-        return getSlotted(this.el, SLOTS$q.thumbnail) ? (hAsync("section", { class: CSS$13.thumbnailWrapper }, hAsync("slot", { name: SLOTS$q.thumbnail }))) : null;
+        return getSlotted(this.el, SLOTS$q.thumbnail) ? (hAsync("section", { class: CSS$14.thumbnailWrapper }, hAsync("slot", { name: SLOTS$q.thumbnail }))) : null;
     }
     renderCheckbox() {
-        return (hAsync("calcite-label", { class: CSS$13.checkboxWrapper, onClick: this.cardSelectClick, onKeyDown: this.cardSelectKeyDown }, hAsync("calcite-checkbox", { checked: this.selected, label: this.messages.select })));
+        return (hAsync("calcite-label", { class: CSS$14.checkboxWrapper, onClick: this.cardSelectClick, onKeyDown: this.cardSelectKeyDown }, hAsync("calcite-checkbox", { checked: this.selected, label: this.messages.select })));
     }
     renderHeader() {
         const { el } = this;
         const title = getSlotted(el, SLOTS$q.title);
         const subtitle = getSlotted(el, SLOTS$q.subtitle);
         const hasHeader = title || subtitle;
-        return hasHeader ? (hAsync("header", { class: CSS$13.header }, hAsync("slot", { name: SLOTS$q.title }), hAsync("slot", { name: SLOTS$q.subtitle }))) : null;
+        return hasHeader ? (hAsync("header", { class: CSS$14.header }, hAsync("slot", { name: SLOTS$q.title }), hAsync("slot", { name: SLOTS$q.subtitle }))) : null;
     }
     renderFooter() {
         const { el } = this;
         const startFooter = getSlotted(el, SLOTS$q.footerStart);
         const endFooter = getSlotted(el, SLOTS$q.footerEnd);
         const hasFooter = startFooter || endFooter;
-        return hasFooter ? (hAsync("footer", { class: CSS$13.footer }, hAsync("slot", { name: SLOTS$q.footerStart }), hAsync("slot", { name: SLOTS$q.footerEnd }))) : null;
+        return hasFooter ? (hAsync("footer", { class: CSS$14.footer }, hAsync("slot", { name: SLOTS$q.footerStart }), hAsync("slot", { name: SLOTS$q.footerEnd }))) : null;
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -13340,7 +13340,7 @@ class Checkbox {
     }; }
 }
 
-const CSS$12 = {
+const CSS$13 = {
     title: "title",
     close: "close",
     imageContainer: "image-container",
@@ -13509,7 +13509,7 @@ class Chip {
     //
     //--------------------------------------------------------------------------
     renderChipImage() {
-        return (hAsync("div", { class: CSS$12.imageContainer }, hAsync("slot", { name: SLOTS$p.image, onSlotchange: this.handleSlotImageChange })));
+        return (hAsync("div", { class: CSS$13.imageContainer }, hAsync("slot", { name: SLOTS$p.image, onSlotchange: this.handleSlotImageChange })));
     }
     renderSelectionIcon() {
         const icon = this.selectionMode === "multiple" && this.selected
@@ -13520,17 +13520,17 @@ class Chip {
                     ? ICONS$e.checkedSingle
                     : undefined;
         return (hAsync("div", { class: {
-                [CSS$12.selectIcon]: true,
-                [CSS$12.selectIconActive]: this.selectionMode === "multiple" || this.selected,
+                [CSS$13.selectIcon]: true,
+                [CSS$13.selectIconActive]: this.selectionMode === "multiple" || this.selected,
             } }, hAsync("calcite-icon", { icon: icon, scale: getIconScale(this.scale) })));
     }
     renderCloseButton() {
-        return (hAsync("button", { "aria-label": this.messages.dismissLabel, class: CSS$12.close, onClick: this.close, onKeyDown: this.closeButtonKeyDownHandler, tabIndex: this.disabled ? -1 : 0,
+        return (hAsync("button", { "aria-label": this.messages.dismissLabel, class: CSS$13.close, onClick: this.close, onKeyDown: this.closeButtonKeyDownHandler, tabIndex: this.disabled ? -1 : 0,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: (el) => (this.closeButtonEl = el) }, hAsync("calcite-icon", { icon: ICONS$e.close, scale: getIconScale(this.scale) })));
     }
     renderIcon() {
-        return (hAsync("calcite-icon", { class: CSS$12.chipIcon, flipRtl: this.iconFlipRtl, icon: this.icon, scale: getIconScale(this.scale) }));
+        return (hAsync("calcite-icon", { class: CSS$13.chipIcon, flipRtl: this.iconFlipRtl, icon: this.icon, scale: getIconScale(this.scale) }));
     }
     render() {
         const disableInteraction = this.disabled || (!this.disabled && !this.interactive);
@@ -13544,21 +13544,21 @@ class Chip {
         return (hAsync(Host, null, hAsync("div", { "aria-checked": this.selectionMode !== "none" && this.interactive
                 ? toAriaBoolean(this.selected)
                 : undefined, "aria-disabled": disableInteraction ? toAriaBoolean(this.disabled) : undefined, "aria-label": this.label, class: {
-                [CSS$12.container]: true,
-                [CSS$12.textSlotted]: this.hasText,
-                [CSS$12.imageSlotted]: this.hasImage,
-                [CSS$12.selectable]: this.selectionMode !== "none",
-                [CSS$12.multiple]: this.selectionMode === "multiple",
-                [CSS$12.closable]: this.closable,
-                [CSS$12.nonInteractive]: !this.interactive,
-                [CSS$12.isCircle]: !this.closable &&
+                [CSS$13.container]: true,
+                [CSS$13.textSlotted]: this.hasText,
+                [CSS$13.imageSlotted]: this.hasImage,
+                [CSS$13.selectable]: this.selectionMode !== "none",
+                [CSS$13.multiple]: this.selectionMode === "multiple",
+                [CSS$13.closable]: this.closable,
+                [CSS$13.nonInteractive]: !this.interactive,
+                [CSS$13.isCircle]: !this.closable &&
                     !this.hasText &&
                     (!this.icon || !this.hasImage) &&
                     (this.selectionMode === "none" ||
                         (!!this.selectionMode && this.selectionMode !== "multiple" && !this.selected)),
             }, onClick: this.handleEmittingEvent, role: role, tabIndex: disableInteraction ? -1 : 0,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: (el) => (this.containerEl = el) }, this.selectionMode !== "none" && this.renderSelectionIcon(), this.renderChipImage(), this.icon && this.renderIcon(), hAsync("span", { class: CSS$12.title }, hAsync("slot", null)), this.closable && this.renderCloseButton())));
+            ref: (el) => (this.containerEl = el) }, this.selectionMode !== "none" && this.renderSelectionIcon(), this.renderChipImage(), this.icon && this.renderIcon(), hAsync("span", { class: CSS$13.title }, hAsync("slot", null)), this.closable && this.renderCloseButton())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -15880,7 +15880,7 @@ function zeroArray(array, length) {
 
 var color = Color;
 
-const CSS$11 = {
+const CSS$12 = {
     channel: "channel",
     channels: "channels",
     colorField: "color-field",
@@ -16229,7 +16229,7 @@ class ColorPicker {
             const { channelMode: activeChannelMode, messages } = this;
             const selected = channelMode === activeChannelMode;
             const label = channelMode === "rgb" ? messages.rgb : messages.hsv;
-            return (hAsync("calcite-tab-title", { class: CSS$11.colorMode, "data-color-mode": channelMode, key: channelMode, onCalciteTabsActivate: this.handleTabActivate, selected: selected }, label));
+            return (hAsync("calcite-tab-title", { class: CSS$12.colorMode, "data-color-mode": channelMode, key: channelMode, onCalciteTabsActivate: this.handleTabActivate, selected: selected }, label));
         };
         this.renderChannelsTab = (channelMode) => {
             const { allowEmpty, channelMode: activeChannelMode, channels, messages, alphaChannel } = this;
@@ -16240,7 +16240,7 @@ class ColorPicker {
                 : [messages.hue, messages.saturation, messages.value];
             const direction = getElementDir(this.el);
             const channelsToRender = alphaChannel ? channels : channels.slice(0, 3);
-            return (hAsync("calcite-tab", { class: CSS$11.control, key: channelMode, selected: selected }, hAsync("div", { class: CSS$11.channels, dir: "ltr" }, channelsToRender.map((channelValue, index) => {
+            return (hAsync("calcite-tab", { class: CSS$12.control, key: channelMode, selected: selected }, hAsync("div", { class: CSS$12.channels, dir: "ltr" }, channelsToRender.map((channelValue, index) => {
                 const isAlphaChannel = index === 3;
                 if (isAlphaChannel) {
                     channelValue =
@@ -16251,7 +16251,7 @@ class ColorPicker {
             }))));
         };
         this.renderChannel = (value, index, ariaLabel, direction, suffix) => {
-            return (hAsync("calcite-input-number", { class: CSS$11.channel, "data-channel-index": index, dir: direction, key: index, label: ariaLabel, lang: this.effectiveLocale, numberButtonType: "none", numberingSystem: this.numberingSystem, onCalciteInputNumberChange: this.handleChannelChange, onCalciteInputNumberInput: this.handleChannelInput, onKeyDown: this.handleKeyDown, scale: this.scale === "l" ? "m" : "s",
+            return (hAsync("calcite-input-number", { class: CSS$12.channel, "data-channel-index": index, dir: direction, key: index, label: ariaLabel, lang: this.effectiveLocale, numberButtonType: "none", numberingSystem: this.numberingSystem, onCalciteInputNumberChange: this.handleChannelChange, onCalciteInputNumberInput: this.handleChannelInput, onKeyDown: this.handleKeyDown, scale: this.scale === "l" ? "m" : "s",
                 // workaround to ensure input borders overlap as desired
                 // this is because the build transforms margin-left to its
                 // logical-prop, which is undesired as channels are always ltr
@@ -16441,7 +16441,7 @@ class ColorPicker {
         this.shiftKeyChannelAdjustment = 0;
         const { key } = event;
         if ((key !== "ArrowUp" && key !== "ArrowDown") ||
-            !event.composedPath().some((node) => node.classList?.contains(CSS$11.channel))) {
+            !event.composedPath().some((node) => node.classList?.contains(CSS$12.channel))) {
             return;
         }
         const { shiftKey } = event;
@@ -16533,35 +16533,35 @@ class ColorPicker {
         const [adjustedColorFieldScopeLeft, adjustedColorFieldScopeTop] = this.getAdjustedScopePosition(colorFieldScopeLeft, colorFieldScopeTop);
         const [adjustedHueScopeLeft, adjustedHueScopeTop] = this.getAdjustedScopePosition(hueLeft, hueTop);
         const [adjustedOpacityScopeLeft, adjustedOpacityScopeTop] = this.getAdjustedScopePosition(opacityLeft, opacityTop);
-        return (hAsync("div", { class: CSS$11.container }, hAsync("div", { class: CSS$11.controlAndScope }, hAsync("canvas", { class: CSS$11.colorField, onPointerDown: this.handleColorFieldPointerDown,
+        return (hAsync("div", { class: CSS$12.container }, hAsync("div", { class: CSS$12.controlAndScope }, hAsync("canvas", { class: CSS$12.colorField, onPointerDown: this.handleColorFieldPointerDown,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.initColorField }), hAsync("div", { "aria-label": vertical ? messages.value : messages.saturation, "aria-valuemax": vertical ? HSV_LIMITS.v : HSV_LIMITS.s, "aria-valuemin": "0", "aria-valuenow": (vertical ? color?.saturationv() : color?.value()) || "0", class: { [CSS$11.scope]: true, [CSS$11.colorFieldScope]: true }, onKeyDown: this.handleColorFieldScopeKeyDown, role: "slider", style: {
+            ref: this.initColorField }), hAsync("div", { "aria-label": vertical ? messages.value : messages.saturation, "aria-valuemax": vertical ? HSV_LIMITS.v : HSV_LIMITS.s, "aria-valuemin": "0", "aria-valuenow": (vertical ? color?.saturationv() : color?.value()) || "0", class: { [CSS$12.scope]: true, [CSS$12.colorFieldScope]: true }, onKeyDown: this.handleColorFieldScopeKeyDown, role: "slider", style: {
                 top: `${adjustedColorFieldScopeTop || 0}px`,
                 left: `${adjustedColorFieldScopeLeft || 0}px`,
             }, tabindex: "0",
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.storeColorFieldScope })), hAsync("div", { class: CSS$11.previewAndSliders }, hAsync("calcite-color-picker-swatch", { class: CSS$11.preview, color: selectedColorInHex, scale: "l" }), hAsync("div", { class: CSS$11.sliders }, hAsync("div", { class: CSS$11.controlAndScope }, hAsync("canvas", { class: { [CSS$11.slider]: true, [CSS$11.hueSlider]: true }, onPointerDown: this.handleHueSliderPointerDown,
+            ref: this.storeColorFieldScope })), hAsync("div", { class: CSS$12.previewAndSliders }, hAsync("calcite-color-picker-swatch", { class: CSS$12.preview, color: selectedColorInHex, scale: "l" }), hAsync("div", { class: CSS$12.sliders }, hAsync("div", { class: CSS$12.controlAndScope }, hAsync("canvas", { class: { [CSS$12.slider]: true, [CSS$12.hueSlider]: true }, onPointerDown: this.handleHueSliderPointerDown,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.initHueSlider }), hAsync("div", { "aria-label": messages.hue, "aria-valuemax": HSV_LIMITS.h, "aria-valuemin": "0", "aria-valuenow": color?.round().hue() || DEFAULT_COLOR$1.round().hue(), class: { [CSS$11.scope]: true, [CSS$11.hueScope]: true }, onKeyDown: this.handleHueScopeKeyDown, role: "slider", style: {
+            ref: this.initHueSlider }), hAsync("div", { "aria-label": messages.hue, "aria-valuemax": HSV_LIMITS.h, "aria-valuemin": "0", "aria-valuenow": color?.round().hue() || DEFAULT_COLOR$1.round().hue(), class: { [CSS$12.scope]: true, [CSS$12.hueScope]: true }, onKeyDown: this.handleHueScopeKeyDown, role: "slider", style: {
                 top: `${adjustedHueScopeTop}px`,
                 left: `${adjustedHueScopeLeft}px`,
             }, tabindex: "0",
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.storeHueScope })), alphaChannel ? (hAsync("div", { class: CSS$11.controlAndScope }, hAsync("canvas", { class: { [CSS$11.slider]: true, [CSS$11.opacitySlider]: true }, onPointerDown: this.handleOpacitySliderPointerDown,
+            ref: this.storeHueScope })), alphaChannel ? (hAsync("div", { class: CSS$12.controlAndScope }, hAsync("canvas", { class: { [CSS$12.slider]: true, [CSS$12.opacitySlider]: true }, onPointerDown: this.handleOpacitySliderPointerDown,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.initOpacitySlider }), hAsync("div", { "aria-label": messages.opacity, "aria-valuemax": OPACITY_LIMITS.max, "aria-valuemin": OPACITY_LIMITS.min, "aria-valuenow": (color || DEFAULT_COLOR$1).round().alpha(), class: { [CSS$11.scope]: true, [CSS$11.opacityScope]: true }, onKeyDown: this.handleOpacityScopeKeyDown, role: "slider", style: {
+            ref: this.initOpacitySlider }), hAsync("div", { "aria-label": messages.opacity, "aria-valuemax": OPACITY_LIMITS.max, "aria-valuemin": OPACITY_LIMITS.min, "aria-valuenow": (color || DEFAULT_COLOR$1).round().alpha(), class: { [CSS$12.scope]: true, [CSS$12.opacityScope]: true }, onKeyDown: this.handleOpacityScopeKeyDown, role: "slider", style: {
                 top: `${adjustedOpacityScopeTop}px`,
                 left: `${adjustedOpacityScopeLeft}px`,
             }, tabindex: "0",
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.storeOpacityScope }))) : null)), noHex && noChannels ? null : (hAsync("div", { class: {
-                [CSS$11.controlSection]: true,
-                [CSS$11.section]: true,
-            } }, hAsync("div", { class: CSS$11.hexAndChannelsGroup }, noHex ? null : (hAsync("div", { class: CSS$11.hexOptions }, hAsync("calcite-color-picker-hex-input", { allowEmpty: allowEmpty, alphaChannel: alphaChannel, class: CSS$11.control, messages: messages, numberingSystem: this.numberingSystem, onCalciteColorPickerHexInputChange: this.handleHexInputChange, scale: scale, value: selectedColorInHex }))), noChannels ? null : (hAsync("calcite-tabs", { class: {
-                [CSS$11.colorModeContainer]: true,
-                [CSS$11.splitSection]: true,
-            }, scale: scale === "l" ? "m" : "s" }, hAsync("calcite-tab-nav", { slot: "title-group" }, this.renderChannelsTabTitle("rgb"), this.renderChannelsTabTitle("hsv")), this.renderChannelsTab("rgb"), this.renderChannelsTab("hsv")))))), noSaved ? null : (hAsync("div", { class: { [CSS$11.savedColorsSection]: true, [CSS$11.section]: true } }, hAsync("div", { class: CSS$11.header }, hAsync("label", null, messages.saved), hAsync("div", { class: CSS$11.savedColorsButtons }, hAsync("calcite-button", { appearance: "transparent", class: CSS$11.deleteColor, disabled: noColor, iconStart: "minus", kind: "neutral", label: messages.deleteColor, onClick: this.deleteColor, scale: scale, type: "button" }), hAsync("calcite-button", { appearance: "transparent", class: CSS$11.saveColor, disabled: noColor, iconStart: "plus", kind: "neutral", label: messages.saveColor, onClick: this.saveColor, scale: scale, type: "button" }))), savedColors.length > 0 ? (hAsync("div", { class: CSS$11.savedColors }, [
-            ...savedColors.map((color) => (hAsync("calcite-color-picker-swatch", { class: CSS$11.savedColor, color: color, key: color, onClick: this.handleSavedColorSelect, onKeyDown: this.handleSavedColorKeyDown, scale: scale, tabIndex: 0 }))),
+                [CSS$12.controlSection]: true,
+                [CSS$12.section]: true,
+            } }, hAsync("div", { class: CSS$12.hexAndChannelsGroup }, noHex ? null : (hAsync("div", { class: CSS$12.hexOptions }, hAsync("calcite-color-picker-hex-input", { allowEmpty: allowEmpty, alphaChannel: alphaChannel, class: CSS$12.control, messages: messages, numberingSystem: this.numberingSystem, onCalciteColorPickerHexInputChange: this.handleHexInputChange, scale: scale, value: selectedColorInHex }))), noChannels ? null : (hAsync("calcite-tabs", { class: {
+                [CSS$12.colorModeContainer]: true,
+                [CSS$12.splitSection]: true,
+            }, scale: scale === "l" ? "m" : "s" }, hAsync("calcite-tab-nav", { slot: "title-group" }, this.renderChannelsTabTitle("rgb"), this.renderChannelsTabTitle("hsv")), this.renderChannelsTab("rgb"), this.renderChannelsTab("hsv")))))), noSaved ? null : (hAsync("div", { class: { [CSS$12.savedColorsSection]: true, [CSS$12.section]: true } }, hAsync("div", { class: CSS$12.header }, hAsync("label", null, messages.saved), hAsync("div", { class: CSS$12.savedColorsButtons }, hAsync("calcite-button", { appearance: "transparent", class: CSS$12.deleteColor, disabled: noColor, iconStart: "minus", kind: "neutral", label: messages.deleteColor, onClick: this.deleteColor, scale: scale, type: "button" }), hAsync("calcite-button", { appearance: "transparent", class: CSS$12.saveColor, disabled: noColor, iconStart: "plus", kind: "neutral", label: messages.saveColor, onClick: this.saveColor, scale: scale, type: "button" }))), savedColors.length > 0 ? (hAsync("div", { class: CSS$12.savedColors }, [
+            ...savedColors.map((color) => (hAsync("calcite-color-picker-swatch", { class: CSS$12.savedColor, color: color, key: color, onClick: this.handleSavedColorSelect, onKeyDown: this.handleSavedColorKeyDown, scale: scale, tabIndex: 0 }))),
         ])) : null))));
     }
     // --------------------------------------------------------------------------
@@ -16932,7 +16932,7 @@ class ColorPicker {
     }; }
 }
 
-const CSS$10 = {
+const CSS$11 = {
     container: "container",
     hexInput: "hex-input",
     opacityInput: "opacity-input",
@@ -17100,9 +17100,9 @@ class ColorPickerHexInput {
         const hexInputValue = this.formatHexForInternalInput(value);
         const opacityInputValue = this.formatOpacityForInternalInput(internalColor);
         const inputScale = scale === "l" ? "m" : "s";
-        return (hAsync("div", { class: CSS$10.container }, hAsync("calcite-input-text", { class: CSS$10.hexInput, label: messages?.hex || hexLabel, maxLength: 6, onCalciteInputTextChange: this.onHexInputChange, onCalciteInternalInputTextBlur: this.onHexInputBlur, onKeyDown: this.onInputKeyDown, onPaste: this.onHexInputPaste, prefixText: "#", scale: inputScale, value: hexInputValue,
+        return (hAsync("div", { class: CSS$11.container }, hAsync("calcite-input-text", { class: CSS$11.hexInput, label: messages?.hex || hexLabel, maxLength: 6, onCalciteInputTextChange: this.onHexInputChange, onCalciteInternalInputTextBlur: this.onHexInputBlur, onKeyDown: this.onInputKeyDown, onPaste: this.onHexInputPaste, prefixText: "#", scale: inputScale, value: hexInputValue,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.storeHexInputRef }), alphaChannel ? (hAsync("calcite-input-number", { class: CSS$10.opacityInput, key: "opacity-input", label: messages?.opacity, max: OPACITY_LIMITS.max, maxLength: 3, min: OPACITY_LIMITS.min, numberButtonType: "none", numberingSystem: this.numberingSystem, onCalciteInputNumberChange: this.onOpacityInputChange, onCalciteInternalInputNumberBlur: this.onOpacityInputBlur, onKeyDown: this.onInputKeyDown, scale: inputScale, suffixText: "%", value: opacityInputValue,
+            ref: this.storeHexInputRef }), alphaChannel ? (hAsync("calcite-input-number", { class: CSS$11.opacityInput, key: "opacity-input", label: messages?.opacity, max: OPACITY_LIMITS.max, maxLength: 3, min: OPACITY_LIMITS.min, numberButtonType: "none", numberingSystem: this.numberingSystem, onCalciteInputNumberChange: this.onOpacityInputChange, onCalciteInternalInputNumberBlur: this.onOpacityInputBlur, onKeyDown: this.onInputKeyDown, scale: inputScale, suffixText: "%", value: opacityInputValue,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.storeOpacityInputRef })) : null));
     }
@@ -17198,7 +17198,7 @@ class ColorPickerHexInput {
     }; }
 }
 
-const CSS$$ = {
+const CSS$10 = {
     swatch: "swatch",
     noColorSwatch: "swatch--no-color",
     checker: "checker",
@@ -17236,8 +17236,8 @@ class ColorPickerSwatch {
     render() {
         const isEmpty = !this.internalColor;
         const classes = {
-            [CSS$$.swatch]: true,
-            [CSS$$.noColorSwatch]: isEmpty,
+            [CSS$10.swatch]: true,
+            [CSS$10.noColorSwatch]: isEmpty,
         };
         return (hAsync("svg", { class: classes, xmlns: "http://www.w3.org/2000/svg" }, this.renderSwatch()));
     }
@@ -17263,7 +17263,7 @@ class ColorPickerSwatch {
         const alpha = internalColor.alpha();
         const hex = hexify(internalColor);
         const hexa = hexify(internalColor, alpha < 1);
-        return (hAsync(Fragment, null, hAsync("title", null, hexa), hAsync("defs", null, hAsync("pattern", { height: CHECKER_DIMENSIONS.size, id: "checker", patternUnits: "userSpaceOnUse", width: CHECKER_DIMENSIONS.size, x: "0", y: "0" }, hAsync("rect", { class: CSS$$.checker, height: CHECKER_DIMENSIONS.squareSize, width: CHECKER_DIMENSIONS.squareSize, x: "0", y: "0" }), hAsync("rect", { class: CSS$$.checker, height: CHECKER_DIMENSIONS.squareSize, width: CHECKER_DIMENSIONS.squareSize, x: CHECKER_DIMENSIONS.squareSize, y: CHECKER_DIMENSIONS.squareSize }))), hAsync("rect", { fill: "url(#checker)", height: "100%", rx: borderRadius, width: "100%" }), hAsync("rect", { fill: hex, style: {
+        return (hAsync(Fragment, null, hAsync("title", null, hexa), hAsync("defs", null, hAsync("pattern", { height: CHECKER_DIMENSIONS.size, id: "checker", patternUnits: "userSpaceOnUse", width: CHECKER_DIMENSIONS.size, x: "0", y: "0" }, hAsync("rect", { class: CSS$10.checker, height: CHECKER_DIMENSIONS.squareSize, width: CHECKER_DIMENSIONS.squareSize, x: "0", y: "0" }), hAsync("rect", { class: CSS$10.checker, height: CHECKER_DIMENSIONS.squareSize, width: CHECKER_DIMENSIONS.squareSize, x: CHECKER_DIMENSIONS.squareSize, y: CHECKER_DIMENSIONS.squareSize }))), hAsync("rect", { fill: "url(#checker)", height: "100%", rx: borderRadius, width: "100%" }), hAsync("rect", { fill: hex, style: {
                 "clip-path": alpha < 1 ? "polygon(100% 0, 0 0, 0 100%)" : `inset(0 round ${borderRadius})`,
             }, ...commonSwatchProps }), alpha < 1 ? (hAsync("rect", { fill: hexa, key: "opacity-fill", style: { "clip-path": "polygon(100% 0, 100% 100%, 0 100%)" }, ...commonSwatchProps })) : null));
     }
@@ -19023,7 +19023,7 @@ const defaultOffsetDistance = Math.ceil(Math.hypot(visiblePointerSize, visiblePo
 const ComboboxItem$1 = "CALCITE-COMBOBOX-ITEM";
 const ComboboxItemGroup$1 = "CALCITE-COMBOBOX-ITEM-GROUP";
 const ComboboxChildSelector = `${ComboboxItem$1}, ${ComboboxItemGroup$1}`;
-const CSS$_ = {
+const CSS$$ = {
     chipInvisible: "chip--invisible",
     selectionDisplayFit: "selection-display-fit",
     selectionDisplaySingle: "selection-display-single",
@@ -19054,11 +19054,11 @@ function isSingleLike(selectionMode) {
     return selectionMode.includes("single");
 }
 
-const CSS$Z = {
+const CSS$_ = {
     button: "x-button",
 };
 function XButton({ disabled, key, label, onClick, ref, scale, }) {
-    return (hAsync("button", { "aria-label": label, class: CSS$Z.button, disabled: disabled, key: key, onClick: onClick, tabIndex: -1, type: "button", 
+    return (hAsync("button", { "aria-label": label, class: CSS$_.button, disabled: disabled, key: key, onClick: onClick, tabIndex: -1, type: "button", 
         // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
         ref: ref },
         hAsync("calcite-icon", { icon: "x", scale: getIconScale(scale) })));
@@ -19066,11 +19066,17 @@ function XButton({ disabled, key, label, onClick, ref, scale, }) {
 
 /**
  * Do not edit directly
- * Generated on Fri, 15 Dec 2023 03:25:09 GMT
+ * Generated on Tue, 19 Dec 2023 17:47:32 GMT
  */
 const calciteSize48 = "48px";
 
-const comboboxCss = "/*!@:host([disabled])*/[disabled].sc-calcite-combobox-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-combobox-h *.sc-calcite-combobox,.sc-calcite-combobox-h[disabled].sc-calcite-combobox-s>*,.sc-calcite-combobox-h[disabled] .sc-calcite-combobox-s>*{pointer-events:none}/*!@:host*/.sc-calcite-combobox-h{position:relative;display:block}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-combobox-h[disabled] .sc-calcite-combobox-s>[calcite-hydrated][disabled],[disabled].sc-calcite-combobox-h [calcite-hydrated][disabled].sc-calcite-combobox{opacity:1}/*!@:host([scale=s]) .x-button*/[scale=s].sc-calcite-combobox-h .x-button.sc-calcite-combobox{inline-size:1rem;block-size:1rem}/*!@:host([scale=m]) .x-button*/[scale=m].sc-calcite-combobox-h .x-button.sc-calcite-combobox{inline-size:1.5rem;block-size:1.5rem}/*!@:host([scale=l]) .x-button*/[scale=l].sc-calcite-combobox-h .x-button.sc-calcite-combobox{inline-size:2rem;block-size:2rem}/*!@.x-button*/.x-button.sc-calcite-combobox{margin:0px;display:flex;cursor:pointer;appearance:none;align-content:center;align-items:center;justify-content:center;align-self:center;border-width:2px;background-color:transparent;color:var(--calcite-color-text-3);outline-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-radius:50%;border-color:transparent;background-color:var(--calcite-color-foreground-2)}/*!@.x-button:active, .x-button:hover*/.x-button.sc-calcite-combobox:active,.x-button.sc-calcite-combobox:hover{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-3)}/*!@.x-button:active*/.x-button.sc-calcite-combobox:active{border-style:solid;border-color:var(--calcite-color-brand)}/*!@.x-button calcite-icon*/.x-button.sc-calcite-combobox calcite-icon.sc-calcite-combobox{color:inherit}/*!@:host([scale=s])*/[scale=s].sc-calcite-combobox-h{font-size:var(--calcite-font-size--2);--calcite-combobox-item-spacing-unit-l:0.5rem;--calcite-combobox-item-spacing-unit-s:0.25rem;--calcite-combobox-input-height:1rem;--calcite-internal-combobox-input-margin-block:calc(0.25rem - 1px)}/*!@:host([scale=s]) .x-button*/[scale=s].sc-calcite-combobox-h .x-button.sc-calcite-combobox{margin-inline:0.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-combobox-h{font-size:var(--calcite-font-size--1);--calcite-combobox-item-spacing-unit-l:0.75rem;--calcite-combobox-item-spacing-unit-s:0.5rem;--calcite-combobox-input-height:1rem;--calcite-internal-combobox-input-margin-block:calc(0.5rem - 1px)}/*!@:host([scale=m]) .x-button*/[scale=m].sc-calcite-combobox-h .x-button.sc-calcite-combobox{margin-inline-end:0.75rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-combobox-h{font-size:var(--calcite-font-size-0);--calcite-combobox-item-spacing-unit-l:1rem;--calcite-combobox-item-spacing-unit-s:0.75rem;--calcite-combobox-input-height:1.5rem;--calcite-internal-combobox-input-margin-block:calc(0.625rem - 1px)}/*!@:host([scale=l]) .x-button*/[scale=l].sc-calcite-combobox-h .x-button.sc-calcite-combobox{margin-inline-end:1rem}/*!@.wrapper*/.wrapper.sc-calcite-combobox{display:flex;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-1);outline-color:transparent;padding-block:calc(var(--calcite-combobox-item-spacing-unit-s) / 4);padding-inline:var(--calcite-combobox-item-spacing-unit-l)}/*!@:host(:focus-within) .wrapper,\n.wrapper--active*/.sc-calcite-combobox-h:focus-within .wrapper.sc-calcite-combobox,.wrapper--active.sc-calcite-combobox{outline:2px solid 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          )}/*!@:host([status=invalid]) .wrapper*/[status=invalid].sc-calcite-combobox-h .wrapper.sc-calcite-combobox{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]:focus-within) .wrapper*/[status=invalid].sc-calcite-combobox-h:focus-within .wrapper.sc-calcite-combobox{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@.wrapper--single*/.wrapper--single.sc-calcite-combobox{padding-block:0;padding-inline:var(--calcite-combobox-item-spacing-unit-l);cursor:pointer;flex-wrap:nowrap}/*!@.grid-input*/.grid-input.sc-calcite-combobox{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0px;gap:var(--calcite-combobox-item-spacing-unit-s)}/*!@.grid-input.selection-display-fit, .grid-input.selection-display-single*/.grid-input.selection-display-fit.sc-calcite-combobox,.grid-input.selection-display-single.sc-calcite-combobox{flex-wrap:nowrap;overflow:hidden}/*!@.input*/.input.sc-calcite-combobox{flex-grow:1;appearance:none;text-overflow:ellipsis;border-style:none;background-color:transparent;padding:0px;font-family:inherit;color:var(--calcite-color-text-1);font-size:inherit;block-size:var(--calcite-combobox-input-height);line-height:var(--calcite-combobox-input-height);inline-size:100%;margin-block-end:var(--calcite-combobox-item-spacing-unit-s);min-inline-size:4.8125rem}/*!@.input:focus*/.input.sc-calcite-combobox:focus{outline:2px solid transparent;outline-offset:2px}/*!@.input:placeholder-shown*/.input.sc-calcite-combobox:placeholder-shown{text-overflow:ellipsis}/*!@.input--transparent*/.input--transparent.sc-calcite-combobox{opacity:0}/*!@.input--single*/.input--single.sc-calcite-combobox{padding:0px;margin-block:var(--calcite-internal-combobox-input-margin-block)}/*!@.wrapper--active .input-single*/.wrapper--active.sc-calcite-combobox .input-single.sc-calcite-combobox{cursor:text}/*!@.input--hidden*/.input--hidden.sc-calcite-combobox{pointer-events:none;inline-size:0px;min-inline-size:0px;opacity:0}/*!@.input--icon*/.input--icon.sc-calcite-combobox{padding-block:0;padding-inline:var(--calcite-combobox-item-spacing-unit-s)}/*!@:host([scale=m]) .input--icon,\n:host([scale=l]) .input--icon*/[scale=m].sc-calcite-combobox-h .input--icon.sc-calcite-combobox,[scale=l].sc-calcite-combobox-h .input--icon.sc-calcite-combobox{padding-inline:0.25rem}/*!@.input-wrap*/.input-wrap.sc-calcite-combobox{display:flex;flex-grow:1;align-items:center}/*!@.input-wrap--single*/.input-wrap--single.sc-calcite-combobox{flex:1 1 0%;overflow:hidden}/*!@.label*/.label.sc-calcite-combobox{pointer-events:none;display:flex;max-inline-size:100%;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0px;font-weight:var(--calcite-font-weight-normal);block-size:var(--calcite-combobox-input-height);line-height:var(--calcite-combobox-input-height)}/*!@.label--icon*/.label--icon.sc-calcite-combobox{padding-inline:var(--calcite-combobox-item-spacing-unit-l)}/*!@.icon-end,\n.icon-start*/.icon-end.sc-calcite-combobox,.icon-start.sc-calcite-combobox{display:flex;cursor:pointer;align-items:center}/*!@.icon-end*/.icon-end.sc-calcite-combobox{flex:none}/*!@.floating-ui-container*/.floating-ui-container.sc-calcite-combobox{--calcite-floating-ui-z-index:var(--calcite-z-index-dropdown);display:block;position:absolute;z-index:var(--calcite-floating-ui-z-index);visibility:hidden}/*!@.floating-ui-container .calcite-floating-ui-anim*/.floating-ui-container.sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-z-index);border-radius:0.25rem}/*!@.floating-ui-container[data-placement^=bottom] .calcite-floating-ui-anim*/.floating-ui-container[data-placement^=bottom].sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{transform:translateY(-5px)}/*!@.floating-ui-container[data-placement^=top] .calcite-floating-ui-anim*/.floating-ui-container[data-placement^=top].sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{transform:translateY(5px)}/*!@.floating-ui-container[data-placement^=left] .calcite-floating-ui-anim*/.floating-ui-container[data-placement^=left].sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{transform:translateX(5px)}/*!@.floating-ui-container[data-placement^=right] .calcite-floating-ui-anim*/.floating-ui-container[data-placement^=right].sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{transform:translateX(-5px)}/*!@.floating-ui-container[data-placement] .calcite-floating-ui-anim--active*/.floating-ui-container[data-placement].sc-calcite-combobox .calcite-floating-ui-anim--active.sc-calcite-combobox{opacity:1;transform:translate(0)}/*!@.floating-ui-container--active*/.floating-ui-container--active.sc-calcite-combobox{visibility:visible}@media (forced-colors: active){/*!@.wrapper,\n  .floating-ui-container--active*/.wrapper.sc-calcite-combobox,.floating-ui-container--active.sc-calcite-combobox{border:1px solid canvasText}}/*!@.screen-readers-only*/.screen-readers-only.sc-calcite-combobox{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@.list-container*/.list-container.sc-calcite-combobox{max-block-size:45vh;overflow-y:auto;background-color:var(--calcite-color-foreground-1);inline-size:var(--calcite-dropdown-width)}/*!@.list*/.list.sc-calcite-combobox{margin:0px;display:block;padding:0px}/*!@.list--hide*/.list--hide.sc-calcite-combobox{block-size:0px;overflow:hidden}/*!@calcite-chip*/calcite-chip.sc-calcite-combobox{--calcite-animation-timing:0}/*!@.chip*/.chip.sc-calcite-combobox{margin-block:calc(var(--calcite-combobox-item-spacing-unit-s) / 4);max-inline-size:100%}/*!@.chip--active*/.chip--active.sc-calcite-combobox{background-color:var(--calcite-color-foreground-3)}/*!@.chip--invisible*/.chip--invisible.sc-calcite-combobox{visibility:hidden;position:absolute}/*!@.item*/.item.sc-calcite-combobox{display:block}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-combobox-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-combobox-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-combobox{display:none}/*!@::slotted(calcite-combobox-item-group:not(:first-child))*/.sc-calcite-combobox-s>calcite-combobox-item-group:not(:first-child){padding-block-start:var(--calcite-combobox-item-spacing-unit-l)}";
+const CSS$Z = {
+    validationContainer: "validation-container",
+};
+const Validation = ({ scale, status, icon, message, }) => (hAsync("div", { class: CSS$Z.validationContainer },
+    hAsync("calcite-input-message", { icon: icon, scale: scale, status: status }, message)));
+
+const comboboxCss = "/*!@:host([disabled])*/[disabled].sc-calcite-combobox-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-combobox-h *.sc-calcite-combobox,.sc-calcite-combobox-h[disabled].sc-calcite-combobox-s>*,.sc-calcite-combobox-h[disabled] .sc-calcite-combobox-s>*{pointer-events:none}/*!@:host*/.sc-calcite-combobox-h{position:relative;display:block}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-combobox-h[disabled] .sc-calcite-combobox-s>[calcite-hydrated][disabled],[disabled].sc-calcite-combobox-h [calcite-hydrated][disabled].sc-calcite-combobox{opacity:1}/*!@:host([scale=s]) .x-button*/[scale=s].sc-calcite-combobox-h .x-button.sc-calcite-combobox{inline-size:1rem;block-size:1rem}/*!@:host([scale=m]) .x-button*/[scale=m].sc-calcite-combobox-h .x-button.sc-calcite-combobox{inline-size:1.5rem;block-size:1.5rem}/*!@:host([scale=l]) .x-button*/[scale=l].sc-calcite-combobox-h .x-button.sc-calcite-combobox{inline-size:2rem;block-size:2rem}/*!@.x-button*/.x-button.sc-calcite-combobox{margin:0px;display:flex;cursor:pointer;appearance:none;align-content:center;align-items:center;justify-content:center;align-self:center;border-width:2px;background-color:transparent;color:var(--calcite-color-text-3);outline-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-radius:50%;border-color:transparent;background-color:var(--calcite-color-foreground-2)}/*!@.x-button:active, .x-button:hover*/.x-button.sc-calcite-combobox:active,.x-button.sc-calcite-combobox:hover{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-3)}/*!@.x-button:active*/.x-button.sc-calcite-combobox:active{border-style:solid;border-color:var(--calcite-color-brand)}/*!@.x-button calcite-icon*/.x-button.sc-calcite-combobox calcite-icon.sc-calcite-combobox{color:inherit}/*!@:host([scale=s])*/[scale=s].sc-calcite-combobox-h{font-size:var(--calcite-font-size--2);--calcite-combobox-item-spacing-unit-l:0.5rem;--calcite-combobox-item-spacing-unit-s:0.25rem;--calcite-combobox-input-height:1rem;--calcite-internal-combobox-input-margin-block:calc(0.25rem - 1px)}/*!@:host([scale=s]) .x-button*/[scale=s].sc-calcite-combobox-h .x-button.sc-calcite-combobox{margin-inline:0.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-combobox-h{font-size:var(--calcite-font-size--1);--calcite-combobox-item-spacing-unit-l:0.75rem;--calcite-combobox-item-spacing-unit-s:0.5rem;--calcite-combobox-input-height:1rem;--calcite-internal-combobox-input-margin-block:calc(0.5rem - 1px)}/*!@:host([scale=m]) .x-button*/[scale=m].sc-calcite-combobox-h .x-button.sc-calcite-combobox{margin-inline-end:0.75rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-combobox-h{font-size:var(--calcite-font-size-0);--calcite-combobox-item-spacing-unit-l:1rem;--calcite-combobox-item-spacing-unit-s:0.75rem;--calcite-combobox-input-height:1.5rem;--calcite-internal-combobox-input-margin-block:calc(0.625rem - 1px)}/*!@:host([scale=l]) .x-button*/[scale=l].sc-calcite-combobox-h .x-button.sc-calcite-combobox{margin-inline-end:1rem}/*!@.wrapper*/.wrapper.sc-calcite-combobox{display:flex;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-1);outline-color:transparent;padding-block:calc(var(--calcite-combobox-item-spacing-unit-s) / 4);padding-inline:var(--calcite-combobox-item-spacing-unit-l)}/*!@:host(:focus-within) .wrapper,\n.wrapper--active*/.sc-calcite-combobox-h:focus-within .wrapper.sc-calcite-combobox,.wrapper--active.sc-calcite-combobox{outline:2px solid 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          )}/*!@:host([status=invalid]) .wrapper*/[status=invalid].sc-calcite-combobox-h .wrapper.sc-calcite-combobox{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]:focus-within) .wrapper*/[status=invalid].sc-calcite-combobox-h:focus-within .wrapper.sc-calcite-combobox{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@.wrapper--single*/.wrapper--single.sc-calcite-combobox{padding-block:0;padding-inline:var(--calcite-combobox-item-spacing-unit-l);cursor:pointer;flex-wrap:nowrap}/*!@.grid-input*/.grid-input.sc-calcite-combobox{position:relative;display:flex;flex-grow:1;flex-wrap:wrap;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0px;gap:var(--calcite-combobox-item-spacing-unit-s)}/*!@.grid-input.selection-display-fit, .grid-input.selection-display-single*/.grid-input.selection-display-fit.sc-calcite-combobox,.grid-input.selection-display-single.sc-calcite-combobox{flex-wrap:nowrap;overflow:hidden}/*!@.input*/.input.sc-calcite-combobox{flex-grow:1;appearance:none;text-overflow:ellipsis;border-style:none;background-color:transparent;padding:0px;font-family:inherit;color:var(--calcite-color-text-1);font-size:inherit;block-size:var(--calcite-combobox-input-height);line-height:var(--calcite-combobox-input-height);inline-size:100%;margin-block-end:var(--calcite-combobox-item-spacing-unit-s);min-inline-size:4.8125rem}/*!@.input:focus*/.input.sc-calcite-combobox:focus{outline:2px solid transparent;outline-offset:2px}/*!@.input:placeholder-shown*/.input.sc-calcite-combobox:placeholder-shown{text-overflow:ellipsis}/*!@.input--transparent*/.input--transparent.sc-calcite-combobox{opacity:0}/*!@.input--single*/.input--single.sc-calcite-combobox{padding:0px;margin-block:var(--calcite-internal-combobox-input-margin-block)}/*!@.wrapper--active .input-single*/.wrapper--active.sc-calcite-combobox .input-single.sc-calcite-combobox{cursor:text}/*!@.input--hidden*/.input--hidden.sc-calcite-combobox{pointer-events:none;inline-size:0px;min-inline-size:0px;opacity:0}/*!@.input--icon*/.input--icon.sc-calcite-combobox{padding-block:0;padding-inline:var(--calcite-combobox-item-spacing-unit-s)}/*!@:host([scale=m]) .input--icon,\n:host([scale=l]) .input--icon*/[scale=m].sc-calcite-combobox-h .input--icon.sc-calcite-combobox,[scale=l].sc-calcite-combobox-h .input--icon.sc-calcite-combobox{padding-inline:0.25rem}/*!@.input-wrap*/.input-wrap.sc-calcite-combobox{display:flex;flex-grow:1;align-items:center}/*!@.input-wrap--single*/.input-wrap--single.sc-calcite-combobox{flex:1 1 0%;overflow:hidden}/*!@.label*/.label.sc-calcite-combobox{pointer-events:none;display:flex;max-inline-size:100%;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0px;font-weight:var(--calcite-font-weight-normal);block-size:var(--calcite-combobox-input-height);line-height:var(--calcite-combobox-input-height)}/*!@.label--icon*/.label--icon.sc-calcite-combobox{padding-inline:var(--calcite-combobox-item-spacing-unit-l)}/*!@.icon-end,\n.icon-start*/.icon-end.sc-calcite-combobox,.icon-start.sc-calcite-combobox{display:flex;cursor:pointer;align-items:center}/*!@.icon-end*/.icon-end.sc-calcite-combobox{flex:none}/*!@.floating-ui-container*/.floating-ui-container.sc-calcite-combobox{--calcite-floating-ui-z-index:var(--calcite-z-index-dropdown);display:block;position:absolute;z-index:var(--calcite-floating-ui-z-index);visibility:hidden}/*!@.floating-ui-container .calcite-floating-ui-anim*/.floating-ui-container.sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-z-index);border-radius:0.25rem}/*!@.floating-ui-container[data-placement^=bottom] .calcite-floating-ui-anim*/.floating-ui-container[data-placement^=bottom].sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{transform:translateY(-5px)}/*!@.floating-ui-container[data-placement^=top] .calcite-floating-ui-anim*/.floating-ui-container[data-placement^=top].sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{transform:translateY(5px)}/*!@.floating-ui-container[data-placement^=left] .calcite-floating-ui-anim*/.floating-ui-container[data-placement^=left].sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{transform:translateX(5px)}/*!@.floating-ui-container[data-placement^=right] .calcite-floating-ui-anim*/.floating-ui-container[data-placement^=right].sc-calcite-combobox .calcite-floating-ui-anim.sc-calcite-combobox{transform:translateX(-5px)}/*!@.floating-ui-container[data-placement] .calcite-floating-ui-anim--active*/.floating-ui-container[data-placement].sc-calcite-combobox .calcite-floating-ui-anim--active.sc-calcite-combobox{opacity:1;transform:translate(0)}/*!@.floating-ui-container--active*/.floating-ui-container--active.sc-calcite-combobox{visibility:visible}@media (forced-colors: active){/*!@.wrapper,\n  .floating-ui-container--active*/.wrapper.sc-calcite-combobox,.floating-ui-container--active.sc-calcite-combobox{border:1px solid canvasText}}/*!@.screen-readers-only*/.screen-readers-only.sc-calcite-combobox{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@.list-container*/.list-container.sc-calcite-combobox{max-block-size:45vh;overflow-y:auto;background-color:var(--calcite-color-foreground-1);inline-size:var(--calcite-dropdown-width)}/*!@.list*/.list.sc-calcite-combobox{margin:0px;display:block;padding:0px}/*!@.list--hide*/.list--hide.sc-calcite-combobox{block-size:0px;overflow:hidden}/*!@calcite-chip*/calcite-chip.sc-calcite-combobox{--calcite-animation-timing:0}/*!@.chip*/.chip.sc-calcite-combobox{margin-block:calc(var(--calcite-combobox-item-spacing-unit-s) / 4);max-inline-size:100%}/*!@.chip--active*/.chip--active.sc-calcite-combobox{background-color:var(--calcite-color-foreground-3)}/*!@.chip--invisible*/.chip--invisible.sc-calcite-combobox{visibility:hidden;position:absolute}/*!@.item*/.item.sc-calcite-combobox{display:block}/*!@.validation-container*/.validation-container.sc-calcite-combobox{padding-block-start:0.5rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-combobox-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-combobox-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-combobox{display:none}/*!@::slotted(calcite-combobox-item-group:not(:first-child))*/.sc-calcite-combobox-s>calcite-combobox-item-group:not(:first-child){padding-block-start:var(--calcite-combobox-item-spacing-unit-l)}";
 
 const isGroup = (el) => el.tagName === ComboboxItemGroup$1;
 const itemUidPrefix = "combobox-item-";
@@ -19267,7 +19273,7 @@ class Combobox {
                 event.preventDefault();
                 return;
             }
-            if (composedPath.some((node) => node.classList?.contains(CSS$Z.button))) {
+            if (composedPath.some((node) => node.classList?.contains(CSS$_.button))) {
                 this.clearValue();
                 event.preventDefault();
                 return;
@@ -19436,6 +19442,8 @@ class Combobox {
         this.placeholderIcon = undefined;
         this.placeholderIconFlipRtl = false;
         this.maxItems = 0;
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.allowCustomValues = undefined;
         this.overlayPositioning = "absolute";
@@ -19680,10 +19688,10 @@ class Combobox {
         this.updateActiveItemIndex(targetIndex);
     }
     hideChip(chipEl) {
-        chipEl.classList.add(CSS$_.chipInvisible);
+        chipEl.classList.add(CSS$$.chipInvisible);
     }
     showChip(chipEl) {
-        chipEl.classList.remove(CSS$_.chipInvisible);
+        chipEl.classList.remove(CSS$$.chipInvisible);
     }
     refreshChipDisplay({ chipEls, availableHorizontalChipElSpace, chipContainerElGap, }) {
         chipEls.forEach((chipEl) => {
@@ -19711,7 +19719,7 @@ class Combobox {
     setVisibleAndHiddenChips(chipEls) {
         let newSelectedVisibleChipsCount = 0;
         chipEls.forEach((chipEl) => {
-            if (chipEl.selected && !chipEl.classList.contains(CSS$_.chipInvisible)) {
+            if (chipEl.selected && !chipEl.classList.contains(CSS$$.chipInvisible)) {
                 newSelectedVisibleChipsCount++;
             }
         });
@@ -19948,7 +19956,7 @@ class Combobox {
         const label = this.messages.allSelected;
         return (hAsync("calcite-chip", { class: {
                 chip: true,
-                [CSS$_.chipInvisible]: !(this.isAllSelected() &&
+                [CSS$$.chipInvisible]: !(this.isAllSelected() &&
                     !selectedVisibleChipsCount &&
                     !compactSelectionDisplay),
             }, scale: scale, title: label, value: "",
@@ -19960,7 +19968,7 @@ class Combobox {
         const label = this.messages.all || "All";
         return (hAsync("calcite-chip", { class: {
                 chip: true,
-                [CSS$_.chipInvisible]: !(this.isAllSelected() &&
+                [CSS$$.chipInvisible]: !(this.isAllSelected() &&
                     !selectedVisibleChipsCount &&
                     compactSelectionDisplay),
             }, scale: scale, title: label, value: "" }, label));
@@ -19997,7 +20005,7 @@ class Combobox {
         }
         return (hAsync("calcite-chip", { class: {
                 chip: true,
-                [CSS$_.chipInvisible]: chipInvisible,
+                [CSS$$.chipInvisible]: chipInvisible,
             }, scale: scale, title: label, value: "",
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: setSelectedIndicatorChipEl }, label));
@@ -20025,7 +20033,7 @@ class Combobox {
         }
         return (hAsync("calcite-chip", { class: {
                 chip: true,
-                [CSS$_.chipInvisible]: chipInvisible,
+                [CSS$$.chipInvisible]: chipInvisible,
             }, scale: scale, title: label, value: "" }, label));
     }
     renderInput() {
@@ -20055,7 +20063,7 @@ class Combobox {
     renderFloatingUIContainer() {
         const { setFloatingEl, setContainerEl, open } = this;
         const classes = {
-            [CSS$_.listContainer]: true,
+            [CSS$$.listContainer]: true,
             [FloatingCSS.animation]: true,
             [FloatingCSS.animationActive]: open,
         };
@@ -20097,15 +20105,15 @@ class Combobox {
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setReferenceEl }, hAsync("div", { class: {
                 "grid-input": true,
-                [CSS$_.selectionDisplayFit]: fitSelectionDisplay,
-                [CSS$_.selectionDisplaySingle]: singleSelectionDisplay,
+                [CSS$$.selectionDisplayFit]: fitSelectionDisplay,
+                [CSS$$.selectionDisplaySingle]: singleSelectionDisplay,
             }, ref: this.setChipContainerEl }, this.renderIconStart(), !singleSelectionMode && !singleSelectionDisplay && this.renderChips(), !singleSelectionMode &&
             !allSelectionDisplay && [
             this.renderSelectedIndicatorChip(),
             this.renderSelectedIndicatorChipCompact(),
             this.renderAllSelectedIndicatorChip(),
             this.renderAllSelectedIndicatorChipCompact(),
-        ], hAsync("label", { class: "screen-readers-only", htmlFor: `${inputUidPrefix}${guid}`, id: `${labelUidPrefix}${guid}` }, label), this.renderInput()), isClearable ? (hAsync(XButton, { disabled: this.disabled, key: "close-button", label: this.messages.clear, scale: this.scale })) : null, this.renderIconEnd()), hAsync("ul", { "aria-labelledby": `${labelUidPrefix}${guid}`, "aria-multiselectable": "true", class: "screen-readers-only", id: `${listboxUidPrefix}${guid}`, role: "listbox", tabIndex: -1 }, this.renderListBoxOptions()), this.renderFloatingUIContainer(), hAsync(HiddenFormInputSlot, { component: this })));
+        ], hAsync("label", { class: "screen-readers-only", htmlFor: `${inputUidPrefix}${guid}`, id: `${labelUidPrefix}${guid}` }, label), this.renderInput()), isClearable ? (hAsync(XButton, { disabled: this.disabled, key: "close-button", label: this.messages.clear, scale: this.scale })) : null, this.renderIconEnd()), hAsync("ul", { "aria-labelledby": `${labelUidPrefix}${guid}`, "aria-multiselectable": "true", class: "screen-readers-only", id: `${listboxUidPrefix}${guid}`, role: "listbox", tabIndex: -1 }, this.renderListBoxOptions()), this.renderFloatingUIContainer(), hAsync(HiddenFormInputSlot, { component: this }), this.validationMessage ? (hAsync(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -20138,6 +20146,8 @@ class Combobox {
             "placeholderIcon": [513, "placeholder-icon"],
             "placeholderIconFlipRtl": [516, "placeholder-icon-flip-rtl"],
             "maxItems": [514, "max-items"],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [513],
             "allowCustomValues": [516, "allow-custom-values"],
             "overlayPositioning": [513, "overlay-positioning"],
@@ -20674,7 +20684,7 @@ class DatePicker {
                 end,
             };
             if (!this.proximitySelectionDisabled) {
-                if (end) {
+                if (start && end) {
                     const startDiff = getDaysDiff(date, start);
                     const endDiff = getDaysDiff(date, end);
                     if (endDiff > 0) {
@@ -23867,7 +23877,7 @@ const SLOTS$l = {
     action: "action",
 };
 
-const inputCss = "/*!@:host([disabled])*/[disabled].sc-calcite-input-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-h *.sc-calcite-input,.sc-calcite-input-h[disabled].sc-calcite-input-s>*,.sc-calcite-input-h[disabled] .sc-calcite-input-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-h{display:block}/*!@:host([scale=s]) input, :host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-h input.sc-calcite-input,[scale=s].sc-calcite-input-h .prefix.sc-calcite-input,[scale=s].sc-calcite-input-h .suffix.sc-calcite-input{block-size:1.5rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) textarea*/[scale=s].sc-calcite-input-h textarea.sc-calcite-input{block-size:1.5rem;min-block-size:1.5rem}/*!@:host([scale=s]) .number-button-wrapper, :host([scale=s]) .action-wrapper calcite-button, :host([scale=s]) .action-wrapper calcite-button button*/[scale=s].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=s].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=s].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{block-size:1.5rem}/*!@:host([scale=s]) input[type=file]*/[scale=s].sc-calcite-input-h input[type=file].sc-calcite-input{block-size:1.5rem}/*!@:host([scale=s]) .clear-button*/[scale=s].sc-calcite-input-h .clear-button.sc-calcite-input{min-block-size:1.5rem;min-inline-size:1.5rem}/*!@:host([scale=s]) textarea*/[scale=s].sc-calcite-input-h textarea.sc-calcite-input{block-size:auto;padding-block:0.25rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m]) input, :host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-h input.sc-calcite-input,[scale=m].sc-calcite-input-h .prefix.sc-calcite-input,[scale=m].sc-calcite-input-h .suffix.sc-calcite-input{block-size:2rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) textarea*/[scale=m].sc-calcite-input-h textarea.sc-calcite-input{min-block-size:2rem}/*!@:host([scale=m]) .number-button-wrapper, :host([scale=m]) .action-wrapper calcite-button, :host([scale=m]) .action-wrapper calcite-button button*/[scale=m].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=m].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=m].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{block-size:2rem}/*!@:host([scale=m]) input[type=file]*/[scale=m].sc-calcite-input-h input[type=file].sc-calcite-input{block-size:2rem}/*!@:host([scale=m]) .clear-button*/[scale=m].sc-calcite-input-h .clear-button.sc-calcite-input{min-block-size:2rem;min-inline-size:2rem}/*!@:host([scale=m]) textarea*/[scale=m].sc-calcite-input-h textarea.sc-calcite-input{block-size:auto;padding-block:0.5rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l]) input, :host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-h input.sc-calcite-input,[scale=l].sc-calcite-input-h .prefix.sc-calcite-input,[scale=l].sc-calcite-input-h .suffix.sc-calcite-input{block-size:2.75rem;padding-inline:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) textarea*/[scale=l].sc-calcite-input-h textarea.sc-calcite-input{min-block-size:2.75rem}/*!@:host([scale=l]) .number-button-wrapper, :host([scale=l]) .action-wrapper calcite-button, :host([scale=l]) .action-wrapper calcite-button button*/[scale=l].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=l].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=l].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{block-size:2.75rem}/*!@:host([scale=l]) input[type=file]*/[scale=l].sc-calcite-input-h input[type=file].sc-calcite-input{block-size:2.75rem}/*!@:host([scale=l]) .clear-button*/[scale=l].sc-calcite-input-h .clear-button.sc-calcite-input{min-block-size:2.75rem;min-inline-size:2.75rem}/*!@:host([scale=l]) textarea*/[scale=l].sc-calcite-input-h textarea.sc-calcite-input{block-size:auto;padding-block:0.75rem;padding-inline:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([disabled]) textarea*/[disabled].sc-calcite-input-h textarea.sc-calcite-input{resize:none}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-h[disabled] .sc-calcite-input-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-h [calcite-hydrated][disabled].sc-calcite-input{opacity:1}/*!@textarea,\ninput*/textarea.sc-calcite-input,input.sc-calcite-input{transition:var(--calcite-animation-timing), block-size 0, outline-offset 0s;-webkit-appearance:none;position:relative;margin:0px;box-sizing:border-box;display:flex;max-block-size:100%;inline-size:100%;max-inline-size:100%;flex:1 1 0%;border-radius:0px;background-color:var(--calcite-color-foreground-1);font-family:inherit;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-1)}/*!@input[type=search]::-webkit-search-decoration*/input[type=search].sc-calcite-input::-webkit-search-decoration{-webkit-appearance:none}/*!@input,\ntextarea*/input.sc-calcite-input,textarea.sc-calcite-input{text-overflow:ellipsis;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);color:var(--calcite-color-text-1)}/*!@input:placeholder-shown,\ntextarea:placeholder-shown*/input.sc-calcite-input:placeholder-shown,textarea.sc-calcite-input:placeholder-shown{text-overflow:ellipsis}/*!@input:focus,\ntextarea:focus*/input.sc-calcite-input:focus,textarea.sc-calcite-input:focus{border-color:var(--calcite-color-brand);color:var(--calcite-color-text-1)}/*!@input[readonly],\ntextarea[readonly]*/input[readonly].sc-calcite-input,textarea[readonly].sc-calcite-input{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}/*!@input[readonly]:focus,\ntextarea[readonly]:focus*/input[readonly].sc-calcite-input:focus,textarea[readonly].sc-calcite-input:focus{color:var(--calcite-color-text-1)}/*!@calcite-icon*/calcite-icon.sc-calcite-input{color:var(--calcite-color-text-3)}/*!@textarea,\ninput*/textarea.sc-calcite-input,input.sc-calcite-input{outline-color:transparent}/*!@textarea:focus,\ninput:focus*/textarea.sc-calcite-input:focus,input.sc-calcite-input:focus{outline:2px solid 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          )}/*!@:host([status=invalid]) input, :host([status=invalid]) textarea*/[status=invalid].sc-calcite-input-h input.sc-calcite-input,[status=invalid].sc-calcite-input-h textarea.sc-calcite-input{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) input:focus, :host([status=invalid]) textarea:focus*/[status=invalid].sc-calcite-input-h input.sc-calcite-input:focus,[status=invalid].sc-calcite-input-h textarea.sc-calcite-input:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@:host([scale=s]) .icon*/[scale=s].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:0.5rem}/*!@:host([scale=m]) .icon*/[scale=m].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:0.75rem}/*!@:host([scale=l]) .icon*/[scale=l].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:1rem}/*!@:host([icon][scale=s]) input*/[icon][scale=s].sc-calcite-input-h input.sc-calcite-input{padding-inline-start:2rem}/*!@:host([icon][scale=m]) input*/[icon][scale=m].sc-calcite-input-h input.sc-calcite-input{padding-inline-start:2.5rem}/*!@:host([icon][scale=l]) input*/[icon][scale=l].sc-calcite-input-h input.sc-calcite-input{padding-inline-start:3.5rem}/*!@.element-wrapper*/.element-wrapper.sc-calcite-input{position:relative;order:3;display:inline-flex;flex:1 1 0%;align-items:center}/*!@.icon*/.icon.sc-calcite-input{pointer-events:none;position:absolute;display:block;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.icon,\n.resize-icon-wrapper*/.icon.sc-calcite-input,.resize-icon-wrapper.sc-calcite-input{z-index:var(--calcite-z-index)}/*!@input[type=text]::-ms-clear,\ninput[type=text]::-ms-reveal*/input[type=text].sc-calcite-input::-ms-clear,input[type=text].sc-calcite-input::-ms-reveal{display:none;block-size:0px;inline-size:0px}/*!@input[type=search]::-webkit-search-decoration,\ninput[type=search]::-webkit-search-cancel-button,\ninput[type=search]::-webkit-search-results-button,\ninput[type=search]::-webkit-search-results-decoration,\ninput[type=date]::-webkit-clear-button,\ninput[type=time]::-webkit-clear-button*/input[type=search].sc-calcite-input::-webkit-search-decoration,input[type=search].sc-calcite-input::-webkit-search-cancel-button,input[type=search].sc-calcite-input::-webkit-search-results-button,input[type=search].sc-calcite-input::-webkit-search-results-decoration,input[type=date].sc-calcite-input::-webkit-clear-button,input[type=time].sc-calcite-input::-webkit-clear-button{display:none}/*!@.clear-button*/.clear-button.sc-calcite-input{pointer-events:initial;order:4;margin:0px;box-sizing:border-box;display:flex;min-block-size:100%;cursor:pointer;align-items:center;justify-content:center;align-self:stretch;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);outline-color:transparent;border-inline-start-width:0px}/*!@.clear-button:hover*/.clear-button.sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:hover calcite-icon*/.clear-button.sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:active*/.clear-button.sc-calcite-input:active{background-color:var(--calcite-color-foreground-3)}/*!@.clear-button:active calcite-icon*/.clear-button.sc-calcite-input:active calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@.clear-button:focus*/.clear-button.sc-calcite-input:focus{outline:2px solid 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          )}/*!@.clear-button:disabled*/.clear-button.sc-calcite-input:disabled{opacity:var(--calcite-opacity-disabled)}/*!@.loader*/.loader.sc-calcite-input{inset-block-start:1px;inset-inline:1px;pointer-events:none;position:absolute;display:block}/*!@.action-wrapper*/.action-wrapper.sc-calcite-input{order:7;display:flex}/*!@.prefix,\n.suffix*/.prefix.sc-calcite-input,.suffix.sc-calcite-input{box-sizing:border-box;display:flex;block-size:auto;min-block-size:100%;-webkit-user-select:none;user-select:none;align-content:center;align-items:center;overflow-wrap:break-word;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);line-height:1;color:var(--calcite-color-text-2)}/*!@.prefix*/.prefix.sc-calcite-input{order:2;border-inline-end-width:0px}/*!@.suffix*/.suffix.sc-calcite-input{order:5;border-inline-start-width:0px}/*!@:host([alignment=start]) textarea, :host([alignment=start]) input*/[alignment=start].sc-calcite-input-h textarea.sc-calcite-input,[alignment=start].sc-calcite-input-h input.sc-calcite-input{text-align:start}/*!@:host([alignment=end]) textarea, :host([alignment=end]) input*/[alignment=end].sc-calcite-input-h textarea.sc-calcite-input,[alignment=end].sc-calcite-input-h input.sc-calcite-input{text-align:end}/*!@input[type=number]*/input[type=number].sc-calcite-input{-moz-appearance:textfield}/*!@input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button*/input[type=number].sc-calcite-input::-webkit-inner-spin-button,input[type=number].sc-calcite-input::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:textfield;margin:0px}/*!@.number-button-wrapper*/.number-button-wrapper.sc-calcite-input{pointer-events:none;order:6;box-sizing:border-box;display:flex;flex-direction:column;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@:host([number-button-type=vertical]) .wrapper*/[number-button-type=vertical].sc-calcite-input-h .wrapper.sc-calcite-input{flex-direction:row;display:flex}/*!@:host([number-button-type=vertical]) input,\n:host([number-button-type=vertical]) textarea*/[number-button-type=vertical].sc-calcite-input-h input.sc-calcite-input,[number-button-type=vertical].sc-calcite-input-h textarea.sc-calcite-input{order:2}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=down] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-h .calcite--rtl.sc-calcite-input .number-button-item[data-adjustment=down].sc-calcite-input calcite-icon.sc-calcite-input{transform:rotate(-90deg)}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=up] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-h .calcite--rtl.sc-calcite-input .number-button-item[data-adjustment=up].sc-calcite-input calcite-icon.sc-calcite-input{transform:rotate(-90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down], .number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input{order:1;max-block-size:100%;min-block-size:100%;align-self:stretch}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down] calcite-icon, .number-button-item.number-button-item--horizontal[data-adjustment=up] calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input calcite-icon.sc-calcite-input,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input calcite-icon.sc-calcite-input{transform:rotate(90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);border-inline-end-width:0px}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input{order:5}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=up].sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=up].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input{border-block-start-width:0px}/*!@.number-button-item*/.number-button-item.sc-calcite-input{max-block-size:50%;min-block-size:50%;pointer-events:initial;margin:0px;box-sizing:border-box;display:flex;cursor:pointer;align-items:center;align-self:center;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);padding-block:0px;padding-inline:0.5rem;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-inline-start-width:0px}/*!@.number-button-item calcite-icon*/.number-button-item.sc-calcite-input calcite-icon.sc-calcite-input{pointer-events:none;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.number-button-item:focus*/.number-button-item.sc-calcite-input:focus{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item:focus calcite-icon*/.number-button-item.sc-calcite-input:focus calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@.number-button-item:active*/.number-button-item.sc-calcite-input:active{background-color:var(--calcite-color-foreground-3)}/*!@.number-button-item:disabled*/.number-button-item.sc-calcite-input:disabled{pointer-events:none}/*!@.wrapper*/.wrapper.sc-calcite-input{position:relative;display:flex;flex-direction:row;align-items:center}/*!@:input::-webkit-calendar-picker-indicator*/.sc-calcite-input:input::-webkit-calendar-picker-indicator{display:none}/*!@input[type=date]::-webkit-input-placeholder*/input[type=date].sc-calcite-input::-webkit-input-placeholder{visibility:hidden !important}/*!@textarea::-webkit-resizer*/textarea.sc-calcite-input::-webkit-resizer{position:absolute;inset-block-end:0px;box-sizing:border-box;padding-block:0px;padding-inline:0.25rem;inset-inline-end:0}/*!@.resize-icon-wrapper*/.resize-icon-wrapper.sc-calcite-input{inset-block-end:2px;inset-inline-end:2px;pointer-events:none;position:absolute;block-size:0.75rem;inline-size:0.75rem;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-3)}/*!@.resize-icon-wrapper calcite-icon*/.resize-icon-wrapper.sc-calcite-input calcite-icon.sc-calcite-input{inset-block-end:0.25rem;inset-inline-end:0.25rem;transform:rotate(-45deg)}/*!@.calcite--rtl .resize-icon-wrapper calcite-icon*/.calcite--rtl.sc-calcite-input .resize-icon-wrapper.sc-calcite-input calcite-icon.sc-calcite-input{transform:rotate(45deg)}/*!@:host([type=color]) input*/[type=color].sc-calcite-input-h input.sc-calcite-input{padding:0.25rem}/*!@:host([type=file]) input*/[type=file].sc-calcite-input-h input.sc-calcite-input{cursor:pointer;border-width:1px;border-style:dashed;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);text-align:center}/*!@:host([type=file][scale=s]) input*/[type=file][scale=s].sc-calcite-input-h input.sc-calcite-input{padding-block:1px;padding-inline:0.5rem}/*!@:host([type=file][scale=m]) input*/[type=file][scale=m].sc-calcite-input-h input.sc-calcite-input{padding-block:0.25rem;padding-inline:0.75rem}/*!@:host([type=file][scale=l]) input*/[type=file][scale=l].sc-calcite-input-h input.sc-calcite-input{padding-block:0.5rem;padding-inline:1rem}/*!@:host(.no-bottom-border) input*/.no-bottom-border.sc-calcite-input-h input.sc-calcite-input{border-block-end-width:0px}/*!@:host(.border-top-color-one) input*/.border-top-color-one.sc-calcite-input-h input.sc-calcite-input{border-block-start-color:var(--calcite-color-border-1)}/*!@input.inline-child*/input.inline-child.sc-calcite-input{background-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@input.inline-child .editing-enabled*/input.inline-child.sc-calcite-input .editing-enabled.sc-calcite-input{background-color:inherit}/*!@input.inline-child:not(.editing-enabled)*/input.inline-child.sc-calcite-input:not(.editing-enabled){display:flex;cursor:pointer;text-overflow:ellipsis;border-color:transparent;padding-inline-start:0}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-input-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input{display:none}";
+const inputCss = "/*!@:host([disabled])*/[disabled].sc-calcite-input-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-h *.sc-calcite-input,.sc-calcite-input-h[disabled].sc-calcite-input-s>*,.sc-calcite-input-h[disabled] .sc-calcite-input-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-h{display:block}/*!@:host([scale=s]) input, :host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-h input.sc-calcite-input,[scale=s].sc-calcite-input-h .prefix.sc-calcite-input,[scale=s].sc-calcite-input-h .suffix.sc-calcite-input{block-size:1.5rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) textarea*/[scale=s].sc-calcite-input-h textarea.sc-calcite-input{block-size:1.5rem;min-block-size:1.5rem}/*!@:host([scale=s]) .number-button-wrapper, :host([scale=s]) .action-wrapper calcite-button, :host([scale=s]) .action-wrapper calcite-button button*/[scale=s].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=s].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=s].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{block-size:1.5rem}/*!@:host([scale=s]) input[type=file]*/[scale=s].sc-calcite-input-h input[type=file].sc-calcite-input{block-size:1.5rem}/*!@:host([scale=s]) .clear-button*/[scale=s].sc-calcite-input-h .clear-button.sc-calcite-input{min-block-size:1.5rem;min-inline-size:1.5rem}/*!@:host([scale=s]) textarea*/[scale=s].sc-calcite-input-h textarea.sc-calcite-input{block-size:auto;padding-block:0.25rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=m]) input, :host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-h input.sc-calcite-input,[scale=m].sc-calcite-input-h .prefix.sc-calcite-input,[scale=m].sc-calcite-input-h .suffix.sc-calcite-input{block-size:2rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) textarea*/[scale=m].sc-calcite-input-h textarea.sc-calcite-input{min-block-size:2rem}/*!@:host([scale=m]) .number-button-wrapper, :host([scale=m]) .action-wrapper calcite-button, :host([scale=m]) .action-wrapper calcite-button button*/[scale=m].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=m].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=m].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{block-size:2rem}/*!@:host([scale=m]) input[type=file]*/[scale=m].sc-calcite-input-h input[type=file].sc-calcite-input{block-size:2rem}/*!@:host([scale=m]) .clear-button*/[scale=m].sc-calcite-input-h .clear-button.sc-calcite-input{min-block-size:2rem;min-inline-size:2rem}/*!@:host([scale=m]) textarea*/[scale=m].sc-calcite-input-h textarea.sc-calcite-input{block-size:auto;padding-block:0.5rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=l]) input, :host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-h input.sc-calcite-input,[scale=l].sc-calcite-input-h .prefix.sc-calcite-input,[scale=l].sc-calcite-input-h .suffix.sc-calcite-input{block-size:2.75rem;padding-inline:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) textarea*/[scale=l].sc-calcite-input-h textarea.sc-calcite-input{min-block-size:2.75rem}/*!@:host([scale=l]) .number-button-wrapper, :host([scale=l]) .action-wrapper calcite-button, :host([scale=l]) .action-wrapper calcite-button button*/[scale=l].sc-calcite-input-h .number-button-wrapper.sc-calcite-input,[scale=l].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input,[scale=l].sc-calcite-input-h .action-wrapper.sc-calcite-input calcite-button.sc-calcite-input button.sc-calcite-input{block-size:2.75rem}/*!@:host([scale=l]) input[type=file]*/[scale=l].sc-calcite-input-h input[type=file].sc-calcite-input{block-size:2.75rem}/*!@:host([scale=l]) .clear-button*/[scale=l].sc-calcite-input-h .clear-button.sc-calcite-input{min-block-size:2.75rem;min-inline-size:2.75rem}/*!@:host([scale=l]) textarea*/[scale=l].sc-calcite-input-h textarea.sc-calcite-input{block-size:auto;padding-block:0.75rem;padding-inline:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([disabled]) textarea*/[disabled].sc-calcite-input-h textarea.sc-calcite-input{resize:none}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-h[disabled] .sc-calcite-input-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-h [calcite-hydrated][disabled].sc-calcite-input{opacity:1}/*!@textarea,\ninput*/textarea.sc-calcite-input,input.sc-calcite-input{transition:var(--calcite-animation-timing), block-size 0, outline-offset 0s;-webkit-appearance:none;position:relative;margin:0px;box-sizing:border-box;display:flex;max-block-size:100%;inline-size:100%;max-inline-size:100%;flex:1 1 0%;border-radius:0px;background-color:var(--calcite-color-foreground-1);font-family:inherit;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-1)}/*!@input[type=search]::-webkit-search-decoration*/input[type=search].sc-calcite-input::-webkit-search-decoration{-webkit-appearance:none}/*!@input,\ntextarea*/input.sc-calcite-input,textarea.sc-calcite-input{text-overflow:ellipsis;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);color:var(--calcite-color-text-1)}/*!@input:placeholder-shown,\ntextarea:placeholder-shown*/input.sc-calcite-input:placeholder-shown,textarea.sc-calcite-input:placeholder-shown{text-overflow:ellipsis}/*!@input:focus,\ntextarea:focus*/input.sc-calcite-input:focus,textarea.sc-calcite-input:focus{border-color:var(--calcite-color-brand);color:var(--calcite-color-text-1)}/*!@input[readonly],\ntextarea[readonly]*/input[readonly].sc-calcite-input,textarea[readonly].sc-calcite-input{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}/*!@input[readonly]:focus,\ntextarea[readonly]:focus*/input[readonly].sc-calcite-input:focus,textarea[readonly].sc-calcite-input:focus{color:var(--calcite-color-text-1)}/*!@calcite-icon*/calcite-icon.sc-calcite-input{color:var(--calcite-color-text-3)}/*!@textarea,\ninput*/textarea.sc-calcite-input,input.sc-calcite-input{outline-color:transparent}/*!@textarea:focus,\ninput:focus*/textarea.sc-calcite-input:focus,input.sc-calcite-input:focus{outline:2px solid 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          )}/*!@:host([status=invalid]) input, :host([status=invalid]) textarea*/[status=invalid].sc-calcite-input-h input.sc-calcite-input,[status=invalid].sc-calcite-input-h textarea.sc-calcite-input{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) input:focus, :host([status=invalid]) textarea:focus*/[status=invalid].sc-calcite-input-h input.sc-calcite-input:focus,[status=invalid].sc-calcite-input-h textarea.sc-calcite-input:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@:host([scale=s]) .icon*/[scale=s].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:0.5rem}/*!@:host([scale=m]) .icon*/[scale=m].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:0.75rem}/*!@:host([scale=l]) .icon*/[scale=l].sc-calcite-input-h .icon.sc-calcite-input{inset-inline-start:1rem}/*!@:host([icon][scale=s]) input*/[icon][scale=s].sc-calcite-input-h input.sc-calcite-input{padding-inline-start:2rem}/*!@:host([icon][scale=m]) input*/[icon][scale=m].sc-calcite-input-h input.sc-calcite-input{padding-inline-start:2.5rem}/*!@:host([icon][scale=l]) input*/[icon][scale=l].sc-calcite-input-h input.sc-calcite-input{padding-inline-start:3.5rem}/*!@.element-wrapper*/.element-wrapper.sc-calcite-input{position:relative;order:3;display:inline-flex;flex:1 1 0%;align-items:center}/*!@.icon*/.icon.sc-calcite-input{pointer-events:none;position:absolute;display:block;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.icon,\n.resize-icon-wrapper*/.icon.sc-calcite-input,.resize-icon-wrapper.sc-calcite-input{z-index:var(--calcite-z-index)}/*!@input[type=text]::-ms-clear,\ninput[type=text]::-ms-reveal*/input[type=text].sc-calcite-input::-ms-clear,input[type=text].sc-calcite-input::-ms-reveal{display:none;block-size:0px;inline-size:0px}/*!@input[type=search]::-webkit-search-decoration,\ninput[type=search]::-webkit-search-cancel-button,\ninput[type=search]::-webkit-search-results-button,\ninput[type=search]::-webkit-search-results-decoration,\ninput[type=date]::-webkit-clear-button,\ninput[type=time]::-webkit-clear-button*/input[type=search].sc-calcite-input::-webkit-search-decoration,input[type=search].sc-calcite-input::-webkit-search-cancel-button,input[type=search].sc-calcite-input::-webkit-search-results-button,input[type=search].sc-calcite-input::-webkit-search-results-decoration,input[type=date].sc-calcite-input::-webkit-clear-button,input[type=time].sc-calcite-input::-webkit-clear-button{display:none}/*!@.clear-button*/.clear-button.sc-calcite-input{pointer-events:initial;order:4;margin:0px;box-sizing:border-box;display:flex;min-block-size:100%;cursor:pointer;align-items:center;justify-content:center;align-self:stretch;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);outline-color:transparent;border-inline-start-width:0px}/*!@.clear-button:hover*/.clear-button.sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:hover calcite-icon*/.clear-button.sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:active*/.clear-button.sc-calcite-input:active{background-color:var(--calcite-color-foreground-3)}/*!@.clear-button:active calcite-icon*/.clear-button.sc-calcite-input:active calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@.clear-button:focus*/.clear-button.sc-calcite-input:focus{outline:2px solid 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          )}/*!@.clear-button:disabled*/.clear-button.sc-calcite-input:disabled{opacity:var(--calcite-opacity-disabled)}/*!@.loader*/.loader.sc-calcite-input{inset-block-start:1px;inset-inline:1px;pointer-events:none;position:absolute;display:block}/*!@.action-wrapper*/.action-wrapper.sc-calcite-input{order:7;display:flex}/*!@.prefix,\n.suffix*/.prefix.sc-calcite-input,.suffix.sc-calcite-input{box-sizing:border-box;display:flex;block-size:auto;min-block-size:100%;-webkit-user-select:none;user-select:none;align-content:center;align-items:center;overflow-wrap:break-word;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);line-height:1;color:var(--calcite-color-text-2)}/*!@.prefix*/.prefix.sc-calcite-input{order:2;border-inline-end-width:0px}/*!@.suffix*/.suffix.sc-calcite-input{order:5;border-inline-start-width:0px}/*!@:host([alignment=start]) textarea, :host([alignment=start]) input*/[alignment=start].sc-calcite-input-h textarea.sc-calcite-input,[alignment=start].sc-calcite-input-h input.sc-calcite-input{text-align:start}/*!@:host([alignment=end]) textarea, :host([alignment=end]) input*/[alignment=end].sc-calcite-input-h textarea.sc-calcite-input,[alignment=end].sc-calcite-input-h input.sc-calcite-input{text-align:end}/*!@input[type=number]*/input[type=number].sc-calcite-input{-moz-appearance:textfield}/*!@input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button*/input[type=number].sc-calcite-input::-webkit-inner-spin-button,input[type=number].sc-calcite-input::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:textfield;margin:0px}/*!@.number-button-wrapper*/.number-button-wrapper.sc-calcite-input{pointer-events:none;order:6;box-sizing:border-box;display:flex;flex-direction:column;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@:host([number-button-type=vertical]) .wrapper*/[number-button-type=vertical].sc-calcite-input-h .wrapper.sc-calcite-input{flex-direction:row;display:flex}/*!@:host([number-button-type=vertical]) input,\n:host([number-button-type=vertical]) textarea*/[number-button-type=vertical].sc-calcite-input-h input.sc-calcite-input,[number-button-type=vertical].sc-calcite-input-h textarea.sc-calcite-input{order:2}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=down] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-h .calcite--rtl.sc-calcite-input .number-button-item[data-adjustment=down].sc-calcite-input calcite-icon.sc-calcite-input{transform:rotate(-90deg)}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=up] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-h .calcite--rtl.sc-calcite-input .number-button-item[data-adjustment=up].sc-calcite-input calcite-icon.sc-calcite-input{transform:rotate(-90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down], .number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input{order:1;max-block-size:100%;min-block-size:100%;align-self:stretch}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down] calcite-icon, .number-button-item.number-button-item--horizontal[data-adjustment=up] calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input calcite-icon.sc-calcite-input,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input calcite-icon.sc-calcite-input{transform:rotate(90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);border-inline-end-width:0px}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input{order:5}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=up].sc-calcite-input:hover{background-color:var(--calcite-color-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=up].sc-calcite-input:hover calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]*/[number-button-type=vertical].sc-calcite-input-h .number-button-item[data-adjustment=down].sc-calcite-input{border-block-start-width:0px}/*!@.number-button-item*/.number-button-item.sc-calcite-input{max-block-size:50%;min-block-size:50%;pointer-events:initial;margin:0px;box-sizing:border-box;display:flex;cursor:pointer;align-items:center;align-self:center;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);padding-block:0px;padding-inline:0.5rem;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-inline-start-width:0px}/*!@.number-button-item calcite-icon*/.number-button-item.sc-calcite-input calcite-icon.sc-calcite-input{pointer-events:none;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.number-button-item:focus*/.number-button-item.sc-calcite-input:focus{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item:focus calcite-icon*/.number-button-item.sc-calcite-input:focus calcite-icon.sc-calcite-input{color:var(--calcite-color-text-1)}/*!@.number-button-item:active*/.number-button-item.sc-calcite-input:active{background-color:var(--calcite-color-foreground-3)}/*!@.number-button-item:disabled*/.number-button-item.sc-calcite-input:disabled{pointer-events:none}/*!@.wrapper*/.wrapper.sc-calcite-input{position:relative;display:flex;flex-direction:row;align-items:center}/*!@:input::-webkit-calendar-picker-indicator*/.sc-calcite-input:input::-webkit-calendar-picker-indicator{display:none}/*!@input[type=date]::-webkit-input-placeholder*/input[type=date].sc-calcite-input::-webkit-input-placeholder{visibility:hidden !important}/*!@textarea::-webkit-resizer*/textarea.sc-calcite-input::-webkit-resizer{position:absolute;inset-block-end:0px;box-sizing:border-box;padding-block:0px;padding-inline:0.25rem;inset-inline-end:0}/*!@.resize-icon-wrapper*/.resize-icon-wrapper.sc-calcite-input{inset-block-end:2px;inset-inline-end:2px;pointer-events:none;position:absolute;block-size:0.75rem;inline-size:0.75rem;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-3)}/*!@.resize-icon-wrapper calcite-icon*/.resize-icon-wrapper.sc-calcite-input calcite-icon.sc-calcite-input{inset-block-end:0.25rem;inset-inline-end:0.25rem;transform:rotate(-45deg)}/*!@.calcite--rtl .resize-icon-wrapper calcite-icon*/.calcite--rtl.sc-calcite-input .resize-icon-wrapper.sc-calcite-input calcite-icon.sc-calcite-input{transform:rotate(45deg)}/*!@:host([type=color]) input*/[type=color].sc-calcite-input-h input.sc-calcite-input{padding:0.25rem}/*!@:host([type=file]) input*/[type=file].sc-calcite-input-h input.sc-calcite-input{cursor:pointer;border-width:1px;border-style:dashed;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);text-align:center}/*!@:host([type=file][scale=s]) input*/[type=file][scale=s].sc-calcite-input-h input.sc-calcite-input{padding-block:1px;padding-inline:0.5rem}/*!@:host([type=file][scale=m]) input*/[type=file][scale=m].sc-calcite-input-h input.sc-calcite-input{padding-block:0.25rem;padding-inline:0.75rem}/*!@:host([type=file][scale=l]) input*/[type=file][scale=l].sc-calcite-input-h input.sc-calcite-input{padding-block:0.5rem;padding-inline:1rem}/*!@:host(.no-bottom-border) input*/.no-bottom-border.sc-calcite-input-h input.sc-calcite-input{border-block-end-width:0px}/*!@:host(.border-top-color-one) input*/.border-top-color-one.sc-calcite-input-h input.sc-calcite-input{border-block-start-color:var(--calcite-color-border-1)}/*!@input.inline-child*/input.inline-child.sc-calcite-input{background-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@input.inline-child .editing-enabled*/input.inline-child.sc-calcite-input .editing-enabled.sc-calcite-input{background-color:inherit}/*!@input.inline-child:not(.editing-enabled)*/input.inline-child.sc-calcite-input:not(.editing-enabled){display:flex;cursor:pointer;text-overflow:ellipsis;border-color:transparent;padding-inline-start:0}/*!@.validation-container*/.validation-container.sc-calcite-input{padding-block-start:0.5rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-input-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input{display:none}";
 
 /**
  * @slot action - A slot for positioning a `calcite-button` next to the component.
@@ -24189,6 +24199,8 @@ class Input {
         this.min = undefined;
         this.maxLength = undefined;
         this.minLength = undefined;
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.numberButtonType = "vertical";
         this.placeholder = undefined;
@@ -24459,7 +24471,7 @@ class Input {
             ? numberButtonsVertical
             : null, this.suffixText ? suffixText : null, this.type === "number" && this.numberButtonType === "horizontal" && !this.readOnly
             ? numberButtonsHorizontalUp
-            : null, hAsync(HiddenFormInputSlot, { component: this }))));
+            : null, hAsync(HiddenFormInputSlot, { component: this })), this.validationMessage ? (hAsync(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -24495,6 +24507,8 @@ class Input {
             "min": [514],
             "maxLength": [514, "max-length"],
             "minLength": [514, "min-length"],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [513],
             "numberButtonType": [513, "number-button-type"],
             "placeholder": [1],
@@ -24532,9 +24546,18 @@ class Input {
 
 const CSS$L = {
     assistiveText: "assistive-text",
+    calendarWrapper: "calendar-wrapper",
+    calendarWrapperEnd: "calendar-wrapper--end",
+    horizontalArrowContainer: "horizontal-arrow-container",
+    inputBorderTopColorOne: "border-top-color-one",
+    inputContainer: "input-container",
+    inputNoBottomBorder: "no-bottom-border",
+    inputWrapper: "input-wrapper",
+    input: "input",
     menu: "menu-container",
     menuActive: "menu-container--active",
     toggleIcon: "toggle-icon",
+    verticalArrowContainer: "vertical-arrow-container",
 };
 
 /*!
@@ -25567,7 +25590,7 @@ function normalizeToCurrentCentury(twoDigitYear) {
     return normalizedYear;
 }
 
-const inputDatePickerCss = "/*!@:host*/.sc-calcite-input-date-picker-h{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}/*!@:host([disabled])*/[disabled].sc-calcite-input-date-picker-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-date-picker-h *.sc-calcite-input-date-picker,.sc-calcite-input-date-picker-h[disabled].sc-calcite-input-date-picker-s>*,.sc-calcite-input-date-picker-h[disabled] .sc-calcite-input-date-picker-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-date-picker-h{position:relative;display:inline-block;inline-size:100%;overflow:visible;vertical-align:top;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host .menu-container .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container.sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-z-index);border-radius:0.25rem}/*!@:host .menu-container[data-placement^=bottom] .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container[data-placement^=bottom].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateY(-5px)}/*!@:host .menu-container[data-placement^=top] .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container[data-placement^=top].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateY(5px)}/*!@:host .menu-container[data-placement^=left] .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container[data-placement^=left].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateX(5px)}/*!@:host .menu-container[data-placement^=right] .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container[data-placement^=right].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateX(-5px)}/*!@:host .menu-container[data-placement] .calcite-floating-ui-anim--active*/.sc-calcite-input-date-picker-h .menu-container[data-placement].sc-calcite-input-date-picker .calcite-floating-ui-anim--active.sc-calcite-input-date-picker{opacity:1;transform:translate(0)}/*!@:host([scale=s])*/[scale=s].sc-calcite-input-date-picker-h{--calcite-toggle-spacing:0.5rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 1rem)}/*!@:host([scale=m])*/[scale=m].sc-calcite-input-date-picker-h{--calcite-toggle-spacing:0.75rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 1.5rem)}/*!@:host([scale=l])*/[scale=l].sc-calcite-input-date-picker-h{--calcite-toggle-spacing:1rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 2rem)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-date-picker-h[disabled] .sc-calcite-input-date-picker-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-date-picker-h [calcite-hydrated][disabled].sc-calcite-input-date-picker{opacity:1}/*!@.calendar-picker-wrapper*/.calendar-picker-wrapper.sc-calcite-input-date-picker{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transform:translate3d(0, 0, 0)}/*!@.input-wrapper*/.input-wrapper.sc-calcite-input-date-picker{position:relative}/*!@.toggle-icon*/.toggle-icon.sc-calcite-input-date-picker{position:absolute;display:flex;cursor:pointer;align-items:center;inset-inline-end:0;inset-block:0;padding-inline:var(--calcite-toggle-spacing)}/*!@:host([range]) .input-container*/[range].sc-calcite-input-date-picker-h .input-container.sc-calcite-input-date-picker{display:flex}/*!@:host([range]) .input-wrapper*/[range].sc-calcite-input-date-picker-h .input-wrapper.sc-calcite-input-date-picker{flex:1 1 auto}/*!@:host([range]) .horizontal-arrow-container*/[range].sc-calcite-input-date-picker-h .horizontal-arrow-container.sc-calcite-input-date-picker{display:flex;align-items:center;border-width:1px;border-inline-start-width:0px;border-inline-end-width:0px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);padding-block:0px;padding-inline:0.25rem}/*!@:host([range][layout=vertical]) .input-wrapper*/[range][layout=vertical].sc-calcite-input-date-picker-h .input-wrapper.sc-calcite-input-date-picker{inline-size:100%}/*!@:host([range][layout=vertical]) .input-container*/[range][layout=vertical].sc-calcite-input-date-picker-h .input-container.sc-calcite-input-date-picker{flex-direction:column;align-items:flex-start}/*!@:host([range][layout=vertical]) .calendar-picker-wrapper--end*/[range][layout=vertical].sc-calcite-input-date-picker-h .calendar-picker-wrapper--end.sc-calcite-input-date-picker{transform:translate3d(0, 0, 0)}/*!@:host([range][layout=vertical]) .vertical-arrow-container*/[range][layout=vertical].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{inset-block-start:1.5rem;position:absolute;z-index:var(--calcite-z-index);margin-inline:1px;background-color:var(--calcite-color-foreground-1);padding-inline:0.625rem;inset-inline-start:0}/*!@.menu-container*/.menu-container.sc-calcite-input-date-picker{--calcite-floating-ui-z-index:var(--calcite-z-index-dropdown);display:block;position:absolute;z-index:var(--calcite-floating-ui-z-index);visibility:hidden}/*!@.menu-container .calcite-floating-ui-anim*/.menu-container.sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-z-index);border-radius:0.25rem}/*!@.menu-container[data-placement^=bottom] .calcite-floating-ui-anim*/.menu-container[data-placement^=bottom].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateY(-5px)}/*!@.menu-container[data-placement^=top] .calcite-floating-ui-anim*/.menu-container[data-placement^=top].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateY(5px)}/*!@.menu-container[data-placement^=left] .calcite-floating-ui-anim*/.menu-container[data-placement^=left].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateX(5px)}/*!@.menu-container[data-placement^=right] .calcite-floating-ui-anim*/.menu-container[data-placement^=right].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateX(-5px)}/*!@.menu-container[data-placement] .calcite-floating-ui-anim--active*/.menu-container[data-placement].sc-calcite-input-date-picker .calcite-floating-ui-anim--active.sc-calcite-input-date-picker{opacity:1;transform:translate(0)}/*!@:host([open]) .menu-container*/[open].sc-calcite-input-date-picker-h .menu-container.sc-calcite-input-date-picker{visibility:visible}/*!@.menu-container--active*/.menu-container--active.sc-calcite-input-date-picker{visibility:visible}/*!@.input .calcite-input__wrapper*/.input.sc-calcite-input-date-picker .calcite-input__wrapper.sc-calcite-input-date-picker{margin-block-start:0px}/*!@:host([range][layout=vertical][scale=m]) .vertical-arrow-container*/[range][layout=vertical][scale=m].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{inset-block-start:1.5rem;padding-inline-start:0.75rem}/*!@:host([range][layout=vertical][scale=m]) .vertical-arrow-container calcite-icon*/[range][layout=vertical][scale=m].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker calcite-icon.sc-calcite-input-date-picker{block-size:0.75rem;inline-size:0.75rem;min-inline-size:0px}/*!@:host([range][layout=vertical][scale=l]) .vertical-arrow-container*/[range][layout=vertical][scale=l].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{inset-block-start:2.25rem;padding-inline:0.875rem}/*!@:host([range][layout=vertical][open]) .vertical-arrow-container*/[range][layout=vertical][open].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{display:none}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-date-picker-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@.assistive-text*/.assistive-text.sc-calcite-input-date-picker{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@:host([hidden])*/[hidden].sc-calcite-input-date-picker-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-date-picker{display:none}";
+const inputDatePickerCss = "/*!@:host*/.sc-calcite-input-date-picker-h{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}/*!@:host([disabled])*/[disabled].sc-calcite-input-date-picker-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-date-picker-h *.sc-calcite-input-date-picker,.sc-calcite-input-date-picker-h[disabled].sc-calcite-input-date-picker-s>*,.sc-calcite-input-date-picker-h[disabled] .sc-calcite-input-date-picker-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-date-picker-h{position:relative;display:inline-block;inline-size:100%;overflow:visible;vertical-align:top;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}/*!@:host .menu-container .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container.sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-z-index);border-radius:0.25rem}/*!@:host .menu-container[data-placement^=bottom] .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container[data-placement^=bottom].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateY(-5px)}/*!@:host .menu-container[data-placement^=top] .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container[data-placement^=top].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateY(5px)}/*!@:host .menu-container[data-placement^=left] .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container[data-placement^=left].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateX(5px)}/*!@:host .menu-container[data-placement^=right] .calcite-floating-ui-anim*/.sc-calcite-input-date-picker-h .menu-container[data-placement^=right].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateX(-5px)}/*!@:host .menu-container[data-placement] .calcite-floating-ui-anim--active*/.sc-calcite-input-date-picker-h .menu-container[data-placement].sc-calcite-input-date-picker .calcite-floating-ui-anim--active.sc-calcite-input-date-picker{opacity:1;transform:translate(0)}/*!@:host([scale=s])*/[scale=s].sc-calcite-input-date-picker-h{--calcite-toggle-spacing:0.5rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 1rem)}/*!@:host([scale=m])*/[scale=m].sc-calcite-input-date-picker-h{--calcite-toggle-spacing:0.75rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 1.5rem)}/*!@:host([scale=l])*/[scale=l].sc-calcite-input-date-picker-h{--calcite-toggle-spacing:1rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 2rem)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-date-picker-h[disabled] .sc-calcite-input-date-picker-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-date-picker-h [calcite-hydrated][disabled].sc-calcite-input-date-picker{opacity:1}/*!@.calendar-wrapper*/.calendar-wrapper.sc-calcite-input-date-picker{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transform:translate3d(0, 0, 0)}/*!@.input-wrapper*/.input-wrapper.sc-calcite-input-date-picker{position:relative}/*!@.toggle-icon*/.toggle-icon.sc-calcite-input-date-picker{position:absolute;display:flex;cursor:pointer;align-items:center;inset-inline-end:0;inset-block:0;padding-inline:var(--calcite-toggle-spacing)}/*!@:host([range]) .input-container*/[range].sc-calcite-input-date-picker-h .input-container.sc-calcite-input-date-picker{display:flex}/*!@:host([range]) .input-wrapper*/[range].sc-calcite-input-date-picker-h .input-wrapper.sc-calcite-input-date-picker{flex:1 1 auto}/*!@:host([range]) .horizontal-arrow-container*/[range].sc-calcite-input-date-picker-h .horizontal-arrow-container.sc-calcite-input-date-picker{display:flex;align-items:center;border-width:1px;border-inline-start-width:0px;border-inline-end-width:0px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);padding-block:0px;padding-inline:0.25rem}/*!@:host([range][layout=vertical]) .input-wrapper*/[range][layout=vertical].sc-calcite-input-date-picker-h .input-wrapper.sc-calcite-input-date-picker{inline-size:100%}/*!@:host([range][layout=vertical]) .input-container*/[range][layout=vertical].sc-calcite-input-date-picker-h .input-container.sc-calcite-input-date-picker{flex-direction:column;align-items:flex-start}/*!@:host([range][layout=vertical]) .calendar-wrapper--end*/[range][layout=vertical].sc-calcite-input-date-picker-h .calendar-wrapper--end.sc-calcite-input-date-picker{transform:translate3d(0, 0, 0)}/*!@:host([range][layout=vertical]) .vertical-arrow-container*/[range][layout=vertical].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{inset-block-start:1.5rem;position:absolute;z-index:var(--calcite-z-index);margin-inline:1px;background-color:var(--calcite-color-foreground-1);padding-inline:0.625rem;inset-inline-start:0}/*!@.menu-container*/.menu-container.sc-calcite-input-date-picker{--calcite-floating-ui-z-index:var(--calcite-z-index-dropdown);display:block;position:absolute;z-index:var(--calcite-floating-ui-z-index);visibility:hidden}/*!@.menu-container .calcite-floating-ui-anim*/.menu-container.sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{position:relative;transition:var(--calcite-floating-ui-transition);transition-property:transform, visibility, opacity;opacity:0;box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);z-index:var(--calcite-z-index);border-radius:0.25rem}/*!@.menu-container[data-placement^=bottom] .calcite-floating-ui-anim*/.menu-container[data-placement^=bottom].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateY(-5px)}/*!@.menu-container[data-placement^=top] .calcite-floating-ui-anim*/.menu-container[data-placement^=top].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateY(5px)}/*!@.menu-container[data-placement^=left] .calcite-floating-ui-anim*/.menu-container[data-placement^=left].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateX(5px)}/*!@.menu-container[data-placement^=right] .calcite-floating-ui-anim*/.menu-container[data-placement^=right].sc-calcite-input-date-picker .calcite-floating-ui-anim.sc-calcite-input-date-picker{transform:translateX(-5px)}/*!@.menu-container[data-placement] .calcite-floating-ui-anim--active*/.menu-container[data-placement].sc-calcite-input-date-picker .calcite-floating-ui-anim--active.sc-calcite-input-date-picker{opacity:1;transform:translate(0)}/*!@:host([open]) .menu-container*/[open].sc-calcite-input-date-picker-h .menu-container.sc-calcite-input-date-picker{visibility:visible}/*!@.menu-container--active*/.menu-container--active.sc-calcite-input-date-picker{visibility:visible}/*!@.input .calcite-input__wrapper*/.input.sc-calcite-input-date-picker .calcite-input__wrapper.sc-calcite-input-date-picker{margin-block-start:0px}/*!@:host([range][layout=vertical][scale=m]) .vertical-arrow-container*/[range][layout=vertical][scale=m].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{inset-block-start:1.5rem;padding-inline-start:0.75rem}/*!@:host([range][layout=vertical][scale=m]) .vertical-arrow-container calcite-icon*/[range][layout=vertical][scale=m].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker calcite-icon.sc-calcite-input-date-picker{block-size:0.75rem;inline-size:0.75rem;min-inline-size:0px}/*!@:host([range][layout=vertical][scale=l]) .vertical-arrow-container*/[range][layout=vertical][scale=l].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{inset-block-start:2.25rem;padding-inline:0.875rem}/*!@:host([range][layout=vertical][open]) .vertical-arrow-container*/[range][layout=vertical][open].sc-calcite-input-date-picker-h .vertical-arrow-container.sc-calcite-input-date-picker{display:none}/*!@.validation-container*/.validation-container.sc-calcite-input-date-picker{padding-block-start:0.5rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-date-picker-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@.assistive-text*/.assistive-text.sc-calcite-input-date-picker{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@:host([hidden])*/[hidden].sc-calcite-input-date-picker-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-date-picker{display:none}";
 
 class InputDatePicker {
     constructor(hostRef) {
@@ -25597,7 +25620,6 @@ class InputDatePicker {
         };
         this.dialogId = `date-picker-dialog--${guid()}`;
         this.focusOnOpen = false;
-        this.lastBlurredInput = "none";
         this.userChangedValue = false;
         this.openTransitionProp = "opacity";
         this.valueAsDateChangedExternally = false;
@@ -25607,12 +25629,28 @@ class InputDatePicker {
         //  Private Methods
         //
         //--------------------------------------------------------------------------
-        this.onInputWrapperClick = () => {
-            if (this.range && this.lastBlurredInput !== "none" && this.open) ;
-            else {
+        this.onInputWrapperPointerDown = () => {
+            this.currentOpenInput = this.focusedInput;
+        };
+        this.onInputWrapperClick = (event) => {
+            const { range, endInput, startInput, currentOpenInput } = this;
+            if (!range || !this.open) {
+                this.open = !this.open;
+                return;
+            }
+            const currentTarget = event.currentTarget;
+            const position = currentTarget.getAttribute("data-position");
+            const path = event.composedPath();
+            const wasToggleClicked = path.find((el) => {
+                return el.classList?.contains(CSS$L.toggleIcon);
+            });
+            if (wasToggleClicked) {
+                const targetInput = position === "start" ? startInput : endInput;
+                targetInput.setFocus();
+            }
+            if (currentOpenInput === position) {
                 this.open = !this.open;
             }
-            this.lastBlurredInput = "none";
         };
         this.setFilteredPlacements = () => {
             const { el, flipPlacements } = this;
@@ -25629,9 +25667,8 @@ class InputDatePicker {
         this.setEndInput = (el) => {
             this.endInput = el;
         };
-        this.deactivate = () => {
+        this.blurHandler = () => {
             this.open = false;
-            this.lastBlurredInput = "none";
         };
         this.keyDownHandler = (event) => {
             const { defaultPrevented, key } = event;
@@ -25665,11 +25702,6 @@ class InputDatePicker {
         this.startInputFocus = () => {
             this.focusedInput = "start";
         };
-        this.startEndInputFocus = (event) => {
-            const blurredEl = event.relatedTarget;
-            this.lastBlurredInput =
-                blurredEl === this.startInput ? "start" : blurredEl === this.endInput ? "end" : "none";
-        };
         this.endInputFocus = () => {
             this.focusedInput = "end";
         };
@@ -25814,6 +25846,8 @@ class InputDatePicker {
         this.min = undefined;
         this.max = undefined;
         this.open = false;
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.numberingSystem = undefined;
         this.scale = "m";
@@ -26017,9 +26051,12 @@ class InputDatePicker {
             locale: effectiveLocale,
             useGrouping: false,
         };
-        return (hAsync(Host, { onBlur: this.deactivate, onKeyDown: this.keyDownHandler }, this.localeData && (hAsync("div", { class: "input-container" }, hAsync("div", { class: "input-wrapper", onClick: this.onInputWrapperClick,
+        return (hAsync(Host, { onBlur: this.blurHandler, onKeyDown: this.keyDownHandler }, this.localeData && (hAsync("div", { class: CSS$L.inputContainer }, hAsync("div", { class: CSS$L.inputWrapper, "data-position": "start", onClick: this.onInputWrapperClick, onPointerDown: this.onInputWrapperPointerDown,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.setStartWrapper }, hAsync("calcite-input-text", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-describedby": this.placeholderTextId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: `input ${this.layout === "vertical" && this.range ? `no-bottom-border` : ``}`, disabled: disabled, icon: "calendar", onCalciteInputTextInput: this.calciteInternalInputInputHandler, onCalciteInternalInputTextBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputTextFocus: this.startInputFocus, onFocus: this.startEndInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, role: "combobox", scale: this.scale, status: this.status,
+            ref: this.setStartWrapper }, hAsync("calcite-input-text", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-describedby": this.placeholderTextId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: {
+                [CSS$L.input]: true,
+                [CSS$L.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, role: "combobox", scale: this.scale, status: this.status,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setStartInput }), !this.readOnly && this.renderToggleIcon(this.open && this.focusedInput === "start"), hAsync("span", { "aria-hidden": "true", class: CSS$L.assistiveText, id: this.placeholderTextId }, "Date Format: ", this.localeData?.placeholder)), hAsync("div", { "aria-hidden": toAriaBoolean(!this.open), "aria-label": messages.chooseDate, "aria-live": "polite", "aria-modal": "true", class: {
                 [CSS$L.menu]: true,
@@ -26027,22 +26064,22 @@ class InputDatePicker {
             }, id: this.dialogId, role: "dialog",
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setFloatingEl }, hAsync("div", { class: {
-                ["calendar-picker-wrapper"]: true,
-                ["calendar-picker-wrapper--end"]: this.focusedInput === "end",
+                [CSS$L.calendarWrapper]: true,
+                [CSS$L.calendarWrapperEnd]: this.focusedInput === "end",
                 [FloatingCSS.animation]: true,
                 [FloatingCSS.animationActive]: this.open,
             },
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setTransitionEl }, hAsync("calcite-date-picker", { activeDate: this.datePickerActiveDate, activeRange: this.focusedInput, headingLevel: this.headingLevel, max: this.max, maxAsDate: this.maxAsDate, messageOverrides: this.messageOverrides, min: this.min, minAsDate: this.minAsDate, numberingSystem: numberingSystem, onCalciteDatePickerChange: this.handleDateChange, onCalciteDatePickerRangeChange: this.handleDateRangeChange, proximitySelectionDisabled: this.proximitySelectionDisabled, range: this.range, scale: this.scale, tabIndex: this.open ? undefined : -1, valueAsDate: this.valueAsDate,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.setDatePickerRef }))), this.range && this.layout === "horizontal" && (hAsync("div", { class: "horizontal-arrow-container" }, hAsync("calcite-icon", { flipRtl: true, icon: "arrow-right", scale: getIconScale(this.scale) }))), this.range && this.layout === "vertical" && this.scale !== "s" && (hAsync("div", { class: "vertical-arrow-container" }, hAsync("calcite-icon", { icon: "arrow-down", scale: getIconScale(this.scale) }))), this.range && (hAsync("div", { class: "input-wrapper", onClick: this.onInputWrapperClick,
+            ref: this.setDatePickerRef }))), this.range && this.layout === "horizontal" && (hAsync("div", { class: CSS$L.horizontalArrowContainer }, hAsync("calcite-icon", { flipRtl: true, icon: "arrow-right", scale: getIconScale(this.scale) }))), this.range && this.layout === "vertical" && this.scale !== "s" && (hAsync("div", { class: CSS$L.verticalArrowContainer }, hAsync("calcite-icon", { icon: "arrow-down", scale: getIconScale(this.scale) }))), this.range && (hAsync("div", { class: CSS$L.inputWrapper, "data-position": "end", onClick: this.onInputWrapperClick, onPointerDown: this.onInputWrapperPointerDown,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setEndWrapper }, hAsync("calcite-input-text", { "aria-autocomplete": "none", "aria-controls": this.dialogId, "aria-expanded": toAriaBoolean(this.open), "aria-haspopup": "dialog", class: {
-                input: true,
-                "border-top-color-one": this.layout === "vertical" && this.range,
-            }, disabled: disabled, icon: "calendar", onCalciteInputTextInput: this.calciteInternalInputInputHandler, onCalciteInternalInputTextBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputTextFocus: this.endInputFocus, onFocus: this.startEndInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, role: "combobox", scale: this.scale, status: this.status,
+                [CSS$L.input]: true,
+                [CSS$L.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, role: "combobox", scale: this.scale, status: this.status,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.setEndInput }), !this.readOnly && this.renderToggleIcon(this.open && this.focusedInput === "end"))))), hAsync(HiddenFormInputSlot, { component: this })));
+            ref: this.setEndInput }), !this.readOnly && this.renderToggleIcon(this.open && this.focusedInput === "end"))))), hAsync(HiddenFormInputSlot, { component: this }), this.validationMessage ? (hAsync(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null));
     }
     renderToggleIcon(open) {
         return (hAsync("span", { class: CSS$L.toggleIcon }, hAsync("calcite-icon", { icon: open ? "chevron-up" : "chevron-down", scale: getIconScale(this.scale) })));
@@ -26220,6 +26257,8 @@ class InputDatePicker {
             "min": [1],
             "max": [1],
             "open": [1540],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [513],
             "numberingSystem": [513, "numbering-system"],
             "scale": [513],
@@ -26251,7 +26290,7 @@ var StatusIconDefaults;
     StatusIconDefaults["idle"] = "information";
 })(StatusIconDefaults || (StatusIconDefaults = {}));
 
-const inputMessageCss = "/*!@:host([scale=m]),\n:host([scale=l])*/[scale=m].sc-calcite-input-message-h,[scale=l].sc-calcite-input-message-h{--calcite-input-message-spacing-value:0.25rem}/*!@:host*/.sc-calcite-input-message-h{visibility:hidden;box-sizing:border-box;display:flex;block-size:0px;inline-size:100%;align-items:center;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1);visibility:visible;block-size:auto;opacity:1;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@:host([scale=m]),\n:host([scale=l])*/[scale=m].sc-calcite-input-message-h,[scale=l].sc-calcite-input-message-h{margin-block-start:var(--calcite-input-message-spacing-value)}/*!@.calcite-input-message-icon*/.calcite-input-message-icon.sc-calcite-input-message{pointer-events:none;display:inline-flex;flex-shrink:0;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;margin-inline-end:0.5rem}/*!@:host([status=invalid]) .calcite-input-message-icon*/[status=invalid].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-color-status-danger)}/*!@:host([status=warning]) .calcite-input-message-icon*/[status=warning].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-color-status-warning)}/*!@:host([status=valid]) .calcite-input-message-icon*/[status=valid].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-color-status-success)}/*!@:host([status=idle]) .calcite-input-message-icon*/[status=idle].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-color-brand)}/*!@:host([status])*/[status].sc-calcite-input-message-h{color:var(--calcite-color-text-1)}/*!@:host([status][scale=s])*/[status][scale=s].sc-calcite-input-message-h{font-size:var(--calcite-font-size--3);line-height:0.75rem}/*!@:host([status][scale=m])*/[status][scale=m].sc-calcite-input-message-h{margin-block-start:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([status][scale=l])*/[status][scale=l].sc-calcite-input-message-h{margin-block-start:0.25rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([hidden])*/[hidden].sc-calcite-input-message-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-message{display:none}";
+const inputMessageCss = "/*!@:host([scale=m]),\n:host([scale=l])*/[scale=m].sc-calcite-input-message-h,[scale=l].sc-calcite-input-message-h{--calcite-input-message-spacing-value:0.25rem}/*!@:host*/.sc-calcite-input-message-h{box-sizing:border-box;display:flex;block-size:auto;inline-size:100%;align-items:center;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1);opacity:1;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@:host([scale=m]),\n:host([scale=l])*/[scale=m].sc-calcite-input-message-h,[scale=l].sc-calcite-input-message-h{margin-block-start:var(--calcite-input-message-spacing-value)}/*!@.calcite-input-message-icon*/.calcite-input-message-icon.sc-calcite-input-message{pointer-events:none;display:inline-flex;flex-shrink:0;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;margin-inline-end:0.5rem}/*!@:host([status=invalid]) .calcite-input-message-icon*/[status=invalid].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-color-status-danger)}/*!@:host([status=warning]) .calcite-input-message-icon*/[status=warning].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-color-status-warning)}/*!@:host([status=valid]) .calcite-input-message-icon*/[status=valid].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-color-status-success)}/*!@:host([status=idle]) .calcite-input-message-icon*/[status=idle].sc-calcite-input-message-h .calcite-input-message-icon.sc-calcite-input-message{color:var(--calcite-color-brand)}/*!@:host([status])*/[status].sc-calcite-input-message-h{color:var(--calcite-color-text-1)}/*!@:host([status][scale=s])*/[status][scale=s].sc-calcite-input-message-h{font-size:var(--calcite-font-size--3);line-height:0.75rem}/*!@:host([status][scale=m])*/[status][scale=m].sc-calcite-input-message-h{margin-block-start:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([status][scale=l])*/[status][scale=l].sc-calcite-input-message-h{margin-block-start:0.25rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([hidden])*/[hidden].sc-calcite-input-message-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-message{display:none}";
 
 /**
  * @slot - A slot for adding text.
@@ -26330,7 +26369,7 @@ const SLOTS$k = {
     action: "action",
 };
 
-const inputNumberCss = "/*!@:host([disabled])*/[disabled].sc-calcite-input-number-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-number-h *.sc-calcite-input-number,.sc-calcite-input-number-h[disabled].sc-calcite-input-number-s>*,.sc-calcite-input-number-h[disabled] .sc-calcite-input-number-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-number-h{display:block}/*!@:host([scale=s]) input, :host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-number-h input.sc-calcite-input-number,[scale=s].sc-calcite-input-number-h .prefix.sc-calcite-input-number,[scale=s].sc-calcite-input-number-h .suffix.sc-calcite-input-number{block-size:1.5rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) .number-button-wrapper, :host([scale=s]) .action-wrapper calcite-button, :host([scale=s]) .action-wrapper calcite-button button*/[scale=s].sc-calcite-input-number-h .number-button-wrapper.sc-calcite-input-number,[scale=s].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number,[scale=s].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number button.sc-calcite-input-number{block-size:1.5rem}/*!@:host([scale=s]) .clear-button*/[scale=s].sc-calcite-input-number-h .clear-button.sc-calcite-input-number{min-block-size:1.5rem;min-inline-size:1.5rem}/*!@:host([scale=m]) input, :host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-number-h input.sc-calcite-input-number,[scale=m].sc-calcite-input-number-h .prefix.sc-calcite-input-number,[scale=m].sc-calcite-input-number-h .suffix.sc-calcite-input-number{block-size:2rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) .number-button-wrapper, :host([scale=m]) .action-wrapper calcite-button, :host([scale=m]) .action-wrapper calcite-button button*/[scale=m].sc-calcite-input-number-h .number-button-wrapper.sc-calcite-input-number,[scale=m].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number,[scale=m].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number button.sc-calcite-input-number{block-size:2rem}/*!@:host([scale=m]) .clear-button*/[scale=m].sc-calcite-input-number-h .clear-button.sc-calcite-input-number{min-block-size:2rem;min-inline-size:2rem}/*!@:host([scale=l]) input, :host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-number-h input.sc-calcite-input-number,[scale=l].sc-calcite-input-number-h .prefix.sc-calcite-input-number,[scale=l].sc-calcite-input-number-h .suffix.sc-calcite-input-number{block-size:2.75rem;padding-inline:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) .number-button-wrapper, :host([scale=l]) .action-wrapper calcite-button, :host([scale=l]) .action-wrapper calcite-button button*/[scale=l].sc-calcite-input-number-h .number-button-wrapper.sc-calcite-input-number,[scale=l].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number,[scale=l].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number button.sc-calcite-input-number{block-size:2.75rem}/*!@:host([scale=l]) .clear-button*/[scale=l].sc-calcite-input-number-h .clear-button.sc-calcite-input-number{min-block-size:2.75rem;min-inline-size:2.75rem}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-number-h[disabled] .sc-calcite-input-number-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-number-h [calcite-hydrated][disabled].sc-calcite-input-number{opacity:1}/*!@input*/input.sc-calcite-input-number{transition:var(--calcite-animation-timing), block-size 0, outline-offset 0s;-webkit-appearance:none;position:relative;margin:0px;box-sizing:border-box;display:flex;max-block-size:100%;inline-size:100%;max-inline-size:100%;flex:1 1 0%;text-overflow:ellipsis;border-radius:0px;background-color:var(--calcite-color-foreground-1);font-family:inherit;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-1)}/*!@input:placeholder-shown*/input.sc-calcite-input-number:placeholder-shown{text-overflow:ellipsis}/*!@input*/input.sc-calcite-input-number{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);color:var(--calcite-color-text-1)}/*!@input::placeholder, input:-ms-input-placeholder, input::-ms-input-placeholder*/input.sc-calcite-input-number::placeholder,input.sc-calcite-input-number:-ms-input-placeholder,input.sc-calcite-input-number::-ms-input-placeholder{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-3)}/*!@input:focus*/input.sc-calcite-input-number:focus{border-color:var(--calcite-color-brand);color:var(--calcite-color-text-1)}/*!@input[readonly]*/input[readonly].sc-calcite-input-number{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}/*!@input[readonly]:focus*/input[readonly].sc-calcite-input-number:focus{color:var(--calcite-color-text-1)}/*!@calcite-icon*/calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-3)}/*!@input*/input.sc-calcite-input-number{outline-color:transparent}/*!@input:focus*/input.sc-calcite-input-number:focus{outline:2px solid 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          )}/*!@:host([status=invalid]) input*/[status=invalid].sc-calcite-input-number-h input.sc-calcite-input-number{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) input:focus*/[status=invalid].sc-calcite-input-number-h input.sc-calcite-input-number:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@:host([scale=s]) .icon*/[scale=s].sc-calcite-input-number-h .icon.sc-calcite-input-number{inset-inline-start:0.5rem}/*!@:host([scale=m]) .icon*/[scale=m].sc-calcite-input-number-h .icon.sc-calcite-input-number{inset-inline-start:0.75rem}/*!@:host([scale=l]) .icon*/[scale=l].sc-calcite-input-number-h .icon.sc-calcite-input-number{inset-inline-start:1rem}/*!@:host([icon][scale=s]) input*/[icon][scale=s].sc-calcite-input-number-h input.sc-calcite-input-number{padding-inline-start:2rem}/*!@:host([icon][scale=m]) input*/[icon][scale=m].sc-calcite-input-number-h input.sc-calcite-input-number{padding-inline-start:2.5rem}/*!@:host([icon][scale=l]) input*/[icon][scale=l].sc-calcite-input-number-h input.sc-calcite-input-number{padding-inline-start:3.5rem}/*!@.element-wrapper*/.element-wrapper.sc-calcite-input-number{position:relative;order:3;display:inline-flex;flex:1 1 0%;align-items:center}/*!@.icon*/.icon.sc-calcite-input-number{pointer-events:none;position:absolute;z-index:var(--calcite-z-index);display:block;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button*/.clear-button.sc-calcite-input-number{pointer-events:initial;order:4;margin:0px;box-sizing:border-box;display:flex;min-block-size:100%;cursor:pointer;align-items:center;justify-content:center;align-self:stretch;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);outline-color:transparent;border-inline-start-width:0px}/*!@.clear-button:hover*/.clear-button.sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:hover calcite-icon*/.clear-button.sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:active*/.clear-button.sc-calcite-input-number:active{background-color:var(--calcite-color-foreground-3)}/*!@.clear-button:active calcite-icon*/.clear-button.sc-calcite-input-number:active calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@.clear-button:focus*/.clear-button.sc-calcite-input-number:focus{outline:2px solid 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          )}/*!@.clear-button:disabled*/.clear-button.sc-calcite-input-number:disabled{opacity:var(--calcite-opacity-disabled)}/*!@.loader*/.loader.sc-calcite-input-number{inset-block-start:1px;inset-inline:1px;pointer-events:none;position:absolute;display:block}/*!@.action-wrapper*/.action-wrapper.sc-calcite-input-number{order:7;display:flex}/*!@.prefix,\n.suffix*/.prefix.sc-calcite-input-number,.suffix.sc-calcite-input-number{box-sizing:border-box;display:flex;block-size:auto;min-block-size:100%;-webkit-user-select:none;user-select:none;align-content:center;align-items:center;overflow-wrap:break-word;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);line-height:1;color:var(--calcite-color-text-2)}/*!@.prefix*/.prefix.sc-calcite-input-number{order:2;border-inline-end-width:0px}/*!@.suffix*/.suffix.sc-calcite-input-number{order:5;border-inline-start-width:0px}/*!@:host([alignment=start]) input*/[alignment=start].sc-calcite-input-number-h input.sc-calcite-input-number{text-align:start}/*!@:host([alignment=end]) input*/[alignment=end].sc-calcite-input-number-h input.sc-calcite-input-number{text-align:end}/*!@.number-button-wrapper*/.number-button-wrapper.sc-calcite-input-number{pointer-events:none;order:6;box-sizing:border-box;display:flex;flex-direction:column;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@:host([number-button-type=vertical]) .wrapper*/[number-button-type=vertical].sc-calcite-input-number-h .wrapper.sc-calcite-input-number{flex-direction:row;display:flex}/*!@:host([number-button-type=vertical]) input*/[number-button-type=vertical].sc-calcite-input-number-h input.sc-calcite-input-number{order:2}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=down] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-number-h .calcite--rtl.sc-calcite-input-number .number-button-item[data-adjustment=down].sc-calcite-input-number calcite-icon.sc-calcite-input-number{transform:rotate(-90deg)}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=up] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-number-h .calcite--rtl.sc-calcite-input-number .number-button-item[data-adjustment=up].sc-calcite-input-number calcite-icon.sc-calcite-input-number{transform:rotate(-90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down], .number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number{order:1;max-block-size:100%;min-block-size:100%;align-self:stretch}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down] calcite-icon, .number-button-item.number-button-item--horizontal[data-adjustment=up] calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number calcite-icon.sc-calcite-input-number,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number calcite-icon.sc-calcite-input-number{transform:rotate(90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);border-inline-end-width:0px}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number{order:5}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=down].sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=down].sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=up].sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=up].sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=down].sc-calcite-input-number{border-block-start-width:0px}/*!@.number-button-item*/.number-button-item.sc-calcite-input-number{max-block-size:50%;min-block-size:50%;pointer-events:initial;margin:0px;box-sizing:border-box;display:flex;cursor:pointer;align-items:center;align-self:center;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);padding-block:0px;padding-inline:0.5rem;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-inline-start-width:0px}/*!@.number-button-item calcite-icon*/.number-button-item.sc-calcite-input-number calcite-icon.sc-calcite-input-number{pointer-events:none;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.number-button-item:focus*/.number-button-item.sc-calcite-input-number:focus{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item:focus calcite-icon*/.number-button-item.sc-calcite-input-number:focus calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@.number-button-item:active*/.number-button-item.sc-calcite-input-number:active{background-color:var(--calcite-color-foreground-3)}/*!@.number-button-item:disabled*/.number-button-item.sc-calcite-input-number:disabled{pointer-events:none}/*!@.wrapper*/.wrapper.sc-calcite-input-number{position:relative;display:flex;flex-direction:row;align-items:center}/*!@:host(.no-bottom-border) input*/.no-bottom-border.sc-calcite-input-number-h input.sc-calcite-input-number{border-block-end-width:0px}/*!@:host(.border-top-color-one) input*/.border-top-color-one.sc-calcite-input-number-h input.sc-calcite-input-number{border-block-start-color:var(--calcite-color-border-1)}/*!@input.inline-child*/input.inline-child.sc-calcite-input-number{background-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@input.inline-child .editing-enabled*/input.inline-child.sc-calcite-input-number .editing-enabled.sc-calcite-input-number{background-color:inherit}/*!@input.inline-child:not(.editing-enabled)*/input.inline-child.sc-calcite-input-number:not(.editing-enabled){display:flex;cursor:pointer;text-overflow:ellipsis;border-color:transparent;padding-inline-start:0}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-number-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-input-number-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-number{display:none}";
+const inputNumberCss = "/*!@:host([disabled])*/[disabled].sc-calcite-input-number-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-number-h *.sc-calcite-input-number,.sc-calcite-input-number-h[disabled].sc-calcite-input-number-s>*,.sc-calcite-input-number-h[disabled] .sc-calcite-input-number-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-number-h{display:block}/*!@:host([scale=s]) input, :host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-number-h input.sc-calcite-input-number,[scale=s].sc-calcite-input-number-h .prefix.sc-calcite-input-number,[scale=s].sc-calcite-input-number-h .suffix.sc-calcite-input-number{block-size:1.5rem;padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) .number-button-wrapper, :host([scale=s]) .action-wrapper calcite-button, :host([scale=s]) .action-wrapper calcite-button button*/[scale=s].sc-calcite-input-number-h .number-button-wrapper.sc-calcite-input-number,[scale=s].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number,[scale=s].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number button.sc-calcite-input-number{block-size:1.5rem}/*!@:host([scale=s]) .clear-button*/[scale=s].sc-calcite-input-number-h .clear-button.sc-calcite-input-number{min-block-size:1.5rem;min-inline-size:1.5rem}/*!@:host([scale=m]) input, :host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-number-h input.sc-calcite-input-number,[scale=m].sc-calcite-input-number-h .prefix.sc-calcite-input-number,[scale=m].sc-calcite-input-number-h .suffix.sc-calcite-input-number{block-size:2rem;padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) .number-button-wrapper, :host([scale=m]) .action-wrapper calcite-button, :host([scale=m]) .action-wrapper calcite-button button*/[scale=m].sc-calcite-input-number-h .number-button-wrapper.sc-calcite-input-number,[scale=m].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number,[scale=m].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number button.sc-calcite-input-number{block-size:2rem}/*!@:host([scale=m]) .clear-button*/[scale=m].sc-calcite-input-number-h .clear-button.sc-calcite-input-number{min-block-size:2rem;min-inline-size:2rem}/*!@:host([scale=l]) input, :host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-number-h input.sc-calcite-input-number,[scale=l].sc-calcite-input-number-h .prefix.sc-calcite-input-number,[scale=l].sc-calcite-input-number-h .suffix.sc-calcite-input-number{block-size:2.75rem;padding-inline:1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) .number-button-wrapper, :host([scale=l]) .action-wrapper calcite-button, :host([scale=l]) .action-wrapper calcite-button button*/[scale=l].sc-calcite-input-number-h .number-button-wrapper.sc-calcite-input-number,[scale=l].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number,[scale=l].sc-calcite-input-number-h .action-wrapper.sc-calcite-input-number calcite-button.sc-calcite-input-number button.sc-calcite-input-number{block-size:2.75rem}/*!@:host([scale=l]) .clear-button*/[scale=l].sc-calcite-input-number-h .clear-button.sc-calcite-input-number{min-block-size:2.75rem;min-inline-size:2.75rem}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-number-h[disabled] .sc-calcite-input-number-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-number-h [calcite-hydrated][disabled].sc-calcite-input-number{opacity:1}/*!@input*/input.sc-calcite-input-number{transition:var(--calcite-animation-timing), block-size 0, outline-offset 0s;-webkit-appearance:none;position:relative;margin:0px;box-sizing:border-box;display:flex;max-block-size:100%;inline-size:100%;max-inline-size:100%;flex:1 1 0%;text-overflow:ellipsis;border-radius:0px;background-color:var(--calcite-color-foreground-1);font-family:inherit;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-1)}/*!@input:placeholder-shown*/input.sc-calcite-input-number:placeholder-shown{text-overflow:ellipsis}/*!@input*/input.sc-calcite-input-number{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);color:var(--calcite-color-text-1)}/*!@input::placeholder, input:-ms-input-placeholder, input::-ms-input-placeholder*/input.sc-calcite-input-number::placeholder,input.sc-calcite-input-number:-ms-input-placeholder,input.sc-calcite-input-number::-ms-input-placeholder{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-3)}/*!@input:focus*/input.sc-calcite-input-number:focus{border-color:var(--calcite-color-brand);color:var(--calcite-color-text-1)}/*!@input[readonly]*/input[readonly].sc-calcite-input-number{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}/*!@input[readonly]:focus*/input[readonly].sc-calcite-input-number:focus{color:var(--calcite-color-text-1)}/*!@calcite-icon*/calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-3)}/*!@input*/input.sc-calcite-input-number{outline-color:transparent}/*!@input:focus*/input.sc-calcite-input-number:focus{outline:2px solid 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          )}/*!@:host([status=invalid]) input*/[status=invalid].sc-calcite-input-number-h input.sc-calcite-input-number{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) input:focus*/[status=invalid].sc-calcite-input-number-h input.sc-calcite-input-number:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@:host([scale=s]) .icon*/[scale=s].sc-calcite-input-number-h .icon.sc-calcite-input-number{inset-inline-start:0.5rem}/*!@:host([scale=m]) .icon*/[scale=m].sc-calcite-input-number-h .icon.sc-calcite-input-number{inset-inline-start:0.75rem}/*!@:host([scale=l]) .icon*/[scale=l].sc-calcite-input-number-h .icon.sc-calcite-input-number{inset-inline-start:1rem}/*!@:host([icon][scale=s]) input*/[icon][scale=s].sc-calcite-input-number-h input.sc-calcite-input-number{padding-inline-start:2rem}/*!@:host([icon][scale=m]) input*/[icon][scale=m].sc-calcite-input-number-h input.sc-calcite-input-number{padding-inline-start:2.5rem}/*!@:host([icon][scale=l]) input*/[icon][scale=l].sc-calcite-input-number-h input.sc-calcite-input-number{padding-inline-start:3.5rem}/*!@.element-wrapper*/.element-wrapper.sc-calcite-input-number{position:relative;order:3;display:inline-flex;flex:1 1 0%;align-items:center}/*!@.icon*/.icon.sc-calcite-input-number{pointer-events:none;position:absolute;z-index:var(--calcite-z-index);display:block;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button*/.clear-button.sc-calcite-input-number{pointer-events:initial;order:4;margin:0px;box-sizing:border-box;display:flex;min-block-size:100%;cursor:pointer;align-items:center;justify-content:center;align-self:stretch;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);outline-color:transparent;border-inline-start-width:0px}/*!@.clear-button:hover*/.clear-button.sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:hover calcite-icon*/.clear-button.sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:active*/.clear-button.sc-calcite-input-number:active{background-color:var(--calcite-color-foreground-3)}/*!@.clear-button:active calcite-icon*/.clear-button.sc-calcite-input-number:active calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@.clear-button:focus*/.clear-button.sc-calcite-input-number:focus{outline:2px solid 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          )}/*!@.clear-button:disabled*/.clear-button.sc-calcite-input-number:disabled{opacity:var(--calcite-opacity-disabled)}/*!@.loader*/.loader.sc-calcite-input-number{inset-block-start:1px;inset-inline:1px;pointer-events:none;position:absolute;display:block}/*!@.action-wrapper*/.action-wrapper.sc-calcite-input-number{order:7;display:flex}/*!@.prefix,\n.suffix*/.prefix.sc-calcite-input-number,.suffix.sc-calcite-input-number{box-sizing:border-box;display:flex;block-size:auto;min-block-size:100%;-webkit-user-select:none;user-select:none;align-content:center;align-items:center;overflow-wrap:break-word;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);line-height:1;color:var(--calcite-color-text-2)}/*!@.prefix*/.prefix.sc-calcite-input-number{order:2;border-inline-end-width:0px}/*!@.suffix*/.suffix.sc-calcite-input-number{order:5;border-inline-start-width:0px}/*!@:host([alignment=start]) input*/[alignment=start].sc-calcite-input-number-h input.sc-calcite-input-number{text-align:start}/*!@:host([alignment=end]) input*/[alignment=end].sc-calcite-input-number-h input.sc-calcite-input-number{text-align:end}/*!@.number-button-wrapper*/.number-button-wrapper.sc-calcite-input-number{pointer-events:none;order:6;box-sizing:border-box;display:flex;flex-direction:column;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@:host([number-button-type=vertical]) .wrapper*/[number-button-type=vertical].sc-calcite-input-number-h .wrapper.sc-calcite-input-number{flex-direction:row;display:flex}/*!@:host([number-button-type=vertical]) input*/[number-button-type=vertical].sc-calcite-input-number-h input.sc-calcite-input-number{order:2}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=down] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-number-h .calcite--rtl.sc-calcite-input-number .number-button-item[data-adjustment=down].sc-calcite-input-number calcite-icon.sc-calcite-input-number{transform:rotate(-90deg)}/*!@:host([number-button-type=horizontal]) .calcite--rtl .number-button-item[data-adjustment=up] calcite-icon*/[number-button-type=horizontal].sc-calcite-input-number-h .calcite--rtl.sc-calcite-input-number .number-button-item[data-adjustment=up].sc-calcite-input-number calcite-icon.sc-calcite-input-number{transform:rotate(-90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down], .number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number{order:1;max-block-size:100%;min-block-size:100%;align-self:stretch}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down] calcite-icon, .number-button-item.number-button-item--horizontal[data-adjustment=up] calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number calcite-icon.sc-calcite-input-number,.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number calcite-icon.sc-calcite-input-number{transform:rotate(90deg)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);border-inline-end-width:0px}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=down]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=down].sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number{order:5}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item.number-button-item--horizontal[data-adjustment=up]:hover calcite-icon*/.number-button-item.number-button-item--horizontal[data-adjustment=up].sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=down].sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=down].sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=up].sc-calcite-input-number:hover{background-color:var(--calcite-color-foreground-2)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=up]:hover calcite-icon*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=up].sc-calcite-input-number:hover calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@:host([number-button-type=vertical]) .number-button-item[data-adjustment=down]*/[number-button-type=vertical].sc-calcite-input-number-h .number-button-item[data-adjustment=down].sc-calcite-input-number{border-block-start-width:0px}/*!@.number-button-item*/.number-button-item.sc-calcite-input-number{max-block-size:50%;min-block-size:50%;pointer-events:initial;margin:0px;box-sizing:border-box;display:flex;cursor:pointer;align-items:center;align-self:center;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);padding-block:0px;padding-inline:0.5rem;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-inline-start-width:0px}/*!@.number-button-item calcite-icon*/.number-button-item.sc-calcite-input-number calcite-icon.sc-calcite-input-number{pointer-events:none;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.number-button-item:focus*/.number-button-item.sc-calcite-input-number:focus{background-color:var(--calcite-color-foreground-2)}/*!@.number-button-item:focus calcite-icon*/.number-button-item.sc-calcite-input-number:focus calcite-icon.sc-calcite-input-number{color:var(--calcite-color-text-1)}/*!@.number-button-item:active*/.number-button-item.sc-calcite-input-number:active{background-color:var(--calcite-color-foreground-3)}/*!@.number-button-item:disabled*/.number-button-item.sc-calcite-input-number:disabled{pointer-events:none}/*!@.wrapper*/.wrapper.sc-calcite-input-number{position:relative;display:flex;flex-direction:row;align-items:center}/*!@:host(.no-bottom-border) input*/.no-bottom-border.sc-calcite-input-number-h input.sc-calcite-input-number{border-block-end-width:0px}/*!@:host(.border-top-color-one) input*/.border-top-color-one.sc-calcite-input-number-h input.sc-calcite-input-number{border-block-start-color:var(--calcite-color-border-1)}/*!@input.inline-child*/input.inline-child.sc-calcite-input-number{background-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@input.inline-child .editing-enabled*/input.inline-child.sc-calcite-input-number .editing-enabled.sc-calcite-input-number{background-color:inherit}/*!@input.inline-child:not(.editing-enabled)*/input.inline-child.sc-calcite-input-number:not(.editing-enabled){display:flex;cursor:pointer;text-overflow:ellipsis;border-color:transparent;padding-inline-start:0}/*!@.validation-container*/.validation-container.sc-calcite-input-number{padding-block-start:0.5rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-number-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-input-number-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-number{display:none}";
 
 /**
  * @slot action - A slot for positioning a button next to the component.
@@ -26622,6 +26661,8 @@ class InputNumber {
         this.min = undefined;
         this.maxLength = undefined;
         this.minLength = undefined;
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.numberButtonType = "vertical";
         this.placeholder = undefined;
@@ -26851,7 +26892,7 @@ class InputNumber {
             ? numberButtonsHorizontalDown
             : null, this.prefixText ? prefixText : null, hAsync("div", { class: CSS$K.wrapper }, childEl, this.isClearable ? inputClearButton : null, this.requestedIcon ? iconEl : null, this.loading ? loader : null), hAsync("div", { class: CSS$K.actionWrapper }, hAsync("slot", { name: SLOTS$k.action })), this.numberButtonType === "vertical" && !this.readOnly ? numberButtonsVertical : null, this.suffixText ? suffixText : null, this.numberButtonType === "horizontal" && !this.readOnly
             ? numberButtonsHorizontalUp
-            : null, hAsync(HiddenFormInputSlot, { component: this }))));
+            : null, hAsync(HiddenFormInputSlot, { component: this })), this.validationMessage ? (hAsync(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -26887,6 +26928,8 @@ class InputNumber {
             "min": [514],
             "maxLength": [514, "max-length"],
             "minLength": [514, "min-length"],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [513],
             "numberButtonType": [513, "number-button-type"],
             "placeholder": [1],
@@ -26934,7 +26977,7 @@ const SLOTS$j = {
     action: "action",
 };
 
-const inputTextCss = "/*!@:host([disabled])*/[disabled].sc-calcite-input-text-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-text-h *.sc-calcite-input-text,.sc-calcite-input-text-h[disabled].sc-calcite-input-text-s>*,.sc-calcite-input-text-h[disabled] .sc-calcite-input-text-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-text-h{display:block}/*!@:host([scale=s]) input*/[scale=s].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:0.5rem;padding-inline-end:var(--calcite-internal-input-text-input-padding-inline-end, 0.5rem)}/*!@:host([scale=s]) input, :host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-text-h input.sc-calcite-input-text,[scale=s].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=s].sc-calcite-input-text-h .suffix.sc-calcite-input-text{block-size:1.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=s].sc-calcite-input-text-h .suffix.sc-calcite-input-text{padding-inline:0.5rem}/*!@:host([scale=s]) .action-wrapper calcite-button, :host([scale=s]) .action-wrapper calcite-button button*/[scale=s].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text,[scale=s].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text button.sc-calcite-input-text{block-size:1.5rem}/*!@:host([scale=s]) .clear-button*/[scale=s].sc-calcite-input-text-h .clear-button.sc-calcite-input-text{min-block-size:1.5rem;min-inline-size:1.5rem}/*!@:host([scale=m]) input*/[scale=m].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:0.75rem;padding-inline-end:var(--calcite-internal-input-text-input-padding-inline-end, 0.75rem)}/*!@:host([scale=m]) input, :host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-text-h input.sc-calcite-input-text,[scale=m].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=m].sc-calcite-input-text-h .suffix.sc-calcite-input-text{block-size:2rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=m].sc-calcite-input-text-h .suffix.sc-calcite-input-text{padding-inline:0.75rem}/*!@:host([scale=m]) .action-wrapper calcite-button, :host([scale=m]) .action-wrapper calcite-button button*/[scale=m].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text,[scale=m].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text button.sc-calcite-input-text{block-size:2rem}/*!@:host([scale=m]) .clear-button*/[scale=m].sc-calcite-input-text-h .clear-button.sc-calcite-input-text{min-block-size:2rem;min-inline-size:2rem}/*!@:host([scale=l]) input*/[scale=l].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:1rem;padding-inline-end:var(--calcite-internal-input-text-input-padding-inline-end, 1rem)}/*!@:host([scale=l]) input, :host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-text-h input.sc-calcite-input-text,[scale=l].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=l].sc-calcite-input-text-h .suffix.sc-calcite-input-text{block-size:2.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=l].sc-calcite-input-text-h .suffix.sc-calcite-input-text{padding-inline:1rem}/*!@:host([scale=l]) .action-wrapper calcite-button, :host([scale=l]) .action-wrapper calcite-button button*/[scale=l].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text,[scale=l].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text button.sc-calcite-input-text{block-size:2.75rem}/*!@:host([scale=l]) .clear-button*/[scale=l].sc-calcite-input-text-h .clear-button.sc-calcite-input-text{min-block-size:2.75rem;min-inline-size:2.75rem}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-text-h[disabled] .sc-calcite-input-text-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-text-h [calcite-hydrated][disabled].sc-calcite-input-text{opacity:1}/*!@input*/input.sc-calcite-input-text{transition:var(--calcite-animation-timing), block-size 0, outline-offset 0s;-webkit-appearance:none;position:relative;margin:0px;box-sizing:border-box;display:flex;max-block-size:100%;inline-size:100%;max-inline-size:100%;flex:1 1 0%;text-overflow:ellipsis;border-radius:0px;background-color:var(--calcite-color-foreground-1);font-family:inherit;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-1)}/*!@input:placeholder-shown*/input.sc-calcite-input-text:placeholder-shown{text-overflow:ellipsis}/*!@input*/input.sc-calcite-input-text{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);color:var(--calcite-color-text-1)}/*!@input::placeholder, input:-ms-input-placeholder, input::-ms-input-placeholder*/input.sc-calcite-input-text::placeholder,input.sc-calcite-input-text:-ms-input-placeholder,input.sc-calcite-input-text::-ms-input-placeholder{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-3)}/*!@input:focus*/input.sc-calcite-input-text:focus{border-color:var(--calcite-color-brand);color:var(--calcite-color-text-1)}/*!@input[readonly]*/input[readonly].sc-calcite-input-text{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}/*!@input[readonly]:focus*/input[readonly].sc-calcite-input-text:focus{color:var(--calcite-color-text-1)}/*!@calcite-icon*/calcite-icon.sc-calcite-input-text{color:var(--calcite-color-text-3)}/*!@input*/input.sc-calcite-input-text{outline-color:transparent}/*!@input:focus*/input.sc-calcite-input-text:focus{outline:2px solid 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          )}/*!@:host([status=invalid]) input*/[status=invalid].sc-calcite-input-text-h input.sc-calcite-input-text{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) input:focus*/[status=invalid].sc-calcite-input-text-h input.sc-calcite-input-text:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@:host([scale=s]) .icon*/[scale=s].sc-calcite-input-text-h .icon.sc-calcite-input-text{inset-inline-start:0.5rem}/*!@:host([scale=m]) .icon*/[scale=m].sc-calcite-input-text-h .icon.sc-calcite-input-text{inset-inline-start:0.75rem}/*!@:host([scale=l]) .icon*/[scale=l].sc-calcite-input-text-h .icon.sc-calcite-input-text{inset-inline-start:1rem}/*!@:host([icon][scale=s]) input*/[icon][scale=s].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:2rem}/*!@:host([icon][scale=m]) input*/[icon][scale=m].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:2.5rem}/*!@:host([icon][scale=l]) input*/[icon][scale=l].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:3.5rem}/*!@.element-wrapper*/.element-wrapper.sc-calcite-input-text{position:relative;order:3;display:inline-flex;flex:1 1 0%;align-items:center}/*!@.icon*/.icon.sc-calcite-input-text{pointer-events:none;position:absolute;z-index:var(--calcite-z-index);display:block;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@input[type=text]::-ms-clear,\ninput[type=text]::-ms-reveal*/input[type=text].sc-calcite-input-text::-ms-clear,input[type=text].sc-calcite-input-text::-ms-reveal{display:none;block-size:0px;inline-size:0px}/*!@.clear-button*/.clear-button.sc-calcite-input-text{pointer-events:initial;order:4;margin:0px;box-sizing:border-box;display:flex;min-block-size:100%;cursor:pointer;align-items:center;justify-content:center;align-self:stretch;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);outline-color:transparent;border-inline-start-width:0px}/*!@.clear-button:hover*/.clear-button.sc-calcite-input-text:hover{background-color:var(--calcite-color-foreground-2);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:hover calcite-icon*/.clear-button.sc-calcite-input-text:hover calcite-icon.sc-calcite-input-text{color:var(--calcite-color-text-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:active*/.clear-button.sc-calcite-input-text:active{background-color:var(--calcite-color-foreground-3)}/*!@.clear-button:active calcite-icon*/.clear-button.sc-calcite-input-text:active calcite-icon.sc-calcite-input-text{color:var(--calcite-color-text-1)}/*!@.clear-button:focus*/.clear-button.sc-calcite-input-text:focus{outline:2px solid 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          )}/*!@.clear-button:disabled*/.clear-button.sc-calcite-input-text:disabled{opacity:var(--calcite-opacity-disabled)}/*!@.loader*/.loader.sc-calcite-input-text{inset-block-start:1px;inset-inline:1px;pointer-events:none;position:absolute;display:block}/*!@.action-wrapper*/.action-wrapper.sc-calcite-input-text{order:7;display:flex}/*!@.prefix,\n.suffix*/.prefix.sc-calcite-input-text,.suffix.sc-calcite-input-text{box-sizing:border-box;display:flex;block-size:auto;min-block-size:100%;-webkit-user-select:none;user-select:none;align-content:center;align-items:center;overflow-wrap:break-word;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);line-height:1;color:var(--calcite-color-text-2)}/*!@.prefix*/.prefix.sc-calcite-input-text{order:2;border-inline-end-width:0px}/*!@.suffix*/.suffix.sc-calcite-input-text{order:5;border-inline-start-width:0px}/*!@:host([alignment=start]) input*/[alignment=start].sc-calcite-input-text-h input.sc-calcite-input-text{text-align:start}/*!@:host([alignment=end]) input*/[alignment=end].sc-calcite-input-text-h input.sc-calcite-input-text{text-align:end}/*!@.wrapper*/.wrapper.sc-calcite-input-text{position:relative;display:flex;flex-direction:row;align-items:center}/*!@:host(.no-bottom-border) input*/.no-bottom-border.sc-calcite-input-text-h input.sc-calcite-input-text{border-block-end-width:0px}/*!@:host(.border-top-color-one) input*/.border-top-color-one.sc-calcite-input-text-h input.sc-calcite-input-text{border-block-start-color:var(--calcite-color-border-1)}/*!@input.inline-child*/input.inline-child.sc-calcite-input-text{background-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@input.inline-child .editing-enabled*/input.inline-child.sc-calcite-input-text .editing-enabled.sc-calcite-input-text{background-color:inherit}/*!@input.inline-child:not(.editing-enabled)*/input.inline-child.sc-calcite-input-text:not(.editing-enabled){display:flex;cursor:pointer;text-overflow:ellipsis;border-color:transparent;padding-inline-start:0}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-text-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-input-text-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-text{display:none}";
+const inputTextCss = "/*!@:host([disabled])*/[disabled].sc-calcite-input-text-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-text-h *.sc-calcite-input-text,.sc-calcite-input-text-h[disabled].sc-calcite-input-text-s>*,.sc-calcite-input-text-h[disabled] .sc-calcite-input-text-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-text-h{display:block}/*!@:host([scale=s]) input*/[scale=s].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:0.5rem;padding-inline-end:var(--calcite-internal-input-text-input-padding-inline-end, 0.5rem)}/*!@:host([scale=s]) input, :host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-text-h input.sc-calcite-input-text,[scale=s].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=s].sc-calcite-input-text-h .suffix.sc-calcite-input-text{block-size:1.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}/*!@:host([scale=s]) .prefix, :host([scale=s]) .suffix*/[scale=s].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=s].sc-calcite-input-text-h .suffix.sc-calcite-input-text{padding-inline:0.5rem}/*!@:host([scale=s]) .action-wrapper calcite-button, :host([scale=s]) .action-wrapper calcite-button button*/[scale=s].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text,[scale=s].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text button.sc-calcite-input-text{block-size:1.5rem}/*!@:host([scale=s]) .clear-button*/[scale=s].sc-calcite-input-text-h .clear-button.sc-calcite-input-text{min-block-size:1.5rem;min-inline-size:1.5rem}/*!@:host([scale=m]) input*/[scale=m].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:0.75rem;padding-inline-end:var(--calcite-internal-input-text-input-padding-inline-end, 0.75rem)}/*!@:host([scale=m]) input, :host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-text-h input.sc-calcite-input-text,[scale=m].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=m].sc-calcite-input-text-h .suffix.sc-calcite-input-text{block-size:2rem;font-size:var(--calcite-font-size--1);line-height:1rem}/*!@:host([scale=m]) .prefix, :host([scale=m]) .suffix*/[scale=m].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=m].sc-calcite-input-text-h .suffix.sc-calcite-input-text{padding-inline:0.75rem}/*!@:host([scale=m]) .action-wrapper calcite-button, :host([scale=m]) .action-wrapper calcite-button button*/[scale=m].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text,[scale=m].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text button.sc-calcite-input-text{block-size:2rem}/*!@:host([scale=m]) .clear-button*/[scale=m].sc-calcite-input-text-h .clear-button.sc-calcite-input-text{min-block-size:2rem;min-inline-size:2rem}/*!@:host([scale=l]) input*/[scale=l].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:1rem;padding-inline-end:var(--calcite-internal-input-text-input-padding-inline-end, 1rem)}/*!@:host([scale=l]) input, :host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-text-h input.sc-calcite-input-text,[scale=l].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=l].sc-calcite-input-text-h .suffix.sc-calcite-input-text{block-size:2.75rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}/*!@:host([scale=l]) .prefix, :host([scale=l]) .suffix*/[scale=l].sc-calcite-input-text-h .prefix.sc-calcite-input-text,[scale=l].sc-calcite-input-text-h .suffix.sc-calcite-input-text{padding-inline:1rem}/*!@:host([scale=l]) .action-wrapper calcite-button, :host([scale=l]) .action-wrapper calcite-button button*/[scale=l].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text,[scale=l].sc-calcite-input-text-h .action-wrapper.sc-calcite-input-text calcite-button.sc-calcite-input-text button.sc-calcite-input-text{block-size:2.75rem}/*!@:host([scale=l]) .clear-button*/[scale=l].sc-calcite-input-text-h .clear-button.sc-calcite-input-text{min-block-size:2.75rem;min-inline-size:2.75rem}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-text-h[disabled] .sc-calcite-input-text-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-text-h [calcite-hydrated][disabled].sc-calcite-input-text{opacity:1}/*!@input*/input.sc-calcite-input-text{transition:var(--calcite-animation-timing), block-size 0, outline-offset 0s;-webkit-appearance:none;position:relative;margin:0px;box-sizing:border-box;display:flex;max-block-size:100%;inline-size:100%;max-inline-size:100%;flex:1 1 0%;text-overflow:ellipsis;border-radius:0px;background-color:var(--calcite-color-foreground-1);font-family:inherit;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-1)}/*!@input:placeholder-shown*/input.sc-calcite-input-text:placeholder-shown{text-overflow:ellipsis}/*!@input*/input.sc-calcite-input-text{border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);color:var(--calcite-color-text-1)}/*!@input::placeholder, input:-ms-input-placeholder, input::-ms-input-placeholder*/input.sc-calcite-input-text::placeholder,input.sc-calcite-input-text:-ms-input-placeholder,input.sc-calcite-input-text::-ms-input-placeholder{font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-3)}/*!@input:focus*/input.sc-calcite-input-text:focus{border-color:var(--calcite-color-brand);color:var(--calcite-color-text-1)}/*!@input[readonly]*/input[readonly].sc-calcite-input-text{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}/*!@input[readonly]:focus*/input[readonly].sc-calcite-input-text:focus{color:var(--calcite-color-text-1)}/*!@calcite-icon*/calcite-icon.sc-calcite-input-text{color:var(--calcite-color-text-3)}/*!@input*/input.sc-calcite-input-text{outline-color:transparent}/*!@input:focus*/input.sc-calcite-input-text:focus{outline:2px solid 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          )}/*!@:host([status=invalid]) input*/[status=invalid].sc-calcite-input-text-h input.sc-calcite-input-text{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) input:focus*/[status=invalid].sc-calcite-input-text-h input.sc-calcite-input-text:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@:host([scale=s]) .icon*/[scale=s].sc-calcite-input-text-h .icon.sc-calcite-input-text{inset-inline-start:0.5rem}/*!@:host([scale=m]) .icon*/[scale=m].sc-calcite-input-text-h .icon.sc-calcite-input-text{inset-inline-start:0.75rem}/*!@:host([scale=l]) .icon*/[scale=l].sc-calcite-input-text-h .icon.sc-calcite-input-text{inset-inline-start:1rem}/*!@:host([icon][scale=s]) input*/[icon][scale=s].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:2rem}/*!@:host([icon][scale=m]) input*/[icon][scale=m].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:2.5rem}/*!@:host([icon][scale=l]) input*/[icon][scale=l].sc-calcite-input-text-h input.sc-calcite-input-text{padding-inline-start:3.5rem}/*!@.element-wrapper*/.element-wrapper.sc-calcite-input-text{position:relative;order:3;display:inline-flex;flex:1 1 0%;align-items:center}/*!@.icon*/.icon.sc-calcite-input-text{pointer-events:none;position:absolute;z-index:var(--calcite-z-index);display:block;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@input[type=text]::-ms-clear,\ninput[type=text]::-ms-reveal*/input[type=text].sc-calcite-input-text::-ms-clear,input[type=text].sc-calcite-input-text::-ms-reveal{display:none;block-size:0px;inline-size:0px}/*!@.clear-button*/.clear-button.sc-calcite-input-text{pointer-events:initial;order:4;margin:0px;box-sizing:border-box;display:flex;min-block-size:100%;cursor:pointer;align-items:center;justify-content:center;align-self:stretch;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);outline-color:transparent;border-inline-start-width:0px}/*!@.clear-button:hover*/.clear-button.sc-calcite-input-text:hover{background-color:var(--calcite-color-foreground-2);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:hover calcite-icon*/.clear-button.sc-calcite-input-text:hover calcite-icon.sc-calcite-input-text{color:var(--calcite-color-text-1);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@.clear-button:active*/.clear-button.sc-calcite-input-text:active{background-color:var(--calcite-color-foreground-3)}/*!@.clear-button:active calcite-icon*/.clear-button.sc-calcite-input-text:active calcite-icon.sc-calcite-input-text{color:var(--calcite-color-text-1)}/*!@.clear-button:focus*/.clear-button.sc-calcite-input-text:focus{outline:2px solid 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          )}/*!@.clear-button:disabled*/.clear-button.sc-calcite-input-text:disabled{opacity:var(--calcite-opacity-disabled)}/*!@.loader*/.loader.sc-calcite-input-text{inset-block-start:1px;inset-inline:1px;pointer-events:none;position:absolute;display:block}/*!@.action-wrapper*/.action-wrapper.sc-calcite-input-text{order:7;display:flex}/*!@.prefix,\n.suffix*/.prefix.sc-calcite-input-text,.suffix.sc-calcite-input-text{box-sizing:border-box;display:flex;block-size:auto;min-block-size:100%;-webkit-user-select:none;user-select:none;align-content:center;align-items:center;overflow-wrap:break-word;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);line-height:1;color:var(--calcite-color-text-2)}/*!@.prefix*/.prefix.sc-calcite-input-text{order:2;border-inline-end-width:0px}/*!@.suffix*/.suffix.sc-calcite-input-text{order:5;border-inline-start-width:0px}/*!@:host([alignment=start]) input*/[alignment=start].sc-calcite-input-text-h input.sc-calcite-input-text{text-align:start}/*!@:host([alignment=end]) input*/[alignment=end].sc-calcite-input-text-h input.sc-calcite-input-text{text-align:end}/*!@.wrapper*/.wrapper.sc-calcite-input-text{position:relative;display:flex;flex-direction:row;align-items:center}/*!@:host(.no-bottom-border) input*/.no-bottom-border.sc-calcite-input-text-h input.sc-calcite-input-text{border-block-end-width:0px}/*!@:host(.border-top-color-one) input*/.border-top-color-one.sc-calcite-input-text-h input.sc-calcite-input-text{border-block-start-color:var(--calcite-color-border-1)}/*!@input.inline-child*/input.inline-child.sc-calcite-input-text{background-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}/*!@input.inline-child .editing-enabled*/input.inline-child.sc-calcite-input-text .editing-enabled.sc-calcite-input-text{background-color:inherit}/*!@input.inline-child:not(.editing-enabled)*/input.inline-child.sc-calcite-input-text:not(.editing-enabled){display:flex;cursor:pointer;text-overflow:ellipsis;border-color:transparent;padding-inline-start:0}/*!@.validation-container*/.validation-container.sc-calcite-input-text{padding-block-start:0.5rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-text-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-input-text-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-text{display:none}";
 
 /**
  * @slot action - A slot for positioning a button next to the component.
@@ -27077,6 +27120,8 @@ class InputText {
         this.loading = false;
         this.maxLength = undefined;
         this.minLength = undefined;
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.placeholder = undefined;
         this.prefixText = undefined;
@@ -27228,7 +27273,7 @@ class InputText {
             }, defaultValue: this.defaultValue, disabled: this.disabled ? true : null, enterKeyHint: this.enterKeyHint, inputMode: this.inputMode, maxLength: this.maxLength, minLength: this.minLength, name: this.name, onBlur: this.inputTextBlurHandler, onFocus: this.inputTextFocusHandler, onInput: this.inputTextInputHandler, onKeyDown: this.inputTextKeyDownHandler, pattern: this.pattern, placeholder: this.placeholder || "", readOnly: this.readOnly, required: this.required ? true : null, tabIndex: this.disabled || (this.inlineEditableEl && !this.editingEnabled) ? -1 : null, type: "text", value: this.value,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setChildElRef }));
-        return (hAsync(Host, { onClick: this.clickHandler, onKeyDown: this.keyDownHandler }, hAsync("div", { class: { [CSS$J.inputWrapper]: true, [CSS_UTILITY.rtl]: dir === "rtl" } }, this.prefixText ? prefixText : null, hAsync("div", { class: CSS$J.wrapper }, childEl, this.isClearable ? inputClearButton : null, this.requestedIcon ? iconEl : null, this.loading ? loader : null), hAsync("div", { class: CSS$J.actionWrapper }, hAsync("slot", { name: SLOTS$j.action })), this.suffixText ? suffixText : null, hAsync(HiddenFormInputSlot, { component: this }))));
+        return (hAsync(Host, { onClick: this.clickHandler, onKeyDown: this.keyDownHandler }, hAsync("div", { class: { [CSS$J.inputWrapper]: true, [CSS_UTILITY.rtl]: dir === "rtl" } }, this.prefixText ? prefixText : null, hAsync("div", { class: CSS$J.wrapper }, childEl, this.isClearable ? inputClearButton : null, this.requestedIcon ? iconEl : null, this.loading ? loader : null), hAsync("div", { class: CSS$J.actionWrapper }, hAsync("slot", { name: SLOTS$j.action })), this.suffixText ? suffixText : null, hAsync(HiddenFormInputSlot, { component: this })), this.validationMessage ? (hAsync(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return getElement(this); }
@@ -27256,6 +27301,8 @@ class InputText {
             "loading": [516],
             "maxLength": [514, "max-length"],
             "minLength": [514, "min-length"],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [513],
             "placeholder": [1],
             "prefixText": [1, "prefix-text"],
@@ -28711,7 +28758,7 @@ var updateLocale = (function (option, Dayjs, dayjs) {
   };
 });
 
-const inputTimePickerCss = "/*!@:host([disabled])*/[disabled].sc-calcite-input-time-picker-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-time-picker-h *.sc-calcite-input-time-picker,.sc-calcite-input-time-picker-h[disabled].sc-calcite-input-time-picker-s>*,.sc-calcite-input-time-picker-h[disabled] .sc-calcite-input-time-picker-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-time-picker-h{display:inline-block;-webkit-user-select:none;user-select:none}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-time-picker-h[disabled] .sc-calcite-input-time-picker-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-time-picker-h [calcite-hydrated][disabled].sc-calcite-input-time-picker{opacity:1}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-time-picker-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([scale=s])*/[scale=s].sc-calcite-input-time-picker-h{--calcite-toggle-spacing:0.5rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 1rem)}/*!@:host([scale=m])*/[scale=m].sc-calcite-input-time-picker-h{--calcite-toggle-spacing:0.75rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 1.5rem)}/*!@:host([scale=l])*/[scale=l].sc-calcite-input-time-picker-h{--calcite-toggle-spacing:1rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 2rem)}/*!@.input-wrapper*/.input-wrapper.sc-calcite-input-time-picker{position:relative}/*!@.toggle-icon*/.toggle-icon.sc-calcite-input-time-picker{position:absolute;display:flex;cursor:pointer;align-items:center;inset-inline-end:0;inset-block:0;padding-inline:var(--calcite-toggle-spacing)}/*!@:host([hidden])*/[hidden].sc-calcite-input-time-picker-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-time-picker{display:none}";
+const inputTimePickerCss = "/*!@:host([disabled])*/[disabled].sc-calcite-input-time-picker-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-input-time-picker-h *.sc-calcite-input-time-picker,.sc-calcite-input-time-picker-h[disabled].sc-calcite-input-time-picker-s>*,.sc-calcite-input-time-picker-h[disabled] .sc-calcite-input-time-picker-s>*{pointer-events:none}/*!@:host*/.sc-calcite-input-time-picker-h{display:inline-block;-webkit-user-select:none;user-select:none}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-input-time-picker-h[disabled] .sc-calcite-input-time-picker-s>[calcite-hydrated][disabled],[disabled].sc-calcite-input-time-picker-h [calcite-hydrated][disabled].sc-calcite-input-time-picker{opacity:1}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-input-time-picker-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([scale=s])*/[scale=s].sc-calcite-input-time-picker-h{--calcite-toggle-spacing:0.5rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 1rem)}/*!@:host([scale=m])*/[scale=m].sc-calcite-input-time-picker-h{--calcite-toggle-spacing:0.75rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 1.5rem)}/*!@:host([scale=l])*/[scale=l].sc-calcite-input-time-picker-h{--calcite-toggle-spacing:1rem;--calcite-internal-input-text-input-padding-inline-end:calc(var(--calcite-toggle-spacing) + 2rem)}/*!@.input-wrapper*/.input-wrapper.sc-calcite-input-time-picker{position:relative}/*!@.toggle-icon*/.toggle-icon.sc-calcite-input-time-picker{position:absolute;display:flex;cursor:pointer;align-items:center;inset-inline-end:0;inset-block:0;padding-inline:var(--calcite-toggle-spacing)}/*!@.validation-container*/.validation-container.sc-calcite-input-time-picker{padding-block-start:0.5rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}/*!@:host([hidden])*/[hidden].sc-calcite-input-time-picker-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-input-time-picker{display:none}";
 
 // some bundlers (e.g., Webpack) need dynamic import paths to be static
 const supportedDayjsLocaleToLocaleConfigImport = new Map([
@@ -28990,6 +29037,8 @@ class InputTimePicker {
         this.readOnly = false;
         this.messageOverrides = undefined;
         this.messages = undefined;
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.numberingSystem = undefined;
         this.required = false;
@@ -29338,7 +29387,7 @@ class InputTimePicker {
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setCalcitePopoverEl }, hAsync("calcite-time-picker", { lang: this.effectiveLocale, messageOverrides: this.messageOverrides, numberingSystem: this.numberingSystem, onCalciteInternalTimePickerChange: this.timePickerChangeHandler, scale: this.scale, step: this.step, tabIndex: this.open ? undefined : -1, value: this.value,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.setCalciteTimePickerEl })), hAsync(HiddenFormInputSlot, { component: this })));
+            ref: this.setCalciteTimePickerEl })), hAsync(HiddenFormInputSlot, { component: this }), this.validationMessage ? (hAsync(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null));
     }
     renderToggleIcon(open) {
         return (hAsync("span", { class: CSS$I.toggleIcon }, hAsync("calcite-icon", { icon: open ? "chevron-up" : "chevron-down", scale: getIconScale(this.scale) })));
@@ -29369,6 +29418,8 @@ class InputTimePicker {
             "readOnly": [516, "read-only"],
             "messageOverrides": [1040],
             "messages": [1040],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [1],
             "numberingSystem": [1, "numbering-system"],
             "required": [516],
@@ -29569,6 +29620,8 @@ class InputTimeZone {
         this.messages = undefined;
         this.messageOverrides = undefined;
         this.mode = "offset";
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.open = false;
         this.overlayPositioning = "absolute";
@@ -29669,7 +29722,7 @@ class InputTimeZone {
         updateHostInteraction(this);
     }
     render() {
-        return (hAsync(Host, null, hAsync("calcite-combobox", { clearDisabled: true, 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, open: this.open, overlayPositioning: this.overlayPositioning, scale: this.scale, selectionMode: "single-persist", status: this.status,
+        return (hAsync(Host, null, hAsync("calcite-combobox", { clearDisabled: true, 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, open: this.open, overlayPositioning: this.overlayPositioning, scale: this.scale, selectionMode: "single-persist", status: this.status, "validation-icon": this.validationIcon, "validation-message": this.validationMessage,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: this.setComboboxRef }, this.timeZoneItems.map((group) => {
             const selected = this.selectedTimeZoneItem === group;
@@ -29699,6 +29752,8 @@ class InputTimeZone {
             "messages": [1040],
             "messageOverrides": [1040],
             "mode": [513],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [513],
             "open": [1540],
             "overlayPositioning": [513, "overlay-positioning"],
@@ -33139,11 +33194,11 @@ class List$1 {
     onGlobalDragEnd() {
         this.connectObserver();
     }
-    onDragEnd() {
-        this.calciteListDragEnd.emit();
+    onDragEnd(detail) {
+        this.calciteListDragEnd.emit(detail);
     }
-    onDragStart() {
-        this.calciteListDragStart.emit();
+    onDragStart(detail) {
+        this.calciteListDragStart.emit(detail);
     }
     onDragSort(detail) {
         this.setParentList();
@@ -33312,12 +33367,13 @@ class ListItem {
         registerInstance(this, hostRef);
         this.calciteListItemSelect = createEvent(this, "calciteListItemSelect", 6);
         this.calciteListItemClose = createEvent(this, "calciteListItemClose", 6);
+        this.calciteListItemToggle = createEvent(this, "calciteListItemToggle", 6);
         this.calciteInternalListItemSelect = createEvent(this, "calciteInternalListItemSelect", 6);
         this.calciteInternalListItemSelectMultiple = createEvent(this, "calciteInternalListItemSelectMultiple", 6);
         this.calciteInternalListItemActive = createEvent(this, "calciteInternalListItemActive", 6);
         this.calciteInternalFocusPreviousItem = createEvent(this, "calciteInternalFocusPreviousItem", 6);
         this.calciteInternalListItemChange = createEvent(this, "calciteInternalListItemChange", 6);
-        this.closeClickHandler = () => {
+        this.handleCloseClick = () => {
             this.closed = true;
             this.calciteListItemClose.emit();
         };
@@ -33342,10 +33398,14 @@ class ListItem {
         this.handleDefaultSlotChange = (event) => {
             this.handleOpenableChange(event.target);
         };
-        this.toggleOpen = () => {
-            this.open = !this.open;
+        this.handleToggleClick = () => {
+            this.toggle();
+        };
+        this.toggle = (value = !this.open) => {
+            this.open = value;
+            this.calciteListItemToggle.emit();
         };
-        this.itemClicked = (event) => {
+        this.handleItemClick = (event) => {
             if (event.defaultPrevented) {
                 return;
             }
@@ -33388,7 +33448,7 @@ class ListItem {
                 const nextIndex = currentIndex + 1;
                 if (currentIndex === -1) {
                     if (!open && openable) {
-                        this.open = true;
+                        this.toggle(true);
                         this.focusCell(null);
                     }
                     else if (cells[0]) {
@@ -33405,7 +33465,7 @@ class ListItem {
                 if (currentIndex === -1) {
                     this.focusCell(null);
                     if (open && openable) {
-                        this.open = false;
+                        this.toggle(false);
                     }
                     else {
                         this.calciteInternalFocusPreviousItem.emit();
@@ -33558,7 +33618,7 @@ class ListItem {
         if (selectionMode === "none" || selectionAppearance === "border") {
             return null;
         }
-        return (hAsync("td", { class: CSS$G.selectionContainer, key: "selection-container", onClick: this.itemClicked }, hAsync("calcite-icon", { icon: selected
+        return (hAsync("td", { class: CSS$G.selectionContainer, key: "selection-container", onClick: this.handleItemClick }, hAsync("calcite-icon", { icon: selected
                 ? selectionMode === "multiple"
                     ? ICONS$8.selectedMultiple
                     : ICONS$8.selectedSingle
@@ -33580,7 +33640,7 @@ class ListItem {
                     ? ICONS$8.closedRTL
                     : ICONS$8.closedLTR
             : ICONS$8.blank;
-        const clickHandler = openable ? this.toggleOpen : this.itemClicked;
+        const clickHandler = openable ? this.handleToggleClick : this.handleItemClick;
         return openable || parentListEl?.openable ? (hAsync("td", { class: CSS$G.openContainer, key: "open-container", onClick: clickHandler }, hAsync("calcite-icon", { icon: icon, key: icon, scale: "s" }))) : null;
     }
     renderActionsStart() {
@@ -33593,7 +33653,7 @@ class ListItem {
         const { label, hasActionsEnd, closable, messages } = this;
         return (hAsync("td", { "aria-label": label, class: CSS$G.actionsEnd, hidden: !(hasActionsEnd || closable), key: "actions-end-container", role: "gridcell",
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: (el) => (this.actionsEndEl = el) }, hAsync("slot", { name: SLOTS$i.actionsEnd, onSlotchange: this.handleActionsEndSlotChange }), closable ? (hAsync("calcite-action", { appearance: "transparent", icon: ICONS$8.close, key: "close-action", label: messages.close, onClick: this.closeClickHandler, text: messages.close })) : null));
+            ref: (el) => (this.actionsEndEl = el) }, hAsync("slot", { name: SLOTS$i.actionsEnd, onSlotchange: this.handleActionsEndSlotChange }), closable ? (hAsync("calcite-action", { appearance: "transparent", icon: ICONS$8.close, key: "close-action", label: messages.close, onClick: this.handleCloseClick, text: messages.close })) : null));
     }
     renderContentStart() {
         const { hasContentStart } = this;
@@ -33634,7 +33694,7 @@ class ListItem {
                 [CSS$G.contentContainer]: true,
                 [CSS$G.contentContainerSelectable]: selectionMode !== "none",
                 [CSS$G.contentContainerHasCenterContent]: hasCenterContent,
-            }, key: "content-container", onClick: this.itemClicked, role: "gridcell",
+            }, key: "content-container", onClick: this.handleItemClick, role: "gridcell",
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
             ref: (el) => (this.contentEl = el) }, content));
     }
@@ -34952,7 +35012,7 @@ const ICONS$6 = {
 
 /**
  * Do not edit directly
- * Generated on Fri, 15 Dec 2023 03:25:10 GMT
+ * Generated on Tue, 19 Dec 2023 17:47:34 GMT
  */
 const calciteContainerSizeWidthXxs = {"min":"0","max":"320px"}; // Small handheld devices and mini-windows
 const calciteContainerSizeWidthXs = {"min":"321px","max":"476px"}; // Handheld devices
@@ -37972,9 +38032,10 @@ const CSS$p = {
     icon: "icon",
     iconContainer: "icon-container",
     select: "select",
+    wrapper: "wrapper",
 };
 
-const selectCss = "/*!@:host*/.sc-calcite-select-h{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}/*!@:host([disabled])*/[disabled].sc-calcite-select-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-select-h *.sc-calcite-select,.sc-calcite-select-h[disabled].sc-calcite-select-s>*,.sc-calcite-select-h[disabled] .sc-calcite-select-s>*{pointer-events:none}/*!@:host*/.sc-calcite-select-h{position:relative;display:flex;align-items:stretch;inline-size:var(--select-width)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-select-h[disabled] .sc-calcite-select-s>[calcite-hydrated][disabled],[disabled].sc-calcite-select-h [calcite-hydrated][disabled].sc-calcite-select{opacity:1}/*!@:host([scale=s])*/[scale=s].sc-calcite-select-h{block-size:1.5rem;--calcite-select-font-size:var(--calcite-font-size--2);--calcite-select-spacing-inline:0.5rem 2rem}/*!@:host([scale=s]) .icon-container*/[scale=s].sc-calcite-select-h .icon-container.sc-calcite-select{padding-inline:0.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-select-h{block-size:2rem;--calcite-select-font-size:var(--calcite-font-size--1);--calcite-select-spacing-inline:0.75rem 2.5rem}/*!@:host([scale=m]) .icon-container*/[scale=m].sc-calcite-select-h .icon-container.sc-calcite-select{padding-inline:0.75rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-select-h{block-size:44px;--calcite-select-font-size:var(--calcite-font-size-0);--calcite-select-spacing-inline:1rem 3rem}/*!@:host([scale=l]) .icon-container*/[scale=l].sc-calcite-select-h .icon-container.sc-calcite-select{padding-inline:1rem}/*!@:host([width=auto])*/[width=auto].sc-calcite-select-h{inline-size:auto}/*!@:host([width=half])*/[width=half].sc-calcite-select-h{inline-size:50%}/*!@:host([width=full])*/[width=full].sc-calcite-select-h{inline-size:100%}/*!@.select*/.select.sc-calcite-select{margin:0px;box-sizing:border-box;inline-size:100%;cursor:pointer;appearance:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:0px;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);font-family:inherit;color:var(--calcite-color-text-2);outline-color:transparent;font-size:var(--calcite-select-font-size);padding-inline:var(--calcite-select-spacing-inline);border-inline-end-width:0px}/*!@.select:focus*/.select.sc-calcite-select:focus{outline:2px solid 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          )}/*!@.select:hover*/.select.sc-calcite-select:hover{background-color:var(--calcite-color-foreground-2)}/*!@select:disabled*/select.sc-calcite-select:disabled{border-color:var(--calcite-color-border-input);--tw-bg-opacity:1}/*!@.icon-container*/.icon-container.sc-calcite-select{pointer-events:none;position:absolute;inset-block:0px;display:flex;align-items:center;border-width:0px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:transparent;color:var(--calcite-color-text-2);inset-inline-end:0px;border-inline-width:0px 1px}/*!@:host([status=invalid]) select,\n:host([status=invalid]) .icon-container*/[status=invalid].sc-calcite-select-h select.sc-calcite-select,[status=invalid].sc-calcite-select-h .icon-container.sc-calcite-select{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) select:focus,\n:host([status=invalid]) .icon-container:focus*/[status=invalid].sc-calcite-select-h select.sc-calcite-select:focus,[status=invalid].sc-calcite-select-h .icon-container.sc-calcite-select:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@.select:focus ~ .icon-container*/.select.sc-calcite-select:focus~.icon-container.sc-calcite-select{border-color:transparent}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-select-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-select-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-select{display:none}";
+const selectCss = "/*!@:host*/.sc-calcite-select-h{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}/*!@:host([disabled])*/[disabled].sc-calcite-select-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-select-h *.sc-calcite-select,.sc-calcite-select-h[disabled].sc-calcite-select-s>*,.sc-calcite-select-h[disabled] .sc-calcite-select-s>*{pointer-events:none}/*!@:host*/.sc-calcite-select-h{display:flex;flex-direction:column}/*!@.wrapper*/.wrapper.sc-calcite-select{position:relative;display:flex;align-items:stretch;inline-size:var(--select-width)}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-select-h[disabled] .sc-calcite-select-s>[calcite-hydrated][disabled],[disabled].sc-calcite-select-h [calcite-hydrated][disabled].sc-calcite-select{opacity:1}/*!@:host([scale=s])*/[scale=s].sc-calcite-select-h{--calcite-select-font-size:var(--calcite-font-size--2);--calcite-select-spacing-inline:0.5rem 2rem}/*!@:host([scale=s]) .wrapper*/[scale=s].sc-calcite-select-h .wrapper.sc-calcite-select{block-size:1.5rem}/*!@:host([scale=s]) .icon-container*/[scale=s].sc-calcite-select-h .icon-container.sc-calcite-select{padding-inline:0.5rem}/*!@:host([scale=m])*/[scale=m].sc-calcite-select-h{--calcite-select-font-size:var(--calcite-font-size--1);--calcite-select-spacing-inline:0.75rem 2.5rem}/*!@:host([scale=m]) .wrapper*/[scale=m].sc-calcite-select-h .wrapper.sc-calcite-select{block-size:2rem}/*!@:host([scale=m]) .icon-container*/[scale=m].sc-calcite-select-h .icon-container.sc-calcite-select{padding-inline:0.75rem}/*!@:host([scale=l])*/[scale=l].sc-calcite-select-h{--calcite-select-font-size:var(--calcite-font-size-0);--calcite-select-spacing-inline:1rem 3rem}/*!@:host([scale=l]) .wrapper*/[scale=l].sc-calcite-select-h .wrapper.sc-calcite-select{block-size:44px}/*!@:host([scale=l]) .icon-container*/[scale=l].sc-calcite-select-h .icon-container.sc-calcite-select{padding-inline:1rem}/*!@:host([width=auto])*/[width=auto].sc-calcite-select-h{inline-size:auto}/*!@:host([width=half])*/[width=half].sc-calcite-select-h{inline-size:50%}/*!@:host([width=full])*/[width=full].sc-calcite-select-h{inline-size:100%}/*!@.select*/.select.sc-calcite-select{margin:0px;box-sizing:border-box;inline-size:100%;cursor:pointer;appearance:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:0px;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);font-family:inherit;color:var(--calcite-color-text-2);outline-color:transparent;font-size:var(--calcite-select-font-size);padding-inline:var(--calcite-select-spacing-inline);border-inline-end-width:0px}/*!@.select:focus*/.select.sc-calcite-select:focus{outline:2px solid 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          )}/*!@.select:hover*/.select.sc-calcite-select:hover{background-color:var(--calcite-color-foreground-2)}/*!@select:disabled*/select.sc-calcite-select:disabled{border-color:var(--calcite-color-border-input);--tw-bg-opacity:1}/*!@.icon-container*/.icon-container.sc-calcite-select{pointer-events:none;position:absolute;inset-block:0px;display:flex;align-items:center;border-width:0px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:transparent;color:var(--calcite-color-text-2);inset-inline-end:0px;border-inline-width:0px 1px}/*!@:host([status=invalid]) select,\n:host([status=invalid]) .icon-container*/[status=invalid].sc-calcite-select-h select.sc-calcite-select,[status=invalid].sc-calcite-select-h .icon-container.sc-calcite-select{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) select:focus,\n:host([status=invalid]) .icon-container:focus*/[status=invalid].sc-calcite-select-h select.sc-calcite-select:focus,[status=invalid].sc-calcite-select-h .icon-container.sc-calcite-select:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@.select:focus ~ .icon-container*/.select.sc-calcite-select:focus~.icon-container.sc-calcite-select{border-color:transparent}/*!@.validation-container*/.validation-container.sc-calcite-select{padding-block-start:0.5rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-select-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([hidden])*/[hidden].sc-calcite-select-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-select{display:none}";
 
 function isOption(optionOrGroup) {
     return optionOrGroup.tagName === "CALCITE-OPTION";
@@ -38013,6 +38074,8 @@ class Select {
         this.disabled = false;
         this.form = undefined;
         this.label = undefined;
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.required = false;
         this.scale = "m";
@@ -38159,9 +38222,9 @@ class Select {
         return (hAsync("div", { class: CSS$p.iconContainer }, hAsync("calcite-icon", { class: CSS$p.icon, icon: "chevron-down", scale: getIconScale(this.scale) })));
     }
     render() {
-        return (hAsync(Fragment, null, hAsync("select", { "aria-label": getLabelText(this), class: CSS$p.select, disabled: this.disabled, onChange: this.handleInternalSelectChange,
+        return (hAsync(Host, null, hAsync("div", { class: CSS$p.wrapper }, hAsync("select", { "aria-label": getLabelText(this), class: CSS$p.select, disabled: this.disabled, onChange: this.handleInternalSelectChange,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.storeSelectRef }, hAsync("slot", null)), this.renderChevron(), hAsync(HiddenFormInputSlot, { component: this })));
+            ref: this.storeSelectRef }, hAsync("slot", null)), this.renderChevron(), hAsync(HiddenFormInputSlot, { component: this })), this.validationMessage ? (hAsync(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -38176,6 +38239,8 @@ class Select {
             "disabled": [516],
             "form": [513],
             "label": [1],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [513],
             "required": [516],
             "scale": [513],
@@ -41713,7 +41778,7 @@ class TabTitle {
 
 const CSS$b = {
     bordered: "bordered",
-    zebra: "zebra",
+    striped: "striped",
     selectionArea: "selection-area",
     paginationArea: "pagination-area",
     container: "container",
@@ -41728,7 +41793,7 @@ const SLOTS$6 = {
     tableFooter: "table-footer",
 };
 
-const tableCss = "/*!@:host([scale=s])*/[scale=s].sc-calcite-table-h{--calcite-internal-table-cell-padding:0.25rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size--2);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--3)}/*!@:host([scale=m])*/[scale=m].sc-calcite-table-h{--calcite-internal-table-cell-padding:0.5rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size--1);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--2)}/*!@:host([scale=l])*/[scale=l].sc-calcite-table-h{--calcite-internal-table-cell-padding:1rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size-0);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--1)}/*!@:host*/.sc-calcite-table-h{display:table}/*!@.container*/.container.sc-calcite-table{max-inline-size:100vw;inline-size:100%}/*!@.table-container*/.table-container.sc-calcite-table{overflow-x:auto;white-space:nowrap}/*!@.table-container:not(.bordered)*/.table-container.sc-calcite-table:not(.bordered){border-block-end:1px solid var(--calcite-color-border-3)}/*!@.assistive-text*/.assistive-text.sc-calcite-table{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@table*/table.sc-calcite-table{inline-size:100%;border-collapse:collapse;overflow-x:scroll;border-block-start:1px solid var(--calcite-color-border-3);border-inline-start:1px solid var(--calcite-color-border-3);border-block-end:1px solid var(--calcite-color-border-3)}/*!@tbody*/tbody.sc-calcite-table{border-block-end:1px solid var(--calcite-color-border-3)}/*!@.table--fixed*/.table--fixed.sc-calcite-table{table-layout:fixed}/*!@.bordered ::slotted(calcite-table-row)*/.bordered .sc-calcite-table-s>calcite-table-row{--calcite-table-row-border-color:var(--calcite-color-border-3)}/*!@.zebra ::slotted(calcite-table-row:nth-child(2n+1))*/.zebra .sc-calcite-table-s>calcite-table-row:nth-child(2n+1){--calcite-table-row-background:var(--calcite-color-foreground-2)}/*!@.selection-actions*/.selection-actions.sc-calcite-table{display:flex;flex-direction:row;margin-inline-start:auto}/*!@.selection-area*/.selection-area.sc-calcite-table{display:flex;flex-direction:row;align-items:center;padding-block:var(--calcite-internal-table-cell-padding)}/*!@.selection-area calcite-chip:last-of-type*/.selection-area.sc-calcite-table calcite-chip.sc-calcite-table:last-of-type{margin-inline-end:0.5rem}/*!@.selection-area calcite-chip:last-of-type:not(:first-of-type)*/.selection-area.sc-calcite-table calcite-chip.sc-calcite-table:last-of-type:not(:first-of-type){margin-inline-start:0.5rem}/*!@.selection-area calcite-button*/.selection-area.sc-calcite-table calcite-button.sc-calcite-table{margin-inline-end:1rem}/*!@.pagination-area*/.pagination-area.sc-calcite-table{display:flex;inline-size:100%;flex-direction:row;justify-content:center;padding-block:var(--calcite-internal-table-cell-padding)}/*!@calcite-pagination*/calcite-pagination.sc-calcite-table{flex:1;justify-content:center}/*!@:host([hidden])*/[hidden].sc-calcite-table-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-table{display:none}";
+const tableCss = "/*!@:host([scale=s])*/[scale=s].sc-calcite-table-h{--calcite-internal-table-cell-padding:0.25rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size--2);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--3)}/*!@:host([scale=m])*/[scale=m].sc-calcite-table-h{--calcite-internal-table-cell-padding:0.5rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size--1);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--2)}/*!@:host([scale=l])*/[scale=l].sc-calcite-table-h{--calcite-internal-table-cell-padding:1rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size-0);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--1)}/*!@:host*/.sc-calcite-table-h{display:table}/*!@.container*/.container.sc-calcite-table{max-inline-size:100vw;inline-size:100%}/*!@.table-container*/.table-container.sc-calcite-table{overflow-x:auto;white-space:nowrap}/*!@.table-container:not(.bordered)*/.table-container.sc-calcite-table:not(.bordered){border-block-end:1px solid var(--calcite-color-border-3)}/*!@.assistive-text*/.assistive-text.sc-calcite-table{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@table*/table.sc-calcite-table{inline-size:100%;border-collapse:collapse;overflow-x:scroll;border-block-start:1px solid var(--calcite-color-border-3);border-inline-start:1px solid var(--calcite-color-border-3);border-block-end:1px solid var(--calcite-color-border-3)}/*!@tbody*/tbody.sc-calcite-table{border-block-end:1px solid var(--calcite-color-border-3)}/*!@.table--fixed*/.table--fixed.sc-calcite-table{table-layout:fixed}/*!@.bordered ::slotted(calcite-table-row)*/.bordered .sc-calcite-table-s>calcite-table-row{--calcite-table-row-border-color:var(--calcite-color-border-3)}/*!@.striped ::slotted(calcite-table-row:nth-child(2n+1))*/.striped .sc-calcite-table-s>calcite-table-row:nth-child(2n+1){--calcite-table-row-background:var(--calcite-color-foreground-2)}/*!@.selection-actions*/.selection-actions.sc-calcite-table{display:flex;flex-direction:row;margin-inline-start:auto}/*!@.selection-area*/.selection-area.sc-calcite-table{display:flex;flex-direction:row;align-items:center;padding-block:var(--calcite-internal-table-cell-padding)}/*!@.selection-area calcite-chip:last-of-type*/.selection-area.sc-calcite-table calcite-chip.sc-calcite-table:last-of-type{margin-inline-end:0.5rem}/*!@.selection-area calcite-chip:last-of-type:not(:first-of-type)*/.selection-area.sc-calcite-table calcite-chip.sc-calcite-table:last-of-type:not(:first-of-type){margin-inline-start:0.5rem}/*!@.selection-area calcite-button*/.selection-area.sc-calcite-table calcite-button.sc-calcite-table{margin-inline-end:1rem}/*!@.pagination-area*/.pagination-area.sc-calcite-table{display:flex;inline-size:100%;flex-direction:row;justify-content:center;padding-block:var(--calcite-internal-table-cell-padding)}/*!@calcite-pagination*/calcite-pagination.sc-calcite-table{flex:1;justify-content:center}/*!@:host([hidden])*/[hidden].sc-calcite-table-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-table{display:none}";
 
 /**
  * @slot - A slot for adding `calcite-table-row` elements containing `calcite-table-cell` and/or `calcite-table-header` elements.
@@ -41853,6 +41918,7 @@ class Table {
         this.scale = "m";
         this.selectionMode = "none";
         this.zebra = false;
+        this.striped = false;
         this.selectedItems = [];
         this.messages = undefined;
         this.messageOverrides = undefined;
@@ -41976,7 +42042,7 @@ class Table {
     render() {
         return (hAsync(Host, null, hAsync("div", { class: CSS$b.container }, this.selectionMode !== "none" && this.renderSelectionArea(), hAsync("div", { class: {
                 [CSS$b.bordered]: this.bordered,
-                [CSS$b.zebra]: this.zebra,
+                [CSS$b.striped]: this.striped || this.zebra,
                 [CSS$b.tableContainer]: true,
             } }, hAsync("table", { "aria-colcount": this.colCount, "aria-multiselectable": this.selectionMode === "multiple", "aria-readonly": true, "aria-rowcount": this.allRows?.length, class: { [CSS$b.tableFixed]: this.layout === "fixed" }, role: "grid" }, hAsync("caption", { class: CSS$b.assistiveText }, this.caption), this.renderTHead(), this.renderTBody(), this.renderTFoot())), this.pageSize > 0 && this.renderPaginationArea())));
     }
@@ -42007,6 +42073,7 @@ class Table {
             "scale": [513],
             "selectionMode": [513, "selection-mode"],
             "zebra": [516],
+            "striped": [516],
             "selectedItems": [1040],
             "messages": [1040],
             "messageOverrides": [1040],
@@ -42019,7 +42086,7 @@ class Table {
         },
         "$listeners$": [[0, "calciteTableRowSelect", "calciteChipSelectListener"], [0, "calciteInternalTableRowFocusRequest", "calciteInternalTableRowFocusEvent"]],
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["bordered", "bordered"], ["groupSeparator", "group-separator"], ["layout", "layout"], ["numbered", "numbered"], ["numberingSystem", "numbering-system"], ["pageSize", "page-size"], ["scale", "scale"], ["selectionMode", "selection-mode"], ["zebra", "zebra"]]
+        "$attrsToReflect$": [["bordered", "bordered"], ["groupSeparator", "group-separator"], ["layout", "layout"], ["numbered", "numbered"], ["numberingSystem", "numbering-system"], ["pageSize", "page-size"], ["scale", "scale"], ["selectionMode", "selection-mode"], ["zebra", "zebra"], ["striped", "striped"]]
     }; }
 }
 
@@ -42031,7 +42098,7 @@ const CSS$a = {
     assistiveText: "assistive-text",
 };
 
-const tableCellCss = "/*!@:host*/.sc-calcite-table-cell-h{--calcite-internal-table-cell-background-internal:var(--calcite-table-cell-background, transparent);--calcite-internal-table-cell-border-color-internal:var(--calcite-table-cell-border-color, transparent);display:contents}/*!@:host([alignment=center]) td*/[alignment=center].sc-calcite-table-cell-h td.sc-calcite-table-cell{text-align:center}/*!@:host([alignment=end]) td*/[alignment=end].sc-calcite-table-cell-h td.sc-calcite-table-cell{text-align:end}/*!@.assistive-text*/.assistive-text.sc-calcite-table-cell{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@td*/td.sc-calcite-table-cell{white-space:normal;text-align:start;vertical-align:middle;color:var(--calcite-color-text-1);outline-color:transparent;background:var(--calcite-internal-table-cell-background);border-inline-end:1px solid var(--calcite-color-border-3);font-size:var(--calcite-internal-table-cell-font-size);padding:var(--calcite-internal-table-cell-padding)}/*!@td:focus*/td.sc-calcite-table-cell:focus{outline:2px solid 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          )}/*!@.number-cell*/.number-cell.sc-calcite-table-cell{background-color:var(--calcite-color-foreground-2)}/*!@.footer-cell*/.footer-cell.sc-calcite-table-cell{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1);border-block-start:1px solid var(--calcite-color-border-3)}/*!@.number-cell,\n.selection-cell*/.number-cell.sc-calcite-table-cell,.selection-cell.sc-calcite-table-cell{border-inline-end:1px solid var(--calcite-color-border-3);inline-size:2rem;min-inline-size:2rem}/*!@.selection-cell*/.selection-cell.sc-calcite-table-cell{cursor:pointer;color:var(--calcite-color-text-3);inset-inline-start:2rem}/*!@.selected-cell:not(.number-cell):not(.footer-cell)*/.selected-cell.sc-calcite-table-cell:not(.number-cell):not(.footer-cell){--calcite-table-cell-background:var(--calcite-color-foreground-current);background:var(--calcite-color-foreground-current)}/*!@.selection-cell.selected-cell*/.selection-cell.selected-cell.sc-calcite-table-cell{box-shadow:inset 0.25rem 0 0 0 var(--calcite-color-brand);color:var(--calcite-color-brand)}/*!@.selection-cell.selected-cell calcite-icon*/.selection-cell.selected-cell.sc-calcite-table-cell calcite-icon.sc-calcite-table-cell{color:var(--calcite-color-brand)}/*!@.calcite--rtl.selection-cell.selected-cell*/.calcite--rtl.selection-cell.selected-cell.sc-calcite-table-cell{box-shadow:inset -0.25rem 0 0 0 var(--calcite-color-brand)}/*!@.selection-cell*/.selection-cell.sc-calcite-table-cell{vertical-align:middle}/*!@.selection-cell ::slotted(calcite-icon)*/.selection-cell .sc-calcite-table-cell-s>calcite-icon{pointer-events:none;margin-block-start:0.25rem}";
+const tableCellCss = "/*!@:host*/.sc-calcite-table-cell-h{--calcite-internal-table-cell-background:var(--calcite-table-cell-background, transparent);display:contents}/*!@:host([alignment=center]) td*/[alignment=center].sc-calcite-table-cell-h td.sc-calcite-table-cell{text-align:center}/*!@:host([alignment=end]) td*/[alignment=end].sc-calcite-table-cell-h td.sc-calcite-table-cell{text-align:end}/*!@.assistive-text*/.assistive-text.sc-calcite-table-cell{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@td*/td.sc-calcite-table-cell{white-space:normal;text-align:start;vertical-align:middle;color:var(--calcite-color-text-1);outline-color:transparent;background:var(--calcite-internal-table-cell-background);border-inline-end:1px solid var(--calcite-color-border-3);font-size:var(--calcite-internal-table-cell-font-size);padding:var(--calcite-internal-table-cell-padding)}/*!@td:focus*/td.sc-calcite-table-cell:focus{outline:2px solid 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          )}/*!@.number-cell*/.number-cell.sc-calcite-table-cell{background-color:var(--calcite-color-foreground-2)}/*!@.footer-cell*/.footer-cell.sc-calcite-table-cell{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1);border-block-start:1px solid var(--calcite-color-border-3)}/*!@.number-cell,\n.selection-cell*/.number-cell.sc-calcite-table-cell,.selection-cell.sc-calcite-table-cell{border-inline-end:1px solid var(--calcite-color-border-3);inline-size:2rem;min-inline-size:2rem}/*!@.selection-cell*/.selection-cell.sc-calcite-table-cell{cursor:pointer;color:var(--calcite-color-text-3);inset-inline-start:2rem}/*!@.selected-cell:not(.number-cell):not(.footer-cell)*/.selected-cell.sc-calcite-table-cell:not(.number-cell):not(.footer-cell){--calcite-internal-table-cell-background:var(--calcite-color-foreground-current)}/*!@.selection-cell.selected-cell*/.selection-cell.selected-cell.sc-calcite-table-cell{box-shadow:inset 0.25rem 0 0 0 var(--calcite-color-brand);color:var(--calcite-color-brand)}/*!@.selection-cell.selected-cell calcite-icon*/.selection-cell.selected-cell.sc-calcite-table-cell calcite-icon.sc-calcite-table-cell{color:var(--calcite-color-brand)}/*!@.calcite--rtl.selection-cell.selected-cell*/.calcite--rtl.selection-cell.selected-cell.sc-calcite-table-cell{box-shadow:inset -0.25rem 0 0 0 var(--calcite-color-brand)}/*!@.selection-cell*/.selection-cell.sc-calcite-table-cell{vertical-align:middle}/*!@.selection-cell ::slotted(calcite-icon)*/.selection-cell .sc-calcite-table-cell-s>calcite-icon{pointer-events:none;margin-block-start:0.25rem}";
 
 /**
  * @slot - A slot for adding content, usually text content.
@@ -42190,9 +42257,10 @@ const CSS$9 = {
     multipleSelectionCell: "cell--multiple-selection",
     assistiveText: "assistive-text",
     active: "active",
+    selectedCell: "selected-cell",
 };
 
-const tableHeaderCss = "/*!@:host*/.sc-calcite-table-header-h{--calcite-internal-table-header-background:var(--calcite-table-header-background, var(--calcite-color-foreground-2));--calcite-internal-table-header-border-color:var(--calcite-table-border-color, var(--calcite-color-border-3));display:contents}/*!@:host([alignment=center]) th*/[alignment=center].sc-calcite-table-header-h th.sc-calcite-table-header{text-align:center}/*!@:host([alignment=end]) th*/[alignment=end].sc-calcite-table-header-h th.sc-calcite-table-header{text-align:end}/*!@.assistive-text*/.assistive-text.sc-calcite-table-header{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@th*/th.sc-calcite-table-header{white-space:normal;text-align:start;vertical-align:top;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1);outline-color:transparent;font-size:var(--calcite-internal-table-cell-font-size);border-inline-end:1px solid var(--calcite-internal-table-header-border-color);border-block-end:1px solid var(--calcite-internal-table-header-border-color);padding-block:calc(var(--calcite-internal-table-cell-padding) * 1.5);padding-inline:var(--calcite-internal-table-cell-padding);background-color:var(--calcite-internal-table-header-background)}/*!@th:focus-within*/th.sc-calcite-table-header:focus-within{outline:2px solid 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          )}/*!@th.body-row,\nth.footer-row*/th.body-row.sc-calcite-table-header,th.footer-row.sc-calcite-table-header{vertical-align:middle;border-block-end:0}/*!@th.footer-row*/th.footer-row.sc-calcite-table-header{border-block-start:1px solid var(--calcite-internal-table-header-border-color)}/*!@.cell--multiple-selection*/.cell--multiple-selection.sc-calcite-table-header{cursor:pointer;vertical-align:middle;color:var(--calcite-color-text-3)}/*!@.number-cell,\n.selection-cell*/.number-cell.sc-calcite-table-header,.selection-cell.sc-calcite-table-header{color:var(--calcite-color-text-2);inline-size:2rem;min-inline-size:2rem}/*!@.selection-cell calcite-icon.active*/.selection-cell.sc-calcite-table-header calcite-icon.active.sc-calcite-table-header{color:var(--calcite-color-brand)}/*!@.number-cell calcite-icon,\n.selection-cell calcite-icon*/.number-cell.sc-calcite-table-header calcite-icon.sc-calcite-table-header,.selection-cell.sc-calcite-table-header calcite-icon.sc-calcite-table-header{margin-inline-start:auto;margin-inline-end:auto;vertical-align:middle}/*!@.heading*/.heading.sc-calcite-table-header{color:var(--calcite-color-text-1)}/*!@.description*/.description.sc-calcite-table-header{color:var(--calcite-color-text-3);font-size:var(--calcite-internal-table-cell-font-size-secondary)}";
+const tableHeaderCss = "/*!@:host*/.sc-calcite-table-header-h{--calcite-internal-table-header-background:var(--calcite-table-header-background, var(--calcite-color-foreground-2));--calcite-internal-table-header-border-color:var(--calcite-table-border-color, var(--calcite-color-border-3));display:contents}/*!@:host([alignment=center]) th*/[alignment=center].sc-calcite-table-header-h th.sc-calcite-table-header{text-align:center}/*!@:host([alignment=end]) th*/[alignment=end].sc-calcite-table-header-h th.sc-calcite-table-header{text-align:end}/*!@.assistive-text*/.assistive-text.sc-calcite-table-header{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@th*/th.sc-calcite-table-header{white-space:normal;text-align:start;vertical-align:top;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1);outline-color:transparent;font-size:var(--calcite-internal-table-cell-font-size);border-inline-end:1px solid var(--calcite-internal-table-header-border-color);border-block-end:1px solid var(--calcite-internal-table-header-border-color);padding-block:calc(var(--calcite-internal-table-cell-padding) * 1.5);padding-inline:var(--calcite-internal-table-cell-padding);background-color:var(--calcite-internal-table-header-background)}/*!@th:focus-within*/th.sc-calcite-table-header:focus-within{outline:2px solid 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          )}/*!@th.body-row,\nth.footer-row*/th.body-row.sc-calcite-table-header,th.footer-row.sc-calcite-table-header{vertical-align:middle;border-block-end:0}/*!@th.footer-row*/th.footer-row.sc-calcite-table-header{border-block-start:1px solid var(--calcite-internal-table-header-border-color)}/*!@.cell--multiple-selection*/.cell--multiple-selection.sc-calcite-table-header{cursor:pointer;vertical-align:middle;color:var(--calcite-color-text-3)}/*!@.selected-cell:not(.number-cell):not(.footer-cell)*/.selected-cell.sc-calcite-table-header:not(.number-cell):not(.footer-cell){--calcite-internal-table-header-background:var(--calcite-color-foreground-current)}/*!@.number-cell,\n.selection-cell*/.number-cell.sc-calcite-table-header,.selection-cell.sc-calcite-table-header{color:var(--calcite-color-text-2);inline-size:2rem;min-inline-size:2rem}/*!@.selection-cell calcite-icon.active*/.selection-cell.sc-calcite-table-header calcite-icon.active.sc-calcite-table-header{color:var(--calcite-color-brand)}/*!@.number-cell calcite-icon,\n.selection-cell calcite-icon*/.number-cell.sc-calcite-table-header calcite-icon.sc-calcite-table-header,.selection-cell.sc-calcite-table-header calcite-icon.sc-calcite-table-header{margin-inline-start:auto;margin-inline-end:auto;vertical-align:middle}/*!@.heading*/.heading.sc-calcite-table-header{color:var(--calcite-color-text-1)}/*!@.description*/.description.sc-calcite-table-header{color:var(--calcite-color-text-3);font-size:var(--calcite-internal-table-cell-font-size-secondary)}";
 
 class TableHeader {
     constructor(hostRef) {
@@ -42203,6 +42271,7 @@ class TableHeader {
         this.heading = undefined;
         this.rowSpan = undefined;
         this.numberCell = false;
+        this.parentRowIsSelected = undefined;
         this.parentRowPosition = undefined;
         this.parentRowType = undefined;
         this.positionInRow = undefined;
@@ -42300,6 +42369,7 @@ class TableHeader {
                 [CSS$9.footerRow]: this.parentRowType === "foot",
                 [CSS$9.numberCell]: this.numberCell,
                 [CSS$9.selectionCell]: this.selectionCell,
+                [CSS$9.selectedCell]: this.parentRowIsSelected,
                 [CSS$9.multipleSelectionCell]: this.selectionMode === "multiple",
             }, colSpan: this.colSpan, role: "columnheader", rowSpan: this.rowSpan, scope: scope, tabIndex: 0,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
@@ -42324,6 +42394,7 @@ class TableHeader {
             "heading": [513],
             "rowSpan": [514, "row-span"],
             "numberCell": [4, "number-cell"],
+            "parentRowIsSelected": [4, "parent-row-is-selected"],
             "parentRowPosition": [2, "parent-row-position"],
             "parentRowType": [1, "parent-row-type"],
             "positionInRow": [2, "position-in-row"],
@@ -42375,11 +42446,11 @@ class TableRow {
                 cells?.forEach((cell, index) => {
                     cell.positionInRow = index + 1;
                     cell.parentRowType = this.rowType;
+                    cell.parentRowIsSelected = this.selected;
                     cell.scale = this.scale;
                     if (cell.nodeName === "CALCITE-TABLE-CELL") {
                         cell.readCellContentsToAT = this.readCellContentsToAT;
                         cell.disabled = this.disabled;
-                        cell.parentRowIsSelected = this.selected;
                     }
                 });
             }
@@ -42783,7 +42854,7 @@ const SLOTS$4 = {
 };
 const RESIZE_TIMEOUT = 100;
 
-const textAreaCss = "/*!@:host([disabled])*/[disabled].sc-calcite-text-area-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-text-area-h *.sc-calcite-text-area,.sc-calcite-text-area-h[disabled].sc-calcite-text-area-s>*,.sc-calcite-text-area-h[disabled] .sc-calcite-text-area-s>*{pointer-events:none}/*!@:host*/.sc-calcite-text-area-h{position:relative;display:inline-block;block-size:100%;inline-size:100%}/*!@textarea*/textarea.sc-calcite-text-area{position:relative;margin:0px;box-sizing:border-box;display:block;inline-size:100%;border-width:1px;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);font-family:var(--calcite-sans-family);color:var(--calcite-color-text-1);min-inline-size:12rem;border-block-end:1px solid var(--calcite-color-border-3)}@media screen and (max-width: 480px){/*!@textarea*/textarea.sc-calcite-text-area{resize:none}}/*!@textarea:focus*/textarea.sc-calcite-text-area:focus{outline:2px solid 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          )}/*!@textarea.text-area--invalid*/textarea.text-area--invalid.sc-calcite-text-area{border-width:1px;border-block-end-width:1px;border-style:solid;border-color:var(--calcite-color-status-danger)}/*!@textarea.text-area--invalid:focus*/textarea.text-area--invalid.sc-calcite-text-area:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@textarea.footer--slotted*/textarea.footer--slotted.sc-calcite-text-area{min-inline-size:18rem}/*!@.footer*/.footer.sc-calcite-text-area{box-sizing:border-box;display:flex;align-items:center;border-width:1px;border-block-start-width:0px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1)}/*!@.character-limit*/.character-limit.sc-calcite-text-area{display:flex;align-items:center;justify-content:flex-end;white-space:nowrap;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}/*!@.character--over-limit*/.character--over-limit.sc-calcite-text-area{font-weight:var(--calcite-font-weight-bold);color:var(--calcite-color-status-danger)}/*!@:host([resize=none]) textarea*/[resize=none].sc-calcite-text-area-h textarea.sc-calcite-text-area{resize:none}/*!@:host([resize=horizontal]) textarea*/[resize=horizontal].sc-calcite-text-area-h textarea.sc-calcite-text-area{resize:horizontal}/*!@:host([resize=vertical]) textarea*/[resize=vertical].sc-calcite-text-area-h textarea.sc-calcite-text-area{resize:vertical}/*!@:host([scale=s])*/[scale=s].sc-calcite-text-area-h{font-size:var(--calcite-font-size--2)}/*!@:host([scale=s]) .footer*/[scale=s].sc-calcite-text-area-h .footer.sc-calcite-text-area{padding-block:0.25rem;padding-inline:0.5rem;min-block-size:1.75rem}/*!@:host([scale=s]) textarea*/[scale=s].sc-calcite-text-area-h textarea.sc-calcite-text-area{padding-block:0.25rem;padding-inline:0.5rem}/*!@:host([scale=s]) textarea,\n:host([scale=s]) .footer,\n:host([scale=s]) .character-limit*/[scale=s].sc-calcite-text-area-h textarea.sc-calcite-text-area,[scale=s].sc-calcite-text-area-h .footer.sc-calcite-text-area,[scale=s].sc-calcite-text-area-h .character-limit.sc-calcite-text-area{padding-inline-start:0.5rem;font-size:var(--calcite-font-size--2)}/*!@:host([scale=m]) textarea*/[scale=m].sc-calcite-text-area-h textarea.sc-calcite-text-area{padding-block:0.5rem;padding-inline:0.75rem}/*!@:host([scale=m]) .footer*/[scale=m].sc-calcite-text-area-h .footer.sc-calcite-text-area{padding-block:0.5rem;padding-inline:0.75rem;min-block-size:2.25rem}/*!@:host([scale=m]) textarea,\n:host([scale=m]) .footer,\n:host([scale=m]) .character-limit*/[scale=m].sc-calcite-text-area-h textarea.sc-calcite-text-area,[scale=m].sc-calcite-text-area-h .footer.sc-calcite-text-area,[scale=m].sc-calcite-text-area-h .character-limit.sc-calcite-text-area{padding-inline-start:0.75rem;font-size:var(--calcite-font-size--1)}/*!@:host([scale=l])*/[scale=l].sc-calcite-text-area-h{font-size:var(--calcite-font-size-0)}/*!@:host([scale=l]) textarea*/[scale=l].sc-calcite-text-area-h textarea.sc-calcite-text-area{padding-block:0.75rem;padding-inline:1rem}/*!@:host([scale=l]) .footer*/[scale=l].sc-calcite-text-area-h .footer.sc-calcite-text-area{padding-block:0.75rem;padding-inline:1rem;min-block-size:2.75rem}/*!@:host([scale=l]) textarea,\n:host([scale=l]) .footer,\n:host([scale=l]) .character-limit*/[scale=l].sc-calcite-text-area-h textarea.sc-calcite-text-area,[scale=l].sc-calcite-text-area-h .footer.sc-calcite-text-area,[scale=l].sc-calcite-text-area-h .character-limit.sc-calcite-text-area{padding-inline-start:1rem;font-size:var(--calcite-font-size-0)}/*!@:host([status=invalid]) textarea*/[status=invalid].sc-calcite-text-area-h textarea.sc-calcite-text-area{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) textarea:focus*/[status=invalid].sc-calcite-text-area-h textarea.sc-calcite-text-area:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@.readonly*/.readonly.sc-calcite-text-area{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}/*!@:host([disabled]) textarea,\n:host([disabled]) footer*/[disabled].sc-calcite-text-area-h textarea.sc-calcite-text-area,[disabled].sc-calcite-text-area-h footer.sc-calcite-text-area{opacity:0.5}/*!@.border--color*/.border--color.sc-calcite-text-area{border-block-end-width:1px;border-color:var(--calcite-color-border-input)}/*!@.border--color:focus*/.border--color.sc-calcite-text-area:focus{border-block-end-width:2px}/*!@textarea.block-size--full*/textarea.block-size--full.sc-calcite-text-area{block-size:100%}/*!@.content,\n.hide*/.content.sc-calcite-text-area,.hide.sc-calcite-text-area{display:none}/*!@.container*/.container.sc-calcite-text-area{display:flex;inline-size:100%;justify-content:space-between}/*!@.footer--end-only*/.footer--end-only.sc-calcite-text-area{justify-content:flex-end}/*!@.assistive-text*/.assistive-text.sc-calcite-text-area{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-text-area-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-text-area-h[disabled] .sc-calcite-text-area-s>[calcite-hydrated][disabled],[disabled].sc-calcite-text-area-h [calcite-hydrated][disabled].sc-calcite-text-area{opacity:1}/*!@:host([hidden])*/[hidden].sc-calcite-text-area-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-text-area{display:none}";
+const textAreaCss = "/*!@:host([disabled])*/[disabled].sc-calcite-text-area-h{cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}/*!@:host([disabled]) *,\n:host([disabled]) ::slotted(*)*/[disabled].sc-calcite-text-area-h *.sc-calcite-text-area,.sc-calcite-text-area-h[disabled].sc-calcite-text-area-s>*,.sc-calcite-text-area-h[disabled] .sc-calcite-text-area-s>*{pointer-events:none}/*!@:host*/.sc-calcite-text-area-h{position:relative;display:inline-block;block-size:100%;inline-size:100%}/*!@textarea*/textarea.sc-calcite-text-area{position:relative;margin:0px;box-sizing:border-box;display:block;inline-size:100%;border-width:1px;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1);font-family:var(--calcite-sans-family);color:var(--calcite-color-text-1);min-inline-size:12rem;border-block-end:1px solid var(--calcite-color-border-3)}@media screen and (max-width: 480px){/*!@textarea*/textarea.sc-calcite-text-area{resize:none}}/*!@textarea:focus*/textarea.sc-calcite-text-area:focus{outline:2px solid 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          )}/*!@textarea.text-area--invalid*/textarea.text-area--invalid.sc-calcite-text-area{border-width:1px;border-block-end-width:1px;border-style:solid;border-color:var(--calcite-color-status-danger)}/*!@textarea.text-area--invalid:focus*/textarea.text-area--invalid.sc-calcite-text-area:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@textarea.footer--slotted*/textarea.footer--slotted.sc-calcite-text-area{min-inline-size:18rem}/*!@.footer*/.footer.sc-calcite-text-area{box-sizing:border-box;display:flex;align-items:center;border-width:1px;border-block-start-width:0px;border-style:solid;border-color:var(--calcite-color-border-input);background-color:var(--calcite-color-foreground-1)}/*!@.character-limit*/.character-limit.sc-calcite-text-area{display:flex;align-items:center;justify-content:flex-end;white-space:nowrap;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}/*!@.character--over-limit*/.character--over-limit.sc-calcite-text-area{font-weight:var(--calcite-font-weight-bold);color:var(--calcite-color-status-danger)}/*!@:host([resize=none]) textarea*/[resize=none].sc-calcite-text-area-h textarea.sc-calcite-text-area{resize:none}/*!@:host([resize=horizontal]) textarea*/[resize=horizontal].sc-calcite-text-area-h textarea.sc-calcite-text-area{resize:horizontal}/*!@:host([resize=vertical]) textarea*/[resize=vertical].sc-calcite-text-area-h textarea.sc-calcite-text-area{resize:vertical}/*!@:host([scale=s])*/[scale=s].sc-calcite-text-area-h{font-size:var(--calcite-font-size--2)}/*!@:host([scale=s]) .footer*/[scale=s].sc-calcite-text-area-h .footer.sc-calcite-text-area{padding-block:0.25rem;padding-inline:0.5rem;min-block-size:1.75rem}/*!@:host([scale=s]) textarea*/[scale=s].sc-calcite-text-area-h textarea.sc-calcite-text-area{padding-block:0.25rem;padding-inline:0.5rem}/*!@:host([scale=s]) textarea,\n:host([scale=s]) .footer,\n:host([scale=s]) .character-limit*/[scale=s].sc-calcite-text-area-h textarea.sc-calcite-text-area,[scale=s].sc-calcite-text-area-h .footer.sc-calcite-text-area,[scale=s].sc-calcite-text-area-h .character-limit.sc-calcite-text-area{padding-inline-start:0.5rem;font-size:var(--calcite-font-size--2)}/*!@:host([scale=m]) textarea*/[scale=m].sc-calcite-text-area-h textarea.sc-calcite-text-area{padding-block:0.5rem;padding-inline:0.75rem}/*!@:host([scale=m]) .footer*/[scale=m].sc-calcite-text-area-h .footer.sc-calcite-text-area{padding-block:0.5rem;padding-inline:0.75rem;min-block-size:2.25rem}/*!@:host([scale=m]) textarea,\n:host([scale=m]) .footer,\n:host([scale=m]) .character-limit*/[scale=m].sc-calcite-text-area-h textarea.sc-calcite-text-area,[scale=m].sc-calcite-text-area-h .footer.sc-calcite-text-area,[scale=m].sc-calcite-text-area-h .character-limit.sc-calcite-text-area{padding-inline-start:0.75rem;font-size:var(--calcite-font-size--1)}/*!@:host([scale=l])*/[scale=l].sc-calcite-text-area-h{font-size:var(--calcite-font-size-0)}/*!@:host([scale=l]) textarea*/[scale=l].sc-calcite-text-area-h textarea.sc-calcite-text-area{padding-block:0.75rem;padding-inline:1rem}/*!@:host([scale=l]) .footer*/[scale=l].sc-calcite-text-area-h .footer.sc-calcite-text-area{padding-block:0.75rem;padding-inline:1rem;min-block-size:2.75rem}/*!@:host([scale=l]) textarea,\n:host([scale=l]) .footer,\n:host([scale=l]) .character-limit*/[scale=l].sc-calcite-text-area-h textarea.sc-calcite-text-area,[scale=l].sc-calcite-text-area-h .footer.sc-calcite-text-area,[scale=l].sc-calcite-text-area-h .character-limit.sc-calcite-text-area{padding-inline-start:1rem;font-size:var(--calcite-font-size-0)}/*!@:host([status=invalid]) textarea*/[status=invalid].sc-calcite-text-area-h textarea.sc-calcite-text-area{border-color:var(--calcite-color-status-danger)}/*!@:host([status=invalid]) textarea:focus*/[status=invalid].sc-calcite-text-area-h textarea.sc-calcite-text-area:focus{outline:2px solid var(--calcite-color-status-danger);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          )}/*!@.readonly*/.readonly.sc-calcite-text-area{background-color:var(--calcite-color-background);font-weight:var(--calcite-font-weight-medium)}/*!@:host([disabled]) textarea,\n:host([disabled]) footer*/[disabled].sc-calcite-text-area-h textarea.sc-calcite-text-area,[disabled].sc-calcite-text-area-h footer.sc-calcite-text-area{opacity:0.5}/*!@.border--color*/.border--color.sc-calcite-text-area{border-block-end-width:1px;border-color:var(--calcite-color-border-input)}/*!@.border--color:focus*/.border--color.sc-calcite-text-area:focus{border-block-end-width:2px}/*!@textarea.block-size--full*/textarea.block-size--full.sc-calcite-text-area{block-size:100%}/*!@.content,\n.hide*/.content.sc-calcite-text-area,.hide.sc-calcite-text-area{display:none}/*!@.container*/.container.sc-calcite-text-area{display:flex;inline-size:100%;justify-content:space-between}/*!@.footer--end-only*/.footer--end-only.sc-calcite-text-area{justify-content:flex-end}/*!@.assistive-text*/.assistive-text.sc-calcite-text-area{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}/*!@.validation-container*/.validation-container.sc-calcite-text-area{padding-block-start:0.5rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}/*!@::slotted(input[slot=hidden-form-input])*/.sc-calcite-text-area-s>input[slot=hidden-form-input]{margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}/*!@:host([disabled]) ::slotted([calcite-hydrated][disabled]),\n:host([disabled]) [calcite-hydrated][disabled]*/.sc-calcite-text-area-h[disabled] .sc-calcite-text-area-s>[calcite-hydrated][disabled],[disabled].sc-calcite-text-area-h [calcite-hydrated][disabled].sc-calcite-text-area{opacity:1}/*!@:host([hidden])*/[hidden].sc-calcite-text-area-h{display:none}/*!@[hidden]*/[hidden].sc-calcite-text-area{display:none}";
 
 /**
  * @slot - A slot for adding text.
@@ -42843,6 +42914,8 @@ class TextArea {
         this.label = undefined;
         this.maxLength = undefined;
         this.messages = undefined;
+        this.validationMessage = undefined;
+        this.validationIcon = undefined;
         this.name = undefined;
         this.numberingSystem = undefined;
         this.placeholder = undefined;
@@ -42912,7 +42985,7 @@ class TextArea {
             }, ref: (el) => (this.footerEl = el) }, hAsync("div", { class: {
                 [CSS$8.container]: true,
                 [CSS$8.footerEndSlotOnly]: !this.startSlotHasElements && this.endSlotHasElements,
-            } }, hAsync("slot", { name: SLOTS$4.footerStart, onSlotchange: (event) => (this.startSlotHasElements = slotChangeHasAssignedElement(event)) }), hAsync("slot", { name: SLOTS$4.footerEnd, onSlotchange: (event) => (this.endSlotHasElements = slotChangeHasAssignedElement(event)) })), this.renderCharacterLimit()), hAsync(HiddenFormInputSlot, { component: this }), this.isCharacterLimitExceeded() && (hAsync("span", { "aria-hidden": true, "aria-live": "polite", class: CSS$8.assistiveText, id: this.guid }, this.replacePlaceHoldersInMessages()))));
+            } }, hAsync("slot", { name: SLOTS$4.footerStart, onSlotchange: (event) => (this.startSlotHasElements = slotChangeHasAssignedElement(event)) }), hAsync("slot", { name: SLOTS$4.footerEnd, onSlotchange: (event) => (this.endSlotHasElements = slotChangeHasAssignedElement(event)) })), this.renderCharacterLimit()), hAsync(HiddenFormInputSlot, { component: this }), this.isCharacterLimitExceeded() && (hAsync("span", { "aria-hidden": true, "aria-live": "polite", class: CSS$8.assistiveText, id: this.guid }, this.replacePlaceHoldersInMessages())), this.validationMessage ? (hAsync(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null));
     }
     //--------------------------------------------------------------------------
     //
@@ -43012,6 +43085,8 @@ class TextArea {
             "label": [1],
             "maxLength": [514, "max-length"],
             "messages": [1040],
+            "validationMessage": [1, "validation-message"],
+            "validationIcon": [8, "validation-icon"],
             "name": [513],
             "numberingSystem": [1, "numbering-system"],
             "placeholder": [1],