@six-group/ui-library 0.0.0-insider.931e1d7 → 0.0.0-insider.98c4058

package/dist/components/six-select.js

@@ -1,18 +1,18 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { h as hasSlot, a as getTextContent } from './slot.js';
-import { F as FormControl } from './form-control.js';
-import { E as EventListeners } from './event-listeners.js';
-import { D as DEFAULT_DEBOUNCE_FAST, a as debounce } from './execution-control.js';
-import { d as defineCustomElement$b } from './six-button2.js';
-import { d as defineCustomElement$a } from './six-checkbox2.js';
-import { d as defineCustomElement$9 } from './six-dropdown2.js';
-import { d as defineCustomElement$8 } from './six-error2.js';
-import { d as defineCustomElement$7 } from './six-icon2.js';
-import { d as defineCustomElement$6 } from './six-icon-button2.js';
-import { d as defineCustomElement$5 } from './six-input2.js';
-import { d as defineCustomElement$4 } from './six-menu2.js';
-import { d as defineCustomElement$3 } from './six-menu-item2.js';
-import { d as defineCustomElement$2 } from './six-spinner2.js';
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-BAe7gBEi.js';
+import { h as hasSlot, a as getTextContent } from './p-j3oIB5oT.js';
+import { F as FormControl } from './p-Cc_nfyAl.js';
+import { E as EventListeners } from './p-C4h4qpGl.js';
+import { D as DEFAULT_DEBOUNCE_FAST, a as debounce } from './p-CKhg9ibv.js';
+import { d as defineCustomElement$b } from './p-Bg0uWW5a.js';
+import { d as defineCustomElement$a } from './p-4htQuoFD.js';
+import { d as defineCustomElement$9 } from './p-CMn2PWhi.js';
+import { d as defineCustomElement$8 } from './p-Ba-Z8Etn.js';
+import { d as defineCustomElement$7 } from './p-Q3Zlhwd0.js';
+import { d as defineCustomElement$6 } from './p-CIvx-Vfd.js';
+import { d as defineCustomElement$5 } from './p-CRqqZ-BJ.js';
+import { d as defineCustomElement$4 } from './p-iFKJjyZC.js';
+import { d as defineCustomElement$3 } from './p-BKLtju-g.js';
+import { d as defineCustomElement$2 } from './p-Dgi7xz4X.js';
 
 const languages = ['de', 'fr', 'it', 'en', 'es'];
 const dateFormat = new Intl.DateTimeFormat('de-CH');
@@ -161,17 +161,16 @@ function valueEquals(a, b) {
 }
 
 const sixSelectCss = ":host{position:relative;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.form-control .form-control__label{display:none}.form-control .form-control__help-text{display:none}.form-control .form-control__error-text{display:none;text-align:left}.form-control--has-label .form-control__label{display:inline-block;color:var(--six-input-label-color);font-weight:var(--six-font-weight-bold);margin-bottom:var(--six-spacing-x-small)}.form-control--has-label .form-control__label__required::after{color:var(--six-color-danger-800);content:\"*\";transform:scale(1.1);margin-left:var(--six-spacing-xxx-small);position:absolute}.form-control--has-label.form-control--small .form-control__label{font-size:var(--six-input-label-font-size-small)}.form-control--has-label.form-control--medium .form-control__label{font-size:var(--six-input-label-font-size-medium)}.form-control--has-label.form-control--large .form-control_label{font-size:var(--six-input-label-font-size-large)}.form-control--has-help-text .form-control__help-text{display:block;color:var(--six-input-help-text-color);margin-top:var(--six-spacing-x-small)}.form-control--has-help-text .form-control__help-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-help-text.form-control--small .form-control__help-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-help-text.form-control--medium .form-control__help-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-help-text.form-control--large .form-control__help-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--has-error-text .form-control__error-text{display:block;margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text .form-control__error-text ::slotted(*){margin-top:var(--six-spacing-xxx-small)}.form-control--has-error-text.form-control--small .form-control__error-text{font-size:var(--six-input-help-text-font-size-small)}.form-control--has-error-text.form-control--medium .form-control__error-text{font-size:var(--six-input-help-text-font-size-medium)}.form-control--has-error-text.form-control--large .form-control__error-text{font-size:var(--six-input-help-text-font-size-large)}.form-control--disabled .form-control__help-text{color:var(--six-input-help-text-color-disabled)}.form-control--disabled .form-control__label{color:var(--six-input-label-color-disabled)}.form-control--invalid:not(.form-control--disabled) .form-control__label{color:var(--six-input-label-color)}:host,.select{display:block}.select__box{display:inline-flex;align-items:center;justify-content:start;position:relative;width:100%;font-family:var(--six-font-family);font-weight:var(--six-input-font-weight);font-size:var(--six-input-font-size-medium);letter-spacing:var(--six-input-letter-spacing);background-color:var(--six-input-background-color);border:solid var(--six-border-width) var(--six-input-border-color);vertical-align:middle;transition:var(--six-transition-fast) color, var(--six-transition-fast) border, var(--six-transition-fast) box-shadow;cursor:pointer}.select__box--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.select__box--autocomplete{border:none;overflow:initial}.select:not(.select--disabled) .select__box:hover{background-color:var(--six-input-background-color-hover);color:var(--six-input-color-hover);border-bottom-color:var(--six-input-border-color-hover)}.select:not(.select--disabled) .select__box:hover:not(.select__box--line){border-color:var(--six-input-border-color-hover)}.select:not(.select--disabled) .select__box:focus{background-color:var(--six-input-background-color-focus);outline:none;color:var(--six-input-color-focus);border-bottom-color:var(--six-input-border-color-focus);box-shadow:0 1px 0 0 var(--six-input-border-color-focus)}.select:not(.select--disabled) .select__box:focus:not(.select__box--line){border-color:var(--six-input-border-color-focus);box-shadow:var(--six-input-focus-shadow)}.select--disabled .select__box{background-color:var(--six-input-background-color-disabled);color:var(--six-input-color-disabled);cursor:not-allowed;outline:none}.select--disabled .select__box:not(.select__box--line){border-color:var(--six-input-border-color-disabled)}.select--disabled .select__clear{pointer-events:none}.select--invalid:not(.select--disabled):not(.select--focused) .select__box{border-bottom-color:var(--six-input-border-color-danger)}.select--invalid:not(.select--disabled):not(.select--focused) .select__box:not(.input--line){border-color:var(--six-input-border-color-danger)}.display__values{display:flex;flex:1 1 auto;align-items:center;user-select:none;overflow:hidden;scrollbar-width:none;-ms-overflow-style:none}.display__values::-webkit-scrollbar{width:0;height:0}.display__values-values{flex:0 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.display__values-and-counter{display:flex;overflow:hidden}.select__clear{flex-shrink:0;flex-grow:0;display:inline}.select__icon{flex-shrink:0;flex-grow:0;display:inline;transition:var(--six-transition-medium) transform ease}.select--open .select__icon{transform:rotate(-180deg)}.placeholder{color:var(--six-input-placeholder-color)}.select--disabled .placeholder{color:var(--six-input-placeholder-color-disabled)}.select__hidden-select{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.select__input{position:absolute;top:0;left:0;width:100%;height:100%}.select--small .select__box{border-radius:var(--six-input-border-radius-small);font-size:var(--six-input-font-size-small);min-height:var(--six-height-small)}.select--small .select__box--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.select--small .display__values{margin:0 0 0 var(--six-input-spacing-small)}.select--small .select__clear{margin-right:var(--six-spacing-xxx-small)}.select--small .select__icon{margin-right:var(--six-spacing-x-small)}.select--medium .select__box{border-radius:var(--six-input-border-radius-medium);font-size:var(--six-input-font-size-medium);min-height:var(--six-height-medium)}.select--medium .select__box--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.select--medium .display__values{margin:0 0 0 var(--six-input-spacing-medium)}.select--medium .select__clear{margin-right:var(--six-spacing-xxx-small)}.select--medium .select__icon{margin-right:var(--six-spacing-x-small)}.select--large .select__box{border-radius:var(--six-input-border-radius-large);font-size:var(--six-input-font-size-large);min-height:var(--six-height-large)}.select--large .select__box--line{border:none;border-bottom:solid var(--six-border-width) var(--six-input-border-color)}.select--large .display__values{margin:0 0 0 var(--six-input-spacing-large)}.select--large .select__clear{margin-right:var(--six-spacing-xxx-small)}.select--large .select__icon{margin-right:var(--six-spacing-x-small)}.select--pill.select--small .select__box{border-radius:var(--six-height-small)}.select--pill.select--medium .select__box{border-radius:var(--six-height-medium)}.select--pill.select--large .select__box{border-radius:var(--six-height-large)}.select__menu{width:100%}.select__menu--hidden{display:none}six-icon-button::part(base){padding-top:0;padding-bottom:0}.selection-container--border{border-bottom:solid var(--six-border-width) var(--six-menu-divider-color);padding-top:var(--six-spacing-xx-small);padding-bottom:var(--six-spacing-xx-small)}.display-value--hidden{display:none}.overflow-count{color:var(--six-color-web-rock-600);padding-left:var(--six-spacing-x-small)}.overflow-count-hidden{display:none}.separator--hidden{display:none}.select-all{border-top:1px solid var(--six-color-web-rock-300);display:flex;justify-content:end}";
-const SixSelectStyle0 = sixSelectCss;
 
 let id = 0;
-const SixSelect$1 = /*@__PURE__*/ proxyCustomElement(class SixSelect extends HTMLElement {
+const SixSelect$1 = /*@__PURE__*/ proxyCustomElement(class SixSelect extends H {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.sixChange = createEvent(this, "six-select-change", 7);
-        this.sixFocus = createEvent(this, "six-select-focus", 7);
-        this.sixBlur = createEvent(this, "six-select-blur", 7);
+        this.sixChange = createEvent(this, "six-select-change");
+        this.sixFocus = createEvent(this, "six-select-focus");
+        this.sixBlur = createEvent(this, "six-select-blur");
         this.inputId = `select-${++id}`;
         this.labelId = `select-label-${id}`;
         this.helpTextId = `select-help-text-${id}`;
@@ -179,6 +178,68 @@ const SixSelect$1 = /*@__PURE__*/ proxyCustomElement(class SixSelect extends HTM
         this.eventListeners = new EventListeners();
         this.activeItemIndex = -1;
         this.resizeObserver = new ResizeObserver(() => this.updateDisplayedValues());
+        this.hasFocus = false;
+        this.hasHelpTextSlot = false;
+        this.hasLabelSlot = false;
+        this.hasErrorTextSlot = false;
+        this.isOpen = false;
+        this.displayedValues = [];
+        /** Menu items shown in the selection container.  */
+        this.selectionContainerItems = [];
+        /** Set to true to enable multiselect. */
+        this.multiple = false;
+        /** Enables the select all button. */
+        this.selectAllButton = false;
+        /** Set to true to disable the select control. */
+        this.disabled = false;
+        /** The select's name. */
+        this.name = '';
+        /** The select's placeholder text. */
+        this.placeholder = '';
+        /** The select's size. */
+        this.size = 'medium';
+        /**
+         * Enable this option to prevent the panel from being clipped when the component is placed inside a container with
+         * `overflow: auto|scroll`.
+         */
+        this.hoist = false;
+        /** The value of the control. This will be a string or an array depending on `multiple`. */
+        this.value = '';
+        /** Set to true to draw a pill-style select with rounded edges. */
+        this.pill = false;
+        /** The select's help text. Alternatively, you can use the help-text slot. */
+        this.helpText = '';
+        /** Set to true to show an asterisk beneath the label. */
+        this.required = false;
+        /** Set to true to add a clear button when the select is populated. */
+        this.clearable = false;
+        /** The label text. */
+        this.label = '';
+        /** The error message shown, if `invalid` is set to true.  */
+        this.errorText = '';
+        /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */
+        this.invalid = false;
+        /** Set to render as line */
+        this.line = false;
+        /** Set to true to allow filtering for entries in the dropdown */
+        this.filter = false;
+        /**
+         * Set to true to allow async filtering.
+         * When you enter something in the search field the component will only emit an event but not filter any elements itself.
+         * You can then simply listen to the 'six-async-filter-fired' event to manage the shown menu-items yourself
+         */
+        this.asyncFilter = false;
+        /**
+         * Set to true to turn the six-select into an autocomplete.
+         */
+        this.autocomplete = false;
+        /** The debounce for when the input changes for autocompletes should be emitted */
+        this.inputDebounce = DEFAULT_DEBOUNCE_FAST;
+        /** Set the options to be shown in the dropdown (alternative to setting the elements via html) */
+        this.options = null;
+        /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)
+         *  are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */
+        this.virtualScroll = false;
         this.handleBlur = () => {
             this.hasFocus = false;
             this.sixBlur.emit();
@@ -318,40 +379,6 @@ const SixSelect$1 = /*@__PURE__*/ proxyCustomElement(class SixSelect extends HTM
             this.hasErrorTextSlot = hasSlot(this.host, 'error-text');
             this.syncItemsFromValue();
         };
-        this.hasFocus = false;
-        this.hasHelpTextSlot = false;
-        this.hasLabelSlot = false;
-        this.hasErrorTextSlot = false;
-        this.isOpen = false;
-        this.displayedValues = [];
-        this.selectionContainerItems = [];
-        this.multiple = false;
-        this.selectAllButton = false;
-        this.selectAllText = undefined;
-        this.maxTagsVisible = 3;
-        this.disabled = false;
-        this.name = '';
-        this.placeholder = '';
-        this.filterPlaceholder = undefined;
-        this.filterDebounce = undefined;
-        this.size = 'medium';
-        this.hoist = false;
-        this.value = '';
-        this.pill = false;
-        this.helpText = '';
-        this.required = false;
-        this.clearable = false;
-        this.label = '';
-        this.errorText = '';
-        this.errorTextCount = undefined;
-        this.invalid = false;
-        this.line = false;
-        this.filter = false;
-        this.asyncFilter = false;
-        this.autocomplete = false;
-        this.inputDebounce = DEFAULT_DEBOUNCE_FAST;
-        this.options = null;
-        this.virtualScroll = false;
     }
     handleDisabledChange() {
         var _a;
@@ -557,7 +584,7 @@ const SixSelect$1 = /*@__PURE__*/ proxyCustomElement(class SixSelect extends HTM
             showClear = true;
             showExpand = false;
         }
-        return (h(FormControl, { key: '521e8a99e7fb4ad2fb8ded4763eb8ed1e0eff293', inputId: this.inputId, label: this.label, labelId: this.labelId, hasLabelSlot: this.hasLabelSlot, helpTextId: this.helpTextId, helpText: this.helpText, hasHelpTextSlot: this.hasHelpTextSlot, errorTextId: this.errorTextId, errorText: this.errorText, errorTextCount: this.errorTextCount, hasErrorTextSlot: this.hasErrorTextSlot, size: this.size, onLabelClick: this.handleLabelClick, disabled: this.disabled, required: this.required, displayError: this.invalid }, h("six-dropdown", { key: 'ea5f0ec6216ab61ebcc1ae8add16b042e99297cc', part: "base", ref: (el) => (this.dropdown = el), hoist: this.hoist, matchTriggerWidth: true, closeOnSelect: !this.multiple, containingElement: this.host, disableHideOnEnterAndSpace: this.autocomplete, class: {
+        return (h(FormControl, { key: 'ff36b151116ac2ccf43d24624c6365ca975af7f8', inputId: this.inputId, label: this.label, labelId: this.labelId, hasLabelSlot: this.hasLabelSlot, helpTextId: this.helpTextId, helpText: this.helpText, hasHelpTextSlot: this.hasHelpTextSlot, errorTextId: this.errorTextId, errorText: this.errorText, errorTextCount: this.errorTextCount, hasErrorTextSlot: this.hasErrorTextSlot, size: this.size, onLabelClick: this.handleLabelClick, disabled: this.disabled, required: this.required, displayError: this.invalid }, h("six-dropdown", { key: '4655261bb28a46809644cfc3e85f1037a518c046', part: "base", ref: (el) => (this.dropdown = el), hoist: this.hoist, matchTriggerWidth: true, closeOnSelect: !this.multiple, containingElement: this.host, disableHideOnEnterAndSpace: this.autocomplete, class: {
                 select: true,
                 'select--open': this.isOpen,
                 'select--empty': ((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) === 0,
@@ -572,20 +599,20 @@ const SixSelect$1 = /*@__PURE__*/ proxyCustomElement(class SixSelect extends HTM
                 'select--large': this.size === 'large',
                 'select--pill': this.pill,
                 'select--invalid': this.invalid,
-            }, onKeyDown: this.handleKeyDown, "onSix-dropdown-show": this.handleMenuShow, "onSix-dropdown-hide": this.handleMenuHide, filterPlaceholder: this.filterPlaceholder, filterDebounce: this.filterDebounce, filter: this.filter, asyncFilter: this.asyncFilter, virtualScroll: this.virtualScroll }, h("div", { key: 'd6b14098f6aabd6212f71e3832890de646c6d97e', slot: "trigger", ref: (el) => (this.box = el), id: this.inputId, class: {
+            }, onKeyDown: this.handleKeyDown, "onSix-dropdown-show": this.handleMenuShow, "onSix-dropdown-hide": this.handleMenuHide, filterPlaceholder: this.filterPlaceholder, filterDebounce: this.filterDebounce, filter: this.filter, asyncFilter: this.asyncFilter, virtualScroll: this.virtualScroll }, h("div", { key: 'cb97119328bfa57f2d72ee91ec33be37b32211f5', slot: "trigger", ref: (el) => (this.box = el), id: this.inputId, class: {
                 select__box: true,
                 'select__box--line': this.line,
                 'select__box--autocomplete': this.autocomplete,
-            }, role: "combobox", "aria-labelledby": this.labelId, "aria-describedby": this.helpTextId, "aria-haspopup": "true", "aria-expanded": this.isOpen ? 'true' : 'false', tabIndex: this.disabled ? -1 : 0, onBlur: this.handleBlur, onFocus: this.handleFocus }, h("div", { key: 'dd77b5234c29235a00f62b5e49b81dc5aba2ffda', class: "display__values", ref: (el) => (this.displayValuesContainer = el) }, this.displayedValues.length > 0 ? (h("span", { class: "display__values-and-counter" }, h("span", { class: "display__values-values" }, this.displayedValues.map((value) => (h("span", { key: value, class: "display-value" }, value, h("span", { class: { separator: true } }, ", "))))), h("span", { ref: (el) => (this.overflowCount = el), class: "overflow-count" }, "+10"))) : (h("span", { class: "placeholder" }, this.placeholder))), showClear && (h("six-icon-button", { key: 'd30be3b2adb8f5eed29a3e7a5a59f4db007d62e9', exportparts: "base:clear-button", class: "select__clear", name: "clear", size: "small", onClick: this.handleClearClick, tabindex: "-1" })), showExpand && (h("span", { key: '7c40d29a181ce1f15bc1bacf059a9c8e9807be67', part: "icon", class: "select__icon" }, h("six-icon", { key: '6ac4a8bf6a4be113dcfd6bf2fd690c8b47aaaaeb', size: "medium" }, "expand_more"))), h("six-input", { key: '8f226312196871cd91abcb20da09c5a2811d1657', ref: (el) => (this.autocompleteInput = el), class: {
+            }, role: "combobox", "aria-labelledby": this.labelId, "aria-describedby": this.helpTextId, "aria-haspopup": "true", "aria-expanded": this.isOpen ? 'true' : 'false', tabIndex: this.disabled ? -1 : 0, onBlur: this.handleBlur, onFocus: this.handleFocus }, h("div", { key: 'efccbb2b3f722db0d8212851e03519aafd2c0d22', class: "display__values", ref: (el) => (this.displayValuesContainer = el) }, this.displayedValues.length > 0 ? (h("span", { class: "display__values-and-counter" }, h("span", { class: "display__values-values" }, this.displayedValues.map((value) => (h("span", { key: value, class: "display-value" }, value, h("span", { class: { separator: true } }, ", "))))), h("span", { ref: (el) => (this.overflowCount = el), class: "overflow-count" }, "+10"))) : (h("span", { class: "placeholder" }, this.placeholder))), showClear && (h("six-icon-button", { key: 'd1210ab8005b8b49a875a2fbbab1e1c4f5a34a13', exportparts: "base:clear-button", class: "select__clear", name: "clear", size: "small", onClick: this.handleClearClick, tabindex: "-1" })), showExpand && (h("span", { key: 'f9b5a7713489994dce5fe5cb14a81858b143e7a1', part: "icon", class: "select__icon" }, h("six-icon", { key: 'c19b7479fbd2cad7632341cbf0811b8f6e0238ee', size: "medium" }, "expand_more"))), h("six-input", { key: '39fc706d4ec2695b79d8bf5bb434f0a8862b9494', ref: (el) => (this.autocompleteInput = el), class: {
                 select__input: true,
                 'select__hidden-select': !this.autocomplete,
-            }, "aria-hidden": "true", required: this.required, onFocus: this.handleFocus, clearable: this.clearable, placeholder: this.placeholder, pill: this.pill, disabled: this.disabled, size: this.size, tabIndex: -1 })), h("div", { key: 'bb683893a8ad678f3cb01e8e42531b17bd20913c', class: {
+            }, "aria-hidden": "true", required: this.required, onFocus: this.handleFocus, clearable: this.clearable, placeholder: this.placeholder, pill: this.pill, disabled: this.disabled, size: this.size, tabIndex: -1 })), h("div", { key: '65586a6139cea71cdca6b1992f7e915f2ba3f1a2', class: {
                 'selection-container': true,
                 'selection-container--border': this.selectionContainerItems.length > 0 && items.length !== this.selectionContainerItems.length,
-            } }, this.selectionContainerItems), h("six-menu", { key: 'c7755a2e2da8134b6b58189c81c8354cac7a8e2e', ref: (el) => (this.menu = el), part: "menu", class: {
+            } }, this.selectionContainerItems), h("six-menu", { key: 'cddb6aad509a51c0f7f0234f04064493e10d3195', ref: (el) => (this.menu = el), part: "menu", class: {
                 select__menu: true,
                 'select__menu--hidden': !hasMenuItems,
-            }, "onSix-menu-item-selected": this.handleMenuSelect, items: this.options, virtualScroll: this.virtualScroll, "remove-box-shadow": true, "disable-keyboard-handling": true }, h("slot", { key: '95fe463945090bd7a7cbc11066f4752dfff55034', onSlotchange: this.handleSlotChange })), this.multiple && this.selectAllButton && (h("div", { key: '448f7d261edd83841fc82c4c3304ec497aa4c8f8', class: "select-all", slot: "dropdown-footer" }, h("six-button", { key: 'e393c3715514b8e9a0a710c408364e6c96f9a1d3', type: "link", onClick: () => this.selectAll() }, this.selectAllText == null ? selectAllDefaultText(hasDeselectedOptions) : this.selectAllText))))));
+            }, "onSix-menu-item-selected": this.handleMenuSelect, items: this.options, virtualScroll: this.virtualScroll, "remove-box-shadow": true, "disable-keyboard-handling": true }, h("slot", { key: 'fc2d0b6588ea68fad8485df2d726bfb3223ee50c', onSlotchange: this.handleSlotChange })), this.multiple && this.selectAllButton && (h("div", { key: 'eec8f4eb5be60abd5f3b1d056b0b42e21be0ada1', class: "select-all", slot: "dropdown-footer" }, h("six-button", { key: '07166e1d79c6cb9040d0d8945843da71d000092a', type: "link", onClick: () => this.selectAll() }, this.selectAllText == null ? selectAllDefaultText(hasDeselectedOptions) : this.selectAllText))))));
     }
     hasSelection() {
         return this.multiple ? this.value.length > 0 : this.value !== '';
@@ -602,12 +629,11 @@ const SixSelect$1 = /*@__PURE__*/ proxyCustomElement(class SixSelect extends HTM
         "multiple": ["handleMultipleChange"],
         "value": ["handleValueChange"]
     }; }
-    static get style() { return SixSelectStyle0; }
+    static get style() { return sixSelectCss; }
 }, [1, "six-select", {
         "multiple": [4],
         "selectAllButton": [4, "select-all-button"],
         "selectAllText": [1, "select-all-text"],
-        "maxTagsVisible": [2, "max-tags-visible"],
         "disabled": [4],
         "name": [1],
         "placeholder": [1],
@@ -800,5 +826,6 @@ const SixSelect = SixSelect$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { SixSelect, getLanguage as a, defineCustomElement, getErrorMessage as g, languages as l };
+//# sourceMappingURL=six-select.js.map
 
 //# sourceMappingURL=six-select.js.map