@getpara/core-components 2.10.0 → 2.12.0

package/dist/cjs/loader.cjs.js

@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["cpsl-hero.cjs",[[1,"cpsl-hero",{"height":[2],"hideFadeOut":[4,"hide-fade-out"],"variant":[513],"title":[513],"subtitle":[513],"withDefaultTheme":[4,"with-default-theme"]}]]],["cpsl-modal-v2.cjs",[[1,"cpsl-modal-v2",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"elevated":[4],"noOverlay":[4,"no-overlay"],"open":[4],"zIndexOverride":[2,"z-index-override"]},null,{"open":["toggleHeight"]}]]],["cpsl-nav-button.cjs",[[1,"cpsl-nav-button",{"disabled":[516],"exactMainRouteMatch":[4,"exact-main-route-match"],"exactSubRouteMatch":[4,"exact-sub-route-match"],"route":[1],"subRoutes":[16],"path":[1]}]]],["cpsl-col.cjs",[[1,"cpsl-col",{"align":[1],"justify":[1],"gap":[8],"offset":[1],"offsetXs":[1,"offset-xs"],"offsetSm":[1,"offset-sm"],"offsetMd":[1,"offset-md"],"offsetLg":[1,"offset-lg"],"offsetXl":[1,"offset-xl"],"pull":[1],"pullXs":[1,"pull-xs"],"pullSm":[1,"pull-sm"],"pullMd":[1,"pull-md"],"pullLg":[1,"pull-lg"],"pullXl":[1,"pull-xl"],"push":[1],"pushXs":[1,"push-xs"],"pushSm":[1,"push-sm"],"pushMd":[1,"push-md"],"pushLg":[1,"push-lg"],"pushXl":[1,"push-xl"],"size":[1],"sizeXs":[1,"size-xs"],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"],"sizeXl":[1,"size-xl"]},[[9,"resize","onResize"]]]]],["cpsl-grid.cjs",[[1,"cpsl-grid",{"fixed":[4]}]]],["cpsl-identicon.cjs",[[1,"cpsl-identicon",{"hash":[1],"size":[1],"variant":[1],"arcWidth":[1,"arc-width"]}]]],["cpsl-info-box.cjs",[[1,"cpsl-info-box"]]],["cpsl-row.cjs",[[1,"cpsl-row",{"col":[4],"align":[1],"justify":[1],"gap":[8]}]]],["cpsl-alert_34.cjs",[[1,"cpsl-pagination",{"initialPage":[2,"initial-page"],"totalPages":[2,"total-pages"],"visiblePages":[1026,"visible-pages"],"currentPage":[32]},null,{"currentPage":["watchChange"]}],[1,"cpsl-select",{"anchorElId":[1,"anchor-el-id"],"autoWidth":[4,"auto-width"],"alignCenter":[4,"align-center"],"disabled":[4],"dropdownMaxHeight":[2,"dropdown-max-height"],"errorText":[1,"error-text"],"formatValue":[16],"helperText":[1,"helper-text"],"id":[1],"icon":[1],"label":[1],"multiple":[4],"noIconAnimation":[4,"no-icon-animation"],"placeholder":[1],"required":[4],"selectedValue":[1,"selected-value"],"showFormattedSelectedItem":[4,"show-formatted-selected-item"],"showOptionalLabel":[4,"show-optional-label"],"showSearch":[4,"show-search"],"searchPlaceholder":[1,"search-placeholder"],"selectedItemColor":[1,"selected-item-color"],"selectedItemVariant":[1,"selected-item-variant"],"selectedItemWeight":[1,"selected-item-weight"],"anchorEl":[32],"hasFocus":[32],"popoverOpen":[32],"hasSelectedItem":[32]},[[0,"cpslSelectItemClick","selectItemClickHandler"],[0,"cpslOpen","onPopoverOpen"],[0,"cpslClose","onPopoverClose"]],{"selectedValue":["onValueChange","handleValueChange"]}],[1,"cpsl-file-upload",{"disabled":[516],"errorText":[1,"error-text"],"externalFilename":[1,"external-filename"],"externalSrc":[1,"external-src"],"fileTypes":[16],"helperText":[1,"helper-text"],"label":[1],"required":[4],"showOptionalLabel":[4,"show-optional-label"],"uploadFile":[16],"file":[32],"dragOver":[32],"dragError":[32],"isUploading":[32],"uploadError":[32]}],[1,"cpsl-auth-modal",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"noOverlay":[4,"no-overlay"],"open":[4],"zIndexOverride":[2,"z-index-override"],"hasFooter":[32],"isMobile":[32]},null,{"open":["toggleModal"]}],[1,"cpsl-alert",{"icon":[1],"noIcon":[4,"no-icon"],"variant":[1],"filled":[4]}],[1,"cpsl-checkbox",{"checked":[4]}],[1,"cpsl-code-input",{"code":[1025],"errorText":[1,"error-text"],"helperText":[1,"helper-text"],"length":[2],"type":[1]},null,{"code":["watchCodeProp"]}],[1,"cpsl-drawer",{"anchor":[1],"anchorPosition":[2,"anchor-position"],"noOverlay":[4,"no-overlay"],"open":[4],"size":[8],"transitionDuration":[2,"transition-duration"],"transitionFunction":[1,"transition-function"],"variant":[1],"zIndexOverride":[2,"z-index-override"],"closedAnchorPosition":[32],"showTransition":[32]}],[1,"cpsl-icon-group",{"expandFrom":[1,"expand-from"],"disabled":[4],"icons":[16],"isHovered":[32]}],[1,"cpsl-slide-button",{"disabled":[4],"endIcon":[1,"end-icon"],"endText":[1,"end-text"],"startIcon":[1,"start-icon"],"startText":[1,"start-text"]}],[1,"cpsl-table",{"hasHorizontalScroll":[32],"hasVerticalScroll":[32]}],[1,"cpsl-tile-button",{"disabled":[516],"src":[1],"icon":[1]}],[1,"cpsl-app-bar",{"height":[2],"position":[1],"zIndexOverride":[2,"z-index-override"]}],[1,"cpsl-avatar",{"alt":[1],"src":[1],"size":[1],"variant":[1]}],[1,"cpsl-divider"],[1,"cpsl-dropdown",{"width":[1],"hasCpslSearch":[4,"has-cpsl-search"],"items":[16],"selectedItem":[1040],"isOpen":[32],"searchQuery":[32],"filteredItems":[32]},[[9,"resize","handleResize"]],{"selectedItem":["handleSelectedItemChange"],"isOpen":["handleOpenChange"]}],[1,"cpsl-nav-button-group"],[1,"cpsl-pill",{"text":[1]}],[1,"cpsl-progress-indicator",{"totalSteps":[2,"total-steps"],"step":[2]}],[1,"cpsl-qr-code",{"url":[1],"imageSrc":[1,"image-src"],"size":[2],"icon":[1]}],[1,"cpsl-radio",{"checked":[4]}],[1,"cpsl-select-item",{"selected":[4],"value":[1]}],[1,"cpsl-switch",{"checked":[4]}],[1,"cpsl-tab",{"selected":[4],"tab":[1]},[[8,"cpslTabsChanged","onTabsChanged"],[8,"cpslTabsInit","onTabsInit"]]],[1,"cpsl-tabs",{"fullWidth":[4,"full-width"],"selectedTab":[1,"selected-tab"],"selectedTabRect":[32],"loaded":[32]},[[8,"cpslTabButtonSizeChange","onTabSizeChange"]],{"fullWidth":["updateSlider"],"selectedTab":["updateTab"]}],[1,"cpsl-button-group",{"selectedId":[1,"selected-id"]},null,{"selectedId":["selectItem"]}],[1,"cpsl-input",{"as":[1],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"noAutoDisable":[4,"no-auto-disable"],"autofocus":[4],"autoselect":[4],"disabled":[4],"contrastText":[4,"contrast-text"],"enterkeyhint":[1],"errorText":[1,"error-text"],"fitContent":[4,"fit-content"],"mask":[1],"isPhone":[4,"is-phone"],"helperText":[1,"helper-text"],"inputmode":[1],"label":[1],"max":[8],"maxlength":[2],"min":[8],"minlength":[2],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"showOptionalLabel":[4,"show-optional-label"],"spellcheck":[4],"startIconSrc":[1,"start-icon-src"],"startIcon":[1,"start-icon"],"step":[1],"type":[1],"value":[1025],"hasFocus":[32]},null,{"disabled":["handleDisable"],"mask":["handleSetupMask"],"value":["handleValueChange"]}],[1,"cpsl-popover",{"anchorEl":[16],"anchorOriginHorizontal":[1,"anchor-origin-horizontal"],"anchorOriginVertical":[1,"anchor-origin-vertical"],"autoWidth":[4,"auto-width"],"disabled":[4],"preventBlur":[4,"prevent-blur"],"transformOriginHorizontal":[1,"transform-origin-horizontal"],"transformOriginVertical":[1,"transform-origin-vertical"],"alignCenter":[4,"align-center"],"triggerAction":[1,"trigger-action"],"trigger":[1],"windowPadding":[2,"window-padding"],"open":[32],"hasSetInitialPosition":[32],"positionX":[32],"positionY":[32],"closePopover":[64]},null,{"trigger":["onTriggerChange"],"triggerAction":["onTriggerChange"],"preventBlur":["onTriggerChange"],"anchorOriginHorizontal":["onAnchorChange"],"anchorOriginVertical":["onAnchorChange"],"alignCenter":["onAnchorChange"],"open":["onOpenChange"]}],[1,"cpsl-button",{"as":[1],"disabled":[516],"pending":[4],"fullWidth":[4,"full-width"],"href":[1],"size":[1],"target":[1],"type":[1],"variant":[513]}],[1,"cpsl-card"],[1,"cpsl-overlay",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"open":[4],"zIndexOverride":[2,"z-index-override"]},null,{"open":["toggleHeight"]}],[1,"cpsl-spinner",{"variant":[1],"size":[2],"barColor":[1,"bar-color"],"barWidth":[2,"bar-width"],"speed":[2]}],[1,"cpsl-text",{"color":[1],"variant":[1],"weight":[1],"align":[1]}],[1,"cpsl-icon",{"src":[1],"size":[1],"invert":[4],"inset":[1],"icon":[1],"radius":[1],"background":[1],"color":[1],"border":[1]}]]]], options);
+  return index.bootstrapLazy([["cpsl-hero.cjs",[[1,"cpsl-hero",{"height":[2],"hideFadeOut":[4,"hide-fade-out"],"variant":[513],"title":[513],"subtitle":[513],"withDefaultTheme":[4,"with-default-theme"]}]]],["cpsl-modal-v2.cjs",[[1,"cpsl-modal-v2",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"elevated":[4],"noOverlay":[4,"no-overlay"],"open":[4],"zIndexOverride":[2,"z-index-override"]},null,{"open":["toggleHeight"]}]]],["cpsl-nav-button.cjs",[[1,"cpsl-nav-button",{"disabled":[516],"exactMainRouteMatch":[4,"exact-main-route-match"],"exactSubRouteMatch":[4,"exact-sub-route-match"],"route":[1],"subRoutes":[16],"path":[1]}]]],["cpsl-col.cjs",[[1,"cpsl-col",{"align":[1],"justify":[1],"gap":[8],"offset":[1],"offsetXs":[1,"offset-xs"],"offsetSm":[1,"offset-sm"],"offsetMd":[1,"offset-md"],"offsetLg":[1,"offset-lg"],"offsetXl":[1,"offset-xl"],"pull":[1],"pullXs":[1,"pull-xs"],"pullSm":[1,"pull-sm"],"pullMd":[1,"pull-md"],"pullLg":[1,"pull-lg"],"pullXl":[1,"pull-xl"],"push":[1],"pushXs":[1,"push-xs"],"pushSm":[1,"push-sm"],"pushMd":[1,"push-md"],"pushLg":[1,"push-lg"],"pushXl":[1,"push-xl"],"size":[1],"sizeXs":[1,"size-xs"],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"],"sizeXl":[1,"size-xl"]},[[9,"resize","onResize"]]]]],["cpsl-grid.cjs",[[1,"cpsl-grid",{"fixed":[4]}]]],["cpsl-identicon.cjs",[[1,"cpsl-identicon",{"hash":[1],"size":[1],"variant":[1],"arcWidth":[1,"arc-width"]}]]],["cpsl-info-box.cjs",[[1,"cpsl-info-box"]]],["cpsl-row.cjs",[[1,"cpsl-row",{"col":[4],"align":[1],"justify":[1],"gap":[8]}]]],["cpsl-alert_34.cjs",[[1,"cpsl-pagination",{"initialPage":[2,"initial-page"],"totalPages":[2,"total-pages"],"visiblePages":[1026,"visible-pages"],"currentPage":[32]},null,{"currentPage":["watchChange"]}],[1,"cpsl-select",{"anchorElId":[1,"anchor-el-id"],"autoWidth":[4,"auto-width"],"alignCenter":[4,"align-center"],"disabled":[4],"dropdownMaxHeight":[2,"dropdown-max-height"],"errorText":[1,"error-text"],"formatValue":[16],"helperText":[1,"helper-text"],"id":[1],"icon":[1],"label":[1],"multiple":[4],"noIconAnimation":[4,"no-icon-animation"],"placeholder":[1],"required":[4],"selectedValue":[1,"selected-value"],"showFormattedSelectedItem":[4,"show-formatted-selected-item"],"showOptionalLabel":[4,"show-optional-label"],"showSearch":[4,"show-search"],"searchPlaceholder":[1,"search-placeholder"],"selectedItemColor":[1,"selected-item-color"],"selectedItemVariant":[1,"selected-item-variant"],"selectedItemWeight":[1,"selected-item-weight"],"anchorEl":[32],"hasFocus":[32],"popoverOpen":[32],"hasSelectedItem":[32]},[[0,"cpslSelectItemClick","selectItemClickHandler"],[0,"cpslOpen","onPopoverOpen"],[0,"cpslClose","onPopoverClose"]],{"selectedValue":["onValueChange","handleValueChange"]}],[1,"cpsl-file-upload",{"disabled":[516],"errorText":[1,"error-text"],"externalFilename":[1,"external-filename"],"externalSrc":[1,"external-src"],"fileTypes":[16],"helperText":[1,"helper-text"],"label":[1],"required":[4],"showOptionalLabel":[4,"show-optional-label"],"uploadFile":[16],"file":[32],"dragOver":[32],"dragError":[32],"isUploading":[32],"uploadError":[32]}],[1,"cpsl-auth-modal",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"noOverlay":[4,"no-overlay"],"open":[4],"zIndexOverride":[2,"z-index-override"],"hasFooter":[32],"isMobile":[32]},null,{"open":["toggleModal"]}],[1,"cpsl-alert",{"icon":[1],"noIcon":[4,"no-icon"],"variant":[1],"filled":[4]}],[1,"cpsl-checkbox",{"checked":[4]}],[1,"cpsl-code-input",{"code":[1025],"errorText":[1,"error-text"],"helperText":[1,"helper-text"],"length":[2],"type":[1]},null,{"code":["watchCodeProp"]}],[1,"cpsl-drawer",{"anchor":[1],"anchorPosition":[2,"anchor-position"],"noOverlay":[4,"no-overlay"],"open":[4],"size":[8],"transitionDuration":[2,"transition-duration"],"transitionFunction":[1,"transition-function"],"variant":[1],"zIndexOverride":[2,"z-index-override"],"closedAnchorPosition":[32],"showTransition":[32]}],[1,"cpsl-icon-group",{"expandFrom":[1,"expand-from"],"disabled":[4],"icons":[16],"isHovered":[32]}],[1,"cpsl-slide-button",{"disabled":[4],"endIcon":[1,"end-icon"],"endText":[1,"end-text"],"startIcon":[1,"start-icon"],"startText":[1,"start-text"]}],[1,"cpsl-table",{"hasHorizontalScroll":[32],"hasVerticalScroll":[32]}],[1,"cpsl-tile-button",{"disabled":[516],"src":[1],"icon":[1]}],[1,"cpsl-app-bar",{"height":[2],"position":[1],"zIndexOverride":[2,"z-index-override"]}],[1,"cpsl-avatar",{"alt":[1],"src":[1],"size":[1],"variant":[1]}],[1,"cpsl-divider"],[1,"cpsl-dropdown",{"width":[1],"hasCpslSearch":[4,"has-cpsl-search"],"items":[16],"selectedItem":[1040],"isOpen":[32],"searchQuery":[32],"filteredItems":[32]},[[9,"resize","handleResize"]],{"selectedItem":["handleSelectedItemChange"],"isOpen":["handleOpenChange"]}],[1,"cpsl-nav-button-group"],[1,"cpsl-pill",{"text":[1]}],[1,"cpsl-progress-indicator",{"totalSteps":[2,"total-steps"],"step":[2]}],[1,"cpsl-qr-code",{"url":[1],"imageSrc":[1,"image-src"],"size":[2],"icon":[1]}],[1,"cpsl-radio",{"checked":[4]}],[1,"cpsl-select-item",{"selected":[4],"value":[1]}],[1,"cpsl-switch",{"checked":[4]}],[1,"cpsl-tab",{"selected":[4],"tab":[1]},[[8,"cpslTabsChanged","onTabsChanged"],[8,"cpslTabsInit","onTabsInit"]]],[1,"cpsl-tabs",{"fullWidth":[4,"full-width"],"selectedTab":[1,"selected-tab"],"selectedTabRect":[32],"loaded":[32]},[[8,"cpslTabButtonSizeChange","onTabSizeChange"]],{"fullWidth":["updateSlider"],"selectedTab":["updateTab"]}],[1,"cpsl-button-group",{"selectedId":[1,"selected-id"]},null,{"selectedId":["selectItem"]}],[1,"cpsl-input",{"as":[1],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"noAutoDisable":[4,"no-auto-disable"],"autofocus":[4],"autoselect":[4],"disabled":[4],"contrastText":[4,"contrast-text"],"enterkeyhint":[1],"errorText":[1,"error-text"],"fitContent":[4,"fit-content"],"mask":[1],"isPhone":[4,"is-phone"],"helperText":[1,"helper-text"],"inputmode":[1],"label":[1],"max":[8],"maxlength":[2],"min":[8],"minlength":[2],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"showOptionalLabel":[4,"show-optional-label"],"spellcheck":[4],"startIconSrc":[1,"start-icon-src"],"startIcon":[1,"start-icon"],"step":[1],"type":[1],"value":[1025],"hasFocus":[32]},null,{"disabled":["handleDisable"],"mask":["handleSetupMask"],"value":["handleValueChange"]}],[1,"cpsl-popover",{"anchorEl":[16],"anchorOriginHorizontal":[1,"anchor-origin-horizontal"],"anchorOriginVertical":[1,"anchor-origin-vertical"],"autoWidth":[4,"auto-width"],"disabled":[4],"preventBlur":[4,"prevent-blur"],"transformOriginHorizontal":[1,"transform-origin-horizontal"],"transformOriginVertical":[1,"transform-origin-vertical"],"alignCenter":[4,"align-center"],"triggerAction":[1,"trigger-action"],"trigger":[1],"windowPadding":[2,"window-padding"],"open":[32],"hasSetInitialPosition":[32],"positionX":[32],"positionY":[32],"closePopover":[64]},null,{"trigger":["onTriggerChange"],"triggerAction":["onTriggerChange"],"preventBlur":["onTriggerChange"],"anchorOriginHorizontal":["onAnchorChange"],"anchorOriginVertical":["onAnchorChange"],"alignCenter":["onAnchorChange"],"open":["onOpenChange"]}],[1,"cpsl-button",{"as":[1],"disabled":[516],"pending":[4],"fullWidth":[4,"full-width"],"href":[1],"size":[1],"target":[1],"type":[1],"variant":[513],"cursor":[1]}],[1,"cpsl-card"],[1,"cpsl-overlay",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"open":[4],"zIndexOverride":[2,"z-index-override"]},null,{"open":["toggleHeight"]}],[1,"cpsl-spinner",{"variant":[1],"size":[2],"barColor":[1,"bar-color"],"barWidth":[2,"bar-width"],"speed":[2]}],[1,"cpsl-text",{"color":[1],"variant":[1],"weight":[1],"align":[1]}],[1,"cpsl-icon",{"src":[1],"size":[1],"invert":[4],"inset":[1],"icon":[1],"radius":[1],"background":[1],"color":[1],"border":[1]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/collection/components/cpsl-button/cpsl-button.css

@@ -446,7 +446,7 @@
   text-decoration: none;
   border: 0px solid transparent;
   border-width: var(--button-border-width-top) var(--button-border-width-end) var(--button-border-width-bottom) var(--button-border-width-start);
-  cursor: pointer;
+  cursor: var(--cursor);
   color: var(--button-color);
   background: var(--button-background-color);
   border-color: var(--button-border-color);

package/dist/collection/components/cpsl-button/cpsl-button.js

@@ -10,9 +10,10 @@ export class CpslButton {
         this.target = undefined;
         this.type = 'button';
         this.variant = 'primary';
+        this.cursor = 'pointer';
     }
     render() {
-        return (h(Host, { key: '8f65c32aa3f0bcfcdf621ea1c1b4b4b383b28850', class: {
+        return (h(Host, { key: 'fcd0f4096d5adddb33fe44e08ea04c444fed2259', class: {
                 // VARIANTS
                 'primary': this.variant === 'primary',
                 'secondary': this.variant === 'secondary',
@@ -26,7 +27,9 @@ export class CpslButton {
                 'xSmall': this.size === 'xSmall',
                 'small': this.size === 'small',
                 'medium': this.size === 'medium',
-            } }, h(this.as, { key: '1079c5db34801176d0aa51aaa02613a2357494fb', href: this.href, target: this.target, part: "button-native", class: "button-native", type: this.type, disabled: this.disabled || this.pending }, h("slot", { key: 'f5eaff65f6243b2506557e0cc2797217baa31db7', name: "start" }), this.pending ? h("cpsl-spinner", { size: 19 }) : h("slot", null), h("slot", { key: '257554b7f318af94ac762003129aa13f3b446767', name: "end" }))));
+            }, style: {
+                '--cursor': this.cursor,
+            } }, h(this.as, { key: 'eff6ced646a622136d327ea34757d5e7d0c60dad', href: this.href, target: this.target, part: "button-native", class: "button-native", type: this.type, disabled: this.disabled || this.pending }, h("slot", { key: '08576c52271953e12fc9acfeccb1bcf751edff02', name: "start" }), this.pending ? h("cpsl-spinner", { size: 19 }) : h("slot", null), h("slot", { key: 'a1a8c6048339639af08999de24758f031275ad14', name: "end" }))));
     }
     static get is() { return "cpsl-button"; }
     static get encapsulation() { return "shadow"; }
@@ -201,6 +204,24 @@ export class CpslButton {
                 "attribute": "variant",
                 "reflect": true,
                 "defaultValue": "'primary'"
+            },
+            "cursor": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'pointer'",
+                    "resolved": "\"default\" | \"pointer\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The cursor style for the button.\nDefault is: `\"pointer\"`."
+                },
+                "attribute": "cursor",
+                "reflect": false,
+                "defaultValue": "'pointer'"
             }
         };
     }

package/dist/collection/components/cpsl-button/cpsl-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"cpsl-button.js","sourceRoot":"","sources":["../../../../src/components/cpsl-button/cpsl-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,UAAU;;kBAMS,QAAQ;wBAMQ,KAAK;uBAMvB,KAAK;yBAMH,KAAK;;oBAYY,QAAQ;;oBAUR,QAAQ;uBAO6C,SAAS;;IAE7G,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,WAAW;gBACX,SAAS,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;gBACrC,WAAW,EAAE,IAAI,CAAC,OAAO,KAAK,WAAW;gBACzC,UAAU,EAAE,IAAI,CAAC,OAAO,KAAK,UAAU;gBACvC,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;gBACjC,aAAa,EAAE,IAAI,CAAC,OAAO,KAAK,aAAa;gBAC7C,QAAQ;gBACR,UAAU,EAAE,IAAI,CAAC,QAAQ;gBACzB,YAAY,EAAE,IAAI,CAAC,SAAS;gBAC5B,QAAQ;gBACR,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;gBAChC,OAAO,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;gBAC9B,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;aACjC;YAED,EAAC,IAAI,CAAC,EAAE,qDAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO;gBAChJ,6DAAM,IAAI,EAAC,OAAO,GAAQ;gBACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,oBAAc,IAAI,EAAE,EAAE,GAAI,CAAC,CAAC,CAAC,eAAa;gBAC1D,6DAAM,IAAI,EAAC,KAAK,GAAQ,CAChB,CACL,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'cpsl-button',\n  styleUrl: 'cpsl-button.scss',\n  shadow: true,\n})\nexport class CpslButton {\n  /**\n   * The tag for the button.\n   * Options are: `\"button\"`, `\"a\".\n   * Default is: `\"button\"`.\n   */\n  @Prop() as?: 'button' | 'a' = 'button';\n\n  /**\n   * If the button is disabled.\n   * Default is: false.\n   */\n  @Prop({ reflect: true }) disabled?: boolean = false;\n\n  /**\n   * If the button is pending.\n   * Default is: false.\n   */\n  @Prop() pending?: boolean = false;\n\n  /**\n   * Whether the button takes the full width of it's container.\n   * Default is: false.\n   */\n  @Prop() fullWidth?: boolean = false;\n\n  /**\n   * href to use when using a link.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The size of the button.\n   * Options are: `\"small\"`, `\"medium\".\n   * Default is: `\"medium\"`.\n   */\n  @Prop() size?: 'xSmall' | 'small' | 'medium' = 'medium';\n\n  /**\n   * target to use when using a link.\n   */\n  @Prop() target?: string;\n\n  /**\n   * The type of the button.\n   */\n  @Prop() type?: 'button' | 'submit' | 'reset' = 'button';\n\n  /**\n   * The variant of the button.\n   * Options are: `\"primary\"`, `\"secondary\", `\"tertiary\", `\"ghost\"`, `\"destructive\"`.\n   * Default is: `\"primary\"`.\n   */\n  @Prop({ reflect: true }) variant?: 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'destructive' = 'primary';\n\n  render() {\n    return (\n      <Host\n        class={{\n          // VARIANTS\n          'primary': this.variant === 'primary',\n          'secondary': this.variant === 'secondary',\n          'tertiary': this.variant === 'tertiary',\n          'ghost': this.variant === 'ghost',\n          'destructive': this.variant === 'destructive',\n          // STATE\n          'disabled': this.disabled,\n          'full-width': this.fullWidth,\n          // SIZES\n          'xSmall': this.size === 'xSmall',\n          'small': this.size === 'small',\n          'medium': this.size === 'medium',\n        }}\n      >\n        <this.as href={this.href} target={this.target} part=\"button-native\" class=\"button-native\" type={this.type} disabled={this.disabled || this.pending}>\n          <slot name=\"start\"></slot>\n          {this.pending ? <cpsl-spinner size={19} /> : <slot></slot>}\n          <slot name=\"end\"></slot>\n        </this.as>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"cpsl-button.js","sourceRoot":"","sources":["../../../../src/components/cpsl-button/cpsl-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,UAAU;;kBAMS,QAAQ;wBAMQ,KAAK;uBAMvB,KAAK;yBAMH,KAAK;;oBAYY,QAAQ;;oBAUR,QAAQ;uBAO6C,SAAS;sBAMpE,SAAS;;IAElD,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,WAAW;gBACX,SAAS,EAAE,IAAI,CAAC,OAAO,KAAK,SAAS;gBACrC,WAAW,EAAE,IAAI,CAAC,OAAO,KAAK,WAAW;gBACzC,UAAU,EAAE,IAAI,CAAC,OAAO,KAAK,UAAU;gBACvC,OAAO,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;gBACjC,aAAa,EAAE,IAAI,CAAC,OAAO,KAAK,aAAa;gBAC7C,QAAQ;gBACR,UAAU,EAAE,IAAI,CAAC,QAAQ;gBACzB,YAAY,EAAE,IAAI,CAAC,SAAS;gBAC5B,QAAQ;gBACR,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;gBAChC,OAAO,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;gBAC9B,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;aACjC,EACD,KAAK,EAAE;gBACL,UAAU,EAAE,IAAI,CAAC,MAAM;aACxB;YAED,EAAC,IAAI,CAAC,EAAE,qDAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,eAAe,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO;gBAChJ,6DAAM,IAAI,EAAC,OAAO,GAAQ;gBACzB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,oBAAc,IAAI,EAAE,EAAE,GAAI,CAAC,CAAC,CAAC,eAAa;gBAC1D,6DAAM,IAAI,EAAC,KAAK,GAAQ,CAChB,CACL,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'cpsl-button',\n  styleUrl: 'cpsl-button.scss',\n  shadow: true,\n})\nexport class CpslButton {\n  /**\n   * The tag for the button.\n   * Options are: `\"button\"`, `\"a\".\n   * Default is: `\"button\"`.\n   */\n  @Prop() as?: 'button' | 'a' = 'button';\n\n  /**\n   * If the button is disabled.\n   * Default is: false.\n   */\n  @Prop({ reflect: true }) disabled?: boolean = false;\n\n  /**\n   * If the button is pending.\n   * Default is: false.\n   */\n  @Prop() pending?: boolean = false;\n\n  /**\n   * Whether the button takes the full width of it's container.\n   * Default is: false.\n   */\n  @Prop() fullWidth?: boolean = false;\n\n  /**\n   * href to use when using a link.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The size of the button.\n   * Options are: `\"small\"`, `\"medium\".\n   * Default is: `\"medium\"`.\n   */\n  @Prop() size?: 'xSmall' | 'small' | 'medium' = 'medium';\n\n  /**\n   * target to use when using a link.\n   */\n  @Prop() target?: string;\n\n  /**\n   * The type of the button.\n   */\n  @Prop() type?: 'button' | 'submit' | 'reset' = 'button';\n\n  /**\n   * The variant of the button.\n   * Options are: `\"primary\"`, `\"secondary\", `\"tertiary\", `\"ghost\"`, `\"destructive\"`.\n   * Default is: `\"primary\"`.\n   */\n  @Prop({ reflect: true }) variant?: 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'destructive' = 'primary';\n\n  /**\n   * The cursor style for the button.\n   * Default is: `\"pointer\"`.\n   */\n  @Prop() cursor?: 'default' | 'pointer' = 'pointer';\n\n  render() {\n    return (\n      <Host\n        class={{\n          // VARIANTS\n          'primary': this.variant === 'primary',\n          'secondary': this.variant === 'secondary',\n          'tertiary': this.variant === 'tertiary',\n          'ghost': this.variant === 'ghost',\n          'destructive': this.variant === 'destructive',\n          // STATE\n          'disabled': this.disabled,\n          'full-width': this.fullWidth,\n          // SIZES\n          'xSmall': this.size === 'xSmall',\n          'small': this.size === 'small',\n          'medium': this.size === 'medium',\n        }}\n        style={{\n          '--cursor': this.cursor,\n        }}\n      >\n        <this.as href={this.href} target={this.target} part=\"button-native\" class=\"button-native\" type={this.type} disabled={this.disabled || this.pending}>\n          <slot name=\"start\"></slot>\n          {this.pending ? <cpsl-spinner size={19} /> : <slot></slot>}\n          <slot name=\"end\"></slot>\n        </this.as>\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -4,6 +4,7 @@ export class CpslSelect {
         this.inputId = `cpsl-select-${inputIds++}`;
         this.onBlur = (ev) => {
             this.hasFocus = false;
+            // eslint-disable-next-line @typescript-eslint/no-floating-promises -- fire-and-forget: close popover on blur
             this.popoverEl.closePopover();
             this.cpslBlur.emit(ev);
         };
@@ -88,6 +89,7 @@ export class CpslSelect {
     }
     onValueChange() {
         if (!this.multiple) {
+            // eslint-disable-next-line @typescript-eslint/no-floating-promises -- fire-and-forget: close popover on value change
             this.popoverEl.closePopover();
         }
     }
@@ -111,10 +113,10 @@ export class CpslSelect {
     render() {
         var _a, _b, _c, _d, _e;
         const selectedValueAsString = Array.isArray(this.selectedValue) ? this.selectedValue.join(', ') : this.selectedValue;
-        return (h(Host, { key: '18900dc2127936e4cd74c736234287d3a9c4f5d6', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': this.hasSelectedItem } }, this.label && (h("label", { key: '84edbb138188860c4b53d6bb5414529e0981c6ac', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: 'ab6f0e73fb1fc392fb6a37a364334e841c51e4f1', part: "select-container", id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onClick: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: '227f6bc64a4caf1ab62eb721abcff785f52c900a', name: "selected-item" }), h("div", { key: '6085a10a607168ce5804f0d0c10856509ec309db', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: '952821d6eb180709bf6484a1e5a201b1173c8e50', class: { 'selected-text': true, 'placeholder': !this.selectedValue }, part: "selected-text", color: this.selectedItemColor, variant: this.selectedItemVariant, weight: this.selectedItemWeight }, !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 : selectedValueAsString)))), this.icon && this.icon !== null && (h("cpsl-icon", { key: 'ebc48a455be06e7423f46cd1cbc9794ac9f7158a', part: "icon", class: { 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': this.hasSelectedItem }, icon: this.icon })), h("input", { key: '3e754fbb61ed2b895d100eac6c066965ccb019d4', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" }), h("cpsl-popover", { key: 'a8213a89bfd08f45839402e7bea33df24331eadd', part: "popover", autoWidth: this.autoWidth, alignCenter: this.alignCenter, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '1850448668be81bab36fa485a4ca9efc8a6f42c3', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: 'f4d86eada1ab15fdc1e5c40f177c740ea402854c', class: "search-container" }, h("cpsl-input", { key: '5eac08c4bf0d58f52f393cf7fe709ea7104e567c', onClick: e => e.stopPropagation(), placeholder: (_d = this.searchPlaceholder) !== null && _d !== void 0 ? _d : 'Search', value: "", onCpslInput: e => {
+        return (h(Host, { key: '1e4dc20d7f2dc7844dd956c110cc5a2757ddb752', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': this.hasSelectedItem } }, this.label && (h("label", { key: '4af1f907313f9e095c706fbab2c236c8e9d47237', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: '98558fb18b2bfc48b5bf23021a46f9755decaaaf', part: "select-container", id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onClick: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: 'dd8f8e9e87137bdd3cd4607d869e616eb7c9b9c4', name: "selected-item" }), h("div", { key: 'b9ec417b3f67037837f948792511f80e842df799', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: '62dd60c821f9d94c00fddf30af34e64de2e345c8', class: { 'selected-text': true, 'placeholder': !this.selectedValue }, part: "selected-text", color: this.selectedItemColor, variant: this.selectedItemVariant, weight: this.selectedItemWeight }, !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 : selectedValueAsString)))), this.icon && this.icon !== null && (h("cpsl-icon", { key: '56c75234d0ba048b23a3bf41d751f70a23f85041', part: "icon", class: { 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': this.hasSelectedItem }, icon: this.icon })), h("input", { key: '65b85ee9df8fbb62b82470c0991428bdf67d5437', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" }), h("cpsl-popover", { key: '751bfe385c3ca95cae0fe2eef9c03a779d6125b1', part: "popover", autoWidth: this.autoWidth, alignCenter: this.alignCenter, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '0b6913238a58fe19a918d1eac7ee09b2f7570ec3', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: '388d404c0ebbbfb922056f052511fdfc99f3d702', class: "search-container" }, h("cpsl-input", { key: 'e254975df404b4216c3318d5e626468e6350620c', onClick: e => e.stopPropagation(), placeholder: (_d = this.searchPlaceholder) !== null && _d !== void 0 ? _d : 'Search', value: "", onCpslInput: e => {
                 e.stopPropagation();
                 this.cpslSearchChange.emit(e.detail.value);
-            } }))), h("div", { key: '98be2ccca9d4f3393b375a6be57ecb994f208d63', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: '4b144f409037e0e19542bd01f360812afcbdeb8e', name: "items" }))))), (this.errorText || this.helperText) && (h("div", { key: '1ad20642e98bc4b530ba3831d721f4e5602301b7', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: 'c78382be9cba907cd2d8400d8602ceebb523b8b5' }, (_e = this.errorText) !== null && _e !== void 0 ? _e : this.helperText)))));
+            } }))), h("div", { key: 'b847a13c07e671d596eaa728e431423f7d3c2e4b', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: 'b6bafa1999a354a717a008a918ceccc67faeb9c2', name: "items" }))))), (this.errorText || this.helperText) && (h("div", { key: 'cfe5b3c706560be4de6e59916e554c95de461e92', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: '7bff30a43bedaed3df56de1f826f33957163a6ef' }, (_e = this.errorText) !== null && _e !== void 0 ? _e : this.helperText)))));
     }
     static get is() { return "cpsl-select"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1 +1 @@
-{"version":3,"file":"cpsl-select.js","sourceRoot":"","sources":["../../../../src/components/cpsl-select/cpsl-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Element, h, Prop, State, EventEmitter, Event, Watch, Listen } from '@stencil/core';\nimport { IconType } from '../../interface.js';\n\n@Component({\n  tag: 'cpsl-select',\n  styleUrl: 'cpsl-select.scss',\n  shadow: true,\n})\nexport class CpslSelect {\n  @Element() el!: HTMLCpslSelectElement;\n  private popoverEl!: HTMLCpslPopoverElement;\n  private inputId = `cpsl-select-${inputIds++}`;\n\n  @State() anchorEl!: HTMLElement;\n  @State() hasFocus = false;\n  @State() popoverOpen = false;\n  @State() hasSelectedItem = false;\n\n  /**\n   * ID of element to anchor popover to.\n   */\n  @Prop() anchorElId?: string;\n\n  /**\n   * If `true` the popover container will use the width of the content, else it will be set to the width of the trigger.\n   * Default is `false`\n   */\n  @Prop() autoWidth?: boolean = false;\n\n  /**\n   * If `true`, the popover will be aligned to the center of the trigger element.\n   * Default is `false`.\n   */\n  @Prop() alignCenter: boolean = false;\n\n  /**\n   * If `true`, the user cannot interact with the input.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Set the max height of the dropdown.\n   */\n  @Prop() dropdownMaxHeight?: number;\n\n  /**\n   * Error text to show below the input. If this is provided the input will enter an error state.\n   */\n  @Prop() errorText?: string;\n\n  /**\n   * Format value for display when selected.\n   */\n  @Prop() formatValue?: (value: string | string[]) => string;\n\n  /**\n   * Helper text to show below the input. If `\"errorText\"` is provided that will take precedence.\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * ID of the element, must be unique for the popover trigger.\n   */\n\n  @Prop() id: string = `${this.inputId}-trigger`;\n\n  /**\n   * The name of the icon to use for the end icon.\n   * Default: `chevronUp`\n   */\n  @Prop() icon?: IconType | null = 'chevronUp';\n\n  /**\n   * The label for the input.\n   */\n  @Prop() label?: string;\n\n  /**\n   * If `true`, the user can select more than one value.\n   */\n  @Prop() multiple?: boolean;\n\n  /**\n   * Whether or not to show the rotation animation for the end icon.\n   */\n  @Prop() noIconAnimation?: boolean;\n\n  /**\n   * Placeholder to display if `selectedValue` is empty.\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required = false;\n\n  /**\n   * Value of the selected item.\n   */\n  @Prop() selectedValue?: string | string[];\n\n  /**\n   * Will show the formatted selected item (passed in the `selected-item` slot) in the select rather than the item value.\n   */\n  @Prop() showFormattedSelectedItem?: boolean;\n\n  /**\n   * If `true`, the label will display an \"optional\" tag.\n   */\n  @Prop() showOptionalLabel = false;\n\n  /**\n   * If `true`, the dropdown will contain a search field.\n   */\n  @Prop() showSearch = false;\n\n  /**\n   * Placeholder for the search field.\n   */\n  @Prop() searchPlaceholder?: string;\n\n  /**\n   * The color of the selected item or placeholder text.\n   * Options are: `\"primary\"`, `\"secondary\", `\"tertiary\", `\"subtle\", `\"inverted\", `\"error\".\n   * Default is: `\"primary\"`.\n   */\n  @Prop() selectedItemColor?: 'primary' | 'secondary' | 'tertiary' | 'subtle' | 'inverted' | 'error' | 'contrast' = 'primary';\n\n  /**\n   * The variant of the selected item or placeholder text.\n   * Options are: `\"body2XS\"`, `\"bodyXS\", `\"bodyS\", `\"bodyM\", `\"bodyL\", `\"bodyXL\", `\"headingXS\", `\"headingS\", `\"headingM\", `\"headingL\", `\"headingXL\", `\"heading2XL\".\n   * Default is: `\"bodyM\"`.\n   */\n  @Prop() selectedItemVariant?: 'body2XS' | 'bodyXS' | 'bodyS' | 'bodyM' | 'bodyL' | 'bodyXL' | 'headingXS' | 'headingS' | 'headingM' | 'headingL' | 'headingXL' | 'heading2XL' =\n    'bodyM';\n\n  /**\n   * The weight of the selected item or placeholder text.\n   * Options are: `\"regular\"`, `\"medium\", `\"semiBold\", `\"bold\".\n   * Default is: `\"regular\"`.\n   */\n  @Prop() selectedItemWeight?: 'regular' | 'medium' | 'semiBold' | 'bold' = 'regular';\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() cpslBlur!: EventEmitter<FocusEvent>;\n\n  /**\n   * Emitted when the input has focus.\n   */\n  @Event() cpslFocus!: EventEmitter<FocusEvent>;\n\n  /**\n   * Emitted when the value changes.\n   */\n  @Event() cpslSelectValueChange!: EventEmitter<string>;\n\n  /**\n   * Emitted when the search value changes.\n   */\n  @Event() cpslSearchChange!: EventEmitter<string>;\n\n  @Watch('selectedValue')\n  onValueChange() {\n    if (!this.multiple) {\n      this.popoverEl.closePopover();\n    }\n  }\n\n  @Watch('selectedValue')\n  handleValueChange() {\n    this.selectItem();\n  }\n\n  @Listen('cpslSelectItemClick')\n  selectItemClickHandler(event: CustomEvent<string>) {\n    this.cpslSelectValueChange.emit(event.detail);\n  }\n\n  @Listen('cpslOpen')\n  onPopoverOpen() {\n    this.popoverOpen = true;\n  }\n\n  @Listen('cpslClose')\n  onPopoverClose() {\n    this.popoverOpen = false;\n  }\n\n  componentDidLoad() {\n    this.popoverEl = this.el.shadowRoot.querySelector(`cpsl-popover`) as HTMLCpslPopoverElement;\n    this.anchorEl = this.anchorElId ? document.getElementById(this.anchorElId) : this.el.shadowRoot.getElementById('select-container');\n\n    this.selectItem();\n  }\n\n  private onBlur = (ev: FocusEvent) => {\n    this.hasFocus = false;\n\n    this.popoverEl.closePopover();\n\n    this.cpslBlur.emit(ev);\n  };\n\n  private onFocus = (ev: FocusEvent) => {\n    this.hasFocus = true;\n\n    this.cpslFocus.emit(ev);\n  };\n\n  private handleEnterPress = (ev: KeyboardEvent) => {\n    if (ev.key === 'Enter') {\n      ev.preventDefault();\n      this.el.dispatchEvent(new MouseEvent('mousedown'));\n    }\n  };\n\n  private selectItem = () => {\n    const items = Array.from(this.el.querySelectorAll('cpsl-select-item')) as HTMLCpslSelectItemElement[];\n\n    items.forEach(item => {\n      if (typeof this.selectedValue === 'string') {\n        if (item.value === this.selectedValue) {\n          item.setAttribute('selected', 'true');\n        } else {\n          item.setAttribute('selected', 'false');\n        }\n      } else {\n        if (this.selectedValue?.includes(item.value)) {\n          item.setAttribute('selected', 'true');\n        } else {\n          item.setAttribute('selected', 'false');\n        }\n      }\n    });\n\n    this.hasSelectedItem = typeof this.selectedValue === 'string' ? !!this.selectedValue : !!this.selectedValue?.length;\n  };\n\n  private handleClickOutside = (event: MouseEvent) => {\n    if (this.hasFocus && !this.el.contains(event.target as Node)) {\n      this.hasFocus = false;\n      typeof window !== 'undefined' && window.removeEventListener('click', this.handleClickOutside);\n    }\n  };\n\n  private handleClick = (e: MouseEvent) => {\n    const targetId = (e.target as any).id ?? '';\n\n    if (targetId === 'ignore-click') {\n      return;\n    }\n\n    if (!this.disabled) {\n      this.hasFocus = true;\n      typeof window !== 'undefined' && window.addEventListener('click', this.handleClickOutside);\n    }\n  };\n\n  render() {\n    const selectedValueAsString = Array.isArray(this.selectedValue) ? this.selectedValue.join(', ') : this.selectedValue;\n\n    return (\n      <Host id={this.id} class={{ 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': this.hasSelectedItem }}>\n        {this.label && (\n          <label class=\"label\" htmlFor={this.inputId}>\n            {this.label}\n            {this.required ? '*' : ' '}\n            {!this.required && this.showOptionalLabel ? <span class=\"optional-label\">(optional)</span> : ''}\n          </label>\n        )}\n        <div part=\"select-container\" id=\"select-container\" class={{ 'select-container': true, 'error-container': Boolean(this.errorText) }} onClick={this.handleClick}>\n          {this.hasSelectedItem && this.showFormattedSelectedItem && <slot name=\"selected-item\"></slot>}\n          <div class={{ 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }} id=\"selected-container-content\" style={{}}>\n            {(!this.hasSelectedItem || !this.showFormattedSelectedItem) && (\n              <cpsl-text\n                class={{ 'selected-text': true, 'placeholder': !this.selectedValue }}\n                part=\"selected-text\"\n                color={this.selectedItemColor}\n                variant={this.selectedItemVariant}\n                weight={this.selectedItemWeight}\n              >\n                {!this.selectedValue ? (this.placeholder ?? 'Select') : (this.formatValue?.(this.selectedValue) ?? selectedValueAsString)}\n              </cpsl-text>\n            )}\n          </div>\n          {this.icon && this.icon !== null && (\n            <cpsl-icon part=\"icon\" class={{ 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': this.hasSelectedItem }} icon={this.icon} />\n          )}\n          <input\n            id={this.inputId}\n            disabled={this.disabled}\n            class={{ disabled: this.disabled }}\n            value={this.selectedValue}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onKeyPress={this.handleEnterPress}\n            inputmode=\"none\"\n          />\n          <cpsl-popover\n            part=\"popover\"\n            autoWidth={this.autoWidth}\n            alignCenter={this.alignCenter}\n            trigger={this.id}\n            preventBlur={this.hasFocus}\n            disabled={this.disabled}\n            anchorEl={this.anchorEl}\n          >\n            <div part=\"dropdown\" class=\"dropdown\">\n              {this.showSearch && (\n                <div class=\"search-container\">\n                  <cpsl-input\n                    onClick={e => e.stopPropagation()}\n                    placeholder={this.searchPlaceholder ?? 'Search'}\n                    value=\"\"\n                    onCpslInput={e => {\n                      e.stopPropagation();\n                      this.cpslSearchChange.emit(e.detail.value);\n                    }}\n                  />\n                </div>\n              )}\n              <div class=\"dropdown-inner\" style={{ maxHeight: `${this.dropdownMaxHeight}px` }}>\n                <slot name=\"items\"></slot>\n              </div>\n            </div>\n          </cpsl-popover>\n        </div>\n        {(this.errorText || this.helperText) && (\n          <div class={{ 'helper-text-container': true, 'error-text': Boolean(this.errorText) }}>\n            <span>{this.errorText ?? this.helperText}</span>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n\nlet inputIds = 0;\n"]}
+{"version":3,"file":"cpsl-select.js","sourceRoot":"","sources":["../../../../src/components/cpsl-select/cpsl-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Element, h, Prop, State, EventEmitter, Event, Watch, Listen } from '@stencil/core';\nimport { IconType } from '../../interface.js';\n\n@Component({\n  tag: 'cpsl-select',\n  styleUrl: 'cpsl-select.scss',\n  shadow: true,\n})\nexport class CpslSelect {\n  @Element() el!: HTMLCpslSelectElement;\n  private popoverEl!: HTMLCpslPopoverElement;\n  private inputId = `cpsl-select-${inputIds++}`;\n\n  @State() anchorEl!: HTMLElement;\n  @State() hasFocus = false;\n  @State() popoverOpen = false;\n  @State() hasSelectedItem = false;\n\n  /**\n   * ID of element to anchor popover to.\n   */\n  @Prop() anchorElId?: string;\n\n  /**\n   * If `true` the popover container will use the width of the content, else it will be set to the width of the trigger.\n   * Default is `false`\n   */\n  @Prop() autoWidth?: boolean = false;\n\n  /**\n   * If `true`, the popover will be aligned to the center of the trigger element.\n   * Default is `false`.\n   */\n  @Prop() alignCenter: boolean = false;\n\n  /**\n   * If `true`, the user cannot interact with the input.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Set the max height of the dropdown.\n   */\n  @Prop() dropdownMaxHeight?: number;\n\n  /**\n   * Error text to show below the input. If this is provided the input will enter an error state.\n   */\n  @Prop() errorText?: string;\n\n  /**\n   * Format value for display when selected.\n   */\n  @Prop() formatValue?: (value: string | string[]) => string;\n\n  /**\n   * Helper text to show below the input. If `\"errorText\"` is provided that will take precedence.\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * ID of the element, must be unique for the popover trigger.\n   */\n\n  @Prop() id: string = `${this.inputId}-trigger`;\n\n  /**\n   * The name of the icon to use for the end icon.\n   * Default: `chevronUp`\n   */\n  @Prop() icon?: IconType | null = 'chevronUp';\n\n  /**\n   * The label for the input.\n   */\n  @Prop() label?: string;\n\n  /**\n   * If `true`, the user can select more than one value.\n   */\n  @Prop() multiple?: boolean;\n\n  /**\n   * Whether or not to show the rotation animation for the end icon.\n   */\n  @Prop() noIconAnimation?: boolean;\n\n  /**\n   * Placeholder to display if `selectedValue` is empty.\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required = false;\n\n  /**\n   * Value of the selected item.\n   */\n  @Prop() selectedValue?: string | string[];\n\n  /**\n   * Will show the formatted selected item (passed in the `selected-item` slot) in the select rather than the item value.\n   */\n  @Prop() showFormattedSelectedItem?: boolean;\n\n  /**\n   * If `true`, the label will display an \"optional\" tag.\n   */\n  @Prop() showOptionalLabel = false;\n\n  /**\n   * If `true`, the dropdown will contain a search field.\n   */\n  @Prop() showSearch = false;\n\n  /**\n   * Placeholder for the search field.\n   */\n  @Prop() searchPlaceholder?: string;\n\n  /**\n   * The color of the selected item or placeholder text.\n   * Options are: `\"primary\"`, `\"secondary\", `\"tertiary\", `\"subtle\", `\"inverted\", `\"error\".\n   * Default is: `\"primary\"`.\n   */\n  @Prop() selectedItemColor?: 'primary' | 'secondary' | 'tertiary' | 'subtle' | 'inverted' | 'error' | 'contrast' = 'primary';\n\n  /**\n   * The variant of the selected item or placeholder text.\n   * Options are: `\"body2XS\"`, `\"bodyXS\", `\"bodyS\", `\"bodyM\", `\"bodyL\", `\"bodyXL\", `\"headingXS\", `\"headingS\", `\"headingM\", `\"headingL\", `\"headingXL\", `\"heading2XL\".\n   * Default is: `\"bodyM\"`.\n   */\n  @Prop() selectedItemVariant?: 'body2XS' | 'bodyXS' | 'bodyS' | 'bodyM' | 'bodyL' | 'bodyXL' | 'headingXS' | 'headingS' | 'headingM' | 'headingL' | 'headingXL' | 'heading2XL' =\n    'bodyM';\n\n  /**\n   * The weight of the selected item or placeholder text.\n   * Options are: `\"regular\"`, `\"medium\", `\"semiBold\", `\"bold\".\n   * Default is: `\"regular\"`.\n   */\n  @Prop() selectedItemWeight?: 'regular' | 'medium' | 'semiBold' | 'bold' = 'regular';\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() cpslBlur!: EventEmitter<FocusEvent>;\n\n  /**\n   * Emitted when the input has focus.\n   */\n  @Event() cpslFocus!: EventEmitter<FocusEvent>;\n\n  /**\n   * Emitted when the value changes.\n   */\n  @Event() cpslSelectValueChange!: EventEmitter<string>;\n\n  /**\n   * Emitted when the search value changes.\n   */\n  @Event() cpslSearchChange!: EventEmitter<string>;\n\n  @Watch('selectedValue')\n  onValueChange() {\n    if (!this.multiple) {\n      // eslint-disable-next-line @typescript-eslint/no-floating-promises -- fire-and-forget: close popover on value change\n      this.popoverEl.closePopover();\n    }\n  }\n\n  @Watch('selectedValue')\n  handleValueChange() {\n    this.selectItem();\n  }\n\n  @Listen('cpslSelectItemClick')\n  selectItemClickHandler(event: CustomEvent<string>) {\n    this.cpslSelectValueChange.emit(event.detail);\n  }\n\n  @Listen('cpslOpen')\n  onPopoverOpen() {\n    this.popoverOpen = true;\n  }\n\n  @Listen('cpslClose')\n  onPopoverClose() {\n    this.popoverOpen = false;\n  }\n\n  componentDidLoad() {\n    this.popoverEl = this.el.shadowRoot.querySelector(`cpsl-popover`) as HTMLCpslPopoverElement;\n    this.anchorEl = this.anchorElId ? document.getElementById(this.anchorElId) : this.el.shadowRoot.getElementById('select-container');\n\n    this.selectItem();\n  }\n\n  private onBlur = (ev: FocusEvent) => {\n    this.hasFocus = false;\n\n    // eslint-disable-next-line @typescript-eslint/no-floating-promises -- fire-and-forget: close popover on blur\n    this.popoverEl.closePopover();\n\n    this.cpslBlur.emit(ev);\n  };\n\n  private onFocus = (ev: FocusEvent) => {\n    this.hasFocus = true;\n\n    this.cpslFocus.emit(ev);\n  };\n\n  private handleEnterPress = (ev: KeyboardEvent) => {\n    if (ev.key === 'Enter') {\n      ev.preventDefault();\n      this.el.dispatchEvent(new MouseEvent('mousedown'));\n    }\n  };\n\n  private selectItem = () => {\n    const items = Array.from(this.el.querySelectorAll('cpsl-select-item')) as HTMLCpslSelectItemElement[];\n\n    items.forEach(item => {\n      if (typeof this.selectedValue === 'string') {\n        if (item.value === this.selectedValue) {\n          item.setAttribute('selected', 'true');\n        } else {\n          item.setAttribute('selected', 'false');\n        }\n      } else {\n        if (this.selectedValue?.includes(item.value)) {\n          item.setAttribute('selected', 'true');\n        } else {\n          item.setAttribute('selected', 'false');\n        }\n      }\n    });\n\n    this.hasSelectedItem = typeof this.selectedValue === 'string' ? !!this.selectedValue : !!this.selectedValue?.length;\n  };\n\n  private handleClickOutside = (event: MouseEvent) => {\n    if (this.hasFocus && !this.el.contains(event.target as Node)) {\n      this.hasFocus = false;\n      typeof window !== 'undefined' && window.removeEventListener('click', this.handleClickOutside);\n    }\n  };\n\n  private handleClick = (e: MouseEvent) => {\n    const targetId = (e.target as any).id ?? '';\n\n    if (targetId === 'ignore-click') {\n      return;\n    }\n\n    if (!this.disabled) {\n      this.hasFocus = true;\n      typeof window !== 'undefined' && window.addEventListener('click', this.handleClickOutside);\n    }\n  };\n\n  render() {\n    const selectedValueAsString = Array.isArray(this.selectedValue) ? this.selectedValue.join(', ') : this.selectedValue;\n\n    return (\n      <Host id={this.id} class={{ 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': this.hasSelectedItem }}>\n        {this.label && (\n          <label class=\"label\" htmlFor={this.inputId}>\n            {this.label}\n            {this.required ? '*' : ' '}\n            {!this.required && this.showOptionalLabel ? <span class=\"optional-label\">(optional)</span> : ''}\n          </label>\n        )}\n        <div part=\"select-container\" id=\"select-container\" class={{ 'select-container': true, 'error-container': Boolean(this.errorText) }} onClick={this.handleClick}>\n          {this.hasSelectedItem && this.showFormattedSelectedItem && <slot name=\"selected-item\"></slot>}\n          <div class={{ 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }} id=\"selected-container-content\" style={{}}>\n            {(!this.hasSelectedItem || !this.showFormattedSelectedItem) && (\n              <cpsl-text\n                class={{ 'selected-text': true, 'placeholder': !this.selectedValue }}\n                part=\"selected-text\"\n                color={this.selectedItemColor}\n                variant={this.selectedItemVariant}\n                weight={this.selectedItemWeight}\n              >\n                {!this.selectedValue ? (this.placeholder ?? 'Select') : (this.formatValue?.(this.selectedValue) ?? selectedValueAsString)}\n              </cpsl-text>\n            )}\n          </div>\n          {this.icon && this.icon !== null && (\n            <cpsl-icon part=\"icon\" class={{ 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': this.hasSelectedItem }} icon={this.icon} />\n          )}\n          <input\n            id={this.inputId}\n            disabled={this.disabled}\n            class={{ disabled: this.disabled }}\n            value={this.selectedValue}\n            onFocus={this.onFocus}\n            onBlur={this.onBlur}\n            onKeyPress={this.handleEnterPress}\n            inputmode=\"none\"\n          />\n          <cpsl-popover\n            part=\"popover\"\n            autoWidth={this.autoWidth}\n            alignCenter={this.alignCenter}\n            trigger={this.id}\n            preventBlur={this.hasFocus}\n            disabled={this.disabled}\n            anchorEl={this.anchorEl}\n          >\n            <div part=\"dropdown\" class=\"dropdown\">\n              {this.showSearch && (\n                <div class=\"search-container\">\n                  <cpsl-input\n                    onClick={e => e.stopPropagation()}\n                    placeholder={this.searchPlaceholder ?? 'Search'}\n                    value=\"\"\n                    onCpslInput={e => {\n                      e.stopPropagation();\n                      this.cpslSearchChange.emit(e.detail.value);\n                    }}\n                  />\n                </div>\n              )}\n              <div class=\"dropdown-inner\" style={{ maxHeight: `${this.dropdownMaxHeight}px` }}>\n                <slot name=\"items\"></slot>\n              </div>\n            </div>\n          </cpsl-popover>\n        </div>\n        {(this.errorText || this.helperText) && (\n          <div class={{ 'helper-text-container': true, 'error-text': Boolean(this.errorText) }}>\n            <span>{this.errorText ?? this.helperText}</span>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n\nlet inputIds = 0;\n"]}

package/dist/esm/capsule.js

@@ -16,7 +16,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["cpsl-hero",[[1,"cpsl-hero",{"height":[2],"hideFadeOut":[4,"hide-fade-out"],"variant":[513],"title":[513],"subtitle":[513],"withDefaultTheme":[4,"with-default-theme"]}]]],["cpsl-modal-v2",[[1,"cpsl-modal-v2",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"elevated":[4],"noOverlay":[4,"no-overlay"],"open":[4],"zIndexOverride":[2,"z-index-override"]},null,{"open":["toggleHeight"]}]]],["cpsl-nav-button",[[1,"cpsl-nav-button",{"disabled":[516],"exactMainRouteMatch":[4,"exact-main-route-match"],"exactSubRouteMatch":[4,"exact-sub-route-match"],"route":[1],"subRoutes":[16],"path":[1]}]]],["cpsl-col",[[1,"cpsl-col",{"align":[1],"justify":[1],"gap":[8],"offset":[1],"offsetXs":[1,"offset-xs"],"offsetSm":[1,"offset-sm"],"offsetMd":[1,"offset-md"],"offsetLg":[1,"offset-lg"],"offsetXl":[1,"offset-xl"],"pull":[1],"pullXs":[1,"pull-xs"],"pullSm":[1,"pull-sm"],"pullMd":[1,"pull-md"],"pullLg":[1,"pull-lg"],"pullXl":[1,"pull-xl"],"push":[1],"pushXs":[1,"push-xs"],"pushSm":[1,"push-sm"],"pushMd":[1,"push-md"],"pushLg":[1,"push-lg"],"pushXl":[1,"push-xl"],"size":[1],"sizeXs":[1,"size-xs"],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"],"sizeXl":[1,"size-xl"]},[[9,"resize","onResize"]]]]],["cpsl-grid",[[1,"cpsl-grid",{"fixed":[4]}]]],["cpsl-identicon",[[1,"cpsl-identicon",{"hash":[1],"size":[1],"variant":[1],"arcWidth":[1,"arc-width"]}]]],["cpsl-info-box",[[1,"cpsl-info-box"]]],["cpsl-row",[[1,"cpsl-row",{"col":[4],"align":[1],"justify":[1],"gap":[8]}]]],["cpsl-alert_34",[[1,"cpsl-pagination",{"initialPage":[2,"initial-page"],"totalPages":[2,"total-pages"],"visiblePages":[1026,"visible-pages"],"currentPage":[32]},null,{"currentPage":["watchChange"]}],[1,"cpsl-select",{"anchorElId":[1,"anchor-el-id"],"autoWidth":[4,"auto-width"],"alignCenter":[4,"align-center"],"disabled":[4],"dropdownMaxHeight":[2,"dropdown-max-height"],"errorText":[1,"error-text"],"formatValue":[16],"helperText":[1,"helper-text"],"id":[1],"icon":[1],"label":[1],"multiple":[4],"noIconAnimation":[4,"no-icon-animation"],"placeholder":[1],"required":[4],"selectedValue":[1,"selected-value"],"showFormattedSelectedItem":[4,"show-formatted-selected-item"],"showOptionalLabel":[4,"show-optional-label"],"showSearch":[4,"show-search"],"searchPlaceholder":[1,"search-placeholder"],"selectedItemColor":[1,"selected-item-color"],"selectedItemVariant":[1,"selected-item-variant"],"selectedItemWeight":[1,"selected-item-weight"],"anchorEl":[32],"hasFocus":[32],"popoverOpen":[32],"hasSelectedItem":[32]},[[0,"cpslSelectItemClick","selectItemClickHandler"],[0,"cpslOpen","onPopoverOpen"],[0,"cpslClose","onPopoverClose"]],{"selectedValue":["onValueChange","handleValueChange"]}],[1,"cpsl-file-upload",{"disabled":[516],"errorText":[1,"error-text"],"externalFilename":[1,"external-filename"],"externalSrc":[1,"external-src"],"fileTypes":[16],"helperText":[1,"helper-text"],"label":[1],"required":[4],"showOptionalLabel":[4,"show-optional-label"],"uploadFile":[16],"file":[32],"dragOver":[32],"dragError":[32],"isUploading":[32],"uploadError":[32]}],[1,"cpsl-auth-modal",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"noOverlay":[4,"no-overlay"],"open":[4],"zIndexOverride":[2,"z-index-override"],"hasFooter":[32],"isMobile":[32]},null,{"open":["toggleModal"]}],[1,"cpsl-alert",{"icon":[1],"noIcon":[4,"no-icon"],"variant":[1],"filled":[4]}],[1,"cpsl-checkbox",{"checked":[4]}],[1,"cpsl-code-input",{"code":[1025],"errorText":[1,"error-text"],"helperText":[1,"helper-text"],"length":[2],"type":[1]},null,{"code":["watchCodeProp"]}],[1,"cpsl-drawer",{"anchor":[1],"anchorPosition":[2,"anchor-position"],"noOverlay":[4,"no-overlay"],"open":[4],"size":[8],"transitionDuration":[2,"transition-duration"],"transitionFunction":[1,"transition-function"],"variant":[1],"zIndexOverride":[2,"z-index-override"],"closedAnchorPosition":[32],"showTransition":[32]}],[1,"cpsl-icon-group",{"expandFrom":[1,"expand-from"],"disabled":[4],"icons":[16],"isHovered":[32]}],[1,"cpsl-slide-button",{"disabled":[4],"endIcon":[1,"end-icon"],"endText":[1,"end-text"],"startIcon":[1,"start-icon"],"startText":[1,"start-text"]}],[1,"cpsl-table",{"hasHorizontalScroll":[32],"hasVerticalScroll":[32]}],[1,"cpsl-tile-button",{"disabled":[516],"src":[1],"icon":[1]}],[1,"cpsl-app-bar",{"height":[2],"position":[1],"zIndexOverride":[2,"z-index-override"]}],[1,"cpsl-avatar",{"alt":[1],"src":[1],"size":[1],"variant":[1]}],[1,"cpsl-divider"],[1,"cpsl-dropdown",{"width":[1],"hasCpslSearch":[4,"has-cpsl-search"],"items":[16],"selectedItem":[1040],"isOpen":[32],"searchQuery":[32],"filteredItems":[32]},[[9,"resize","handleResize"]],{"selectedItem":["handleSelectedItemChange"],"isOpen":["handleOpenChange"]}],[1,"cpsl-nav-button-group"],[1,"cpsl-pill",{"text":[1]}],[1,"cpsl-progress-indicator",{"totalSteps":[2,"total-steps"],"step":[2]}],[1,"cpsl-qr-code",{"url":[1],"imageSrc":[1,"image-src"],"size":[2],"icon":[1]}],[1,"cpsl-radio",{"checked":[4]}],[1,"cpsl-select-item",{"selected":[4],"value":[1]}],[1,"cpsl-switch",{"checked":[4]}],[1,"cpsl-tab",{"selected":[4],"tab":[1]},[[8,"cpslTabsChanged","onTabsChanged"],[8,"cpslTabsInit","onTabsInit"]]],[1,"cpsl-tabs",{"fullWidth":[4,"full-width"],"selectedTab":[1,"selected-tab"],"selectedTabRect":[32],"loaded":[32]},[[8,"cpslTabButtonSizeChange","onTabSizeChange"]],{"fullWidth":["updateSlider"],"selectedTab":["updateTab"]}],[1,"cpsl-button-group",{"selectedId":[1,"selected-id"]},null,{"selectedId":["selectItem"]}],[1,"cpsl-input",{"as":[1],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"noAutoDisable":[4,"no-auto-disable"],"autofocus":[4],"autoselect":[4],"disabled":[4],"contrastText":[4,"contrast-text"],"enterkeyhint":[1],"errorText":[1,"error-text"],"fitContent":[4,"fit-content"],"mask":[1],"isPhone":[4,"is-phone"],"helperText":[1,"helper-text"],"inputmode":[1],"label":[1],"max":[8],"maxlength":[2],"min":[8],"minlength":[2],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"showOptionalLabel":[4,"show-optional-label"],"spellcheck":[4],"startIconSrc":[1,"start-icon-src"],"startIcon":[1,"start-icon"],"step":[1],"type":[1],"value":[1025],"hasFocus":[32]},null,{"disabled":["handleDisable"],"mask":["handleSetupMask"],"value":["handleValueChange"]}],[1,"cpsl-popover",{"anchorEl":[16],"anchorOriginHorizontal":[1,"anchor-origin-horizontal"],"anchorOriginVertical":[1,"anchor-origin-vertical"],"autoWidth":[4,"auto-width"],"disabled":[4],"preventBlur":[4,"prevent-blur"],"transformOriginHorizontal":[1,"transform-origin-horizontal"],"transformOriginVertical":[1,"transform-origin-vertical"],"alignCenter":[4,"align-center"],"triggerAction":[1,"trigger-action"],"trigger":[1],"windowPadding":[2,"window-padding"],"open":[32],"hasSetInitialPosition":[32],"positionX":[32],"positionY":[32],"closePopover":[64]},null,{"trigger":["onTriggerChange"],"triggerAction":["onTriggerChange"],"preventBlur":["onTriggerChange"],"anchorOriginHorizontal":["onAnchorChange"],"anchorOriginVertical":["onAnchorChange"],"alignCenter":["onAnchorChange"],"open":["onOpenChange"]}],[1,"cpsl-button",{"as":[1],"disabled":[516],"pending":[4],"fullWidth":[4,"full-width"],"href":[1],"size":[1],"target":[1],"type":[1],"variant":[513]}],[1,"cpsl-card"],[1,"cpsl-overlay",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"open":[4],"zIndexOverride":[2,"z-index-override"]},null,{"open":["toggleHeight"]}],[1,"cpsl-spinner",{"variant":[1],"size":[2],"barColor":[1,"bar-color"],"barWidth":[2,"bar-width"],"speed":[2]}],[1,"cpsl-text",{"color":[1],"variant":[1],"weight":[1],"align":[1]}],[1,"cpsl-icon",{"src":[1],"size":[1],"invert":[4],"inset":[1],"icon":[1],"radius":[1],"background":[1],"color":[1],"border":[1]}]]]], options);
+  return bootstrapLazy([["cpsl-hero",[[1,"cpsl-hero",{"height":[2],"hideFadeOut":[4,"hide-fade-out"],"variant":[513],"title":[513],"subtitle":[513],"withDefaultTheme":[4,"with-default-theme"]}]]],["cpsl-modal-v2",[[1,"cpsl-modal-v2",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"elevated":[4],"noOverlay":[4,"no-overlay"],"open":[4],"zIndexOverride":[2,"z-index-override"]},null,{"open":["toggleHeight"]}]]],["cpsl-nav-button",[[1,"cpsl-nav-button",{"disabled":[516],"exactMainRouteMatch":[4,"exact-main-route-match"],"exactSubRouteMatch":[4,"exact-sub-route-match"],"route":[1],"subRoutes":[16],"path":[1]}]]],["cpsl-col",[[1,"cpsl-col",{"align":[1],"justify":[1],"gap":[8],"offset":[1],"offsetXs":[1,"offset-xs"],"offsetSm":[1,"offset-sm"],"offsetMd":[1,"offset-md"],"offsetLg":[1,"offset-lg"],"offsetXl":[1,"offset-xl"],"pull":[1],"pullXs":[1,"pull-xs"],"pullSm":[1,"pull-sm"],"pullMd":[1,"pull-md"],"pullLg":[1,"pull-lg"],"pullXl":[1,"pull-xl"],"push":[1],"pushXs":[1,"push-xs"],"pushSm":[1,"push-sm"],"pushMd":[1,"push-md"],"pushLg":[1,"push-lg"],"pushXl":[1,"push-xl"],"size":[1],"sizeXs":[1,"size-xs"],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"],"sizeXl":[1,"size-xl"]},[[9,"resize","onResize"]]]]],["cpsl-grid",[[1,"cpsl-grid",{"fixed":[4]}]]],["cpsl-identicon",[[1,"cpsl-identicon",{"hash":[1],"size":[1],"variant":[1],"arcWidth":[1,"arc-width"]}]]],["cpsl-info-box",[[1,"cpsl-info-box"]]],["cpsl-row",[[1,"cpsl-row",{"col":[4],"align":[1],"justify":[1],"gap":[8]}]]],["cpsl-alert_34",[[1,"cpsl-pagination",{"initialPage":[2,"initial-page"],"totalPages":[2,"total-pages"],"visiblePages":[1026,"visible-pages"],"currentPage":[32]},null,{"currentPage":["watchChange"]}],[1,"cpsl-select",{"anchorElId":[1,"anchor-el-id"],"autoWidth":[4,"auto-width"],"alignCenter":[4,"align-center"],"disabled":[4],"dropdownMaxHeight":[2,"dropdown-max-height"],"errorText":[1,"error-text"],"formatValue":[16],"helperText":[1,"helper-text"],"id":[1],"icon":[1],"label":[1],"multiple":[4],"noIconAnimation":[4,"no-icon-animation"],"placeholder":[1],"required":[4],"selectedValue":[1,"selected-value"],"showFormattedSelectedItem":[4,"show-formatted-selected-item"],"showOptionalLabel":[4,"show-optional-label"],"showSearch":[4,"show-search"],"searchPlaceholder":[1,"search-placeholder"],"selectedItemColor":[1,"selected-item-color"],"selectedItemVariant":[1,"selected-item-variant"],"selectedItemWeight":[1,"selected-item-weight"],"anchorEl":[32],"hasFocus":[32],"popoverOpen":[32],"hasSelectedItem":[32]},[[0,"cpslSelectItemClick","selectItemClickHandler"],[0,"cpslOpen","onPopoverOpen"],[0,"cpslClose","onPopoverClose"]],{"selectedValue":["onValueChange","handleValueChange"]}],[1,"cpsl-file-upload",{"disabled":[516],"errorText":[1,"error-text"],"externalFilename":[1,"external-filename"],"externalSrc":[1,"external-src"],"fileTypes":[16],"helperText":[1,"helper-text"],"label":[1],"required":[4],"showOptionalLabel":[4,"show-optional-label"],"uploadFile":[16],"file":[32],"dragOver":[32],"dragError":[32],"isUploading":[32],"uploadError":[32]}],[1,"cpsl-auth-modal",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"noOverlay":[4,"no-overlay"],"open":[4],"zIndexOverride":[2,"z-index-override"],"hasFooter":[32],"isMobile":[32]},null,{"open":["toggleModal"]}],[1,"cpsl-alert",{"icon":[1],"noIcon":[4,"no-icon"],"variant":[1],"filled":[4]}],[1,"cpsl-checkbox",{"checked":[4]}],[1,"cpsl-code-input",{"code":[1025],"errorText":[1,"error-text"],"helperText":[1,"helper-text"],"length":[2],"type":[1]},null,{"code":["watchCodeProp"]}],[1,"cpsl-drawer",{"anchor":[1],"anchorPosition":[2,"anchor-position"],"noOverlay":[4,"no-overlay"],"open":[4],"size":[8],"transitionDuration":[2,"transition-duration"],"transitionFunction":[1,"transition-function"],"variant":[1],"zIndexOverride":[2,"z-index-override"],"closedAnchorPosition":[32],"showTransition":[32]}],[1,"cpsl-icon-group",{"expandFrom":[1,"expand-from"],"disabled":[4],"icons":[16],"isHovered":[32]}],[1,"cpsl-slide-button",{"disabled":[4],"endIcon":[1,"end-icon"],"endText":[1,"end-text"],"startIcon":[1,"start-icon"],"startText":[1,"start-text"]}],[1,"cpsl-table",{"hasHorizontalScroll":[32],"hasVerticalScroll":[32]}],[1,"cpsl-tile-button",{"disabled":[516],"src":[1],"icon":[1]}],[1,"cpsl-app-bar",{"height":[2],"position":[1],"zIndexOverride":[2,"z-index-override"]}],[1,"cpsl-avatar",{"alt":[1],"src":[1],"size":[1],"variant":[1]}],[1,"cpsl-divider"],[1,"cpsl-dropdown",{"width":[1],"hasCpslSearch":[4,"has-cpsl-search"],"items":[16],"selectedItem":[1040],"isOpen":[32],"searchQuery":[32],"filteredItems":[32]},[[9,"resize","handleResize"]],{"selectedItem":["handleSelectedItemChange"],"isOpen":["handleOpenChange"]}],[1,"cpsl-nav-button-group"],[1,"cpsl-pill",{"text":[1]}],[1,"cpsl-progress-indicator",{"totalSteps":[2,"total-steps"],"step":[2]}],[1,"cpsl-qr-code",{"url":[1],"imageSrc":[1,"image-src"],"size":[2],"icon":[1]}],[1,"cpsl-radio",{"checked":[4]}],[1,"cpsl-select-item",{"selected":[4],"value":[1]}],[1,"cpsl-switch",{"checked":[4]}],[1,"cpsl-tab",{"selected":[4],"tab":[1]},[[8,"cpslTabsChanged","onTabsChanged"],[8,"cpslTabsInit","onTabsInit"]]],[1,"cpsl-tabs",{"fullWidth":[4,"full-width"],"selectedTab":[1,"selected-tab"],"selectedTabRect":[32],"loaded":[32]},[[8,"cpslTabButtonSizeChange","onTabSizeChange"]],{"fullWidth":["updateSlider"],"selectedTab":["updateTab"]}],[1,"cpsl-button-group",{"selectedId":[1,"selected-id"]},null,{"selectedId":["selectItem"]}],[1,"cpsl-input",{"as":[1],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"noAutoDisable":[4,"no-auto-disable"],"autofocus":[4],"autoselect":[4],"disabled":[4],"contrastText":[4,"contrast-text"],"enterkeyhint":[1],"errorText":[1,"error-text"],"fitContent":[4,"fit-content"],"mask":[1],"isPhone":[4,"is-phone"],"helperText":[1,"helper-text"],"inputmode":[1],"label":[1],"max":[8],"maxlength":[2],"min":[8],"minlength":[2],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"rows":[2],"showOptionalLabel":[4,"show-optional-label"],"spellcheck":[4],"startIconSrc":[1,"start-icon-src"],"startIcon":[1,"start-icon"],"step":[1],"type":[1],"value":[1025],"hasFocus":[32]},null,{"disabled":["handleDisable"],"mask":["handleSetupMask"],"value":["handleValueChange"]}],[1,"cpsl-popover",{"anchorEl":[16],"anchorOriginHorizontal":[1,"anchor-origin-horizontal"],"anchorOriginVertical":[1,"anchor-origin-vertical"],"autoWidth":[4,"auto-width"],"disabled":[4],"preventBlur":[4,"prevent-blur"],"transformOriginHorizontal":[1,"transform-origin-horizontal"],"transformOriginVertical":[1,"transform-origin-vertical"],"alignCenter":[4,"align-center"],"triggerAction":[1,"trigger-action"],"trigger":[1],"windowPadding":[2,"window-padding"],"open":[32],"hasSetInitialPosition":[32],"positionX":[32],"positionY":[32],"closePopover":[64]},null,{"trigger":["onTriggerChange"],"triggerAction":["onTriggerChange"],"preventBlur":["onTriggerChange"],"anchorOriginHorizontal":["onAnchorChange"],"anchorOriginVertical":["onAnchorChange"],"alignCenter":["onAnchorChange"],"open":["onOpenChange"]}],[1,"cpsl-button",{"as":[1],"disabled":[516],"pending":[4],"fullWidth":[4,"full-width"],"href":[1],"size":[1],"target":[1],"type":[1],"variant":[513],"cursor":[1]}],[1,"cpsl-card"],[1,"cpsl-overlay",{"enterTransitionDuration":[2,"enter-transition-duration"],"exitTransitionDuration":[2,"exit-transition-duration"],"open":[4],"zIndexOverride":[2,"z-index-override"]},null,{"open":["toggleHeight"]}],[1,"cpsl-spinner",{"variant":[1],"size":[2],"barColor":[1,"bar-color"],"barWidth":[2,"bar-width"],"speed":[2]}],[1,"cpsl-text",{"color":[1],"variant":[1],"weight":[1],"align":[1]}],[1,"cpsl-icon",{"src":[1],"size":[1],"invert":[4],"inset":[1],"icon":[1],"radius":[1],"background":[1],"color":[1],"border":[1]}]]]], options);
 });
 
 //# sourceMappingURL=capsule.js.map

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

@@ -6276,7 +6276,7 @@ const CpslAvatar = class {
 };
 CpslAvatar.style = CpslAvatarStyle0;
 
-const cpslButtonCss = ":host{--button-border-width:1px;--button-border-width-start:var(--button-border-width);--button-border-width-end:var(--button-border-width);--button-border-width-top:var(--button-border-width);--button-border-width-bottom:var(--button-border-width);--button-gap:8px;--button-justify-content:center;--button-border-radius-top-start:var(--button-border-radius);--button-border-radius-top-end:var(--button-border-radius);--button-border-radius-bottom-end:var(--button-border-radius);--button-border-radius-bottom-start:var(--button-border-radius);--button-padding-start:16px;--button-padding-end:16px;--button-icon-size:var(--cpls-font-size-body-l);--button-font-weight:500;--button-primary-color:var(--cpsl-color-primary-button-text);--button-primary-background-color:var(--cpsl-color-primary-button-surface-default);--button-primary-border-color:var(--cpsl-color-primary-button-border-default);--button-primary-icon-color:var(--cpsl-color-primary-button-text);--button-primary-disabled-color:var(--cpsl-color-text-disabled);--button-primary-disabled-background-color:var(--cpsl-color-primary-button-surface-disabled);--button-primary-disabled-border-color:var(--cpsl-color-primary-button-border-disabled);--button-primary-disabled-icon-color:var(--cpsl-color-text-disabled);--button-primary-hover-color:var(--cpsl-color-primary-button-text);--button-primary-hover-background-color:var(--cpsl-color-primary-button-surface-hover);--button-primary-hover-border-color:var(--cpsl-color-primary-button-surface-hover);--button-primary-hover-icon-color:var(--cpsl-color-primary-button-text);--button-primary-active-color:var(--cpsl-color-primary-button-text);--button-primary-active-background-color:var(--cpsl-color-primary-button-surface-pressed);--button-primary-active-border-color:var(--cpsl-color-primary-button-surface-pressed);--button-primary-active-icon-color:var(--cpsl-color-primary-button-text);--button-secondary-color:var(--cpsl-color-secondary-button-text);--button-secondary-background-color:var(--cpsl-color-secondary-button-surface-default);--button-secondary-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-disabled-color:var(--cpsl-color-text-disabled);--button-secondary-disabled-background-color:var(--cpsl-color-secondary-button-surface-disabled);--button-secondary-disabled-border-color:var(--cpsl-color-secondary-button-border-disabled);--button-secondary-disabled-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-hover-color:var(--cpsl-color-secondary-button-text);--button-secondary-hover-background-color:var(--cpsl-color-secondary-button-surface-hover);--button-secondary-hover-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-hover-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-active-color:var(--cpsl-color-secondary-button-text);--button-secondary-active-background-color:var(--cpsl-color-secondary-button-surface-pressed);--button-secondary-active-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-active-icon-color:var(--cpsl-color-secondary-button-text);--button-tertiary-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-background-color:var(--cpsl-color-tertiary-button-surface-default);--button-tertiary-border-color:var(--cpsl-color-tertiary-button-border-default);--button-tertiary-icon-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-disabled-color:var(--cpsl-color-text-disabled);--button-tertiary-disabled-background-color:var(--cpsl-color-tertiary-button-surface-disabled);--button-tertiary-disabled-border-color:var(--cpsl-color-tertiary-button-border-disabled);--button-tertiary-disabled-icon-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-hover-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-hover-background-color:var(--cpsl-color-tertiary-button-surface-hover);--button-tertiary-hover-border-color:var(--cpsl-color-tertiary-button-surface-hover);--button-tertiary-hover-icon-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-active-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-active-background-color:var(--cpsl-color-tertiary-button-surface-pressed);--button-tertiary-active-border-color:var(--cpsl-color-tertiary-button-surface-pressed);--button-tertiary-active-icon-color:var(--cpsl-color-tertiary-button-text);--button-ghost-color:var(--cpsl-color-ghost-button-default);--button-ghost-disabled-color:var(--cpsl-color-ghost-button-disabled);--button-ghost-hover-color:var(--cpsl-color-ghost-button-hover);--button-destructive-color:var(--cpsl-color-destructive-button-text);--button-destructive-background-color:var(--cpsl-color-destructive-button-surface-default);--button-destructive-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-disabled-color:var(--cpsl-color-text-disabled);--button-destructive-disabled-background-color:var(--cpsl-color-destructive-button-surface-disabled);--button-destructive-disabled-border-color:var(--cpsl-color-destructive-button-border-disabled);--button-destructive-disabled-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-hover-color:var(--cpsl-color-destructive-button-text);--button-destructive-hover-background-color:var(--cpsl-color-destructive-button-surface-hover);--button-destructive-hover-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-hover-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-active-color:var(--cpsl-color-destructive-button-text);--button-destructive-active-background-color:var(--cpsl-color-destructive-button-surface-pressed);--button-destructive-active-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-active-icon-color:var(--cpsl-color-destructive-button-text);height:fit-content;width:fit-content;display:inline-block;font-family:var(--cpsl-font-family, inherit);-webkit-tap-highlight-color:transparent}:host a{height:fit-content;width:auto !important}:host(.full-width){width:100%;display:block}:host(.full-width) .button-native{width:100%}:host(.xSmall){--button-font-size:var(--cpsl-font-size-body-xs);--button-padding-top:8px;--button-padding-bottom:8px;--button-icon-size:var(--cpsl-font-size-body-s);--button-border-radius:8px}:host(.xSmall.primary){--button-padding-top:9px;--button-padding-bottom:9px;--button-border-radius:8px}:host(.xSmall.secondary){--button-border-radius:8px}:host(.xSmall.tertiary){--button-padding-top:9px;--button-padding-bottom:9px;--button-border-radius:8px}:host(.small){--button-font-size:var(--cpsl-font-size-body-s);--button-padding-top:12px;--button-padding-bottom:12px;--button-icon-size:var(--cpsl-font-size-body-m)}:host(.small.primary){--button-padding-top:13px;--button-padding-bottom:13px}:host(.small.tertiary){--button-padding-top:13px;--button-padding-bottom:13px}:host(.medium){--button-font-size:var(--cpsl-font-size-body-m);--button-padding-top:14px;--button-padding-bottom:14px;--button-icon-size:var(--cpsl-font-size-body-l)}:host(.medium) :host(.primary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.medium) :host(.tertiary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.medium.primary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.medium.tertiary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.disabled){cursor:default;pointer-events:none}:host ::slotted(cpsl-icon){--height:var(--button-icon-size);--width:var(--button-icon-size)}:host(.primary){--button-border-radius:var(--cpsl-border-radius-primary-button);--button-color:var(--button-primary-color);--button-background-color:var(--button-primary-background-color);--button-border-color:var(--button-primary-border-color);--button-padding-start:17px;--button-padding-end:17px;--button-border-width:0px}:host(.primary) ::slotted(cpsl-icon){--icon-color:var(--button-primary-icon-color)}:host(.primary):host(.disabled){--button-color:var(--button-primary-disabled-color);--button-background-color:var(--button-primary-disabled-background-color);--button-border-color:var(--button-primary-disabled-border-color);--button-outline-color:transparent}:host(.primary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-primary-disabled-icon-color)}:host(.primary):host(.disabled) ::slotted(cpsl-spinner){--background-color:var(--button-primary-disabled-background-color)}:host(.primary) :not(.disabled):hover{--button-color:var(--button-primary-hover-color);--button-background-color:var(--button-primary-hover-background-color);--button-border-color:var(--button-primary-hover-border-color)}:host(.primary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-primary-hover-icon-color)}:host(.primary) :not(.disabled):active{--button-color:var(--button-primary-active-color);--button-background-color:var(--button-primary-active-background-color);--button-border-color:var(--button-primary-active-border-color)}:host(.primary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-primary-active-icon-color)}:host(.primary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-primary-button-outline)}:host(.secondary){--button-border-radius:var(--cpsl-border-radius-destructive-button);--button-color:var(--button-secondary-color);--button-background-color:var(--button-secondary-background-color);--button-border-color:var(--button-secondary-border-color)}:host(.secondary) ::slotted(cpsl-icon){--icon-color:var(--button-secondary-icon-color)}:host(.secondary):host(.disabled){--button-color:var(--button-secondary-disabled-color);--button-background-color:var(--button-secondary-disabled-background-color);--button-border-color:var(--button-secondary-disabled-border-color);--button-outline-color:transparent}:host(.secondary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-secondary-disabled-icon-color)}:host(.secondary):host(.disabled) ::slotted(cpsl-spinner){--background-color:var(--button-secondary-disabled-icon-color)}:host(.secondary) :not(.disabled):hover{--button-color:var(--button-secondary-hover-color);--button-border-color:var(--button-secondary-hover-border-color);--button-background-color:var(--button-secondary-hover-background-color)}:host(.secondary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-secondary-hover-icon-color)}:host(.secondary) :not(.disabled):active{--button-color:var(--button-secondary-active-color);--button-border-color:var(--button-secondary-active-border-color);--button-background-color:var(--button-secondary-active-background-color)}:host(.secondary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-secondary-active-icon-color)}:host(.secondary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-secondary-button-outline)}:host(.tertiary){--button-border-radius:var(--cpsl-border-radius-tertiary-button);--button-color:var(--button-tertiary-color);--button-background-color:var(--button-tertiary-background-color);--button-border-color:var(--button-tertiary-border-color);--button-padding-start:17px;--button-padding-end:17px;--button-border-width:0px}:host(.tertiary) ::slotted(cpsl-icon){--icon-color:var(--button-tertiary-icon-color)}:host(.tertiary):host(.disabled){--button-color:var(--button-tertiary-disabled-color);--button-background-color:var(--button-tertiary-disabled-background-color);--button-border-color:var(--button-tertiary-disabled-border-color);--button-outline-color:transparent}:host(.tertiary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-tertiary-disabled-icon-color)}:host(.tertiary):host(.disabled) ::slotted(cpsl-spinner){--background-color:var(--button-tertiary-disabled-icon-color)}:host(.tertiary) :not(.disabled):hover{--button-color:var(--button-tertiary-hover-color);--button-background-color:var(--button-tertiary-hover-background-color);--button-border-color:var(--button-tertiary-hover-border-color)}:host(.tertiary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-tertiary-hover-icon-color)}:host(.tertiary) :not(.disabled):active{--button-color:var(--button-tertiary-active-color);--button-background-color:var(--button-tertiary-active-background-color);--button-border-color:var(--button-tertiary-active-border-color)}:host(.tertiary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-tertiary-active-icon-color)}:host(.tertiary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-tertiary-button-outline)}:host(.ghost){--button-color:var(--button-ghost-color);--button-background-color:transparent;--button-border-color:transparent;--button-outline-color:transparent;--button-padding-start:0px;--button-padding-end:0px;--button-padding-top:0px;--button-padding-bottom:0px;--button-border-width:0px}:host(.ghost) ::slotted(cpsl-icon){--icon-color:var(--button-ghost-color)}:host(.ghost):host(.disabled){--button-color:var(--button-ghost-disabled-color)}:host(.ghost):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-ghost-disabled-color)}:host(.ghost):host(.disabled) ::slotted(cpsl-spinner){--background-color:var(--button-ghost-disabled-color)}:host(.ghost) :not(.disabled):hover{--button-color:var(--button-ghost-hover-color)}:host(.ghost) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-ghost-hover-color)}:host(.destructive){--button-border-radius:var(--cpsl-border-radius-secondary-button);--button-color:var(--button-destructive-color);--button-background-color:var(--button-destructive-background-color);--button-border-color:var(--button-destructive-border-color)}:host(.destructive) ::slotted(cpsl-icon){--icon-color:var(--button-destructive-icon-color)}:host(.destructive):host(.disabled){--button-color:var(--button-destructive-disabled-color);--button-background-color:var(--button-destructive-disabled-background-color);--button-border-color:var(--button-destructive-disabled-border-color);--button-outline-color:transparent}:host(.destructive):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-destructive-disabled-icon-color)}:host(.destructive) :not(.disabled):hover{--button-color:var(--button-destructive-hover-color);--button-border-color:var(--button-destructive-hover-border-color);--button-background-color:var(--button-destructive-hover-background-color)}:host(.destructive) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-destructive-hover-icon-color)}:host(.destructive) :not(.disabled):active{--button-color:var(--button-destructive-active-color);--button-border-color:var(--button-destructive-active-border-color);--button-background-color:var(--button-destructive-active-background-color)}:host(.destructive) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-destructive-active-icon-color)}:host(.destructive) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-destructive-button-outline)}.button-native{border-top-left-radius:var(--button-border-radius-top-start);border-top-right-radius:var(--button-border-radius-top-end);border-bottom-right-radius:var(--button-border-radius-bottom-end);border-bottom-left-radius:var(--button-border-radius-bottom-start);-webkit-padding-start:var(--button-padding-start);padding-inline-start:var(--button-padding-start);-webkit-padding-end:var(--button-padding-end);padding-inline-end:var(--button-padding-end);padding-top:var(--button-padding-top);padding-bottom:var(--button-padding-bottom);font-size:var(--button-font-size);font-weight:var(--button-font-weight);font-family:inherit;white-space:nowrap;text-decoration:none;border:0px solid transparent;border-width:var(--button-border-width-top) var(--button-border-width-end) var(--button-border-width-bottom) var(--button-border-width-start);cursor:pointer;color:var(--button-color);background:var(--button-background-color);border-color:var(--button-border-color);display:flex;justify-content:var(--button-justify-content);align-items:center;height:100%;gap:var(--button-gap);word-break:break-all;outline-color:var(--button-outline-color);-webkit-tap-highlight-color:transparent}:host-context([dir=rtl]) .button-native{border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}[dir=rtl] .button-native{border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}@supports selector(:dir(rtl)){.button-native:dir(rtl){border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}}:host ::slotted(cpsl-text){--color-override:var(--button-color)}:host ::slotted(cpsl-icon-group){--container-border-color:var(--button-background-color)}:host ::slotted(cpsl-spinner){--background-color:var(--button-background-color)}";
+const cpslButtonCss = ":host{--button-border-width:1px;--button-border-width-start:var(--button-border-width);--button-border-width-end:var(--button-border-width);--button-border-width-top:var(--button-border-width);--button-border-width-bottom:var(--button-border-width);--button-gap:8px;--button-justify-content:center;--button-border-radius-top-start:var(--button-border-radius);--button-border-radius-top-end:var(--button-border-radius);--button-border-radius-bottom-end:var(--button-border-radius);--button-border-radius-bottom-start:var(--button-border-radius);--button-padding-start:16px;--button-padding-end:16px;--button-icon-size:var(--cpls-font-size-body-l);--button-font-weight:500;--button-primary-color:var(--cpsl-color-primary-button-text);--button-primary-background-color:var(--cpsl-color-primary-button-surface-default);--button-primary-border-color:var(--cpsl-color-primary-button-border-default);--button-primary-icon-color:var(--cpsl-color-primary-button-text);--button-primary-disabled-color:var(--cpsl-color-text-disabled);--button-primary-disabled-background-color:var(--cpsl-color-primary-button-surface-disabled);--button-primary-disabled-border-color:var(--cpsl-color-primary-button-border-disabled);--button-primary-disabled-icon-color:var(--cpsl-color-text-disabled);--button-primary-hover-color:var(--cpsl-color-primary-button-text);--button-primary-hover-background-color:var(--cpsl-color-primary-button-surface-hover);--button-primary-hover-border-color:var(--cpsl-color-primary-button-surface-hover);--button-primary-hover-icon-color:var(--cpsl-color-primary-button-text);--button-primary-active-color:var(--cpsl-color-primary-button-text);--button-primary-active-background-color:var(--cpsl-color-primary-button-surface-pressed);--button-primary-active-border-color:var(--cpsl-color-primary-button-surface-pressed);--button-primary-active-icon-color:var(--cpsl-color-primary-button-text);--button-secondary-color:var(--cpsl-color-secondary-button-text);--button-secondary-background-color:var(--cpsl-color-secondary-button-surface-default);--button-secondary-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-disabled-color:var(--cpsl-color-text-disabled);--button-secondary-disabled-background-color:var(--cpsl-color-secondary-button-surface-disabled);--button-secondary-disabled-border-color:var(--cpsl-color-secondary-button-border-disabled);--button-secondary-disabled-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-hover-color:var(--cpsl-color-secondary-button-text);--button-secondary-hover-background-color:var(--cpsl-color-secondary-button-surface-hover);--button-secondary-hover-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-hover-icon-color:var(--cpsl-color-secondary-button-text);--button-secondary-active-color:var(--cpsl-color-secondary-button-text);--button-secondary-active-background-color:var(--cpsl-color-secondary-button-surface-pressed);--button-secondary-active-border-color:var(--cpsl-color-secondary-button-border-default);--button-secondary-active-icon-color:var(--cpsl-color-secondary-button-text);--button-tertiary-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-background-color:var(--cpsl-color-tertiary-button-surface-default);--button-tertiary-border-color:var(--cpsl-color-tertiary-button-border-default);--button-tertiary-icon-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-disabled-color:var(--cpsl-color-text-disabled);--button-tertiary-disabled-background-color:var(--cpsl-color-tertiary-button-surface-disabled);--button-tertiary-disabled-border-color:var(--cpsl-color-tertiary-button-border-disabled);--button-tertiary-disabled-icon-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-hover-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-hover-background-color:var(--cpsl-color-tertiary-button-surface-hover);--button-tertiary-hover-border-color:var(--cpsl-color-tertiary-button-surface-hover);--button-tertiary-hover-icon-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-active-color:var(--cpsl-color-tertiary-button-text);--button-tertiary-active-background-color:var(--cpsl-color-tertiary-button-surface-pressed);--button-tertiary-active-border-color:var(--cpsl-color-tertiary-button-surface-pressed);--button-tertiary-active-icon-color:var(--cpsl-color-tertiary-button-text);--button-ghost-color:var(--cpsl-color-ghost-button-default);--button-ghost-disabled-color:var(--cpsl-color-ghost-button-disabled);--button-ghost-hover-color:var(--cpsl-color-ghost-button-hover);--button-destructive-color:var(--cpsl-color-destructive-button-text);--button-destructive-background-color:var(--cpsl-color-destructive-button-surface-default);--button-destructive-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-disabled-color:var(--cpsl-color-text-disabled);--button-destructive-disabled-background-color:var(--cpsl-color-destructive-button-surface-disabled);--button-destructive-disabled-border-color:var(--cpsl-color-destructive-button-border-disabled);--button-destructive-disabled-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-hover-color:var(--cpsl-color-destructive-button-text);--button-destructive-hover-background-color:var(--cpsl-color-destructive-button-surface-hover);--button-destructive-hover-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-hover-icon-color:var(--cpsl-color-destructive-button-text);--button-destructive-active-color:var(--cpsl-color-destructive-button-text);--button-destructive-active-background-color:var(--cpsl-color-destructive-button-surface-pressed);--button-destructive-active-border-color:var(--cpsl-color-destructive-button-border-default);--button-destructive-active-icon-color:var(--cpsl-color-destructive-button-text);height:fit-content;width:fit-content;display:inline-block;font-family:var(--cpsl-font-family, inherit);-webkit-tap-highlight-color:transparent}:host a{height:fit-content;width:auto !important}:host(.full-width){width:100%;display:block}:host(.full-width) .button-native{width:100%}:host(.xSmall){--button-font-size:var(--cpsl-font-size-body-xs);--button-padding-top:8px;--button-padding-bottom:8px;--button-icon-size:var(--cpsl-font-size-body-s);--button-border-radius:8px}:host(.xSmall.primary){--button-padding-top:9px;--button-padding-bottom:9px;--button-border-radius:8px}:host(.xSmall.secondary){--button-border-radius:8px}:host(.xSmall.tertiary){--button-padding-top:9px;--button-padding-bottom:9px;--button-border-radius:8px}:host(.small){--button-font-size:var(--cpsl-font-size-body-s);--button-padding-top:12px;--button-padding-bottom:12px;--button-icon-size:var(--cpsl-font-size-body-m)}:host(.small.primary){--button-padding-top:13px;--button-padding-bottom:13px}:host(.small.tertiary){--button-padding-top:13px;--button-padding-bottom:13px}:host(.medium){--button-font-size:var(--cpsl-font-size-body-m);--button-padding-top:14px;--button-padding-bottom:14px;--button-icon-size:var(--cpsl-font-size-body-l)}:host(.medium) :host(.primary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.medium) :host(.tertiary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.medium.primary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.medium.tertiary){--button-padding-top:15px;--button-padding-bottom:15px}:host(.disabled){cursor:default;pointer-events:none}:host ::slotted(cpsl-icon){--height:var(--button-icon-size);--width:var(--button-icon-size)}:host(.primary){--button-border-radius:var(--cpsl-border-radius-primary-button);--button-color:var(--button-primary-color);--button-background-color:var(--button-primary-background-color);--button-border-color:var(--button-primary-border-color);--button-padding-start:17px;--button-padding-end:17px;--button-border-width:0px}:host(.primary) ::slotted(cpsl-icon){--icon-color:var(--button-primary-icon-color)}:host(.primary):host(.disabled){--button-color:var(--button-primary-disabled-color);--button-background-color:var(--button-primary-disabled-background-color);--button-border-color:var(--button-primary-disabled-border-color);--button-outline-color:transparent}:host(.primary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-primary-disabled-icon-color)}:host(.primary):host(.disabled) ::slotted(cpsl-spinner){--background-color:var(--button-primary-disabled-background-color)}:host(.primary) :not(.disabled):hover{--button-color:var(--button-primary-hover-color);--button-background-color:var(--button-primary-hover-background-color);--button-border-color:var(--button-primary-hover-border-color)}:host(.primary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-primary-hover-icon-color)}:host(.primary) :not(.disabled):active{--button-color:var(--button-primary-active-color);--button-background-color:var(--button-primary-active-background-color);--button-border-color:var(--button-primary-active-border-color)}:host(.primary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-primary-active-icon-color)}:host(.primary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-primary-button-outline)}:host(.secondary){--button-border-radius:var(--cpsl-border-radius-destructive-button);--button-color:var(--button-secondary-color);--button-background-color:var(--button-secondary-background-color);--button-border-color:var(--button-secondary-border-color)}:host(.secondary) ::slotted(cpsl-icon){--icon-color:var(--button-secondary-icon-color)}:host(.secondary):host(.disabled){--button-color:var(--button-secondary-disabled-color);--button-background-color:var(--button-secondary-disabled-background-color);--button-border-color:var(--button-secondary-disabled-border-color);--button-outline-color:transparent}:host(.secondary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-secondary-disabled-icon-color)}:host(.secondary):host(.disabled) ::slotted(cpsl-spinner){--background-color:var(--button-secondary-disabled-icon-color)}:host(.secondary) :not(.disabled):hover{--button-color:var(--button-secondary-hover-color);--button-border-color:var(--button-secondary-hover-border-color);--button-background-color:var(--button-secondary-hover-background-color)}:host(.secondary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-secondary-hover-icon-color)}:host(.secondary) :not(.disabled):active{--button-color:var(--button-secondary-active-color);--button-border-color:var(--button-secondary-active-border-color);--button-background-color:var(--button-secondary-active-background-color)}:host(.secondary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-secondary-active-icon-color)}:host(.secondary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-secondary-button-outline)}:host(.tertiary){--button-border-radius:var(--cpsl-border-radius-tertiary-button);--button-color:var(--button-tertiary-color);--button-background-color:var(--button-tertiary-background-color);--button-border-color:var(--button-tertiary-border-color);--button-padding-start:17px;--button-padding-end:17px;--button-border-width:0px}:host(.tertiary) ::slotted(cpsl-icon){--icon-color:var(--button-tertiary-icon-color)}:host(.tertiary):host(.disabled){--button-color:var(--button-tertiary-disabled-color);--button-background-color:var(--button-tertiary-disabled-background-color);--button-border-color:var(--button-tertiary-disabled-border-color);--button-outline-color:transparent}:host(.tertiary):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-tertiary-disabled-icon-color)}:host(.tertiary):host(.disabled) ::slotted(cpsl-spinner){--background-color:var(--button-tertiary-disabled-icon-color)}:host(.tertiary) :not(.disabled):hover{--button-color:var(--button-tertiary-hover-color);--button-background-color:var(--button-tertiary-hover-background-color);--button-border-color:var(--button-tertiary-hover-border-color)}:host(.tertiary) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-tertiary-hover-icon-color)}:host(.tertiary) :not(.disabled):active{--button-color:var(--button-tertiary-active-color);--button-background-color:var(--button-tertiary-active-background-color);--button-border-color:var(--button-tertiary-active-border-color)}:host(.tertiary) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-tertiary-active-icon-color)}:host(.tertiary) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-tertiary-button-outline)}:host(.ghost){--button-color:var(--button-ghost-color);--button-background-color:transparent;--button-border-color:transparent;--button-outline-color:transparent;--button-padding-start:0px;--button-padding-end:0px;--button-padding-top:0px;--button-padding-bottom:0px;--button-border-width:0px}:host(.ghost) ::slotted(cpsl-icon){--icon-color:var(--button-ghost-color)}:host(.ghost):host(.disabled){--button-color:var(--button-ghost-disabled-color)}:host(.ghost):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-ghost-disabled-color)}:host(.ghost):host(.disabled) ::slotted(cpsl-spinner){--background-color:var(--button-ghost-disabled-color)}:host(.ghost) :not(.disabled):hover{--button-color:var(--button-ghost-hover-color)}:host(.ghost) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-ghost-hover-color)}:host(.destructive){--button-border-radius:var(--cpsl-border-radius-secondary-button);--button-color:var(--button-destructive-color);--button-background-color:var(--button-destructive-background-color);--button-border-color:var(--button-destructive-border-color)}:host(.destructive) ::slotted(cpsl-icon){--icon-color:var(--button-destructive-icon-color)}:host(.destructive):host(.disabled){--button-color:var(--button-destructive-disabled-color);--button-background-color:var(--button-destructive-disabled-background-color);--button-border-color:var(--button-destructive-disabled-border-color);--button-outline-color:transparent}:host(.destructive):host(.disabled) ::slotted(cpsl-icon){--icon-color:var(--button-destructive-disabled-icon-color)}:host(.destructive) :not(.disabled):hover{--button-color:var(--button-destructive-hover-color);--button-border-color:var(--button-destructive-hover-border-color);--button-background-color:var(--button-destructive-hover-background-color)}:host(.destructive) :not(.disabled):hover ::slotted(cpsl-icon){--icon-color:var(--button-destructive-hover-icon-color)}:host(.destructive) :not(.disabled):active{--button-color:var(--button-destructive-active-color);--button-border-color:var(--button-destructive-active-border-color);--button-background-color:var(--button-destructive-active-background-color)}:host(.destructive) :not(.disabled):active ::slotted(cpsl-icon){--icon-color:var(--button-destructive-active-icon-color)}:host(.destructive) :not(.disabled):focus-visible{--button-outline-color:var(--cpsl-color-destructive-button-outline)}.button-native{border-top-left-radius:var(--button-border-radius-top-start);border-top-right-radius:var(--button-border-radius-top-end);border-bottom-right-radius:var(--button-border-radius-bottom-end);border-bottom-left-radius:var(--button-border-radius-bottom-start);-webkit-padding-start:var(--button-padding-start);padding-inline-start:var(--button-padding-start);-webkit-padding-end:var(--button-padding-end);padding-inline-end:var(--button-padding-end);padding-top:var(--button-padding-top);padding-bottom:var(--button-padding-bottom);font-size:var(--button-font-size);font-weight:var(--button-font-weight);font-family:inherit;white-space:nowrap;text-decoration:none;border:0px solid transparent;border-width:var(--button-border-width-top) var(--button-border-width-end) var(--button-border-width-bottom) var(--button-border-width-start);cursor:var(--cursor);color:var(--button-color);background:var(--button-background-color);border-color:var(--button-border-color);display:flex;justify-content:var(--button-justify-content);align-items:center;height:100%;gap:var(--button-gap);word-break:break-all;outline-color:var(--button-outline-color);-webkit-tap-highlight-color:transparent}:host-context([dir=rtl]) .button-native{border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}[dir=rtl] .button-native{border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}@supports selector(:dir(rtl)){.button-native:dir(rtl){border-top-left-radius:var(--button-border-radius-top-end);border-top-right-radius:var(--button-border-radius-top-start);border-bottom-right-radius:var(--button-border-radius-bottom-start);border-bottom-left-radius:var(--button-border-radius-bottom-end)}}:host ::slotted(cpsl-text){--color-override:var(--button-color)}:host ::slotted(cpsl-icon-group){--container-border-color:var(--button-background-color)}:host ::slotted(cpsl-spinner){--background-color:var(--button-background-color)}";
 const CpslButtonStyle0 = cpslButtonCss;
 
 const CpslButton = class {
@@ -6291,9 +6291,10 @@ const CpslButton = class {
         this.target = undefined;
         this.type = 'button';
         this.variant = 'primary';
+        this.cursor = 'pointer';
     }
     render() {
-        return (h(Host, { key: '8f65c32aa3f0bcfcdf621ea1c1b4b4b383b28850', class: {
+        return (h(Host, { key: 'fcd0f4096d5adddb33fe44e08ea04c444fed2259', class: {
                 // VARIANTS
                 'primary': this.variant === 'primary',
                 'secondary': this.variant === 'secondary',
@@ -6307,7 +6308,9 @@ const CpslButton = class {
                 'xSmall': this.size === 'xSmall',
                 'small': this.size === 'small',
                 'medium': this.size === 'medium',
-            } }, h(this.as, { key: '1079c5db34801176d0aa51aaa02613a2357494fb', href: this.href, target: this.target, part: "button-native", class: "button-native", type: this.type, disabled: this.disabled || this.pending }, h("slot", { key: 'f5eaff65f6243b2506557e0cc2797217baa31db7', name: "start" }), this.pending ? h("cpsl-spinner", { size: 19 }) : h("slot", null), h("slot", { key: '257554b7f318af94ac762003129aa13f3b446767', name: "end" }))));
+            }, style: {
+                '--cursor': this.cursor,
+            } }, h(this.as, { key: 'eff6ced646a622136d327ea34757d5e7d0c60dad', href: this.href, target: this.target, part: "button-native", class: "button-native", type: this.type, disabled: this.disabled || this.pending }, h("slot", { key: '08576c52271953e12fc9acfeccb1bcf751edff02', name: "start" }), this.pending ? h("cpsl-spinner", { size: 19 }) : h("slot", null), h("slot", { key: 'a1a8c6048339639af08999de24758f031275ad14', name: "end" }))));
     }
 };
 CpslButton.style = CpslButtonStyle0;
@@ -21879,6 +21882,7 @@ const CpslSelect = class {
         this.inputId = `cpsl-select-${inputIds++}`;
         this.onBlur = (ev) => {
             this.hasFocus = false;
+            // eslint-disable-next-line @typescript-eslint/no-floating-promises -- fire-and-forget: close popover on blur
             this.popoverEl.closePopover();
             this.cpslBlur.emit(ev);
         };
@@ -21963,6 +21967,7 @@ const CpslSelect = class {
     }
     onValueChange() {
         if (!this.multiple) {
+            // eslint-disable-next-line @typescript-eslint/no-floating-promises -- fire-and-forget: close popover on value change
             this.popoverEl.closePopover();
         }
     }
@@ -21986,10 +21991,10 @@ const CpslSelect = class {
     render() {
         var _a, _b, _c, _d, _e;
         const selectedValueAsString = Array.isArray(this.selectedValue) ? this.selectedValue.join(', ') : this.selectedValue;
-        return (h(Host, { key: '18900dc2127936e4cd74c736234287d3a9c4f5d6', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': this.hasSelectedItem } }, this.label && (h("label", { key: '84edbb138188860c4b53d6bb5414529e0981c6ac', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: 'ab6f0e73fb1fc392fb6a37a364334e841c51e4f1', part: "select-container", id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onClick: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: '227f6bc64a4caf1ab62eb721abcff785f52c900a', name: "selected-item" }), h("div", { key: '6085a10a607168ce5804f0d0c10856509ec309db', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: '952821d6eb180709bf6484a1e5a201b1173c8e50', class: { 'selected-text': true, 'placeholder': !this.selectedValue }, part: "selected-text", color: this.selectedItemColor, variant: this.selectedItemVariant, weight: this.selectedItemWeight }, !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 : selectedValueAsString)))), this.icon && this.icon !== null && (h("cpsl-icon", { key: 'ebc48a455be06e7423f46cd1cbc9794ac9f7158a', part: "icon", class: { 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': this.hasSelectedItem }, icon: this.icon })), h("input", { key: '3e754fbb61ed2b895d100eac6c066965ccb019d4', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" }), h("cpsl-popover", { key: 'a8213a89bfd08f45839402e7bea33df24331eadd', part: "popover", autoWidth: this.autoWidth, alignCenter: this.alignCenter, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '1850448668be81bab36fa485a4ca9efc8a6f42c3', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: 'f4d86eada1ab15fdc1e5c40f177c740ea402854c', class: "search-container" }, h("cpsl-input", { key: '5eac08c4bf0d58f52f393cf7fe709ea7104e567c', onClick: e => e.stopPropagation(), placeholder: (_d = this.searchPlaceholder) !== null && _d !== void 0 ? _d : 'Search', value: "", onCpslInput: e => {
+        return (h(Host, { key: '1e4dc20d7f2dc7844dd956c110cc5a2757ddb752', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': this.hasSelectedItem } }, this.label && (h("label", { key: '4af1f907313f9e095c706fbab2c236c8e9d47237', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: '98558fb18b2bfc48b5bf23021a46f9755decaaaf', part: "select-container", id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onClick: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: 'dd8f8e9e87137bdd3cd4607d869e616eb7c9b9c4', name: "selected-item" }), h("div", { key: 'b9ec417b3f67037837f948792511f80e842df799', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: '62dd60c821f9d94c00fddf30af34e64de2e345c8', class: { 'selected-text': true, 'placeholder': !this.selectedValue }, part: "selected-text", color: this.selectedItemColor, variant: this.selectedItemVariant, weight: this.selectedItemWeight }, !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 : selectedValueAsString)))), this.icon && this.icon !== null && (h("cpsl-icon", { key: '56c75234d0ba048b23a3bf41d751f70a23f85041', part: "icon", class: { 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': this.hasSelectedItem }, icon: this.icon })), h("input", { key: '65b85ee9df8fbb62b82470c0991428bdf67d5437', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" }), h("cpsl-popover", { key: '751bfe385c3ca95cae0fe2eef9c03a779d6125b1', part: "popover", autoWidth: this.autoWidth, alignCenter: this.alignCenter, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '0b6913238a58fe19a918d1eac7ee09b2f7570ec3', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: '388d404c0ebbbfb922056f052511fdfc99f3d702', class: "search-container" }, h("cpsl-input", { key: 'e254975df404b4216c3318d5e626468e6350620c', onClick: e => e.stopPropagation(), placeholder: (_d = this.searchPlaceholder) !== null && _d !== void 0 ? _d : 'Search', value: "", onCpslInput: e => {
                 e.stopPropagation();
                 this.cpslSearchChange.emit(e.detail.value);
-            } }))), h("div", { key: '98be2ccca9d4f3393b375a6be57ecb994f208d63', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: '4b144f409037e0e19542bd01f360812afcbdeb8e', name: "items" }))))), (this.errorText || this.helperText) && (h("div", { key: '1ad20642e98bc4b530ba3831d721f4e5602301b7', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: 'c78382be9cba907cd2d8400d8602ceebb523b8b5' }, (_e = this.errorText) !== null && _e !== void 0 ? _e : this.helperText)))));
+            } }))), h("div", { key: 'b847a13c07e671d596eaa728e431423f7d3c2e4b', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: 'b6bafa1999a354a717a008a918ceccc67faeb9c2', name: "items" }))))), (this.errorText || this.helperText) && (h("div", { key: 'cfe5b3c706560be4de6e59916e554c95de461e92', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: '7bff30a43bedaed3df56de1f826f33957163a6ef' }, (_e = this.errorText) !== null && _e !== void 0 ? _e : this.helperText)))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {