@esri/calcite-components 2.8.0-next.2 → 2.8.0-next.4

package/dist/collection/components/tabs/tabs.css

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:22 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:08 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/tabs/tabs.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { html } from "../../../support/formatting";

package/dist/collection/components/tabs/tabs.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { Fragment, h } from "@stencil/core";
 import { createObserver } from "../../utils/observers";
@@ -48,7 +48,7 @@ export class Tabs {
         this.mutationObserver?.disconnect();
     }
     render() {
-        return (h(Fragment, { key: 'c675bc7fb08cc2e5a6d9b743c9d41f7e03df0e1b' }, h("slot", { key: '0c7e1f2454f89b7a3d2bbf9c031977a0c5fb0f98', name: SLOTS.titleGroup }), h("section", { key: 'f6381f3444e19a210c7c41e6e815b17dd3a95f4b' }, h("slot", { key: 'd7b29c74a0eb3e0a94d5a79523adf0e1e38dc8d3' }))));
+        return (h(Fragment, { key: '08a34679c4ea21e2cebf5eeb82bbc3c71d9234e1' }, h("slot", { key: 'fb4946f9068b8c645b1c005d57ad6e5072a4158d', name: SLOTS.titleGroup }), h("section", { key: 'cde75da1d636f232d2b1bc03f19a5f9677559c12' }, h("slot", { key: 'd1287db8316750f7925e3334e1083b274b71686e' }))));
     }
     //--------------------------------------------------------------------------
     //

package/dist/collection/components/text-area/resources.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 export const CSS = {
     assistiveText: "assistive-text",

package/dist/collection/components/text-area/text-area.css

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:22 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:08 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/text-area/text-area.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { accessible, defaults, disabled, focusable, formAssociated, hidden, labelable, reflects, renders, t9n, } from "../../tests/commonTests";

package/dist/collection/components/text-area/text-area.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { h, Host, forceUpdate, } from "@stencil/core";
 import { throttle } from "lodash-es";
@@ -144,7 +144,7 @@ export class TextArea {
     }
     render() {
         const hasFooter = this.startSlotHasElements || this.endSlotHasElements || !!this.maxLength;
-        return (h(Host, { key: '8b31eafb22d17ab96ad47073f253ac24c6d6d110' }, h(InteractiveContainer, { key: '3587e36345785ef2972dffb998890c91c66a316b', disabled: this.disabled }, h("textarea", { key: '49e1a6d836c5172b8eacfedc242bbf1d5cafac1a', "aria-describedby": this.guid, "aria-invalid": toAriaBoolean(this.isCharacterLimitExceeded()), "aria-label": getLabelText(this), autofocus: this.el.autofocus, class: {
+        return (h(Host, { key: 'c92b2854ce3a250fd5d5992e82449268c3b1c2c1' }, h(InteractiveContainer, { key: 'd9641c3172335a10c6a966ab891f572c90633397', disabled: this.disabled }, h("textarea", { key: '17553e387490d2ac21573905e08c83937cffcda3', "aria-describedby": this.guid, "aria-invalid": toAriaBoolean(this.isCharacterLimitExceeded()), "aria-label": getLabelText(this), autofocus: this.el.autofocus, class: {
                 [CSS.readOnly]: this.readOnly,
                 [CSS.textAreaInvalid]: this.isCharacterLimitExceeded(),
                 [CSS.footerSlotted]: this.endSlotHasElements && this.startSlotHasElements,
@@ -152,16 +152,16 @@ export class TextArea {
                 [CSS.borderColor]: !hasFooter,
             }, cols: this.columns, disabled: this.disabled, name: this.name, onChange: this.handleChange, onInput: this.handleInput, placeholder: this.placeholder, readOnly: this.readOnly, required: this.required, rows: this.rows, value: this.value, wrap: this.wrap,
             // 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.setTextAreaEl }), h("span", { key: '99ec9e0240c886a8970460de5935667f09547fc6', class: { [CSS.content]: true } }, h("slot", { key: 'ded217f9e7d6bae73d30d76adbede0369354e97f', onSlotchange: this.contentSlotChangeHandler })), h("footer", { key: '7c4cacfa34c164e5b211df9957c703f704154c46', class: {
+            ref: this.setTextAreaEl }), h("span", { key: 'c1bd47e7ecc1d32d96aaec90c610c5ac4dda88d5', class: { [CSS.content]: true } }, h("slot", { key: 'd3a903205379e9d000c9e5ffa551aad8ab93f6df', onSlotchange: this.contentSlotChangeHandler })), h("footer", { key: '8d1988fdd65171d63214a116266b77690fb79b6e', class: {
                 [CSS.footer]: true,
                 [CSS.readOnly]: this.readOnly,
                 [CSS.hide]: !hasFooter,
             },
             // eslint-disable-next-line react/jsx-sort-props -- auto-generated by @esri/calcite-components/enforce-ref-last-prop
-            ref: (el) => (this.footerEl = el) }, h("div", { key: '00f6110abab57902cc30fe34b49a53d7b165c290', class: {
+            ref: (el) => (this.footerEl = el) }, h("div", { key: '8cf4980189446447906714850306f1e320400ee1', class: {
                 [CSS.container]: true,
                 [CSS.footerEndSlotOnly]: !this.startSlotHasElements && this.endSlotHasElements,
-            } }, h("slot", { key: '9271e0c6c362dd6b66540d5eea466c0eb34ee1cd', name: SLOTS.footerStart, onSlotchange: (event) => (this.startSlotHasElements = slotChangeHasAssignedElement(event)) }), h("slot", { key: '98ae8566a27995a23df3ef7ba3d74787515a3cc4', name: SLOTS.footerEnd, onSlotchange: (event) => (this.endSlotHasElements = slotChangeHasAssignedElement(event)) })), this.renderCharacterLimit()), h(HiddenFormInputSlot, { key: 'e5ff5d67553d540dd17c56013f803acf371a6163', component: this }), this.isCharacterLimitExceeded() && (h("span", { "aria-hidden": true, "aria-live": "polite", class: CSS.assistiveText, id: this.guid }, this.replacePlaceHoldersInMessages())), this.validationMessage && this.status === "invalid" ? (h(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null)));
+            } }, h("slot", { key: 'bbdd41733fe2e3e3991f90060ffdda8e7369f7c6', name: SLOTS.footerStart, onSlotchange: (event) => (this.startSlotHasElements = slotChangeHasAssignedElement(event)) }), h("slot", { key: 'a992f46944527c11c5058fafedcb2f0848916cc7', name: SLOTS.footerEnd, onSlotchange: (event) => (this.endSlotHasElements = slotChangeHasAssignedElement(event)) })), this.renderCharacterLimit()), h(HiddenFormInputSlot, { key: 'e0f3810565d358d8570438ab719d8f2ad00362c7', component: this }), this.isCharacterLimitExceeded() && (h("span", { key: '6841b50727f8571cf556deda78f39fa02e6d9bee', "aria-hidden": true, "aria-live": "polite", class: CSS.assistiveText, id: this.guid }, this.replacePlaceHoldersInMessages())), this.validationMessage && this.status === "invalid" ? (h(Validation, { icon: this.validationIcon, message: this.validationMessage, scale: this.scale, status: this.status })) : null)));
     }
     //--------------------------------------------------------------------------
     //

package/dist/collection/components/text-area/text-area.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../../src/components/text-area/text-area.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,CAAC,EACD,IAAI,EACJ,OAAO,EACP,KAAK,EAGL,KAAK,EACL,MAAM,EACN,IAAI,EACJ,KAAK,EACL,WAAW,GACZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,cAAc,EAAiB,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACnG,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,YAAY,EAAsB,MAAM,mBAAmB,CAAC;AACpG,OAAO,EAAE,4BAA4B,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC9E,OAAO,EACL,gBAAgB,EAChB,mBAAmB,EAGnB,qBAAqB,GACtB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EACL,kBAAkB,EAClB,eAAe,EAEf,kBAAkB,EAClB,sBAAsB,GACvB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,aAAa,EAEb,cAAc,GACf,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,kBAAkB,EAClB,qBAAqB,EAErB,oBAAoB,EACpB,qBAAqB,GACtB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAyB,MAAM,uBAAuB,CAAC;AAGnF,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAEzD;;;;GAIG;AAQH,MAAM,OAAO,QAAQ;;QAuVX,SAAI,GAAG,IAAI,EAAE,CAAC;QActB,gBAAW,GAAG,CAAC,KAAiB,EAAQ,EAAE;YACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;YACnC,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,CAAC;QACnC,CAAC,CAAC;QAEF,iBAAY,GAAG,GAAS,EAAE;YACxB,IAAI,CAAC,qBAAqB,CAAC,IAAI,EAAE,CAAC;QACpC,CAAC,CAAC;QAEF,6BAAwB,GAAG,GAAS,EAAE;YACpC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;gBAChB,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC;gBACjC,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;oBACnB,IAAI,EAAE,CAAC,QAAQ,KAAK,OAAO,EAAE,CAAC;wBAC5B,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;oBACnC,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QAEF,yBAAoB,GAAG,GAAiB,EAAE;YACxC,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACnB,IAAI,CAAC,2BAA2B,GAAG,IAAI,CAAC,2BAA2B,EAAE,CAAC;gBACtE,OAAO,CACL,YAAM,KAAK,EAAE,GAAG,CAAC,cAAc;oBAC7B,YAAM,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,kBAAkB,CAAC,EAAE,IAAI,CAAC,wBAAwB,EAAE,EAAE,IACvE,IAAI,CAAC,2BAA2B,CAAC,aAAa,CAC1C;oBACN,GAAG;oBACH,IAAI,CAAC,2BAA2B,CAAC,SAAS,CACtC,CACR,CAAC;YACJ,CAAC;YACD,OAAO,IAAI,CAAC;QACd,CAAC,CAAC;QAqBF,mBAAc,GAAG,cAAc,CAAC,QAAQ,EAAE,KAAK,IAAI,EAAE;YACnD,MAAM,eAAe,CAAC,IAAI,CAAC,CAAC;YAC5B,MAAM,EAAE,cAAc,EAAE,aAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,GACnF,IAAI,CAAC,2BAA2B,EAAE,CAAC;YACrC,IAAI,WAAW,GAAG,CAAC,IAAI,WAAW,KAAK,aAAa,EAAE,CAAC;gBACrD,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,aAAa,IAAI,CAAC;YACnD,CAAC;YACD,IAAI,OAAO,KAAK,aAAa,IAAI,QAAQ,KAAK,cAAc,GAAG,CAAC,YAAY,IAAI,CAAC,CAAC,EAAE,CAAC;gBACnF,IAAI,CAAC,uBAAuB,EAAE,CAAC;YACjC,CAAC;QACH,CAAC,CAAC,CAAC;QAWH,kBAAa,GAAG,CAAC,EAAuB,EAAQ,EAAE;YAChD,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;YACrB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAClC,CAAC,CAAC;QAsCF,iIAAiI;QACjI,oEAAoE;QAC5D,4BAAuB,GAAG,QAAQ,CACxC,GAAS,EAAE;YACT,IAAI,IAAI,CAAC,MAAM,KAAK,UAAU,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;gBACzD,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;YAChC,CAAC;YACD,IAAI,IAAI,CAAC,MAAM,KAAK,YAAY,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;gBAC3D,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC;YAC/B,CAAC;QACH,CAAC,EACD,cAAc,EACd,EAAE,OAAO,EAAE,KAAK,EAAE,CACnB,CAAC;;wBAhckC,KAAK;;8BAaC,KAAK;;;;;;;;;;wBA4DX,KAAK;wBAOL,KAAK;sBAGsC,MAAM;;qBAUnC,GAAG;sBAGX,MAAM;qBAGf,EAAE;oBAOc,MAAM;;;;;+BA+L5B,EAAE;;IAtU7B,4EAA4E;IAC5E,EAAE;IACF,qBAAqB;IACrB,EAAE;IACF,4EAA4E;IAG5E,6BAA6B;QAC3B,WAAW,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC;IAuID,gBAAgB;QACd,0BAA0B;IAC5B,CAAC;IAiBD,4EAA4E;IAC5E,EAAE;IACF,aAAa;IACb,EAAE;IACF,4EAA4E;IAE5E,iBAAiB;QACf,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,WAAW,CAAC,IAAI,CAAC,CAAC;QAClB,gBAAgB,CAAC,IAAI,CAAC,CAAC;QACvB,eAAe,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC;IAED,KAAK,CAAC,iBAAiB;QACrB,sBAAsB,CAAC,IAAI,CAAC,CAAC;QAC7B,MAAM,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5B,CAAC;IAED,gBAAgB;QACd,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;IAED,kBAAkB;QAChB,qBAAqB,CAAC,IAAI,CAAC,CAAC;QAC5B,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAED,oBAAoB;QAClB,qBAAqB,CAAC,IAAI,CAAC,CAAC;QAC5B,eAAe,CAAC,IAAI,CAAC,CAAC;QACtB,cAAc,CAAC,IAAI,CAAC,CAAC;QACrB,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAC1B,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,IAAI,CAAC,cAAc,EAAE,UAAU,EAAE,CAAC;IACpC,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,kBAAkB,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC;QAC3F,OAAO,CACL,EAAC,IAAI;YACH,EAAC,oBAAoB,qDAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBAC3C,qFACoB,IAAI,CAAC,IAAI,kBACb,aAAa,CAAC,IAAI,CAAC,wBAAwB,EAAE,CAAC,gBAChD,YAAY,CAAC,IAAI,CAAC,EAC9B,SAAS,EAAE,IAAI,CAAC,EAAE,CAAC,SAAS,EAC5B,KAAK,EAAE;wBACL,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,QAAQ;wBAC7B,CAAC,GAAG,CAAC,eAAe,CAAC,EAAE,IAAI,CAAC,wBAAwB,EAAE;wBACtD,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,oBAAoB;wBACzE,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,CAAC,SAAS;wBAC/B,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,SAAS;qBAC9B,EACD,IAAI,EAAE,IAAI,CAAC,OAAO,EAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI;oBACf,oKAAoK;oBACpK,GAAG,EAAE,IAAI,CAAC,aAAa,GACvB;gBACF,6DAAM,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE;oBAClC,6DAAM,YAAY,EAAE,IAAI,CAAC,wBAAwB,GAAI,CAChD;gBACP,+DACE,KAAK,EAAE;wBACL,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,IAAI;wBAClB,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,QAAQ;wBAC7B,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,SAAS;qBACvB;oBACD,oHAAoH;oBACpH,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAiB,CAAC;oBAEhD,4DACE,KAAK,EAAE;4BACL,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,IAAI;4BACrB,CAAC,GAAG,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,kBAAkB;yBAC/E;wBAED,6DACE,IAAI,EAAE,KAAK,CAAC,WAAW,EACvB,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE,CACtB,CAAC,IAAI,CAAC,oBAAoB,GAAG,4BAA4B,CAAC,KAAK,CAAC,CAAC,GAEnE;wBACF,6DACE,IAAI,EAAE,KAAK,CAAC,SAAS,EACrB,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE,CACtB,CAAC,IAAI,CAAC,kBAAkB,GAAG,4BAA4B,CAAC,KAAK,CAAC,CAAC,GAEjE,CACE;oBACL,IAAI,CAAC,oBAAoB,EAAE,CACrB;gBACT,EAAC,mBAAmB,qDAAC,SAAS,EAAE,IAAI,GAAI;gBACvC,IAAI,CAAC,wBAAwB,EAAE,IAAI,CAClC,2BAAmB,IAAI,eAAY,QAAQ,EAAC,KAAK,EAAE,GAAG,CAAC,aAAa,EAAE,EAAE,EAAE,IAAI,CAAC,IAAI,IAChF,IAAI,CAAC,6BAA6B,EAAE,CAChC,CACR;gBACA,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,CACrD,EAAC,UAAU,IACT,IAAI,EAAE,IAAI,CAAC,cAAc,EACzB,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,GACnB,CACH,CAAC,CAAC,CAAC,IAAI,CACa,CAClB,CACR,CAAC;IACJ,CAAC;IAED,4EAA4E;IAC5E,EAAE;IACF,kBAAkB;IAClB,EAAE;IACF,4EAA4E;IAE5E,mCAAmC;IAEnC,KAAK,CAAC,QAAQ;QACZ,MAAM,kBAAkB,CAAC,IAAI,CAAC,CAAC;QAC/B,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;IAC1B,CAAC;IAED,mDAAmD;IAEnD,KAAK,CAAC,UAAU;QACd,MAAM,eAAe,CAAC,IAAI,CAAC,CAAC;QAC5B,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC;IAC3B,CAAC;IA4BD,qBAAqB;QACnB,cAAc,CAAC,IAAI,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IAC7C,CAAC;IAMD,4EAA4E;IAC5E,EAAE;IACF,mBAAmB;IACnB,EAAE;IACF,4EAA4E;IAE5E,YAAY;QACV,IAAI,CAAC,QAAQ,EAAE,CAAC;IAClB,CAAC;IAsCD,2BAA2B;QACzB,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC;QACtE,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC;QAC5C,IAAI,IAAI,CAAC,eAAe,KAAK,MAAM,EAAE,CAAC;YACpC,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC;QACtC,CAAC;QAED,qBAAqB,CAAC,mBAAmB,GAAG;YAC1C,MAAM,EAAE,IAAI,CAAC,eAAe;YAC5B,eAAe,EAAE,IAAI,CAAC,eAAe;YACrC,WAAW,EAAE,OAAO;YACpB,WAAW,EAAE,IAAI,CAAC,cAAc;SACjC,CAAC;QACF,OAAO;YACL,aAAa,EAAE,qBAAqB,CAAC,QAAQ,CAAC,aAAa,CAAC;YAC5D,SAAS,EAAE,qBAAqB,CAAC,QAAQ,CAAC,SAAS,CAAC;SACrD,CAAC;IACJ,CAAC;IAcD,mBAAmB,CAAC,KAAuB;QACzC,KAAK,CAAC,iBAAiB,CAAC,EAAE,CAAC,CAAC;QAC5B,IAAI,IAAI,CAAC,wBAAwB,EAAE,EAAE,CAAC;YACpC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,6BAA6B,EAAE,CAAC,CAAC;QAChE,CAAC;QAED,mBAAmB,CAAC,UAAU,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;IAC/C,CAAC;IAOD,iBAAiB;QACf,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,2BAA2B,EAAE,CAAC;QACtF,IAAI,YAAY,GAAG,CAAC,IAAI,cAAc,GAAG,YAAY,IAAI,QAAQ,EAAE,CAAC;YAClE,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,QAAQ,GAAG,YAAY,IAAI,CAAC;QAChE,CAAC;IACH,CAAC;IAED,2BAA2B;QAQzB,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,aAAa,EAAE,GACpD,IAAI,CAAC,UAAU,CAAC,qBAAqB,EAAE,CAAC;QAC1C,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC;QAC7E,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,QAAQ,EAAE,qBAAqB,EAAE,CAAC;QAE5F,OAAO;YACL,cAAc;YACd,aAAa;YACb,QAAQ;YACR,OAAO;YACP,YAAY;YACZ,WAAW;SACZ,CAAC;IACJ,CAAC;IAEO,6BAA6B;QACnC,OAAO,IAAI,CAAC,QAAQ,CAAC,OAAO;aACzB,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,2BAA2B,CAAC,SAAS,CAAC;aAClE,OAAO,CAAC,iBAAiB,EAAE,IAAI,CAAC,2BAA2B,CAAC,aAAa,CAAC,CAAC;IAChF,CAAC;IAiBO,wBAAwB;QAC9B,OAAO,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC;IAC7C,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n  Component,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  VNode,\n  Watch,\n  Method,\n  Host,\n  State,\n  forceUpdate,\n} from \"@stencil/core\";\nimport { throttle } from \"lodash-es\";\nimport { connectForm, disconnectForm, FormComponent, HiddenFormInputSlot } from \"../../utils/form\";\nimport { connectLabel, disconnectLabel, getLabelText, LabelableComponent } from \"../../utils/label\";\nimport { slotChangeHasAssignedElement, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  connectLocalized,\n  disconnectLocalized,\n  LocalizedComponent,\n  NumberingSystem,\n  numberStringFormatter,\n} from \"../../utils/locale\";\nimport { createObserver } from \"../../utils/observers\";\nimport {\n  componentFocusable,\n  componentLoaded,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { guid } from \"../../utils/guid\";\nimport { Status } from \"../interfaces\";\nimport { Validation } from \"../functional/Validation\";\nimport { syncHiddenFormInput, TextualInputComponent } from \"../input/common/input\";\nimport { CharacterLengthObj } from \"./interfaces\";\nimport { TextAreaMessages } from \"./assets/text-area/t9n\";\nimport { CSS, SLOTS, RESIZE_TIMEOUT } from \"./resources\";\n\n/**\n * @slot - A slot for adding text.\n * @slot footer-start - A slot for adding content to the start of the component's footer.\n * @slot footer-end - A slot for adding content to the end of the component's footer.\n */\n\n@Component({\n  tag: \"calcite-text-area\",\n  styleUrl: \"text-area.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class TextArea\n  implements\n    FormComponent,\n    LabelableComponent,\n    LocalizedComponent,\n    LoadableComponent,\n    T9nComponent,\n    InteractiveComponent,\n    Omit<TextualInputComponent, \"pattern\">\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Global attributes\n  //\n  //--------------------------------------------------------------------------\n\n  @Watch(\"autofocus\")\n  handleGlobalAttributesChanged(): void {\n    forceUpdate(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Specifies the component's number of columns.\n   *\n   * @mdn [cols](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-cols)\n   */\n  @Prop({ reflect: true }) columns: number;\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   *\n   * @mdn [disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled)\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * The `id` of the form that will be associated with the component.\n   *\n   * When not set, the component will be associated with its ancestor form element, if any.\n   */\n  @Prop({ reflect: true })\n  form: string;\n\n  /**\n   * When `true`, number values are displayed with a group separator corresponding to the language and country format.\n   */\n  @Prop({ reflect: true }) groupSeparator = false;\n\n  /**\n   * Accessible name for the component.\n   */\n  @Prop() label: string;\n\n  /**\n   * Specifies the minimum number of characters allowed.\n   *\n   * @mdn [minlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-minlength)\n   */\n  @Prop({ reflect: true }) minLength: number;\n\n  /**\n   * Specifies the maximum number of characters allowed.\n   *\n   * @mdn [maxlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-maxlength)\n   */\n  @Prop({ reflect: true }) maxLength: number;\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: TextAreaMessages;\n\n  /** Specifies the validation message to display under the component. */\n  @Prop() validationMessage: string;\n\n  /** Specifies the validation icon to display under the component. */\n  @Prop({ reflect: true }) validationIcon: string | boolean;\n\n  /**\n   * Specifies the name of the component.\n   *\n   * @mdn [name](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-name)\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /**\n   * Specifies the Unicode numeral system used by the component for localization.\n   */\n  @Prop() numberingSystem: NumberingSystem;\n\n  /**\n   * Specifies the placeholder text for the component.\n   *\n   * @mdn [placeholder](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-placeholder)\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * When `true`, the component's `value` can be read, but cannot be modified.\n   *\n   * @readonly\n   * @mdn [readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)\n   */\n  @Prop({ reflect: true }) readOnly = false;\n\n  /**\n   * When `true`, the component must have a value in order for the form to submit.\n   *\n   * @mdn [required]https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/required\n   */\n  @Prop({ reflect: true }) required = false;\n\n  /** Specifies if the component is resizable. */\n  @Prop({ reflect: true }) resize: \"both\" | \"horizontal\" | \"vertical\" | \"none\" = \"both\";\n\n  /**\n   * Specifies the component's number of rows.\n   *\n   * @mdn [rows](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-rows)\n   */\n  @Prop({ reflect: true }) rows: number;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: \"l\" | \"m\" | \"s\" = \"m\";\n\n  /** Specifies the status of the input field, which determines message and icons. */\n  @Prop({ reflect: true }) status: Status = \"idle\";\n\n  /** The component's value. */\n  @Prop({ mutable: true }) value = \"\";\n\n  /**\n   * Specifies the wrapping mechanism for the text.\n   *\n   * @mdn [wrap](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-wrap)\n   */\n  @Prop({ reflect: true }) wrap: \"soft\" | \"hard\" = \"soft\";\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<TextAreaMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Emitters\n  //\n  //--------------------------------------------------------------------------\n  /**\n   * Fires each time a new `value` is typed.\n   */\n  @Event() calciteTextAreaInput: EventEmitter<void>;\n\n  /**\n   * Fires each time a new `value` is typed and committed.\n   */\n  @Event() calciteTextAreaChange: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLabel(this);\n    connectForm(this);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n    this.setTextAreaHeight();\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLabel(this);\n    disconnectForm(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.resizeObserver?.disconnect();\n  }\n\n  render(): VNode {\n    const hasFooter = this.startSlotHasElements || this.endSlotHasElements || !!this.maxLength;\n    return (\n      <Host>\n        <InteractiveContainer disabled={this.disabled}>\n          <textarea\n            aria-describedby={this.guid}\n            aria-invalid={toAriaBoolean(this.isCharacterLimitExceeded())}\n            aria-label={getLabelText(this)}\n            autofocus={this.el.autofocus}\n            class={{\n              [CSS.readOnly]: this.readOnly,\n              [CSS.textAreaInvalid]: this.isCharacterLimitExceeded(),\n              [CSS.footerSlotted]: this.endSlotHasElements && this.startSlotHasElements,\n              [CSS.blockSizeFull]: !hasFooter,\n              [CSS.borderColor]: !hasFooter,\n            }}\n            cols={this.columns}\n            disabled={this.disabled}\n            name={this.name}\n            onChange={this.handleChange}\n            onInput={this.handleInput}\n            placeholder={this.placeholder}\n            readOnly={this.readOnly}\n            required={this.required}\n            rows={this.rows}\n            value={this.value}\n            wrap={this.wrap}\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={this.setTextAreaEl}\n          />\n          <span class={{ [CSS.content]: true }}>\n            <slot onSlotchange={this.contentSlotChangeHandler} />\n          </span>\n          <footer\n            class={{\n              [CSS.footer]: true,\n              [CSS.readOnly]: this.readOnly,\n              [CSS.hide]: !hasFooter,\n            }}\n            // eslint-disable-next-line react/jsx-sort-props -- auto-generated by @esri/calcite-components/enforce-ref-last-prop\n            ref={(el) => (this.footerEl = el as HTMLElement)}\n          >\n            <div\n              class={{\n                [CSS.container]: true,\n                [CSS.footerEndSlotOnly]: !this.startSlotHasElements && this.endSlotHasElements,\n              }}\n            >\n              <slot\n                name={SLOTS.footerStart}\n                onSlotchange={(event) =>\n                  (this.startSlotHasElements = slotChangeHasAssignedElement(event))\n                }\n              />\n              <slot\n                name={SLOTS.footerEnd}\n                onSlotchange={(event) =>\n                  (this.endSlotHasElements = slotChangeHasAssignedElement(event))\n                }\n              />\n            </div>\n            {this.renderCharacterLimit()}\n          </footer>\n          <HiddenFormInputSlot component={this} />\n          {this.isCharacterLimitExceeded() && (\n            <span aria-hidden={true} aria-live=\"polite\" class={CSS.assistiveText} id={this.guid}>\n              {this.replacePlaceHoldersInMessages()}\n            </span>\n          )}\n          {this.validationMessage && this.status === \"invalid\" ? (\n            <Validation\n              icon={this.validationIcon}\n              message={this.validationMessage}\n              scale={this.scale}\n              status={this.status}\n            />\n          ) : null}\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    this.textAreaEl.focus();\n  }\n\n  /** Selects the text of the component's `value`. */\n  @Method()\n  async selectText(): Promise<void> {\n    await componentLoaded(this);\n    this.textAreaEl.select();\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties/ State\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteTextAreaElement;\n\n  defaultValue: TextArea[\"value\"];\n\n  footerEl: HTMLElement;\n\n  formEl: HTMLFormElement;\n\n  labelEl: HTMLCalciteLabelElement;\n\n  textAreaEl: HTMLTextAreaElement;\n\n  @State() defaultMessages: TextAreaMessages;\n\n  @State() endSlotHasElements: boolean;\n\n  @State() startSlotHasElements: boolean;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  private guid = guid();\n\n  private localizedCharacterLengthObj: CharacterLengthObj;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  onLabelClick(): void {\n    this.setFocus();\n  }\n\n  handleInput = (event: InputEvent): void => {\n    this.value = event.target[\"value\"];\n    this.calciteTextAreaInput.emit();\n  };\n\n  handleChange = (): void => {\n    this.calciteTextAreaChange.emit();\n  };\n\n  contentSlotChangeHandler = (): void => {\n    if (!this.value) {\n      const nodes = this.el.childNodes;\n      nodes.forEach((el) => {\n        if (el.nodeName === \"#text\") {\n          this.value = el.nodeValue.trim();\n        }\n      });\n    }\n  };\n\n  renderCharacterLimit = (): VNode | null => {\n    if (this.maxLength) {\n      this.localizedCharacterLengthObj = this.getLocalizedCharacterLength();\n      return (\n        <span class={CSS.characterLimit}>\n          <span class={{ [CSS.characterOverLimit]: this.isCharacterLimitExceeded() }}>\n            {this.localizedCharacterLengthObj.currentLength}\n          </span>\n          {\"/\"}\n          {this.localizedCharacterLengthObj.maxLength}\n        </span>\n      );\n    }\n    return null;\n  };\n\n  getLocalizedCharacterLength(): CharacterLengthObj {\n    const currentLength = this.value ? this.value.length.toString() : \"0\";\n    const maxLength = this.maxLength.toString();\n    if (this.numberingSystem === \"latn\") {\n      return { currentLength, maxLength };\n    }\n\n    numberStringFormatter.numberFormatOptions = {\n      locale: this.effectiveLocale,\n      numberingSystem: this.numberingSystem,\n      signDisplay: \"never\",\n      useGrouping: this.groupSeparator,\n    };\n    return {\n      currentLength: numberStringFormatter.localize(currentLength),\n      maxLength: numberStringFormatter.localize(maxLength),\n    };\n  }\n\n  resizeObserver = createObserver(\"resize\", async () => {\n    await componentLoaded(this);\n    const { textAreaHeight, textAreaWidth, elHeight, elWidth, footerHeight, footerWidth } =\n      this.getHeightAndWidthOfElements();\n    if (footerWidth > 0 && footerWidth !== textAreaWidth) {\n      this.footerEl.style.width = `${textAreaWidth}px`;\n    }\n    if (elWidth !== textAreaWidth || elHeight !== textAreaHeight + (footerHeight || 0)) {\n      this.setHeightAndWidthToAuto();\n    }\n  });\n\n  syncHiddenFormInput(input: HTMLInputElement): void {\n    input.setCustomValidity(\"\");\n    if (this.isCharacterLimitExceeded()) {\n      input.setCustomValidity(this.replacePlaceHoldersInMessages());\n    }\n\n    syncHiddenFormInput(\"textarea\", this, input);\n  }\n\n  setTextAreaEl = (el: HTMLTextAreaElement): void => {\n    this.textAreaEl = el;\n    this.resizeObserver.observe(el);\n  };\n\n  setTextAreaHeight(): void {\n    const { textAreaHeight, elHeight, footerHeight } = this.getHeightAndWidthOfElements();\n    if (footerHeight > 0 && textAreaHeight + footerHeight != elHeight) {\n      this.textAreaEl.style.height = `${elHeight - footerHeight}px`;\n    }\n  }\n\n  getHeightAndWidthOfElements(): {\n    textAreaHeight: number;\n    textAreaWidth: number;\n    elHeight: number;\n    elWidth: number;\n    footerHeight: number;\n    footerWidth: number;\n  } {\n    const { height: textAreaHeight, width: textAreaWidth } =\n      this.textAreaEl.getBoundingClientRect();\n    const { height: elHeight, width: elWidth } = this.el.getBoundingClientRect();\n    const { height: footerHeight, width: footerWidth } = this.footerEl?.getBoundingClientRect();\n\n    return {\n      textAreaHeight,\n      textAreaWidth,\n      elHeight,\n      elWidth,\n      footerHeight,\n      footerWidth,\n    };\n  }\n\n  private replacePlaceHoldersInMessages(): string {\n    return this.messages.tooLong\n      .replace(\"{maxLength}\", this.localizedCharacterLengthObj.maxLength)\n      .replace(\"{currentLength}\", this.localizedCharacterLengthObj.currentLength);\n  }\n\n  // height and width are set to auto here to avoid overlapping on to neighboring elements in the layout when user starts resizing.\n  // throttle is used to avoid flashing of textarea when user resizes.\n  private setHeightAndWidthToAuto = throttle(\n    (): void => {\n      if (this.resize === \"vertical\" || this.resize === \"both\") {\n        this.el.style.height = \"auto\";\n      }\n      if (this.resize === \"horizontal\" || this.resize === \"both\") {\n        this.el.style.width = \"auto\";\n      }\n    },\n    RESIZE_TIMEOUT,\n    { leading: false },\n  );\n\n  private isCharacterLimitExceeded(): boolean {\n    return this.value?.length > this.maxLength;\n  }\n}\n"]}
+{"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../../../src/components/text-area/text-area.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,CAAC,EACD,IAAI,EACJ,OAAO,EACP,KAAK,EAGL,KAAK,EACL,MAAM,EACN,IAAI,EACJ,KAAK,EACL,WAAW,GACZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,cAAc,EAAiB,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AACnG,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,YAAY,EAAsB,MAAM,mBAAmB,CAAC;AACpG,OAAO,EAAE,4BAA4B,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC9E,OAAO,EACL,gBAAgB,EAChB,mBAAmB,EAGnB,qBAAqB,GACtB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EACL,kBAAkB,EAClB,eAAe,EAEf,kBAAkB,EAClB,sBAAsB,GACvB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,aAAa,EAEb,cAAc,GACf,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,kBAAkB,EAClB,qBAAqB,EAErB,oBAAoB,EACpB,qBAAqB,GACtB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAyB,MAAM,uBAAuB,CAAC;AAGnF,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAEzD;;;;GAIG;AAQH,MAAM,OAAO,QAAQ;;QAuVX,SAAI,GAAG,IAAI,EAAE,CAAC;QActB,gBAAW,GAAG,CAAC,KAAiB,EAAQ,EAAE;YACxC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;YACnC,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,CAAC;QACnC,CAAC,CAAC;QAEF,iBAAY,GAAG,GAAS,EAAE;YACxB,IAAI,CAAC,qBAAqB,CAAC,IAAI,EAAE,CAAC;QACpC,CAAC,CAAC;QAEF,6BAAwB,GAAG,GAAS,EAAE;YACpC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;gBAChB,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC;gBACjC,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;oBACnB,IAAI,EAAE,CAAC,QAAQ,KAAK,OAAO,EAAE,CAAC;wBAC5B,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;oBACnC,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QAEF,yBAAoB,GAAG,GAAiB,EAAE;YACxC,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACnB,IAAI,CAAC,2BAA2B,GAAG,IAAI,CAAC,2BAA2B,EAAE,CAAC;gBACtE,OAAO,CACL,YAAM,KAAK,EAAE,GAAG,CAAC,cAAc;oBAC7B,YAAM,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,kBAAkB,CAAC,EAAE,IAAI,CAAC,wBAAwB,EAAE,EAAE,IACvE,IAAI,CAAC,2BAA2B,CAAC,aAAa,CAC1C;oBACN,GAAG;oBACH,IAAI,CAAC,2BAA2B,CAAC,SAAS,CACtC,CACR,CAAC;YACJ,CAAC;YACD,OAAO,IAAI,CAAC;QACd,CAAC,CAAC;QAqBF,mBAAc,GAAG,cAAc,CAAC,QAAQ,EAAE,KAAK,IAAI,EAAE;YACnD,MAAM,eAAe,CAAC,IAAI,CAAC,CAAC;YAC5B,MAAM,EAAE,cAAc,EAAE,aAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,GACnF,IAAI,CAAC,2BAA2B,EAAE,CAAC;YACrC,IAAI,WAAW,GAAG,CAAC,IAAI,WAAW,KAAK,aAAa,EAAE,CAAC;gBACrD,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,aAAa,IAAI,CAAC;YACnD,CAAC;YACD,IAAI,OAAO,KAAK,aAAa,IAAI,QAAQ,KAAK,cAAc,GAAG,CAAC,YAAY,IAAI,CAAC,CAAC,EAAE,CAAC;gBACnF,IAAI,CAAC,uBAAuB,EAAE,CAAC;YACjC,CAAC;QACH,CAAC,CAAC,CAAC;QAWH,kBAAa,GAAG,CAAC,EAAuB,EAAQ,EAAE;YAChD,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;YACrB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAClC,CAAC,CAAC;QAsCF,iIAAiI;QACjI,oEAAoE;QAC5D,4BAAuB,GAAG,QAAQ,CACxC,GAAS,EAAE;YACT,IAAI,IAAI,CAAC,MAAM,KAAK,UAAU,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;gBACzD,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;YAChC,CAAC;YACD,IAAI,IAAI,CAAC,MAAM,KAAK,YAAY,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;gBAC3D,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC;YAC/B,CAAC;QACH,CAAC,EACD,cAAc,EACd,EAAE,OAAO,EAAE,KAAK,EAAE,CACnB,CAAC;;wBAhckC,KAAK;;8BAaC,KAAK;;;;;;;;;;wBA4DX,KAAK;wBAOL,KAAK;sBAGsC,MAAM;;qBAUnC,GAAG;sBAGX,MAAM;qBAGf,EAAE;oBAOc,MAAM;;;;;+BA+L5B,EAAE;;IAtU7B,4EAA4E;IAC5E,EAAE;IACF,qBAAqB;IACrB,EAAE;IACF,4EAA4E;IAG5E,6BAA6B;QAC3B,WAAW,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC;IAuID,gBAAgB;QACd,0BAA0B;IAC5B,CAAC;IAiBD,4EAA4E;IAC5E,EAAE;IACF,aAAa;IACb,EAAE;IACF,4EAA4E;IAE5E,iBAAiB;QACf,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,WAAW,CAAC,IAAI,CAAC,CAAC;QAClB,gBAAgB,CAAC,IAAI,CAAC,CAAC;QACvB,eAAe,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC;IAED,KAAK,CAAC,iBAAiB;QACrB,sBAAsB,CAAC,IAAI,CAAC,CAAC;QAC7B,MAAM,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5B,CAAC;IAED,gBAAgB;QACd,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;IAED,kBAAkB;QAChB,qBAAqB,CAAC,IAAI,CAAC,CAAC;QAC5B,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAED,oBAAoB;QAClB,qBAAqB,CAAC,IAAI,CAAC,CAAC;QAC5B,eAAe,CAAC,IAAI,CAAC,CAAC;QACtB,cAAc,CAAC,IAAI,CAAC,CAAC;QACrB,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAC1B,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,IAAI,CAAC,cAAc,EAAE,UAAU,EAAE,CAAC;IACpC,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,kBAAkB,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC;QAC3F,OAAO,CACL,EAAC,IAAI;YACH,EAAC,oBAAoB,qDAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBAC3C,qFACoB,IAAI,CAAC,IAAI,kBACb,aAAa,CAAC,IAAI,CAAC,wBAAwB,EAAE,CAAC,gBAChD,YAAY,CAAC,IAAI,CAAC,EAC9B,SAAS,EAAE,IAAI,CAAC,EAAE,CAAC,SAAS,EAC5B,KAAK,EAAE;wBACL,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,QAAQ;wBAC7B,CAAC,GAAG,CAAC,eAAe,CAAC,EAAE,IAAI,CAAC,wBAAwB,EAAE;wBACtD,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,oBAAoB;wBACzE,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,CAAC,SAAS;wBAC/B,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,SAAS;qBAC9B,EACD,IAAI,EAAE,IAAI,CAAC,OAAO,EAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI;oBACf,oKAAoK;oBACpK,GAAG,EAAE,IAAI,CAAC,aAAa,GACvB;gBACF,6DAAM,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE;oBAClC,6DAAM,YAAY,EAAE,IAAI,CAAC,wBAAwB,GAAI,CAChD;gBACP,+DACE,KAAK,EAAE;wBACL,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,IAAI;wBAClB,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,QAAQ;wBAC7B,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,SAAS;qBACvB;oBACD,oHAAoH;oBACpH,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAiB,CAAC;oBAEhD,4DACE,KAAK,EAAE;4BACL,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,IAAI;4BACrB,CAAC,GAAG,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,kBAAkB;yBAC/E;wBAED,6DACE,IAAI,EAAE,KAAK,CAAC,WAAW,EACvB,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE,CACtB,CAAC,IAAI,CAAC,oBAAoB,GAAG,4BAA4B,CAAC,KAAK,CAAC,CAAC,GAEnE;wBACF,6DACE,IAAI,EAAE,KAAK,CAAC,SAAS,EACrB,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE,CACtB,CAAC,IAAI,CAAC,kBAAkB,GAAG,4BAA4B,CAAC,KAAK,CAAC,CAAC,GAEjE,CACE;oBACL,IAAI,CAAC,oBAAoB,EAAE,CACrB;gBACT,EAAC,mBAAmB,qDAAC,SAAS,EAAE,IAAI,GAAI;gBACvC,IAAI,CAAC,wBAAwB,EAAE,IAAI,CAClC,4EAAmB,IAAI,eAAY,QAAQ,EAAC,KAAK,EAAE,GAAG,CAAC,aAAa,EAAE,EAAE,EAAE,IAAI,CAAC,IAAI,IAChF,IAAI,CAAC,6BAA6B,EAAE,CAChC,CACR;gBACA,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,CACrD,EAAC,UAAU,IACT,IAAI,EAAE,IAAI,CAAC,cAAc,EACzB,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,GACnB,CACH,CAAC,CAAC,CAAC,IAAI,CACa,CAClB,CACR,CAAC;IACJ,CAAC;IAED,4EAA4E;IAC5E,EAAE;IACF,kBAAkB;IAClB,EAAE;IACF,4EAA4E;IAE5E,mCAAmC;IAEnC,KAAK,CAAC,QAAQ;QACZ,MAAM,kBAAkB,CAAC,IAAI,CAAC,CAAC;QAC/B,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;IAC1B,CAAC;IAED,mDAAmD;IAEnD,KAAK,CAAC,UAAU;QACd,MAAM,eAAe,CAAC,IAAI,CAAC,CAAC;QAC5B,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC;IAC3B,CAAC;IA4BD,qBAAqB;QACnB,cAAc,CAAC,IAAI,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IAC7C,CAAC;IAMD,4EAA4E;IAC5E,EAAE;IACF,mBAAmB;IACnB,EAAE;IACF,4EAA4E;IAE5E,YAAY;QACV,IAAI,CAAC,QAAQ,EAAE,CAAC;IAClB,CAAC;IAsCD,2BAA2B;QACzB,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC;QACtE,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC;QAC5C,IAAI,IAAI,CAAC,eAAe,KAAK,MAAM,EAAE,CAAC;YACpC,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC;QACtC,CAAC;QAED,qBAAqB,CAAC,mBAAmB,GAAG;YAC1C,MAAM,EAAE,IAAI,CAAC,eAAe;YAC5B,eAAe,EAAE,IAAI,CAAC,eAAe;YACrC,WAAW,EAAE,OAAO;YACpB,WAAW,EAAE,IAAI,CAAC,cAAc;SACjC,CAAC;QACF,OAAO;YACL,aAAa,EAAE,qBAAqB,CAAC,QAAQ,CAAC,aAAa,CAAC;YAC5D,SAAS,EAAE,qBAAqB,CAAC,QAAQ,CAAC,SAAS,CAAC;SACrD,CAAC;IACJ,CAAC;IAcD,mBAAmB,CAAC,KAAuB;QACzC,KAAK,CAAC,iBAAiB,CAAC,EAAE,CAAC,CAAC;QAC5B,IAAI,IAAI,CAAC,wBAAwB,EAAE,EAAE,CAAC;YACpC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,6BAA6B,EAAE,CAAC,CAAC;QAChE,CAAC;QAED,mBAAmB,CAAC,UAAU,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;IAC/C,CAAC;IAOD,iBAAiB;QACf,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,2BAA2B,EAAE,CAAC;QACtF,IAAI,YAAY,GAAG,CAAC,IAAI,cAAc,GAAG,YAAY,IAAI,QAAQ,EAAE,CAAC;YAClE,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,QAAQ,GAAG,YAAY,IAAI,CAAC;QAChE,CAAC;IACH,CAAC;IAED,2BAA2B;QAQzB,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,aAAa,EAAE,GACpD,IAAI,CAAC,UAAU,CAAC,qBAAqB,EAAE,CAAC;QAC1C,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC,qBAAqB,EAAE,CAAC;QAC7E,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,QAAQ,EAAE,qBAAqB,EAAE,CAAC;QAE5F,OAAO;YACL,cAAc;YACd,aAAa;YACb,QAAQ;YACR,OAAO;YACP,YAAY;YACZ,WAAW;SACZ,CAAC;IACJ,CAAC;IAEO,6BAA6B;QACnC,OAAO,IAAI,CAAC,QAAQ,CAAC,OAAO;aACzB,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,2BAA2B,CAAC,SAAS,CAAC;aAClE,OAAO,CAAC,iBAAiB,EAAE,IAAI,CAAC,2BAA2B,CAAC,aAAa,CAAC,CAAC;IAChF,CAAC;IAiBO,wBAAwB;QAC9B,OAAO,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC;IAC7C,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n  Component,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  VNode,\n  Watch,\n  Method,\n  Host,\n  State,\n  forceUpdate,\n} from \"@stencil/core\";\nimport { throttle } from \"lodash-es\";\nimport { connectForm, disconnectForm, FormComponent, HiddenFormInputSlot } from \"../../utils/form\";\nimport { connectLabel, disconnectLabel, getLabelText, LabelableComponent } from \"../../utils/label\";\nimport { slotChangeHasAssignedElement, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  connectLocalized,\n  disconnectLocalized,\n  LocalizedComponent,\n  NumberingSystem,\n  numberStringFormatter,\n} from \"../../utils/locale\";\nimport { createObserver } from \"../../utils/observers\";\nimport {\n  componentFocusable,\n  componentLoaded,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { guid } from \"../../utils/guid\";\nimport { Status } from \"../interfaces\";\nimport { Validation } from \"../functional/Validation\";\nimport { syncHiddenFormInput, TextualInputComponent } from \"../input/common/input\";\nimport { CharacterLengthObj } from \"./interfaces\";\nimport { TextAreaMessages } from \"./assets/text-area/t9n\";\nimport { CSS, SLOTS, RESIZE_TIMEOUT } from \"./resources\";\n\n/**\n * @slot - A slot for adding text.\n * @slot footer-start - A slot for adding content to the start of the component's footer.\n * @slot footer-end - A slot for adding content to the end of the component's footer.\n */\n\n@Component({\n  tag: \"calcite-text-area\",\n  styleUrl: \"text-area.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class TextArea\n  implements\n    FormComponent,\n    LabelableComponent,\n    LocalizedComponent,\n    LoadableComponent,\n    T9nComponent,\n    InteractiveComponent,\n    Omit<TextualInputComponent, \"pattern\">\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Global attributes\n  //\n  //--------------------------------------------------------------------------\n\n  @Watch(\"autofocus\")\n  handleGlobalAttributesChanged(): void {\n    forceUpdate(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Specifies the component's number of columns.\n   *\n   * @mdn [cols](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-cols)\n   */\n  @Prop({ reflect: true }) columns: number;\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   *\n   * @mdn [disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled)\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * The `id` of the form that will be associated with the component.\n   *\n   * When not set, the component will be associated with its ancestor form element, if any.\n   */\n  @Prop({ reflect: true })\n  form: string;\n\n  /**\n   * When `true`, number values are displayed with a group separator corresponding to the language and country format.\n   */\n  @Prop({ reflect: true }) groupSeparator = false;\n\n  /**\n   * Accessible name for the component.\n   */\n  @Prop() label: string;\n\n  /**\n   * Specifies the minimum number of characters allowed.\n   *\n   * @mdn [minlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-minlength)\n   */\n  @Prop({ reflect: true }) minLength: number;\n\n  /**\n   * Specifies the maximum number of characters allowed.\n   *\n   * @mdn [maxlength](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-maxlength)\n   */\n  @Prop({ reflect: true }) maxLength: number;\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: TextAreaMessages;\n\n  /** Specifies the validation message to display under the component. */\n  @Prop() validationMessage: string;\n\n  /** Specifies the validation icon to display under the component. */\n  @Prop({ reflect: true }) validationIcon: string | boolean;\n\n  /**\n   * Specifies the name of the component.\n   *\n   * @mdn [name](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-name)\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /**\n   * Specifies the Unicode numeral system used by the component for localization.\n   */\n  @Prop() numberingSystem: NumberingSystem;\n\n  /**\n   * Specifies the placeholder text for the component.\n   *\n   * @mdn [placeholder](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-placeholder)\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * When `true`, the component's `value` can be read, but cannot be modified.\n   *\n   * @readonly\n   * @mdn [readOnly](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/readonly)\n   */\n  @Prop({ reflect: true }) readOnly = false;\n\n  /**\n   * When `true`, the component must have a value in order for the form to submit.\n   *\n   * @mdn [required]https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/required\n   */\n  @Prop({ reflect: true }) required = false;\n\n  /** Specifies if the component is resizable. */\n  @Prop({ reflect: true }) resize: \"both\" | \"horizontal\" | \"vertical\" | \"none\" = \"both\";\n\n  /**\n   * Specifies the component's number of rows.\n   *\n   * @mdn [rows](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-rows)\n   */\n  @Prop({ reflect: true }) rows: number;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: \"l\" | \"m\" | \"s\" = \"m\";\n\n  /** Specifies the status of the input field, which determines message and icons. */\n  @Prop({ reflect: true }) status: Status = \"idle\";\n\n  /** The component's value. */\n  @Prop({ mutable: true }) value = \"\";\n\n  /**\n   * Specifies the wrapping mechanism for the text.\n   *\n   * @mdn [wrap](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-wrap)\n   */\n  @Prop({ reflect: true }) wrap: \"soft\" | \"hard\" = \"soft\";\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<TextAreaMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Emitters\n  //\n  //--------------------------------------------------------------------------\n  /**\n   * Fires each time a new `value` is typed.\n   */\n  @Event() calciteTextAreaInput: EventEmitter<void>;\n\n  /**\n   * Fires each time a new `value` is typed and committed.\n   */\n  @Event() calciteTextAreaChange: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLabel(this);\n    connectForm(this);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n    this.setTextAreaHeight();\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLabel(this);\n    disconnectForm(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.resizeObserver?.disconnect();\n  }\n\n  render(): VNode {\n    const hasFooter = this.startSlotHasElements || this.endSlotHasElements || !!this.maxLength;\n    return (\n      <Host>\n        <InteractiveContainer disabled={this.disabled}>\n          <textarea\n            aria-describedby={this.guid}\n            aria-invalid={toAriaBoolean(this.isCharacterLimitExceeded())}\n            aria-label={getLabelText(this)}\n            autofocus={this.el.autofocus}\n            class={{\n              [CSS.readOnly]: this.readOnly,\n              [CSS.textAreaInvalid]: this.isCharacterLimitExceeded(),\n              [CSS.footerSlotted]: this.endSlotHasElements && this.startSlotHasElements,\n              [CSS.blockSizeFull]: !hasFooter,\n              [CSS.borderColor]: !hasFooter,\n            }}\n            cols={this.columns}\n            disabled={this.disabled}\n            name={this.name}\n            onChange={this.handleChange}\n            onInput={this.handleInput}\n            placeholder={this.placeholder}\n            readOnly={this.readOnly}\n            required={this.required}\n            rows={this.rows}\n            value={this.value}\n            wrap={this.wrap}\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={this.setTextAreaEl}\n          />\n          <span class={{ [CSS.content]: true }}>\n            <slot onSlotchange={this.contentSlotChangeHandler} />\n          </span>\n          <footer\n            class={{\n              [CSS.footer]: true,\n              [CSS.readOnly]: this.readOnly,\n              [CSS.hide]: !hasFooter,\n            }}\n            // eslint-disable-next-line react/jsx-sort-props -- auto-generated by @esri/calcite-components/enforce-ref-last-prop\n            ref={(el) => (this.footerEl = el as HTMLElement)}\n          >\n            <div\n              class={{\n                [CSS.container]: true,\n                [CSS.footerEndSlotOnly]: !this.startSlotHasElements && this.endSlotHasElements,\n              }}\n            >\n              <slot\n                name={SLOTS.footerStart}\n                onSlotchange={(event) =>\n                  (this.startSlotHasElements = slotChangeHasAssignedElement(event))\n                }\n              />\n              <slot\n                name={SLOTS.footerEnd}\n                onSlotchange={(event) =>\n                  (this.endSlotHasElements = slotChangeHasAssignedElement(event))\n                }\n              />\n            </div>\n            {this.renderCharacterLimit()}\n          </footer>\n          <HiddenFormInputSlot component={this} />\n          {this.isCharacterLimitExceeded() && (\n            <span aria-hidden={true} aria-live=\"polite\" class={CSS.assistiveText} id={this.guid}>\n              {this.replacePlaceHoldersInMessages()}\n            </span>\n          )}\n          {this.validationMessage && this.status === \"invalid\" ? (\n            <Validation\n              icon={this.validationIcon}\n              message={this.validationMessage}\n              scale={this.scale}\n              status={this.status}\n            />\n          ) : null}\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    this.textAreaEl.focus();\n  }\n\n  /** Selects the text of the component's `value`. */\n  @Method()\n  async selectText(): Promise<void> {\n    await componentLoaded(this);\n    this.textAreaEl.select();\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties/ State\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteTextAreaElement;\n\n  defaultValue: TextArea[\"value\"];\n\n  footerEl: HTMLElement;\n\n  formEl: HTMLFormElement;\n\n  labelEl: HTMLCalciteLabelElement;\n\n  textAreaEl: HTMLTextAreaElement;\n\n  @State() defaultMessages: TextAreaMessages;\n\n  @State() endSlotHasElements: boolean;\n\n  @State() startSlotHasElements: boolean;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  private guid = guid();\n\n  private localizedCharacterLengthObj: CharacterLengthObj;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  onLabelClick(): void {\n    this.setFocus();\n  }\n\n  handleInput = (event: InputEvent): void => {\n    this.value = event.target[\"value\"];\n    this.calciteTextAreaInput.emit();\n  };\n\n  handleChange = (): void => {\n    this.calciteTextAreaChange.emit();\n  };\n\n  contentSlotChangeHandler = (): void => {\n    if (!this.value) {\n      const nodes = this.el.childNodes;\n      nodes.forEach((el) => {\n        if (el.nodeName === \"#text\") {\n          this.value = el.nodeValue.trim();\n        }\n      });\n    }\n  };\n\n  renderCharacterLimit = (): VNode | null => {\n    if (this.maxLength) {\n      this.localizedCharacterLengthObj = this.getLocalizedCharacterLength();\n      return (\n        <span class={CSS.characterLimit}>\n          <span class={{ [CSS.characterOverLimit]: this.isCharacterLimitExceeded() }}>\n            {this.localizedCharacterLengthObj.currentLength}\n          </span>\n          {\"/\"}\n          {this.localizedCharacterLengthObj.maxLength}\n        </span>\n      );\n    }\n    return null;\n  };\n\n  getLocalizedCharacterLength(): CharacterLengthObj {\n    const currentLength = this.value ? this.value.length.toString() : \"0\";\n    const maxLength = this.maxLength.toString();\n    if (this.numberingSystem === \"latn\") {\n      return { currentLength, maxLength };\n    }\n\n    numberStringFormatter.numberFormatOptions = {\n      locale: this.effectiveLocale,\n      numberingSystem: this.numberingSystem,\n      signDisplay: \"never\",\n      useGrouping: this.groupSeparator,\n    };\n    return {\n      currentLength: numberStringFormatter.localize(currentLength),\n      maxLength: numberStringFormatter.localize(maxLength),\n    };\n  }\n\n  resizeObserver = createObserver(\"resize\", async () => {\n    await componentLoaded(this);\n    const { textAreaHeight, textAreaWidth, elHeight, elWidth, footerHeight, footerWidth } =\n      this.getHeightAndWidthOfElements();\n    if (footerWidth > 0 && footerWidth !== textAreaWidth) {\n      this.footerEl.style.width = `${textAreaWidth}px`;\n    }\n    if (elWidth !== textAreaWidth || elHeight !== textAreaHeight + (footerHeight || 0)) {\n      this.setHeightAndWidthToAuto();\n    }\n  });\n\n  syncHiddenFormInput(input: HTMLInputElement): void {\n    input.setCustomValidity(\"\");\n    if (this.isCharacterLimitExceeded()) {\n      input.setCustomValidity(this.replacePlaceHoldersInMessages());\n    }\n\n    syncHiddenFormInput(\"textarea\", this, input);\n  }\n\n  setTextAreaEl = (el: HTMLTextAreaElement): void => {\n    this.textAreaEl = el;\n    this.resizeObserver.observe(el);\n  };\n\n  setTextAreaHeight(): void {\n    const { textAreaHeight, elHeight, footerHeight } = this.getHeightAndWidthOfElements();\n    if (footerHeight > 0 && textAreaHeight + footerHeight != elHeight) {\n      this.textAreaEl.style.height = `${elHeight - footerHeight}px`;\n    }\n  }\n\n  getHeightAndWidthOfElements(): {\n    textAreaHeight: number;\n    textAreaWidth: number;\n    elHeight: number;\n    elWidth: number;\n    footerHeight: number;\n    footerWidth: number;\n  } {\n    const { height: textAreaHeight, width: textAreaWidth } =\n      this.textAreaEl.getBoundingClientRect();\n    const { height: elHeight, width: elWidth } = this.el.getBoundingClientRect();\n    const { height: footerHeight, width: footerWidth } = this.footerEl?.getBoundingClientRect();\n\n    return {\n      textAreaHeight,\n      textAreaWidth,\n      elHeight,\n      elWidth,\n      footerHeight,\n      footerWidth,\n    };\n  }\n\n  private replacePlaceHoldersInMessages(): string {\n    return this.messages.tooLong\n      .replace(\"{maxLength}\", this.localizedCharacterLengthObj.maxLength)\n      .replace(\"{currentLength}\", this.localizedCharacterLengthObj.currentLength);\n  }\n\n  // height and width are set to auto here to avoid overlapping on to neighboring elements in the layout when user starts resizing.\n  // throttle is used to avoid flashing of textarea when user resizes.\n  private setHeightAndWidthToAuto = throttle(\n    (): void => {\n      if (this.resize === \"vertical\" || this.resize === \"both\") {\n        this.el.style.height = \"auto\";\n      }\n      if (this.resize === \"horizontal\" || this.resize === \"both\") {\n        this.el.style.width = \"auto\";\n      }\n    },\n    RESIZE_TIMEOUT,\n    { leading: false },\n  );\n\n  private isCharacterLimitExceeded(): boolean {\n    return this.value?.length > this.maxLength;\n  }\n}\n"]}

package/dist/collection/components/tile/resources.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 export const CSS = {
     container: "container",

package/dist/collection/components/tile/tile.css

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:22 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:08 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/tile/tile.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { accessible, defaults, disabled, reflects, renders, slots, hidden } from "../../tests/commonTests";

package/dist/collection/components/tile/tile.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { h } from "@stencil/core";
 import { connectInteractive, disconnectInteractive, InteractiveContainer, updateHostInteraction, } from "../../utils/interactive";
@@ -52,7 +52,7 @@ export class Tile {
     }
     render() {
         const { disabled } = this;
-        return (h(InteractiveContainer, { key: 'b5609268447ba0380f035625b45ac8e1880964c8', disabled: disabled }, this.href ? (h("calcite-link", { disabled: disabled, href: this.href }, this.renderTile())) : (this.renderTile())));
+        return (h(InteractiveContainer, { key: '05331d5c6536256f9a0cc3c094b3e9a08c547c3b', disabled: disabled }, this.href ? (h("calcite-link", { disabled: disabled, href: this.href }, this.renderTile())) : (this.renderTile())));
     }
     static get is() { return "calcite-tile"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tile-group/resources.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 export const CSS = {
     container: "container",

package/dist/collection/components/tile-group/tile-group.css

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:22 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:08 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/tile-group/tile-group.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { accessible, defaults, disabled, reflects, renders, hidden } from "../../tests/commonTests";

package/dist/collection/components/tile-group/tile-group.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.8.0-next.2
+ * v2.8.0-next.4
  */
 import { h } from "@stencil/core";
 import { connectInteractive, disconnectInteractive, InteractiveContainer, updateHostInteraction, } from "../../utils/interactive";
@@ -42,7 +42,7 @@ export class TileGroup {
         disconnectInteractive(this);
     }
     render() {
-        return (h(InteractiveContainer, { key: '59afa30e3cc14cff7316156fd0fd52ee2ac97fe7', disabled: this.disabled }, h("div", { key: '72cae9045be1b2d6310cfba2de6fd1f20e8a961e', class: CSS.container }, h("slot", { key: '3d32bb9a5acee618ab1620fcdf830298bc6b2c87', onSlotchange: this.updateTiles }))));
+        return (h(InteractiveContainer, { key: '61f378bd6c277922bc943915e6463444b8670b12', disabled: this.disabled }, h("div", { key: '5e3a5d004ee2b5c52dc6e564b0b4a42dabd896a6', class: CSS.container }, h("slot", { key: '13fcd6da73fe53df96ec1f8a7ade44dcce01775a', onSlotchange: this.updateTiles }))));
     }
     static get is() { return "calcite-tile-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tile-select/resources.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 export const CSS = {
     checked: "checked",

package/dist/collection/components/tile-select/tile-select.css

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:24 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:10 GMT
  */
 /**
  * Do not edit directly
- * Generated on Mon, 15 Apr 2024 17:39:22 GMT
+ * Generated on Thu, 18 Apr 2024 19:56:08 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/tile-select/tile-select.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { accessible, defaults, disabled, focusable, hidden, reflects, renders } from "../../tests/commonTests";

package/dist/collection/components/tile-select/tile-select.js

@@ -1,7 +1,7 @@
 /*!
  * 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.8.0-next.2
+ * v2.8.0-next.4
  */
 import { h, } from "@stencil/core";
 import { guid } from "../../utils/guid";
@@ -164,7 +164,7 @@ export class TileSelect {
         const { checked, description, disabled, focused, heading, icon, inputAlignment, inputEnabled, width, iconFlipRtl, } = this;
         const isLargeVisual = heading && icon && !description;
         const renderIcon = Boolean(icon);
-        return (h(InteractiveContainer, { key: '64625fd1290bdc808bee2b2d582102d3643f677d', disabled: disabled }, h("div", { key: '4ab112700d612525ec3eb6e01c44c3bd7d6871f9', class: {
+        return (h(InteractiveContainer, { key: '02789bb3a83da4360bb993afb84eb6379aaa6464', disabled: disabled }, h("div", { key: '76ce0a9d948af99032ec9a8c7539dd0f804d3152', class: {
                 checked,
                 container: true,
                 [CSS.description]: Boolean(description),
@@ -181,7 +181,7 @@ export class TileSelect {
                 [CSS.largeVisual]: isLargeVisual,
                 [CSS.widthAuto]: width === "auto",
                 [CSS.widthFull]: width === "full",
-            } }, h("div", { key: '0763f3fdec36f9d9ca78cce0a0be6772f7af927e', class: { [CSS.tile]: true, [CSS.tileLargeVisual]: isLargeVisual } }, icon && (h("div", { class: { [CSS.icon]: renderIcon } }, h("calcite-icon", { flipRtl: iconFlipRtl, icon: icon, scale: "l" }))), h("div", { key: 'bf2ae1527cacf4f466caa029c55690c174ab23d5', class: CSS.tileContentContainer }, h("div", { key: 'a377c243ad5943b8ad38321b5b23eba1afe9ff06', class: CSS.tileContent }, heading && h("div", { class: CSS.tileHeading }, heading), description && h("div", { class: CSS.tileDescription }, description)))), h("slot", { key: 'bc4b7e2cb5e2ef9d8a94e9996f94f15add15cde6' }))));
+            } }, h("div", { key: '4ec5b40385e7af6fbfb471343abea827ee9b44a1', class: { [CSS.tile]: true, [CSS.tileLargeVisual]: isLargeVisual } }, icon && (h("div", { key: 'a42d1c54c0456d0c90ebec1c8a22da5aefee233d', class: { [CSS.icon]: renderIcon } }, h("calcite-icon", { key: '5d16016353c31624985724de64c5bfafbc0b2f2e', flipRtl: iconFlipRtl, icon: icon, scale: "l" }))), h("div", { key: 'aec3a4b29f524d55a8009f9d96b563037f3c1d6d', class: CSS.tileContentContainer }, h("div", { key: '761e79c56301ed6e55e817ae15cc2d5ae805cd02', class: CSS.tileContent }, heading && h("div", { key: '818bf51f5d42a4d7c9f6b2c663e59359845ef0db', class: CSS.tileHeading }, heading), description && h("div", { key: '775a563b7c1db309a6c646964c69b79f8a10201e', class: CSS.tileDescription }, description)))), h("slot", { key: 'a17a3adfc7e775f553043cc90f40fd13d64469d2' }))));
     }
     static get is() { return "calcite-tile-select"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tile-select/tile-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"tile-select.js","sourceRoot":"","sources":["../../../../src/components/tile-select/tile-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { 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 { Alignment, Width } from \"../interfaces\";\nimport { TileSelectType } from \"./interfaces\";\nimport { CSS } from \"./resources\";\n\n/**\n * @slot - A slot for adding custom content.\n */\n@Component({\n  tag: \"calcite-tile-select\",\n  styleUrl: \"tile-select.scss\",\n  shadow: true,\n})\nexport class TileSelect implements InteractiveComponent, LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, the component is checked. */\n  @Prop({ reflect: true, mutable: true }) checked = false;\n\n  @Watch(\"checked\")\n  checkedChanged(newChecked: boolean): void {\n    this.input.checked = newChecked;\n  }\n\n  /** A description for the component, which displays below the heading. */\n  @Prop({ reflect: true }) description: string;\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** The component header text, which displays between the icon and description. */\n  @Prop({ reflect: true }) heading: string;\n\n  /** Specifies an icon to display. */\n  @Prop({ reflect: true }) 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  /** Specifies the name of the component on form submission. */\n  @Prop({ reflect: true }) name;\n\n  @Watch(\"name\")\n  nameChanged(newName: string): void {\n    this.input.name = newName;\n  }\n\n  /** When `true`, displays an interactive input based on the `type` property. */\n  @Prop({ reflect: true }) inputEnabled = false;\n\n  /** When `inputEnabled` is `true`, specifies the placement of the interactive input on the component. */\n  @Prop({ reflect: true }) inputAlignment: Extract<\"end\" | \"start\", Alignment> = \"start\";\n\n  /**\n   * Specifies the selection mode of the component, where:\n   *\n   * `\"radio\"` is for single selection, and\n   *\n   * `\"checkbox\"` is for multiple selections.\n   */\n  @Prop({ reflect: true }) type: TileSelectType = \"radio\";\n\n  /** The component's value. */\n  @Prop() value: any;\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) width: Extract<\"auto\" | \"full\", Width> = \"auto\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteTileSelectElement;\n\n  private input: HTMLCalciteCheckboxElement | HTMLCalciteRadioButtonElement;\n\n  guid = `calcite-tile-select-${guid()}`;\n\n  //--------------------------------------------------------------------------\n  //\n  //  State\n  //\n  //--------------------------------------------------------------------------\n\n  /** The focused state of the tile-select. */\n  @State() focused = false;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emits a custom change event.\n   *\n   * For checkboxes it emits when checked or unchecked.\n   *\n   * For radios it only emits when checked.\n   */\n  @Event({ cancelable: false }) calciteTileSelectChange: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    return this.input?.setFocus();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteCheckboxChange\")\n  checkboxChangeHandler(event: CustomEvent): void {\n    const checkbox = event.target as HTMLCalciteCheckboxElement;\n    if (checkbox === this.input) {\n      this.checked = checkbox.checked;\n    }\n    event.stopPropagation();\n    this.calciteTileSelectChange.emit();\n  }\n\n  @Listen(\"calciteInternalCheckboxFocus\")\n  @Listen(\"calciteInternalCheckboxBlur\")\n  checkboxFocusBlurHandler(event: CustomEvent): void {\n    const checkbox = event.target as HTMLCalciteCheckboxElement;\n    if (checkbox === this.input) {\n      this.focused = event.detail;\n    }\n    event.stopPropagation();\n  }\n\n  @Listen(\"calciteRadioButtonChange\")\n  radioButtonChangeHandler(event: CustomEvent): void {\n    const radioButton = event.target as HTMLCalciteRadioButtonElement;\n    if (radioButton === this.input) {\n      this.checked = radioButton.checked;\n    }\n    event.stopPropagation();\n    this.calciteTileSelectChange.emit();\n  }\n\n  @Listen(\"calciteInternalRadioButtonCheckedChange\")\n  radioButtonCheckedChangeHandler(event: CustomEvent): void {\n    const radioButton = event.target as HTMLCalciteRadioButtonElement;\n    if (radioButton === this.input) {\n      this.checked = radioButton.checked;\n    }\n    event.stopPropagation();\n  }\n\n  @Listen(\"calciteInternalRadioButtonFocus\")\n  @Listen(\"calciteInternalRadioButtonBlur\")\n  radioButtonFocusBlurHandler(event: CustomEvent): void {\n    const radioButton = event.target as HTMLCalciteRadioButtonElement;\n    if (radioButton === this.input) {\n      this.focused = radioButton.focused;\n    }\n    event.stopPropagation();\n  }\n\n  @Listen(\"click\")\n  clickHandler(event: MouseEvent): void {\n    if (this.disabled) {\n      return;\n    }\n\n    const target = event.target as HTMLElement;\n    const targets = [\"calcite-tile\", \"calcite-tile-select\"];\n    if (targets.includes(target.localName)) {\n      this.input.click();\n    }\n  }\n\n  @Listen(\"pointerenter\")\n  pointerEnterHandler(): void {\n    if (this.disabled) {\n      return;\n    }\n\n    const { localName } = this.input;\n\n    if (localName === \"calcite-radio-button\" || localName === \"calcite-checkbox\") {\n      (this.input as HTMLCalciteRadioButtonElement | HTMLCalciteCheckboxElement).hovered = true;\n    }\n  }\n\n  @Listen(\"pointerleave\")\n  pointerLeaveHandler(): void {\n    if (this.disabled) {\n      return;\n    }\n\n    const { localName } = this.input;\n\n    if (localName === \"calcite-radio-button\" || localName === \"calcite-checkbox\") {\n      (this.input as HTMLCalciteRadioButtonElement | HTMLCalciteCheckboxElement).hovered = false;\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    this.renderInput();\n    connectInteractive(this);\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    this.input.parentNode.removeChild(this.input);\n    disconnectInteractive(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  private renderInput(): void {\n    this.input =\n      this.type === \"radio\"\n        ? /* we need to call createElement(x) separately to ensure supporting components are properly bundled */\n          document.createElement(\"calcite-radio-button\")\n        : document.createElement(\"calcite-checkbox\");\n    this.input.checked = this.checked;\n    this.input.disabled = this.disabled;\n    this.input.hidden = this.el.hidden;\n    this.input.id = this.guid;\n    this.input.label = this.heading || this.name || \"\";\n\n    if (this.name) {\n      this.input.name = this.name;\n    }\n\n    if (this.value) {\n      this.input.value = this.value != null ? this.value.toString() : \"\";\n    }\n\n    this.el.insertAdjacentElement(\"beforeend\", this.input);\n  }\n\n  render(): VNode {\n    const {\n      checked,\n      description,\n      disabled,\n      focused,\n      heading,\n      icon,\n      inputAlignment,\n      inputEnabled,\n      width,\n      iconFlipRtl,\n    } = this;\n    const isLargeVisual = heading && icon && !description;\n    const renderIcon = Boolean(icon);\n    return (\n      <InteractiveContainer disabled={disabled}>\n        <div\n          class={{\n            checked,\n            container: true,\n            [CSS.description]: Boolean(description),\n            [CSS.descriptionOnly]: Boolean(!heading && !icon && description),\n            disabled,\n            focused,\n            [CSS.heading]: Boolean(heading),\n            [CSS.headingOnly]: heading && !icon && !description,\n            [CSS.icon]: renderIcon,\n            [CSS.iconOnly]: !heading && icon && !description,\n            [CSS.inputAlignmentEnd]: inputAlignment === \"end\",\n            [CSS.inputAlignmentStart]: inputAlignment === \"start\",\n            [CSS.inputEnabled]: inputEnabled,\n            [CSS.largeVisual]: isLargeVisual,\n            [CSS.widthAuto]: width === \"auto\",\n            [CSS.widthFull]: width === \"full\",\n          }}\n        >\n          <div class={{ [CSS.tile]: true, [CSS.tileLargeVisual]: isLargeVisual }}>\n            {icon && (\n              <div class={{ [CSS.icon]: renderIcon }}>\n                <calcite-icon flipRtl={iconFlipRtl} icon={icon} scale=\"l\" />\n              </div>\n            )}\n            <div class={CSS.tileContentContainer}>\n              <div class={CSS.tileContent}>\n                {heading && <div class={CSS.tileHeading}>{heading}</div>}\n                {description && <div class={CSS.tileDescription}>{description}</div>}\n              </div>\n            </div>\n          </div>\n          <slot />\n        </div>\n      </InteractiveContainer>\n    );\n  }\n}\n"]}
+{"version":3,"file":"tile-select.js","sourceRoot":"","sources":["../../../../src/components/tile-select/tile-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { 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 { Alignment, Width } from \"../interfaces\";\nimport { TileSelectType } from \"./interfaces\";\nimport { CSS } from \"./resources\";\n\n/**\n * @slot - A slot for adding custom content.\n */\n@Component({\n  tag: \"calcite-tile-select\",\n  styleUrl: \"tile-select.scss\",\n  shadow: true,\n})\nexport class TileSelect implements InteractiveComponent, LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, the component is checked. */\n  @Prop({ reflect: true, mutable: true }) checked = false;\n\n  @Watch(\"checked\")\n  checkedChanged(newChecked: boolean): void {\n    this.input.checked = newChecked;\n  }\n\n  /** A description for the component, which displays below the heading. */\n  @Prop({ reflect: true }) description: string;\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** The component header text, which displays between the icon and description. */\n  @Prop({ reflect: true }) heading: string;\n\n  /** Specifies an icon to display. */\n  @Prop({ reflect: true }) 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  /** Specifies the name of the component on form submission. */\n  @Prop({ reflect: true }) name;\n\n  @Watch(\"name\")\n  nameChanged(newName: string): void {\n    this.input.name = newName;\n  }\n\n  /** When `true`, displays an interactive input based on the `type` property. */\n  @Prop({ reflect: true }) inputEnabled = false;\n\n  /** When `inputEnabled` is `true`, specifies the placement of the interactive input on the component. */\n  @Prop({ reflect: true }) inputAlignment: Extract<\"end\" | \"start\", Alignment> = \"start\";\n\n  /**\n   * Specifies the selection mode of the component, where:\n   *\n   * `\"radio\"` is for single selection, and\n   *\n   * `\"checkbox\"` is for multiple selections.\n   */\n  @Prop({ reflect: true }) type: TileSelectType = \"radio\";\n\n  /** The component's value. */\n  @Prop() value: any;\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) width: Extract<\"auto\" | \"full\", Width> = \"auto\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteTileSelectElement;\n\n  private input: HTMLCalciteCheckboxElement | HTMLCalciteRadioButtonElement;\n\n  guid = `calcite-tile-select-${guid()}`;\n\n  //--------------------------------------------------------------------------\n  //\n  //  State\n  //\n  //--------------------------------------------------------------------------\n\n  /** The focused state of the tile-select. */\n  @State() focused = false;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emits a custom change event.\n   *\n   * For checkboxes it emits when checked or unchecked.\n   *\n   * For radios it only emits when checked.\n   */\n  @Event({ cancelable: false }) calciteTileSelectChange: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    return this.input?.setFocus();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteCheckboxChange\")\n  checkboxChangeHandler(event: CustomEvent): void {\n    const checkbox = event.target as HTMLCalciteCheckboxElement;\n    if (checkbox === this.input) {\n      this.checked = checkbox.checked;\n    }\n    event.stopPropagation();\n    this.calciteTileSelectChange.emit();\n  }\n\n  @Listen(\"calciteInternalCheckboxFocus\")\n  @Listen(\"calciteInternalCheckboxBlur\")\n  checkboxFocusBlurHandler(event: CustomEvent): void {\n    const checkbox = event.target as HTMLCalciteCheckboxElement;\n    if (checkbox === this.input) {\n      this.focused = event.detail;\n    }\n    event.stopPropagation();\n  }\n\n  @Listen(\"calciteRadioButtonChange\")\n  radioButtonChangeHandler(event: CustomEvent): void {\n    const radioButton = event.target as HTMLCalciteRadioButtonElement;\n    if (radioButton === this.input) {\n      this.checked = radioButton.checked;\n    }\n    event.stopPropagation();\n    this.calciteTileSelectChange.emit();\n  }\n\n  @Listen(\"calciteInternalRadioButtonCheckedChange\")\n  radioButtonCheckedChangeHandler(event: CustomEvent): void {\n    const radioButton = event.target as HTMLCalciteRadioButtonElement;\n    if (radioButton === this.input) {\n      this.checked = radioButton.checked;\n    }\n    event.stopPropagation();\n  }\n\n  @Listen(\"calciteInternalRadioButtonFocus\")\n  @Listen(\"calciteInternalRadioButtonBlur\")\n  radioButtonFocusBlurHandler(event: CustomEvent): void {\n    const radioButton = event.target as HTMLCalciteRadioButtonElement;\n    if (radioButton === this.input) {\n      this.focused = radioButton.focused;\n    }\n    event.stopPropagation();\n  }\n\n  @Listen(\"click\")\n  clickHandler(event: MouseEvent): void {\n    if (this.disabled) {\n      return;\n    }\n\n    const target = event.target as HTMLElement;\n    const targets = [\"calcite-tile\", \"calcite-tile-select\"];\n    if (targets.includes(target.localName)) {\n      this.input.click();\n    }\n  }\n\n  @Listen(\"pointerenter\")\n  pointerEnterHandler(): void {\n    if (this.disabled) {\n      return;\n    }\n\n    const { localName } = this.input;\n\n    if (localName === \"calcite-radio-button\" || localName === \"calcite-checkbox\") {\n      (this.input as HTMLCalciteRadioButtonElement | HTMLCalciteCheckboxElement).hovered = true;\n    }\n  }\n\n  @Listen(\"pointerleave\")\n  pointerLeaveHandler(): void {\n    if (this.disabled) {\n      return;\n    }\n\n    const { localName } = this.input;\n\n    if (localName === \"calcite-radio-button\" || localName === \"calcite-checkbox\") {\n      (this.input as HTMLCalciteRadioButtonElement | HTMLCalciteCheckboxElement).hovered = false;\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    this.renderInput();\n    connectInteractive(this);\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    this.input.parentNode.removeChild(this.input);\n    disconnectInteractive(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  private renderInput(): void {\n    this.input =\n      this.type === \"radio\"\n        ? /* we need to call createElement(x) separately to ensure supporting components are properly bundled */\n          document.createElement(\"calcite-radio-button\")\n        : document.createElement(\"calcite-checkbox\");\n    this.input.checked = this.checked;\n    this.input.disabled = this.disabled;\n    this.input.hidden = this.el.hidden;\n    this.input.id = this.guid;\n    this.input.label = this.heading || this.name || \"\";\n\n    if (this.name) {\n      this.input.name = this.name;\n    }\n\n    if (this.value) {\n      this.input.value = this.value != null ? this.value.toString() : \"\";\n    }\n\n    this.el.insertAdjacentElement(\"beforeend\", this.input);\n  }\n\n  render(): VNode {\n    const {\n      checked,\n      description,\n      disabled,\n      focused,\n      heading,\n      icon,\n      inputAlignment,\n      inputEnabled,\n      width,\n      iconFlipRtl,\n    } = this;\n    const isLargeVisual = heading && icon && !description;\n    const renderIcon = Boolean(icon);\n    return (\n      <InteractiveContainer disabled={disabled}>\n        <div\n          class={{\n            checked,\n            container: true,\n            [CSS.description]: Boolean(description),\n            [CSS.descriptionOnly]: Boolean(!heading && !icon && description),\n            disabled,\n            focused,\n            [CSS.heading]: Boolean(heading),\n            [CSS.headingOnly]: heading && !icon && !description,\n            [CSS.icon]: renderIcon,\n            [CSS.iconOnly]: !heading && icon && !description,\n            [CSS.inputAlignmentEnd]: inputAlignment === \"end\",\n            [CSS.inputAlignmentStart]: inputAlignment === \"start\",\n            [CSS.inputEnabled]: inputEnabled,\n            [CSS.largeVisual]: isLargeVisual,\n            [CSS.widthAuto]: width === \"auto\",\n            [CSS.widthFull]: width === \"full\",\n          }}\n        >\n          <div class={{ [CSS.tile]: true, [CSS.tileLargeVisual]: isLargeVisual }}>\n            {icon && (\n              <div class={{ [CSS.icon]: renderIcon }}>\n                <calcite-icon flipRtl={iconFlipRtl} icon={icon} scale=\"l\" />\n              </div>\n            )}\n            <div class={CSS.tileContentContainer}>\n              <div class={CSS.tileContent}>\n                {heading && <div class={CSS.tileHeading}>{heading}</div>}\n                {description && <div class={CSS.tileDescription}>{description}</div>}\n              </div>\n            </div>\n          </div>\n          <slot />\n        </div>\n      </InteractiveContainer>\n    );\n  }\n}\n"]}