@esri/calcite-components 2.2.0-next.0 → 2.2.0-next.1

package/dist/cjs/ca-85d93f27.js

@@ -0,0 +1,73 @@
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v2.2.0-next.1
+ */
+'use strict';
+
+const calciteInputTimePicker_calciteTimePicker_entry = require('./calcite-input-time-picker.calcite-time-picker-fd3eaa5b.js');
+require('./index-da143e9e.js');
+require('./form-b1b105cc.js');
+require('./dom-d932fba4.js');
+require('./guid-a987eaa5.js');
+require('./resources-d89f2476.js');
+require('./interactive-012e7a4d.js');
+require('./browser-6ce852bf.js');
+require('./key-b558fe12.js');
+require('./label-d69b4b41.js');
+require('./component-bf756c9b.js');
+require('./loadable-6ec686cd.js');
+require('./locale-dd091567.js');
+require('./observers-35a5b1f8.js');
+require('./focusTrapComponent-be7d4977.js');
+require('./math-da3742f2.js');
+require('./t9n-610613ad.js');
+require('./openCloseComponent-202868ba.js');
+require('./Validation-a55f3505.js');
+
+// Catalan [ca]
+var locale = {
+  name: 'ca',
+  weekdays: 'Diumenge_Dilluns_Dimarts_Dimecres_Dijous_Divendres_Dissabte'.split('_'),
+  weekdaysShort: 'Dg._Dl._Dt._Dc._Dj._Dv._Ds.'.split('_'),
+  weekdaysMin: 'Dg_Dl_Dt_Dc_Dj_Dv_Ds'.split('_'),
+  months: 'Gener_Febrer_Març_Abril_Maig_Juny_Juliol_Agost_Setembre_Octubre_Novembre_Desembre'.split('_'),
+  monthsShort: 'Gen._Febr._Març_Abr._Maig_Juny_Jul._Ag._Set._Oct._Nov._Des.'.split('_'),
+  weekStart: 1,
+  formats: {
+    LT: 'H:mm',
+    LTS: 'H:mm:ss',
+    L: 'DD/MM/YYYY',
+    LL: 'D MMMM [de] YYYY',
+    LLL: 'D MMMM [de] YYYY [a les] H:mm',
+    LLLL: 'dddd D MMMM [de] YYYY [a les] H:mm',
+    ll: 'D MMM YYYY',
+    lll: 'D MMM YYYY, H:mm',
+    llll: 'ddd D MMM YYYY, H:mm'
+  },
+  relativeTime: {
+    future: 'd\'aquí %s',
+    past: 'fa %s',
+    s: 'uns segons',
+    m: 'un minut',
+    mm: '%d minuts',
+    h: 'una hora',
+    hh: '%d hores',
+    d: 'un dia',
+    dd: '%d dies',
+    M: 'un mes',
+    MM: '%d mesos',
+    y: 'un any',
+    yy: '%d anys'
+  },
+  ordinal: function ordinal(n) {
+    var ord;
+    if (n === 1 || n === 3) ord = 'r';else if (n === 2) ord = 'n';else if (n === 4) ord = 't';else ord = 'è';
+    return "" + n + ord;
+  }
+};
+calciteInputTimePicker_calciteTimePicker_entry.dayjs.locale(locale, null, true);
+
+exports.default = locale;
+
+//# sourceMappingURL=ca-85d93f27.js.map

package/dist/cjs/ca-85d93f27.js.map

@@ -0,0 +1 @@
+{"file":"ca-85d93f27.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAEG,IAAC,MAAM,GAAG;AACb,EAAE,IAAI,EAAE,IAAI;AACZ,EAAE,QAAQ,EAAE,6DAA6D,CAAC,KAAK,CAAC,GAAG,CAAC;AACpF,EAAE,aAAa,EAAE,6BAA6B,CAAC,KAAK,CAAC,GAAG,CAAC;AACzD,EAAE,WAAW,EAAE,sBAAsB,CAAC,KAAK,CAAC,GAAG,CAAC;AAChD,EAAE,MAAM,EAAE,mFAAmF,CAAC,KAAK,CAAC,GAAG,CAAC;AACxG,EAAE,WAAW,EAAE,6DAA6D,CAAC,KAAK,CAAC,GAAG,CAAC;AACvF,EAAE,SAAS,EAAE,CAAC;AACd,EAAE,OAAO,EAAE;AACX,IAAI,EAAE,EAAE,MAAM;AACd,IAAI,GAAG,EAAE,SAAS;AAClB,IAAI,CAAC,EAAE,YAAY;AACnB,IAAI,EAAE,EAAE,kBAAkB;AAC1B,IAAI,GAAG,EAAE,+BAA+B;AACxC,IAAI,IAAI,EAAE,oCAAoC;AAC9C,IAAI,EAAE,EAAE,YAAY;AACpB,IAAI,GAAG,EAAE,kBAAkB;AAC3B,IAAI,IAAI,EAAE,sBAAsB;AAChC,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,MAAM,EAAE,YAAY;AACxB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,CAAC,EAAE,YAAY;AACnB,IAAI,CAAC,EAAE,UAAU;AACjB,IAAI,EAAE,EAAE,WAAW;AACnB,IAAI,CAAC,EAAE,UAAU;AACjB,IAAI,EAAE,EAAE,UAAU;AAClB,IAAI,CAAC,EAAE,QAAQ;AACf,IAAI,EAAE,EAAE,SAAS;AACjB,IAAI,CAAC,EAAE,QAAQ;AACf,IAAI,EAAE,EAAE,UAAU;AAClB,IAAI,CAAC,EAAE,QAAQ;AACf,IAAI,EAAE,EAAE,SAAS;AACjB,GAAG;AACH,EAAE,OAAO,EAAE,SAAS,OAAO,CAAC,CAAC,EAAE;AAC/B,IAAI,IAAI,GAAG,CAAC;AACZ,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC,KAAK,GAAG,GAAG,GAAG,CAAC;AAC7G,IAAI,OAAO,EAAE,GAAG,CAAC,GAAG,GAAG,CAAC;AACxB,GAAG;AACH,EAAE;AACFA,oDAAK,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC;;;;","names":["dayjs"],"sources":["../../node_modules/dayjs/esm/locale/ca.js"],"sourcesContent":["// Catalan [ca]\nimport dayjs from '../index';\nvar locale = {\n  name: 'ca',\n  weekdays: 'Diumenge_Dilluns_Dimarts_Dimecres_Dijous_Divendres_Dissabte'.split('_'),\n  weekdaysShort: 'Dg._Dl._Dt._Dc._Dj._Dv._Ds.'.split('_'),\n  weekdaysMin: 'Dg_Dl_Dt_Dc_Dj_Dv_Ds'.split('_'),\n  months: 'Gener_Febrer_Març_Abril_Maig_Juny_Juliol_Agost_Setembre_Octubre_Novembre_Desembre'.split('_'),\n  monthsShort: 'Gen._Febr._Març_Abr._Maig_Juny_Jul._Ag._Set._Oct._Nov._Des.'.split('_'),\n  weekStart: 1,\n  formats: {\n    LT: 'H:mm',\n    LTS: 'H:mm:ss',\n    L: 'DD/MM/YYYY',\n    LL: 'D MMMM [de] YYYY',\n    LLL: 'D MMMM [de] YYYY [a les] H:mm',\n    LLLL: 'dddd D MMMM [de] YYYY [a les] H:mm',\n    ll: 'D MMM YYYY',\n    lll: 'D MMM YYYY, H:mm',\n    llll: 'ddd D MMM YYYY, H:mm'\n  },\n  relativeTime: {\n    future: 'd\\'aquí %s',\n    past: 'fa %s',\n    s: 'uns segons',\n    m: 'un minut',\n    mm: '%d minuts',\n    h: 'una hora',\n    hh: '%d hores',\n    d: 'un dia',\n    dd: '%d dies',\n    M: 'un mes',\n    MM: '%d mesos',\n    y: 'un any',\n    yy: '%d anys'\n  },\n  ordinal: function ordinal(n) {\n    var ord;\n    if (n === 1 || n === 3) ord = 'r';else if (n === 2) ord = 'n';else if (n === 4) ord = 't';else ord = 'è';\n    return \"\" + n + ord;\n  }\n};\ndayjs.locale(locale, null, true);\nexport default locale;"],"version":3}

package/dist/cjs/calcite-accordion_2.cjs.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/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const observers = require('./observers-20febba7.js');
-const conditionalSlot = require('./conditionalSlot-a6a1ea4e.js');
-const dom = require('./dom-afcc4f08.js');
-const resources = require('./resources-aeedfe4f.js');
-const component = require('./component-f4c2ecd4.js');
-require('./guid-9272df1b.js');
+const index = require('./index-da143e9e.js');
+const observers = require('./observers-35a5b1f8.js');
+const conditionalSlot = require('./conditionalSlot-c79972fa.js');
+const dom = require('./dom-d932fba4.js');
+const resources = require('./resources-d89f2476.js');
+const component = require('./component-bf756c9b.js');
+require('./guid-a987eaa5.js');
 
 const accordionCss = ":host([scale=s]){--calcite-accordion-item-spacing-unit:0.25rem;--calcite-accordion-icon-margin:0.5rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=m]){--calcite-accordion-item-spacing-unit:0.5rem;--calcite-accordion-icon-margin:0.75rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]){--calcite-accordion-item-spacing-unit:0.75rem;--calcite-accordion-icon-margin:1rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host{position:relative;display:block;max-inline-size:100%;line-height:1.5rem;--calcite-accordion-item-border:var(--calcite-color-border-2);--calcite-accordion-item-background:var(--calcite-color-foreground-1)}.accordion--transparent{--calcite-accordion-item-border:transparent;--calcite-accordion-item-background:transparent}.accordion{border-width:1px;border-block-end-width:0px;border-style:solid;border-color:var(--calcite-color-border-2)}:host([hidden]){display:none}[hidden]{display:none}";
 

package/dist/cjs/calcite-action-bar.cjs.entry.js

@@ -1,26 +1,26 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const conditionalSlot = require('./conditionalSlot-a6a1ea4e.js');
-const dom = require('./dom-afcc4f08.js');
-const loadable = require('./loadable-488230d3.js');
-const locale = require('./locale-f3c5ce8e.js');
-const observers = require('./observers-20febba7.js');
-const t9n = require('./t9n-7ada50fb.js');
-const ExpandToggle = require('./ExpandToggle-6fb1342a.js');
-const debounce = require('./debounce-5f6f9a5a.js');
-require('./guid-9272df1b.js');
-require('./resources-aeedfe4f.js');
-require('./key-f65f1f51.js');
-require('./resources-4b058a7e.js');
-require('./resources-6262c3d3.js');
+const index = require('./index-da143e9e.js');
+const conditionalSlot = require('./conditionalSlot-c79972fa.js');
+const dom = require('./dom-d932fba4.js');
+const loadable = require('./loadable-6ec686cd.js');
+const locale = require('./locale-dd091567.js');
+const observers = require('./observers-35a5b1f8.js');
+const t9n = require('./t9n-610613ad.js');
+const ExpandToggle = require('./ExpandToggle-966b80c2.js');
+const debounce = require('./debounce-9f42c9ae.js');
+require('./guid-a987eaa5.js');
+require('./resources-d89f2476.js');
+require('./key-b558fe12.js');
+require('./resources-45fef310.js');
+require('./resources-f1abdd40.js');
 
 const CSS = {
     actionGroupEnd: "action-group--end",

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

@@ -1,24 +1,24 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const conditionalSlot = require('./conditionalSlot-a6a1ea4e.js');
-const loadable = require('./loadable-488230d3.js');
-const locale = require('./locale-f3c5ce8e.js');
-const t9n = require('./t9n-7ada50fb.js');
-const resources$1 = require('./resources-6262c3d3.js');
-const resources = require('./resources-4b058a7e.js');
-const dom = require('./dom-afcc4f08.js');
-require('./observers-20febba7.js');
-require('./key-f65f1f51.js');
-require('./guid-9272df1b.js');
-require('./resources-aeedfe4f.js');
+const index = require('./index-da143e9e.js');
+const conditionalSlot = require('./conditionalSlot-c79972fa.js');
+const loadable = require('./loadable-6ec686cd.js');
+const locale = require('./locale-dd091567.js');
+const t9n = require('./t9n-610613ad.js');
+const resources$1 = require('./resources-f1abdd40.js');
+const resources = require('./resources-45fef310.js');
+const dom = require('./dom-d932fba4.js');
+require('./observers-35a5b1f8.js');
+require('./key-b558fe12.js');
+require('./guid-a987eaa5.js');
+require('./resources-d89f2476.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;--calcite-action-group-columns:3;--calcite-action-group-gap:1px;--calcite-action-group-padding:1px}.container{display:flex;flex-grow:1;flex-direction:column}:host([columns=\"1\"]){--calcite-action-group-columns:1}:host([columns=\"2\"]){--calcite-action-group-columns:2}:host([columns=\"3\"]){--calcite-action-group-columns:3}:host([columns=\"4\"]){--calcite-action-group-columns:4}:host([columns=\"5\"]){--calcite-action-group-columns:5}:host([columns=\"6\"]){--calcite-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:var(--calcite-color-background);gap:var(--calcite-action-group-gap);padding:var(--calcite-action-group-gap);grid-template-columns:repeat(var(--calcite-action-group-columns), auto)}:host([hidden]){display:none}[hidden]{display:none}";
 

package/dist/cjs/calcite-action-menu.cjs.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/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const array = require('./array-6e6bf0fa.js');
-const dom = require('./dom-afcc4f08.js');
-const guid = require('./guid-9272df1b.js');
-const key = require('./key-f65f1f51.js');
-const loadable = require('./loadable-488230d3.js');
-const resources = require('./resources-6262c3d3.js');
-require('./resources-aeedfe4f.js');
+const index = require('./index-da143e9e.js');
+const array = require('./array-50720d70.js');
+const dom = require('./dom-d932fba4.js');
+const guid = require('./guid-a987eaa5.js');
+const key = require('./key-b558fe12.js');
+const loadable = require('./loadable-6ec686cd.js');
+const resources = require('./resources-f1abdd40.js');
+require('./resources-d89f2476.js');
 
 const actionMenuCss = ":host{box-sizing:border-box;display:flex;flex-direction:column;font-size:var(--calcite-font-size-1);color:var(--calcite-color-text-2)}::slotted(calcite-action-group){border-block-end:1px solid var(--calcite-color-border-3)}::slotted(calcite-action-group:last-child){border-block-end:0}.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{max-block-size:45vh;flex-direction:column;flex-wrap:nowrap;overflow-y:auto;overflow-x:hidden;outline:2px solid transparent;outline-offset:2px}:host([hidden]){display:none}[hidden]{display:none}";
 

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

@@ -1,25 +1,25 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const conditionalSlot = require('./conditionalSlot-a6a1ea4e.js');
-const dom = require('./dom-afcc4f08.js');
-const loadable = require('./loadable-488230d3.js');
-const locale = require('./locale-f3c5ce8e.js');
-const t9n = require('./t9n-7ada50fb.js');
-const ExpandToggle = require('./ExpandToggle-6fb1342a.js');
-const observers = require('./observers-20febba7.js');
-require('./guid-9272df1b.js');
-require('./resources-aeedfe4f.js');
-require('./key-f65f1f51.js');
-require('./resources-4b058a7e.js');
-require('./resources-6262c3d3.js');
+const index = require('./index-da143e9e.js');
+const conditionalSlot = require('./conditionalSlot-c79972fa.js');
+const dom = require('./dom-d932fba4.js');
+const loadable = require('./loadable-6ec686cd.js');
+const locale = require('./locale-dd091567.js');
+const t9n = require('./t9n-610613ad.js');
+const ExpandToggle = require('./ExpandToggle-966b80c2.js');
+const observers = require('./observers-35a5b1f8.js');
+require('./guid-a987eaa5.js');
+require('./resources-d89f2476.js');
+require('./key-b558fe12.js');
+require('./resources-45fef310.js');
+require('./resources-f1abdd40.js');
 
 const CSS = {
     actionGroupEnd: "action-group--end",

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

@@ -1,24 +1,24 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const dom = require('./dom-afcc4f08.js');
-const guid = require('./guid-9272df1b.js');
-const interactive = require('./interactive-04057cf9.js');
-const loadable = require('./loadable-488230d3.js');
-const locale = require('./locale-f3c5ce8e.js');
-const observers = require('./observers-20febba7.js');
-const component = require('./component-f4c2ecd4.js');
-const t9n = require('./t9n-7ada50fb.js');
-require('./resources-aeedfe4f.js');
-require('./browser-843700f4.js');
-require('./key-f65f1f51.js');
+const index = require('./index-da143e9e.js');
+const dom = require('./dom-d932fba4.js');
+const guid = require('./guid-a987eaa5.js');
+const interactive = require('./interactive-012e7a4d.js');
+const loadable = require('./loadable-6ec686cd.js');
+const locale = require('./locale-dd091567.js');
+const observers = require('./observers-35a5b1f8.js');
+const component = require('./component-bf756c9b.js');
+const t9n = require('./t9n-610613ad.js');
+require('./resources-d89f2476.js');
+require('./browser-6ce852bf.js');
+require('./key-b558fe12.js');
 
 const CSS = {
     button: "button",
@@ -37,7 +37,7 @@ const SLOTS = {
     tooltip: "tooltip",
 };
 
-const actionCss = ":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([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:flex;background-color:transparent;--calcite-action-indicator-color:var(--calcite-color-brand)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.button{position:relative;margin:0px;display:flex;inline-size:auto;cursor:pointer;align-items:center;justify-content:flex-start;border-style:none;background-color:var(--calcite-color-foreground-1);fill:var(--calcite-color-text-3);font-family:var(--calcite-sans-family);font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-3);outline-color:transparent;text-align:unset;flex:1 0 auto}.button:hover{background-color:var(--calcite-color-foreground-2);fill:var(--calcite-color-text-1);color:var(--calcite-color-text-1)}.button:focus{background-color:var(--calcite-color-foreground-2);fill:var(--calcite-color-text-1);color:var(--calcite-color-text-1);outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.button:active{background-color:var(--calcite-color-foreground-3)}.button .icon-container{pointer-events:none;margin:0px;display:flex;align-items:center;justify-content:center;min-inline-size:1rem;min-block-size:1rem}.button .text-container{margin:0px;inline-size:0px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.5rem;opacity:0;transition-property:opacity;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-property:margin;transition-property:inline-size}.button .text-container--visible{inline-size:auto;flex:1 1 auto;opacity:1}:host([data-active]) .button{outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}:host([scale=s]) .button{padding-inline:0.5rem;padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-normal)}:host([scale=s]) .button--text-visible .icon-container{margin-inline-end:0.5rem}:host([scale=m]) .button{padding-inline:1rem;padding-block:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem;font-weight:var(--calcite-font-weight-normal)}:host([scale=m]) .button--text-visible .icon-container{margin-inline-end:0.75rem}:host([scale=l]) .button{padding:1.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;font-weight:var(--calcite-font-weight-normal)}:host([scale=l]) .button--text-visible .icon-container{margin-inline-end:1rem}:host([alignment=center]) .button{justify-content:center}:host([alignment=end]) .button{justify-content:flex-end}:host([alignment=center]) .button .text-container--visible,:host([alignment=end]) .button .text-container--visible{flex:0 1 auto}:host([scale=s][compact]) .button,:host([scale=m][compact]) .button,:host([scale=l][compact]) .button{padding-inline:0px}.slot-container{display:flex}.slot-container--hidden{display:none}.button--text-visible{inline-size:100%}:host([active]) .button,:host([active]) .button:hover,:host([active]) .button:focus,:host([active][loading]) .button{background-color:var(--calcite-color-foreground-3);fill:var(--calcite-color-text-1);color:var(--calcite-color-text-1)}:host([active]) .button:active{background-color:var(--calcite-color-foreground-1)}:host([appearance=transparent]) .button{background-color:transparent}:host([appearance=transparent][active]) .button,:host([appearance=transparent]) .button:hover,:host([appearance=transparent]) .button:focus{background-color:var(--calcite-button-transparent-hover)}:host([appearance=transparent]) .button:active{background-color:var(--calcite-button-transparent-press)}:host([appearance=transparent][disabled]) .button{background-color:transparent}:host([loading][appearance=solid]) .button,:host([loading][appearance=solid]) .button:hover,:host([loading][appearance=solid]) .button:focus{background-color:var(--calcite-color-foreground-1)}:host([loading][appearance=solid]) .button .text-container,:host([loading][appearance=solid]) .button:hover .text-container,:host([loading][appearance=solid]) .button:focus .text-container{opacity:var(--calcite-opacity-disabled)}:host([loading]) calcite-loader[inline]{color:var(--calcite-color-text-3);margin-inline-end:0px}:host([disabled]) .button,:host([disabled]) .button:hover,:host([disabled]) .button:focus{cursor:default;background-color:var(--calcite-color-foreground-1);opacity:var(--calcite-opacity-disabled)}:host([disabled][active]) .button,:host([disabled][active]) .button:hover,:host([disabled][active]) .button:focus{background-color:var(--calcite-color-foreground-3);opacity:var(--calcite-opacity-disabled)}:host([appearance=transparent]) .button{background-color:transparent;transition-property:box-shadow;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.indicator-with-icon{position:relative}.indicator-with-icon::after{content:\"\";position:absolute;block-size:0.5rem;inline-size:0.5rem;border-radius:9999px;inset-block-end:-0.275rem;inset-inline-end:-0.275rem;background-color:var(--calcite-action-indicator-color)}.indicator-without-icon{margin-inline:0.25rem;inline-size:1rem;position:relative}.indicator-without-icon::after{content:\"\";position:absolute;block-size:0.5rem;inline-size:0.5rem;border-radius:9999px;inset-block-end:-0.275rem;inset-inline-end:-0.275rem;background-color:var(--calcite-action-indicator-color)}.indicator-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}:host([hidden]){display:none}[hidden]{display:none}";
+const actionCss = ":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([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:flex;background-color:transparent;--calcite-action-indicator-color:var(--calcite-color-brand)}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.button{position:relative;margin:0px;display:flex;inline-size:auto;cursor:pointer;align-items:center;justify-content:flex-start;border-style:none;background-color:var(--calcite-color-foreground-1);fill:var(--calcite-color-text-3);font-family:var(--calcite-sans-family);font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-color-text-3);outline-color:transparent;text-align:unset;flex:1 0 auto}.button:hover{background-color:var(--calcite-color-foreground-2);fill:var(--calcite-color-text-1);color:var(--calcite-color-text-1)}.button:focus{background-color:var(--calcite-color-foreground-2);fill:var(--calcite-color-text-1);color:var(--calcite-color-text-1);outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.button:active{background-color:var(--calcite-color-foreground-3)}.button .icon-container{pointer-events:none;margin:0px;display:flex;align-items:center;justify-content:center;min-inline-size:1rem;min-block-size:1rem}.button .text-container{margin:0px;inline-size:0px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.5rem;opacity:0;transition-property:opacity;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-property:margin;transition-property:inline-size}.button .text-container--visible{inline-size:auto;flex:1 1 auto;opacity:1}:host([data-active]) .button{outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}:host([scale=s]) .button{padding-inline:0.5rem;padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem;font-weight:var(--calcite-font-weight-normal)}:host([scale=s]) .button--text-visible .icon-container{margin-inline-end:0.5rem}:host([scale=m]) .button{padding-inline:1rem;padding-block:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem;font-weight:var(--calcite-font-weight-normal)}:host([scale=m]) .button--text-visible .icon-container{margin-inline-end:0.75rem}:host([scale=l]) .button{padding:1.25rem;font-size:var(--calcite-font-size-0);line-height:1.25rem;font-weight:var(--calcite-font-weight-normal)}:host([scale=l]) .button--text-visible .icon-container{margin-inline-end:1rem}:host([alignment=center]) .button{justify-content:center}:host([alignment=end]) .button{justify-content:flex-end}:host([alignment=center]) .button .text-container--visible,:host([alignment=end]) .button .text-container--visible{flex:0 1 auto}:host([scale=s][compact]) .button,:host([scale=m][compact]) .button,:host([scale=l][compact]) .button{padding-inline:0px}.slot-container{display:flex}.slot-container--hidden{display:none}.button--text-visible{inline-size:100%}:host([active]) .button,:host([active]) .button:hover,:host([active]) .button:focus,:host([active][loading]) .button{background-color:var(--calcite-color-foreground-3);fill:var(--calcite-color-text-1);color:var(--calcite-color-text-1)}:host([active]) .button:active{background-color:var(--calcite-color-foreground-1)}:host([appearance=transparent]) .button{background-color:transparent}:host([appearance=transparent][active]) .button,:host([appearance=transparent]) .button:hover,:host([appearance=transparent]) .button:focus{background-color:var(--calcite-button-transparent-hover)}:host([appearance=transparent]) .button:active{background-color:var(--calcite-button-transparent-press)}:host([appearance=transparent][disabled]) .button{background-color:transparent}:host([loading][appearance=solid]) .button,:host([loading][appearance=solid]) .button:hover,:host([loading][appearance=solid]) .button:focus{background-color:var(--calcite-color-foreground-1)}:host([loading][appearance=solid]) .button .text-container,:host([loading][appearance=solid]) .button:hover .text-container,:host([loading][appearance=solid]) .button:focus .text-container{opacity:var(--calcite-opacity-disabled)}:host([loading]) calcite-loader[inline]{color:var(--calcite-color-text-3);margin-inline-end:0px}:host([disabled]) .button,:host([disabled]) .button:hover,:host([disabled]) .button:focus{cursor:default;background-color:var(--calcite-color-foreground-1);opacity:var(--calcite-opacity-disabled)}:host([disabled][active]) .button,:host([disabled][active]) .button:hover,:host([disabled][active]) .button:focus{background-color:var(--calcite-color-foreground-3);opacity:var(--calcite-opacity-disabled)}:host([appearance=transparent]) .button{background-color:transparent;transition-property:box-shadow;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.indicator-with-icon{position:relative}.indicator-with-icon::after{content:\"\";position:absolute;block-size:0.5rem;inline-size:0.5rem;border-radius:9999px;inset-block-end:-0.275rem;inset-inline-end:-0.275rem;background-color:var(--calcite-action-indicator-color)}.indicator-without-icon{margin-inline:0.25rem;inline-size:1rem;position:relative}.indicator-without-icon::after{content:\"\";position:absolute;block-size:0.5rem;inline-size:0.5rem;border-radius:9999px;inset-block-end:-0.275rem;inset-inline-end:-0.275rem;background-color:var(--calcite-action-indicator-color)}.indicator-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Action = class {
     constructor(hostRef) {
@@ -163,9 +163,9 @@ const Action = class {
             [CSS.buttonTextVisible]: textEnabled,
             [CSS.buttonCompact]: compact,
         };
-        return (index.h(index.Host, null, index.h("button", { "aria-busy": dom.toAriaBoolean(loading), "aria-controls": indicator ? indicatorId : null, "aria-disabled": dom.toAriaBoolean(disabled), "aria-label": ariaLabel, "aria-pressed": dom.toAriaBoolean(active), class: buttonClasses, disabled: disabled, id: buttonId,
+        return (index.h(index.Host, null, index.h(interactive.InteractiveContainer, { disabled: disabled }, index.h("button", { "aria-busy": dom.toAriaBoolean(loading), "aria-controls": indicator ? indicatorId : null, "aria-disabled": dom.toAriaBoolean(disabled), "aria-label": ariaLabel, "aria-pressed": dom.toAriaBoolean(active), class: buttonClasses, disabled: disabled, id: buttonId,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: (buttonEl) => (this.buttonEl = buttonEl) }, this.renderIconContainer(), this.renderTextContainer(), !icon && indicator && index.h("div", { class: CSS.indicatorWithoutIcon, key: "indicator-no-icon" })), index.h("slot", { name: SLOTS.tooltip, onSlotchange: this.handleTooltipSlotChange }), this.renderIndicatorText()));
+            ref: (buttonEl) => (this.buttonEl = buttonEl) }, this.renderIconContainer(), this.renderTextContainer(), !icon && indicator && index.h("div", { class: CSS.indicatorWithoutIcon, key: "indicator-no-icon" })), index.h("slot", { name: SLOTS.tooltip, onSlotchange: this.handleTooltipSlotChange }), this.renderIndicatorText())));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return index.getElement(this); }

package/dist/cjs/calcite-action.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"calcite-action.entry.cjs.js","mappings":"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","names":["createObserver","forceUpdate","guid","updateMessages","connectInteractive","connectLocalized","connectMessages","setUpLoadableComponent","setUpMessages","setComponentLoaded","disconnectInteractive","disconnectLocalized","disconnectMessages","updateHostInteraction","componentFocusable","h","getIconScale","Host","toAriaBoolean"],"sources":["src/components/action/resources.ts","src/components/action/action.scss?tag=calcite-action&encapsulation=shadow","src/components/action/action.tsx"],"sourcesContent":["export const CSS = {\n  button: \"button\",\n  buttonTextVisible: \"button--text-visible\",\n  buttonCompact: \"button--compact\",\n  indicatorText: \"indicator-text\",\n  iconContainer: \"icon-container\",\n  slotContainer: \"slot-container\",\n  slotContainerHidden: \"slot-container--hidden\",\n  textContainer: \"text-container\",\n  textContainerVisible: \"text-container--visible\",\n  indicatorWithIcon: \"indicator-with-icon\",\n  indicatorWithoutIcon: \"indicator-without-icon\",\n};\n\nexport const SLOTS = {\n  tooltip: \"tooltip\",\n};\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-action-indicator-color: Specifies the color of the component's indicator.\n */\n\n:host {\n  @extend %component-host;\n  @apply flex bg-transparent;\n  --calcite-action-indicator-color: theme(\"colors.brand\");\n}\n\n@mixin action-indicator() {\n  position: relative;\n  &::after {\n    content: \"\";\n    @apply absolute\n      h-2\n      w-2\n      rounded-full;\n    inset-block-end: calc(-0.275rem);\n    inset-inline-end: calc(-0.275rem);\n    background-color: var(--calcite-action-indicator-color);\n  }\n}\n\n@include disabled();\n\n.button {\n  @apply bg-foreground-1\n    fill-color-3\n    focus-base\n    text-n2h\n    text-color-3\n    relative\n    m-0\n    flex\n    w-auto\n    cursor-pointer\n    items-center\n    justify-start\n    border-none\n    font-sans\n    font-medium;\n\n  text-align: unset;\n  flex: 1 0 auto;\n  &:hover {\n    @apply bg-foreground-2 text-color-1 fill-color-1;\n  }\n\n  &:focus {\n    @apply bg-foreground-2 text-color-1 fill-color-1 focus-inset;\n  }\n\n  &:active {\n    @apply bg-foreground-3;\n  }\n\n  .icon-container {\n    @apply pointer-events-none\n      m-0\n      flex\n      items-center\n      justify-center;\n    min-inline-size: theme(\"spacing.4\");\n    min-block-size: theme(\"spacing.4\");\n  }\n\n  .text-container {\n    @apply m-0\n      w-0\n      truncate\n      leading-6\n      opacity-0\n      transition-opacity\n      duration-150\n      ease-in-out;\n    transition-property: margin;\n    transition-property: inline-size;\n  }\n\n  .text-container--visible {\n    @apply w-auto flex-auto opacity-100;\n  }\n}\n\n:host([data-active]) .button {\n  @apply focus-inset;\n}\n\n:host([scale=\"s\"]) {\n  .button {\n    @apply text-n2h px-2 py-1 font-normal;\n  }\n  .button--text-visible .icon-container {\n    margin-inline-end: theme(\"spacing.2\");\n  }\n}\n\n:host([scale=\"m\"]) {\n  .button {\n    @apply text-n1h px-4 py-3 font-normal;\n  }\n  .button--text-visible .icon-container {\n    margin-inline-end: theme(\"spacing.3\");\n  }\n}\n\n:host([scale=\"l\"]) {\n  .button {\n    @apply text-0h p-5 font-normal;\n  }\n  .button--text-visible .icon-container {\n    margin-inline-end: theme(\"spacing.4\");\n  }\n}\n\n:host([alignment=\"center\"]) .button {\n  @apply justify-center;\n}\n\n:host([alignment=\"end\"]) .button {\n  @apply justify-end;\n}\n\n:host([alignment=\"center\"]),\n:host([alignment=\"end\"]) {\n  .button .text-container--visible {\n    @apply flex-initial;\n  }\n}\n\n// Compact\n:host([scale=\"s\"][compact]) .button,\n:host([scale=\"m\"][compact]) .button,\n:host([scale=\"l\"][compact]) .button {\n  @apply px-0;\n}\n\n.slot-container {\n  @apply flex;\n}\n\n.slot-container--hidden {\n  @apply hidden;\n}\n\n.button--text-visible {\n  @apply w-full;\n}\n\n:host([active]) .button,\n:host([active]) .button:hover,\n:host([active]) .button:focus,\n:host([active][loading]) .button {\n  @apply text-color-1 fill-color-1 bg-foreground-3;\n}\n\n:host([active]) .button:active {\n  @apply bg-foreground-1;\n}\n\n:host([appearance=\"transparent\"]) .button {\n  @apply bg-transparent;\n}\n\n:host([appearance=\"transparent\"][active]) .button,\n:host([appearance=\"transparent\"]) .button:hover,\n:host([appearance=\"transparent\"]) .button:focus {\n  background-color: var(--calcite-button-transparent-hover);\n}\n\n:host([appearance=\"transparent\"]) .button:active {\n  background-color: var(--calcite-button-transparent-press);\n}\n\n:host([appearance=\"transparent\"][disabled]) .button {\n  @apply bg-transparent;\n}\n\n:host([loading][appearance=\"solid\"]) .button,\n:host([loading][appearance=\"solid\"]) .button:hover,\n:host([loading][appearance=\"solid\"]) .button:focus {\n  @apply bg-foreground-1;\n  .text-container {\n    @apply opacity-disabled;\n  }\n}\n\n:host([loading]) calcite-loader[inline] {\n  @apply text-color-3;\n  margin-inline-end: theme(\"spacing.0\");\n}\n\n:host([disabled]) .button,\n:host([disabled]) .button:hover,\n:host([disabled]) .button:focus {\n  @apply opacity-disabled bg-foreground-1 cursor-default;\n}\n\n:host([disabled][active]) .button,\n:host([disabled][active]) .button:hover,\n:host([disabled][active]) .button:focus {\n  @apply opacity-disabled bg-foreground-3;\n}\n\n:host([appearance=\"transparent\"]) .button {\n  @apply bg-transparent\n    transition-shadow\n    duration-150\n    ease-in-out;\n}\n\n.indicator-with-icon {\n  @include action-indicator();\n}\n\n.indicator-without-icon {\n  @apply w-4 mx-1;\n  @include action-indicator();\n}\n\n.indicator-text {\n  @apply sr-only;\n}\n\n@include base-component();\n","import {\n  Build,\n  Component,\n  Element,\n  forceUpdate,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { toAriaBoolean } from \"../../utils/dom\";\nimport { guid } from \"../../utils/guid\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport { createObserver } from \"../../utils/observers\";\nimport { getIconScale } from \"../../utils/component\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Alignment, Appearance, Scale } from \"../interfaces\";\nimport { ActionMessages } from \"./assets/action/t9n\";\nimport { CSS, SLOTS } from \"./resources\";\n\n/**\n * @slot - A slot for adding a `calcite-icon`.\n * @slot tooltip - A slot for adding a `calcite-tooltip`.\n */\n@Component({\n  tag: \"calcite-action\",\n  styleUrl: \"action.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Action\n  implements InteractiveComponent, LocalizedComponent, T9nComponent, LoadableComponent\n{\n  // --------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * When `true`, the component is highlighted.\n   */\n  @Prop({ reflect: true }) active = false;\n\n  /**\n   * Specifies the horizontal alignment of button elements with text content.\n   */\n  @Prop({ reflect: true }) alignment: Alignment;\n\n  /** Specifies the appearance of the component. */\n  @Prop({ reflect: true }) appearance: Extract<\"solid\" | \"transparent\", Appearance> = \"solid\";\n\n  /**\n   * When `true`, the side padding of the component is reduced. Compact mode is used internally by components, e.g. `calcite-block-section`.\n   */\n  @Prop({ reflect: true }) compact = false;\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Specifies an icon to display. */\n  @Prop() icon: string;\n\n  /** When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl = false;\n\n  /**\n   * When `true`, displays a visual indicator.\n   */\n  @Prop({ reflect: true }) indicator = false;\n\n  /**\n   * Specifies the label of the component. If no label is provided, the label inherits what's provided for the `text` prop.\n   */\n  @Prop() label: string;\n\n  /**\n   * When `true`, a busy indicator is displayed.\n   */\n  @Prop({ reflect: true }) loading = false;\n\n  /**\n   * Specifies the size of the component.\n   */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /**\n   * Specifies text that accompanies the icon.\n   */\n  @Prop() text!: string;\n\n  /**\n   * Indicates whether the text is displayed.\n   */\n  @Prop({ reflect: true }) textEnabled = 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: ActionMessages;\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<ActionMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteActionElement;\n\n  buttonEl: HTMLButtonElement;\n\n  mutationObserver = createObserver(\"mutation\", () => forceUpdate(this));\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: ActionMessages;\n\n  guid = `calcite-action-${guid()}`;\n\n  indicatorId = `${this.guid}-indicator`;\n\n  buttonId = `${this.guid}-button`;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    if (Build.isBrowser) {\n      await setUpMessages(this);\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.mutationObserver?.disconnect();\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    this.buttonEl?.focus();\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  renderTextContainer(): VNode {\n    const { text, textEnabled } = this;\n\n    const textContainerClasses = {\n      [CSS.textContainer]: true,\n      [CSS.textContainerVisible]: textEnabled,\n    };\n\n    return text ? (\n      <div class={textContainerClasses} key=\"text-container\">\n        {text}\n      </div>\n    ) : null;\n  }\n\n  renderIndicatorText(): VNode {\n    const { indicator, messages, indicatorId, buttonId } = this;\n    return (\n      <div\n        aria-labelledby={buttonId}\n        aria-live=\"polite\"\n        class={CSS.indicatorText}\n        id={indicatorId}\n        role=\"region\"\n      >\n        {indicator ? messages.indicator : null}\n      </div>\n    );\n  }\n\n  renderIconContainer(): VNode {\n    const { loading, icon, scale, el, iconFlipRtl, indicator } = this;\n    const loaderScale = scale === \"l\" ? \"l\" : \"m\";\n    const calciteLoaderNode = loading ? (\n      <calcite-loader inline label={this.messages.loading} scale={loaderScale} />\n    ) : null;\n    const calciteIconNode = icon ? (\n      <calcite-icon\n        class={{ [CSS.indicatorWithIcon]: indicator }}\n        flipRtl={iconFlipRtl}\n        icon={icon}\n        scale={getIconScale(this.scale)}\n      />\n    ) : null;\n    const iconNode = calciteLoaderNode || calciteIconNode;\n    const hasIconToDisplay = iconNode || el.children?.length;\n\n    const slotContainerNode = (\n      <div\n        class={{\n          [CSS.slotContainer]: true,\n          [CSS.slotContainerHidden]: loading,\n        }}\n      >\n        <slot />\n      </div>\n    );\n\n    return hasIconToDisplay ? (\n      <div aria-hidden=\"true\" class={CSS.iconContainer} key=\"icon-container\">\n        {iconNode}\n        {slotContainerNode}\n      </div>\n    ) : null;\n  }\n\n  render(): VNode {\n    const {\n      active,\n      compact,\n      disabled,\n      icon,\n      loading,\n      textEnabled,\n      label,\n      text,\n      indicator,\n      indicatorId,\n      buttonId,\n      messages,\n    } = this;\n    const ariaLabel = `${label || text}${indicator ? ` (${messages.indicator})` : \"\"}`;\n\n    const buttonClasses = {\n      [CSS.button]: true,\n      [CSS.buttonTextVisible]: textEnabled,\n      [CSS.buttonCompact]: compact,\n    };\n\n    return (\n      <Host>\n        <button\n          aria-busy={toAriaBoolean(loading)}\n          aria-controls={indicator ? indicatorId : null}\n          aria-disabled={toAriaBoolean(disabled)}\n          aria-label={ariaLabel}\n          aria-pressed={toAriaBoolean(active)}\n          class={buttonClasses}\n          disabled={disabled}\n          id={buttonId}\n          // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n          ref={(buttonEl): HTMLButtonElement => (this.buttonEl = buttonEl)}\n        >\n          {this.renderIconContainer()}\n          {this.renderTextContainer()}\n          {!icon && indicator && <div class={CSS.indicatorWithoutIcon} key=\"indicator-no-icon\" />}\n        </button>\n        <slot name={SLOTS.tooltip} onSlotchange={this.handleTooltipSlotChange} />\n        {this.renderIndicatorText()}\n      </Host>\n    );\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  handleTooltipSlotChange = (event: Event): void => {\n    const tooltips = (event.target as HTMLSlotElement)\n      .assignedElements({\n        flatten: true,\n      })\n      .filter((el) => el?.matches(\"calcite-tooltip\")) as HTMLCalciteTooltipElement[];\n\n    const tooltip = tooltips[0];\n\n    if (tooltip) {\n      tooltip.referenceElement = this.buttonEl;\n    }\n  };\n}\n"],"version":3}
+{"file":"calcite-action.entry.cjs.js","mappings":"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","names":["createObserver","forceUpdate","guid","updateMessages","connectInteractive","connectLocalized","connectMessages","setUpLoadableComponent","setUpMessages","setComponentLoaded","disconnectInteractive","disconnectLocalized","disconnectMessages","updateHostInteraction","componentFocusable","h","getIconScale","Host","InteractiveContainer","toAriaBoolean"],"sources":["src/components/action/resources.ts","src/components/action/action.scss?tag=calcite-action&encapsulation=shadow","src/components/action/action.tsx"],"sourcesContent":["export const CSS = {\n  button: \"button\",\n  buttonTextVisible: \"button--text-visible\",\n  buttonCompact: \"button--compact\",\n  indicatorText: \"indicator-text\",\n  iconContainer: \"icon-container\",\n  slotContainer: \"slot-container\",\n  slotContainerHidden: \"slot-container--hidden\",\n  textContainer: \"text-container\",\n  textContainerVisible: \"text-container--visible\",\n  indicatorWithIcon: \"indicator-with-icon\",\n  indicatorWithoutIcon: \"indicator-without-icon\",\n};\n\nexport const SLOTS = {\n  tooltip: \"tooltip\",\n};\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-action-indicator-color: Specifies the color of the component's indicator.\n */\n\n:host {\n  @extend %component-host;\n  @apply flex bg-transparent;\n  --calcite-action-indicator-color: theme(\"colors.brand\");\n}\n\n@mixin action-indicator() {\n  position: relative;\n  &::after {\n    content: \"\";\n    @apply absolute\n      h-2\n      w-2\n      rounded-full;\n    inset-block-end: calc(-0.275rem);\n    inset-inline-end: calc(-0.275rem);\n    background-color: var(--calcite-action-indicator-color);\n  }\n}\n\n@include disabled();\n\n.button {\n  @apply bg-foreground-1\n    fill-color-3\n    focus-base\n    text-n2h\n    text-color-3\n    relative\n    m-0\n    flex\n    w-auto\n    cursor-pointer\n    items-center\n    justify-start\n    border-none\n    font-sans\n    font-medium;\n\n  text-align: unset;\n  flex: 1 0 auto;\n  &:hover {\n    @apply bg-foreground-2 text-color-1 fill-color-1;\n  }\n\n  &:focus {\n    @apply bg-foreground-2 text-color-1 fill-color-1 focus-inset;\n  }\n\n  &:active {\n    @apply bg-foreground-3;\n  }\n\n  .icon-container {\n    @apply pointer-events-none\n      m-0\n      flex\n      items-center\n      justify-center;\n    min-inline-size: theme(\"spacing.4\");\n    min-block-size: theme(\"spacing.4\");\n  }\n\n  .text-container {\n    @apply m-0\n      w-0\n      truncate\n      leading-6\n      opacity-0\n      transition-opacity\n      duration-150\n      ease-in-out;\n    transition-property: margin;\n    transition-property: inline-size;\n  }\n\n  .text-container--visible {\n    @apply w-auto flex-auto opacity-100;\n  }\n}\n\n:host([data-active]) .button {\n  @apply focus-inset;\n}\n\n:host([scale=\"s\"]) {\n  .button {\n    @apply text-n2h px-2 py-1 font-normal;\n  }\n  .button--text-visible .icon-container {\n    margin-inline-end: theme(\"spacing.2\");\n  }\n}\n\n:host([scale=\"m\"]) {\n  .button {\n    @apply text-n1h px-4 py-3 font-normal;\n  }\n  .button--text-visible .icon-container {\n    margin-inline-end: theme(\"spacing.3\");\n  }\n}\n\n:host([scale=\"l\"]) {\n  .button {\n    @apply text-0h p-5 font-normal;\n  }\n  .button--text-visible .icon-container {\n    margin-inline-end: theme(\"spacing.4\");\n  }\n}\n\n:host([alignment=\"center\"]) .button {\n  @apply justify-center;\n}\n\n:host([alignment=\"end\"]) .button {\n  @apply justify-end;\n}\n\n:host([alignment=\"center\"]),\n:host([alignment=\"end\"]) {\n  .button .text-container--visible {\n    @apply flex-initial;\n  }\n}\n\n// Compact\n:host([scale=\"s\"][compact]) .button,\n:host([scale=\"m\"][compact]) .button,\n:host([scale=\"l\"][compact]) .button {\n  @apply px-0;\n}\n\n.slot-container {\n  @apply flex;\n}\n\n.slot-container--hidden {\n  @apply hidden;\n}\n\n.button--text-visible {\n  @apply w-full;\n}\n\n:host([active]) .button,\n:host([active]) .button:hover,\n:host([active]) .button:focus,\n:host([active][loading]) .button {\n  @apply text-color-1 fill-color-1 bg-foreground-3;\n}\n\n:host([active]) .button:active {\n  @apply bg-foreground-1;\n}\n\n:host([appearance=\"transparent\"]) .button {\n  @apply bg-transparent;\n}\n\n:host([appearance=\"transparent\"][active]) .button,\n:host([appearance=\"transparent\"]) .button:hover,\n:host([appearance=\"transparent\"]) .button:focus {\n  background-color: var(--calcite-button-transparent-hover);\n}\n\n:host([appearance=\"transparent\"]) .button:active {\n  background-color: var(--calcite-button-transparent-press);\n}\n\n:host([appearance=\"transparent\"][disabled]) .button {\n  @apply bg-transparent;\n}\n\n:host([loading][appearance=\"solid\"]) .button,\n:host([loading][appearance=\"solid\"]) .button:hover,\n:host([loading][appearance=\"solid\"]) .button:focus {\n  @apply bg-foreground-1;\n  .text-container {\n    @apply opacity-disabled;\n  }\n}\n\n:host([loading]) calcite-loader[inline] {\n  @apply text-color-3;\n  margin-inline-end: theme(\"spacing.0\");\n}\n\n:host([disabled]) .button,\n:host([disabled]) .button:hover,\n:host([disabled]) .button:focus {\n  @apply opacity-disabled bg-foreground-1 cursor-default;\n}\n\n:host([disabled][active]) .button,\n:host([disabled][active]) .button:hover,\n:host([disabled][active]) .button:focus {\n  @apply opacity-disabled bg-foreground-3;\n}\n\n:host([appearance=\"transparent\"]) .button {\n  @apply bg-transparent\n    transition-shadow\n    duration-150\n    ease-in-out;\n}\n\n.indicator-with-icon {\n  @include action-indicator();\n}\n\n.indicator-without-icon {\n  @apply w-4 mx-1;\n  @include action-indicator();\n}\n\n.indicator-text {\n  @apply sr-only;\n}\n\n@include base-component();\n","import {\n  Build,\n  Component,\n  Element,\n  forceUpdate,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { toAriaBoolean } from \"../../utils/dom\";\nimport { guid } from \"../../utils/guid\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport { createObserver } from \"../../utils/observers\";\nimport { getIconScale } from \"../../utils/component\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Alignment, Appearance, Scale } from \"../interfaces\";\nimport { ActionMessages } from \"./assets/action/t9n\";\nimport { CSS, SLOTS } from \"./resources\";\n\n/**\n * @slot - A slot for adding a `calcite-icon`.\n * @slot tooltip - A slot for adding a `calcite-tooltip`.\n */\n@Component({\n  tag: \"calcite-action\",\n  styleUrl: \"action.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Action\n  implements InteractiveComponent, LocalizedComponent, T9nComponent, LoadableComponent\n{\n  // --------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * When `true`, the component is highlighted.\n   */\n  @Prop({ reflect: true }) active = false;\n\n  /**\n   * Specifies the horizontal alignment of button elements with text content.\n   */\n  @Prop({ reflect: true }) alignment: Alignment;\n\n  /** Specifies the appearance of the component. */\n  @Prop({ reflect: true }) appearance: Extract<\"solid\" | \"transparent\", Appearance> = \"solid\";\n\n  /**\n   * When `true`, the side padding of the component is reduced. Compact mode is used internally by components, e.g. `calcite-block-section`.\n   */\n  @Prop({ reflect: true }) compact = false;\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Specifies an icon to display. */\n  @Prop() icon: string;\n\n  /** When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl = false;\n\n  /**\n   * When `true`, displays a visual indicator.\n   */\n  @Prop({ reflect: true }) indicator = false;\n\n  /**\n   * Specifies the label of the component. If no label is provided, the label inherits what's provided for the `text` prop.\n   */\n  @Prop() label: string;\n\n  /**\n   * When `true`, a busy indicator is displayed.\n   */\n  @Prop({ reflect: true }) loading = false;\n\n  /**\n   * Specifies the size of the component.\n   */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /**\n   * Specifies text that accompanies the icon.\n   */\n  @Prop() text!: string;\n\n  /**\n   * Indicates whether the text is displayed.\n   */\n  @Prop({ reflect: true }) textEnabled = 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: ActionMessages;\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<ActionMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteActionElement;\n\n  buttonEl: HTMLButtonElement;\n\n  mutationObserver = createObserver(\"mutation\", () => forceUpdate(this));\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: ActionMessages;\n\n  guid = `calcite-action-${guid()}`;\n\n  indicatorId = `${this.guid}-indicator`;\n\n  buttonId = `${this.guid}-button`;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    if (Build.isBrowser) {\n      await setUpMessages(this);\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.mutationObserver?.disconnect();\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    this.buttonEl?.focus();\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  renderTextContainer(): VNode {\n    const { text, textEnabled } = this;\n\n    const textContainerClasses = {\n      [CSS.textContainer]: true,\n      [CSS.textContainerVisible]: textEnabled,\n    };\n\n    return text ? (\n      <div class={textContainerClasses} key=\"text-container\">\n        {text}\n      </div>\n    ) : null;\n  }\n\n  renderIndicatorText(): VNode {\n    const { indicator, messages, indicatorId, buttonId } = this;\n    return (\n      <div\n        aria-labelledby={buttonId}\n        aria-live=\"polite\"\n        class={CSS.indicatorText}\n        id={indicatorId}\n        role=\"region\"\n      >\n        {indicator ? messages.indicator : null}\n      </div>\n    );\n  }\n\n  renderIconContainer(): VNode {\n    const { loading, icon, scale, el, iconFlipRtl, indicator } = this;\n    const loaderScale = scale === \"l\" ? \"l\" : \"m\";\n    const calciteLoaderNode = loading ? (\n      <calcite-loader inline label={this.messages.loading} scale={loaderScale} />\n    ) : null;\n    const calciteIconNode = icon ? (\n      <calcite-icon\n        class={{ [CSS.indicatorWithIcon]: indicator }}\n        flipRtl={iconFlipRtl}\n        icon={icon}\n        scale={getIconScale(this.scale)}\n      />\n    ) : null;\n    const iconNode = calciteLoaderNode || calciteIconNode;\n    const hasIconToDisplay = iconNode || el.children?.length;\n\n    const slotContainerNode = (\n      <div\n        class={{\n          [CSS.slotContainer]: true,\n          [CSS.slotContainerHidden]: loading,\n        }}\n      >\n        <slot />\n      </div>\n    );\n\n    return hasIconToDisplay ? (\n      <div aria-hidden=\"true\" class={CSS.iconContainer} key=\"icon-container\">\n        {iconNode}\n        {slotContainerNode}\n      </div>\n    ) : null;\n  }\n\n  render(): VNode {\n    const {\n      active,\n      compact,\n      disabled,\n      icon,\n      loading,\n      textEnabled,\n      label,\n      text,\n      indicator,\n      indicatorId,\n      buttonId,\n      messages,\n    } = this;\n    const ariaLabel = `${label || text}${indicator ? ` (${messages.indicator})` : \"\"}`;\n\n    const buttonClasses = {\n      [CSS.button]: true,\n      [CSS.buttonTextVisible]: textEnabled,\n      [CSS.buttonCompact]: compact,\n    };\n\n    return (\n      <Host>\n        <InteractiveContainer disabled={disabled}>\n          <button\n            aria-busy={toAriaBoolean(loading)}\n            aria-controls={indicator ? indicatorId : null}\n            aria-disabled={toAriaBoolean(disabled)}\n            aria-label={ariaLabel}\n            aria-pressed={toAriaBoolean(active)}\n            class={buttonClasses}\n            disabled={disabled}\n            id={buttonId}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={(buttonEl): HTMLButtonElement => (this.buttonEl = buttonEl)}\n          >\n            {this.renderIconContainer()}\n            {this.renderTextContainer()}\n            {!icon && indicator && <div class={CSS.indicatorWithoutIcon} key=\"indicator-no-icon\" />}\n          </button>\n          <slot name={SLOTS.tooltip} onSlotchange={this.handleTooltipSlotChange} />\n          {this.renderIndicatorText()}\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  handleTooltipSlotChange = (event: Event): void => {\n    const tooltips = (event.target as HTMLSlotElement)\n      .assignedElements({\n        flatten: true,\n      })\n      .filter((el) => el?.matches(\"calcite-tooltip\")) as HTMLCalciteTooltipElement[];\n\n    const tooltip = tooltips[0];\n\n    if (tooltip) {\n      tooltip.referenceElement = this.buttonEl;\n    }\n  };\n}\n"],"version":3}

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

@@ -1,24 +1,24 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const dom = require('./dom-afcc4f08.js');
-const component = require('./component-f4c2ecd4.js');
-const loadable = require('./loadable-488230d3.js');
-const locale = require('./locale-f3c5ce8e.js');
-const openCloseComponent = require('./openCloseComponent-a24661c6.js');
-const t9n = require('./t9n-7ada50fb.js');
-const resources = require('./resources-94aecf21.js');
-require('./guid-9272df1b.js');
-require('./resources-aeedfe4f.js');
-require('./key-f65f1f51.js');
-require('./observers-20febba7.js');
+const index = require('./index-da143e9e.js');
+const dom = require('./dom-d932fba4.js');
+const component = require('./component-bf756c9b.js');
+const loadable = require('./loadable-6ec686cd.js');
+const locale = require('./locale-dd091567.js');
+const openCloseComponent = require('./openCloseComponent-202868ba.js');
+const t9n = require('./t9n-610613ad.js');
+const resources = require('./resources-cffde757.js');
+require('./guid-a987eaa5.js');
+require('./resources-d89f2476.js');
+require('./key-b558fe12.js');
+require('./observers-35a5b1f8.js');
 
 const DURATIONS = {
     slow: 14000,

package/dist/cjs/calcite-avatar.cjs.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/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const dom = require('./dom-afcc4f08.js');
-const utils = require('./utils-c74cca03.js');
-require('./guid-9272df1b.js');
-require('./resources-aeedfe4f.js');
+const index = require('./index-da143e9e.js');
+const dom = require('./dom-d932fba4.js');
+const utils = require('./utils-bd639887.js');
+require('./guid-a987eaa5.js');
+require('./resources-d89f2476.js');
 
 /**
  * Convert a string to a valid hex by hashing its contents

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

@@ -1,26 +1,26 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.0
+ * v2.2.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-96b85efe.js');
-const conditionalSlot = require('./conditionalSlot-a6a1ea4e.js');
-const dom = require('./dom-afcc4f08.js');
-const interactive = require('./interactive-04057cf9.js');
-const locale = require('./locale-f3c5ce8e.js');
-const t9n = require('./t9n-7ada50fb.js');
-const Heading = require('./Heading-b270a97e.js');
-const loadable = require('./loadable-488230d3.js');
-const openCloseComponent = require('./openCloseComponent-a24661c6.js');
-const key = require('./key-f65f1f51.js');
-require('./observers-20febba7.js');
-require('./guid-9272df1b.js');
-require('./resources-aeedfe4f.js');
-require('./browser-843700f4.js');
+const index = require('./index-da143e9e.js');
+const conditionalSlot = require('./conditionalSlot-c79972fa.js');
+const dom = require('./dom-d932fba4.js');
+const interactive = require('./interactive-012e7a4d.js');
+const locale = require('./locale-dd091567.js');
+const t9n = require('./t9n-610613ad.js');
+const Heading = require('./Heading-b0b9e226.js');
+const loadable = require('./loadable-6ec686cd.js');
+const openCloseComponent = require('./openCloseComponent-202868ba.js');
+const key = require('./key-b558fe12.js');
+require('./observers-35a5b1f8.js');
+require('./guid-a987eaa5.js');
+require('./resources-d89f2476.js');
+require('./browser-6ce852bf.js');
 
 const IDS$1 = {
     content: "content",
@@ -57,7 +57,7 @@ const ICONS$1 = {
     invalid: "exclamation-mark-triangle",
 };
 
-const blockCss = ":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{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;flex-shrink:0;flex-grow:0;flex-direction:column;border-width:0px;border-block-end-width:1px;border-style:solid;border-color:var(--calcite-color-border-3);padding:0px;transition-property:margin;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;transition-timing-function:cubic-bezier(0.215, 0.440, 0.420, 0.880);flex-basis:auto}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.header{margin:0px;display:flex;align-content:space-between;align-items:center;fill:var(--calcite-color-text-2);color:var(--calcite-color-text-2)}.heading{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}.header .heading{flex:1 1 auto;padding:0.5rem}.header{justify-content:flex-start;padding:0px}.header,.toggle{grid-area:header}.header-container{display:grid;align-items:stretch;grid-template:auto/auto 1fr auto auto;grid-template-areas:\"handle header control menu\";grid-column:header-start/menu-end;grid-row:1/2}.toggle{margin:0px;display:flex;cursor:pointer;flex-wrap:nowrap;align-items:center;justify-content:space-between;border-style:none;padding:0px;font-family:inherit;outline-color:transparent;text-align:initial;background-color:transparent}.toggle:hover{background-color:var(--calcite-color-foreground-2)}.toggle:focus{outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}calcite-loader[inline]{grid-area:control;align-self:center}calcite-handle{grid-area:handle}.title{margin:0px;padding:0.75rem}.header .title .heading{padding:0px;font-size:var(--calcite-font-size--1);font-weight:var(--calcite-font-weight-medium);line-height:1.25;color:var(--calcite-color-text-2);transition-property:color;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);word-wrap:break-word;word-break:break-word}.description{margin-block-start:0.125rem;padding:0px;font-size:var(--calcite-font-size--2);line-height:1.375;color:var(--calcite-color-text-3);word-wrap:break-word;word-break:break-word}.icon{display:flex;margin-inline-start:0.75rem;margin-inline-end:0px}.status-icon.valid{color:var(--calcite-color-status-success)}.status-icon.invalid{color:var(--calcite-color-status-danger)}@keyframes spin{0%{transform:rotate(0deg)}50%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}.toggle-icon{margin-block:0.75rem;align-self:center;justify-self:end;color:var(--calcite-color-text-3);transition-property:color;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);margin-inline-end:0.75rem;margin-inline-start:auto}.toggle:hover .toggle-icon{color:var(--calcite-color-text-1)}.container{position:relative;display:flex;block-size:100%;flex-direction:column}.content{position:relative;min-block-size:0px;flex:1 1 0%}@keyframes in{0%{opacity:0}100%{opacity:1}}.content{animation:in var(--calcite-internal-animation-timing-slow) ease-in-out;padding-block:var(--calcite-block-padding, 0.5rem);padding-inline:var(--calcite-block-padding, 0.625rem)}.control-container{margin:0px;display:flex;grid-area:control}calcite-action-menu{grid-area:menu}:host([open]){margin-block:0.5rem}:host([open]) .header .title .heading{color:var(--calcite-color-text-1)}:host([hidden]){display:none}[hidden]{display:none}";
+const blockCss = ":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{--calcite-icon-size:1rem;--calcite-spacing-eighth:0.125rem;--calcite-spacing-quarter:0.25rem;--calcite-spacing-half:0.5rem;--calcite-spacing-three-quarters:0.75rem;--calcite-spacing:1rem;--calcite-spacing-plus-quarter:1.25rem;--calcite-spacing-plus-half:1.5rem;--calcite-spacing-double:2rem;--calcite-menu-min-width:10rem;--calcite-header-min-height:3rem;--calcite-footer-min-height:3rem}:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;flex-shrink:0;flex-grow:0;flex-direction:column;border-width:0px;border-block-end-width:1px;border-style:solid;border-color:var(--calcite-color-border-3);padding:0px;transition-property:margin;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;transition-timing-function:cubic-bezier(0.215, 0.440, 0.420, 0.880);flex-basis:auto}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}.header{margin:0px;display:flex;align-content:space-between;align-items:center;fill:var(--calcite-color-text-2);color:var(--calcite-color-text-2)}.heading{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}.header .heading{flex:1 1 auto;padding:0.5rem}.header{justify-content:flex-start;padding:0px}.header,.toggle{grid-area:header}.header-container{display:grid;align-items:stretch;grid-template:auto/auto 1fr auto auto;grid-template-areas:\"handle header control menu\";grid-column:header-start/menu-end;grid-row:1/2}.toggle{margin:0px;display:flex;cursor:pointer;flex-wrap:nowrap;align-items:center;justify-content:space-between;border-style:none;padding:0px;font-family:inherit;outline-color:transparent;text-align:initial;background-color:transparent}.toggle:hover{background-color:var(--calcite-color-foreground-2)}.toggle:focus{outline:2px solid var(--calcite-color-brand);outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}calcite-loader[inline]{grid-area:control;align-self:center}calcite-handle{grid-area:handle}.title{margin:0px;padding:0.75rem}.header .title .heading{padding:0px;font-size:var(--calcite-font-size--1);font-weight:var(--calcite-font-weight-medium);line-height:1.25;color:var(--calcite-color-text-2);transition-property:color;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);word-wrap:break-word;word-break:break-word}.description{margin-block-start:0.125rem;padding:0px;font-size:var(--calcite-font-size--2);line-height:1.375;color:var(--calcite-color-text-3);word-wrap:break-word;word-break:break-word}.icon{display:flex;margin-inline-start:0.75rem;margin-inline-end:0px}.status-icon.valid{color:var(--calcite-color-status-success)}.status-icon.invalid{color:var(--calcite-color-status-danger)}@keyframes spin{0%{transform:rotate(0deg)}50%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}.toggle-icon{margin-block:0.75rem;align-self:center;justify-self:end;color:var(--calcite-color-text-3);transition-property:color;transition-duration:150ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);margin-inline-end:0.75rem;margin-inline-start:auto}.toggle:hover .toggle-icon{color:var(--calcite-color-text-1)}.container{position:relative;display:flex;block-size:100%;flex-direction:column}.content{position:relative;min-block-size:0px;flex:1 1 0%}@keyframes in{0%{opacity:0}100%{opacity:1}}.content{animation:in var(--calcite-internal-animation-timing-slow) ease-in-out;padding-block:var(--calcite-block-padding, 0.5rem);padding-inline:var(--calcite-block-padding, 0.625rem)}.control-container{margin:0px;display:flex;grid-area:control}calcite-action-menu{grid-area:menu}:host([open]){margin-block:0.5rem}:host([open]) .header .title .heading{color:var(--calcite-color-text-1)}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Block = class {
     constructor(hostRef) {
@@ -189,11 +189,11 @@ const Block = class {
         const hasMenuActions = !!dom.getSlotted(el, SLOTS.headerMenuActions);
         const collapseIcon = open ? ICONS$1.opened : ICONS$1.closed;
         const headerNode = (index.h("div", { class: CSS$1.headerContainer }, this.dragHandle ? index.h("calcite-handle", null) : null, collapsible ? (index.h("button", { "aria-controls": IDS$1.content, "aria-describedby": IDS$1.header, "aria-expanded": collapsible ? dom.toAriaBoolean(open) : null, class: CSS$1.toggle, id: IDS$1.toggle, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, index.h("calcite-icon", { "aria-hidden": "true", class: CSS$1.toggleIcon, icon: collapseIcon, scale: "s" }))) : (headerContent), hasControl ? (index.h("div", { class: CSS$1.controlContainer }, index.h("slot", { name: SLOTS.control }))) : null, hasMenuActions ? (index.h("calcite-action-menu", { label: messages.options }, index.h("slot", { name: SLOTS.headerMenuActions }))) : null));
-        return (index.h(index.Host, null, index.h("article", { "aria-busy": dom.toAriaBoolean(loading), class: {
+        return (index.h(index.Host, null, index.h(interactive.InteractiveContainer, { disabled: this.disabled }, index.h("article", { "aria-busy": dom.toAriaBoolean(loading), class: {
                 [CSS$1.container]: true,
             } }, headerNode, index.h("section", { "aria-labelledby": IDS$1.toggle, class: CSS$1.content, hidden: !open, id: IDS$1.content,
             // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-            ref: this.setTransitionEl }, this.renderScrim()))));
+            ref: this.setTransitionEl }, this.renderScrim())))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return index.getElement(this); }