npm - @siemens/ix - Versions diffs - 2.0.2 → 2.0.4-beta.0 - Mend

@siemens/ix 2.0.2 → 2.0.4-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (430) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { IxSelectItemLabelChangeEvent } from '../select-item/events';\n\n@Component({\n tag: 'ix-select',\n styleUrl: 'select.scss',\n shadow: true,\n})\nexport class Select {\n @Element() hostElement!: HTMLIxSelectElement;\n\n /\n Indices of selected items.\n * This corresponds to the value property of ix-select-items and therefor not necessarily the indices of the items in the list.\n * @deprecated since 2.0.0. Use the `value` property instead.\n /\n @Prop({ mutable: true }) selectedIndices?: string \| string[];\n\n /\n Current selected value.\n * This corresponds to the value property of ix-select-items\n * @since 2.0.0\n /\n @Prop({ mutable: true }) value?: string \| string[];\n\n /\n Show clear button\n /\n @Prop() allowClear = false;\n\n /\n Selection mode\n /\n @Prop() mode: 'single' \| 'multiple' = 'single';\n\n /\n Select is extendable\n /\n @Prop() editable = false;\n\n /\n If true the select will be in disabled state\n /\n @Prop() disabled = false;\n\n /\n If true the select will be in readonly mode\n /\n @Prop() readonly = false;\n\n /\n Input field placeholder\n /\n @Prop() i18nPlaceholder = 'Select an option';\n\n /\n Input field placeholder for editable select\n /\n @Prop() i18nPlaceholderEditable = 'Type of select option';\n\n /\n Select list header\n /\n @Prop() i18nSelectListHeader = 'Please select an option';\n\n /\n Hint inside of dropdown if no items where found with current filter text\n \n @since 1.5.0\n /\n @Prop() i18nNoMatches = 'No matches';\n\n /\n Hide list header\n \n @since 1.5.0\n @\n /\n @Prop() hideListHeader = false;\n\n /\n Value changed\n * @since 2.0.0\n /\n @Event() valueChange: EventEmitter<string \| string[]>;\n\n /\n Item selection changed\n * @deprecated since 2.0.0. Use `valueChange` instead.\n /\n @Event() itemSelectionChange: EventEmitter<string[]>;\n\n /\n Event dispatched whenever the text input changes.\n \n @since 2.0.0\n /\n @Event() inputChange: EventEmitter<string>;\n\n /\n Item added to selection\n */\n @Event() addItem: EventEmitter<string>;\n\n @State() dropdownShow = false;\n @State() selectedLabels: string[];\n @State() dropdownWrapperRef!: HTMLElement;\n @State() dropdownAnchor!: HTMLElement;\n @State() isDropdownEmpty = false;\n @State() hasFocus = false;\n @State() navigationItem: HTMLIxSelectItemElement;\n @State() inputFilterText: string;\n @State() inputValue: string;\n\n private inputRef!: HTMLInputElement;\n private dropdownRef!: HTMLIxDropdownElement;\n private addItemRef!: HTMLDivElement;\n\n private labelMutationObserver: MutationObserver;\n\n get items() {\n return [\n ...Array.from(this.hostElement.querySelectorAll('ix-select-item')),\n ...Array.from(\n this.hostElement.shadowRoot.querySelectorAll('ix-select-item')\n ),\n ];\n }\n\n get selectedItems() {\n return this.items.filter((item) => item.selected);\n }\n\n get addItemButton() {\n return this.hostElement.shadowRoot.querySelector('.add-item');\n }\n\n get isSingleMode() {\n return this.mode === 'single';\n }\n\n get isMultipleMode() {\n return this.mode === 'multiple';\n }\n\n get isEveryDropdownItemHidden() {\n return this.items.every((item) => item.classList.contains('d-none'));\n }\n\n @Watch('selectedIndices')\n watchSelectedIndices(value: string \| string[]) {\n this.value = value;\n this.updateSelection();\n }\n\n @Watch('value')\n watchValue(value: string \| string[]) {\n this.selectedIndices = value;\n this.updateSelection();\n }\n\n @Listen('itemClick')\n onItemClicked(event: CustomEvent<string>) {\n const newId = event.detail;\n this.itemClick(newId);\n }\n\n private itemClick(newId: string) {\n this.value = this.toggleValue(newId);\n this.updateSelection();\n this.emitValueChange();\n }\n\n private emitAddItem(value: string) {\n if (value.trim() === '') {\n return;\n }\n\n const newItem = document.createElement('ix-select-item');\n newItem.value = value;\n newItem.label = value;\n\n this.addItemRef.appendChild(newItem);\n\n this.clearInput();\n this.itemClick(value);\n this.addItem.emit(value);\n }\n\n private toggleValue(itemValue: string) {\n if (!this.isMultipleMode) {\n return itemValue;\n }\n\n if (!this.value) {\n return [itemValue];\n }\n\n let value = this.value;\n\n if (!Array.isArray(value)) {\n value = [value];\n }\n\n if (value.includes(itemValue)) {\n return value.filter((value) => value !== itemValue);\n } else {\n return [...value, itemValue];\n }\n }\n\n private updateSelection() {\n let ids = [];\n\n if (this.value) {\n ids = Array.isArray(this.value) ? [...this.value] : [this.value];\n }\n\n this.items.forEach((item) => {\n item.selected = ids.some((i) => i === item.value);\n });\n\n this.selectedLabels = this.selectedItems.map((item) => item.label);\n\n if (this.isSingleMode) {\n this.inputValue = this.selectedLabels?.length\n ? this.selectedLabels[0]\n : null;\n return;\n }\n\n this.inputValue = null;\n }\n\n private emitValueChange() {\n this.valueChange.emit(this.value);\n\n if (!this.value) {\n this.itemSelectionChange.emit(null);\n } else {\n this.itemSelectionChange.emit(\n Array.isArray(this.value) ? this.value : [this.value]\n );\n }\n }\n\n componentDidLoad() {\n this.inputRef.addEventListener('input', () => {\n this.inputChange.emit(this.inputRef.value);\n });\n }\n\n componentWillLoad() {\n if (this.selectedIndices && !this.value) {\n this.value = this.selectedIndices;\n }\n\n this.updateSelection();\n }\n\n @Listen('ix-select-item:labelChange')\n onLabelChange(event: IxSelectItemLabelChangeEvent) {\n event.preventDefault();\n event.stopImmediatePropagation();\n this.updateSelection();\n }\n\n disconnectedCallback() {\n if (this.labelMutationObserver) {\n this.labelMutationObserver.disconnect();\n }\n }\n\n private itemExists(item: string) {\n return this.items.find((i) => i.label === item);\n }\n\n private dropdownVisibilityChanged(event: CustomEvent<boolean>) {\n this.dropdownShow = event.detail;\n this.hasFocus = event.detail;\n\n if (event.detail) {\n this.inputRef.focus();\n this.inputRef.select();\n\n this.removeHiddenFromItems();\n this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n } else {\n this.navigationItem = undefined;\n }\n }\n\n @Listen('keydown', {\n target: 'window',\n })\n async onKeyDown(event: KeyboardEvent) {\n if (event.code === 'ArrowDown' \|\| event.code === 'ArrowUp') {\n this.onArrowNavigation(event, event.code);\n }\n\n if (!this.dropdownShow) {\n return;\n }\n\n if (event.code === 'Enter' \|\| event.code === 'NumpadEnter') {\n await this.onEnterNavigation();\n }\n\n if (event.code === 'Escape') {\n this.dropdownShow = false;\n }\n }\n\n private async onEnterNavigation() {\n if (this.isMultipleMode) {\n return;\n }\n\n if (this.editable && !this.itemExists(this.inputFilterText)) {\n this.emitAddItem(this.inputFilterText);\n this.navigationItem = this.items[this.items.length - 1];\n }\n\n this.navigationItem?.onItemClick();\n await this.dropdownRef?.updatePosition();\n\n if (this.isSingleMode && !this.editable) {\n this.dropdownShow = false;\n }\n }\n\n private onArrowNavigation(\n event: KeyboardEvent,\n key: 'ArrowDown' \| 'ArrowUp'\n ) {\n event.preventDefault();\n event.stopPropagation();\n\n this.dropdownShow = true;\n\n const items = this.items.filter((i) => !i.classList.contains('d-none'));\n if (this.navigationItem === undefined) {\n this.applyFocusTo(items[0]);\n return;\n }\n\n let indexOfNavigationItem = items.findIndex(\n (item) => item === this.navigationItem\n );\n\n if (key === 'ArrowDown') {\n indexOfNavigationItem++;\n } else {\n indexOfNavigationItem--;\n }\n\n const newFocusItem = items[indexOfNavigationItem];\n this.applyFocusTo(newFocusItem);\n }\n\n private applyFocusTo(element: HTMLIxSelectItemElement) {\n if (!element) {\n return;\n }\n this.navigationItem = element;\n\n setTimeout(() => {\n element.shadowRoot\n .querySelector('ix-dropdown-item')\n .shadowRoot.querySelector('button')\n .focus();\n });\n }\n\n private filterItemsWithTypeahead() {\n this.inputFilterText = this.inputRef.value;\n\n if (this.inputFilterText) {\n this.items.forEach((item) => {\n item.classList.remove('d-none');\n if (\n !item.label.toLowerCase().includes(this.inputFilterText.toLowerCase())\n ) {\n item.classList.add('d-none');\n }\n });\n } else {\n this.removeHiddenFromItems();\n }\n\n this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n }\n\n private removeHiddenFromItems() {\n this.items.forEach((item) => {\n item.classList.remove('d-none');\n });\n }\n\n private clearInput() {\n this.inputRef.value = '';\n this.inputFilterText = '';\n }\n\n private clear() {\n this.clearInput();\n this.selectedLabels = [];\n this.value = [];\n this.valueChange.emit(null);\n this.dropdownShow = false;\n }\n\n private onInputBlur(e) {\n if (this.editable) {\n return;\n }\n\n if (this.isSingleMode) {\n if (this.dropdownShow && this.isDropdownEmpty) {\n this.dropdownShow = false;\n }\n }\n\n if (!this.dropdownShow && this.mode !== 'multiple') {\n e.target['value'] = this.selectedLabels;\n }\n }\n\n private placeholderValue() {\n if (this.editable) {\n return this.i18nPlaceholderEditable;\n }\n\n if (this.readonly) {\n return '';\n }\n\n return this.i18nPlaceholder;\n }\n\n private isAddItemVisible() {\n return (\n !this.itemExists(this.inputFilterText) &&\n this.editable &&\n this.inputFilterText\n );\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n select: true,\n disabled: this.disabled,\n readonly: this.readonly,\n }}\n ref={(ref) => {\n this.dropdownAnchor = ref;\n if (!this.editable) this.dropdownWrapperRef = ref;\n }}\n >\n <div class=\"input-container\">\n <div class=\"chips\">\n {this.isMultipleMode\n ? this.selectedItems?.map((item) => (\n <ix-filter-chip\n disabled={this.disabled \|\| this.readonly}\n key={item.value}\n onCloseClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.itemClick(item.value);\n }}\n >\n {item.label}\n </ix-filter-chip>\n ))\n : ''}\n <div class=\"trigger\">\n <input\n data-testid=\"input\"\n disabled={this.disabled}\n readOnly={this.readonly}\n type=\"text\"\n class={{\n 'allow-clear':\n this.allowClear && !!this.selectedLabels?.length,\n }}\n placeholder={this.placeholderValue()}\n value={this.inputValue}\n ref={(ref) => (this.inputRef = ref)}\n onBlur={(e) => this.onInputBlur(e)}\n onInput={() => this.filterItemsWithTypeahead()}\n />\n {this.allowClear &&\n (this.selectedLabels?.length \|\| this.inputFilterText) ? (\n <ix-icon-button\n class=\"clear\"\n icon={'clear'}\n ghost\n oval\n size=\"16\"\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.clear();\n }}\n />\n ) : null}\n {this.disabled \|\| this.readonly ? null : (\n <ix-icon-button\n data-select-dropdown\n class={{ 'dropdown-visible': this.dropdownShow }}\n icon=\"chevron-down-small\"\n ghost\n ref={(ref) => {\n if (this.editable) this.dropdownWrapperRef = ref;\n }}\n ></ix-icon-button>\n )}\n </div>\n </div>\n </div>\n </div>\n <ix-dropdown\n ref={(ref) => (this.dropdownRef = ref)}\n show={this.dropdownShow}\n closeBehavior={this.isMultipleMode ? 'outside' : 'both'}\n class={{\n 'd-none': this.disabled \|\| this.readonly,\n }}\n anchor={this.dropdownAnchor}\n trigger={this.dropdownWrapperRef}\n onShowChanged={(e) => this.dropdownVisibilityChanged(e)}\n placement=\"bottom-start\"\n overwriteDropdownStyle={async () => {\n return {\n minWidth: `${this.hostElement.clientWidth}px`,\n };\n }}\n >\n <div\n class={{\n 'select-list-header': true,\n hidden: this.hideListHeader \|\| this.isDropdownEmpty,\n }}\n title={this.i18nSelectListHeader}\n >\n {this.i18nSelectListHeader}\n </div>\n <slot></slot>\n <div ref={(ref) => (this.addItemRef = ref)} class=\"d-contents\"></div>\n {this.isAddItemVisible() ? (\n <ix-dropdown-item\n data-testid=\"add-item\"\n icon={'plus'}\n class={{\n 'add-item': true,\n }}\n label={this.inputFilterText}\n onItemClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.emitAddItem(this.inputFilterText);\n }}\n ></ix-dropdown-item>\n ) : null}\n {this.isDropdownEmpty && !this.editable ? (\n <div class=\"select-list-header\">{this.i18nNoMatches}</div>\n ) : (\n ''\n )}\n </ix-dropdown>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { IxSelectItemLabelChangeEvent } from '../select-item/events';\nimport { OnListener } from '../utils/listener';\n\n@Component({\n tag: 'ix-select',\n styleUrl: 'select.scss',\n shadow: true,\n})\nexport class Select {\n @Element() hostElement!: HTMLIxSelectElement;\n\n /\n Indices of selected items.\n * This corresponds to the value property of ix-select-items and therefor not necessarily the indices of the items in the list.\n * @deprecated since 2.0.0. Use the `value` property instead.\n /\n @Prop({ mutable: true }) selectedIndices?: string \| string[];\n\n /\n Current selected value.\n * This corresponds to the value property of ix-select-items\n * @since 2.0.0\n /\n @Prop({ mutable: true }) value?: string \| string[];\n\n /\n Show clear button\n /\n @Prop() allowClear = false;\n\n /\n Selection mode\n /\n @Prop() mode: 'single' \| 'multiple' = 'single';\n\n /\n Select is extendable\n /\n @Prop() editable = false;\n\n /\n If true the select will be in disabled state\n /\n @Prop() disabled = false;\n\n /\n If true the select will be in readonly mode\n /\n @Prop() readonly = false;\n\n /\n Input field placeholder\n /\n @Prop() i18nPlaceholder = 'Select an option';\n\n /\n Input field placeholder for editable select\n /\n @Prop() i18nPlaceholderEditable = 'Type of select option';\n\n /\n Select list header\n /\n @Prop() i18nSelectListHeader = 'Please select an option';\n\n /\n Hint inside of dropdown if no items where found with current filter text\n \n @since 1.5.0\n /\n @Prop() i18nNoMatches = 'No matches';\n\n /\n Hide list header\n \n @since 1.5.0\n @\n /\n @Prop() hideListHeader = false;\n\n /\n Value changed\n * @since 2.0.0\n /\n @Event() valueChange: EventEmitter<string \| string[]>;\n\n /\n Item selection changed\n * @deprecated since 2.0.0. Use `valueChange` instead.\n /\n @Event() itemSelectionChange: EventEmitter<string[]>;\n\n /\n Event dispatched whenever the text input changes.\n \n @since 2.0.0\n /\n @Event() inputChange: EventEmitter<string>;\n\n /\n Item added to selection\n */\n @Event() addItem: EventEmitter<string>;\n\n @State() dropdownShow = false;\n @State() selectedLabels: string[];\n @State() dropdownWrapperRef!: HTMLElement;\n @State() dropdownAnchor!: HTMLElement;\n @State() isDropdownEmpty = false;\n @State() hasFocus = false;\n @State() navigationItem: HTMLIxSelectItemElement;\n @State() inputFilterText: string;\n @State() inputValue: string;\n\n private inputRef!: HTMLInputElement;\n private dropdownRef!: HTMLIxDropdownElement;\n private addItemRef!: HTMLDivElement;\n\n private labelMutationObserver: MutationObserver;\n\n get items() {\n return [\n ...Array.from(this.hostElement.querySelectorAll('ix-select-item')),\n ...Array.from(\n this.hostElement.shadowRoot.querySelectorAll('ix-select-item')\n ),\n ];\n }\n\n get selectedItems() {\n return this.items.filter((item) => item.selected);\n }\n\n get addItemButton() {\n return this.hostElement.shadowRoot.querySelector('.add-item');\n }\n\n get isSingleMode() {\n return this.mode === 'single';\n }\n\n get isMultipleMode() {\n return this.mode === 'multiple';\n }\n\n get isEveryDropdownItemHidden() {\n return this.items.every((item) => item.classList.contains('d-none'));\n }\n\n @Watch('selectedIndices')\n watchSelectedIndices(value: string \| string[]) {\n this.value = value;\n this.updateSelection();\n }\n\n @Watch('value')\n watchValue(value: string \| string[]) {\n this.selectedIndices = value;\n this.updateSelection();\n }\n\n @Listen('itemClick')\n onItemClicked(event: CustomEvent<string>) {\n const newId = event.detail;\n this.itemClick(newId);\n }\n\n private itemClick(newId: string) {\n this.value = this.toggleValue(newId);\n this.updateSelection();\n this.emitValueChange();\n }\n\n private emitAddItem(value: string) {\n if (value.trim() === '') {\n return;\n }\n\n const newItem = document.createElement('ix-select-item');\n newItem.value = value;\n newItem.label = value;\n\n this.addItemRef.appendChild(newItem);\n\n this.clearInput();\n this.itemClick(value);\n this.addItem.emit(value);\n }\n\n private toggleValue(itemValue: string) {\n if (!this.isMultipleMode) {\n return itemValue;\n }\n\n if (!this.value) {\n return [itemValue];\n }\n\n let value = this.value;\n\n if (!Array.isArray(value)) {\n value = [value];\n }\n\n if (value.includes(itemValue)) {\n return value.filter((value) => value !== itemValue);\n } else {\n return [...value, itemValue];\n }\n }\n\n private updateSelection() {\n let ids = [];\n\n if (this.value) {\n ids = Array.isArray(this.value) ? [...this.value] : [this.value];\n }\n\n this.items.forEach((item) => {\n item.selected = ids.some((i) => i === item.value);\n });\n\n this.selectedLabels = this.selectedItems.map((item) => item.label);\n\n if (this.isSingleMode) {\n this.inputValue = this.selectedLabels?.length\n ? this.selectedLabels[0]\n : null;\n return;\n }\n\n this.inputValue = null;\n }\n\n private emitValueChange() {\n this.valueChange.emit(this.value);\n\n if (!this.value) {\n this.itemSelectionChange.emit(null);\n } else {\n this.itemSelectionChange.emit(\n Array.isArray(this.value) ? this.value : [this.value]\n );\n }\n }\n\n componentDidLoad() {\n this.inputRef.addEventListener('input', () => {\n this.dropdownShow = true;\n this.inputChange.emit(this.inputRef.value);\n });\n }\n\n componentWillLoad() {\n if (this.selectedIndices && !this.value) {\n this.value = this.selectedIndices;\n }\n\n this.updateSelection();\n }\n\n @Listen('ix-select-item:labelChange')\n onLabelChange(event: IxSelectItemLabelChangeEvent) {\n event.preventDefault();\n event.stopImmediatePropagation();\n this.updateSelection();\n }\n\n disconnectedCallback() {\n if (this.labelMutationObserver) {\n this.labelMutationObserver.disconnect();\n }\n }\n\n private itemExists(item: string) {\n return this.items.find((i) => i.label === item);\n }\n\n private dropdownVisibilityChanged(event: CustomEvent<boolean>) {\n this.dropdownShow = event.detail;\n this.hasFocus = event.detail;\n\n if (event.detail) {\n this.inputRef.focus();\n this.inputRef.select();\n\n this.removeHiddenFromItems();\n this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n } else {\n this.navigationItem = undefined;\n }\n }\n\n @OnListener<Select>('keydown', (self) => self.dropdownShow)\n async onKeyDown(event: KeyboardEvent) {\n if (event.code === 'ArrowDown' \|\| event.code === 'ArrowUp') {\n this.onArrowNavigation(event, event.code);\n }\n\n if (!this.dropdownShow) {\n return;\n }\n\n if (event.code === 'Enter' \|\| event.code === 'NumpadEnter') {\n await this.onEnterNavigation();\n }\n\n if (event.code === 'Escape') {\n this.dropdownShow = false;\n }\n }\n\n private async onEnterNavigation() {\n if (this.isMultipleMode) {\n return;\n }\n\n if (this.editable && !this.itemExists(this.inputFilterText)) {\n this.emitAddItem(this.inputFilterText);\n this.navigationItem = this.items[this.items.length - 1];\n }\n\n this.navigationItem?.onItemClick();\n await this.dropdownRef?.updatePosition();\n\n if (this.isSingleMode && !this.editable) {\n this.dropdownShow = false;\n }\n }\n\n private onArrowNavigation(\n event: KeyboardEvent,\n key: 'ArrowDown' \| 'ArrowUp'\n ) {\n event.preventDefault();\n event.stopPropagation();\n\n this.dropdownShow = true;\n\n const items = this.items.filter((i) => !i.classList.contains('d-none'));\n if (this.navigationItem === undefined) {\n this.applyFocusTo(items[0]);\n return;\n }\n\n let indexOfNavigationItem = items.findIndex(\n (item) => item === this.navigationItem\n );\n\n if (key === 'ArrowDown') {\n indexOfNavigationItem++;\n } else {\n indexOfNavigationItem--;\n }\n\n const newFocusItem = items[indexOfNavigationItem];\n this.applyFocusTo(newFocusItem);\n }\n\n private applyFocusTo(element: HTMLIxSelectItemElement) {\n if (!element) {\n return;\n }\n this.navigationItem = element;\n\n setTimeout(() => {\n element.shadowRoot\n .querySelector('ix-dropdown-item')\n .shadowRoot.querySelector('button')\n .focus();\n });\n }\n\n private filterItemsWithTypeahead() {\n this.inputFilterText = this.inputRef.value;\n\n if (this.isSingleMode && this.inputFilterText === this.selectedLabels[0]) {\n return;\n }\n\n if (this.inputFilterText) {\n this.items.forEach((item) => {\n item.classList.remove('d-none');\n if (\n !item.label.toLowerCase().includes(this.inputFilterText.toLowerCase())\n ) {\n item.classList.add('d-none');\n }\n });\n } else {\n this.removeHiddenFromItems();\n }\n\n this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n }\n\n private removeHiddenFromItems() {\n this.items.forEach((item) => {\n item.classList.remove('d-none');\n });\n }\n\n private clearInput() {\n this.inputRef.value = '';\n this.inputFilterText = '';\n }\n\n private clear() {\n this.clearInput();\n this.selectedLabels = [];\n this.value = [];\n this.valueChange.emit(null);\n this.dropdownShow = false;\n }\n\n private onInputBlur(e) {\n if (this.editable) {\n return;\n }\n\n if (this.isSingleMode) {\n return;\n }\n\n if (!this.dropdownShow && this.mode !== 'multiple') {\n e.target['value'] = this.selectedLabels;\n }\n }\n\n private placeholderValue() {\n if (this.editable) {\n return this.i18nPlaceholderEditable;\n }\n\n if (this.readonly) {\n return '';\n }\n\n return this.i18nPlaceholder;\n }\n\n private isAddItemVisible() {\n return (\n !this.itemExists(this.inputFilterText) &&\n this.editable &&\n this.inputFilterText\n );\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n select: true,\n disabled: this.disabled,\n readonly: this.readonly,\n }}\n ref={(ref) => {\n this.dropdownAnchor = ref;\n if (!this.editable) this.dropdownWrapperRef = ref;\n }}\n >\n <div class=\"input-container\">\n <div class=\"chips\">\n {this.isMultipleMode\n ? this.selectedItems?.map((item) => (\n <ix-filter-chip\n disabled={this.disabled \|\| this.readonly}\n key={item.value}\n onCloseClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.itemClick(item.value);\n }}\n >\n {item.label}\n </ix-filter-chip>\n ))\n : ''}\n <div class=\"trigger\">\n <input\n data-testid=\"input\"\n disabled={this.disabled}\n readOnly={this.readonly}\n type=\"text\"\n class={{\n 'allow-clear':\n this.allowClear && !!this.selectedLabels?.length,\n }}\n placeholder={this.placeholderValue()}\n value={this.inputValue}\n ref={(ref) => (this.inputRef = ref)}\n onBlur={(e) => this.onInputBlur(e)}\n onFocus={() => {\n this.navigationItem = undefined;\n }}\n onInput={() => this.filterItemsWithTypeahead()}\n onKeyDown={(e) => this.onKeyDown(e)}\n />\n {this.allowClear &&\n (this.selectedLabels?.length \|\| this.inputFilterText) ? (\n <ix-icon-button\n class=\"clear\"\n icon={'clear'}\n ghost\n oval\n size=\"16\"\n onClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.clear();\n }}\n />\n ) : null}\n {this.disabled \|\| this.readonly ? null : (\n <ix-icon-button\n data-select-dropdown\n class={{ 'dropdown-visible': this.dropdownShow }}\n icon=\"chevron-down-small\"\n ghost\n ref={(ref) => {\n if (this.editable) this.dropdownWrapperRef = ref;\n }}\n ></ix-icon-button>\n )}\n </div>\n </div>\n </div>\n </div>\n <ix-dropdown\n ref={(ref) => (this.dropdownRef = ref)}\n show={this.dropdownShow}\n closeBehavior={this.isMultipleMode ? 'outside' : 'both'}\n class={{\n 'd-none': this.disabled \|\| this.readonly,\n }}\n anchor={this.dropdownAnchor}\n trigger={this.dropdownWrapperRef}\n onShowChanged={(e) => this.dropdownVisibilityChanged(e)}\n placement=\"bottom-start\"\n overwriteDropdownStyle={async () => {\n return {\n minWidth: `${this.hostElement.clientWidth}px`,\n };\n }}\n >\n <div\n class={{\n 'select-list-header': true,\n hidden: this.hideListHeader \|\| this.isDropdownEmpty,\n }}\n title={this.i18nSelectListHeader}\n >\n {this.i18nSelectListHeader}\n </div>\n <slot></slot>\n <div ref={(ref) => (this.addItemRef = ref)} class=\"d-contents\"></div>\n {this.isAddItemVisible() ? (\n <ix-dropdown-item\n data-testid=\"add-item\"\n icon={'plus'}\n class={{\n 'add-item': true,\n }}\n label={this.inputFilterText}\n onItemClick={(e) => {\n e.preventDefault();\n e.stopPropagation();\n this.emitAddItem(this.inputFilterText);\n }}\n ></ix-dropdown-item>\n ) : null}\n {this.isDropdownEmpty && !this.editable ? (\n <div class=\"select-list-header\">{this.i18nNoMatches}</div>\n ) : (\n ''\n )}\n </ix-dropdown>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/select/test/select.ct.js CHANGED Viewed

@@ -117,4 +117,23 @@ test('filter', async ({ mount, page }) => {
   await expect(item4).not.toBeVisible();
   await expect(item_abc).toBeVisible();
 });
+test('open filtered dropdown on input', async ({ mount, page }) => {
+  await mount(`
+        <ix-select>
+          <ix-select-item value="1" label="Item 1">Test</ix-select-item>
+          <ix-select-item value="2" label="Item 2">Test</ix-select-item>
+        </ix-select>
+    `);
+  const element = page.locator('ix-select');
+  await element.evaluate((select) => (select.value = []));
+  await page.locator('[data-testid="input"]').focus();
+  page.keyboard.down('Escape');
+  const dropdown = element.locator('ix-dropdown');
+  await expect(dropdown).not.toBeVisible();
+  page.keyboard.down('1');
+  const item1 = page.getByRole('button', { name: 'Item 1' });
+  const item2 = page.getByRole('button', { name: 'Item 2' });
+  await expect(item1).toBeVisible();
+  await expect(item2).not.toBeVisible();
+});
 //# sourceMappingURL=select.ct.js.map

package/dist/collection/components/select/test/select.ct.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select.ct.js","sourceRoot":"","sources":["../../../../src/components/select/test/select.ct.ts"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { expect } from '@playwright/test';\nimport { test } from '@utils/test';\n\ntest('renders', async ({ mount, page }) => {\n await mount(`\n <ix-select>\n <ix-select-item value=\"11\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"22\" label=\"Item 2\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await expect(element).toHaveClass(/hydrated/);\n\n await page.locator('[data-select-dropdown]').click();\n\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).toBeVisible();\n\n await expect(page.getByRole('button', { name: 'Item 1' })).toBeVisible();\n await expect(page.getByRole('button', { name: 'Item 2' })).toBeVisible();\n});\n\ntest('editable mode', async ({ mount, page }) => {\n await mount(`\n <ix-select editable>\n <ix-select-item value=\"11\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"22\" label=\"Item 2\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await expect(element).toHaveClass(/hydrated/);\n\n await page.locator('[data-select-dropdown]').click();\n await page.getByTestId('input').fill('Not existing');\n\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).toBeVisible();\n\n await expect(page.getByRole('button', { name: 'Item 1' })).not.toBeVisible();\n await expect(page.getByRole('button', { name: 'Item 2' })).not.toBeVisible();\n\n const add = page.getByRole('button', { name: /Not existing/ });\n await expect(add).toBeVisible();\n\n await add.click();\n await expect(page.getByTestId('input')).toHaveValue(/Not existing/);\n await page.locator('[data-select-dropdown]').click();\n\n await expect(page.getByRole('button', { name: 'Item 1' })).toBeVisible();\n await expect(page.getByRole('button', { name: 'Item 2' })).toBeVisible();\n\n const addedItem = page\n .getByRole('listitem')\n .filter({ hasText: 'Not existing' });\n\n await expect(addedItem).toBeVisible();\n});\n\ntest('single selection', async ({ mount, page }) => {\n await mount(`\n <ix-select>\n <ix-select-item value=\"11\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"22\" label=\"Item 2\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await element.evaluate(\n (select: HTMLIxSelectElement) => (select.value = '22')\n );\n\n await page.locator('[data-select-dropdown]').click();\n\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).toBeVisible();\n\n await expect(page.getByRole('button', { name: 'Item 1' })).toBeVisible();\n await expect(\n page.getByRole('button', { name: 'Item 2' }).locator('ix-icon')\n ).toBeVisible();\n});\n\ntest('multiple selection', async ({ mount, page }) => {\n await mount(`\n <ix-select mode=\"multiple\">\n <ix-select-item value=\"1\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"2\" label=\"Item 2\">Test</ix-select-item>\n <ix-select-item value=\"3\" label=\"Item 3\">Test</ix-select-item>\n <ix-select-item value=\"4\" label=\"Item 4\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await element.evaluate((select: HTMLIxSelectElement) => (select.value = []));\n await page.locator('[data-select-dropdown]').click();\n\n const dropdown = element.locator('ix-dropdown');\n const chips = element.locator('.chips');\n\n await expect(dropdown).toBeVisible();\n\n const item1 = element.locator('ix-select-item').nth(0);\n const item3 = element.locator('ix-select-item').nth(2);\n await item1.click();\n await page.locator('[data-select-dropdown]').click();\n await item3.click();\n await page.locator('[data-select-dropdown]').click();\n\n await expect(item1.locator('ix-icon')).toBeVisible();\n await expect(item3.locator('ix-icon')).toBeVisible();\n\n const chip1 = chips.getByTitle('Item 1');\n const chip3 = chips.getByTitle('Item 3');\n\n await expect(chip1).toBeVisible();\n await expect(chip3).toBeVisible();\n});\n\ntest('filter', async ({ mount, page }) => {\n await mount(`\n <ix-select mode=\"multiple\">\n <ix-select-item value=\"1\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"2\" label=\"Item 2\">Test</ix-select-item>\n <ix-select-item value=\"abc\" label=\"abc\">Test</ix-select-item>\n <ix-select-item value=\"4\" label=\"Item 4\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await element.evaluate((select: HTMLIxSelectElement) => (select.value = []));\n\n await page.locator('[data-select-dropdown]').click();\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).toBeVisible();\n\n await element.locator('input').fill('abc');\n\n const item1 = page.getByRole('button', { name: 'Item 1' });\n const item2 = page.getByRole('button', { name: 'Item 2' });\n const item4 = page.getByRole('button', { name: 'Item 4' });\n const item_abc = page.getByRole('button', { name: 'abc' });\n\n await expect(item1).not.toBeVisible();\n await expect(item2).not.toBeVisible();\n await expect(item4).not.toBeVisible();\n await expect(item_abc).toBeVisible();\n});\n"]}
1	+ {"version":3,"file":"select.ct.js","sourceRoot":"","sources":["../../../../src/components/select/test/select.ct.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;EACxC,MAAM,KAAK,CAAC;;;;;KAKT,CAAC,CAAC;EACL,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;EAC1C,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAE9C,MAAM,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;EAErD,MAAM,QAAQ,GAAG,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;EAChD,MAAM,MAAM,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,CAAC;EAErC,MAAM,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;EACzE,MAAM,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;AAC3E,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;EAC9C,MAAM,KAAK,CAAC;;;;;KAKT,CAAC,CAAC;EACL,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;EAC1C,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAE9C,MAAM,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;EACrD,MAAM,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;EAErD,MAAM,QAAQ,GAAG,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;EAChD,MAAM,MAAM,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,CAAC;EAErC,MAAM,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;EAC7E,MAAM,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;EAE7E,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAC;EAC/D,MAAM,MAAM,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,CAAC;EAEhC,MAAM,GAAG,CAAC,KAAK,EAAE,CAAC;EAClB,MAAM,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;EACpE,MAAM,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;EAErD,MAAM,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;EACzE,MAAM,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;EAEzE,MAAM,SAAS,GAAG,IAAI;KACnB,SAAS,CAAC,UAAU,CAAC;KACrB,MAAM,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,CAAC,CAAC;EAEvC,MAAM,MAAM,CAAC,SAAS,CAAC,CAAC,WAAW,EAAE,CAAC;AACxC,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,kBAAkB,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;EACjD,MAAM,KAAK,CAAC;;;;;KAKT,CAAC,CAAC;EACL,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;EAC1C,MAAM,OAAO,CAAC,QAAQ,CACpB,CAAC,MAA2B,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,CACvD,CAAC;EAEF,MAAM,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;EAErD,MAAM,QAAQ,GAAG,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;EAChD,MAAM,MAAM,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,CAAC;EAErC,MAAM,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;EACzE,MAAM,MAAM,CACV,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,CAChE,CAAC,WAAW,EAAE,CAAC;AAClB,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,oBAAoB,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;EACnD,MAAM,KAAK,CAAC;;;;;;;KAOT,CAAC,CAAC;EACL,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;EAC1C,MAAM,OAAO,CAAC,QAAQ,CAAC,CAAC,MAA2B,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC;EAC7E,MAAM,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;EAErD,MAAM,QAAQ,GAAG,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;EAChD,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;EAExC,MAAM,MAAM,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,CAAC;EAErC,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;EACvD,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;EACvD,MAAM,KAAK,CAAC,KAAK,EAAE,CAAC;EACpB,MAAM,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;EACrD,MAAM,KAAK,CAAC,KAAK,EAAE,CAAC;EACpB,MAAM,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;EAErD,MAAM,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;EACrD,MAAM,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;EAErD,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;EACzC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;EAEzC,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;EAClC,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;AACpC,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;EACvC,MAAM,KAAK,CAAC;;;;;;;KAOT,CAAC,CAAC;EACL,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;EAC1C,MAAM,OAAO,CAAC,QAAQ,CAAC,CAAC,MAA2B,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC;EAE7E,MAAM,IAAI,CAAC,OAAO,CAAC,wBAAwB,CAAC,CAAC,KAAK,EAAE,CAAC;EACrD,MAAM,QAAQ,GAAG,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;EAChD,MAAM,MAAM,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,CAAC;EAErC,MAAM,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EAE3C,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;EAC3D,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;EAC3D,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;EAC3D,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;EAE3D,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;EACtC,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;EACtC,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;EACtC,MAAM,MAAM,CAAC,QAAQ,CAAC,CAAC,WAAW,EAAE,CAAC;AACvC,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,iCAAiC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;EAChE,MAAM,KAAK,CAAC;;;;;KAKT,CAAC,CAAC;EACL,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;EAC1C,MAAM,OAAO,CAAC,QAAQ,CAAC,CAAC,MAA2B,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC;EAE7E,MAAM,IAAI,CAAC,OAAO,CAAC,uBAAuB,CAAC,CAAC,KAAK,EAAE,CAAC;EACpD,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;EAC7B,MAAM,QAAQ,GAAG,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;EAChD,MAAM,MAAM,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;EAEzC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;EAExB,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;EAC3D,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;EAE3D,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;EAClC,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;AACxC,CAAC,CAAC,CAAC","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { expect } from '@playwright/test';\nimport { test } from '@utils/test';\n\ntest('renders', async ({ mount, page }) => {\n await mount(`\n <ix-select>\n <ix-select-item value=\"11\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"22\" label=\"Item 2\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await expect(element).toHaveClass(/hydrated/);\n\n await page.locator('[data-select-dropdown]').click();\n\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).toBeVisible();\n\n await expect(page.getByRole('button', { name: 'Item 1' })).toBeVisible();\n await expect(page.getByRole('button', { name: 'Item 2' })).toBeVisible();\n});\n\ntest('editable mode', async ({ mount, page }) => {\n await mount(`\n <ix-select editable>\n <ix-select-item value=\"11\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"22\" label=\"Item 2\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await expect(element).toHaveClass(/hydrated/);\n\n await page.locator('[data-select-dropdown]').click();\n await page.getByTestId('input').fill('Not existing');\n\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).toBeVisible();\n\n await expect(page.getByRole('button', { name: 'Item 1' })).not.toBeVisible();\n await expect(page.getByRole('button', { name: 'Item 2' })).not.toBeVisible();\n\n const add = page.getByRole('button', { name: /Not existing/ });\n await expect(add).toBeVisible();\n\n await add.click();\n await expect(page.getByTestId('input')).toHaveValue(/Not existing/);\n await page.locator('[data-select-dropdown]').click();\n\n await expect(page.getByRole('button', { name: 'Item 1' })).toBeVisible();\n await expect(page.getByRole('button', { name: 'Item 2' })).toBeVisible();\n\n const addedItem = page\n .getByRole('listitem')\n .filter({ hasText: 'Not existing' });\n\n await expect(addedItem).toBeVisible();\n});\n\ntest('single selection', async ({ mount, page }) => {\n await mount(`\n <ix-select>\n <ix-select-item value=\"11\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"22\" label=\"Item 2\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await element.evaluate(\n (select: HTMLIxSelectElement) => (select.value = '22')\n );\n\n await page.locator('[data-select-dropdown]').click();\n\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).toBeVisible();\n\n await expect(page.getByRole('button', { name: 'Item 1' })).toBeVisible();\n await expect(\n page.getByRole('button', { name: 'Item 2' }).locator('ix-icon')\n ).toBeVisible();\n});\n\ntest('multiple selection', async ({ mount, page }) => {\n await mount(`\n <ix-select mode=\"multiple\">\n <ix-select-item value=\"1\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"2\" label=\"Item 2\">Test</ix-select-item>\n <ix-select-item value=\"3\" label=\"Item 3\">Test</ix-select-item>\n <ix-select-item value=\"4\" label=\"Item 4\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await element.evaluate((select: HTMLIxSelectElement) => (select.value = []));\n await page.locator('[data-select-dropdown]').click();\n\n const dropdown = element.locator('ix-dropdown');\n const chips = element.locator('.chips');\n\n await expect(dropdown).toBeVisible();\n\n const item1 = element.locator('ix-select-item').nth(0);\n const item3 = element.locator('ix-select-item').nth(2);\n await item1.click();\n await page.locator('[data-select-dropdown]').click();\n await item3.click();\n await page.locator('[data-select-dropdown]').click();\n\n await expect(item1.locator('ix-icon')).toBeVisible();\n await expect(item3.locator('ix-icon')).toBeVisible();\n\n const chip1 = chips.getByTitle('Item 1');\n const chip3 = chips.getByTitle('Item 3');\n\n await expect(chip1).toBeVisible();\n await expect(chip3).toBeVisible();\n});\n\ntest('filter', async ({ mount, page }) => {\n await mount(`\n <ix-select mode=\"multiple\">\n <ix-select-item value=\"1\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"2\" label=\"Item 2\">Test</ix-select-item>\n <ix-select-item value=\"abc\" label=\"abc\">Test</ix-select-item>\n <ix-select-item value=\"4\" label=\"Item 4\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await element.evaluate((select: HTMLIxSelectElement) => (select.value = []));\n\n await page.locator('[data-select-dropdown]').click();\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).toBeVisible();\n\n await element.locator('input').fill('abc');\n\n const item1 = page.getByRole('button', { name: 'Item 1' });\n const item2 = page.getByRole('button', { name: 'Item 2' });\n const item4 = page.getByRole('button', { name: 'Item 4' });\n const item_abc = page.getByRole('button', { name: 'abc' });\n\n await expect(item1).not.toBeVisible();\n await expect(item2).not.toBeVisible();\n await expect(item4).not.toBeVisible();\n await expect(item_abc).toBeVisible();\n});\n\ntest('open filtered dropdown on input', async ({ mount, page }) => {\n await mount(`\n <ix-select>\n <ix-select-item value=\"1\" label=\"Item 1\">Test</ix-select-item>\n <ix-select-item value=\"2\" label=\"Item 2\">Test</ix-select-item>\n </ix-select>\n `);\n const element = page.locator('ix-select');\n await element.evaluate((select: HTMLIxSelectElement) => (select.value = []));\n\n await page.locator('[data-testid=\"input\"]').focus();\n page.keyboard.down('Escape');\n const dropdown = element.locator('ix-dropdown');\n await expect(dropdown).not.toBeVisible();\n\n page.keyboard.down('1');\n\n const item1 = page.getByRole('button', { name: 'Item 1' });\n const item2 = page.getByRole('button', { name: 'Item 2' });\n\n await expect(item1).toBeVisible();\n await expect(item2).not.toBeVisible();\n});\n"]}

package/dist/collection/components/slider/slider.js CHANGED Viewed

@@ -6,8 +6,19 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 import { h, Host, } from '@stencil/core';
 import { a11yHostAttributes } from '../utils/a11y';
+import { OnListener } from '../utils/listener';
 function between(min, value, max) {
   if (value < min) {
     return min;
@@ -25,7 +36,7 @@ function between(min, value, max) {
  * @slot label-start - Element will be displayed at the start of the slider
  * @slot label-end - Element will be displayed at the end of the slider
  */
-export class IxSlider {
+export class Slider {
   constructor() {
     this.step = undefined;
     this.min = 0;
@@ -367,14 +378,8 @@ export class IxSlider {
         "methodName": "updateRangeVariables"
       }];
   }
-  static get listeners() {
-    return [{
-        "name": "pointerup",
-        "method": "onPointerUp",
-        "target": "window",
-        "capture": false,
-        "passive": true
-      }];
-  }
 }
+__decorate([
+  OnListener('pointerUp', (self) => self.showTooltip)
+], Slider.prototype, "onPointerUp", null);
 //# sourceMappingURL=slider.js.map

package/dist/collection/components/slider/slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { A11yAttributes, a11yHostAttributes } from '../utils/a11y';\n\nexport type SliderMarker = Array<number>;\n\nfunction between(min: number, value: number, max: number) {\n if (value < min) {\n return min;\n } else if (value > max) {\n return max;\n } else {\n return value;\n }\n}\n\n/\n @since 2.0.0\n \n @slot label-start - Element will be displayed at the start of the slider\n * @slot label-end - Element will be displayed at the end of the slider\n /\n@Component({\n tag: 'ix-slider',\n styleUrl: 'slider.scss',\n shadow: true,\n})\nexport class IxSlider {\n @Element() hostElement!: HTMLIxSliderElement;\n\n /\n Legal number intervals\n \n @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#step\n /\n @Prop() step: number;\n\n /\n Minimum slider value\n /\n @Prop() min = 0;\n\n /\n Maximum slider value\n /\n @Prop() max = 100;\n\n /\n Current value of the slider\n /\n @Prop() value = 0;\n\n /\n Define tick marker on the slider. Marker has to be within slider min/max\n /\n @Prop() marker: SliderMarker;\n\n /\n Show a trace line\n /\n @Prop() trace = false;\n\n /\n Define the start point of the trace line\n /\n @Prop() traceReference = 0;\n\n /\n Show control as disabled\n /\n @Prop() disabled = false;\n\n /\n Show error state and message\n /\n @Prop() error: boolean \| string;\n\n /\n \n /\n @Event() valueChange: EventEmitter<number>;\n\n @State() rangeInput = 0;\n @State() rangeMin = 0;\n @State() rangeMax = 100;\n @State() rangeTraceReference = 0;\n @State() showTooltip = false;\n\n private a11yAttributes: A11yAttributes;\n\n get tooltip() {\n return this.hostElement.shadowRoot.querySelector('ix-tooltip');\n }\n\n get pseudoThumb() {\n return this.hostElement.shadowRoot.querySelector('.thumb') as HTMLElement;\n }\n\n get slider() {\n return this.hostElement.shadowRoot.getElementById(\n 'slider'\n ) as HTMLInputElement;\n }\n\n @Watch('showTooltip')\n onShowTooltipChange() {\n if (this.showTooltip) {\n this.tooltip.showTooltip(this.pseudoThumb);\n return;\n }\n\n this.tooltip.hideTooltip();\n }\n\n componentWillLoad() {\n this.a11yAttributes = a11yHostAttributes(this.hostElement, [\n 'role',\n 'aria-valuemin',\n 'aria-valuemax',\n 'aria-valuenow',\n ]);\n this.updateRangeVariables();\n }\n\n @Watch('value')\n @Watch('max')\n @Watch('min')\n @Watch('traceReference')\n private updateRangeVariables() {\n this.rangeInput = between(this.min, this.value, this.max);\n this.rangeTraceReference = between(this.min, this.traceReference, this.max);\n this.rangeMin = Math.min(this.min, this.max);\n this.rangeMax = Math.max(this.min, this.max);\n }\n\n private onInput(event: InputEvent) {\n event.stopPropagation();\n const value = parseInt(this.slider.value);\n\n if (!isNaN(value)) {\n this.rangeInput = value;\n this.emitInputEvent();\n }\n }\n\n private emitInputEvent() {\n this.valueChange.emit(this.rangeInput);\n }\n\n private isMarkerActive(markerValue: number) {\n const start = Math.min(this.traceReference, this.rangeInput);\n const end = Math.max(this.traceReference, this.rangeInput);\n const value = markerValue;\n\n return value >= start && value <= end;\n }\n\n // Listen globally on window because sometimes the event listener\n // of the DOM element input itself is not called if the release\n // click is not inside the element anymore\n @Listen('pointerup', {\n target: 'window',\n })\n onPointerUp() {\n this.showTooltip = false;\n }\n\n render() {\n const range = this.rangeMax - this.rangeMin;\n\n let traceReferenceInPercentage =\n (this.rangeTraceReference - this.rangeMin) / range;\n\n let valueInPercentage = (this.rangeInput - this.rangeMin) / range;\n\n const distance = valueInPercentage - traceReferenceInPercentage;\n\n let traceStart = traceReferenceInPercentage;\n let traceEnd = valueInPercentage;\n\n if (distance <= 0) {\n traceStart = valueInPercentage;\n traceEnd = traceReferenceInPercentage;\n }\n\n return (\n <Host\n class={{\n disabled: this.disabled,\n error: !!this.error,\n }}\n onPointerDown={() => setTimeout(() => (this.showTooltip = true))}\n >\n <div class=\"slider\">\n <div class=\"track\">\n <div\n class=\"thumb\"\n style={{\n left: `calc(${valueInPercentage} 100% - 8px)`,\n }}\n ></div>\n <div class=\"ticks\">\n {this.marker\n ? this.marker.map((markerValue) => {\n if (markerValue > this.max \|\| markerValue < this.min) {\n return;\n }\n\n let left = (markerValue - this.rangeMin) / range;\n\n return (\n <div\n class={{\n tick: true,\n 'tick-active':\n this.isMarkerActive(markerValue) && this.trace,\n }}\n style={{\n '--tick-value': `${left}`,\n }}\n ></div>\n );\n })\n : null}\n </div>\n </div>\n\n <input\n id=\"slider\"\n type=\"range\"\n list={this.marker ? 'markers' : undefined}\n step={this.step}\n min={this.min}\n max={this.max}\n value={this.rangeInput}\n tabindex={this.disabled ? -1 : 0}\n onInput={(event) => this.onInput(event)}\n style={{\n '--value': `${valueInPercentage}`,\n '--trace-reference': `${traceReferenceInPercentage}`,\n '--trace-start': `${traceStart}`,\n '--trace-end': `${traceEnd}`,\n }}\n class={{\n trace:\n this.trace && traceReferenceInPercentage !== valueInPercentage,\n }}\n onFocus={() => {\n this.showTooltip = true;\n }}\n onBlur={() => {\n this.showTooltip = false;\n }}\n role=\"slider\"\n aria-valuenow={this.rangeInput}\n aria-valuemin={this.min}\n aria-valuemax={this.max}\n {...this.a11yAttributes}\n />\n\n <ix-tooltip\n class={{\n 'hide-tooltip': !this.showTooltip,\n }}\n animationFrame={true}\n >\n {this.rangeInput}\n </ix-tooltip>\n </div>\n <div class=\"label\">\n <div class=\"label-start\">\n <slot name=\"label-start\"></slot>\n </div>\n <div class=\"label-end\">\n <slot name=\"label-end\"></slot>\n </div>\n </div>\n {this.error ? (\n <ix-typography class={'label-error'} color=\"alarm\">\n {this.error}\n </ix-typography>\n ) : null}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/components/slider/slider.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { A11yAttributes, a11yHostAttributes } from '../utils/a11y';\nimport { OnListener } from '../utils/listener';\n\nexport type SliderMarker = Array<number>;\n\nfunction between(min: number, value: number, max: number) {\n if (value < min) {\n return min;\n } else if (value > max) {\n return max;\n } else {\n return value;\n }\n}\n\n/\n @since 2.0.0\n \n @slot label-start - Element will be displayed at the start of the slider\n * @slot label-end - Element will be displayed at the end of the slider\n /\n@Component({\n tag: 'ix-slider',\n styleUrl: 'slider.scss',\n shadow: true,\n})\nexport class Slider {\n @Element() hostElement!: HTMLIxSliderElement;\n\n /\n Legal number intervals\n \n @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#step\n /\n @Prop() step: number;\n\n /\n Minimum slider value\n /\n @Prop() min = 0;\n\n /\n Maximum slider value\n /\n @Prop() max = 100;\n\n /\n Current value of the slider\n /\n @Prop() value = 0;\n\n /\n Define tick marker on the slider. Marker has to be within slider min/max\n /\n @Prop() marker: SliderMarker;\n\n /\n Show a trace line\n /\n @Prop() trace = false;\n\n /\n Define the start point of the trace line\n /\n @Prop() traceReference = 0;\n\n /\n Show control as disabled\n /\n @Prop() disabled = false;\n\n /\n Show error state and message\n /\n @Prop() error: boolean \| string;\n\n /\n \n /\n @Event() valueChange: EventEmitter<number>;\n\n @State() rangeInput = 0;\n @State() rangeMin = 0;\n @State() rangeMax = 100;\n @State() rangeTraceReference = 0;\n @State() showTooltip = false;\n\n private a11yAttributes: A11yAttributes;\n\n get tooltip() {\n return this.hostElement.shadowRoot.querySelector('ix-tooltip');\n }\n\n get pseudoThumb() {\n return this.hostElement.shadowRoot.querySelector('.thumb') as HTMLElement;\n }\n\n get slider() {\n return this.hostElement.shadowRoot.getElementById(\n 'slider'\n ) as HTMLInputElement;\n }\n\n @Watch('showTooltip')\n onShowTooltipChange() {\n if (this.showTooltip) {\n this.tooltip.showTooltip(this.pseudoThumb);\n return;\n }\n\n this.tooltip.hideTooltip();\n }\n\n componentWillLoad() {\n this.a11yAttributes = a11yHostAttributes(this.hostElement, [\n 'role',\n 'aria-valuemin',\n 'aria-valuemax',\n 'aria-valuenow',\n ]);\n this.updateRangeVariables();\n }\n\n @Watch('value')\n @Watch('max')\n @Watch('min')\n @Watch('traceReference')\n private updateRangeVariables() {\n this.rangeInput = between(this.min, this.value, this.max);\n this.rangeTraceReference = between(this.min, this.traceReference, this.max);\n this.rangeMin = Math.min(this.min, this.max);\n this.rangeMax = Math.max(this.min, this.max);\n }\n\n private onInput(event: InputEvent) {\n event.stopPropagation();\n const value = parseInt(this.slider.value);\n\n if (!isNaN(value)) {\n this.rangeInput = value;\n this.emitInputEvent();\n }\n }\n\n private emitInputEvent() {\n this.valueChange.emit(this.rangeInput);\n }\n\n private isMarkerActive(markerValue: number) {\n const start = Math.min(this.traceReference, this.rangeInput);\n const end = Math.max(this.traceReference, this.rangeInput);\n const value = markerValue;\n\n return value >= start && value <= end;\n }\n\n // Listen globally on window because sometimes the event listener\n // of the DOM element input itself is not called if the release\n // click is not inside the element anymore\n @OnListener<Slider>('pointerUp', (self) => self.showTooltip)\n onPointerUp() {\n this.showTooltip = false;\n }\n\n render() {\n const range = this.rangeMax - this.rangeMin;\n\n let traceReferenceInPercentage =\n (this.rangeTraceReference - this.rangeMin) / range;\n\n let valueInPercentage = (this.rangeInput - this.rangeMin) / range;\n\n const distance = valueInPercentage - traceReferenceInPercentage;\n\n let traceStart = traceReferenceInPercentage;\n let traceEnd = valueInPercentage;\n\n if (distance <= 0) {\n traceStart = valueInPercentage;\n traceEnd = traceReferenceInPercentage;\n }\n\n return (\n <Host\n class={{\n disabled: this.disabled,\n error: !!this.error,\n }}\n onPointerDown={() => setTimeout(() => (this.showTooltip = true))}\n >\n <div class=\"slider\">\n <div class=\"track\">\n <div\n class=\"thumb\"\n style={{\n left: `calc(${valueInPercentage} 100% - 8px)`,\n }}\n ></div>\n <div class=\"ticks\">\n {this.marker\n ? this.marker.map((markerValue) => {\n if (markerValue > this.max \|\| markerValue < this.min) {\n return;\n }\n\n let left = (markerValue - this.rangeMin) / range;\n\n return (\n <div\n class={{\n tick: true,\n 'tick-active':\n this.isMarkerActive(markerValue) && this.trace,\n }}\n style={{\n '--tick-value': `${left}`,\n }}\n ></div>\n );\n })\n : null}\n </div>\n </div>\n\n <input\n id=\"slider\"\n type=\"range\"\n list={this.marker ? 'markers' : undefined}\n step={this.step}\n min={this.min}\n max={this.max}\n value={this.rangeInput}\n tabindex={this.disabled ? -1 : 0}\n onInput={(event) => this.onInput(event)}\n style={{\n '--value': `${valueInPercentage}`,\n '--trace-reference': `${traceReferenceInPercentage}`,\n '--trace-start': `${traceStart}`,\n '--trace-end': `${traceEnd}`,\n }}\n class={{\n trace:\n this.trace && traceReferenceInPercentage !== valueInPercentage,\n }}\n onFocus={() => {\n this.showTooltip = true;\n }}\n onBlur={() => {\n this.showTooltip = false;\n }}\n role=\"slider\"\n aria-valuenow={this.rangeInput}\n aria-valuemin={this.min}\n aria-valuemax={this.max}\n {...this.a11yAttributes}\n />\n\n <ix-tooltip\n class={{\n 'hide-tooltip': !this.showTooltip,\n }}\n animationFrame={true}\n >\n {this.rangeInput}\n </ix-tooltip>\n </div>\n <div class=\"label\">\n <div class=\"label-start\">\n <slot name=\"label-start\"></slot>\n </div>\n <div class=\"label-end\">\n <slot name=\"label-end\"></slot>\n </div>\n </div>\n {this.error ? (\n <ix-typography class={'label-error'} color=\"alarm\">\n {this.error}\n </ix-typography>\n ) : null}\n </Host>\n );\n }\n}\n"]}

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

@@ -7,6 +7,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { h, Host, } from '@stencil/core';
+import { requestAnimationFrameNoNgZone } from '../utils/requestAnimationFrame';
 export class Tabs {
   constructor() {
     this.windowStartSize = window.innerWidth;
@@ -22,10 +23,14 @@ export class Tabs {
     this.totalItems = 0;
     this.currentScrollAmount = 0;
     this.scrollAmount = 100;
-    this.styleNextArrow = {};
-    this.stylePreviousArrow = {};
     this.scrollActionAmount = 0;
   }
+  get arrowLeftElement() {
+    return this.hostElement.shadowRoot.querySelector('[data-arrow-left]');
+  }
+  get arrowRightElement() {
+    return this.hostElement.shadowRoot.querySelector('[data-arrow-right]');
+  }
   onWindowResize() {
     this.totalItems = 0;
     this.totalItems = this.getTabs().length;
@@ -146,10 +151,9 @@ export class Tabs {
     this.clickAction.isClick = true;
     return true;
   }
-  componentDidRender() {
+  componentWillLoad() {
     const tabs = this.getTabs();
-    this.totalItems = tabs.length;
-    tabs.forEach((element, index) => {
+    tabs.map((element, index) => {
       if (this.small)
         element.setAttribute('small', 'true');
       if (this.rounded)
@@ -159,12 +163,19 @@ export class Tabs {
       element.setAttribute('placement', this.placement);
     });
   }
+  componentDidRender() {
+    const tabs = this.getTabs();
+    this.totalItems = tabs.length;
+    tabs.map((element, index) => {
+      element.setAttribute('selected', index === this.selected ? 'true' : 'false');
+    });
+  }
   componentWillRender() {
-    requestAnimationFrame(() => {
+    requestAnimationFrameNoNgZone(() => {
       const showNextArrow = this.showNextArrow();
       const previousArrow = this.showPreviousArrow();
-      this.styleNextArrow = this.getArrowStyle(showNextArrow);
-      this.stylePreviousArrow = this.getArrowStyle(previousArrow);
+      Object.assign(this.arrowLeftElement.style, this.getArrowStyle(previousArrow));
+      Object.assign(this.arrowRightElement.style, this.getArrowStyle(showNextArrow));
     });
   }
   componentDidLoad() {
@@ -186,13 +197,13 @@ export class Tabs {
     });
   }
   render() {
-    return (h(Host, null, h("div", { class: "arrow", style: this.stylePreviousArrow, onClick: () => this.move(this.scrollAmount, true) }, h("ix-icon", { name: 'chevron-left-small' })), h("div", { class: {
+    return (h(Host, null, h("div", { class: "arrow", "data-arrow-left": true, onClick: () => this.move(this.scrollAmount, true) }, h("ix-icon", { name: 'chevron-left-small' })), h("div", { class: {
         'tab-items': true,
         'overflow-shadow': true,
         'shadow-left': this.showPreviousArrow(),
         'shadow-right': this.showNextArrow(),
         'shadow-both': this.showNextArrow() && this.showPreviousArrow(),
-      } }, h("div", { class: "items-content" }, h("slot", null))), h("div", { class: "arrow right", style: this.styleNextArrow, onClick: () => this.move(-this.scrollAmount, true) }, h("ix-icon", { name: 'chevron-right-small' }))));
+      } }, h("div", { class: "items-content" }, h("slot", null))), h("div", { class: "arrow right", "data-arrow-right": true, onClick: () => this.move(-this.scrollAmount, true) }, h("ix-icon", { name: 'chevron-right-small' }))));
   }
   static get is() { return "ix-tabs"; }
   static get encapsulation() { return "shadow"; }
@@ -305,8 +316,6 @@ export class Tabs {
       "totalItems": {},
       "currentScrollAmount": {},
       "scrollAmount": {},
-      "styleNextArrow": {},
-      "stylePreviousArrow": {},
       "scrollActionAmount": {}
     };
   }

package/dist/collection/components/tabs/tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n} from '@stencil/core';\n\n@Component({\n tag: 'ix-tabs',\n styleUrl: 'tabs.scss',\n shadow: true,\n})\nexport class Tabs {\n @Element() hostElement!: HTMLIxTabsElement;\n\n /\n Set tab items to small size\n /\n @Prop() small = false;\n\n /\n Set rounded tabs\n /\n @Prop() rounded = false;\n\n /\n Set default selected tab by index\n /\n @Prop({ mutable: true }) selected = 0;\n\n /\n Set layout width style\n /\n @Prop() layout: 'auto' \| 'stretched' = 'auto';\n\n /\n Set placement style\n /\n @Prop() placement: 'bottom' \| 'top' = 'bottom';\n\n /\n `selected` property changed\n \n @since 2.0.0\n /\n @Event() selectedChange: EventEmitter<number>;\n\n @State() totalItems = 0;\n @State() currentScrollAmount = 0;\n @State() scrollAmount = 100;\n @State() styleNextArrow = {};\n @State() stylePreviousArrow = {};\n\n @State() scrollActionAmount = 0;\n\n private windowStartSize = window.innerWidth;\n\n private clickAction: {\n timeout: NodeJS.Timeout;\n isClick: boolean;\n } = {\n timeout: null,\n isClick: true,\n };\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.totalItems = 0;\n this.totalItems = this.getTabs().length;\n\n if (this.windowStartSize === 0)\n return (this.windowStartSize = window.innerWidth);\n this.move(this.windowStartSize - window.innerWidth);\n this.windowStartSize = window.innerWidth;\n }\n\n private getTabs() {\n return Array.from(this.hostElement.querySelectorAll('ix-tab-item'));\n }\n\n private getTab(tabIndex: number) {\n return this.getTabs()[tabIndex];\n }\n\n private getTabsWrapper() {\n return this.hostElement.shadowRoot.querySelector('.items-content');\n }\n\n private showArrows() {\n try {\n const tabWrapper = this.getTabsWrapper();\n return (\n tabWrapper.scrollWidth >\n Math.ceil(tabWrapper.getBoundingClientRect().width) &&\n this.layout === 'auto'\n );\n } catch (error) {\n return false;\n }\n }\n\n private showPreviousArrow() {\n try {\n return this.showArrows() && this.scrollActionAmount < 0;\n } catch (error) {\n return false;\n }\n }\n\n private showNextArrow() {\n try {\n const tabWrapper = this.getTabsWrapper();\n const tabWrapperRect = tabWrapper.getBoundingClientRect();\n\n return (\n this.showArrows() &&\n this.scrollActionAmount >\n (tabWrapper.scrollWidth - tabWrapperRect.width) -1\n );\n } catch (error) {\n return false;\n }\n }\n\n private getArrowStyle(condition: boolean) {\n return {\n opacity: condition ? '1' : '0',\n zIndex: condition ? '1' : '-1',\n };\n }\n\n private move(amount: number, click = false) {\n const tabWrapper = this.getTabsWrapper();\n const maxScrollWidth =\n (tabWrapper.scrollWidth - tabWrapper.getBoundingClientRect().width) * -1;\n\n amount = this.currentScrollAmount + amount;\n amount = amount > 0 ? 0 : amount < maxScrollWidth ? maxScrollWidth : amount;\n\n const styles = [\n `transform: translateX(${amount}px);`,\n click ? 'transition: all ease-in-out 400ms;' : '',\n ].join('');\n\n tabWrapper.setAttribute('style', styles);\n\n if (click) this.currentScrollAmount = this.scrollActionAmount = amount;\n else this.scrollActionAmount = amount;\n }\n\n private moveTabToView(tabIndex: number) {\n if (!this.showArrows()) return;\n\n const tab = this.getTab(tabIndex).getBoundingClientRect();\n const amount = tab.x * -1;\n this.move(amount, true);\n }\n\n private setSelected(index: number) {\n this.selected = index;\n }\n\n private clickTab(index: number) {\n if (this.dragStop()) {\n return;\n }\n\n const { defaultPrevented } = this.selectedChange.emit(index);\n if (defaultPrevented) {\n return;\n }\n\n this.setSelected(index);\n this.moveTabToView(index);\n }\n\n private dragStart(element: HTMLIxTabItemElement, event: MouseEvent) {\n if (!this.showArrows()) return;\n if (event.button > 0) return;\n\n this.clickAction.timeout =\n this.clickAction.timeout === null\n ? setTimeout(() => (this.clickAction.isClick = false), 300)\n : null;\n\n const tabPositionX = parseFloat(window.getComputedStyle(element).left);\n const mousedownPositionX = event.clientX;\n const move = (event: MouseEvent) =>\n this.dragMove(event, tabPositionX, mousedownPositionX);\n\n window.addEventListener('mouseup', () => {\n window.removeEventListener('mousemove', move, false);\n this.dragStop();\n });\n window.addEventListener('mousemove', move, false);\n }\n\n private dragMove(event: MouseEvent, tabX: number, mousedownX: number) {\n this.move(event.clientX + tabX - mousedownX);\n }\n\n private dragStop() {\n clearTimeout(this.clickAction.timeout);\n this.clickAction.timeout = null;\n\n if (this.clickAction.isClick) return false;\n\n this.currentScrollAmount = this.scrollActionAmount;\n this.clickAction.isClick = true;\n\n return true;\n }\n\n componentDidRender() {\n const tabs = this.getTabs();\n this.totalItems = tabs.length;\n\n tabs.forEach((element, index) => {\n if (this.small) element.setAttribute('small', 'true');\n\n if (this.rounded) element.setAttribute('rounded', 'true');\n\n element.setAttribute('layout', this.layout);\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n element.setAttribute('placement', this.placement);\n });\n }\n\n componentWillRender() {\n requestAnimationFrame(() => {\n const showNextArrow = this.showNextArrow();\n const previousArrow = this.showPreviousArrow();\n this.styleNextArrow = this.getArrowStyle(showNextArrow);\n this.stylePreviousArrow = this.getArrowStyle(previousArrow);\n });\n }\n\n componentDidLoad() {\n const tabs = this.getTabs();\n tabs.forEach((element) => {\n element.addEventListener('mousedown', (event) =>\n this.dragStart(element, event)\n );\n });\n }\n\n @Listen('tabClick')\n onTabClick(event: CustomEvent) {\n if (event.defaultPrevented) {\n return;\n }\n\n const target = event.target;\n const tabs = this.getTabs();\n\n tabs.forEach((tab, index) => {\n if (!tab.disabled && tab === target) {\n this.clickTab(index);\n }\n });\n }\n\n render() {\n return (\n <Host>\n <div\n class=\"arrow\"\n style={this.stylePreviousArrow}\n onClick={() => this.move(this.scrollAmount, true)}\n >\n <ix-icon name={'chevron-left-small'}></ix-icon>\n </div>\n <div\n class={{\n 'tab-items': true,\n 'overflow-shadow': true,\n 'shadow-left': this.showPreviousArrow(),\n 'shadow-right': this.showNextArrow(),\n 'shadow-both': this.showNextArrow() && this.showPreviousArrow(),\n }}\n >\n <div class=\"items-content\">\n <slot></slot>\n </div>\n </div>\n <div\n class=\"arrow right\"\n style={this.styleNextArrow}\n onClick={() => this.move(-this.scrollAmount, true)}\n >\n <ix-icon name={'chevron-right-small'}></ix-icon>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n} from '@stencil/core';\nimport { requestAnimationFrameNoNgZone } from '../utils/requestAnimationFrame';\n\n@Component({\n tag: 'ix-tabs',\n styleUrl: 'tabs.scss',\n shadow: true,\n})\nexport class Tabs {\n @Element() hostElement!: HTMLIxTabsElement;\n\n /\n Set tab items to small size\n /\n @Prop() small = false;\n\n /\n Set rounded tabs\n /\n @Prop() rounded = false;\n\n /\n Set default selected tab by index\n /\n @Prop({ mutable: true }) selected = 0;\n\n /\n Set layout width style\n /\n @Prop() layout: 'auto' \| 'stretched' = 'auto';\n\n /\n Set placement style\n /\n @Prop() placement: 'bottom' \| 'top' = 'bottom';\n\n /\n `selected` property changed\n \n @since 2.0.0\n /\n @Event() selectedChange: EventEmitter<number>;\n\n @State() totalItems = 0;\n @State() currentScrollAmount = 0;\n @State() scrollAmount = 100;\n\n @State() scrollActionAmount = 0;\n\n private windowStartSize = window.innerWidth;\n\n private get arrowLeftElement() {\n return this.hostElement.shadowRoot.querySelector(\n '[data-arrow-left]'\n ) as HTMLElement;\n }\n\n private get arrowRightElement() {\n return this.hostElement.shadowRoot.querySelector(\n '[data-arrow-right]'\n ) as HTMLElement;\n }\n\n private clickAction: {\n timeout: NodeJS.Timeout;\n isClick: boolean;\n } = {\n timeout: null,\n isClick: true,\n };\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.totalItems = 0;\n this.totalItems = this.getTabs().length;\n\n if (this.windowStartSize === 0)\n return (this.windowStartSize = window.innerWidth);\n this.move(this.windowStartSize - window.innerWidth);\n this.windowStartSize = window.innerWidth;\n }\n\n private getTabs() {\n return Array.from(this.hostElement.querySelectorAll('ix-tab-item'));\n }\n\n private getTab(tabIndex: number) {\n return this.getTabs()[tabIndex];\n }\n\n private getTabsWrapper() {\n return this.hostElement.shadowRoot.querySelector('.items-content');\n }\n\n private showArrows() {\n try {\n const tabWrapper = this.getTabsWrapper();\n return (\n tabWrapper.scrollWidth >\n Math.ceil(tabWrapper.getBoundingClientRect().width) &&\n this.layout === 'auto'\n );\n } catch (error) {\n return false;\n }\n }\n\n private showPreviousArrow() {\n try {\n return this.showArrows() && this.scrollActionAmount < 0;\n } catch (error) {\n return false;\n }\n }\n\n private showNextArrow() {\n try {\n const tabWrapper = this.getTabsWrapper();\n const tabWrapperRect = tabWrapper.getBoundingClientRect();\n\n return (\n this.showArrows() &&\n this.scrollActionAmount >\n (tabWrapper.scrollWidth - tabWrapperRect.width) -1\n );\n } catch (error) {\n return false;\n }\n }\n\n private getArrowStyle(condition: boolean) {\n return {\n opacity: condition ? '1' : '0',\n zIndex: condition ? '1' : '-1',\n };\n }\n\n private move(amount: number, click = false) {\n const tabWrapper = this.getTabsWrapper();\n const maxScrollWidth =\n (tabWrapper.scrollWidth - tabWrapper.getBoundingClientRect().width) * -1;\n\n amount = this.currentScrollAmount + amount;\n amount = amount > 0 ? 0 : amount < maxScrollWidth ? maxScrollWidth : amount;\n\n const styles = [\n `transform: translateX(${amount}px);`,\n click ? 'transition: all ease-in-out 400ms;' : '',\n ].join('');\n\n tabWrapper.setAttribute('style', styles);\n\n if (click) this.currentScrollAmount = this.scrollActionAmount = amount;\n else this.scrollActionAmount = amount;\n }\n\n private moveTabToView(tabIndex: number) {\n if (!this.showArrows()) return;\n\n const tab = this.getTab(tabIndex).getBoundingClientRect();\n const amount = tab.x * -1;\n this.move(amount, true);\n }\n\n private setSelected(index: number) {\n this.selected = index;\n }\n\n private clickTab(index: number) {\n if (this.dragStop()) {\n return;\n }\n\n const { defaultPrevented } = this.selectedChange.emit(index);\n if (defaultPrevented) {\n return;\n }\n\n this.setSelected(index);\n this.moveTabToView(index);\n }\n\n private dragStart(element: HTMLIxTabItemElement, event: MouseEvent) {\n if (!this.showArrows()) return;\n if (event.button > 0) return;\n\n this.clickAction.timeout =\n this.clickAction.timeout === null\n ? setTimeout(() => (this.clickAction.isClick = false), 300)\n : null;\n\n const tabPositionX = parseFloat(window.getComputedStyle(element).left);\n const mousedownPositionX = event.clientX;\n const move = (event: MouseEvent) =>\n this.dragMove(event, tabPositionX, mousedownPositionX);\n\n window.addEventListener('mouseup', () => {\n window.removeEventListener('mousemove', move, false);\n this.dragStop();\n });\n window.addEventListener('mousemove', move, false);\n }\n\n private dragMove(event: MouseEvent, tabX: number, mousedownX: number) {\n this.move(event.clientX + tabX - mousedownX);\n }\n\n private dragStop() {\n clearTimeout(this.clickAction.timeout);\n this.clickAction.timeout = null;\n\n if (this.clickAction.isClick) return false;\n\n this.currentScrollAmount = this.scrollActionAmount;\n this.clickAction.isClick = true;\n\n return true;\n }\n\n componentWillLoad() {\n const tabs = this.getTabs();\n\n tabs.map((element, index) => {\n if (this.small) element.setAttribute('small', 'true');\n\n if (this.rounded) element.setAttribute('rounded', 'true');\n\n element.setAttribute('layout', this.layout);\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n\n element.setAttribute('placement', this.placement);\n });\n }\n\n componentDidRender() {\n const tabs = this.getTabs();\n this.totalItems = tabs.length;\n\n tabs.map((element, index) => {\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n });\n }\n\n componentWillRender() {\n requestAnimationFrameNoNgZone(() => {\n const showNextArrow = this.showNextArrow();\n const previousArrow = this.showPreviousArrow();\n\n Object.assign(\n this.arrowLeftElement.style,\n this.getArrowStyle(previousArrow)\n );\n Object.assign(\n this.arrowRightElement.style,\n this.getArrowStyle(showNextArrow)\n );\n });\n }\n\n componentDidLoad() {\n const tabs = this.getTabs();\n tabs.forEach((element) => {\n element.addEventListener('mousedown', (event) =>\n this.dragStart(element, event)\n );\n });\n }\n\n @Listen('tabClick')\n onTabClick(event: CustomEvent) {\n if (event.defaultPrevented) {\n return;\n }\n\n const target = event.target;\n const tabs = this.getTabs();\n\n tabs.forEach((tab, index) => {\n if (!tab.disabled && tab === target) {\n this.clickTab(index);\n }\n });\n }\n\n render() {\n return (\n <Host>\n <div\n class=\"arrow\"\n data-arrow-left\n onClick={() => this.move(this.scrollAmount, true)}\n >\n <ix-icon name={'chevron-left-small'}></ix-icon>\n </div>\n <div\n class={{\n 'tab-items': true,\n 'overflow-shadow': true,\n 'shadow-left': this.showPreviousArrow(),\n 'shadow-right': this.showNextArrow(),\n 'shadow-both': this.showNextArrow() && this.showPreviousArrow(),\n }}\n >\n <div class=\"items-content\">\n <slot></slot>\n </div>\n </div>\n <div\n class=\"arrow right\"\n data-arrow-right\n onClick={() => this.move(-this.scrollAmount, true)}\n >\n <ix-icon name={'chevron-right-small'}></ix-icon>\n </div>\n </Host>\n );\n }\n}\n"]}

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

@@ -120,16 +120,14 @@
   display: flex;
   height: 2.5rem;
   max-height: 2.5rem;
-  -webkit-padding-end: 0.5rem;
-          padding-inline-end: 0.5rem;
+  padding-inline-end: 0.5rem;
 }
 :host .tile-subheader {
   color: var(--theme-btn-invisible-secondary--color);
   flex-grow: 0;
 }
 :host .tile-footer.has-content {
-  -webkit-border-before: 1px solid var(--theme-color-1);
-          border-block-start: 1px solid var(--theme-color-1);
+  border-block-start: 1px solid var(--theme-color-1);
   height: 2.5rem;
 }