@usecapsule/core-components 3.5.0 → 3.5.1-dev.2

package/dist/esm/cpsl-alert_34.entry.js

@@ -1,7 +1,7 @@
 import { r as registerInstance, h, H as Host, c as createEvent, g as getElement, F as Fragment } from './index-91db3414.js';
 import { M as MOBILE_SIZE, a as DEFAULT_Z_INDICES } from './constants-fce138fa.js';
 
-const cpslAlertCss = ":host{--container-gap:8px;--container-padding-top:14px;--container-padding-bottom:14px;--container-padding-start:16px;--container-padding-end:16px;--container-font-size:var(--cpsl-font-size-body-m);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-alert);--container-background-color:var(--cpsl-color-background-0);--container-color:var(--cpsl-color-text-primary);--container-icon-color:var(--container-color);display:inline-block;font-family:var(--cpsl-font-family, inherit)}:host(.error){--container-border-color:var(--cpsl-color-utility-red)}:host(.warning){--container-border-color:var(--cpsl-color-utility-yellow)}:host(.success){--container-border-color:var(--cpsl-color-utility-green)}:host cpsl-icon{--icon-color:var(--container-icon-color);--height:20px;--width:20px}.alert-container{border-radius:var(--container-border-radius);-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);font-size:var(--container-font-size);display:flex;align-items:center;justify-content:center;gap:var(--container-gap);border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);background-color:var(--container-background-color);color:var(--container-color)}";
+const cpslAlertCss = ":host{--container-gap:8px;--container-padding-top:14px;--container-padding-bottom:14px;--container-padding-start:16px;--container-padding-end:16px;--container-font-size:var(--cpsl-font-size-body-m);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-alert);--container-background-color:var(--cpsl-color-background-0);--container-color:var(--cpsl-color-text-primary);--container-icon-color:var(--container-color);--container-align-items:center;--container-justify-content:center;--title-container-gap:8px;--title-container-align-items:center;--title-container-justify-content:center;display:inline-block;font-family:var(--cpsl-font-family, inherit)}:host(.error){--container-border-color:var(--cpsl-color-utility-red)}:host(.error):host(.filled){--container-background-color:var(--cpsl-color-utility-red-light)}:host(.warning){--container-border-color:var(--cpsl-color-utility-yellow)}:host(.warning):host(.filled){--container-background-color:var(--cpsl-color-utility-yellow-light)}:host(.success){--container-border-color:var(--cpsl-color-utility-green)}:host(.success):host(.filled){--container-background-color:var(--cpsl-color-utility-green-light)}:host cpsl-icon{--icon-color:var(--container-icon-color);--height:20px;--width:20px}.alert-container{border-radius:var(--container-border-radius);-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);font-size:var(--container-font-size);display:flex;align-items:var(--container-align-items);justify-content:var(--container-justify-content);gap:var(--container-gap);border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);background-color:var(--container-background-color);color:var(--container-color)}.title-container{display:flex;align-items:var(--title-container-align-items);justify-content:var(--title-container-justify-content);gap:var(--title-container-gap)}";
 const CpslAlertStyle0 = cpslAlertCss;
 
 const CpslAlert = class {
@@ -9,8 +9,12 @@ const CpslAlert = class {
         registerInstance(this, hostRef);
         this.icon = undefined;
         this.variant = 'error';
+        this.filled = undefined;
     }
     get iconType() {
+        if (this.icon) {
+            return this.icon;
+        }
         switch (this.variant) {
             case 'custom': {
                 return undefined;
@@ -28,7 +32,7 @@ const CpslAlert = class {
         }
     }
     render() {
-        return (h(Host, { key: 'b6bc54a1f4b70612c087ac6085b5a0e6b46c34a4', class: { error: this.variant === 'error', warning: this.variant === 'warning', success: this.variant === 'success' } }, h("div", { key: 'bf78665f1425a0b68e34956be596306e53bfa816', class: "alert-container" }, this.iconType && h("cpsl-icon", { key: '0d60e5a88bc1662f28c2066905afdb0eca49b82c', icon: this.iconType }), h("slot", { key: 'ec12b7378f8884fa0bdc910660a557bfdb13bd55' }))));
+        return (h(Host, { key: 'b3d99e91886b9f3c226c607a2755ec07eb490284', class: { error: this.variant === 'error', warning: this.variant === 'warning', success: this.variant === 'success', filled: this.filled } }, h("div", { key: '18d3cdfce1717d8980133650e37350e299badb73', class: "alert-container" }, h("div", { key: 'a5974d2702eb9da75b7b09cc922d9beebbc0cef1', class: "title-container" }, this.iconType && h("cpsl-icon", { key: 'c700339138baadd297ba39f5f28a9d519d467988', icon: this.iconType }), h("slot", { key: 'f3f6d037235e72ecfd91a70bfef118bbebe9563a' })), h("slot", { key: '06bf3e5d838e39a4771aef6bbf343d55142f1a0f', name: "subtitle" }))));
     }
 };
 CpslAlert.style = CpslAlertStyle0;
@@ -44,13 +48,13 @@ const CpslAppBar = class {
         this.zIndexOverride = undefined;
     }
     render() {
-        return (h(Host, { key: '83a5677faca53632275d65da790b0d2fcffcb6d7', style: Object.assign({
+        return (h(Host, { key: '281c1ebcc7ad61ccbd6878fb31d9b52a5860c273', style: Object.assign({
                 // position: this.position,
                 height: `${this.height}px`
-            }, (this.zIndexOverride ? { zIndex: `${this.zIndexOverride}` } : {})) }, h("div", { key: '6c84c5f229abbb608009feb4af18462bb0713ee3', class: "container", part: "container", style: {
+            }, (this.zIndexOverride ? { zIndex: `${this.zIndexOverride}` } : {})) }, h("div", { key: '90fdd0e77212ac8a1c861e2402b34b15a9d26f7b', class: "container", part: "container", style: {
                 position: this.position,
                 height: `${this.height}px`,
-            } }, h("slot", { key: '9f80782cbbe90f0ec27f9185abacddf4de994609' })), this.position === 'fixed' && (h("div", { key: '2ceae0a6a31428ec19310a6bd77573c1577832da', style: {
+            } }, h("slot", { key: '6aa42ab3e08a7d0629082a0bbba2831b1c9374f2' })), this.position === 'fixed' && (h("div", { key: '99169fc7212b22fcaa2e490ee2f6a7aad750e5a3', style: {
                 height: `${this.height}px`,
             } }))));
     }
@@ -6097,7 +6101,7 @@ gsap.registerPlugin(CSSPlugin);
 
 var gsapWithCSS = gsap.registerPlugin(CSSPlugin) || gsap;
 
-const cpslAuthModalCss = ":host{--container-width:560px;--container-gap:8px;--card-box-shadow:0px 2px 5px 0px rgba(0, 0, 0, 0.08);display:block;z-index:10011;position:relative}:host cpsl-overlay{z-index:10011}@media (max-width: 480px){:host(.include-mobile-styling) .modal-wrapper{scale:none;top:100%;left:0;height:unset;opacity:1}:host(.include-mobile-styling) .modal-container{width:100%;max-width:none;border-bottom-left-radius:0px;border-bottom-right-radius:0px}:host(.include-mobile-styling) .modal-body-card{--card-border-radius-bl:0px;--card-border-radius-br:0px}}:host(.no-overlay){z-index:0}:host(.no-overlay) .modal-body-card{--card-border-width:1px}.modal-wrapper{z-index:10011;position:fixed;top:0;left:0;display:none;height:100%;width:100%;justify-content:center;align-items:center;scale:0.8;opacity:0;transform:none}.modal-container{position:relative;overflow:hidden;width:var(--container-width);display:flex;flex-direction:column;gap:var(--container-gap);max-width:95vw;max-height:95vh;max-height:95dvh;overflow:auto;-ms-overflow-style:none;scrollbar-width:none;}.modal-container ::-webkit-scrollbar{display:none}.modal-container.no-footer{gap:0px}.modal-body-card{--card-padding-top:16px;--card-padding-bottom:16px;--card-padding-start:16px;--card-padding-end:16px;--card-border-width:0px}.body::part(card-container){box-shadow:var(--card-box-shadow);width:100%}.no-opacity{opacity:0}.mobile-footer{margin-top:16px}.footer-hidden{height:0px;visibility:hidden;--card-padding-top:0px;--card-padding-bottom:0px;--card-padding-start:0px;--card-padding-end:0px;--card-border-width:0px}";
+const cpslAuthModalCss = ":host{--container-width:560px;--container-gap:8px;--card-box-shadow:0px 2px 5px 0px rgba(0, 0, 0, 0.08);display:block;z-index:10011;position:relative}:host cpsl-overlay{z-index:10011}@media (max-width: 480px){:host(.include-mobile-styling) .modal-wrapper{scale:none;top:100%;left:0;height:unset;opacity:1}:host(.include-mobile-styling) .modal-container{width:100%;max-width:none;border-bottom-left-radius:0px;border-bottom-right-radius:0px}:host(.include-mobile-styling) .modal-body-card{--card-border-radius-bl:0px;--card-border-radius-br:0px}}:host(.no-overlay){z-index:0}:host(.no-overlay) .modal-body-card{--card-border-width:1px}:host(.no-overlay) .modal-container{max-height:unset}.modal-wrapper{z-index:10011;position:fixed;top:0;left:0;display:none;height:100%;width:100%;justify-content:center;align-items:center;scale:0.8;opacity:0;transform:none}.modal-container{position:relative;overflow:hidden;width:var(--container-width);display:flex;flex-direction:column;gap:var(--container-gap);max-width:95vw;max-height:95vh;max-height:95dvh;overflow:auto;-ms-overflow-style:none;scrollbar-width:none;}.modal-container ::-webkit-scrollbar{display:none}.modal-container.no-footer{gap:0px}.modal-body-card{--card-padding-top:16px;--card-padding-bottom:16px;--card-padding-start:16px;--card-padding-end:16px;--card-border-width:0px}.body::part(card-container){box-shadow:var(--card-box-shadow);width:100%}.no-opacity{opacity:0}.mobile-footer{margin-top:16px}.footer-hidden{height:0px;visibility:hidden;--card-padding-top:0px;--card-padding-bottom:0px;--card-padding-start:0px;--card-padding-end:0px;--card-border-width:0px}";
 const CpslAuthModalStyle0 = cpslAuthModalCss;
 
 const mm = gsapWithCSS.matchMedia();
@@ -6258,7 +6262,7 @@ const CpslAvatar = class {
     }
     render() {
         var _a;
-        return (h(Host, { key: 'c148e7d268c681fa6a7273c109b9ab418f433c24' }, h("span", { key: 'd1f977ab0c5d6f6758f84fb33ed9e72d9a1270c9', class: { round: this.variant === 'round' } }, h("img", { key: '3a13f96266ee6476df2154a09b433dcf7ba44daf', src: this.src, alt: (_a = this.alt) !== null && _a !== void 0 ? _a : 'avatar' }))));
+        return (h(Host, { key: '04dfd668bc6ab12f758e82ccfd915f06e1de3504' }, h("span", { key: '906c7c6e113040b95273c987689e848954e14a1c', class: { round: this.variant === 'round' } }, h("img", { key: '2d952a27ebbeb118c931162487f2d7e13370b41f', src: this.src, alt: (_a = this.alt) !== null && _a !== void 0 ? _a : 'avatar' }))));
     }
 };
 CpslAvatar.style = CpslAvatarStyle0;
@@ -6278,7 +6282,7 @@ const CpslButton = class {
         this.variant = 'primary';
     }
     render() {
-        return (h(Host, { key: '7e2466e0d35b2b63bb487ff71412c48cafd57245', class: {
+        return (h(Host, { key: '7411754a763990dcbef83edbef353ebf3066f71d', class: {
                 // VARIANTS
                 'primary': this.variant === 'primary',
                 'secondary': this.variant === 'secondary',
@@ -6291,7 +6295,7 @@ const CpslButton = class {
                 // SIZES
                 'small': this.size === 'small',
                 'medium': this.size === 'medium',
-            } }, h(this.as, { key: 'a514f7924302ed63f1a74299b637e177f796c009', href: this.href, target: this.target, part: "button-native", class: "button-native" }, h("slot", { key: '995350d0172d2335cfc40884b9940d49227c9ef3', name: "start" }), h("slot", { key: '495e18db74d18ffc746509ec63abc0a5f4240928' }), h("slot", { key: '4abf7e19b89214abe3198fcf28126aff695d5b7d', name: "end" }))));
+            } }, h(this.as, { key: '1c49c08c3ea7a105ce6c69302e2adc2bc6a443eb', href: this.href, target: this.target, part: "button-native", class: "button-native" }, h("slot", { key: '5ef09afd70e95c9c596c46d84a8d3410a8eba2a9', name: "start" }), h("slot", { key: 'f055ad44f74ca07a612c967432714c00e4b56ba9' }), h("slot", { key: '2a53e40d635b3de4441aed9005b4bb13d42e9d04', name: "end" }))));
     }
 };
 CpslButton.style = CpslButtonStyle0;
@@ -6333,7 +6337,7 @@ const CpslButtonGroup = class {
         return this.el.querySelectorAll('&> *:not(cpsl-button)');
     }
     render() {
-        return (h(Host, { key: '4989ccaf19a47fe6e2847d102380a9deac394c0b' }, h("slot", { key: '06c97fd600969c0b136a5a56a2894f40d58119ef' })));
+        return (h(Host, { key: '91ccfcaf08be6fc45076376b19e63b5b58ab9b15' }, h("slot", { key: '9af22dc4fcbd76ebc32e476d1682e2fe41b33f81' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -6350,7 +6354,7 @@ const CpslCard = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '8633aeaedaaf81af67835ee3ffc8964ec28ced92' }, h("div", { key: '432fabd329701f8ef51fc43ba0ca8af3d5182a47', class: { card: true }, part: "card-container" }, h("slot", { key: 'a23d1063d0a1c74ebc076fc67b63c4023f7f8565' }))));
+        return (h(Host, { key: '21177f5a9ceec0246dc1fa89a052bfdadacc3063' }, h("div", { key: '0940e0aaf62b24e1be0e99c736069b5bb463854c', class: { card: true }, part: "card-container" }, h("slot", { key: '6317e03f97be9841c03b040845591043bf203e36' }))));
     }
 };
 CpslCard.style = CpslCardStyle0;
@@ -6368,7 +6372,7 @@ const CpslCheckbox = class {
         this.checked = undefined;
     }
     render() {
-        return (h(Host, { key: 'b5d7963285854a20983f8655c8a9545b8d0735e9' }, h("input", { key: 'b822a505e826f06d47f1da51fff0c7f310d9c9ce', type: "checkbox", checked: this.checked }), h("span", { key: '3747cf548b8d88ceee19eae5c1df78cdc5f9c87e', onClick: this.handleCheckboxClick, class: { container: true, checked: this.checked } }, h("cpsl-icon", { key: '9d5d0cdba4b22bc2167aed23e7748201320a6553', icon: "check" }))));
+        return (h(Host, { key: '236c0b027e72c0c25dbc2fd3183a77400c815f8c' }, h("input", { key: '8c350e21268b87d485b16796b2058c4e47f46e75', type: "checkbox", checked: this.checked }), h("span", { key: 'b1d8fc6dd380b67eb8940f55bba47810c54ee189', onClick: this.handleCheckboxClick, class: { container: true, checked: this.checked } }, h("cpsl-icon", { key: '2b3ddcad1e2b9007bda8135a810b75a1a2cfaeca', icon: "check" }))));
     }
 };
 CpslCheckbox.style = CpslCheckboxStyle0;
@@ -6469,10 +6473,10 @@ const CpslCodeInput = class {
     }
     render() {
         var _a;
-        return (h(Host, { key: '3891d4e998fa56683fc45b4611c68689f2142e52' }, h("div", { key: '2180ef9e96ce1367998cd085219e0cc7fd09a753', class: "code-container" }, new Array(this.length).fill(0).map((_, i) => {
+        return (h(Host, { key: 'fd588544d9cdebaaeb1961f4ecb5c5630e8e4699' }, h("div", { key: 'b795c99f0df6fbf4ba9a7118f3f737dbf22c7ee9', class: "code-container" }, new Array(this.length).fill(0).map((_, i) => {
             var _a, _b;
             return (h("input", { class: { 'code-input': true, 'error': Boolean(this.errorText), 'has-value': ((_a = this.code) === null || _a === void 0 ? void 0 : _a[i]) !== undefined }, id: `code-input-${i}`, onKeyDown: ev => this.handleKeyDown(i, ev), onInput: ev => this.handleInput(i, ev), onFocus: () => this.handleFocus(i), onPaste: this.handlePaste, min: 0, max: 9, value: (_b = this.code) === null || _b === void 0 ? void 0 : _b[i], inputMode: this.type === 'number' ? 'numeric' : 'text' }));
-        })), (this.errorText || this.helperText) && (h("div", { key: '9aa97b8ecdc5c7a53aea740146aa6bd526a7f636', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("cpsl-icon", { key: '02bd4abe94e8e79efd9b3179d6b4513d1aad877b', icon: this.errorText ? 'alertCircle' : 'infoCircle' }), h("span", { key: '34f4b082e07315f6fdfad340cf69dbaa6d183339' }, (_a = this.errorText) !== null && _a !== void 0 ? _a : this.helperText)))));
+        })), (this.errorText || this.helperText) && (h("div", { key: '9cff50eb172f38af5065ad79e3c767f2e8ec33c9', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("cpsl-icon", { key: 'c8d7dbbd0ec7a2015e2e8099d0448b847641b845', icon: this.errorText ? 'alertCircle' : 'infoCircle' }), h("span", { key: '4ae4009a2fb4d8f6dc4c985ea8d39c136cb23780' }, (_a = this.errorText) !== null && _a !== void 0 ? _a : this.helperText)))));
     }
     get el() { return getElement(this); }
 };
@@ -6486,7 +6490,7 @@ const CpslDivider = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: 'a6b948fec22a99aa7f247a405f770addccd5ef7c' }, h("div", { key: '2c1090ed0e114b90331fc227fe6c2cafee5a9b31' }), h("slot", { key: '60c4412abf216c23c3649f16792afe63e84387f3' }), h("div", { key: 'aa6fdddc51a03a6e36b262402fcb059a7e35ba57' })));
+        return (h(Host, { key: 'd5cffdef9344f7dcac4aae1bc2acca8c02d69946' }, h("div", { key: 'e07f8107804df83537a3b8e40d124c66d2fc6f44' }), h("slot", { key: 'd97f02d46a63d32d107838b5aa50654a9593cc8a' }), h("div", { key: '2316aed010b91a65c961e2f30cc2cde03b892429' })));
     }
 };
 CpslDivider.style = CpslDividerStyle0;
@@ -6528,12 +6532,12 @@ const CpslDrawer = class {
         const setHeight = this.anchor === 'top' || this.anchor === 'bottom';
         const startingAnchor = (_a = `${this.anchorPosition}px`) !== null && _a !== void 0 ? _a : '0px';
         const size = this.size === 'auto' ? 'auto' : `${this.size}px`;
-        return (h(Host, { key: 'ef38766c4e22cdb6496bf62611215ce7fbc8abc1', style: Object.assign({ width: setHeight ? '100vw' : size, height: setHeight ? size : '100vh', transitionDuration: `${this.showTransition ? this.transitionDuration : 0}s`, transitionTimingFunction: `${this.transitionFunction}`, [this.anchor]: this.open || this.variant === 'permanent' ? startingAnchor : this.closedAnchorPosition, opacity: this.closedAnchorPosition === undefined ? '0' : '1' }, (this.zIndexOverride ? { zIndex: `${this.zIndexOverride}` } : {})), class: {
+        return (h(Host, { key: '81d454f0a4532e333880f4e37a79545ee5710536', style: Object.assign({ width: setHeight ? '100vw' : size, height: setHeight ? size : '100vh', transitionDuration: `${this.showTransition ? this.transitionDuration : 0}s`, transitionTimingFunction: `${this.transitionFunction}`, [this.anchor]: this.open || this.variant === 'permanent' ? startingAnchor : this.closedAnchorPosition, opacity: this.closedAnchorPosition === undefined ? '0' : '1' }, (this.zIndexOverride ? { zIndex: `${this.zIndexOverride}` } : {})), class: {
                 top: this.anchor === 'top',
                 bottom: this.anchor === 'bottom',
                 left: this.anchor === 'left',
                 right: this.anchor === 'right',
-            } }, this.variant === 'temporary' && !this.noOverlay && h("cpsl-overlay", { key: '7aa68b6104536d6fb29164c396179aa4f287ce97', open: this.open, zIndexOverride: DEFAULT_Z_INDICES.modal + 1 }), h("div", { key: '5049fe95873339bb4877728c49e0eda4d3158397', id: "container", class: "container", part: "container" }, h("slot", { key: 'c6d76fa8b8e47828c472ed9b876faf49c68a8a29' }))));
+            } }, this.variant === 'temporary' && !this.noOverlay && h("cpsl-overlay", { key: '21fdc68cd01c652b7a9f8e1d624027f4051fdb47', open: this.open, zIndexOverride: DEFAULT_Z_INDICES.modal + 1 }), h("div", { key: '085ba3bf2b57ceeb5615c42816e7a0f8758eeeb0', id: "container", class: "container", part: "container" }, h("slot", { key: 'bd8517779864cf35bc30b33597b27a43c749ba1f' }))));
     }
     get el() { return getElement(this); }
 };
@@ -6544,6 +6548,13 @@ const AlertCircle = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
 </svg>
 `;
 
+const AlertTriangle = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
+<g id="alert-triangle">
+<path id="Icon" d="M11.9998 8.99999V13M11.9998 17H12.0098M10.6151 3.89171L2.39019 18.0983C1.93398 18.8863 1.70588 19.2803 1.73959 19.6037C1.769 19.8857 1.91677 20.142 2.14613 20.3088C2.40908 20.5 2.86435 20.5 3.77487 20.5H20.2246C21.1352 20.5 21.5904 20.5 21.8534 20.3088C22.0827 20.142 22.2305 19.8857 22.2599 19.6037C22.2936 19.2803 22.0655 18.8863 21.6093 18.0983L13.3844 3.89171C12.9299 3.10654 12.7026 2.71396 12.4061 2.58211C12.1474 2.4671 11.8521 2.4671 11.5935 2.58211C11.2969 2.71396 11.0696 3.10655 10.6151 3.89171Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>
+`;
+
 const AngelListBrand = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M17.7703 10.0969C18.3188 8.56875 19.8984 4.14844 19.8984 2.73281C19.8984 1.48594 19.1625 0.440625 17.85 0.440625C15.7594 0.440625 13.8844 6.61406 13.2984 8.08594C12.8438 6.75 10.7156 0 8.84063 0C7.38282 0 6.69844 1.07344 6.69844 2.42344C6.69844 4.07812 8.30156 8.36719 8.88281 10.0172C8.5875 9.90938 8.26875 9.81562 7.94531 9.81562C6.84844 9.81562 5.68125 11.1797 5.68125 12.2812C5.68125 12.6984 5.91094 13.2844 6.05625 13.6734C4.32656 14.1422 3.66094 15.2953 3.66094 17.0344C3.65625 20.4187 6.8625 24 11.3719 24C16.9031 24 20.3438 19.8469 20.3438 14.4891C20.3438 12.4688 20.0203 10.6453 17.7703 10.0969ZM16.1109 5.0625C16.2984 4.48594 17.1 2.04844 17.85 2.04844C18.2531 2.04844 18.3609 2.46563 18.3609 2.79844C18.3609 3.69375 16.5516 8.63906 16.1531 9.73594L14.5594 9.45469L16.1109 5.0625ZM8.17032 2.26406C8.17032 1.70625 8.85 0.121875 10.3406 4.47188L11.9625 9.17344C11.2313 9.1125 10.6641 9.03281 10.3031 9.23906C9.79219 7.88906 8.17032 3.62812 8.17032 2.26406ZM8.0625 11.4375C9.43594 11.4375 11.2078 15.8719 11.2078 16.4719C11.2078 16.7109 10.9781 17.0062 10.7109 17.0062C9.73125 17.0062 7.10625 13.4016 7.10625 12.4266C7.11094 12.0656 7.70156 11.4375 8.0625 11.4375ZM16.7016 20.1703C15.3375 21.6703 13.5938 22.4484 11.5594 22.4484C8.775 22.4484 6.57656 20.9203 5.51719 18.3094C4.71563 16.275 5.69532 15.1078 6.48282 15.1078C7.01719 15.1078 9.02813 17.9344 9.02813 18.5344C9.02813 18.7641 8.66719 18.9234 8.47969 18.9234C7.725 18.9234 7.42969 18.1969 6.08438 16.5141C4.69219 17.9062 7.04532 20.5875 8.81719 20.5875C10.0406 20.5875 10.8375 19.4531 10.5984 18.6188C10.7719 18.6188 10.9875 18.6328 11.1469 18.5906C11.1984 19.8609 11.5734 21.375 13.1016 21.4828C13.1016 21.4406 13.1953 21.15 13.1953 21.1359C13.1953 20.3203 12.6984 19.6078 12.6984 18.7781C12.6984 17.4516 13.7156 16.1672 14.7469 15.4172C15.1219 15.1359 15.5766 14.9625 16.0172 14.8031C16.4719 14.6297 16.9547 14.4281 17.3016 14.0812C17.25 13.5562 17.0344 13.0922 16.5094 13.0922C15.2109 13.0922 10.8563 13.2797 10.8563 11.2313C10.8563 10.9172 10.8609 10.6172 11.6719 10.6172C13.1859 10.6172 17.0297 10.9922 18.1547 11.9813C19.0031 12.7359 19.2938 17.2875 16.7016 20.1703ZM12.0797 14.2641C12.5344 14.4094 13.0031 14.4516 13.4719 14.5453C13.125 14.7984 12.8156 15.1078 12.5203 15.4406C12.3891 15.0422 12.2297 14.6531 12.0797 14.2641Z" fill="black"/>
 </svg>
@@ -6569,6 +6580,12 @@ const ArrowCircleBrokenDownLeft = `<svg width="24" height="24" viewBox="0 0 24 2
 </svg>
 `;
 
+const ArrowCircleDownFilled = `<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect y="32" width="32" height="32" rx="16" transform="rotate(-90 0 32)" fill="#EBEBEB" />
+  <path d="M16 10.1667L16 21.8333M16 21.8333L21.8334 16M16 21.8333L10.1667 16" stroke="#616161" stroke-width="2"
+    stroke-linecap="round" stroke-linejoin="round" />
+</svg>`;
+
 const ArrowNarrow = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
 <path d="M4 12H20M20 12L14 6M20 12L14 18" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
@@ -6709,6 +6726,19 @@ const Check = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" strok
 </svg>
 `;
 
+const ChevronDown = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd"
+    d="M3.52864 5.52851C3.78899 5.26816 4.2111 5.26816 4.47145 5.52851L8.00004 9.05711L11.5286 5.52851C11.789 5.26816 12.2111 5.26816 12.4714 5.52851C12.7318 5.78886 12.7318 6.21097 12.4714 6.47132L8.47145 10.4713C8.2111 10.7317 7.78899 10.7317 7.52864 10.4713L3.52864 6.47132C3.26829 6.21097 3.26829 5.78886 3.52864 5.52851Z"
+    fill="#141414" />
+</svg>`;
+
+const ChevronSelectorVertical = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
+<g id="chevron-selector-vertical">
+<path id="Icon" d="M7 15L12 20L17 15M7 9L12 4L17 9" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>
+`;
+
 const ChevronUp = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
 <path d="M18 15L12 9L6 15" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
@@ -6754,6 +6784,13 @@ const Cosmos = `<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2
 </svg>
 `;
 
+const CreditCard02 = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
+<g id="credit-card-02">
+<path id="Icon" d="M22 10H2M11 14H6M2 8.2L2 15.8C2 16.9201 2 17.4802 2.21799 17.908C2.40973 18.2843 2.71569 18.5903 3.09202 18.782C3.51984 19 4.07989 19 5.2 19L18.8 19C19.9201 19 20.4802 19 20.908 18.782C21.2843 18.5903 21.5903 18.2843 21.782 17.908C22 17.4802 22 16.9201 22 15.8V8.2C22 7.0799 22 6.51984 21.782 6.09202C21.5903 5.7157 21.2843 5.40974 20.908 5.21799C20.4802 5 19.9201 5 18.8 5L5.2 5C4.0799 5 3.51984 5 3.09202 5.21799C2.7157 5.40973 2.40973 5.71569 2.21799 6.09202C2 6.51984 2 7.07989 2 8.2Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>
+`;
+
 const CreditCard = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
 <path d="M22 10H2M2 8.2L2 15.8C2 16.9201 2 17.4802 2.21799 17.908C2.40973 18.2843 2.71569 18.5903 3.09202 18.782C3.51984 19 4.07989 19 5.2 19L18.8 19C19.9201 19 20.4802 19 20.908 18.782C21.2843 18.5903 21.5903 18.2843 21.782 17.908C22 17.4802 22 16.9201 22 15.8V8.2C22 7.0799 22 6.51984 21.782 6.09202C21.5903 5.7157 21.2843 5.40974 20.908 5.21799C20.4802 5 19.9201 5 18.8 5L5.2 5C4.0799 5 3.51984 5 3.09202 5.21799C2.7157 5.40973 2.40973 5.71569 2.21799 6.09202C2 6.51984 2 7.07989 2 8.2Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
@@ -6824,6 +6861,13 @@ const Earth = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns
 </svg>
 `;
 
+const Edit02 = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
+<g id="edit-02">
+<path id="Icon" d="M18 10.0001L14 6.00006M2.5 21.5001L5.88437 21.124C6.29786 21.0781 6.5046 21.0551 6.69785 20.9925C6.86929 20.937 7.03245 20.8586 7.18289 20.7594C7.35245 20.6476 7.49955 20.5005 7.79373 20.2063L21 7.00006C22.1046 5.89549 22.1046 4.10463 21 3.00006C19.8955 1.89549 18.1046 1.89549 17 3.00006L3.79373 16.2063C3.49955 16.5005 3.35246 16.6476 3.24064 16.8172C3.14143 16.9676 3.06301 17.1308 3.00751 17.3022C2.94496 17.4955 2.92198 17.7022 2.87604 18.1157L2.5 21.5001Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>
+`;
+
 const Ethereum = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
   <path d="M15 9.99996L10 13.3333L5 9.99996L10 1.66663L15 9.99996Z" fill="black"/>
   <path d="M10 14.1666L5 10.8333L10 18.3333L15 10.8333L10 14.1666Z" fill="black"/>
@@ -7307,6 +7351,19 @@ const PlusCircle = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
 </g>
 </svg>`;
 
+const Plus = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
+<g id="plus">
+<path id="Icon" d="M12 5V19M5 12H19" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>
+`;
+
+const Polygon = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M12.0738 5.40664C11.7786 5.23751 11.3948 5.23751 11.0701 5.40664L8.7675 6.70333L7.20293 7.54902L4.90037 8.84568C4.60516 9.01481 4.2214 9.01481 3.89668 8.84568L2.06642 7.83086C1.77122 7.66173 1.56458 7.35168 1.56458 7.01341V5.01199C1.56458 4.67373 1.7417 4.36365 2.06642 4.19452L3.86715 3.20791C4.16236 3.03877 4.54612 3.03877 4.87084 3.20791L6.67159 4.19452C6.96677 4.36365 7.17343 4.67373 7.17343 5.01199V6.30869L8.738 5.43483V4.13814C8.738 3.79987 8.5609 3.48979 8.23616 3.32066L4.90037 1.46019C4.60516 1.29106 4.2214 1.29106 3.89668 1.46019L0.501845 3.32066C0.177122 3.48979 0 3.79987 0 4.13814V7.88727C0 8.22553 0.177122 8.53563 0.501845 8.70476L3.89668 10.5652C4.19187 10.7343 4.57564 10.7343 4.90037 10.5652L7.20293 9.29671L8.7675 8.42286L11.0701 7.15435C11.3653 6.98522 11.7491 6.98522 12.0738 7.15435L13.8745 8.14096C14.1697 8.31009 14.3764 8.6202 14.3764 8.95845V10.9598C14.3764 11.2981 14.1993 11.6082 13.8745 11.7773L12.0738 12.7921C11.7786 12.9613 11.3948 12.9613 11.0701 12.7921L9.26939 11.8055C8.97416 11.6364 8.7675 11.3263 8.7675 10.988V9.69137L7.20293 10.5652V11.8619C7.20293 12.2001 7.38008 12.5102 7.70476 12.6794L11.0996 14.5398C11.3948 14.709 11.7786 14.709 12.1033 14.5398L15.4982 12.6794C15.7933 12.5102 16 12.2001 16 11.8619V8.11275C16 7.7745 15.8228 7.46445 15.4982 7.29532L12.0738 5.40664Z"
+    fill="#8247E5" />
+</svg>`;
+
 const PuzzlePiece = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
 <path d="M7.5 4.5C7.5 3.11929 8.61929 2 10 2C11.3807 2 12.5 3.11929 12.5 4.5V6H13.5C14.8978 6 15.5967 6 16.1481 6.22836C16.8831 6.53284 17.4672 7.11687 17.7716 7.85195C18 8.40326 18 9.10218 18 10.5H19.5C20.8807 10.5 22 11.6193 22 13C22 14.3807 20.8807 15.5 19.5 15.5H18V17.2C18 18.8802 18 19.7202 17.673 20.362C17.3854 20.9265 16.9265 21.3854 16.362 21.673C15.7202 22 14.8802 22 13.2 22H12.5V20.25C12.5 19.0074 11.4926 18 10.25 18C9.00736 18 8 19.0074 8 20.25V22H6.8C5.11984 22 4.27976 22 3.63803 21.673C3.07354 21.3854 2.6146 20.9265 2.32698 20.362C2 19.7202 2 18.8802 2 17.2V15.5H3.5C4.88071 15.5 6 14.3807 6 13C6 11.6193 4.88071 10.5 3.5 10.5H2C2 9.10218 2 8.40326 2.22836 7.85195C2.53284 7.11687 3.11687 6.53284 3.85195 6.22836C4.40326 6 5.10218 6 6.5 6H7.5V4.5Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>
@@ -7416,6 +7473,10 @@ const Solana = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" v
 </svg>
 `;
 
+const Star04Filled = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="none" fill="currentColor">
+  <path d="M12.9333 1.64102C12.7848 1.25483 12.4138 1 12 1C11.5862 1 11.2152 1.25483 11.0667 1.64102L9.0547 6.87211C8.7543 7.65315 8.6599 7.87822 8.53078 8.05981C8.40122 8.24202 8.24202 8.40122 8.05981 8.53078C7.87822 8.6599 7.65315 8.7543 6.8721 9.0547L1.64102 11.0667C1.25483 11.2152 1 11.5862 1 12C1 12.4138 1.25483 12.7848 1.64102 12.9333L6.87211 14.9453C7.65315 15.2457 7.87822 15.3401 8.05981 15.4692C8.24202 15.5988 8.40122 15.758 8.53078 15.9402C8.6599 16.1218 8.7543 16.3469 9.0547 17.1279L11.0667 22.359C11.2152 22.7452 11.5862 23 12 23C12.4138 23 12.7848 22.7452 12.9333 22.359L14.9453 17.1279C15.2457 16.3469 15.3401 16.1218 15.4692 15.9402C15.5988 15.758 15.758 15.5988 15.9402 15.4692C16.1218 15.3401 16.3469 15.2457 17.1279 14.9453L22.359 12.9333C22.7452 12.7848 23 12.4138 23 12C23 11.5862 22.7452 11.2152 22.359 11.0667L17.1279 9.0547C16.3469 8.7543 16.1218 8.6599 15.9402 8.53078C15.758 8.40122 15.5988 8.24202 15.4692 8.05981C15.3401 7.87822 15.2457 7.65315 14.9453 6.87211L12.9333 1.64102Z" />
+</svg>`;
+
 const Stars = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
 <path d="M6.5 13L7.28446 14.5689C7.54995 15.0999 7.68269 15.3654 7.86003 15.5954C8.01739 15.7996 8.20041 15.9826 8.40455 16.14C8.63462 16.3173 8.9001 16.4501 9.43108 16.7155L11 17.5L9.43108 18.2845C8.9001 18.5499 8.63462 18.6827 8.40455 18.86C8.20041 19.0174 8.01739 19.2004 7.86003 19.4046C7.68269 19.6346 7.54995 19.9001 7.28446 20.4311L6.5 22L5.71554 20.4311C5.45005 19.9001 5.31731 19.6346 5.13997 19.4046C4.98261 19.2004 4.79959 19.0174 4.59545 18.86C4.36538 18.6827 4.0999 18.5499 3.56892 18.2845L2 17.5L3.56892 16.7155C4.0999 16.4501 4.36538 16.3173 4.59545 16.14C4.79959 15.9826 4.98261 15.7996 5.13997 15.5954C5.31731 15.3654 5.45005 15.0999 5.71554 14.5689L6.5 13Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 <path d="M15 2L16.1786 5.06442C16.4606 5.79765 16.6016 6.16426 16.8209 6.47264C17.0153 6.74595 17.254 6.98475 17.5274 7.17909C17.8357 7.39836 18.2024 7.53937 18.9356 7.82138L22 9L18.9356 10.1786C18.2024 10.4606 17.8357 10.6016 17.5274 10.8209C17.254 11.0153 17.0153 11.254 16.8209 11.5274C16.6016 11.8357 16.4606 12.2024 16.1786 12.9356L15 16L13.8214 12.9356C13.5394 12.2024 13.3984 11.8357 13.1791 11.5274C12.9847 11.254 12.746 11.0153 12.4726 10.8209C12.1643 10.6016 11.7976 10.4606 11.0644 10.1786L8 9L11.0644 7.82138C11.7976 7.53937 12.1643 7.39836 12.4726 7.17909C12.746 6.98475 12.9847 6.74595 13.1791 6.47264C13.3984 6.16426 13.5394 5.79765 13.8214 5.06442L15 2Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
@@ -7502,6 +7563,13 @@ const Twitter = `<svg width="24" height="24" viewBox="0 0 24 24" fill="currentCo
 </svg>
 `;
 
+const User = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
+<g id="user-03">
+<path id="Icon" d="M3 20C5.33579 17.5226 8.50702 16 12 16C15.493 16 18.6642 17.5226 21 20M16.5 7.5C16.5 9.98528 14.4853 12 12 12C9.51472 12 7.5 9.98528 7.5 7.5C7.5 5.01472 9.51472 3 12 3C14.4853 3 16.5 5.01472 16.5 7.5Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>
+`;
+
 const Wallet = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
 <g id="wallet-04">
 <path id="Icon" d="M20 9.5V7.2C20 6.0799 20 5.51984 19.782 5.09202C19.5903 4.7157 19.2843 4.40974 18.908 4.21799C18.4802 4 17.9201 4 16.8 4H5.2C4.0799 4 3.51984 4 3.09202 4.21799C2.7157 4.40973 2.40973 4.71569 2.21799 5.09202C2 5.51984 2 6.0799 2 7.2V16.8C2 17.9201 2 18.4802 2.21799 18.908C2.40973 19.2843 2.71569 19.5903 3.09202 19.782C3.51984 20 4.07989 20 5.2 20L16.8 20C17.9201 20 18.4802 20 18.908 19.782C19.2843 19.5903 19.5903 19.2843 19.782 18.908C20 18.4802 20 17.9201 20 16.8V14.5M15 12C15 11.5353 15 11.303 15.0384 11.1098C15.1962 10.3164 15.8164 9.69624 16.6098 9.53843C16.803 9.5 17.0353 9.5 17.5 9.5H19.5C19.9647 9.5 20.197 9.5 20.3902 9.53843C21.1836 9.69624 21.8038 10.3164 21.9616 11.1098C22 11.303 22 11.5353 22 12C22 12.4647 22 12.697 21.9616 12.8902C21.8038 13.6836 21.1836 14.3038 20.3902 14.4616C20.197 14.5 19.9647 14.5 19.5 14.5H17.5C17.0353 14.5 16.803 14.5 16.6098 14.4616C15.8164 14.3038 15.1962 13.6836 15.0384 12.8902C15 12.697 15 12.4647 15 12Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
@@ -11500,7 +11568,367 @@ const ZW = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="h
 </svg>
 `;
 
-const Icons = { alertCircle: AlertCircle, angelListBrand: AngelListBrand, angelList: AngelList, appleBrand: AppleBrand, apple: Apple, arrowCircleBrokenDownLeft: ArrowCircleBrokenDownLeft, arrowNarrow: ArrowNarrow, arrow: Arrow, backupKit: BackupKit, bank: Bank, brush: Brush, capsuleLogo: CapsuleLogo, capsuleRingsDark: CapsuleRingsDark, capsuleRings: CapsuleRings, capsule: Capsule, checkCircleFilled: CheckCircleFilled, checkCircle: CheckCircle, check: Check, chevronUp: ChevronUp, clock: Clock, close: Close, clubhouseBrand: ClubhouseBrand, clubhouse: Clubhouse, copy: Copy, cosmos: Cosmos, creditCard: CreditCard, cube: Cube, decentBrand: DecentBrand, decent: Decent, discordBrand: DiscordBrand, discord: Discord, dot: Dot, downloadCloud: DownloadCloud, download: Download, dribbbleBrand: DribbbleBrand, dribbble: Dribbble, earth: Earth, ethereum: Ethereum, eyeOff: EyeOff, eye: Eye, facebookBrand: FacebookBrand, facebook: Facebook, farcasterBrand: FarcasterBrand, farcaster: Farcaster, figmaBrand: FigmaBrand, figma: Figma, file: File, folder: Folder, githubBrand: GithubBrand, github: Github, globe: Globe, googleBrand: GoogleBrand, google: Google, helpCircle: HelpCircle, heroAlertCircle: HeroAlertCircle, heroCheckmarkCapsule: HeroCheckmarkCapsule, heroCheckmark: HeroCheckmark, heroEmail: HeroEmail, heroExternalConnection: HeroExternalConnection, heroLock: HeroLock, heroPasskey: HeroPasskey, heroPhone: HeroPhone, heroPlusCircleCapsule: HeroPlusCircleCapsule, heroPlusCircle: HeroPlusCircle, heroWallet: HeroWallet, home: Home, image: Image$1, infoCircle: InfoCircle, instagramBrand: InstagramBrand, instagram: Instagram, key: Key, lightning01: Lightning01, lightning: Lightning, linkExternal: LinkExternal, linkedinBrand: LinkedinBrand, linkedin: Linkedin, logOut: LogOut, mail: Mail, menu: Menu, moonpayBrand: MoonpayBrand, moreLoginOptions: MoreLoginOptions, phone: Phone, pintrestBrand: PintrestBrand, pintrest: Pintrest, plusCircle: PlusCircle, puzzlePiece: PuzzlePiece, qrCode02: QrCode02, qrCode: QrCode, rampNetworkBrand: RampNetworkBrand, rampNetwork: RampNetwork, redditBrand: RedditBrand, reddit: Reddit, refresh: Refresh, search: Search, send: Send, settings: Settings, shield: Shield, signalBrand: SignalBrand, signal: Signal, snapchatBrand: SnapchatBrand, snapchat: Snapchat, solana: Solana, stars: Stars, stripeBrand: StripeBrand, telegramBrand: TelegramBrand, telegram: Telegram, tikTokBrand: TikTokBrand, tikTok: TikTok, tumblrBrand: TumblrBrand, tumblr: Tumblr, twitterBrand: TwitterBrand, twitter: Twitter, wallet: Wallet, x: X, youtubeBrand: YoutubeBrand, youtube: Youtube, AD: AD, AE: AE, AF: AF, AG: AG, AI: AI, AL: AL, AM: AM, AO: AO, AR: AR, AS: AS, AT: AT, AU: AU, AW: AW, AX: AX, AZ: AZ, BA: BA, BB: BB, BD: BD, BE: BE, BF: BF, BG: BG, BH: BH, BI: BI, BJ: BJ, BL: BL, BM: BM, BN: BN, BO: BO, BQ: BQ, BQ2: BQ2, BQ3: BQ3, BR: BR, BS: BS, BT: BT, BW: BW, BY: BY, BZ: BZ, CA: CA, CC: CC, CD: CD, CD2: CD2, CF: CF, CH: CH, CK: CK, CL: CL, CM: CM, CN: CN, CO: CO, CR: CR, CU: CU, CW: CW, CX: CX, CY: CY, CZ: CZ, DE: DE, DJ: DJ, DK: DK, DM: DM, DO: DO, DS: DS, DZ: DZ, EC: EC, EE: EE, EG: EG, EH: EH, ER: ER, ES: ES, ET: ET, FI: FI, FJ: FJ, FK: FK, FM: FM, FO: FO, FR: FR, GA: GA, GB2: GB2, GB: GB, GD: GD, GE: GE, GG: GG, GH: GH, GI: GI, GL: GL, GM: GM, GN: GN, GQ: GQ, GR: GR, GT: GT, GU: GU, GW: GW, GY: GY, HK: HK, HN: HN, HR: HR, HT: HT, HU: HU, ID: ID, IE: IE, IL: IL, IM: IM, IN: IN, IO: IO, IQ: IQ, IR: IR, IS: IS, IT: IT, JE: JE, JM: JM, JO: JO, JP: JP, KE: KE, KG: KG, KH: KH, KI: KI, KM: KM, KN: KN, KP: KP, KR: KR, KW: KW, KY: KY, KZ: KZ, LA: LA, LB: LB, LC: LC, LI: LI, LK: LK, LR: LR, LS: LS, LT: LT, LU: LU, LV: LV, LY: LY, MA: MA, MC: MC, MD: MD, ME: ME, MG: MG, MH: MH, MK: MK, ML: ML, MM: MM, MN: MN, MO: MO, MP: MP, MQ: MQ, MR: MR, MS: MS, MT: MT, MU: MU, MV: MV, MW: MW, MX: MX, MY: MY, MZ: MZ, NA: NA, NE: NE, NF: NF, NG: NG, NI: NI, NL: NL, NO: NO, NP: NP, NR: NR, NU: NU, NZ: NZ, OM: OM, PA: PA, PE: PE, PF: PF, PG: PG, PH: PH, PK: PK, PL: PL, PN: PN, PR: PR, PS: PS, PT: PT, PW: PW, PY: PY, QA: QA, RO: RO, RS: RS, RU: RU, RW: RW, SA: SA, SB: SB, SC: SC, SE: SE, SG: SG, SI: SI, SK: SK, SL: SL, SM: SM, SN: SN, SO: SO, SR: SR, SS: SS, ST: ST, SV: SV, SX: SX, SY: SY, SZ: SZ, TC: TC, TD: TD, TG: TG, TH: TH, TJ: TJ, TK: TK, TL: TL, TM: TM, TN: TN, TO: TO, TR: TR, TT: TT, TV: TV, TW: TW, TZ: TZ, UA: UA, UG: UG, US: US, UY: UY, UZ: UZ, VC: VC, VE: VE, VG: VG, VI: VI, VN: VN, VU: VU, WS: WS, YE: YE, ZA: ZA, ZM: ZM, ZW: ZW, };
+const Icons = {
+    alertCircle: AlertCircle,
+    alertTriangle: AlertTriangle,
+    angelListBrand: AngelListBrand,
+    angelList: AngelList,
+    appleBrand: AppleBrand,
+    apple: Apple,
+    arrowCircleBrokenDownLeft: ArrowCircleBrokenDownLeft,
+    arrowCircleDownFilled: ArrowCircleDownFilled,
+    arrowNarrow: ArrowNarrow,
+    arrow: Arrow,
+    backupKit: BackupKit,
+    bank: Bank,
+    brush: Brush,
+    capsuleLogo: CapsuleLogo,
+    capsuleRingsDark: CapsuleRingsDark,
+    capsuleRings: CapsuleRings,
+    capsule: Capsule,
+    checkCircleFilled: CheckCircleFilled,
+    checkCircle: CheckCircle,
+    check: Check,
+    chevronDown: ChevronDown,
+    chevronSelectorVertical: ChevronSelectorVertical,
+    chevronUp: ChevronUp,
+    clock: Clock,
+    close: Close,
+    clubhouseBrand: ClubhouseBrand,
+    clubhouse: Clubhouse,
+    copy: Copy,
+    cosmos: Cosmos,
+    creditCard02: CreditCard02,
+    creditCard: CreditCard,
+    cube: Cube,
+    decentBrand: DecentBrand,
+    decent: Decent,
+    discordBrand: DiscordBrand,
+    discord: Discord,
+    dot: Dot,
+    downloadCloud: DownloadCloud,
+    download: Download,
+    dribbbleBrand: DribbbleBrand,
+    dribbble: Dribbble,
+    earth: Earth,
+    edit02: Edit02,
+    ethereum: Ethereum,
+    eyeOff: EyeOff,
+    eye: Eye,
+    facebookBrand: FacebookBrand,
+    facebook: Facebook,
+    farcasterBrand: FarcasterBrand,
+    farcaster: Farcaster,
+    figmaBrand: FigmaBrand,
+    figma: Figma,
+    file: File,
+    folder: Folder,
+    githubBrand: GithubBrand,
+    github: Github,
+    globe: Globe,
+    googleBrand: GoogleBrand,
+    google: Google,
+    helpCircle: HelpCircle,
+    heroAlertCircle: HeroAlertCircle,
+    heroCheckmarkCapsule: HeroCheckmarkCapsule,
+    heroCheckmark: HeroCheckmark,
+    heroEmail: HeroEmail,
+    heroExternalConnection: HeroExternalConnection,
+    heroLock: HeroLock,
+    heroPasskey: HeroPasskey,
+    heroPhone: HeroPhone,
+    heroPlusCircleCapsule: HeroPlusCircleCapsule,
+    heroPlusCircle: HeroPlusCircle,
+    heroWallet: HeroWallet,
+    home: Home,
+    image: Image$1,
+    infoCircle: InfoCircle,
+    instagramBrand: InstagramBrand,
+    instagram: Instagram,
+    key: Key,
+    lightning01: Lightning01,
+    lightning: Lightning,
+    linkExternal: LinkExternal,
+    linkedinBrand: LinkedinBrand,
+    linkedin: Linkedin,
+    logOut: LogOut,
+    mail: Mail,
+    menu: Menu,
+    moonpayBrand: MoonpayBrand,
+    moreLoginOptions: MoreLoginOptions,
+    phone: Phone,
+    pintrestBrand: PintrestBrand,
+    pintrest: Pintrest,
+    plusCircle: PlusCircle,
+    plus: Plus,
+    polygon: Polygon,
+    puzzlePiece: PuzzlePiece,
+    qrCode02: QrCode02,
+    qrCode: QrCode,
+    rampNetworkBrand: RampNetworkBrand,
+    rampNetwork: RampNetwork,
+    redditBrand: RedditBrand,
+    reddit: Reddit,
+    refresh: Refresh,
+    search: Search,
+    send: Send,
+    settings: Settings,
+    shield: Shield,
+    signalBrand: SignalBrand,
+    signal: Signal,
+    snapchatBrand: SnapchatBrand,
+    snapchat: Snapchat,
+    solana: Solana,
+    star04Filled: Star04Filled,
+    stars: Stars,
+    stripeBrand: StripeBrand,
+    telegramBrand: TelegramBrand,
+    telegram: Telegram,
+    tikTokBrand: TikTokBrand,
+    tikTok: TikTok,
+    tumblrBrand: TumblrBrand,
+    tumblr: Tumblr,
+    twitterBrand: TwitterBrand,
+    twitter: Twitter,
+    user: User,
+    wallet: Wallet,
+    x: X,
+    youtubeBrand: YoutubeBrand,
+    youtube: Youtube,
+    AD: AD,
+    AE: AE,
+    AF: AF,
+    AG: AG,
+    AI: AI,
+    AL: AL,
+    AM: AM,
+    AO: AO,
+    AR: AR,
+    AS: AS,
+    AT: AT,
+    AU: AU,
+    AW: AW,
+    AX: AX,
+    AZ: AZ,
+    BA: BA,
+    BB: BB,
+    BD: BD,
+    BE: BE,
+    BF: BF,
+    BG: BG,
+    BH: BH,
+    BI: BI,
+    BJ: BJ,
+    BL: BL,
+    BM: BM,
+    BN: BN,
+    BO: BO,
+    BQ: BQ,
+    BQ2: BQ2,
+    BQ3: BQ3,
+    BR: BR,
+    BS: BS,
+    BT: BT,
+    BW: BW,
+    BY: BY,
+    BZ: BZ,
+    CA: CA,
+    CC: CC,
+    CD: CD,
+    CD2: CD2,
+    CF: CF,
+    CH: CH,
+    CK: CK,
+    CL: CL,
+    CM: CM,
+    CN: CN,
+    CO: CO,
+    CR: CR,
+    CU: CU,
+    CW: CW,
+    CX: CX,
+    CY: CY,
+    CZ: CZ,
+    DE: DE,
+    DJ: DJ,
+    DK: DK,
+    DM: DM,
+    DO: DO,
+    DS: DS,
+    DZ: DZ,
+    EC: EC,
+    EE: EE,
+    EG: EG,
+    EH: EH,
+    ER: ER,
+    ES: ES,
+    ET: ET,
+    FI: FI,
+    FJ: FJ,
+    FK: FK,
+    FM: FM,
+    FO: FO,
+    FR: FR,
+    GA: GA,
+    GB2: GB2,
+    GB: GB,
+    GD: GD,
+    GE: GE,
+    GG: GG,
+    GH: GH,
+    GI: GI,
+    GL: GL,
+    GM: GM,
+    GN: GN,
+    GQ: GQ,
+    GR: GR,
+    GT: GT,
+    GU: GU,
+    GW: GW,
+    GY: GY,
+    HK: HK,
+    HN: HN,
+    HR: HR,
+    HT: HT,
+    HU: HU,
+    ID: ID,
+    IE: IE,
+    IL: IL,
+    IM: IM,
+    IN: IN,
+    IO: IO,
+    IQ: IQ,
+    IR: IR,
+    IS: IS,
+    IT: IT,
+    JE: JE,
+    JM: JM,
+    JO: JO,
+    JP: JP,
+    KE: KE,
+    KG: KG,
+    KH: KH,
+    KI: KI,
+    KM: KM,
+    KN: KN,
+    KP: KP,
+    KR: KR,
+    KW: KW,
+    KY: KY,
+    KZ: KZ,
+    LA: LA,
+    LB: LB,
+    LC: LC,
+    LI: LI,
+    LK: LK,
+    LR: LR,
+    LS: LS,
+    LT: LT,
+    LU: LU,
+    LV: LV,
+    LY: LY,
+    MA: MA,
+    MC: MC,
+    MD: MD,
+    ME: ME,
+    MG: MG,
+    MH: MH,
+    MK: MK,
+    ML: ML,
+    MM: MM,
+    MN: MN,
+    MO: MO,
+    MP: MP,
+    MQ: MQ,
+    MR: MR,
+    MS: MS,
+    MT: MT,
+    MU: MU,
+    MV: MV,
+    MW: MW,
+    MX: MX,
+    MY: MY,
+    MZ: MZ,
+    NA: NA,
+    NE: NE,
+    NF: NF,
+    NG: NG,
+    NI: NI,
+    NL: NL,
+    NO: NO,
+    NP: NP,
+    NR: NR,
+    NU: NU,
+    NZ: NZ,
+    OM: OM,
+    PA: PA,
+    PE: PE,
+    PF: PF,
+    PG: PG,
+    PH: PH,
+    PK: PK,
+    PL: PL,
+    PN: PN,
+    PR: PR,
+    PS: PS,
+    PT: PT,
+    PW: PW,
+    PY: PY,
+    QA: QA,
+    RO: RO,
+    RS: RS,
+    RU: RU,
+    RW: RW,
+    SA: SA,
+    SB: SB,
+    SC: SC,
+    SE: SE,
+    SG: SG,
+    SI: SI,
+    SK: SK,
+    SL: SL,
+    SM: SM,
+    SN: SN,
+    SO: SO,
+    SR: SR,
+    SS: SS,
+    ST: ST,
+    SV: SV,
+    SX: SX,
+    SY: SY,
+    SZ: SZ,
+    TC: TC,
+    TD: TD,
+    TG: TG,
+    TH: TH,
+    TJ: TJ,
+    TK: TK,
+    TL: TL,
+    TM: TM,
+    TN: TN,
+    TO: TO,
+    TR: TR,
+    TT: TT,
+    TV: TV,
+    TW: TW,
+    TZ: TZ,
+    UA: UA,
+    UG: UG,
+    US: US,
+    UY: UY,
+    UZ: UZ,
+    VC: VC,
+    VE: VE,
+    VG: VG,
+    VI: VI,
+    VN: VN,
+    VU: VU,
+    WS: WS,
+    YE: YE,
+    ZA: ZA,
+    ZM: ZM,
+    ZW: ZW,
+};
 
 const cpslDropdownCss = ":host{display:block;position:relative;font-family:Arial, sans-serif;--input-color:var(--cpsl-color-text-primary);--container-background-color:var(--cpsl-color-input-surface-default);--container-border-color:var(--cpsl-color-input-border-active);--scrollbar-color:var(--cpsl-color-text-subtle);--divider-color:var(--cpsl-color-divider);--input-placeholder-color:var(--cpsl-color-text-secondary);--input-font-size:var(--cpsl-font-size-body-m);--button-hover-color:var(--cpsl-color-tile-button-surface-hover);font-family:var(--cpsl-font-family, inherit)}.input-container{position:relative;width:100%}::slotted(cpsl-dropdown){position:absolute;width:100%;top:100%;left:0;z-index:2}.dropdown-button{display:flex;width:100%;padding:0 4px;background:none;border:none;align-items:center;justify-content:space-between;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--input-color)}.dropdown-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}.dropdown-button div{margin-left:8px;display:flex;align-items:center}.dropdown-options{display:none;position:fixed;list-style:none;padding:0;margin-top:4px;border:1px solid var(--container-border-color);border-radius:8px;z-index:999999999999;overflow-y:auto;max-height:300px;box-sizing:border-box;background-color:var(--container-background-color);}.dropdown-options.open{display:block}.dropdown-options li{padding:8px;cursor:pointer;display:flex;align-items:center;border-bottom:1px solid var(--cpsl-color-divider);color:var(--input-color);background:var(--container-background-color);font-size:var(--input-font-size)}.dropdown-options li:hover{background-color:var(--button-hover-color)}.dropdown-options li svg{width:24px;height:24px;margin-right:8px;padding:0 8px;vertical-align:middle;}.dropdown-options::-webkit-scrollbar{width:8px;height:8px;background-color:transparent;}.dropdown-options::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color);border-radius:10px;border:2px solid transparent;background-clip:content-box;height:8px}.dropdown-options::-webkit-scrollbar-track{background:transparent;}.dropdown-value{margin-left:8px;color:var(--cpsl-color-text-secondary)}.dropdown-button .chevron{transition:transform 0.3s ease}.dropdown-button .chevron.closed{transform:rotate(180deg)}.search-bar{padding:0;border-bottom:1px solid var(--cpsl-color-divider);position:sticky;top:0;background:var(--container-background-color);z-index:1;}.search-bar input{width:100%;padding:8px;border:none;box-sizing:border-box;font-size:var(--input-font-size);color:var(--input-color);background-color:var(--container-background-color);border-radius:0;}.search-bar input::placeholder{color:var(--input-placeholder-color)}.search-bar input:focus{outline:none;border-color:transparent;}";
 const CpslDropdownStyle0 = cpslDropdownCss;
@@ -11601,7 +12029,7 @@ const CpslDropdown = class {
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '351276cd3f2f3170a074810279edefb3880b1e3e' }, h("button", { key: 'c73281596b3cb5ea374721b474357cba751eb112', class: "dropdown-button", onClick: this.toggleDropdown }, `${((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.selectedLabel) || ((_b = this.selectedItem) === null || _b === void 0 ? void 0 : _b.label)} ${(_c = this.selectedItem) === null || _c === void 0 ? void 0 : _c.value}`, h("div", { key: 'af68dc8729ed048ee14b49ba756b115e414feb3e', class: `chevron ${this.isOpen ? '' : 'closed'}`, innerHTML: Icons['chevronUp'] })), h("ul", { key: 'dc2f7f50a072af503d81ca77e543571871647b5d', class: { 'dropdown-options': true, 'open': this.isOpen }, style: { width: this.width } }, this.hasCpslSearch && (h("li", { key: '7e2e9270927bcdac083849389e9423d502fec40b', class: "search-bar" }, h("input", { key: '003e9aae15f7c9e5b11fa2aa3f9aeb93c1492a04', type: "text", placeholder: "Search...", value: this.searchQuery, onInput: this.handleSearchQueryChange }))), this.filteredItems.map(item => (h("li", { onClick: this.handleItemSelect(item) }, h("span", { innerHTML: Icons[item.icon] }), item.label, " ", h("span", { class: "dropdown-value" }, item.value)))))));
+        return (h(Host, { key: 'a997453b8690196f125bcf96fd94d728e645cd9e' }, h("button", { key: '0be8f5b0b6fcb3a27a5885205c0f585a68dc1bb9', class: "dropdown-button", onClick: this.toggleDropdown }, `${((_a = this.selectedItem) === null || _a === void 0 ? void 0 : _a.selectedLabel) || ((_b = this.selectedItem) === null || _b === void 0 ? void 0 : _b.label)} ${(_c = this.selectedItem) === null || _c === void 0 ? void 0 : _c.value}`, h("div", { key: 'f324edfdd97304de361a0ccd2bec793af25d3aa3', class: `chevron ${this.isOpen ? '' : 'closed'}`, innerHTML: Icons['chevronUp'] })), h("ul", { key: 'e1a3a097abb0633bd33caefabce016e2308f1ac0', class: { 'dropdown-options': true, 'open': this.isOpen }, style: { width: this.width } }, this.hasCpslSearch && (h("li", { key: '517c74f9f94df623206d8969a32d894b854f95a4', class: "search-bar" }, h("input", { key: '28ed686f30069ecb92dd0ee1852a9b9f94a98264', type: "text", placeholder: "Search...", value: this.searchQuery, onInput: this.handleSearchQueryChange }))), this.filteredItems.map(item => (h("li", { onClick: this.handleItemSelect(item) }, h("span", { innerHTML: Icons[item.icon] }), item.label, " ", h("span", { class: "dropdown-value" }, item.value)))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -11712,6 +12140,7 @@ const CpslFileUpload = class {
         this.dragError = undefined;
         this.isUploading = undefined;
         this.uploadError = undefined;
+        this.disabled = false;
         this.errorText = undefined;
         this.externalFilename = undefined;
         this.externalSrc = undefined;
@@ -11736,7 +12165,7 @@ const CpslFileUpload = class {
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '18e0096b27a8b805ee94f525ace13457349f16f3' }, this.label && (h("label", { key: '22a099ae4179b2cead6c9835123bcf4e365833e9', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("slot", { key: 'fc02c2a0aa82d896d50045cfc10f45cf3d86e321', name: "label" }), h("div", { key: '31e50d9d7249f4700d33a9164b39050d8909efba', class: { 'container': true, 'error': Boolean(this.errorText), 'drag': this.dragOver, 'drag-error': this.dragError } }, h("div", { key: '9546b0675d270df3a24fa3cd6ee88fd4871b55de', class: { 'label-container': true } }, h("slot", { key: 'd9c1581dbad76b3ef0b1b90b8b455d0c0691ed89', name: "left-content" })), h("div", { key: 'f97421c4e415b1b5e634d494eebf964d12ee206c', class: { 'file-container': true } }, this.FileContent), h("input", { key: '5e84df74b088c43b5734118eae1de926f5c3cc70', id: this.inputId, type: "file", accept: (_b = (_a = this.fileTypes) === null || _a === void 0 ? void 0 : _a.join(', ')) !== null && _b !== void 0 ? _b : '*', files: this.file ? [this.file] : undefined, onDrop: this.handleDrop, onDragEnter: this.handleDragEnter, onDragLeave: this.handleDragLeave, onChange: this.handleInputChange })), (this.errorText || this.helperText) && (h("div", { key: '146a25dc2a19ed98649e7af450b700c4009975c9', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: '83df60cdc393902f62e9766dc06ea0065aca11fe' }, (_c = this.errorText) !== null && _c !== void 0 ? _c : this.helperText)))));
+        return (h(Host, { key: '521ca35901a009b303650d7446e1f148930d7fe3' }, this.label && (h("label", { key: '94c58691decea8455a254698ec8fd27baba260ca', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("slot", { key: 'cf7e80e4c4a1e48b4f4efddfe4e8eb0f4a31ed4b', name: "label" }), h("div", { key: '35f1707b3c8d1f1c939d9312b541f32edfc424d1', class: { 'container': true, 'error': Boolean(this.errorText), 'drag': this.dragOver, 'drag-error': this.dragError } }, h("div", { key: '327f71aaaa7d4920a62118ea956c4c128907fae6', class: { 'label-container': true } }, h("slot", { key: '0c4891ffb0c9d49e2b5b09c3bdbc8d5b2ed3ff2d', name: "left-content" })), h("div", { key: '47dc7cc569d860dc07478c2782c62a0d25b3df07', class: { 'file-container': true } }, this.FileContent), h("input", { key: '809568bfed82463cda7851d3717187112cff708b', id: this.inputId, type: "file", accept: (_b = (_a = this.fileTypes) === null || _a === void 0 ? void 0 : _a.join(', ')) !== null && _b !== void 0 ? _b : '*', files: this.file ? [this.file] : undefined, onDrop: this.handleDrop, onDragEnter: this.handleDragEnter, onDragLeave: this.handleDragLeave, onChange: this.handleInputChange, disabled: this.disabled })), (this.errorText || this.helperText) && (h("div", { key: '6f06cba54f65d903b3d22e015e694a154b189df7', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: '2103ca2366b9a7827c42302cea3fa8d8c71bc50b' }, (_c = this.errorText) !== null && _c !== void 0 ? _c : this.helperText)))));
     }
     get el() { return getElement(this); }
 };
@@ -11753,7 +12182,7 @@ const CpslIcon = class {
         this.icon = undefined;
     }
     render() {
-        return (h(Host, { key: 'f7a86185e4b1deadba2a41381b88d6860d0d60d5', part: "icon", role: "img" }, !this.icon ? h("img", { src: this.src }) : h("div", { innerHTML: Icons[this.icon] })));
+        return (h(Host, { key: '83970488e84a7359667faa9948079b3fac1b8e09', part: "icon", role: "img" }, !this.icon ? h("img", { src: this.src }) : h("div", { innerHTML: Icons[this.icon] })));
     }
 };
 CpslIcon.style = CpslIconStyle0;
@@ -11791,7 +12220,7 @@ const CpslIconGroup = class {
     render() {
         // If disabled remove all brand icons to ensure the disabled color is shown correctly
         const icons = this.disabled ? this.icons.map(icon => icon.replace('Brand', '')) : this.icons;
-        return (h(Host, { key: '4c81ff12c46582623d226e8a7f3078ff279bc8ae' }, icons.map((icon, index) => {
+        return (h(Host, { key: '687a32dfbceec5b1544c695bc4e8ffbcf094a384' }, icons.map((icon, index) => {
             const isIcon = isOfTypeIconType(icon);
             return (h("span", { part: "icon-container", class: {
                     'icon-container': true,
@@ -14290,6 +14719,7 @@ const CpslInput = class {
         this.onFocus = (ev) => {
             this.hasFocus = true;
             this.focusedValue = this.value;
+            this.autoselect && ev.target.select();
             this.cpslFocus.emit(ev);
         };
         this.onPaste = (ev) => {
@@ -14322,6 +14752,7 @@ const CpslInput = class {
         this.autocorrect = 'off';
         this.noAutoDisable = undefined;
         this.autofocus = false;
+        this.autoselect = false;
         this.disabled = false;
         this.contrastText = false;
         this.enterkeyhint = undefined;
@@ -14454,7 +14885,7 @@ const CpslInput = class {
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: '1eb8d3755e662a13cbbaf75b700631a6d6934004', class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.focusedValue) || Boolean(this.value), 'contrast-text': this.contrastText } }, this.label && (h("label", { key: '0560cd807a98a1723cfd95631305329e8ed6a8d1', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: 'd6d9a3afdea3aa69d448b8272a083a6f670421a7', class: { 'input-container': true, 'error-container': Boolean(this.errorText) } }, h("slot", { key: '28d274d72a481970b92e41cd3c31574f7f9c7069', name: "start" }), h("input", { key: '4d2ebafbff1b4a33e2c5f384e8adacab0f6a80ce', class: "native-input", part: "native-input", ref: input => (this.nativeInput = input), id: this.inputId, disabled: this.disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, type: this.type, defaultValue: (_a = this.value) !== null && _a !== void 0 ? _a : '', onInput: this.onInput, onChange: this.onChange, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.focusInput, onPaste: this.onPaste }), h("slot", { key: 'd06db621a70b4f4c031c2d5c9bbe554d9212b625', name: "end" })), (this.errorText || this.helperText) && (h("div", { key: '4c92057fe59e91475c7398e1957f070b63e9e941', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: 'cab25a4fbb41aa4a5837cc78cfd193184a0a138b' }, (_b = this.errorText) !== null && _b !== void 0 ? _b : this.helperText)))));
+        return (h(Host, { key: '8d75dfc67222bd22182fb3cff6889c05cf70751c', class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.focusedValue) || Boolean(this.value), 'contrast-text': this.contrastText } }, this.label && (h("label", { key: 'ea73ce1c515c2a88c29cab8d44593564e50a650f', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: '46bbee17bf7fad032ebcd4fa597c07f9e620d20b', class: { 'input-container': true, 'error-container': Boolean(this.errorText) } }, h("slot", { key: '37b906201edd459f4b6ece834738b0b0c4056686', name: "start" }), h("input", { key: '1b591e74b5b8c05551957841336544efd619f7b0', class: "native-input", part: "native-input", ref: input => (this.nativeInput = input), id: this.inputId, disabled: this.disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, type: this.type, value: (_a = this.value) !== null && _a !== void 0 ? _a : '', onInput: this.onInput, onChange: this.onChange, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.focusInput, onPaste: this.onPaste }), h("slot", { key: 'df9222be5713355a74c1597eea1268163f25c766', name: "end" })), (this.errorText || this.helperText) && (h("div", { key: '500fae4fb57eac4d3b022a2e644ae0716d2f488d', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: 'c01852200c748d7a54353199beb07a88abdda2f0' }, (_b = this.errorText) !== null && _b !== void 0 ? _b : this.helperText)))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -14484,7 +14915,7 @@ const CpslNavButtonGroup = class {
         return this.el.querySelectorAll('&> *:not(cpsl-nav-button)');
     }
     render() {
-        return (h(Host, { key: '4aa96990f1b24508533fc512cc06f5ff0911baf9' }, h("slot", { key: '3f4a145df12c37a350c2593534b7cbf3cdae6d51' })));
+        return (h(Host, { key: 'd52d419d0bcd96e2759a6a39f048f823c3d2ba69' }, h("slot", { key: '851d194ca0b7b0caef7b09420918eb4cdcbee137' })));
     }
     get el() { return getElement(this); }
 };
@@ -14522,7 +14953,7 @@ const CpslOverlay = class {
         }
     }
     render() {
-        return (h(Host, { key: 'b961b8fa9583a3d0855fff965610bdb30a6a9231', style: this.zIndexOverride ? { zIndex: `${this.zIndexOverride}` } : {} }, h("slot", { key: '0e5a866a9ef2ac37eddc6cd943ab408e482e3dbf' })));
+        return (h(Host, { key: '62199abc410f605818c392e64e0bcfc1a33ec8a5', style: this.zIndexOverride ? { zIndex: `${this.zIndexOverride}` } : {} }, h("slot", { key: 'df78ed55eac09acb15743c933ad0ee38a3d5b93a' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -14608,7 +15039,7 @@ const CpslPagination = class {
                 filteredPages.push(this.totalPages - 1);
             }
         }
-        return (h(Host, { key: '24a1919b5a936df86951901cef42104107c7f16b' }, h("cpsl-button-group", { key: 'cd9846ba915b7e4e685497d5fd93d5052d7ddda5', selectedId: `${this.currentPage}` }, h("cpsl-button", { key: '59c1c038b27f92e72cc6836ede8f7728ff69964c', class: "arrow-button", onClick: this.handlePrevClick }, h("cpsl-icon", { key: 'fc53e604c8a468a4910696679d6a26dee92d8ec3', class: { 'icon': true, 'start-icon': true }, icon: "arrowNarrow" })), filteredPages.map(page => (h("cpsl-button", { key: page, variant: "secondary", fullWidth: true, id: `${page}`, onClick: this.handlePageClick(page) }, h("cpsl-text", { variant: "bodyS" }, page + 1)))), h("cpsl-button", { key: '42db7906c429f9cb29570899d65391524a95de92', class: "arrow-button", onClick: this.handleNextClick }, h("cpsl-icon", { key: 'e7d4750e2116a7658bb60a3dd31567b581249637', class: "icon", icon: "arrowNarrow" })))));
+        return (h(Host, { key: '030d0a78198c77a243ae9996dd8192437c3c370b' }, h("cpsl-button-group", { key: 'b12f592a5cf2cdab91c82516206e4a831bdad5d6', selectedId: `${this.currentPage}` }, h("cpsl-button", { key: 'a24be555c3be19f63a5011aacac7046dbd8bdecd', class: "arrow-button", onClick: this.handlePrevClick }, h("cpsl-icon", { key: 'e82fe20b2091ede6ac99c16dfb433b47d7490293', class: { 'icon': true, 'start-icon': true }, icon: "arrowNarrow" })), filteredPages.map(page => (h("cpsl-button", { key: page, variant: "secondary", fullWidth: true, id: `${page}`, onClick: this.handlePageClick(page) }, h("cpsl-text", { variant: "bodyS" }, page + 1)))), h("cpsl-button", { key: '3d4c5c6b211a1543818746da22739df63a4afcee', class: "arrow-button", onClick: this.handleNextClick }, h("cpsl-icon", { key: 'f623fb7dc739556480bc90d1ce296baa8f5afcb0', class: "icon", icon: "arrowNarrow" })))));
     }
     static get watchers() { return {
         "currentPage": ["watchChange"]
@@ -14625,7 +15056,7 @@ const CpslPill = class {
         this.text = undefined;
     }
     render() {
-        return (h(Host, { key: '7c548025bd8f95e1bc362d48b8b18bde61bf599f' }, h("div", { key: '9d0fc1ea1f56147a153a20539f0b47cdd1b27ac7', class: "pill-container" }, h("span", { key: 'ded742a126bbd0199358ee0780edbcb543e33a3d' }, this.text))));
+        return (h(Host, { key: 'a349d2f48d6ebc223437e1a9ca125587061659dc' }, h("div", { key: '1bf3f63a8c41fb7fa662201817f5884e3c3926fd', class: "pill-container" }, h("span", { key: 'd9ba2ff7fd44d242b5ae0ee037ae6b9c85ff4834' }, this.text))));
     }
 };
 CpslPill.style = CpslPillStyle0;
@@ -14790,7 +15221,10 @@ const CpslPopover = class {
             if (!this.open && !this.disabled) {
                 this.open = true;
                 this.cpslOpen.emit();
-                this.setPosition();
+                // Using a small timeout here to ensure the popover is open before attempting to do position calculations
+                setTimeout(() => {
+                    this.setPosition();
+                }, 40);
             }
         };
         this.close = () => {
@@ -14848,7 +15282,7 @@ const CpslPopover = class {
     }
     render() {
         var _a;
-        return (h(Host, { key: '4dacecdf53095dc60e8c0b554f383b185f268488', class: {
+        return (h(Host, { key: '6128da20f003b95925bf27a6d30dfd402bcc9e82', class: {
                 'open': this.open,
                 'transform-h-left': this.transformOriginHorizontal === 'left',
                 'transform-h-center': this.transformOriginHorizontal === 'center',
@@ -14856,7 +15290,7 @@ const CpslPopover = class {
                 'transform-v-top': this.transformOriginVertical === 'top',
                 'transform-v-center': this.transformOriginVertical === 'center',
                 'transform-v-bottom': this.transformOriginVertical === 'bottom',
-            }, style: { top: `${this.positionY}px`, left: `${this.positionX}px`, width: !this.open ? '0px' : this.autoWidth ? 'auto' : `${(_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.clientWidth}px` } }, h("div", { key: '0182e8d56731f9c1d321805afdec731db869f8fb', id: "container", class: { container: true, open: this.open } }, h("slot", { key: 'bb77f0561fa9e3749a9867a6959330efe6fa47f9' }))));
+            }, style: { top: `${this.positionY}px`, left: `${this.positionX}px`, width: !this.open ? '0px' : this.autoWidth ? 'auto' : `${(_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.clientWidth}px` } }, h("div", { key: '8245c2e3184150d41de74d203f548c71578e7c5e', id: "container", class: { container: true, open: this.open } }, h("slot", { key: 'b5900e3d8b1f80e604e7c7eb63ec9a345ffe2f31' }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -19002,7 +19436,7 @@ const CpslQrCode = class {
         return this.el.shadowRoot.getElementById('qr-code');
     }
     render() {
-        return (h(Host, { key: '96d7c968c8a48732a6f39dd447f542aeabda0895' }, h("div", { key: '94309968063a64eb0d7fb8f1882d02b45e6f3c4a', id: "qr-container", class: "qr-container", style: { width: `${this.size}px`, height: `${this.size}px` } }, h("img", { key: 'fa2da4ea3b1c4538c93b69f4180f5fa10b32b9b4', id: "qr-code", class: "qr-code" }))));
+        return (h(Host, { key: '7d2e72abdbc8a7bb5dba82ae7c19d673224300ff' }, h("div", { key: '633e00d74c014fa92544b4dc7e2246c390db0796', id: "qr-container", class: "qr-container", style: { width: `${this.size}px`, height: `${this.size}px` } }, h("img", { key: '92d42de9c33b75d9fbb451e8586700c562cc385b', id: "qr-code", class: "qr-code" }))));
     }
     get el() { return getElement(this); }
 };
@@ -19023,12 +19457,12 @@ const CpslRadio = class {
         this.checked = undefined;
     }
     render() {
-        return (h(Host, { key: '4d81b183fd96250737983514d7f1bebc6fcad8cd' }, h("input", { key: '406a10e3632ad5d63ba5bc7eeee8ee6872850e27', type: "radio", checked: this.checked }), h("span", { key: '9adf7dfc9d57b9cbfd66be28e2153b9cf2ba527d', onClick: this.handleRadioClick, class: { container: true, checked: this.checked } })));
+        return (h(Host, { key: 'a0440f0feb4b7a67517d1d8278e9bcbb2c7ef764' }, h("input", { key: '54dc5c3e64777504d5c851940d785a90de2d2882', type: "radio", checked: this.checked }), h("span", { key: 'dc5d326b957993e0a14ae6827751e946e141d3e6', onClick: this.handleRadioClick, class: { container: true, checked: this.checked } })));
     }
 };
 CpslRadio.style = CpslRadioStyle0;
 
-const cpslSelectCss = ":host{--container-box-shadow:none;--container-box-shadow-color:var(--cpsl-color-select-border-placeholder);--container-border-color:var(--cpsl-color-select-border-active);--container-border-error-color:var(--cpsl-color-select-border-error);--container-background-color:var(--cpsl-color-select-surface-default);--container-background-color-disabled:var(--cpsl-color-select-surface-disabled);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-select);--container-padding-top:0px;--container-padding-bottom:0px;--container-padding-end:12px;--container-padding-start:12px;--container-height:48px;--container-gap:8px;--dropdown-margin-top:4px;--dropdown-border-width:1px;--dropdown-border-radius:var(--cpsl-border-radius-select);--dropdown-border-color:var(--cpsl-color-select-dropdown-border);--optional-label-color:var(--cpsl-color-text-secondary);--label-color:var(--cpsl-color-text-primary);--label-font-size:var(--cpsl-font-size-body-s);--label-margin-bottom:0px;--helper-text-color:var(--cpsl-color-text-secondary);--helper-text-error-color:var(--cpsl-color-text-error);--helper-text-icon-color:var(--cpsl-color-text-secondary);--helper-text-icon-error-color:var(--cpsl-color-text-error);--helper-text-icon-size:16px;--helper-text-font-size:var(--cpsl-font-size-body-xs);--helper-text-margin-top:0px;--icon-height:24px;--icon-width:24px;display:flex;flex-direction:column;gap:4px;font-family:var(--cpsl-font-family, inherit)}input{box-sizing:border-box;position:absolute;width:100%;height:100%;margin:0px;opacity:0;top:0;left:0;z-index:-1;cursor:pointer}input.disabled{cursor:default}:host(:not(.has-value)){--container-border-color:var(--cpsl-color-select-border-placeholder);--select-color:var(--cpsl-color-text-secondary)}:host(.disabled){--container-background-color:var(--container-background-color-disabled);--select-background-color:var(--select-background-color-disabled);--select-color:var(--cpsl-color-text-disabled)}:host(.focused){--container-box-shadow:0px 0px 0px 2px var(--container-box-shadow-color);--container-border-color:var(--cpsl-color-select-border-active);--container-background-color:var(--cpsl-color-select-surface-default)}.select-container{-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;height:var(--container-height);gap:var(--container-gap);cursor:pointer;border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);border-radius:var(--container-border-radius);background:var(--container-background-color);box-shadow:var(--container-box-shadow)}.error-container{border-color:var(--container-border-error-color)}.label{display:inline-block;color:var(--label-color);font-size:var(--label-font-size);font-weight:500;margin-bottom:var(--label-margin-bottom)}.optional-label{display:inline-block;color:var(--optional-label-color);font-size:var(--label-font-size);font-weight:500}.helper-text-container{display:flex;align-items:center;gap:4px;color:var(--helper-text-color);font-size:var(--helper-text-font-size);font-weight:500;margin-top:var(--helper-text-margin-top)}.helper-text-container cpsl-icon{--height:var(--helper-text-icon-size);--width:var(--helper-text-icon-size);--icon-color:var(--helper-text-icon-color)}.error-text{color:var(--helper-text-error-color)}.error-text cpsl-icon{--icon-color:var(--helper-text-icon-error-color)}.selected-container-content{flex:1}.selected-container-content.hidden{display:none}.chevron{transition:transform 0.3s ease;transform:rotate(180deg);--icon-color:var(--cpsl-color-text-disabled);--height:var(--icon-height);--width:var(--icon-width)}.chevron.open{transform:rotate(0deg);--icon-color:var(--cpsl-color-text-primary)}.chevron.has-value{--icon-color:var(--cpsl-color-text-primary)}.selected-text{color:var(--cpsl-color-text-primary)}.selected-text.placeholder{color:var(--cpsl-color-text-disabled)}.dropdown{margin-top:var(--dropdown-margin-top);border-style:solid;border-width:var(--dropdown-border-width);border-color:var(--dropdown-border-color);border-radius:var(--dropdown-border-radius);overflow:hidden}.dropdown ::slotted(*:last-child){--container-border-width:0px}.dropdown-inner{overflow:auto;scrollbar-width:thin}.dropdown-inner ::slotted(cpsl-input){padding:8px}.search-container{position:sticky;top:0px;padding:8px;background-color:var(--cpsl-color-select-surface-default)}";
+const cpslSelectCss = ":host{--container-box-shadow:none;--container-box-shadow-color:var(--cpsl-color-select-border-placeholder);--container-border-color:var(--cpsl-color-select-border-active);--container-border-error-color:var(--cpsl-color-select-border-error);--container-background-color:var(--cpsl-color-select-surface-default);--container-background-color-disabled:var(--cpsl-color-select-surface-disabled);--container-border-width:1px;--container-border-radius:var(--cpsl-border-radius-select);--container-padding-top:0px;--container-padding-bottom:0px;--container-padding-end:12px;--container-padding-start:12px;--container-height:48px;--container-gap:8px;--dropdown-margin-top:4px;--dropdown-border-width:1px;--dropdown-border-radius:var(--cpsl-border-radius-select);--dropdown-border-color:var(--cpsl-color-select-dropdown-border);--optional-label-color:var(--cpsl-color-text-secondary);--label-color:var(--cpsl-color-text-primary);--label-font-size:var(--cpsl-font-size-body-s);--label-margin-bottom:0px;--helper-text-color:var(--cpsl-color-text-secondary);--helper-text-error-color:var(--cpsl-color-text-error);--helper-text-icon-color:var(--cpsl-color-text-secondary);--helper-text-icon-error-color:var(--cpsl-color-text-error);--helper-text-icon-size:16px;--helper-text-font-size:var(--cpsl-font-size-body-xs);--helper-text-margin-top:0px;--icon-height:24px;--icon-width:24px;display:flex;flex-direction:column;gap:4px;font-family:var(--cpsl-font-family, inherit)}input{box-sizing:border-box;position:absolute;width:100%;height:100%;margin:0px;opacity:0;top:0;left:0;z-index:-1;cursor:pointer}input.disabled{cursor:default}:host(:not(.has-value)){--container-border-color:var(--cpsl-color-select-border-placeholder);--select-color:var(--cpsl-color-text-secondary)}:host(.disabled){--container-background-color:var(--container-background-color-disabled);--select-background-color:var(--select-background-color-disabled);--select-color:var(--cpsl-color-text-disabled)}:host(.focused){--container-box-shadow:0px 0px 0px 2px var(--container-box-shadow-color);--container-border-color:var(--cpsl-color-select-border-active);--container-background-color:var(--cpsl-color-select-surface-default)}.select-container{-webkit-padding-start:var(--container-padding-start);padding-inline-start:var(--container-padding-start);-webkit-padding-end:var(--container-padding-end);padding-inline-end:var(--container-padding-end);padding-top:var(--container-padding-top);padding-bottom:var(--container-padding-bottom);position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;height:var(--container-height);gap:var(--container-gap);cursor:pointer;border-style:solid;border-width:var(--container-border-width);border-color:var(--container-border-color);border-radius:var(--container-border-radius);background:var(--container-background-color);box-shadow:var(--container-box-shadow)}.error-container{border-color:var(--container-border-error-color)}.label{display:inline-block;color:var(--label-color);font-size:var(--label-font-size);font-weight:500;margin-bottom:var(--label-margin-bottom)}.optional-label{display:inline-block;color:var(--optional-label-color);font-size:var(--label-font-size);font-weight:500}.helper-text-container{display:flex;align-items:center;gap:4px;color:var(--helper-text-color);font-size:var(--helper-text-font-size);font-weight:500;margin-top:var(--helper-text-margin-top)}.helper-text-container cpsl-icon{--height:var(--helper-text-icon-size);--width:var(--helper-text-icon-size);--icon-color:var(--helper-text-icon-color)}.error-text{color:var(--helper-text-error-color)}.error-text cpsl-icon{--icon-color:var(--helper-text-icon-error-color)}.selected-container-content{flex:1}.selected-container-content.hidden{display:none}.chevron{transition:transform 0.3s ease;transform:rotate(180deg);--icon-color:var(--cpsl-color-text-disabled);--height:var(--icon-height);--width:var(--icon-width)}.chevron.open{transform:rotate(0deg);--icon-color:var(--cpsl-color-text-primary)}.chevron.has-value{--icon-color:var(--cpsl-color-text-primary)}.selected-text{color:var(--cpsl-color-text-primary)}.selected-text.placeholder{color:var(--cpsl-color-text-disabled)}.dropdown{margin-top:var(--dropdown-margin-top);border-style:solid;border-width:var(--dropdown-border-width);border-color:var(--dropdown-border-color);border-radius:var(--dropdown-border-radius);overflow:hidden}.dropdown ::slotted(*:last-child){--container-border-width:0px}.dropdown-inner{overflow:auto;max-height:calc(100vh - 32px);scrollbar-width:thin}.dropdown-inner ::slotted(cpsl-input){padding:8px}.search-container{position:sticky;top:0px;padding:8px;background-color:var(--cpsl-color-select-surface-default)}";
 const CpslSelectStyle0 = cpslSelectCss;
 
 const CpslSelect = class {
@@ -19093,7 +19527,9 @@ const CpslSelect = class {
         this.formatValue = undefined;
         this.helperText = undefined;
         this.id = `${this.inputId}-trigger`;
+        this.icon = 'chevronUp';
         this.label = undefined;
+        this.noIconAnimation = undefined;
         this.placeholder = undefined;
         this.required = false;
         this.selectedValue = undefined;
@@ -19124,10 +19560,10 @@ const CpslSelect = class {
     }
     render() {
         var _a, _b, _c, _d, _e;
-        return (h(Host, { key: '6a81638f5f4fc6a4904bfb01474124b5534e7515', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.selectedValue) } }, this.label && (h("label", { key: '1b1e485332bedaf9d63131a61ecedde9cc510b96', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: '2d67247a261f54a307f740623892087ddf8df59e', id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onMouseDown: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: '6b4ac55de19f37c930990f434c6c75375942b5ce', name: "selected-item" }), h("div", { key: 'd55ee9754b382167d1dda4c4f6b6b9440331e723', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: '45836ee164ea1a35e669f3953b6f413fcef138aa', class: { 'selected-text': true, 'placeholder': !this.selectedValue } }, !this.selectedValue ? ((_a = this.placeholder) !== null && _a !== void 0 ? _a : 'Select') : ((_c = (_b = this.formatValue) === null || _b === void 0 ? void 0 : _b.call(this, this.selectedValue)) !== null && _c !== void 0 ? _c : this.selectedValue)))), h("cpsl-icon", { key: 'cd12c1f52e9db3451bcc2bdc332763ab31b589f2', class: { 'chevron': true, 'open': this.popoverOpen, 'has-value': Boolean(this.selectedValue) }, icon: "chevronUp" }), h("input", { key: 'db9e60e27e935e941c9e18496fb6081c13d9ac93', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" })), (this.errorText || this.helperText) && (h("div", { key: '6322d6bbcd082a80deb2addcb5a490b2540749a4', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: 'd84673209ebace8a213866b5ba8f8ded5122fbd9' }, (_d = this.errorText) !== null && _d !== void 0 ? _d : this.helperText))), h("cpsl-popover", { key: 'ae8543628b0426d66f2c74b8c05d7fa108495c14', part: "popover", autoWidth: this.autoWidth, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '793a2efe39d096a6b60cabab4918faf275eff398', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: 'd4d1249ee84a5cad5555c1bb48b699a8c78bcebe', class: "search-container" }, h("cpsl-input", { key: '03fa4e3e71014bdd6247634eff47620a89fc1346', onClick: e => e.stopPropagation(), placeholder: (_e = this.searchPlaceholder) !== null && _e !== void 0 ? _e : 'Search', value: "", onCpslInput: e => {
+        return (h(Host, { key: '2b9aed2c27bd315180dbe84ea0fada27c841db10', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.selectedValue) } }, this.label && (h("label", { key: '1960291b282ec415da6ff925c833dcc284fd6355', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: '18a1b68bf0f44075b6561f6877c6d1d1c2a2f0b0', part: "select-container", id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onMouseDown: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: '5e08be6aebc9dad1b3c9ef289a2ed7567ee3a15e', name: "selected-item" }), h("div", { key: '9842c7277c4f7fa7c7d442cce8c33069b2424c40', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: 'afe5e9c9948691a2f18112dff1d21ae7e1d5a7cc', class: { 'selected-text': true, 'placeholder': !this.selectedValue } }, !this.selectedValue ? ((_a = this.placeholder) !== null && _a !== void 0 ? _a : 'Select') : ((_c = (_b = this.formatValue) === null || _b === void 0 ? void 0 : _b.call(this, this.selectedValue)) !== null && _c !== void 0 ? _c : this.selectedValue)))), h("cpsl-icon", { key: '7488f111c9acbe6bdc4be47c075ac502abf6c83a', part: "icon", class: { 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': Boolean(this.selectedValue) }, icon: this.icon }), h("input", { key: 'c9a5d5ed87b0a5d73e3614308e52444513287726', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" })), (this.errorText || this.helperText) && (h("div", { key: '3dbaa76a9d6c29555a2cc8434eaff632deed037e', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: '470a69fda9e2f79c94b2a15c4652a937f478f3d6' }, (_d = this.errorText) !== null && _d !== void 0 ? _d : this.helperText))), h("cpsl-popover", { key: 'e9b0325be7b95c4dd43607d85602db4e6ecd841f', part: "popover", autoWidth: this.autoWidth, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '7e92585b0fd33a8ece0d1f1c056607283f576143', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: 'bbba133e60ea9a402827da9e929696dd0f2d19a4', class: "search-container" }, h("cpsl-input", { key: '5fd037f49ce0a29eca6ce150beebe017ca1c0dec', onClick: e => e.stopPropagation(), placeholder: (_e = this.searchPlaceholder) !== null && _e !== void 0 ? _e : 'Search', value: "", onCpslInput: e => {
                 e.stopPropagation();
                 this.cpslSearchChange.emit(e.detail.value);
-            } }))), h("div", { key: '703ef09d6b630caac1573c16bbdca7d52a2e8277', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: 'd4ae08aeadc9057ec4b3c40454bf3b619b0f4e6b', name: "items" }))))));
+            } }))), h("div", { key: 'da8349c860028d188e3c17c971a5b8803ac1cc7d', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: 'b7e7e806d332025b063e47b7060167b0617fecf4', name: "items" }))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -19151,7 +19587,7 @@ const CpslSelectItem = class {
         this.value = undefined;
     }
     render() {
-        return (h(Host, { key: '118f17cd1cf7f23d9d9bb8d1fd6b882f7d4b31d9' }, h("div", { key: '77735d41c9506decec079d229890f9bb40400fe3', part: "outer-container", class: "outer-container", onClick: this.handleItemClick }, h("div", { key: 'fe1d074764d4ac9e819bbc13071cd15475942580', part: "inner-container", class: { 'inner-container': true, 'selected': this.selected } }, h("slot", { key: '168bc2ed66c9afb18f1355a52d164776e6833453' })))));
+        return (h(Host, { key: '532ed86577783bc61c40a18de178e63d16cf24c1' }, h("div", { key: 'ebf183f51dc2082e853cda6f490ab1b1a2c72f99', part: "outer-container", class: "outer-container", onClick: this.handleItemClick }, h("div", { key: '1e2c94c4e4a61638fc7a0439a36672bc22f47d28', part: "inner-container", class: { 'inner-container': true, 'selected': this.selected } }, h("slot", { key: 'a5c01c9f324912eff3c7958370bbec29050e4f4a' })))));
     }
 };
 CpslSelectItem.style = CpslSelectItemStyle0;
@@ -19287,7 +19723,7 @@ const CpslSlideButton = class {
         return this.el.shadowRoot.getElementById('end-icon');
     }
     render() {
-        return (h(Host, { key: 'd113db26952e865b214817123a2c5311ea40c7f2' }, h("div", { key: '5009f80827f116a04a2c764164bc8e6ab53f7b09', id: "slider-container", class: "slider-container" }, h("div", { key: '498c19112ce88898e382af17b1a3b726bf6bab37', id: "start-slider-container-background", class: { 'start-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: '387a3b044c0e9425426a96c5485b43c3dc17732a', id: "end-slider-container-background", class: { 'end-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: '2c7fcbb1ff171096e46520b7877b90eaad97f6dc', id: "slider", class: { slider: true, disabled: this.disabled } }, h("cpsl-icon", { key: '209bfe654df6c612b1d2e55245f89e921192a0a4', id: "start-icon", class: { 'start-icon': true, 'icon': true }, icon: this.startIcon }), h("cpsl-icon", { key: 'cf1fb641be67535769983285d42f78dac09b5c04', id: "end-icon", class: { 'end-icon': true, 'icon': true }, icon: this.endIcon })), h("span", { key: '929a0f8a60dcb0b7348854a851ff124416dcae89', id: "start-text", class: { 'start-text': true, 'disabled': this.disabled } }, this.startText), h("span", { key: '88f760b8b01b79507cdd9802b3bd895b51cd4c9a', id: "end-text", class: "end-text" }, this.endText))));
+        return (h(Host, { key: 'c396198f7247a40fb9ca03009fdde7478e25ec57' }, h("div", { key: 'ffc4f665dfcf595a6e332fe5864e0194543da59d', id: "slider-container", class: "slider-container" }, h("div", { key: 'f2834903ec83abffd252bdbb8918f53304840f55', id: "start-slider-container-background", class: { 'start-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: 'cb315a8ce6b822661b01ecf40d852c77fee33fa3', id: "end-slider-container-background", class: { 'end-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: '3179fcebe1513a2fa76ef53907a5876ee93756dd', id: "slider", class: { slider: true, disabled: this.disabled } }, h("cpsl-icon", { key: 'fe5246cc71fd8c45578fe6e72b4da9280fda04b3', id: "start-icon", class: { 'start-icon': true, 'icon': true }, icon: this.startIcon }), h("cpsl-icon", { key: '186789c69f11dc5f47de5daa12de414dc339d86f', id: "end-icon", class: { 'end-icon': true, 'icon': true }, icon: this.endIcon })), h("span", { key: 'e385a9bddb2874863305a7a32e5dc89770a44bac', id: "start-text", class: { 'start-text': true, 'disabled': this.disabled } }, this.startText), h("span", { key: 'f2dc440ff6f3e72bba50c949cc8abcdcc4f94566', id: "end-text", class: "end-text" }, this.endText))));
     }
     get el() { return getElement(this); }
 };
@@ -19303,11 +19739,11 @@ const CpslSpinner = class {
         this.speed = 1;
     }
     render() {
-        return (h(Host, { key: '3c1bd9555de17d17db2b967bec28640b92c84e0b', style: {
+        return (h(Host, { key: '5435b4e754383ad990e2fbf292c547fdff6a3c93', style: {
                 height: `${this.size}px`,
                 width: `${this.size}px`,
                 ['--bar-width']: `${this.size * 0.12}px`,
-            } }, h("div", { key: 'ce908c40d3c48e4c2817baa930708c7ef5bca104', class: "loader" })));
+            } }, h("div", { key: '4cf6ac734c6c20fd4e5343ff2b30718f1ec0820a', class: "loader" })));
     }
 };
 CpslSpinner.style = CpslSpinnerStyle0;
@@ -19325,12 +19761,12 @@ const CpslSwitch = class {
         this.checked = undefined;
     }
     render() {
-        return (h(Host, { key: '9f3df7dc3a9fdee1f7ad04dfafa41ee64310d4e5' }, h("input", { key: 'f63bc6b3feda7d6c043b5c5763c6c49b98445b76', type: "checkbox", checked: this.checked }), h("span", { key: 'f31f4df2854847231b18d9528c383e1d582aac32', onClick: this.handleSwitchClick, class: { container: true, checked: this.checked } }, h("span", { key: 'b77e55f0a52c64cf69a966d7617baf638d307509', class: { thumb: true, checked: this.checked } }))));
+        return (h(Host, { key: '80395b6f36c5653c725a69883098d2822cb6d420' }, h("input", { key: 'b9f74ffce1f02b8efa28b47f60c82e549a87bd09', type: "checkbox", checked: this.checked }), h("span", { key: '1f0763f6aaca5f55a66620a59444a907dc837360', onClick: this.handleSwitchClick, class: { container: true, checked: this.checked } }, h("span", { key: '1804cbae3ea10091952722c6bfb50c6dd518fe0b', class: { thumb: true, checked: this.checked } }))));
     }
 };
 CpslSwitch.style = CpslSwitchStyle0;
 
-const cpslTabCss = ":host{--tab-color:var(--cpsl-color-text-secondary);--tab-gap:2px;--tab-icon-height:16px;--tab-icon-width:16px;padding-top:var(--tab-top-padding);padding-bottom:var(--tab-bottom-padding);padding-left:var(--tab-left-padding);padding-right:var(--tab-right-padding);display:flex;flex:1 1 auto;align-items:center;cursor:pointer;z-index:10}:host ::slotted([slot=start]){--icon-color:var(--tab-color);--height:var(--tab-icon-height);--width:var(--tab-icon-width)}:host ::slotted([slot=end]){--icon-color:var(--tab-color);--height:var(--tab-icon-height);--width:var(--tab-icon-width)}:host(.selected){--tab-color:var(--cpsl-color-text-primary)}.tab-container{align-items:center;overflow:hidden;width:100%;text-overflow:ellipsis;text-align:center;white-space:nowrap;font-weight:500;color:var(--tab-color);display:flex;gap:var(--tab-gap)}.content{flex:1 1 auto}";
+const cpslTabCss = ":host{--tab-color:var(--cpsl-color-text-secondary);--tab-gap:2px;--tab-icon-height:16px;--tab-icon-width:16px;display:flex;flex:1 1 auto;align-items:center;cursor:pointer;z-index:10}:host ::slotted([slot=start]){--icon-color:var(--tab-color);--height:var(--tab-icon-height);--width:var(--tab-icon-width)}:host ::slotted([slot=end]){--icon-color:var(--tab-color);--height:var(--tab-icon-height);--width:var(--tab-icon-width)}:host(.selected){--tab-color:var(--cpsl-color-text-primary)}.tab-container{align-items:center;overflow:hidden;width:100%;text-overflow:ellipsis;text-align:center;white-space:nowrap;font-weight:500;color:var(--tab-color);display:flex;gap:var(--tab-gap);padding-top:var(--tab-top-padding);padding-bottom:var(--tab-bottom-padding);padding-left:var(--tab-left-padding);padding-right:var(--tab-right-padding)}.content{flex:1 1 auto}";
 const CpslTabStyle0 = cpslTabCss;
 
 const CpslTab = class {
@@ -19365,7 +19801,7 @@ const CpslTab = class {
         }
     }
     render() {
-        return (h(Host, { key: '0db72b4aafeb1dcb0f9eb79adfc05ed9d8cfceee', class: { selected: this.selected }, onClick: this.onTabClicked }, h("div", { key: '62026b52a408de0eeea4b5bd93fa48d0e56b54e7', class: { 'tab-container': true } }, h("slot", { key: '2755cbce3b4911c7dd691f0e7bbbabe91d0314a1', name: "start" }), h("div", { key: '0a3533933c1f4b148f51c9a3ec16cc043b0626be', class: "content" }, h("slot", { key: 'a4952347ee3850ed6cf52917787b29e35fddabd5' })), h("slot", { key: 'a77a1b0b1f0ff5238d42d3b185f16799532508be', name: "end" }))));
+        return (h(Host, { key: '028bc025620e157f36758d6af5893b5067d42e22', class: { selected: this.selected }, onClick: this.onTabClicked }, h("div", { key: '6158adb9c6f477fba3b00fcfcc0b1c3717b8158e', class: { 'tab-container': true } }, h("slot", { key: 'e95d380390aacbe7e4630c32170a0bc7c113d871', name: "start" }), h("div", { key: '11905c7fa6cec1dec116738aa3fa35afc960ec87', class: "content" }, h("slot", { key: 'b9b157aa480845a5040fdd8d84499d9e00ed9a43' })), h("slot", { key: '0b5cff6fa6e070254205d7367a92dbae3cec1d3a', name: "end" }))));
     }
     get el() { return getElement(this); }
 };
@@ -19423,7 +19859,7 @@ const CpslTable = class {
         return this.el.shadowRoot.getElementById('footer-container');
     }
     render() {
-        return (h(Host, { key: '7e73151d02a5fefb247f46cb8432dd444aa51f64' }, h("cpsl-card", { key: 'a56fc2c5af882cf639678aff59f48bc5b214cb20', part: "table-container", style: { position: 'relative' } }, h("div", { key: '2c3b2adbc4f9e53b0f5bb6f54fd57274a3c65ad8', id: "header-container", class: { 'container-header': true, 'shown': Boolean(this.containerHeaderEl) } }, h("slot", { key: '081d09a72e3466abddc1044a55efb673f3f31d65', name: "header" })), h("div", { key: 'f1eb55896339f7cf76118674ef4bb5eeecc361de', id: "content-container", class: { 'content': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll }, part: "content" }, h("slot", { key: 'a97dbb166f96995cb427b389d11099e0142df7c6', name: "content" })), this.headerEl && this.contentContainerEl && this.footerEl && (h("div", { key: '2af7ffba6f244e6fde703815931f0eba2c8913bf', style: { top: `${this.headerEl.clientHeight + 2}px`, height: `${this.contentContainerEl.clientHeight}px` }, class: { 'overlay': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll } })), h("div", { key: '83a7124205502fbcf9dcabbf898b3b713f544b2a', id: "footer-container", class: { 'container-footer': true, 'shown': Boolean(this.containerFooterEl) } }, h("slot", { key: '8b2e34e79eb1f5b90a2ddabcc280f7f3e14f7fc7', name: "footer" })))));
+        return (h(Host, { key: '144ebe0917ce215a128b6653c8ed47138be7b319' }, h("cpsl-card", { key: '8197bc383734a332a2e0ee7221a1990ba20b1f84', part: "table-container", style: { position: 'relative' } }, h("div", { key: 'dd8d0026515ce96a848ae4a6cdf5cdab7bb7ddf2', id: "header-container", class: { 'container-header': true, 'shown': Boolean(this.containerHeaderEl) } }, h("slot", { key: '1b5a2cbae0fa49bb0b5b4d89fef4b44ce8a46439', name: "header" })), h("div", { key: 'e22bd3b94832ded10fe7b152d2d0c68165853529', id: "content-container", class: { 'content': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll }, part: "content" }, h("slot", { key: 'f1bbfc01f1c25f820d9d4846ac1a7f64c21ee03b', name: "content" })), this.headerEl && this.contentContainerEl && this.footerEl && (h("div", { key: 'ad1e130185b6621b763892ae693ffab1d6243ae5', style: { top: `${this.headerEl.clientHeight + 2}px`, height: `${this.contentContainerEl.clientHeight}px` }, class: { 'overlay': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll } })), h("div", { key: 'fb8b26f5d97b3965c50676b0541a14f21c675fe6', id: "footer-container", class: { 'container-footer': true, 'shown': Boolean(this.containerFooterEl) } }, h("slot", { key: '70a40dfe9bb80e3c825c895d12cb971467898e6a', name: "footer" })))));
     }
     get el() { return getElement(this); }
 };
@@ -19491,7 +19927,7 @@ const CpslTabs = class {
         // Get border width as a number
         const tabsBorderWidth = +getComputedStyle(this.el).getPropertyValue('--tabs-border-width').slice(0, -2);
         const selectedTabRect = this.selectedTabRect;
-        return (h(Host, { key: 'a7b201091e8e803fdb6179883382c951cc88a888', class: { 'full-width': this.fullWidth }, onCpslTabButtonClick: this.onTabClicked }, h("div", { key: '7370e97866ec851b2e26231e88db112fc41dd1fd', class: "tabs-container" }, h("slot", { key: 'd2638cefef452fb3da3e0b6f7a5b852506a8e213' }), h("div", { key: 'ff20d8ff3baeb36f69cbc4a88a91639129642889', class: { slider: true, loaded: this.loaded }, style: { width: `${selectedTabRect.width - 8}px`, left: `${selectedTabRect.x - tabsPosition.x - tabsBorderWidth}px` } }))));
+        return (h(Host, { key: '88426913982f1fe2abeefcd1671139b2804222bd', class: { 'full-width': this.fullWidth }, onCpslTabButtonClick: this.onTabClicked }, h("div", { key: '6dea5803e0c9de3ecd8207ec636f5a25741e277e', class: "tabs-container" }, h("slot", { key: '4cbd63beee77016213cda4f151934a4b4cbffeb3' }), h("div", { key: '636d1a79183a24526b013983fa5bb0a45d55d246', class: { slider: true, loaded: this.loaded }, style: { width: `${selectedTabRect.width - 8}px`, left: `${selectedTabRect.x - tabsPosition.x - tabsBorderWidth}px` } }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -19505,43 +19941,45 @@ const getTab = (tabs, tab) => {
 };
 CpslTabs.style = CpslTabsStyle0;
 
-const cpslTextCss = ":host{font-family:var(--cpsl-font-family, inherit);color:var(--cpsl-color-text-primary);padding:0px;margin:0px;display:block}:host::-moz-selection{color:var(--cpsl-color-text-inverted) !important;background:var(--cpsl-color-background-64) !important}:host::selection{color:var(--cpsl-color-text-inverted) !important;background:var(--cpsl-color-background-64) !important}:host p,h1,h2,h3,h4,h5,h6{padding:0px;margin:0px;font-weight:inherit;font-size:inherit;letter-spacing:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smooth:never}:host(.primary){color:var(--cpsl-color-text-primary)}:host(.secondary){color:var(--cpsl-color-text-secondary)}:host(.tertiary){color:var(--cpsl-color-text-tertiary)}:host(.subtle){color:var(--cpsl-color-text-subtle)}:host(.inverted){color:var(--cpsl-color-text-inverted)}:host(.error){color:var(--cpsl-color-text-error)}:host(.contrast){color:var(--cpsl-color-text-contrast)}:host(.medium){font-weight:500}:host(.semi-bold){font-weight:600}:host(.bold){font-weight:700}:host(.body-2xs){font-size:var(--cpsl-font-size-body-2xs)}:host(.body-xs){font-size:var(--cpsl-font-size-body-xs)}:host(.body-s){font-size:var(--cpsl-font-size-body-s);line-height:142.857%}:host(.body-m){font-size:var(--cpsl-font-size-body-m);line-height:150%}:host(.body-l){font-size:var(--cpsl-font-size-body-l);line-height:140%}:host(.body-xl){font-size:var(--cpsl-font-size-body-xl)}:host(.heading-xs){font-size:var(--cpsl-font-size-heading-xs)}:host(.heading-s){font-size:var(--cpsl-font-size-heading-s)}:host(.heading-m){font-size:var(--cpsl-font-size-heading-m);letter-spacing:-0.4px}:host(.heading-l){font-size:var(--cpsl-font-size-heading-l);letter-spacing:-1.12px}:host(.heading-xl){font-size:var(--cpsl-font-size-heading-xl);letter-spacing:-1.28px}:host(.heading-2xl){font-size:var(--cpsl-font-size-heading-2xl);letter-spacing:-1.44px}";
+const cpslTextCss = ":host{display:block}:host p,h1,h2,h3,h4,h5,h6{font-family:var(--cpsl-font-family, inherit);padding:0px;margin:0px;font-weight:inherit;font-size:inherit;letter-spacing:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smooth:never}:host p::-moz-selection,h1::-moz-selection,h2::-moz-selection,h3::-moz-selection,h4::-moz-selection,h5::-moz-selection,h6::-moz-selection{color:var(--cpsl-color-text-inverted) !important;background:var(--cpsl-color-background-64) !important}:host p::selection,h1::selection,h2::selection,h3::selection,h4::selection,h5::selection,h6::selection{color:var(--cpsl-color-text-inverted) !important;background:var(--cpsl-color-background-64) !important}:host p.primary,h1.primary,h2.primary,h3.primary,h4.primary,h5.primary,h6.primary{color:var(--cpsl-color-text-primary)}:host p.secondary,h1.secondary,h2.secondary,h3.secondary,h4.secondary,h5.secondary,h6.secondary{color:var(--cpsl-color-text-secondary)}:host p.tertiary,h1.tertiary,h2.tertiary,h3.tertiary,h4.tertiary,h5.tertiary,h6.tertiary{color:var(--cpsl-color-text-tertiary)}:host p.subtle,h1.subtle,h2.subtle,h3.subtle,h4.subtle,h5.subtle,h6.subtle{color:var(--cpsl-color-text-subtle)}:host p.inverted,h1.inverted,h2.inverted,h3.inverted,h4.inverted,h5.inverted,h6.inverted{color:var(--cpsl-color-text-inverted)}:host p.error,h1.error,h2.error,h3.error,h4.error,h5.error,h6.error{color:var(--cpsl-color-text-error)}:host p.contrast,h1.contrast,h2.contrast,h3.contrast,h4.contrast,h5.contrast,h6.contrast{color:var(--cpsl-color-text-contrast)}:host p.medium,h1.medium,h2.medium,h3.medium,h4.medium,h5.medium,h6.medium{font-weight:500}:host p.semi-bold,h1.semi-bold,h2.semi-bold,h3.semi-bold,h4.semi-bold,h5.semi-bold,h6.semi-bold{font-weight:600}:host p.bold,h1.bold,h2.bold,h3.bold,h4.bold,h5.bold,h6.bold{font-weight:700}:host p.body-2xs,h1.body-2xs,h2.body-2xs,h3.body-2xs,h4.body-2xs,h5.body-2xs,h6.body-2xs{font-size:var(--cpsl-font-size-body-2xs)}:host p.body-xs,h1.body-xs,h2.body-xs,h3.body-xs,h4.body-xs,h5.body-xs,h6.body-xs{font-size:var(--cpsl-font-size-body-xs)}:host p.body-s,h1.body-s,h2.body-s,h3.body-s,h4.body-s,h5.body-s,h6.body-s{font-size:var(--cpsl-font-size-body-s);line-height:142.857%}:host p.body-m,h1.body-m,h2.body-m,h3.body-m,h4.body-m,h5.body-m,h6.body-m{font-size:var(--cpsl-font-size-body-m);line-height:150%}:host p.body-l,h1.body-l,h2.body-l,h3.body-l,h4.body-l,h5.body-l,h6.body-l{font-size:var(--cpsl-font-size-body-l);line-height:140%}:host p.body-xl,h1.body-xl,h2.body-xl,h3.body-xl,h4.body-xl,h5.body-xl,h6.body-xl{font-size:var(--cpsl-font-size-body-xl)}:host p.heading-xs,h1.heading-xs,h2.heading-xs,h3.heading-xs,h4.heading-xs,h5.heading-xs,h6.heading-xs{font-size:var(--cpsl-font-size-heading-xs)}:host p.heading-s,h1.heading-s,h2.heading-s,h3.heading-s,h4.heading-s,h5.heading-s,h6.heading-s{font-size:var(--cpsl-font-size-heading-s)}:host p.heading-m,h1.heading-m,h2.heading-m,h3.heading-m,h4.heading-m,h5.heading-m,h6.heading-m{font-size:var(--cpsl-font-size-heading-m);letter-spacing:-0.4px}:host p.heading-l,h1.heading-l,h2.heading-l,h3.heading-l,h4.heading-l,h5.heading-l,h6.heading-l{font-size:var(--cpsl-font-size-heading-l);letter-spacing:-1.12px}:host p.heading-xl,h1.heading-xl,h2.heading-xl,h3.heading-xl,h4.heading-xl,h5.heading-xl,h6.heading-xl{font-size:var(--cpsl-font-size-heading-xl);letter-spacing:-1.28px}:host p.heading-2xl,h1.heading-2xl,h2.heading-2xl,h3.heading-2xl,h4.heading-2xl,h5.heading-2xl,h6.heading-2xl{font-size:var(--cpsl-font-size-heading-2xl);letter-spacing:-1.44px}";
 const CpslTextStyle0 = cpslTextCss;
 
+const TEXT_EL_PART = 'text-element';
 const CpslText = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.getContent = ({ classes, }) => {
+            switch (this.variant) {
+                case 'headingXS': {
+                    return (h("h6", { class: classes, part: TEXT_EL_PART }, h("slot", null)));
+                }
+                case 'headingS': {
+                    return (h("h5", { class: classes, part: TEXT_EL_PART }, h("slot", null)));
+                }
+                case 'headingM': {
+                    return (h("h4", { class: classes, part: TEXT_EL_PART }, h("slot", null)));
+                }
+                case 'headingL': {
+                    return (h("h3", { class: classes, part: TEXT_EL_PART }, h("slot", null)));
+                }
+                case 'headingXL': {
+                    return (h("h2", { class: classes, part: TEXT_EL_PART }, h("slot", null)));
+                }
+                case 'heading2XL': {
+                    return (h("h1", { class: classes, part: TEXT_EL_PART }, h("slot", null)));
+                }
+                default: {
+                    return (h("p", { class: classes, part: TEXT_EL_PART }, h("slot", null)));
+                }
+            }
+        };
         this.color = 'primary';
         this.variant = 'bodyM';
         this.weight = 'regular';
     }
-    get Content() {
-        switch (this.variant) {
-            case 'headingXS': {
-                return (h("h6", null, h("slot", null)));
-            }
-            case 'headingS': {
-                return (h("h5", null, h("slot", null)));
-            }
-            case 'headingM': {
-                return (h("h4", null, h("slot", null)));
-            }
-            case 'headingL': {
-                return (h("h3", null, h("slot", null)));
-            }
-            case 'headingXL': {
-                return (h("h2", null, h("slot", null)));
-            }
-            case 'heading2XL': {
-                return (h("h1", null, h("slot", null)));
-            }
-            default: {
-                return (h("p", null, h("slot", null)));
-            }
-        }
-    }
     render() {
-        return (h(Host, { key: '51c48bf366ab1bc846c81c605abdca047b586abf', class: {
+        return (h(Host, { key: '4e5d967b96ae69553f1826a31cd0baf84735cdb0' }, this.getContent({
+            classes: {
                 // COLORS
                 'primary': this.color === 'primary',
                 'secondary': this.color === 'secondary',
@@ -19567,7 +20005,8 @@ const CpslText = class {
                 'heading-l': this.variant === 'headingL',
                 'heading-xl': this.variant === 'headingXL',
                 'heading-2xl': this.variant === 'heading2XL',
-            } }, this.Content));
+            },
+        })));
     }
 };
 CpslText.style = CpslTextStyle0;
@@ -19582,7 +20021,7 @@ const CpslTileButton = class {
         this.icon = undefined;
     }
     render() {
-        return (h(Host, { key: '9b7604660ea591bc8d71208e94e0a40f9b48788a' }, h("button", { key: 'b90ac28749497785e2248900961b743681ac4540', class: "button-native" }, h("cpsl-icon", { key: 'ae19d819c00852f4b46da2d5bec2d26bd6327854', exportparts: "icon", src: this.src, icon: this.icon }), h("slot", { key: '346b407b513dd42fdf09d5361e79e071a289c4d3' }))));
+        return (h(Host, { key: 'dabee9c05e67f923fd4d8c88eac28a8b9efed9d4' }, h("button", { key: '2db84264a91bf9a58dea0fc414ef27f36f3464dd', class: "button-native" }, h("cpsl-icon", { key: 'bf29fece3a23fefc5856deab7fc8e3b7a57ce162', exportparts: "icon", src: this.src, icon: this.icon }), h("slot", { key: '5ef7bcf22ddbeb498576d03813b6594554f1a10f' }))));
     }
 };
 CpslTileButton.style = CpslTileButtonStyle0;