npm - @usecapsule/core-components - Versions diffs - 3.5.0 → 3.5.1-dev.2 - Mend

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

Files changed (129) hide show

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

@@ -56,7 +56,9 @@ export class CpslSelect {
         this.formatValue = undefined;
         this.helperText = undefined;
         this.id = `${this.inputId}-trigger`;
+        this.icon = 'chevronUp';
         this.label = undefined;
+        this.noIconAnimation = undefined;
         this.placeholder = undefined;
         this.required = false;
         this.selectedValue = undefined;
@@ -87,10 +89,10 @@ export class CpslSelect {
     }
     render() {
         var _a, _b, _c, _d, _e;
-        return (h(Host, { key: '6a81638f5f4fc6a4904bfb01474124b5534e7515', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.selectedValue) } }, this.label && (h("label", { key: '1b1e485332bedaf9d63131a61ecedde9cc510b96', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: '2d67247a261f54a307f740623892087ddf8df59e', id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onMouseDown: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: '6b4ac55de19f37c930990f434c6c75375942b5ce', name: "selected-item" }), h("div", { key: 'd55ee9754b382167d1dda4c4f6b6b9440331e723', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: '45836ee164ea1a35e669f3953b6f413fcef138aa', class: { 'selected-text': true, 'placeholder': !this.selectedValue } }, !this.selectedValue ? ((_a = this.placeholder) !== null && _a !== void 0 ? _a : 'Select') : ((_c = (_b = this.formatValue) === null || _b === void 0 ? void 0 : _b.call(this, this.selectedValue)) !== null && _c !== void 0 ? _c : this.selectedValue)))), h("cpsl-icon", { key: 'cd12c1f52e9db3451bcc2bdc332763ab31b589f2', class: { 'chevron': true, 'open': this.popoverOpen, 'has-value': Boolean(this.selectedValue) }, icon: "chevronUp" }), h("input", { key: 'db9e60e27e935e941c9e18496fb6081c13d9ac93', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" })), (this.errorText || this.helperText) && (h("div", { key: '6322d6bbcd082a80deb2addcb5a490b2540749a4', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: 'd84673209ebace8a213866b5ba8f8ded5122fbd9' }, (_d = this.errorText) !== null && _d !== void 0 ? _d : this.helperText))), h("cpsl-popover", { key: 'ae8543628b0426d66f2c74b8c05d7fa108495c14', part: "popover", autoWidth: this.autoWidth, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '793a2efe39d096a6b60cabab4918faf275eff398', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: 'd4d1249ee84a5cad5555c1bb48b699a8c78bcebe', class: "search-container" }, h("cpsl-input", { key: '03fa4e3e71014bdd6247634eff47620a89fc1346', onClick: e => e.stopPropagation(), placeholder: (_e = this.searchPlaceholder) !== null && _e !== void 0 ? _e : 'Search', value: "", onCpslInput: e => {
+        return (h(Host, { key: '2b9aed2c27bd315180dbe84ea0fada27c841db10', id: this.id, class: { 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.selectedValue) } }, this.label && (h("label", { key: '1960291b282ec415da6ff925c833dcc284fd6355', class: "label", htmlFor: this.inputId }, this.label, this.required ? '*' : ' ', !this.required && this.showOptionalLabel ? h("span", { class: "optional-label" }, "(optional)") : '')), h("div", { key: '18a1b68bf0f44075b6561f6877c6d1d1c2a2f0b0', part: "select-container", id: "select-container", class: { 'select-container': true, 'error-container': Boolean(this.errorText) }, onMouseDown: this.handleClick }, this.hasSelectedItem && this.showFormattedSelectedItem && h("slot", { key: '5e08be6aebc9dad1b3c9ef289a2ed7567ee3a15e', name: "selected-item" }), h("div", { key: '9842c7277c4f7fa7c7d442cce8c33069b2424c40', class: { 'selected-container-content': true, 'hidden': this.hasSelectedItem && this.showFormattedSelectedItem }, id: "selected-container-content", style: {} }, (!this.hasSelectedItem || !this.showFormattedSelectedItem) && (h("cpsl-text", { key: 'afe5e9c9948691a2f18112dff1d21ae7e1d5a7cc', class: { 'selected-text': true, 'placeholder': !this.selectedValue } }, !this.selectedValue ? ((_a = this.placeholder) !== null && _a !== void 0 ? _a : 'Select') : ((_c = (_b = this.formatValue) === null || _b === void 0 ? void 0 : _b.call(this, this.selectedValue)) !== null && _c !== void 0 ? _c : this.selectedValue)))), h("cpsl-icon", { key: '7488f111c9acbe6bdc4be47c075ac502abf6c83a', part: "icon", class: { 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': Boolean(this.selectedValue) }, icon: this.icon }), h("input", { key: 'c9a5d5ed87b0a5d73e3614308e52444513287726', id: this.inputId, disabled: this.disabled, class: { disabled: this.disabled }, value: this.selectedValue, onFocus: this.onFocus, onBlur: this.onBlur, onKeyPress: this.handleEnterPress, inputmode: "none" })), (this.errorText || this.helperText) && (h("div", { key: '3dbaa76a9d6c29555a2cc8434eaff632deed037e', class: { 'helper-text-container': true, 'error-text': Boolean(this.errorText) } }, h("span", { key: '470a69fda9e2f79c94b2a15c4652a937f478f3d6' }, (_d = this.errorText) !== null && _d !== void 0 ? _d : this.helperText))), h("cpsl-popover", { key: 'e9b0325be7b95c4dd43607d85602db4e6ecd841f', part: "popover", autoWidth: this.autoWidth, trigger: this.id, preventBlur: this.hasFocus, disabled: this.disabled, anchorEl: this.anchorEl }, h("div", { key: '7e92585b0fd33a8ece0d1f1c056607283f576143', part: "dropdown", class: "dropdown" }, this.showSearch && (h("div", { key: 'bbba133e60ea9a402827da9e929696dd0f2d19a4', class: "search-container" }, h("cpsl-input", { key: '5fd037f49ce0a29eca6ce150beebe017ca1c0dec', onClick: e => e.stopPropagation(), placeholder: (_e = this.searchPlaceholder) !== null && _e !== void 0 ? _e : 'Search', value: "", onCpslInput: e => {
                 e.stopPropagation();
                 this.cpslSearchChange.emit(e.detail.value);
-            } }))), h("div", { key: '703ef09d6b630caac1573c16bbdca7d52a2e8277', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: 'd4ae08aeadc9057ec4b3c40454bf3b619b0f4e6b', name: "items" }))))));
+            } }))), h("div", { key: 'da8349c860028d188e3c17c971a5b8803ac1cc7d', class: "dropdown-inner", style: { maxHeight: `${this.dropdownMaxHeight}px` } }, h("slot", { key: 'b7e7e806d332025b063e47b7060167b0617fecf4', name: "items" }))))));
     }
     static get is() { return "cpsl-select"; }
     static get encapsulation() { return "shadow"; }
@@ -243,6 +245,30 @@ export class CpslSelect {
                 "reflect": false,
                 "defaultValue": "`${this.inputId}-trigger`"
             },
+            "icon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "IconType",
+                    "resolved": "\"search\" | \"alertCircle\" | \"alertTriangle\" | \"angelListBrand\" | \"angelList\" | \"appleBrand\" | \"apple\" | \"arrowCircleBrokenDownLeft\" | \"arrowCircleDownFilled\" | \"arrowNarrow\" | \"arrow\" | \"backupKit\" | \"bank\" | \"brush\" | \"capsuleLogo\" | \"capsuleRingsDark\" | \"capsuleRings\" | \"capsule\" | \"checkCircleFilled\" | \"checkCircle\" | \"check\" | \"chevronDown\" | \"chevronSelectorVertical\" | \"chevronUp\" | \"clock\" | \"close\" | \"clubhouseBrand\" | \"clubhouse\" | \"copy\" | \"cosmos\" | \"creditCard02\" | \"creditCard\" | \"cube\" | \"decentBrand\" | \"decent\" | \"discordBrand\" | \"discord\" | \"dot\" | \"downloadCloud\" | \"download\" | \"dribbbleBrand\" | \"dribbble\" | \"earth\" | \"edit02\" | \"ethereum\" | \"eyeOff\" | \"eye\" | \"facebookBrand\" | \"facebook\" | \"farcasterBrand\" | \"farcaster\" | \"figmaBrand\" | \"figma\" | \"file\" | \"folder\" | \"githubBrand\" | \"github\" | \"globe\" | \"googleBrand\" | \"google\" | \"helpCircle\" | \"heroAlertCircle\" | \"heroCheckmarkCapsule\" | \"heroCheckmark\" | \"heroEmail\" | \"heroExternalConnection\" | \"heroLock\" | \"heroPasskey\" | \"heroPhone\" | \"heroPlusCircleCapsule\" | \"heroPlusCircle\" | \"heroWallet\" | \"home\" | \"image\" | \"infoCircle\" | \"instagramBrand\" | \"instagram\" | \"key\" | \"lightning01\" | \"lightning\" | \"linkExternal\" | \"linkedinBrand\" | \"linkedin\" | \"logOut\" | \"mail\" | \"menu\" | \"moonpayBrand\" | \"moreLoginOptions\" | \"phone\" | \"pintrestBrand\" | \"pintrest\" | \"plusCircle\" | \"plus\" | \"polygon\" | \"puzzlePiece\" | \"qrCode02\" | \"qrCode\" | \"rampNetworkBrand\" | \"rampNetwork\" | \"redditBrand\" | \"reddit\" | \"refresh\" | \"send\" | \"settings\" | \"shield\" | \"signalBrand\" | \"signal\" | \"snapchatBrand\" | \"snapchat\" | \"solana\" | \"star04Filled\" | \"stars\" | \"stripeBrand\" | \"telegramBrand\" | \"telegram\" | \"tikTokBrand\" | \"tikTok\" | \"tumblrBrand\" | \"tumblr\" | \"twitterBrand\" | \"twitter\" | \"user\" | \"wallet\" | \"x\" | \"youtubeBrand\" | \"youtube\" | \"AD\" | \"AE\" | \"AF\" | \"AG\" | \"AI\" | \"AL\" | \"AM\" | \"AO\" | \"AR\" | \"AS\" | \"AT\" | \"AU\" | \"AW\" | \"AX\" | \"AZ\" | \"BA\" | \"BB\" | \"BD\" | \"BE\" | \"BF\" | \"BG\" | \"BH\" | \"BI\" | \"BJ\" | \"BL\" | \"BM\" | \"BN\" | \"BO\" | \"BQ\" | \"BQ2\" | \"BQ3\" | \"BR\" | \"BS\" | \"BT\" | \"BW\" | \"BY\" | \"BZ\" | \"CA\" | \"CC\" | \"CD\" | \"CD2\" | \"CF\" | \"CH\" | \"CK\" | \"CL\" | \"CM\" | \"CN\" | \"CO\" | \"CR\" | \"CU\" | \"CW\" | \"CX\" | \"CY\" | \"CZ\" | \"DE\" | \"DJ\" | \"DK\" | \"DM\" | \"DO\" | \"DS\" | \"DZ\" | \"EC\" | \"EE\" | \"EG\" | \"EH\" | \"ER\" | \"ES\" | \"ET\" | \"FI\" | \"FJ\" | \"FK\" | \"FM\" | \"FO\" | \"FR\" | \"GA\" | \"GB2\" | \"GB\" | \"GD\" | \"GE\" | \"GG\" | \"GH\" | \"GI\" | \"GL\" | \"GM\" | \"GN\" | \"GQ\" | \"GR\" | \"GT\" | \"GU\" | \"GW\" | \"GY\" | \"HK\" | \"HN\" | \"HR\" | \"HT\" | \"HU\" | \"ID\" | \"IE\" | \"IL\" | \"IM\" | \"IN\" | \"IO\" | \"IQ\" | \"IR\" | \"IS\" | \"IT\" | \"JE\" | \"JM\" | \"JO\" | \"JP\" | \"KE\" | \"KG\" | \"KH\" | \"KI\" | \"KM\" | \"KN\" | \"KP\" | \"KR\" | \"KW\" | \"KY\" | \"KZ\" | \"LA\" | \"LB\" | \"LC\" | \"LI\" | \"LK\" | \"LR\" | \"LS\" | \"LT\" | \"LU\" | \"LV\" | \"LY\" | \"MA\" | \"MC\" | \"MD\" | \"ME\" | \"MG\" | \"MH\" | \"MK\" | \"ML\" | \"MM\" | \"MN\" | \"MO\" | \"MP\" | \"MQ\" | \"MR\" | \"MS\" | \"MT\" | \"MU\" | \"MV\" | \"MW\" | \"MX\" | \"MY\" | \"MZ\" | \"NA\" | \"NE\" | \"NF\" | \"NG\" | \"NI\" | \"NL\" | \"NO\" | \"NP\" | \"NR\" | \"NU\" | \"NZ\" | \"OM\" | \"PA\" | \"PE\" | \"PF\" | \"PG\" | \"PH\" | \"PK\" | \"PL\" | \"PN\" | \"PR\" | \"PS\" | \"PT\" | \"PW\" | \"PY\" | \"QA\" | \"RO\" | \"RS\" | \"RU\" | \"RW\" | \"SA\" | \"SB\" | \"SC\" | \"SE\" | \"SG\" | \"SI\" | \"SK\" | \"SL\" | \"SM\" | \"SN\" | \"SO\" | \"SR\" | \"SS\" | \"ST\" | \"SV\" | \"SX\" | \"SY\" | \"SZ\" | \"TC\" | \"TD\" | \"TG\" | \"TH\" | \"TJ\" | \"TK\" | \"TL\" | \"TM\" | \"TN\" | \"TO\" | \"TR\" | \"TT\" | \"TV\" | \"TW\" | \"TZ\" | \"UA\" | \"UG\" | \"US\" | \"UY\" | \"UZ\" | \"VC\" | \"VE\" | \"VG\" | \"VI\" | \"VN\" | \"VU\" | \"WS\" | \"YE\" | \"ZA\" | \"ZM\" | \"ZW\"",
+                    "references": {
+                        "IconType": {
+                            "location": "import",
+                            "path": "../../interface",
+                            "id": "src/interface.ts::IconType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The name of the icon to use for the end icon.\nDefault: `chevronUp`"
+                },
+                "attribute": "icon",
+                "reflect": false,
+                "defaultValue": "'chevronUp'"
+            },
             "label": {
                 "type": "string",
                 "mutable": false,
@@ -260,6 +286,23 @@ export class CpslSelect {
                 "attribute": "label",
                 "reflect": false
             },
+            "noIconAnimation": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether or not to show the rotation animation for the end icon."
+                },
+                "attribute": "no-icon-animation",
+                "reflect": false
+            },
             "placeholder": {
                 "type": "string",
                 "mutable": false,

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

	@@ -1 +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';\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 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;\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 label for the input.\n /\n @Prop() label?: string;\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;\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 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 this.popoverEl.closePopover();\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 (item.value === this.selectedValue) {\n item.setAttribute('selected', 'true');\n this.hasSelectedItem = true;\n } else {\n item.setAttribute('selected', 'false');\n }\n });\n\n if (!this.selectedValue) {\n this.hasSelectedItem = false;\n }\n };\n\n private handleClickOutside = (event: MouseEvent) => {\n if (this.hasFocus && !this.el.contains(event.target as Node)) {\n this.hasFocus = false;\n window.removeEventListener('click', this.handleClickOutside);\n }\n };\n\n private handleClick = () => {\n if (!this.disabled) {\n this.hasFocus = true;\n window.addEventListener('click', this.handleClickOutside);\n }\n };\n\n render() {\n return (\n <Host id={this.id} class={{ 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.selectedValue) }}>\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 id=\"select-container\" class={{ 'select-container': true, 'error-container': Boolean(this.errorText) }} onMouseDown={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 class={{ 'selected-text': true, 'placeholder': !this.selectedValue }}>\n {!this.selectedValue ? (this.placeholder ?? 'Select') : (this.formatValue?.(this.selectedValue) ?? this.selectedValue)}\n </cpsl-text>\n )}\n </div>\n <cpsl-icon class={{ 'chevron': true, 'open': this.popoverOpen, 'has-value': Boolean(this.selectedValue) }} icon=\"chevronUp\" />\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 </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 <cpsl-popover part=\"popover\" autoWidth={this.autoWidth} trigger={this.id} preventBlur={this.hasFocus} disabled={this.disabled} anchorEl={this.anchorEl}>\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 </Host>\n );\n }\n}\n\nlet inputIds = 0;\n"]}
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';\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 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;\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 = 'chevronUp';\n\n /\n The label for the input.\n /\n @Prop() label?: string;\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;\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 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 this.popoverEl.closePopover();\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 (item.value === this.selectedValue) {\n item.setAttribute('selected', 'true');\n this.hasSelectedItem = true;\n } else {\n item.setAttribute('selected', 'false');\n }\n });\n\n if (!this.selectedValue) {\n this.hasSelectedItem = false;\n }\n };\n\n private handleClickOutside = (event: MouseEvent) => {\n if (this.hasFocus && !this.el.contains(event.target as Node)) {\n this.hasFocus = false;\n window.removeEventListener('click', this.handleClickOutside);\n }\n };\n\n private handleClick = () => {\n if (!this.disabled) {\n this.hasFocus = true;\n window.addEventListener('click', this.handleClickOutside);\n }\n };\n\n render() {\n return (\n <Host id={this.id} class={{ 'disabled': this.disabled, 'focused': this.hasFocus, 'has-value': Boolean(this.selectedValue) }}>\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) }} onMouseDown={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 class={{ 'selected-text': true, 'placeholder': !this.selectedValue }}>\n {!this.selectedValue ? (this.placeholder ?? 'Select') : (this.formatValue?.(this.selectedValue) ?? this.selectedValue)}\n </cpsl-text>\n )}\n </div>\n <cpsl-icon part=\"icon\" class={{ 'chevron': true, 'open': !this.noIconAnimation && this.popoverOpen, 'has-value': Boolean(this.selectedValue) }} icon={this.icon} />\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 </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 <cpsl-popover part=\"popover\" autoWidth={this.autoWidth} trigger={this.id} preventBlur={this.hasFocus} disabled={this.disabled} anchorEl={this.anchorEl}>\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 </Host>\n );\n }\n}\n\nlet inputIds = 0;\n"]}

package/dist/collection/components/cpsl-select-item/cpsl-select-item.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class CpslSelectItem {
         this.value = undefined;
     }
     render() {
-        return (h(Host, { key: '118f17cd1cf7f23d9d9bb8d1fd6b882f7d4b31d9' }, h("div", { key: '77735d41c9506decec079d229890f9bb40400fe3', part: "outer-container", class: "outer-container", onClick: this.handleItemClick }, h("div", { key: 'fe1d074764d4ac9e819bbc13071cd15475942580', part: "inner-container", class: { 'inner-container': true, 'selected': this.selected } }, h("slot", { key: '168bc2ed66c9afb18f1355a52d164776e6833453' })))));
+        return (h(Host, { key: '532ed86577783bc61c40a18de178e63d16cf24c1' }, h("div", { key: 'ebf183f51dc2082e853cda6f490ab1b1a2c72f99', part: "outer-container", class: "outer-container", onClick: this.handleItemClick }, h("div", { key: '1e2c94c4e4a61638fc7a0439a36672bc22f47d28', part: "inner-container", class: { 'inner-container': true, 'selected': this.selected } }, h("slot", { key: 'a5c01c9f324912eff3c7958370bbec29050e4f4a' })))));
     }
     static get is() { return "cpsl-select-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cpsl-slide-button/cpsl-slide-button.js CHANGED Viewed

@@ -125,7 +125,7 @@ export class CpslSlideButton {
         return this.el.shadowRoot.getElementById('end-icon');
     }
     render() {
-        return (h(Host, { key: 'd113db26952e865b214817123a2c5311ea40c7f2' }, h("div", { key: '5009f80827f116a04a2c764164bc8e6ab53f7b09', id: "slider-container", class: "slider-container" }, h("div", { key: '498c19112ce88898e382af17b1a3b726bf6bab37', id: "start-slider-container-background", class: { 'start-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: '387a3b044c0e9425426a96c5485b43c3dc17732a', id: "end-slider-container-background", class: { 'end-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: '2c7fcbb1ff171096e46520b7877b90eaad97f6dc', id: "slider", class: { slider: true, disabled: this.disabled } }, h("cpsl-icon", { key: '209bfe654df6c612b1d2e55245f89e921192a0a4', id: "start-icon", class: { 'start-icon': true, 'icon': true }, icon: this.startIcon }), h("cpsl-icon", { key: 'cf1fb641be67535769983285d42f78dac09b5c04', id: "end-icon", class: { 'end-icon': true, 'icon': true }, icon: this.endIcon })), h("span", { key: '929a0f8a60dcb0b7348854a851ff124416dcae89', id: "start-text", class: { 'start-text': true, 'disabled': this.disabled } }, this.startText), h("span", { key: '88f760b8b01b79507cdd9802b3bd895b51cd4c9a', id: "end-text", class: "end-text" }, this.endText))));
+        return (h(Host, { key: 'c396198f7247a40fb9ca03009fdde7478e25ec57' }, h("div", { key: 'ffc4f665dfcf595a6e332fe5864e0194543da59d', id: "slider-container", class: "slider-container" }, h("div", { key: 'f2834903ec83abffd252bdbb8918f53304840f55', id: "start-slider-container-background", class: { 'start-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: 'cb315a8ce6b822661b01ecf40d852c77fee33fa3', id: "end-slider-container-background", class: { 'end-slider-container-background': true, 'slider-container-background': true } }), h("div", { key: '3179fcebe1513a2fa76ef53907a5876ee93756dd', id: "slider", class: { slider: true, disabled: this.disabled } }, h("cpsl-icon", { key: 'fe5246cc71fd8c45578fe6e72b4da9280fda04b3', id: "start-icon", class: { 'start-icon': true, 'icon': true }, icon: this.startIcon }), h("cpsl-icon", { key: '186789c69f11dc5f47de5daa12de414dc339d86f', id: "end-icon", class: { 'end-icon': true, 'icon': true }, icon: this.endIcon })), h("span", { key: 'e385a9bddb2874863305a7a32e5dc89770a44bac', id: "start-text", class: { 'start-text': true, 'disabled': this.disabled } }, this.startText), h("span", { key: 'f2dc440ff6f3e72bba50c949cc8abcdcc4f94566', id: "end-text", class: "end-text" }, this.endText))));
     }
     static get is() { return "cpsl-slide-button"; }
     static get encapsulation() { return "shadow"; }
@@ -163,7 +163,7 @@ export class CpslSlideButton {
                 "mutable": false,
                 "complexType": {
                     "original": "IconType",
-                    "resolved": "\"search\" | \"alertCircle\" | \"angelListBrand\" | \"angelList\" | \"appleBrand\" | \"apple\" | \"arrowCircleBrokenDownLeft\" | \"arrowNarrow\" | \"arrow\" | \"backupKit\" | \"bank\" | \"brush\" | \"capsuleLogo\" | \"capsuleRingsDark\" | \"capsuleRings\" | \"capsule\" | \"checkCircleFilled\" | \"checkCircle\" | \"check\" | \"chevronUp\" | \"clock\" | \"close\" | \"clubhouseBrand\" | \"clubhouse\" | \"copy\" | \"cosmos\" | \"creditCard\" | \"cube\" | \"decentBrand\" | \"decent\" | \"discordBrand\" | \"discord\" | \"dot\" | \"downloadCloud\" | \"download\" | \"dribbbleBrand\" | \"dribbble\" | \"earth\" | \"ethereum\" | \"eyeOff\" | \"eye\" | \"facebookBrand\" | \"facebook\" | \"farcasterBrand\" | \"farcaster\" | \"figmaBrand\" | \"figma\" | \"file\" | \"folder\" | \"githubBrand\" | \"github\" | \"globe\" | \"googleBrand\" | \"google\" | \"helpCircle\" | \"heroAlertCircle\" | \"heroCheckmarkCapsule\" | \"heroCheckmark\" | \"heroEmail\" | \"heroExternalConnection\" | \"heroLock\" | \"heroPasskey\" | \"heroPhone\" | \"heroPlusCircleCapsule\" | \"heroPlusCircle\" | \"heroWallet\" | \"home\" | \"image\" | \"infoCircle\" | \"instagramBrand\" | \"instagram\" | \"key\" | \"lightning01\" | \"lightning\" | \"linkExternal\" | \"linkedinBrand\" | \"linkedin\" | \"logOut\" | \"mail\" | \"menu\" | \"moonpayBrand\" | \"moreLoginOptions\" | \"phone\" | \"pintrestBrand\" | \"pintrest\" | \"plusCircle\" | \"puzzlePiece\" | \"qrCode02\" | \"qrCode\" | \"rampNetworkBrand\" | \"rampNetwork\" | \"redditBrand\" | \"reddit\" | \"refresh\" | \"send\" | \"settings\" | \"shield\" | \"signalBrand\" | \"signal\" | \"snapchatBrand\" | \"snapchat\" | \"solana\" | \"stars\" | \"stripeBrand\" | \"telegramBrand\" | \"telegram\" | \"tikTokBrand\" | \"tikTok\" | \"tumblrBrand\" | \"tumblr\" | \"twitterBrand\" | \"twitter\" | \"wallet\" | \"x\" | \"youtubeBrand\" | \"youtube\" | \"AD\" | \"AE\" | \"AF\" | \"AG\" | \"AI\" | \"AL\" | \"AM\" | \"AO\" | \"AR\" | \"AS\" | \"AT\" | \"AU\" | \"AW\" | \"AX\" | \"AZ\" | \"BA\" | \"BB\" | \"BD\" | \"BE\" | \"BF\" | \"BG\" | \"BH\" | \"BI\" | \"BJ\" | \"BL\" | \"BM\" | \"BN\" | \"BO\" | \"BQ\" | \"BQ2\" | \"BQ3\" | \"BR\" | \"BS\" | \"BT\" | \"BW\" | \"BY\" | \"BZ\" | \"CA\" | \"CC\" | \"CD\" | \"CD2\" | \"CF\" | \"CH\" | \"CK\" | \"CL\" | \"CM\" | \"CN\" | \"CO\" | \"CR\" | \"CU\" | \"CW\" | \"CX\" | \"CY\" | \"CZ\" | \"DE\" | \"DJ\" | \"DK\" | \"DM\" | \"DO\" | \"DS\" | \"DZ\" | \"EC\" | \"EE\" | \"EG\" | \"EH\" | \"ER\" | \"ES\" | \"ET\" | \"FI\" | \"FJ\" | \"FK\" | \"FM\" | \"FO\" | \"FR\" | \"GA\" | \"GB2\" | \"GB\" | \"GD\" | \"GE\" | \"GG\" | \"GH\" | \"GI\" | \"GL\" | \"GM\" | \"GN\" | \"GQ\" | \"GR\" | \"GT\" | \"GU\" | \"GW\" | \"GY\" | \"HK\" | \"HN\" | \"HR\" | \"HT\" | \"HU\" | \"ID\" | \"IE\" | \"IL\" | \"IM\" | \"IN\" | \"IO\" | \"IQ\" | \"IR\" | \"IS\" | \"IT\" | \"JE\" | \"JM\" | \"JO\" | \"JP\" | \"KE\" | \"KG\" | \"KH\" | \"KI\" | \"KM\" | \"KN\" | \"KP\" | \"KR\" | \"KW\" | \"KY\" | \"KZ\" | \"LA\" | \"LB\" | \"LC\" | \"LI\" | \"LK\" | \"LR\" | \"LS\" | \"LT\" | \"LU\" | \"LV\" | \"LY\" | \"MA\" | \"MC\" | \"MD\" | \"ME\" | \"MG\" | \"MH\" | \"MK\" | \"ML\" | \"MM\" | \"MN\" | \"MO\" | \"MP\" | \"MQ\" | \"MR\" | \"MS\" | \"MT\" | \"MU\" | \"MV\" | \"MW\" | \"MX\" | \"MY\" | \"MZ\" | \"NA\" | \"NE\" | \"NF\" | \"NG\" | \"NI\" | \"NL\" | \"NO\" | \"NP\" | \"NR\" | \"NU\" | \"NZ\" | \"OM\" | \"PA\" | \"PE\" | \"PF\" | \"PG\" | \"PH\" | \"PK\" | \"PL\" | \"PN\" | \"PR\" | \"PS\" | \"PT\" | \"PW\" | \"PY\" | \"QA\" | \"RO\" | \"RS\" | \"RU\" | \"RW\" | \"SA\" | \"SB\" | \"SC\" | \"SE\" | \"SG\" | \"SI\" | \"SK\" | \"SL\" | \"SM\" | \"SN\" | \"SO\" | \"SR\" | \"SS\" | \"ST\" | \"SV\" | \"SX\" | \"SY\" | \"SZ\" | \"TC\" | \"TD\" | \"TG\" | \"TH\" | \"TJ\" | \"TK\" | \"TL\" | \"TM\" | \"TN\" | \"TO\" | \"TR\" | \"TT\" | \"TV\" | \"TW\" | \"TZ\" | \"UA\" | \"UG\" | \"US\" | \"UY\" | \"UZ\" | \"VC\" | \"VE\" | \"VG\" | \"VI\" | \"VN\" | \"VU\" | \"WS\" | \"YE\" | \"ZA\" | \"ZM\" | \"ZW\"",
+                    "resolved": "\"search\" | \"alertCircle\" | \"alertTriangle\" | \"angelListBrand\" | \"angelList\" | \"appleBrand\" | \"apple\" | \"arrowCircleBrokenDownLeft\" | \"arrowCircleDownFilled\" | \"arrowNarrow\" | \"arrow\" | \"backupKit\" | \"bank\" | \"brush\" | \"capsuleLogo\" | \"capsuleRingsDark\" | \"capsuleRings\" | \"capsule\" | \"checkCircleFilled\" | \"checkCircle\" | \"check\" | \"chevronDown\" | \"chevronSelectorVertical\" | \"chevronUp\" | \"clock\" | \"close\" | \"clubhouseBrand\" | \"clubhouse\" | \"copy\" | \"cosmos\" | \"creditCard02\" | \"creditCard\" | \"cube\" | \"decentBrand\" | \"decent\" | \"discordBrand\" | \"discord\" | \"dot\" | \"downloadCloud\" | \"download\" | \"dribbbleBrand\" | \"dribbble\" | \"earth\" | \"edit02\" | \"ethereum\" | \"eyeOff\" | \"eye\" | \"facebookBrand\" | \"facebook\" | \"farcasterBrand\" | \"farcaster\" | \"figmaBrand\" | \"figma\" | \"file\" | \"folder\" | \"githubBrand\" | \"github\" | \"globe\" | \"googleBrand\" | \"google\" | \"helpCircle\" | \"heroAlertCircle\" | \"heroCheckmarkCapsule\" | \"heroCheckmark\" | \"heroEmail\" | \"heroExternalConnection\" | \"heroLock\" | \"heroPasskey\" | \"heroPhone\" | \"heroPlusCircleCapsule\" | \"heroPlusCircle\" | \"heroWallet\" | \"home\" | \"image\" | \"infoCircle\" | \"instagramBrand\" | \"instagram\" | \"key\" | \"lightning01\" | \"lightning\" | \"linkExternal\" | \"linkedinBrand\" | \"linkedin\" | \"logOut\" | \"mail\" | \"menu\" | \"moonpayBrand\" | \"moreLoginOptions\" | \"phone\" | \"pintrestBrand\" | \"pintrest\" | \"plusCircle\" | \"plus\" | \"polygon\" | \"puzzlePiece\" | \"qrCode02\" | \"qrCode\" | \"rampNetworkBrand\" | \"rampNetwork\" | \"redditBrand\" | \"reddit\" | \"refresh\" | \"send\" | \"settings\" | \"shield\" | \"signalBrand\" | \"signal\" | \"snapchatBrand\" | \"snapchat\" | \"solana\" | \"star04Filled\" | \"stars\" | \"stripeBrand\" | \"telegramBrand\" | \"telegram\" | \"tikTokBrand\" | \"tikTok\" | \"tumblrBrand\" | \"tumblr\" | \"twitterBrand\" | \"twitter\" | \"user\" | \"wallet\" | \"x\" | \"youtubeBrand\" | \"youtube\" | \"AD\" | \"AE\" | \"AF\" | \"AG\" | \"AI\" | \"AL\" | \"AM\" | \"AO\" | \"AR\" | \"AS\" | \"AT\" | \"AU\" | \"AW\" | \"AX\" | \"AZ\" | \"BA\" | \"BB\" | \"BD\" | \"BE\" | \"BF\" | \"BG\" | \"BH\" | \"BI\" | \"BJ\" | \"BL\" | \"BM\" | \"BN\" | \"BO\" | \"BQ\" | \"BQ2\" | \"BQ3\" | \"BR\" | \"BS\" | \"BT\" | \"BW\" | \"BY\" | \"BZ\" | \"CA\" | \"CC\" | \"CD\" | \"CD2\" | \"CF\" | \"CH\" | \"CK\" | \"CL\" | \"CM\" | \"CN\" | \"CO\" | \"CR\" | \"CU\" | \"CW\" | \"CX\" | \"CY\" | \"CZ\" | \"DE\" | \"DJ\" | \"DK\" | \"DM\" | \"DO\" | \"DS\" | \"DZ\" | \"EC\" | \"EE\" | \"EG\" | \"EH\" | \"ER\" | \"ES\" | \"ET\" | \"FI\" | \"FJ\" | \"FK\" | \"FM\" | \"FO\" | \"FR\" | \"GA\" | \"GB2\" | \"GB\" | \"GD\" | \"GE\" | \"GG\" | \"GH\" | \"GI\" | \"GL\" | \"GM\" | \"GN\" | \"GQ\" | \"GR\" | \"GT\" | \"GU\" | \"GW\" | \"GY\" | \"HK\" | \"HN\" | \"HR\" | \"HT\" | \"HU\" | \"ID\" | \"IE\" | \"IL\" | \"IM\" | \"IN\" | \"IO\" | \"IQ\" | \"IR\" | \"IS\" | \"IT\" | \"JE\" | \"JM\" | \"JO\" | \"JP\" | \"KE\" | \"KG\" | \"KH\" | \"KI\" | \"KM\" | \"KN\" | \"KP\" | \"KR\" | \"KW\" | \"KY\" | \"KZ\" | \"LA\" | \"LB\" | \"LC\" | \"LI\" | \"LK\" | \"LR\" | \"LS\" | \"LT\" | \"LU\" | \"LV\" | \"LY\" | \"MA\" | \"MC\" | \"MD\" | \"ME\" | \"MG\" | \"MH\" | \"MK\" | \"ML\" | \"MM\" | \"MN\" | \"MO\" | \"MP\" | \"MQ\" | \"MR\" | \"MS\" | \"MT\" | \"MU\" | \"MV\" | \"MW\" | \"MX\" | \"MY\" | \"MZ\" | \"NA\" | \"NE\" | \"NF\" | \"NG\" | \"NI\" | \"NL\" | \"NO\" | \"NP\" | \"NR\" | \"NU\" | \"NZ\" | \"OM\" | \"PA\" | \"PE\" | \"PF\" | \"PG\" | \"PH\" | \"PK\" | \"PL\" | \"PN\" | \"PR\" | \"PS\" | \"PT\" | \"PW\" | \"PY\" | \"QA\" | \"RO\" | \"RS\" | \"RU\" | \"RW\" | \"SA\" | \"SB\" | \"SC\" | \"SE\" | \"SG\" | \"SI\" | \"SK\" | \"SL\" | \"SM\" | \"SN\" | \"SO\" | \"SR\" | \"SS\" | \"ST\" | \"SV\" | \"SX\" | \"SY\" | \"SZ\" | \"TC\" | \"TD\" | \"TG\" | \"TH\" | \"TJ\" | \"TK\" | \"TL\" | \"TM\" | \"TN\" | \"TO\" | \"TR\" | \"TT\" | \"TV\" | \"TW\" | \"TZ\" | \"UA\" | \"UG\" | \"US\" | \"UY\" | \"UZ\" | \"VC\" | \"VE\" | \"VG\" | \"VI\" | \"VN\" | \"VU\" | \"WS\" | \"YE\" | \"ZA\" | \"ZM\" | \"ZW\"",
                     "references": {
                         "IconType": {
                             "location": "import",
@@ -203,7 +203,7 @@ export class CpslSlideButton {
                 "mutable": false,
                 "complexType": {
                     "original": "IconType",
-                    "resolved": "\"search\" | \"alertCircle\" | \"angelListBrand\" | \"angelList\" | \"appleBrand\" | \"apple\" | \"arrowCircleBrokenDownLeft\" | \"arrowNarrow\" | \"arrow\" | \"backupKit\" | \"bank\" | \"brush\" | \"capsuleLogo\" | \"capsuleRingsDark\" | \"capsuleRings\" | \"capsule\" | \"checkCircleFilled\" | \"checkCircle\" | \"check\" | \"chevronUp\" | \"clock\" | \"close\" | \"clubhouseBrand\" | \"clubhouse\" | \"copy\" | \"cosmos\" | \"creditCard\" | \"cube\" | \"decentBrand\" | \"decent\" | \"discordBrand\" | \"discord\" | \"dot\" | \"downloadCloud\" | \"download\" | \"dribbbleBrand\" | \"dribbble\" | \"earth\" | \"ethereum\" | \"eyeOff\" | \"eye\" | \"facebookBrand\" | \"facebook\" | \"farcasterBrand\" | \"farcaster\" | \"figmaBrand\" | \"figma\" | \"file\" | \"folder\" | \"githubBrand\" | \"github\" | \"globe\" | \"googleBrand\" | \"google\" | \"helpCircle\" | \"heroAlertCircle\" | \"heroCheckmarkCapsule\" | \"heroCheckmark\" | \"heroEmail\" | \"heroExternalConnection\" | \"heroLock\" | \"heroPasskey\" | \"heroPhone\" | \"heroPlusCircleCapsule\" | \"heroPlusCircle\" | \"heroWallet\" | \"home\" | \"image\" | \"infoCircle\" | \"instagramBrand\" | \"instagram\" | \"key\" | \"lightning01\" | \"lightning\" | \"linkExternal\" | \"linkedinBrand\" | \"linkedin\" | \"logOut\" | \"mail\" | \"menu\" | \"moonpayBrand\" | \"moreLoginOptions\" | \"phone\" | \"pintrestBrand\" | \"pintrest\" | \"plusCircle\" | \"puzzlePiece\" | \"qrCode02\" | \"qrCode\" | \"rampNetworkBrand\" | \"rampNetwork\" | \"redditBrand\" | \"reddit\" | \"refresh\" | \"send\" | \"settings\" | \"shield\" | \"signalBrand\" | \"signal\" | \"snapchatBrand\" | \"snapchat\" | \"solana\" | \"stars\" | \"stripeBrand\" | \"telegramBrand\" | \"telegram\" | \"tikTokBrand\" | \"tikTok\" | \"tumblrBrand\" | \"tumblr\" | \"twitterBrand\" | \"twitter\" | \"wallet\" | \"x\" | \"youtubeBrand\" | \"youtube\" | \"AD\" | \"AE\" | \"AF\" | \"AG\" | \"AI\" | \"AL\" | \"AM\" | \"AO\" | \"AR\" | \"AS\" | \"AT\" | \"AU\" | \"AW\" | \"AX\" | \"AZ\" | \"BA\" | \"BB\" | \"BD\" | \"BE\" | \"BF\" | \"BG\" | \"BH\" | \"BI\" | \"BJ\" | \"BL\" | \"BM\" | \"BN\" | \"BO\" | \"BQ\" | \"BQ2\" | \"BQ3\" | \"BR\" | \"BS\" | \"BT\" | \"BW\" | \"BY\" | \"BZ\" | \"CA\" | \"CC\" | \"CD\" | \"CD2\" | \"CF\" | \"CH\" | \"CK\" | \"CL\" | \"CM\" | \"CN\" | \"CO\" | \"CR\" | \"CU\" | \"CW\" | \"CX\" | \"CY\" | \"CZ\" | \"DE\" | \"DJ\" | \"DK\" | \"DM\" | \"DO\" | \"DS\" | \"DZ\" | \"EC\" | \"EE\" | \"EG\" | \"EH\" | \"ER\" | \"ES\" | \"ET\" | \"FI\" | \"FJ\" | \"FK\" | \"FM\" | \"FO\" | \"FR\" | \"GA\" | \"GB2\" | \"GB\" | \"GD\" | \"GE\" | \"GG\" | \"GH\" | \"GI\" | \"GL\" | \"GM\" | \"GN\" | \"GQ\" | \"GR\" | \"GT\" | \"GU\" | \"GW\" | \"GY\" | \"HK\" | \"HN\" | \"HR\" | \"HT\" | \"HU\" | \"ID\" | \"IE\" | \"IL\" | \"IM\" | \"IN\" | \"IO\" | \"IQ\" | \"IR\" | \"IS\" | \"IT\" | \"JE\" | \"JM\" | \"JO\" | \"JP\" | \"KE\" | \"KG\" | \"KH\" | \"KI\" | \"KM\" | \"KN\" | \"KP\" | \"KR\" | \"KW\" | \"KY\" | \"KZ\" | \"LA\" | \"LB\" | \"LC\" | \"LI\" | \"LK\" | \"LR\" | \"LS\" | \"LT\" | \"LU\" | \"LV\" | \"LY\" | \"MA\" | \"MC\" | \"MD\" | \"ME\" | \"MG\" | \"MH\" | \"MK\" | \"ML\" | \"MM\" | \"MN\" | \"MO\" | \"MP\" | \"MQ\" | \"MR\" | \"MS\" | \"MT\" | \"MU\" | \"MV\" | \"MW\" | \"MX\" | \"MY\" | \"MZ\" | \"NA\" | \"NE\" | \"NF\" | \"NG\" | \"NI\" | \"NL\" | \"NO\" | \"NP\" | \"NR\" | \"NU\" | \"NZ\" | \"OM\" | \"PA\" | \"PE\" | \"PF\" | \"PG\" | \"PH\" | \"PK\" | \"PL\" | \"PN\" | \"PR\" | \"PS\" | \"PT\" | \"PW\" | \"PY\" | \"QA\" | \"RO\" | \"RS\" | \"RU\" | \"RW\" | \"SA\" | \"SB\" | \"SC\" | \"SE\" | \"SG\" | \"SI\" | \"SK\" | \"SL\" | \"SM\" | \"SN\" | \"SO\" | \"SR\" | \"SS\" | \"ST\" | \"SV\" | \"SX\" | \"SY\" | \"SZ\" | \"TC\" | \"TD\" | \"TG\" | \"TH\" | \"TJ\" | \"TK\" | \"TL\" | \"TM\" | \"TN\" | \"TO\" | \"TR\" | \"TT\" | \"TV\" | \"TW\" | \"TZ\" | \"UA\" | \"UG\" | \"US\" | \"UY\" | \"UZ\" | \"VC\" | \"VE\" | \"VG\" | \"VI\" | \"VN\" | \"VU\" | \"WS\" | \"YE\" | \"ZA\" | \"ZM\" | \"ZW\"",
+                    "resolved": "\"search\" | \"alertCircle\" | \"alertTriangle\" | \"angelListBrand\" | \"angelList\" | \"appleBrand\" | \"apple\" | \"arrowCircleBrokenDownLeft\" | \"arrowCircleDownFilled\" | \"arrowNarrow\" | \"arrow\" | \"backupKit\" | \"bank\" | \"brush\" | \"capsuleLogo\" | \"capsuleRingsDark\" | \"capsuleRings\" | \"capsule\" | \"checkCircleFilled\" | \"checkCircle\" | \"check\" | \"chevronDown\" | \"chevronSelectorVertical\" | \"chevronUp\" | \"clock\" | \"close\" | \"clubhouseBrand\" | \"clubhouse\" | \"copy\" | \"cosmos\" | \"creditCard02\" | \"creditCard\" | \"cube\" | \"decentBrand\" | \"decent\" | \"discordBrand\" | \"discord\" | \"dot\" | \"downloadCloud\" | \"download\" | \"dribbbleBrand\" | \"dribbble\" | \"earth\" | \"edit02\" | \"ethereum\" | \"eyeOff\" | \"eye\" | \"facebookBrand\" | \"facebook\" | \"farcasterBrand\" | \"farcaster\" | \"figmaBrand\" | \"figma\" | \"file\" | \"folder\" | \"githubBrand\" | \"github\" | \"globe\" | \"googleBrand\" | \"google\" | \"helpCircle\" | \"heroAlertCircle\" | \"heroCheckmarkCapsule\" | \"heroCheckmark\" | \"heroEmail\" | \"heroExternalConnection\" | \"heroLock\" | \"heroPasskey\" | \"heroPhone\" | \"heroPlusCircleCapsule\" | \"heroPlusCircle\" | \"heroWallet\" | \"home\" | \"image\" | \"infoCircle\" | \"instagramBrand\" | \"instagram\" | \"key\" | \"lightning01\" | \"lightning\" | \"linkExternal\" | \"linkedinBrand\" | \"linkedin\" | \"logOut\" | \"mail\" | \"menu\" | \"moonpayBrand\" | \"moreLoginOptions\" | \"phone\" | \"pintrestBrand\" | \"pintrest\" | \"plusCircle\" | \"plus\" | \"polygon\" | \"puzzlePiece\" | \"qrCode02\" | \"qrCode\" | \"rampNetworkBrand\" | \"rampNetwork\" | \"redditBrand\" | \"reddit\" | \"refresh\" | \"send\" | \"settings\" | \"shield\" | \"signalBrand\" | \"signal\" | \"snapchatBrand\" | \"snapchat\" | \"solana\" | \"star04Filled\" | \"stars\" | \"stripeBrand\" | \"telegramBrand\" | \"telegram\" | \"tikTokBrand\" | \"tikTok\" | \"tumblrBrand\" | \"tumblr\" | \"twitterBrand\" | \"twitter\" | \"user\" | \"wallet\" | \"x\" | \"youtubeBrand\" | \"youtube\" | \"AD\" | \"AE\" | \"AF\" | \"AG\" | \"AI\" | \"AL\" | \"AM\" | \"AO\" | \"AR\" | \"AS\" | \"AT\" | \"AU\" | \"AW\" | \"AX\" | \"AZ\" | \"BA\" | \"BB\" | \"BD\" | \"BE\" | \"BF\" | \"BG\" | \"BH\" | \"BI\" | \"BJ\" | \"BL\" | \"BM\" | \"BN\" | \"BO\" | \"BQ\" | \"BQ2\" | \"BQ3\" | \"BR\" | \"BS\" | \"BT\" | \"BW\" | \"BY\" | \"BZ\" | \"CA\" | \"CC\" | \"CD\" | \"CD2\" | \"CF\" | \"CH\" | \"CK\" | \"CL\" | \"CM\" | \"CN\" | \"CO\" | \"CR\" | \"CU\" | \"CW\" | \"CX\" | \"CY\" | \"CZ\" | \"DE\" | \"DJ\" | \"DK\" | \"DM\" | \"DO\" | \"DS\" | \"DZ\" | \"EC\" | \"EE\" | \"EG\" | \"EH\" | \"ER\" | \"ES\" | \"ET\" | \"FI\" | \"FJ\" | \"FK\" | \"FM\" | \"FO\" | \"FR\" | \"GA\" | \"GB2\" | \"GB\" | \"GD\" | \"GE\" | \"GG\" | \"GH\" | \"GI\" | \"GL\" | \"GM\" | \"GN\" | \"GQ\" | \"GR\" | \"GT\" | \"GU\" | \"GW\" | \"GY\" | \"HK\" | \"HN\" | \"HR\" | \"HT\" | \"HU\" | \"ID\" | \"IE\" | \"IL\" | \"IM\" | \"IN\" | \"IO\" | \"IQ\" | \"IR\" | \"IS\" | \"IT\" | \"JE\" | \"JM\" | \"JO\" | \"JP\" | \"KE\" | \"KG\" | \"KH\" | \"KI\" | \"KM\" | \"KN\" | \"KP\" | \"KR\" | \"KW\" | \"KY\" | \"KZ\" | \"LA\" | \"LB\" | \"LC\" | \"LI\" | \"LK\" | \"LR\" | \"LS\" | \"LT\" | \"LU\" | \"LV\" | \"LY\" | \"MA\" | \"MC\" | \"MD\" | \"ME\" | \"MG\" | \"MH\" | \"MK\" | \"ML\" | \"MM\" | \"MN\" | \"MO\" | \"MP\" | \"MQ\" | \"MR\" | \"MS\" | \"MT\" | \"MU\" | \"MV\" | \"MW\" | \"MX\" | \"MY\" | \"MZ\" | \"NA\" | \"NE\" | \"NF\" | \"NG\" | \"NI\" | \"NL\" | \"NO\" | \"NP\" | \"NR\" | \"NU\" | \"NZ\" | \"OM\" | \"PA\" | \"PE\" | \"PF\" | \"PG\" | \"PH\" | \"PK\" | \"PL\" | \"PN\" | \"PR\" | \"PS\" | \"PT\" | \"PW\" | \"PY\" | \"QA\" | \"RO\" | \"RS\" | \"RU\" | \"RW\" | \"SA\" | \"SB\" | \"SC\" | \"SE\" | \"SG\" | \"SI\" | \"SK\" | \"SL\" | \"SM\" | \"SN\" | \"SO\" | \"SR\" | \"SS\" | \"ST\" | \"SV\" | \"SX\" | \"SY\" | \"SZ\" | \"TC\" | \"TD\" | \"TG\" | \"TH\" | \"TJ\" | \"TK\" | \"TL\" | \"TM\" | \"TN\" | \"TO\" | \"TR\" | \"TT\" | \"TV\" | \"TW\" | \"TZ\" | \"UA\" | \"UG\" | \"US\" | \"UY\" | \"UZ\" | \"VC\" | \"VE\" | \"VG\" | \"VI\" | \"VN\" | \"VU\" | \"WS\" | \"YE\" | \"ZA\" | \"ZM\" | \"ZW\"",
                     "references": {
                         "IconType": {
                             "location": "import",

package/dist/collection/components/cpsl-spinner/cpsl-spinner.js CHANGED Viewed

@@ -5,11 +5,11 @@ export class CpslSpinner {
         this.speed = 1;
     }
     render() {
-        return (h(Host, { key: '3c1bd9555de17d17db2b967bec28640b92c84e0b', style: {
+        return (h(Host, { key: '5435b4e754383ad990e2fbf292c547fdff6a3c93', style: {
                 height: `${this.size}px`,
                 width: `${this.size}px`,
                 ['--bar-width']: `${this.size * 0.12}px`,
-            } }, h("div", { key: 'ce908c40d3c48e4c2817baa930708c7ef5bca104', class: "loader" })));
+            } }, h("div", { key: '4cf6ac734c6c20fd4e5343ff2b30718f1ec0820a', class: "loader" })));
     }
     static get is() { return "cpsl-spinner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cpsl-switch/cpsl-switch.js CHANGED Viewed

@@ -7,7 +7,7 @@ export class CpslSwitch {
         this.checked = undefined;
     }
     render() {
-        return (h(Host, { key: '9f3df7dc3a9fdee1f7ad04dfafa41ee64310d4e5' }, h("input", { key: 'f63bc6b3feda7d6c043b5c5763c6c49b98445b76', type: "checkbox", checked: this.checked }), h("span", { key: 'f31f4df2854847231b18d9528c383e1d582aac32', onClick: this.handleSwitchClick, class: { container: true, checked: this.checked } }, h("span", { key: 'b77e55f0a52c64cf69a966d7617baf638d307509', class: { thumb: true, checked: this.checked } }))));
+        return (h(Host, { key: '80395b6f36c5653c725a69883098d2822cb6d420' }, h("input", { key: 'b9f74ffce1f02b8efa28b47f60c82e549a87bd09', type: "checkbox", checked: this.checked }), h("span", { key: '1f0763f6aaca5f55a66620a59444a907dc837360', onClick: this.handleSwitchClick, class: { container: true, checked: this.checked } }, h("span", { key: '1804cbae3ea10091952722c6bfb50c6dd518fe0b', class: { thumb: true, checked: this.checked } }))));
     }
     static get is() { return "cpsl-switch"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cpsl-tab/cpsl-tab.css CHANGED Viewed

@@ -3,10 +3,6 @@
   --tab-gap: 2px;
   --tab-icon-height: 16px;
   --tab-icon-width: 16px;
-  padding-top: var(--tab-top-padding);
-  padding-bottom: var(--tab-bottom-padding);
-  padding-left: var(--tab-left-padding);
-  padding-right: var(--tab-right-padding);
   display: flex;
   flex: 1 1 auto;
   align-items: center;
@@ -39,6 +35,10 @@
   color: var(--tab-color);
   display: flex;
   gap: var(--tab-gap);
+  padding-top: var(--tab-top-padding);
+  padding-bottom: var(--tab-bottom-padding);
+  padding-left: var(--tab-left-padding);
+  padding-right: var(--tab-right-padding);
 }
 .content {

package/dist/collection/components/cpsl-tab/cpsl-tab.js CHANGED Viewed

@@ -28,7 +28,7 @@ export class CpslTab {
         }
     }
     render() {
-        return (h(Host, { key: '0db72b4aafeb1dcb0f9eb79adfc05ed9d8cfceee', class: { selected: this.selected }, onClick: this.onTabClicked }, h("div", { key: '62026b52a408de0eeea4b5bd93fa48d0e56b54e7', class: { 'tab-container': true } }, h("slot", { key: '2755cbce3b4911c7dd691f0e7bbbabe91d0314a1', name: "start" }), h("div", { key: '0a3533933c1f4b148f51c9a3ec16cc043b0626be', class: "content" }, h("slot", { key: 'a4952347ee3850ed6cf52917787b29e35fddabd5' })), h("slot", { key: 'a77a1b0b1f0ff5238d42d3b185f16799532508be', name: "end" }))));
+        return (h(Host, { key: '028bc025620e157f36758d6af5893b5067d42e22', class: { selected: this.selected }, onClick: this.onTabClicked }, h("div", { key: '6158adb9c6f477fba3b00fcfcc0b1c3717b8158e', class: { 'tab-container': true } }, h("slot", { key: 'e95d380390aacbe7e4630c32170a0bc7c113d871', name: "start" }), h("div", { key: '11905c7fa6cec1dec116738aa3fa35afc960ec87', class: "content" }, h("slot", { key: 'b9b157aa480845a5040fdd8d84499d9e00ed9a43' })), h("slot", { key: '0b5cff6fa6e070254205d7367a92dbae3cec1d3a', name: "end" }))));
     }
     static get is() { return "cpsl-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cpsl-table/cpsl-table.js CHANGED Viewed

@@ -47,7 +47,7 @@ export class CpslTable {
         return this.el.shadowRoot.getElementById('footer-container');
     }
     render() {
-        return (h(Host, { key: '7e73151d02a5fefb247f46cb8432dd444aa51f64' }, h("cpsl-card", { key: 'a56fc2c5af882cf639678aff59f48bc5b214cb20', part: "table-container", style: { position: 'relative' } }, h("div", { key: '2c3b2adbc4f9e53b0f5bb6f54fd57274a3c65ad8', id: "header-container", class: { 'container-header': true, 'shown': Boolean(this.containerHeaderEl) } }, h("slot", { key: '081d09a72e3466abddc1044a55efb673f3f31d65', name: "header" })), h("div", { key: 'f1eb55896339f7cf76118674ef4bb5eeecc361de', id: "content-container", class: { 'content': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll }, part: "content" }, h("slot", { key: 'a97dbb166f96995cb427b389d11099e0142df7c6', name: "content" })), this.headerEl && this.contentContainerEl && this.footerEl && (h("div", { key: '2af7ffba6f244e6fde703815931f0eba2c8913bf', style: { top: `${this.headerEl.clientHeight + 2}px`, height: `${this.contentContainerEl.clientHeight}px` }, class: { 'overlay': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll } })), h("div", { key: '83a7124205502fbcf9dcabbf898b3b713f544b2a', id: "footer-container", class: { 'container-footer': true, 'shown': Boolean(this.containerFooterEl) } }, h("slot", { key: '8b2e34e79eb1f5b90a2ddabcc280f7f3e14f7fc7', name: "footer" })))));
+        return (h(Host, { key: '144ebe0917ce215a128b6653c8ed47138be7b319' }, h("cpsl-card", { key: '8197bc383734a332a2e0ee7221a1990ba20b1f84', part: "table-container", style: { position: 'relative' } }, h("div", { key: 'dd8d0026515ce96a848ae4a6cdf5cdab7bb7ddf2', id: "header-container", class: { 'container-header': true, 'shown': Boolean(this.containerHeaderEl) } }, h("slot", { key: '1b5a2cbae0fa49bb0b5b4d89fef4b44ce8a46439', name: "header" })), h("div", { key: 'e22bd3b94832ded10fe7b152d2d0c68165853529', id: "content-container", class: { 'content': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll }, part: "content" }, h("slot", { key: 'f1bbfc01f1c25f820d9d4846ac1a7f64c21ee03b', name: "content" })), this.headerEl && this.contentContainerEl && this.footerEl && (h("div", { key: 'ad1e130185b6621b763892ae693ffab1d6243ae5', style: { top: `${this.headerEl.clientHeight + 2}px`, height: `${this.contentContainerEl.clientHeight}px` }, class: { 'overlay': true, 'horizontal-scroll': this.hasHorizontalScroll, 'vertical-scroll': this.hasVerticalScroll } })), h("div", { key: 'fb8b26f5d97b3965c50676b0541a14f21c675fe6', id: "footer-container", class: { 'container-footer': true, 'shown': Boolean(this.containerFooterEl) } }, h("slot", { key: '70a40dfe9bb80e3c825c895d12cb971467898e6a', name: "footer" })))));
     }
     static get is() { return "cpsl-table"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cpsl-tabs/cpsl-tabs.js CHANGED Viewed

@@ -55,7 +55,7 @@ export class CpslTabs {
         // Get border width as a number
         const tabsBorderWidth = +getComputedStyle(this.el).getPropertyValue('--tabs-border-width').slice(0, -2);
         const selectedTabRect = this.selectedTabRect;
-        return (h(Host, { key: 'a7b201091e8e803fdb6179883382c951cc88a888', class: { 'full-width': this.fullWidth }, onCpslTabButtonClick: this.onTabClicked }, h("div", { key: '7370e97866ec851b2e26231e88db112fc41dd1fd', class: "tabs-container" }, h("slot", { key: 'd2638cefef452fb3da3e0b6f7a5b852506a8e213' }), h("div", { key: 'ff20d8ff3baeb36f69cbc4a88a91639129642889', class: { slider: true, loaded: this.loaded }, style: { width: `${selectedTabRect.width - 8}px`, left: `${selectedTabRect.x - tabsPosition.x - tabsBorderWidth}px` } }))));
+        return (h(Host, { key: '88426913982f1fe2abeefcd1671139b2804222bd', class: { 'full-width': this.fullWidth }, onCpslTabButtonClick: this.onTabClicked }, h("div", { key: '6dea5803e0c9de3ecd8207ec636f5a25741e277e', class: "tabs-container" }, h("slot", { key: '4cbd63beee77016213cda4f151934a4b4cbffeb3' }), h("div", { key: '636d1a79183a24526b013983fa5bb0a45d55d246', class: { slider: true, loaded: this.loaded }, style: { width: `${selectedTabRect.width - 8}px`, left: `${selectedTabRect.x - tabsPosition.x - tabsBorderWidth}px` } }))));
     }
     static get is() { return "cpsl-tabs"; }
     static get encapsulation() { return "shadow"; }