@esri/calcite-components 2.12.0 → 2.13.0-next.0

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

@@ -1,21 +1,21 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, h, g as getElement } from './index-42a09246.js';
-import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-1885c3b2.js';
-import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-8f8e603e.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-1fb421c2.js';
-import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-c8bd5ea9.js';
-import { S as SLOTS$1 } from './resources-aaad0e9c.js';
-import { b as slotChangeHasAssignedElement } from './dom-14c76f9f.js';
-import { S as SLOTS, I as ICONS, C as CSS } from './resources-dd7b12f1.js';
-import './observers-a1e25392.js';
-import './browser-71ae41c0.js';
-import './key-a886a13d.js';
-import './guid-295f272c.js';
-import './resources-29b6200e.js';
+import { r as registerInstance, h, g as getElement } from './index-e26a2673.js';
+import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-e40c2328.js';
+import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-ba927215.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-148c87e2.js';
+import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-a9346fa2.js';
+import { S as SLOTS$1 } from './resources-14228d0b.js';
+import { b as slotChangeHasAssignedElement } from './dom-0a2d343d.js';
+import { S as SLOTS, I as ICONS, C as CSS } from './resources-49fd8de0.js';
+import './observers-9d559dd4.js';
+import './browser-2359dc60.js';
+import './key-9db0a66c.js';
+import './guid-3e6afeac.js';
+import './resources-0b479a79.js';
 
 const actionGroupCss = ":host{box-sizing:border-box;background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}:host *{box-sizing:border-box}:host{display:flex;flex-direction:column;padding:0px;background-color:transparent;border-color:var(--calcite-action-group-border-color, var(--calcite-color-border-3));border-style:solid;border-width:0}.container{display:flex;flex-grow:1;flex-direction:column}:host([columns=\"1\"]){--calcite-internal-action-group-columns:1}:host([columns=\"2\"]){--calcite-internal-action-group-columns:2}:host([columns=\"3\"]){--calcite-internal-action-group-columns:3}:host([columns=\"4\"]){--calcite-internal-action-group-columns:4}:host([columns=\"5\"]){--calcite-internal-action-group-columns:5}:host([columns=\"6\"]){--calcite-internal-action-group-columns:6}:host(:first-child){padding-block-start:0px}:host([layout=horizontal]),:host([layout=horizontal]) .container{flex-direction:row}:host([layout=grid]){display:grid}:host([layout=grid]) .container{display:grid;place-content:stretch;background-color:transparent;grid-template-columns:repeat(var(--calcite-action-group-columns, var(--calcite-internal-action-group-columns, 3)), auto);gap:var(--calcite-action-group-gap, 1px);padding:var(--calcite-action-group-gap, 1px)}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteActionGroupStyle0 = actionGroupCss;

package/dist/esm/calcite-action-menu.entry.js

@@ -1,17 +1,17 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, c as createEvent, h, F as Fragment, g as getElement } from './index-42a09246.js';
-import { g as getRoundRobinIndex } from './array-5b9b43be.js';
-import { t as toAriaBoolean, d as focusElement } from './dom-14c76f9f.js';
-import { g as guid } from './guid-295f272c.js';
-import { i as isActivationKey } from './key-a886a13d.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-8f8e603e.js';
-import { a as activeAttr, C as CSS, I as ICONS, S as SLOTS } from './resources-aaad0e9c.js';
-import './resources-29b6200e.js';
-import './browser-71ae41c0.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment, g as getElement } from './index-e26a2673.js';
+import { g as getRoundRobinIndex } from './array-38a8028e.js';
+import { t as toAriaBoolean, d as focusElement } from './dom-0a2d343d.js';
+import { g as guid } from './guid-3e6afeac.js';
+import { i as isActivationKey } from './key-9db0a66c.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-ba927215.js';
+import { a as activeAttr, C as CSS, I as ICONS, S as SLOTS } from './resources-14228d0b.js';
+import './resources-0b479a79.js';
+import './browser-2359dc60.js';
 
 const actionMenuCss = ":host{box-sizing:border-box;display:flex;flex-direction:column;font-size:var(--calcite-font-size-1)}::slotted(calcite-action-group:not(:last-of-type)){border-block-end-width:var(--calcite-border-width-sm)}.default-trigger{position:relative;block-size:100%;flex:0 1 auto;align-self:stretch}slot[name=trigger]::slotted(calcite-action),calcite-action::slotted([slot=trigger]){position:relative;block-size:100%;flex:0 1 auto;align-self:stretch}.menu{display:flex;max-block-size:45vh;flex-direction:column;flex-wrap:nowrap;overflow-y:auto;overflow-x:hidden;outline:2px solid transparent;outline-offset:2px;gap:var(--calcite-action-menu-items-space, 0)}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteActionMenuStyle0 = actionMenuCss;

package/dist/esm/calcite-action-pad.entry.js

@@ -1,22 +1,22 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-42a09246.js';
-import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-1885c3b2.js';
-import { s as slotChangeGetAssignedElements } from './dom-14c76f9f.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-8f8e603e.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-1fb421c2.js';
-import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-c8bd5ea9.js';
-import { t as toggleChildActionText, E as ExpandToggle } from './ExpandToggle-d0df6ce4.js';
-import { c as createObserver } from './observers-a1e25392.js';
-import './guid-295f272c.js';
-import './resources-29b6200e.js';
-import './browser-71ae41c0.js';
-import './key-a886a13d.js';
-import './resources-dd7b12f1.js';
-import './resources-aaad0e9c.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-e26a2673.js';
+import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-e40c2328.js';
+import { s as slotChangeGetAssignedElements } from './dom-0a2d343d.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-ba927215.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-148c87e2.js';
+import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-a9346fa2.js';
+import { t as toggleChildActionText, E as ExpandToggle } from './ExpandToggle-1bf2bfbd.js';
+import { c as createObserver } from './observers-9d559dd4.js';
+import './guid-3e6afeac.js';
+import './resources-0b479a79.js';
+import './browser-2359dc60.js';
+import './key-9db0a66c.js';
+import './resources-49fd8de0.js';
+import './resources-14228d0b.js';
 
 const CSS = {
     actionGroupEnd: "action-group--end",

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

@@ -1,20 +1,20 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-42a09246.js';
-import { t as toAriaBoolean } from './dom-14c76f9f.js';
-import { g as guid } from './guid-295f272c.js';
-import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-31600299.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-8f8e603e.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-1fb421c2.js';
-import { c as createObserver } from './observers-a1e25392.js';
-import { g as getIconScale } from './component-3bb9cc9e.js';
-import { u as updateMessages, c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n-c8bd5ea9.js';
-import { i as isBrowser } from './browser-71ae41c0.js';
-import './resources-29b6200e.js';
-import './key-a886a13d.js';
+import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-e26a2673.js';
+import { t as toAriaBoolean } from './dom-0a2d343d.js';
+import { g as guid } from './guid-3e6afeac.js';
+import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-c9d28c64.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-ba927215.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-148c87e2.js';
+import { c as createObserver } from './observers-9d559dd4.js';
+import { g as getIconScale } from './component-4569dc03.js';
+import { u as updateMessages, c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n-a9346fa2.js';
+import { i as isBrowser } from './browser-2359dc60.js';
+import './resources-0b479a79.js';
+import './key-9db0a66c.js';
 
 const CSS = {
     button: "button",

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

@@ -1,21 +1,21 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-42a09246.js';
-import { b as slotChangeHasAssignedElement, t as toAriaBoolean, e as getSlotted, h as setRequestedIcon } from './dom-14c76f9f.js';
-import { g as getIconScale } from './component-3bb9cc9e.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-8f8e603e.js';
-import { N as NumberStringFormat, c as connectLocalized, d as disconnectLocalized } from './locale-1fb421c2.js';
-import { o as onToggleOpenCloseComponent } from './openCloseComponent-764c8b02.js';
-import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-c8bd5ea9.js';
-import { K as KindIcons } from './resources-980c8d09.js';
-import './guid-295f272c.js';
-import './resources-29b6200e.js';
-import './browser-71ae41c0.js';
-import './key-a886a13d.js';
-import './observers-a1e25392.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-e26a2673.js';
+import { b as slotChangeHasAssignedElement, t as toAriaBoolean, e as getSlotted, h as setRequestedIcon } from './dom-0a2d343d.js';
+import { g as getIconScale } from './component-4569dc03.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-ba927215.js';
+import { N as NumberStringFormat, c as connectLocalized, d as disconnectLocalized } from './locale-148c87e2.js';
+import { o as onToggleOpenCloseComponent } from './openCloseComponent-e90fd477.js';
+import { c as connectMessages, s as setUpMessages, d as disconnectMessages, u as updateMessages } from './t9n-a9346fa2.js';
+import { K as KindIcons } from './resources-e0592334.js';
+import './guid-3e6afeac.js';
+import './resources-0b479a79.js';
+import './browser-2359dc60.js';
+import './key-9db0a66c.js';
+import './observers-9d559dd4.js';
 
 const DURATIONS = {
     slow: 14000,

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

@@ -1,13 +1,13 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, h, g as getElement } from './index-42a09246.js';
-import { i as getModeName } from './dom-14c76f9f.js';
-import { h as hexToRGB, i as isValidHex } from './utils-bb481c58.js';
-import './guid-295f272c.js';
-import './resources-29b6200e.js';
+import { r as registerInstance, h, g as getElement } from './index-e26a2673.js';
+import { i as getModeName } from './dom-0a2d343d.js';
+import { h as hexToRGB, i as isValidHex } from './utils-64fb37db.js';
+import './guid-3e6afeac.js';
+import './resources-0b479a79.js';
 
 const CSS = {
     thumbnail: "thumbnail",

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

@@ -1,22 +1,22 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-42a09246.js';
-import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-1885c3b2.js';
-import { b as slotChangeHasAssignedElement, f as focusFirstTabbable, e as getSlotted, t as toAriaBoolean } from './dom-14c76f9f.js';
-import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-31600299.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-1fb421c2.js';
-import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-c8bd5ea9.js';
-import { H as Heading } from './Heading-92af9aa3.js';
-import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-8f8e603e.js';
-import { o as onToggleOpenCloseComponent } from './openCloseComponent-764c8b02.js';
-import { i as isActivationKey } from './key-a886a13d.js';
-import './observers-a1e25392.js';
-import './browser-71ae41c0.js';
-import './guid-295f272c.js';
-import './resources-29b6200e.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-e26a2673.js';
+import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-e40c2328.js';
+import { b as slotChangeHasAssignedElement, f as focusFirstTabbable, e as getSlotted, t as toAriaBoolean } from './dom-0a2d343d.js';
+import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-c9d28c64.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-148c87e2.js';
+import { u as updateMessages, c as connectMessages, d as disconnectMessages, s as setUpMessages } from './t9n-a9346fa2.js';
+import { H as Heading } from './Heading-c26344ff.js';
+import { c as componentFocusable, s as setUpLoadableComponent, a as setComponentLoaded } from './loadable-ba927215.js';
+import { o as onToggleOpenCloseComponent } from './openCloseComponent-e90fd477.js';
+import { i as isActivationKey } from './key-9db0a66c.js';
+import './observers-9d559dd4.js';
+import './browser-2359dc60.js';
+import './guid-3e6afeac.js';
+import './resources-0b479a79.js';
 
 const IDS$1 = {
     content: "content",

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

@@ -1,22 +1,22 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, f as forceUpdate, h, g as getElement } from './index-42a09246.js';
-import { s as submitForm, r as resetForm, f as findAssociatedForm } from './form-00e9ec02.js';
-import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-31600299.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-db7df9cd.js';
-import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-8f8e603e.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-1fb421c2.js';
-import { c as createObserver } from './observers-a1e25392.js';
-import { g as getIconScale } from './component-3bb9cc9e.js';
-import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-c8bd5ea9.js';
-import { t as toAriaBoolean } from './dom-14c76f9f.js';
-import { i as isBrowser } from './browser-71ae41c0.js';
-import './key-a886a13d.js';
-import './guid-295f272c.js';
-import './resources-29b6200e.js';
+import { r as registerInstance, f as forceUpdate, h, g as getElement } from './index-e26a2673.js';
+import { s as submitForm, r as resetForm, f as findAssociatedForm } from './form-bddcd309.js';
+import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction, I as InteractiveContainer } from './interactive-c9d28c64.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-699ce53e.js';
+import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable-ba927215.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-148c87e2.js';
+import { c as createObserver } from './observers-9d559dd4.js';
+import { g as getIconScale } from './component-4569dc03.js';
+import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-a9346fa2.js';
+import { t as toAriaBoolean } from './dom-0a2d343d.js';
+import { i as isBrowser } from './browser-2359dc60.js';
+import './key-9db0a66c.js';
+import './guid-3e6afeac.js';
+import './resources-0b479a79.js';
 
 const CSS = {
     buttonLoader: "calcite-button--loader",

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

@@ -1,17 +1,17 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-42a09246.js';
-import { k as focusElementInGroup, d as focusElement, t as toAriaBoolean } from './dom-14c76f9f.js';
-import { c as connectInteractive, u as updateHostInteraction, d as disconnectInteractive, I as InteractiveContainer } from './interactive-31600299.js';
-import { a as setComponentLoaded, s as setUpLoadableComponent, b as componentLoaded } from './loadable-8f8e603e.js';
-import './guid-295f272c.js';
-import './resources-29b6200e.js';
-import './browser-71ae41c0.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-e26a2673.js';
+import { k as focusElementInGroup, d as focusElement, t as toAriaBoolean } from './dom-0a2d343d.js';
+import { c as connectInteractive, u as updateHostInteraction, d as disconnectInteractive, I as InteractiveContainer } from './interactive-c9d28c64.js';
+import { a as setComponentLoaded, s as setUpLoadableComponent, b as componentLoaded } from './loadable-ba927215.js';
+import './guid-3e6afeac.js';
+import './resources-0b479a79.js';
+import './browser-2359dc60.js';
 
-const cardGroupCss = ":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{--calcite-card-group-gap:var(--calcite-size-md);display:block}.container{display:flex;flex-wrap:wrap;gap:var(--calcite-card-group-gap)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";
+const cardGroupCss = ":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block}.container{display:flex;flex-wrap:wrap;gap:var(--calcite-card-group-space, var(--calcite-card-group-gap, var(--calcite-size-md)))}:host([hidden]){display:none}[hidden]{display:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}";
 const CalciteCardGroupStyle0 = cardGroupCss;
 
 const CardGroup = class {

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

@@ -1 +1 @@
-{"file":"calcite-card-group.entry.js","mappings":"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","names":[],"sources":["src/components/card-group/card-group.scss?tag=calcite-card-group&encapsulation=shadow","src/components/card-group/card-group.tsx"],"sourcesContent":["/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-card-group-gap: Specifies the gap between slotted components.\n */\n\n:host {\n  --calcite-card-group-gap: var(--calcite-size-md);\n  display: block;\n}\n\n.container {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--calcite-card-group-gap);\n}\n\n@include disabled();\n@include base-component();\n","import {\n  Component,\n  h,\n  VNode,\n  Prop,\n  Element,\n  Listen,\n  EventEmitter,\n  Event,\n  Method,\n  Watch,\n  Host,\n} from \"@stencil/core\";\nimport { focusElement, focusElementInGroup, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { SelectionMode } from \"../interfaces\";\nimport {\n  LoadableComponent,\n  componentLoaded,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\n\n/**\n * @slot - A slot for adding one or more `calcite-card`s.\n */\n\n@Component({\n  tag: \"calcite-card-group\",\n  styleUrl: \"card-group.scss\",\n  shadow: true,\n})\nexport class CardGroup implements InteractiveComponent, LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Element\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteCardGroupElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Accessible name for the component. */\n  @Prop() label!: string;\n\n  /** Specifies the selection mode of the component. */\n  @Prop({ reflect: true }) selectionMode: Extract<\n    \"multiple\" | \"single\" | \"single-persist\" | \"none\",\n    SelectionMode\n  > = \"none\";\n\n  @Watch(\"selectionMode\")\n  onSelectionModeChange(): void {\n    this.udpateItemsOnSelectionModeChange();\n  }\n\n  /**\n   * Specifies the component's selected items.\n   *\n   * @readonly\n   */\n  @Prop({ mutable: true }) selectedItems: HTMLCalciteCardElement[] = [];\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  private items: HTMLCalciteCardElement[] = [];\n\n  private slotRefEl: HTMLSlotElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Emits when the component's selection changes and the `selectionMode` is not `none`. */\n  @Event({ cancelable: false }) calciteCardGroupSelect: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalCardKeyEvent\")\n  calciteInternalCardKeyEventListener(event: KeyboardEvent): void {\n    if (event.composedPath().includes(this.el)) {\n      const interactiveItems = this.items.filter((el) => !el.disabled);\n      switch (event.detail[\"key\"]) {\n        case \"ArrowRight\":\n          focusElementInGroup(interactiveItems, event.target as HTMLCalciteCardElement, \"next\");\n          break;\n        case \"ArrowLeft\":\n          focusElementInGroup(interactiveItems, event.target as HTMLCalciteCardElement, \"previous\");\n          break;\n        case \"Home\":\n          focusElementInGroup(interactiveItems, event.target as HTMLCalciteCardElement, \"first\");\n          break;\n        case \"End\":\n          focusElementInGroup(interactiveItems, event.target as HTMLCalciteCardElement, \"last\");\n          break;\n      }\n    }\n  }\n\n  @Listen(\"calciteCardSelect\")\n  calciteCardSelectListener(event: CustomEvent): void {\n    if (\n      event.composedPath().includes(this.el) &&\n      !(event.target as HTMLCalciteCardElement).selectable\n    ) {\n      this.setSelectedItems(true, event.target as HTMLCalciteCardElement);\n    }\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's first focusable element.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentLoaded(this);\n    if (!this.disabled) {\n      focusElement(this.items[0]);\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private udpateItemsOnSelectionModeChange = (): void => {\n    this.updateSlottedItems(this.slotRefEl);\n    this.updateSelectedItems();\n  };\n\n  private updateItemsOnSlotChange = (event: Event): void => {\n    this.updateSlottedItems(event.target as HTMLSlotElement);\n    this.updateSelectedItems();\n  };\n\n  private updateSlottedItems = (target: HTMLSlotElement): void => {\n    this.items = target\n      .assignedElements({ flatten: true })\n      .filter((el) => el?.matches(\"calcite-card\")) as HTMLCalciteCardElement[];\n  };\n\n  private updateSelectedItems = (): void => {\n    this.items.forEach((el) => {\n      el.selectionMode = this.selectionMode;\n    });\n\n    this.setSelectedItems(false);\n  };\n\n  private setSelectedItems = (emit: boolean, elToMatch?: HTMLCalciteCardElement): void => {\n    if (elToMatch) {\n      this.items.forEach((el) => {\n        const matchingEl = elToMatch === el;\n        switch (this.selectionMode) {\n          case \"multiple\":\n            if (matchingEl) {\n              el.selected = !el.selected;\n            }\n            break;\n\n          case \"single\":\n            el.selected = matchingEl ? !el.selected : false;\n            break;\n\n          case \"single-persist\":\n            el.selected = !!matchingEl;\n            break;\n        }\n      });\n    }\n\n    this.selectedItems = this.items.filter((el) => el.selected);\n\n    if (emit && this.selectionMode !== \"none\" && !this.disabled) {\n      this.calciteCardGroupSelect.emit();\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const role =\n      this.selectionMode === \"none\" || this.selectionMode === \"multiple\" ? \"group\" : \"radiogroup\";\n\n    return (\n      <Host>\n        <InteractiveContainer disabled={this.disabled}>\n          <div\n            aria-disabled={toAriaBoolean(this.disabled)}\n            aria-label={this.label}\n            class=\"container\"\n            role={role}\n          >\n            <slot\n              onSlotchange={this.updateItemsOnSlotChange}\n              ref={(el) => (this.slotRefEl = el as HTMLSlotElement)}\n            />\n          </div>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"calcite-card-group.entry.js","mappings":"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","names":[],"sources":["src/components/card-group/card-group.scss?tag=calcite-card-group&encapsulation=shadow","src/components/card-group/card-group.tsx"],"sourcesContent":["/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-card-group-gap: [Deprecated] Use --calcite-card-group-space. Specifies the gap between slotted components.\n * @prop --calcite-card-group-space: Specifies the space between slotted components.\n */\n\n:host {\n  @apply block;\n}\n\n.container {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--calcite-card-group-space, var(--calcite-card-group-gap, var(--calcite-size-md)));\n}\n\n@include base-component();\n@include disabled();\n","import {\n  Component,\n  h,\n  VNode,\n  Prop,\n  Element,\n  Listen,\n  EventEmitter,\n  Event,\n  Method,\n  Watch,\n  Host,\n} from \"@stencil/core\";\nimport { focusElement, focusElementInGroup, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { SelectionMode } from \"../interfaces\";\nimport {\n  LoadableComponent,\n  componentLoaded,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\n\n/**\n * @slot - A slot for adding one or more `calcite-card`s.\n */\n\n@Component({\n  tag: \"calcite-card-group\",\n  styleUrl: \"card-group.scss\",\n  shadow: true,\n})\nexport class CardGroup implements InteractiveComponent, LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Element\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteCardGroupElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Accessible name for the component. */\n  @Prop() label!: string;\n\n  /** Specifies the selection mode of the component. */\n  @Prop({ reflect: true }) selectionMode: Extract<\n    \"multiple\" | \"single\" | \"single-persist\" | \"none\",\n    SelectionMode\n  > = \"none\";\n\n  @Watch(\"selectionMode\")\n  onSelectionModeChange(): void {\n    this.udpateItemsOnSelectionModeChange();\n  }\n\n  /**\n   * Specifies the component's selected items.\n   *\n   * @readonly\n   */\n  @Prop({ mutable: true }) selectedItems: HTMLCalciteCardElement[] = [];\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  private items: HTMLCalciteCardElement[] = [];\n\n  private slotRefEl: HTMLSlotElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Emits when the component's selection changes and the `selectionMode` is not `none`. */\n  @Event({ cancelable: false }) calciteCardGroupSelect: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalCardKeyEvent\")\n  calciteInternalCardKeyEventListener(event: KeyboardEvent): void {\n    if (event.composedPath().includes(this.el)) {\n      const interactiveItems = this.items.filter((el) => !el.disabled);\n      switch (event.detail[\"key\"]) {\n        case \"ArrowRight\":\n          focusElementInGroup(interactiveItems, event.target as HTMLCalciteCardElement, \"next\");\n          break;\n        case \"ArrowLeft\":\n          focusElementInGroup(interactiveItems, event.target as HTMLCalciteCardElement, \"previous\");\n          break;\n        case \"Home\":\n          focusElementInGroup(interactiveItems, event.target as HTMLCalciteCardElement, \"first\");\n          break;\n        case \"End\":\n          focusElementInGroup(interactiveItems, event.target as HTMLCalciteCardElement, \"last\");\n          break;\n      }\n    }\n  }\n\n  @Listen(\"calciteCardSelect\")\n  calciteCardSelectListener(event: CustomEvent): void {\n    if (\n      event.composedPath().includes(this.el) &&\n      !(event.target as HTMLCalciteCardElement).selectable\n    ) {\n      this.setSelectedItems(true, event.target as HTMLCalciteCardElement);\n    }\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's first focusable element.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentLoaded(this);\n    if (!this.disabled) {\n      focusElement(this.items[0]);\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private udpateItemsOnSelectionModeChange = (): void => {\n    this.updateSlottedItems(this.slotRefEl);\n    this.updateSelectedItems();\n  };\n\n  private updateItemsOnSlotChange = (event: Event): void => {\n    this.updateSlottedItems(event.target as HTMLSlotElement);\n    this.updateSelectedItems();\n  };\n\n  private updateSlottedItems = (target: HTMLSlotElement): void => {\n    this.items = target\n      .assignedElements({ flatten: true })\n      .filter((el) => el?.matches(\"calcite-card\")) as HTMLCalciteCardElement[];\n  };\n\n  private updateSelectedItems = (): void => {\n    this.items.forEach((el) => {\n      el.selectionMode = this.selectionMode;\n    });\n\n    this.setSelectedItems(false);\n  };\n\n  private setSelectedItems = (emit: boolean, elToMatch?: HTMLCalciteCardElement): void => {\n    if (elToMatch) {\n      this.items.forEach((el) => {\n        const matchingEl = elToMatch === el;\n        switch (this.selectionMode) {\n          case \"multiple\":\n            if (matchingEl) {\n              el.selected = !el.selected;\n            }\n            break;\n\n          case \"single\":\n            el.selected = matchingEl ? !el.selected : false;\n            break;\n\n          case \"single-persist\":\n            el.selected = !!matchingEl;\n            break;\n        }\n      });\n    }\n\n    this.selectedItems = this.items.filter((el) => el.selected);\n\n    if (emit && this.selectionMode !== \"none\" && !this.disabled) {\n      this.calciteCardGroupSelect.emit();\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const role =\n      this.selectionMode === \"none\" || this.selectionMode === \"multiple\" ? \"group\" : \"radiogroup\";\n\n    return (\n      <Host>\n        <InteractiveContainer disabled={this.disabled}>\n          <div\n            aria-disabled={toAriaBoolean(this.disabled)}\n            aria-label={this.label}\n            class=\"container\"\n            role={role}\n          >\n            <slot\n              onSlotchange={this.updateItemsOnSlotChange}\n              ref={(el) => (this.slotRefEl = el as HTMLSlotElement)}\n            />\n          </div>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"],"version":3}

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

@@ -1,19 +1,19 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.12.0
+ * v2.13.0-next.0
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-42a09246.js';
-import { b as slotChangeHasAssignedElement, e as getSlotted, t as toAriaBoolean } from './dom-14c76f9f.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-1fb421c2.js';
-import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-c8bd5ea9.js';
-import { c as componentFocusable, a as setComponentLoaded, s as setUpLoadableComponent } from './loadable-8f8e603e.js';
-import { c as connectInteractive, u as updateHostInteraction, d as disconnectInteractive, I as InteractiveContainer } from './interactive-31600299.js';
-import { i as isActivationKey } from './key-a886a13d.js';
-import './guid-295f272c.js';
-import './resources-29b6200e.js';
-import './observers-a1e25392.js';
-import './browser-71ae41c0.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-e26a2673.js';
+import { b as slotChangeHasAssignedElement, e as getSlotted, t as toAriaBoolean } from './dom-0a2d343d.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-148c87e2.js';
+import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n-a9346fa2.js';
+import { c as componentFocusable, a as setComponentLoaded, s as setUpLoadableComponent } from './loadable-ba927215.js';
+import { c as connectInteractive, u as updateHostInteraction, d as disconnectInteractive, I as InteractiveContainer } from './interactive-c9d28c64.js';
+import { i as isActivationKey } from './key-9db0a66c.js';
+import './guid-3e6afeac.js';
+import './resources-0b479a79.js';
+import './observers-9d559dd4.js';
+import './browser-2359dc60.js';
 
 const CSS = {
     container: "container",
@@ -45,7 +45,7 @@ const ICONS = {
     unselectedSingle: "circle",
 };
 
-const cardCss = ":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block;max-inline-size:100%;--calcite-card-corner-radius:var(--calcite-corner-radius-sharp);--calcite-card-background-color:var(--calcite-color-foreground-1);--calcite-card-border-color:var(--calcite-color-border-3);--calcite-card-shadow:var(--calcite-shadow-none);--calcite-card-accent-color-selected:var(--calcite-color-brand);--calcite-card-selection-background-color:transparent;--calcite-card-selection-background-color-hover:var(--calcite-color-transparent-hover);--calcite-card-selection-background-color-active:var(--calcite-color-transparent-press);--calcite-card-selection-background-color-selected:transparent;--calcite-card-selection-icon-color:var(--calcite-color-text-3);--calcite-card-selection-icon-color-hover:var(--calcite-color-text-2);--calcite-card-selection-icon-color-selected:var(--calcite-color-brand)}.content-wrapper{position:relative;display:flex;block-size:100%;flex-direction:column;justify-content:space-between;overflow:hidden;border:var(--calcite-border-width-sm) solid var(--calcite-card-border-color);border-radius:var(--calcite-card-corner-radius);background-color:var(--calcite-card-background-color);box-shadow:var(--calcite-card-shadow);pointer-events:none}::slotted(*){pointer-events:auto}:host(:not([selectable])) .content-wrapper:not(.non-interactive){outline-color:transparent}:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.container{position:relative;display:flex;flex:1 1 auto;flex-direction:column}:host([loading]) .content-wrapper *:not(calcite-loader):not(.calcite-card-loader-container){pointer-events:none;opacity:0}:host([loading]) .calcite-card-loader-container{position:absolute;inset:0px;display:flex;align-items:center}.header{display:flex;flex-direction:row;align-items:flex-start}.footer{margin-block-start:auto;display:flex;flex-direction:row;align-content:space-between;justify-content:space-between;padding-inline:var(--calcite-spacing-md);padding-block-start:var(--calcite-spacing-xxs);padding-block-end:var(--calcite-spacing-md)}.header-text-container{display:flex;inline-size:100%;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem}.header-text-container:not(:only-child){padding-inline-end:0.125rem}.footer{margin-block-start:auto;flex-direction:row;align-content:space-between;justify-content:space-between;padding-inline:0.75rem;padding-block:0.25rem 0.75rem}.card-content{block-size:auto;font-size:var(--calcite-font-size--2);line-height:1.375}.has-slotted-content{padding:0.75rem}:host([selected]) .content-wrapper{box-shadow:inset 0 -4px 0 0 var(--calcite-card-accent-color-selected)}:host([selectable]) .header{padding-inline-end:var(--calcite-spacing-xxxl)}slot[name=title]::slotted(*),*::slotted([slot=title]){margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}slot[name=subtitle]::slotted(*),*::slotted([slot=subtitle]){margin:0px;margin-block-start:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}slot[name=heading]::slotted(*),*::slotted([slot=heading]){margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}slot[name=description]::slotted(*),*::slotted([slot=description]){margin:0px;margin-block-start:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}slot[name=thumbnail]::slotted(img),img::slotted([slot=thumbnail]){min-inline-size:100%;max-inline-size:100%}slot[name=footer-start]::slotted(*),*::slotted([slot=footer-start]){align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375;margin-inline-end:auto}slot[name=footer-end]::slotted(*),*::slotted([slot=footer-end]){align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375}.checkbox-wrapper-deprecated{pointer-events:auto;position:absolute;inset-block-start:var(--calcite-spacing-sm);inset-inline-end:var(--calcite-spacing-sm);margin:0;padding:0}.checkbox-wrapper{pointer-events:auto;margin:0.5rem;cursor:pointer;padding:0.5rem;outline-color:transparent;background-color:var(--calcite-card-selection-background-color);display:flex;align-items:center;justify-items:center;--calcite-icon-color:var(--calcite-card-selection-icon-color)}.checkbox-wrapper:hover{background-color:var(--calcite-card-selection-background-color-hover);--calcite-icon-color:var(--calcite-card-selection-icon-color-hover)}.checkbox-wrapper:active{background-color:var(--calcite-card-selection-background-color-active)}.checkbox-wrapper calcite-icon{pointer-events:none}:host([selected]) .checkbox-wrapper{--calcite-icon-color:var(--calcite-card-selection-icon-color-selected);background-color:var(--calcite-card-selection-background-color-selected)}:host([selected]) .checkbox-wrapper:hover{background-color:var(--calcite-card-selection-background-color-hover)}:host([selected]) .checkbox-wrapper:active{background-color:var(--calcite-card-selection-background-color-active)}:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper{background-color:var(--calcite-card-selection-background-color-hover);--calcite-icon-color:var(--calcite-card-selection-icon-color-hover)}:host([selected]:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper{background-color:var(--calcite-card-selection-background-color-active);--calcite-icon-color:var(--calcite-card-selection-icon-color-selected)}.thumbnail-wrapper{display:flex}.content-wrapper.inline{flex-direction:row}.content-wrapper.inline>.container{inline-size:60%}.content-wrapper.inline>.thumbnail-wrapper{inline-size:40%;align-items:flex-start}.content-wrapper.inline slot[name=thumbnail]::slotted(img),.content-wrapper.inline img::slotted([slot=thumbnail]){inline-size:100%}slot[name=footer-start]::slotted(*),slot[name=footer-end]::slotted(*){display:flex;gap:0.25rem}:host([hidden]){display:none}[hidden]{display:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}";
+const cardCss = ":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block;max-inline-size:100%}.content-wrapper{position:relative;display:flex;block-size:100%;flex-direction:column;justify-content:space-between;overflow:hidden;border:var(--calcite-border-width-sm) solid var(--calcite-card-border-color, var(--calcite-color-border-3));border-radius:var(--calcite-card-corner-radius, var(--calcite-corner-radius-sharp));background-color:var(--calcite-card-background-color, var(--calcite-color-foreground-1));box-shadow:var(--calcite-card-shadow, var(--calcite-shadow-none));pointer-events:none}::slotted(*){pointer-events:auto}:host(:not([selectable])) .content-wrapper:not(.non-interactive){outline-color:transparent}:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.container{position:relative;display:flex;flex:1 1 auto;flex-direction:column}:host([loading]) .content-wrapper *:not(calcite-loader):not(.calcite-card-loader-container){pointer-events:none;opacity:0}:host([loading]) .calcite-card-loader-container{position:absolute;inset:0px;display:flex;align-items:center}.header{display:flex;flex-direction:row;align-items:flex-start}.footer{margin-block-start:auto;display:flex;flex-direction:row;align-content:space-between;justify-content:space-between;padding-inline:var(--calcite-spacing-md);padding-block-start:var(--calcite-spacing-xxs);padding-block-end:var(--calcite-spacing-md)}.header-text-container{display:flex;inline-size:100%;flex-direction:column;justify-content:center;padding-inline:0.75rem;padding-block:0.5rem}.header-text-container:not(:only-child){padding-inline-end:0.125rem}.footer{margin-block-start:auto;flex-direction:row;align-content:space-between;justify-content:space-between;padding-inline:0.75rem;padding-block:0.25rem 0.75rem}.card-content{block-size:auto;font-size:var(--calcite-font-size--2);line-height:1.375}.has-slotted-content{padding:0.75rem}:host([selected]) .content-wrapper{box-shadow:inset 0 -4px 0 0 var(--calcite-card-accent-color-selected, var(--calcite-color-brand))}:host([selectable]) .header{padding-inline-end:var(--calcite-spacing-xxxl)}slot[name=title]::slotted(*),*::slotted([slot=title]){margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}slot[name=subtitle]::slotted(*),*::slotted([slot=subtitle]){margin:0px;margin-block-start:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}slot[name=heading]::slotted(*),*::slotted([slot=heading]){margin:0px;font-size:var(--calcite-font-size--1);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-1)}slot[name=description]::slotted(*),*::slotted([slot=description]){margin:0px;margin-block-start:0.125rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-normal);color:var(--calcite-color-text-2)}slot[name=thumbnail]::slotted(img),img::slotted([slot=thumbnail]){min-inline-size:100%;max-inline-size:100%}slot[name=footer-start]::slotted(*),*::slotted([slot=footer-start]){align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375;margin-inline-end:auto}slot[name=footer-end]::slotted(*),*::slotted([slot=footer-end]){align-self:center;font-size:var(--calcite-font-size--2);line-height:1.375}.checkbox-wrapper-deprecated{pointer-events:auto;position:absolute;inset-block-start:var(--calcite-spacing-sm);inset-inline-end:var(--calcite-spacing-sm);margin:0;padding:0;color:var(--calcite-card-selection-color, var(--calcite-color-text-3))}.checkbox-wrapper-deprecated:hover{background-color:var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));color:var(--calcite-card-selection-color-hover, var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2)))}.checkbox-wrapper-deprecated:active{background-color:var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press))}.checkbox-wrapper{pointer-events:auto;margin:0.5rem;cursor:pointer;padding:0.5rem;outline-color:transparent;display:flex;align-items:center;justify-items:center;color:var(--calcite-card-selection-color, var(--calcite-color-text-3))}.checkbox-wrapper:hover{background-color:var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));color:var(--calcite-card-selection-color-hover, var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2)))}.checkbox-wrapper:active{background-color:var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press))}.checkbox-wrapper calcite-icon{pointer-events:none}:host([selected]) .checkbox-wrapper-deprecated,:host([selected]) .checkbox-wrapper{color:var(--calcite-card-accent-color-selected, var(--calcite-card-selection-icon-color-selected, var(--calcite-color-brand)))}:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper-deprecated,:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper{background-color:var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));color:var(--calcite-card-selection-color-hover, var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2)))}:host([selected]:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper-deprecated,:host([selected]:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper{background-color:var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press));color:var(--calcite-card-accent-color-selected, var(--calcite-card-selection-icon-color-selected, var(--calcite-color-brand)))}.thumbnail-wrapper{display:flex}.content-wrapper.inline{flex-direction:row}.content-wrapper.inline>.container{inline-size:60%}.content-wrapper.inline>.thumbnail-wrapper{inline-size:40%;align-items:flex-start}.content-wrapper.inline slot[name=thumbnail]::slotted(img),.content-wrapper.inline img::slotted([slot=thumbnail]){inline-size:100%}slot[name=footer-start]::slotted(*),slot[name=footer-end]::slotted(*){display:flex;gap:0.25rem}:host([hidden]){display:none}[hidden]{display:none}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}";
 const CalciteCardStyle0 = cardCss;
 
 const Card = class {

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

@@ -1 +1 @@
-{"file":"calcite-card.entry.js","mappings":"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","names":[],"sources":["src/components/card/resources.ts","src/components/card/card.scss?tag=calcite-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["export const CSS = {\n  container: \"container\",\n  contentWrapper: \"content-wrapper\",\n  header: \"header\",\n  footer: \"footer\",\n  heading: \"heading\",\n  description: \"description\",\n  checkboxWrapper: \"checkbox-wrapper\",\n  checkboxWrapperDeprecated: \"checkbox-wrapper-deprecated\",\n  thumbnailWrapper: \"thumbnail-wrapper\",\n  headerTextContainer: \"header-text-container\",\n  cardContent: \"card-content\",\n  hasSlottedContent: \"has-slotted-content\",\n};\n\nexport const SLOTS = {\n  thumbnail: \"thumbnail\",\n  heading: \"heading\",\n  description: \"description\",\n  footerStart: \"footer-start\",\n  footerEnd: \"footer-end\",\n  title: \"title\",\n  subtitle: \"subtitle\",\n};\n\nexport const ICONS = {\n  selected: \"check-square-f\",\n  unselected: \"square\",\n  selectedSingle: \"circle-f\",\n  unselectedSingle: \"circle\",\n} as const;\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-card-background-color: Specifies the background color of the component.\n * @prop --calcite-card-border-color: Specifies the border color of the component.\n * @prop --calcite-card-shadow: Specifies the shadow of the component.\n * @prop --calcite-card-corner-radius: Specifies the corner radius of the component.\n * @prop --calcite-card-accent-color-selected: Specifies the accent color of the component when `selected`.\n * @prop --calcite-card-selection-background-color: Specifies the background color of the component's selection element.\n * @prop --calcite-card-selection-background-color-hover: Specifies the background color of the component's selection element when hovered.\n * @prop --calcite-card-selection-background-color-active: Specifies the background color of the component's selection element when active.\n * @prop --calcite-card-selection-background-color-selected: Specifies the icon color of the component's selection element when `selected`.\n * @prop --calcite-card-selection-icon-color: Specifies the icon color of the component's selection element.\n * @prop --calcite-card-selection-icon-color-hover: Specifies the icon color of the component's selection element when hovered.\n * @prop --calcite-card-selection-icon-color-selected: Specifies the icon color of the component's selection element when `selected`.\n *\n */\n\n:host {\n  @apply block max-w-full;\n  --calcite-card-corner-radius: var(--calcite-corner-radius-sharp);\n  --calcite-card-background-color: var(--calcite-color-foreground-1);\n  --calcite-card-border-color: var(--calcite-color-border-3);\n  --calcite-card-shadow: var(--calcite-shadow-none);\n  --calcite-card-accent-color-selected: var(--calcite-color-brand);\n  --calcite-card-selection-background-color: transparent;\n  --calcite-card-selection-background-color-hover: var(--calcite-color-transparent-hover);\n  --calcite-card-selection-background-color-active: var(--calcite-color-transparent-press);\n  --calcite-card-selection-background-color-selected: transparent;\n  --calcite-card-selection-icon-color: var(--calcite-color-text-3);\n  --calcite-card-selection-icon-color-hover: var(--calcite-color-text-2);\n  --calcite-card-selection-icon-color-selected: var(--calcite-color-brand);\n}\n\n.content-wrapper {\n  @apply relative\n    flex\n    h-full\n    flex-col\n    justify-between\n    overflow-hidden;\n  border: var(--calcite-border-width-sm) solid var(--calcite-card-border-color);\n  border-radius: var(--calcite-card-corner-radius);\n  background-color: var(--calcite-card-background-color);\n  box-shadow: var(--calcite-card-shadow);\n  pointer-events: none;\n}\n\n::slotted(*) {\n  @apply pointer-events-auto;\n}\n\n:host(:not([selectable])) {\n  .content-wrapper {\n    &:not(.non-interactive) {\n      @apply focus-base;\n    }\n    &:not(.non-interactive):focus {\n      @apply focus-outset;\n    }\n  }\n}\n\n.container {\n  @apply relative flex flex-auto flex-col;\n}\n\n:host([loading]) .content-wrapper *:not(calcite-loader):not(.calcite-card-loader-container) {\n  @apply pointer-events-none;\n  opacity: $calcite-opacity-0;\n}\n\n:host([loading]) .calcite-card-loader-container {\n  @apply absolute inset-0 flex items-center;\n}\n\n.header {\n  @apply flex flex-row items-start;\n}\n\n.footer {\n  @apply flex mt-auto flex-row content-between justify-between;\n  padding-inline: var(--calcite-spacing-md);\n  padding-block-start: var(--calcite-spacing-xxs);\n  padding-block-end: var(--calcite-spacing-md);\n}\n\n.header-text-container {\n  @apply flex flex-col px-3 py-2 w-full justify-center;\n  &:not(:only-child) {\n    @apply pr-0.5;\n  }\n}\n\n.footer {\n  @apply mt-auto flex-row content-between\n    justify-between\n    px-3\n    pt-1\n    pb-3;\n}\n\n.card-content {\n  @apply h-auto text-n2-wrap;\n}\n\n.has-slotted-content {\n  @apply p-3;\n}\n\n:host([selected]) .content-wrapper {\n  box-shadow: inset 0 -4px 0 0 var(--calcite-card-accent-color-selected);\n}\n\n:host([selectable]) .header {\n  padding-inline-end: var(--calcite-spacing-xxxl);\n}\n\n@include slotted(\"title\", \"*\") {\n  @apply text-color-1\n    text-n1-wrap\n    m-0\n    font-medium;\n}\n\n@include slotted(\"subtitle\", \"*\") {\n  @apply text-color-2\n    text-n2-wrap\n    m-0 mt-0.5\n    font-normal;\n}\n\n@include slotted(\"heading\", \"*\") {\n  @apply text-color-1\n    text-n1-wrap\n    m-0\n    font-medium;\n}\n\n@include slotted(\"description\", \"*\") {\n  @apply text-color-2\n    text-n2-wrap\n    m-0 mt-0.5\n    font-normal;\n}\n\n@include slotted(\"thumbnail\", \"img\") {\n  @apply min-w-full max-w-full;\n}\n\n@include slotted(\"footer-start\", \"*\") {\n  @apply text-n2-wrap self-center;\n  margin-inline-end: auto;\n}\n\n@include slotted(\"footer-end\", \"*\") {\n  @apply text-n2-wrap self-center;\n}\n\n.checkbox-wrapper-deprecated {\n  @apply absolute pointer-events-auto;\n  inset-block-start: var(--calcite-spacing-sm);\n  inset-inline-end: var(--calcite-spacing-sm);\n  margin: 0;\n  padding: 0;\n}\n\n.checkbox-wrapper {\n  @apply m-2 p-2 focus-base cursor-pointer pointer-events-auto;\n  background-color: var(--calcite-card-selection-background-color);\n  display: flex;\n  align-items: center;\n  justify-items: center;\n  --calcite-icon-color: var(--calcite-card-selection-icon-color);\n  &:hover {\n    background-color: var(--calcite-card-selection-background-color-hover);\n    --calcite-icon-color: var(--calcite-card-selection-icon-color-hover);\n  }\n  &:active {\n    background-color: var(--calcite-card-selection-background-color-active);\n  }\n  & calcite-icon {\n    pointer-events: none;\n  }\n}\n\n:host([selected]) .checkbox-wrapper {\n  --calcite-icon-color: var(--calcite-card-selection-icon-color-selected);\n  background-color: var(--calcite-card-selection-background-color-selected);\n  &:hover {\n    background-color: var(--calcite-card-selection-background-color-hover);\n  }\n  &:active {\n    background-color: var(--calcite-card-selection-background-color-active);\n  }\n}\n\n:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper {\n  background-color: var(--calcite-card-selection-background-color-hover);\n  --calcite-icon-color: var(--calcite-card-selection-icon-color-hover);\n}\n\n:host([selected]:not([selectable])) .content-wrapper:not(.non-interactive):focus .checkbox-wrapper {\n  background-color: var(--calcite-card-selection-background-color-active);\n  --calcite-icon-color: var(--calcite-card-selection-icon-color-selected);\n}\n\n.thumbnail-wrapper {\n  @apply flex;\n}\n\n.content-wrapper.inline {\n  @apply flex-row;\n\n  & > .container {\n    @apply w-3/5;\n  }\n  & > .thumbnail-wrapper {\n    @apply items-start w-2/5;\n  }\n\n  @include slotted(\"thumbnail\", \"img\") {\n    @apply w-full;\n  }\n}\n\nslot[name=\"footer-start\"]::slotted(*),\nslot[name=\"footer-end\"]::slotted(*) {\n  @apply flex gap-1;\n}\n\n@include base-component();\n@include disabled();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { getSlotted, slotChangeHasAssignedElement, toAriaBoolean } from \"../../utils/dom\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { LogicalFlowPosition, SelectionMode } from \"../interfaces\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { isActivationKey } from \"../../utils/key\";\nimport { IconNameOrString } from \"../icon/interfaces\";\nimport { CSS, ICONS, SLOTS } from \"./resources\";\nimport { CardMessages } from \"./assets/card/t9n\";\n\n/**\n * @slot - A slot for adding content.\n * @slot title - [Deprecated] use `heading` instead. A slot for adding a heading.\n * @slot subtitle - [Deprecated] use `description` instead. A slot for adding a description.\n * @slot thumbnail - A slot for adding a thumbnail.\n * @slot heading - A slot for adding a heading.\n * @slot description - A slot for adding a description.\n * @slot footer-start - A slot for adding a leading footer.\n * @slot footer-end - A slot for adding a trailing footer.\n */\n\n@Component({\n  tag: \"calcite-card\",\n  styleUrl: \"card.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Card\n  implements InteractiveComponent, LoadableComponent, LocalizedComponent, T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**  When `true`, a busy indicator is displayed. */\n  @Prop({ reflect: true }) loading = false;\n\n  /** Sets the placement of the thumbnail defined in the `thumbnail` slot. */\n  @Prop({ reflect: true }) thumbnailPosition: LogicalFlowPosition = \"block-start\";\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Accessible name for the component. */\n  @Prop() label: string;\n\n  /**\n   * When `true`, the component is selectable.\n   *\n   * @deprecated use `selectionMode` property on a parent `calcite-card-group` instead.\n   */\n  @Prop({ reflect: true }) selectable = false;\n\n  /** When `true`, the component is selected.  */\n  @Prop({ reflect: true, mutable: true }) selected = false;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: CardMessages;\n\n  /**\n   * This internal property, managed by a containing `calcite-card-group`, is\n   * conditionally set based on the `selectionMode` of the parent\n   *\n   * @internal\n   */\n  @Prop() selectionMode: Extract<\"multiple\" | \"single\" | \"single-persist\" | \"none\", SelectionMode> =\n    \"none\";\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<CardMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Fires when the deprecated `selectable` is true, or `selectionMode` set on parent `calcite-card-group` is not `none` and the component is selected. */\n  @Event({ cancelable: false }) calciteCardSelect: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalCardKeyEvent: EventEmitter<KeyboardEvent>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    if (!this.disabled) {\n      this.containerEl?.focus();\n    }\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteCardElement;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: CardMessages;\n\n  @State() private hasContent = false;\n\n  private containerEl: HTMLDivElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private handleDefaultSlotChange = (event: Event): void => {\n    this.hasContent = slotChangeHasAssignedElement(event);\n  };\n\n  private keyDownHandler = (event: KeyboardEvent): void => {\n    if (event.target === this.containerEl && !this.selectable && !this.disabled) {\n      if (isActivationKey(event.key) && this.selectionMode !== \"none\") {\n        this.calciteCardSelect.emit();\n        event.preventDefault();\n      } else {\n        switch (event.key) {\n          case \"ArrowRight\":\n          case \"ArrowLeft\":\n          case \"Home\":\n          case \"End\":\n            this.calciteInternalCardKeyEvent.emit(event);\n            event.preventDefault();\n            break;\n        }\n      }\n    }\n  };\n\n  private cardBodyClickHandler = (event: MouseEvent): void => {\n    const isFromScreenReader = event.target === this.containerEl;\n    if (isFromScreenReader && !this.selectable && !this.disabled && this.selectionMode !== \"none\") {\n      this.calciteCardSelect.emit();\n    }\n  };\n\n  private renderCheckboxDeprecated(): VNode {\n    return (\n      <calcite-label class={CSS.checkboxWrapperDeprecated}>\n        <calcite-checkbox\n          checked={this.selected}\n          label={this.messages.select}\n          onClick={this.selectCardDeprecated}\n          onKeyDown={this.cardSelectKeyDownDeprecated}\n        />\n      </calcite-label>\n    );\n  }\n\n  private cardSelectKeyDownDeprecated = (event: KeyboardEvent): void => {\n    switch (event.key) {\n      case \" \":\n      case \"Enter\":\n        this.selectCardDeprecated();\n        event.preventDefault();\n        break;\n    }\n  };\n\n  private selectCardDeprecated = (): void => {\n    this.selected = !this.selected;\n    this.calciteCardSelect.emit();\n  };\n\n  private cardSelectClick = (event): void => {\n    if (!this.disabled) {\n      event.preventDefault();\n      this.calciteCardSelect.emit();\n      this.setFocus();\n    }\n  };\n\n  private renderThumbnail(): VNode {\n    return getSlotted(this.el, SLOTS.thumbnail) ? (\n      <section class={CSS.thumbnailWrapper}>\n        <slot name={SLOTS.thumbnail} />\n      </section>\n    ) : null;\n  }\n\n  private renderSelectionIcon(): VNode {\n    const icon: IconNameOrString =\n      this.selectionMode === \"multiple\" && this.selected\n        ? ICONS.selected\n        : this.selectionMode === \"multiple\"\n          ? ICONS.unselected\n          : this.selected\n            ? ICONS.selectedSingle\n            : ICONS.unselectedSingle;\n\n    return (\n      <div class={CSS.checkboxWrapper} onPointerDown={this.cardSelectClick} tabIndex={-1}>\n        <calcite-icon icon={icon} scale=\"s\" />\n      </div>\n    );\n  }\n\n  private renderHeader(): VNode {\n    const { el } = this;\n    const heading = getSlotted(el, SLOTS.heading);\n    const description = getSlotted(el, SLOTS.description);\n    const hasHeader = heading || description;\n    const subtitle = getSlotted(el, SLOTS.subtitle);\n    const title = getSlotted(el, SLOTS.title);\n    const hasDeprecatedHeader = subtitle || title;\n    return hasHeader || hasDeprecatedHeader ? (\n      <header class={CSS.header}>\n        {this.selectable ? this.renderCheckboxDeprecated() : null}\n        <div class={CSS.headerTextContainer}>\n          <slot key=\"heading-slot\" name={SLOTS.heading} />\n          <slot key=\"description-slot\" name={SLOTS.description} />\n          <slot key=\"deprecated-title-slot\" name={SLOTS.title} />\n          <slot key=\"deprecated-subtitle-slot\" name={SLOTS.subtitle} />\n        </div>\n        {this.selectionMode !== \"none\" && this.renderSelectionIcon()}\n      </header>\n    ) : null;\n  }\n\n  private renderFooter(): VNode {\n    const { el } = this;\n    const startFooter = getSlotted(el, SLOTS.footerStart);\n    const endFooter = getSlotted(el, SLOTS.footerEnd);\n\n    const hasFooter = startFooter || endFooter;\n    return hasFooter ? (\n      <footer class={CSS.footer}>\n        <slot name={SLOTS.footerStart} />\n        <slot name={SLOTS.footerEnd} />\n      </footer>\n    ) : null;\n  }\n\n  render(): VNode {\n    const thumbnailInline = this.thumbnailPosition.startsWith(\"inline\");\n    const thumbnailStart = this.thumbnailPosition.endsWith(\"start\");\n    const role =\n      this.selectionMode === \"multiple\"\n        ? \"checkbox\"\n        : this.selectionMode !== \"none\"\n          ? \"radio\"\n          : undefined;\n    return (\n      <Host>\n        <InteractiveContainer disabled={this.disabled}>\n          <div\n            aria-checked={this.selectionMode !== \"none\" ? toAriaBoolean(this.selected) : undefined}\n            aria-disabled={this.disabled}\n            aria-label={this.label}\n            class={{ [CSS.contentWrapper]: true, inline: thumbnailInline }}\n            onClick={this.cardBodyClickHandler}\n            onKeyDown={this.keyDownHandler}\n            ref={(el) => (this.containerEl = el)}\n            role={role}\n            tabIndex={!this.selectable || this.disabled ? 0 : -1}\n          >\n            {this.loading ? (\n              <div aria-live=\"polite\" class=\"calcite-card-loader-container\">\n                <calcite-loader label={this.messages.loading} />\n              </div>\n            ) : null}\n            {thumbnailStart && this.renderThumbnail()}\n            <section aria-busy={toAriaBoolean(this.loading)} class={{ [CSS.container]: true }}>\n              {this.renderHeader()}\n              <div\n                class={{\n                  [CSS.cardContent]: true,\n                  [CSS.hasSlottedContent]: this.hasContent,\n                }}\n              >\n                <slot onSlotchange={this.handleDefaultSlotChange} />\n              </div>\n              {this.renderFooter()}\n            </section>\n            {!thumbnailStart && this.renderThumbnail()}\n          </div>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"calcite-card.entry.js","mappings":"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","names":[],"sources":["src/components/card/resources.ts","src/components/card/card.scss?tag=calcite-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["export const CSS = {\n  container: \"container\",\n  contentWrapper: \"content-wrapper\",\n  header: \"header\",\n  footer: \"footer\",\n  heading: \"heading\",\n  description: \"description\",\n  checkboxWrapper: \"checkbox-wrapper\",\n  checkboxWrapperDeprecated: \"checkbox-wrapper-deprecated\",\n  thumbnailWrapper: \"thumbnail-wrapper\",\n  headerTextContainer: \"header-text-container\",\n  cardContent: \"card-content\",\n  hasSlottedContent: \"has-slotted-content\",\n};\n\nexport const SLOTS = {\n  thumbnail: \"thumbnail\",\n  heading: \"heading\",\n  description: \"description\",\n  footerStart: \"footer-start\",\n  footerEnd: \"footer-end\",\n  title: \"title\",\n  subtitle: \"subtitle\",\n};\n\nexport const ICONS = {\n  selected: \"check-square-f\",\n  unselected: \"square\",\n  selectedSingle: \"circle-f\",\n  unselectedSingle: \"circle\",\n} as const;\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-card-accent-color-selected: Specifies the accent color of the component when `selected`.\n * @prop --calcite-card-background-color: Specifies the background color of the component.\n * @prop --calcite-card-border-color: Specifies the border color of the component.\n * @prop --calcite-card-corner-radius: Specifies the corner radius of the component.\n * @prop --calcite-card-selection-background-color-active: [Deprecated] Use --calcite-card-selection-background-color-press. Specifies the background color of the component's selection element when active.\n * @prop --calcite-card-selection-background-color-hover: Specifies the background color of the component's selection element when hovered.\n * @prop --calcite-card-selection-background-color-press: Specifies the background color of the component's selection element when active.\n * @prop --calcite-card-selection-background-color-selected: [Deprecated] Use --calcite-card-background-color. Specifies the icon color of the component's selection element when `selected`.\n * @prop --calcite-card-selection-background-color: [Deprecated] Use --calcite-card-background-color. Specifies the background color of the component's selection element.\n * @prop --calcite-card-selection-color-hover: Specifies the color of the component's selection element when hovered or focused.\n * @prop --calcite-card-selection-color: Specifies the color of the component's selection element.\n * @prop --calcite-card-selection-icon-color-hover: [Deprecated] Use --calcite-card-selection-color-hover. Specifies the icon color of the component's selection element when hovered.\n * @prop --calcite-card-selection-icon-color-selected: [Deprecated] Use --calcite-card-accent-color-selected. Specifies the icon color of the component's selection element when `selected`.\n * @prop --calcite-card-selection-icon-color: [Deprecated] Use --calcite-card-selection-color. Specifies the icon color of the component's selection element.\n * @prop --calcite-card-shadow: Specifies the shadow of the component.\n *\n */\n\n:host {\n  @apply block max-w-full;\n}\n\n.content-wrapper {\n  @apply relative\n    flex\n    h-full\n    flex-col\n    justify-between\n    overflow-hidden;\n  border: var(--calcite-border-width-sm) solid var(--calcite-card-border-color, var(--calcite-color-border-3));\n  border-radius: var(--calcite-card-corner-radius, var(--calcite-corner-radius-sharp));\n  background-color: var(--calcite-card-background-color, var(--calcite-color-foreground-1));\n  box-shadow: var(--calcite-card-shadow, var(--calcite-shadow-none));\n  pointer-events: none;\n}\n\n::slotted(*) {\n  @apply pointer-events-auto;\n}\n\n:host(:not([selectable])) {\n  .content-wrapper {\n    &:not(.non-interactive) {\n      @apply focus-base;\n    }\n    &:not(.non-interactive):focus {\n      @apply focus-outset;\n    }\n  }\n}\n\n.container {\n  @apply relative flex flex-auto flex-col;\n}\n\n:host([loading]) .content-wrapper *:not(calcite-loader):not(.calcite-card-loader-container) {\n  @apply pointer-events-none;\n  opacity: $calcite-opacity-0;\n}\n\n:host([loading]) .calcite-card-loader-container {\n  @apply absolute inset-0 flex items-center;\n}\n\n.header {\n  @apply flex flex-row items-start;\n}\n\n.footer {\n  @apply flex mt-auto flex-row content-between justify-between;\n  padding-inline: var(--calcite-spacing-md);\n  padding-block-start: var(--calcite-spacing-xxs);\n  padding-block-end: var(--calcite-spacing-md);\n}\n\n.header-text-container {\n  @apply flex flex-col px-3 py-2 w-full justify-center;\n  &:not(:only-child) {\n    @apply pr-0.5;\n  }\n}\n\n.footer {\n  @apply mt-auto flex-row content-between\n    justify-between\n    px-3\n    pt-1\n    pb-3;\n}\n\n.card-content {\n  @apply h-auto text-n2-wrap;\n}\n\n.has-slotted-content {\n  @apply p-3;\n}\n\n:host([selected]) .content-wrapper {\n  box-shadow: inset 0 -4px 0 0 var(--calcite-card-accent-color-selected, var(--calcite-color-brand));\n}\n\n:host([selectable]) .header {\n  padding-inline-end: var(--calcite-spacing-xxxl);\n}\n\n@include slotted(\"title\", \"*\") {\n  @apply text-color-1\n    text-n1-wrap\n    m-0\n    font-medium;\n}\n\n@include slotted(\"subtitle\", \"*\") {\n  @apply text-color-2\n    text-n2-wrap\n    m-0 mt-0.5\n    font-normal;\n}\n\n@include slotted(\"heading\", \"*\") {\n  @apply text-color-1\n    text-n1-wrap\n    m-0\n    font-medium;\n}\n\n@include slotted(\"description\", \"*\") {\n  @apply text-color-2\n    text-n2-wrap\n    m-0 mt-0.5\n    font-normal;\n}\n\n@include slotted(\"thumbnail\", \"img\") {\n  @apply min-w-full max-w-full;\n}\n\n@include slotted(\"footer-start\", \"*\") {\n  @apply text-n2-wrap self-center;\n  margin-inline-end: auto;\n}\n\n@include slotted(\"footer-end\", \"*\") {\n  @apply text-n2-wrap self-center;\n}\n\n// deprecated\n.checkbox-wrapper-deprecated {\n  @apply absolute pointer-events-auto;\n  inset-block-start: var(--calcite-spacing-sm);\n  inset-inline-end: var(--calcite-spacing-sm);\n  margin: 0;\n  padding: 0;\n  color: var(--calcite-card-selection-color, var(--calcite-color-text-3));\n\n  &:hover {\n    background-color: var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));\n    color: var(\n      --calcite-card-selection-color-hover,\n      var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2))\n    );\n  }\n  &:active {\n    background-color: var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press));\n  }\n}\n\n.checkbox-wrapper {\n  @apply m-2 p-2 focus-base cursor-pointer pointer-events-auto;\n  display: flex;\n  align-items: center;\n  justify-items: center;\n  color: var(--calcite-card-selection-color, var(--calcite-color-text-3));\n\n  &:hover {\n    background-color: var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));\n    color: var(\n      --calcite-card-selection-color-hover,\n      var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2))\n    );\n  }\n  &:active {\n    background-color: var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press));\n  }\n  & calcite-icon {\n    pointer-events: none;\n  }\n}\n\n:host([selected]) {\n  .checkbox-wrapper-deprecated,\n  .checkbox-wrapper {\n    color: var(\n      --calcite-card-accent-color-selected,\n      var(--calcite-card-selection-icon-color-selected, var(--calcite-color-brand))\n    );\n  }\n}\n\n:host(:not([selectable])) .content-wrapper:not(.non-interactive):focus {\n  .checkbox-wrapper-deprecated,\n  .checkbox-wrapper {\n    background-color: var(--calcite-card-selection-background-color-hover, var(--calcite-color-foreground-2));\n    color: var(\n      --calcite-card-selection-color-hover,\n      var(--calcite-card-selection-icon-color-hover, var(--calcite-color-text-2))\n    );\n  }\n}\n\n:host([selected]:not([selectable])) .content-wrapper:not(.non-interactive):focus {\n  .checkbox-wrapper-deprecated,\n  .checkbox-wrapper {\n    background-color: var(--calcite-card-selection-background-color-press, var(--calcite-color-transparent-press));\n    color: var(\n      --calcite-card-accent-color-selected,\n      var(--calcite-card-selection-icon-color-selected, var(--calcite-color-brand))\n    );\n  }\n}\n/* end deprecated */\n\n.thumbnail-wrapper {\n  @apply flex;\n}\n\n.content-wrapper.inline {\n  @apply flex-row;\n\n  & > .container {\n    @apply w-3/5;\n  }\n  & > .thumbnail-wrapper {\n    @apply items-start w-2/5;\n  }\n\n  @include slotted(\"thumbnail\", \"img\") {\n    @apply w-full;\n  }\n}\n\nslot[name=\"footer-start\"]::slotted(*),\nslot[name=\"footer-end\"]::slotted(*) {\n  @apply flex gap-1;\n}\n\n@include base-component();\n@include disabled();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { getSlotted, slotChangeHasAssignedElement, toAriaBoolean } from \"../../utils/dom\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { LogicalFlowPosition, SelectionMode } from \"../interfaces\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { isActivationKey } from \"../../utils/key\";\nimport { IconNameOrString } from \"../icon/interfaces\";\nimport { CSS, ICONS, SLOTS } from \"./resources\";\nimport { CardMessages } from \"./assets/card/t9n\";\n\n/**\n * @slot - A slot for adding content.\n * @slot title - [Deprecated] use `heading` instead. A slot for adding a heading.\n * @slot subtitle - [Deprecated] use `description` instead. A slot for adding a description.\n * @slot thumbnail - A slot for adding a thumbnail.\n * @slot heading - A slot for adding a heading.\n * @slot description - A slot for adding a description.\n * @slot footer-start - A slot for adding a leading footer.\n * @slot footer-end - A slot for adding a trailing footer.\n */\n\n@Component({\n  tag: \"calcite-card\",\n  styleUrl: \"card.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Card\n  implements InteractiveComponent, LoadableComponent, LocalizedComponent, T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**  When `true`, a busy indicator is displayed. */\n  @Prop({ reflect: true }) loading = false;\n\n  /** Sets the placement of the thumbnail defined in the `thumbnail` slot. */\n  @Prop({ reflect: true }) thumbnailPosition: LogicalFlowPosition = \"block-start\";\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Accessible name for the component. */\n  @Prop() label: string;\n\n  /**\n   * When `true`, the component is selectable.\n   *\n   * @deprecated use `selectionMode` property on a parent `calcite-card-group` instead.\n   */\n  @Prop({ reflect: true }) selectable = false;\n\n  /** When `true`, the component is selected.  */\n  @Prop({ reflect: true, mutable: true }) selected = false;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: CardMessages;\n\n  /**\n   * This internal property, managed by a containing `calcite-card-group`, is\n   * conditionally set based on the `selectionMode` of the parent\n   *\n   * @internal\n   */\n  @Prop() selectionMode: Extract<\"multiple\" | \"single\" | \"single-persist\" | \"none\", SelectionMode> =\n    \"none\";\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<CardMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Fires when the deprecated `selectable` is true, or `selectionMode` set on parent `calcite-card-group` is not `none` and the component is selected. */\n  @Event({ cancelable: false }) calciteCardSelect: EventEmitter<void>;\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalCardKeyEvent: EventEmitter<KeyboardEvent>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    if (!this.disabled) {\n      this.containerEl?.focus();\n    }\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteCardElement;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: CardMessages;\n\n  @State() private hasContent = false;\n\n  private containerEl: HTMLDivElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private handleDefaultSlotChange = (event: Event): void => {\n    this.hasContent = slotChangeHasAssignedElement(event);\n  };\n\n  private keyDownHandler = (event: KeyboardEvent): void => {\n    if (event.target === this.containerEl && !this.selectable && !this.disabled) {\n      if (isActivationKey(event.key) && this.selectionMode !== \"none\") {\n        this.calciteCardSelect.emit();\n        event.preventDefault();\n      } else {\n        switch (event.key) {\n          case \"ArrowRight\":\n          case \"ArrowLeft\":\n          case \"Home\":\n          case \"End\":\n            this.calciteInternalCardKeyEvent.emit(event);\n            event.preventDefault();\n            break;\n        }\n      }\n    }\n  };\n\n  private cardBodyClickHandler = (event: MouseEvent): void => {\n    const isFromScreenReader = event.target === this.containerEl;\n    if (isFromScreenReader && !this.selectable && !this.disabled && this.selectionMode !== \"none\") {\n      this.calciteCardSelect.emit();\n    }\n  };\n\n  private renderCheckboxDeprecated(): VNode {\n    return (\n      <calcite-label class={CSS.checkboxWrapperDeprecated}>\n        <calcite-checkbox\n          checked={this.selected}\n          label={this.messages.select}\n          onClick={this.selectCardDeprecated}\n          onKeyDown={this.cardSelectKeyDownDeprecated}\n        />\n      </calcite-label>\n    );\n  }\n\n  private cardSelectKeyDownDeprecated = (event: KeyboardEvent): void => {\n    switch (event.key) {\n      case \" \":\n      case \"Enter\":\n        this.selectCardDeprecated();\n        event.preventDefault();\n        break;\n    }\n  };\n\n  private selectCardDeprecated = (): void => {\n    this.selected = !this.selected;\n    this.calciteCardSelect.emit();\n  };\n\n  private cardSelectClick = (event): void => {\n    if (!this.disabled) {\n      event.preventDefault();\n      this.calciteCardSelect.emit();\n      this.setFocus();\n    }\n  };\n\n  private renderThumbnail(): VNode {\n    return getSlotted(this.el, SLOTS.thumbnail) ? (\n      <section class={CSS.thumbnailWrapper}>\n        <slot name={SLOTS.thumbnail} />\n      </section>\n    ) : null;\n  }\n\n  private renderSelectionIcon(): VNode {\n    const icon: IconNameOrString =\n      this.selectionMode === \"multiple\" && this.selected\n        ? ICONS.selected\n        : this.selectionMode === \"multiple\"\n          ? ICONS.unselected\n          : this.selected\n            ? ICONS.selectedSingle\n            : ICONS.unselectedSingle;\n\n    return (\n      <div class={CSS.checkboxWrapper} onPointerDown={this.cardSelectClick} tabIndex={-1}>\n        <calcite-icon icon={icon} scale=\"s\" />\n      </div>\n    );\n  }\n\n  private renderHeader(): VNode {\n    const { el } = this;\n    const heading = getSlotted(el, SLOTS.heading);\n    const description = getSlotted(el, SLOTS.description);\n    const hasHeader = heading || description;\n    const subtitle = getSlotted(el, SLOTS.subtitle);\n    const title = getSlotted(el, SLOTS.title);\n    const hasDeprecatedHeader = subtitle || title;\n    return hasHeader || hasDeprecatedHeader ? (\n      <header class={CSS.header}>\n        {this.selectable ? this.renderCheckboxDeprecated() : null}\n        <div class={CSS.headerTextContainer}>\n          <slot key=\"heading-slot\" name={SLOTS.heading} />\n          <slot key=\"description-slot\" name={SLOTS.description} />\n          <slot key=\"deprecated-title-slot\" name={SLOTS.title} />\n          <slot key=\"deprecated-subtitle-slot\" name={SLOTS.subtitle} />\n        </div>\n        {this.selectionMode !== \"none\" && this.renderSelectionIcon()}\n      </header>\n    ) : null;\n  }\n\n  private renderFooter(): VNode {\n    const { el } = this;\n    const startFooter = getSlotted(el, SLOTS.footerStart);\n    const endFooter = getSlotted(el, SLOTS.footerEnd);\n\n    const hasFooter = startFooter || endFooter;\n    return hasFooter ? (\n      <footer class={CSS.footer}>\n        <slot name={SLOTS.footerStart} />\n        <slot name={SLOTS.footerEnd} />\n      </footer>\n    ) : null;\n  }\n\n  render(): VNode {\n    const thumbnailInline = this.thumbnailPosition.startsWith(\"inline\");\n    const thumbnailStart = this.thumbnailPosition.endsWith(\"start\");\n    const role =\n      this.selectionMode === \"multiple\"\n        ? \"checkbox\"\n        : this.selectionMode !== \"none\"\n          ? \"radio\"\n          : undefined;\n    return (\n      <Host>\n        <InteractiveContainer disabled={this.disabled}>\n          <div\n            aria-checked={this.selectionMode !== \"none\" ? toAriaBoolean(this.selected) : undefined}\n            aria-disabled={this.disabled}\n            aria-label={this.label}\n            class={{ [CSS.contentWrapper]: true, inline: thumbnailInline }}\n            onClick={this.cardBodyClickHandler}\n            onKeyDown={this.keyDownHandler}\n            ref={(el) => (this.containerEl = el)}\n            role={role}\n            tabIndex={!this.selectable || this.disabled ? 0 : -1}\n          >\n            {this.loading ? (\n              <div aria-live=\"polite\" class=\"calcite-card-loader-container\">\n                <calcite-loader label={this.messages.loading} />\n              </div>\n            ) : null}\n            {thumbnailStart && this.renderThumbnail()}\n            <section aria-busy={toAriaBoolean(this.loading)} class={{ [CSS.container]: true }}>\n              {this.renderHeader()}\n              <div\n                class={{\n                  [CSS.cardContent]: true,\n                  [CSS.hasSlottedContent]: this.hasContent,\n                }}\n              >\n                <slot onSlotchange={this.handleDefaultSlotChange} />\n              </div>\n              {this.renderFooter()}\n            </section>\n            {!thumbnailStart && this.renderThumbnail()}\n          </div>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"],"version":3}