npm - @siemens/ix - Versions diffs - 0.0.0-20240522074328 → 0.0.0-pr-1318-20240627080522 - Mend

@siemens/ix 0.0.0-20240522074328 → 0.0.0-pr-1318-20240627080522

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 (1382) hide show

package/components/ix-category-filter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-category-filter.js","mappings":"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","names":[],"sources":["src/components/category-filter/category-filter.scss?tag=ix-category-filter&encapsulation=shadow","src/components/category-filter/category-filter.tsx"],"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\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/shadows';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n@import '../button/button';\n@import 'legacy/components/dropdown';\n@import 'legacy/components/forms';\n@import 'components/form/input';\n\n:host {\n @include ix-component;\n\n display: block;\n position: relative;\n height: auto;\n\n @include host-focus-visible {\n border-color: var(--theme-color-primary);\n box-shadow: 0 0 $tiny-space 0 var(--theme-color-primary) !important;\n }\n\n .reset-button {\n position: absolute;\n top: $tiny-space;\n right: $tiny-space;\n }\n\n .reset-button.hide-reset-button {\n display: none;\n }\n\n .input-container {\n &:not(.readonly):not(.disabled) {\n @include element-input('false');\n }\n\n &.disabled {\n color: var(--theme-input--color--disabled);\n border-bottom: var(--theme-input--border-thickness, 1px) solid\n var(--theme-input--border-color-bottom--disabled);\n }\n\n &.readonly {\n @include element-input;\n }\n\n display: flex;\n height: auto;\n max-height: 3.75rem;\n padding: 1px $large-space 1px 1.75rem !important;\n\n &.no-icon {\n padding-left: $tiny-space;\n }\n }\n\n .token-container {\n flex-grow: 1;\n overflow: hidden;\n }\n\n .text-input {\n @include ellipsis;\n @include text-default;\n width: auto;\n height: 1.75rem;\n min-height: $large-space;\n background: transparent;\n flex-grow: 1;\n box-shadow: none;\n\n &,\n &:hover,\n &:focus-visible {\n border: none;\n outline: none;\n }\n\n &.hide-placeholder::placeholder {\n opacity: 0;\n }\n }\n\n .list-unstyled {\n display: flex;\n flex-wrap: wrap;\n list-style: none;\n padding: 0;\n margin: 0;\n overflow-y: auto;\n }\n\n ix-icon {\n position: absolute;\n top: $small-space;\n left: $small-space;\n }\n\n ix-filter-chip {\n margin-right: $tiny-space;\n }\n\n .category-preview {\n display: flex;\n align-items: center;\n height: $large-space;\n background-color: var(--theme-bg-3);\n border-top-left-radius: $default-space;\n border-bottom-left-radius: $default-space;\n padding: $small-space;\n margin: 2px 0;\n }\n\n ul {\n height: 100%;\n }\n\n ul > li,\n input {\n padding-inline-start: 0;\n padding-top: 2px;\n padding-bottom: 2px;\n }\n\n ix-dropdown {\n min-width: 10rem !important;\n\n .dropdown-item-container {\n display: flex;\n flex-direction: column;\n\n .dropdown-item {\n @include text-default-single;\n @include ellipsis;\n @include focus-visible {\n border-color: var(--theme-color-focus-bdr);\n }\n\n height: $large-control-height;\n margin: $tiny-space $small-space;\n padding-inline: $small-space;\n border: 1px solid transparent;\n border-radius: 100rem;\n width: auto;\n justify-content: flex-start;\n flex-grow: 1;\n }\n\n .category-item {\n border-end-end-radius: 0;\n border-start-end-radius: 0;\n }\n\n .category-item-value {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n }\n\n .btn-toggle-operator {\n width: 2rem;\n height: 2rem;\n margin-inline: $small-space;\n }\n }\n\n .d-none {\n display: none;\n }\n}\n","/\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 { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { FilterState } from './filter-state';\nimport { InputState } from './input-state';\nimport { LogicalFilterOperator } from './logical-filter-operator';\n\n@Component({\n tag: 'ix-category-filter',\n styleUrl: 'category-filter.scss',\n shadow: true,\n})\nexport class CategoryFilter {\n private readonly ID_CUSTOM_FILTER_VALUE = 'CW_CUSTOM_FILTER_VALUE';\n\n @State() showDropdown: boolean;\n @State() private textInput?: HTMLInputElement;\n private formElement?: HTMLFormElement;\n private isScrollStateDirty: boolean;\n\n @Element() hostElement: HTMLIxCategoryFilterElement;\n\n @State() hasFocus: boolean;\n @State() categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n @State() inputValue: string;\n @State() category: string;\n @State() filterTokens: Array<{\n id: string;\n value: string;\n operator: LogicalFilterOperator;\n }> = [];\n\n /\n If true the filter will be in disabled state\n /\n @Prop() disabled = false;\n\n /\n If true the filter will be in readonly mode\n /\n @Prop() readonly = false;\n\n /\n A set of search criteria to populate the component with.\n /\n @Prop() filterState: FilterState;\n\n /\n Placeholder text to be displayed in an empty input field.\n /\n @Prop() placeholder: string;\n\n /\n Configuration object hash used to populate the dropwdown menu for typeahead and quick selection functionality.\n * Each ID maps to an object with a label and an array of options to select from.\n /\n @Prop() categories: {\n [id: string]: {\n label: string;\n options: string[];\n };\n };\n\n /\n In certain use cases some categories may not be available for selection anymore.\n * To allow proper display of set filters with these categories this ID to label mapping can be populated.\n \n Configuration object hash used to supply labels to the filter chips in the input field.\n * Each ID maps to a string representing the label to display.\n /\n @Prop() nonSelectableCategories?: {\n [id: string]: string;\n } = {};\n\n /\n A list of strings that will be supplied as typeahead suggestions not tied to any categories.\n /\n @Prop() suggestions: string[];\n\n /\n The icon next to the actual text input\n * Defaults to 'search'\n /\n @Prop() icon = 'search';\n\n /\n Allows to hide the icon inside the text input.\n * Defaults to false\n /\n @Prop() hideIcon: boolean;\n\n /\n If set categories will always be filtered via the respective logical operator.\n * Toggling of the operator will not be available to the user.\n \n @since 2.2.0\n /\n @Prop() staticOperator?: LogicalFilterOperator;\n\n /\n If set to true allows that a single category can be set more than once.\n * An already set category will not appear in the category dropdown if set to false.\n \n Defaults to true\n /\n @Prop() repeatCategories = true;\n\n /\n @internal For debugging purposes only!\n /\n @Prop() tmpDisableScrollIntoView = true;\n\n /\n i18n\n /\n @Prop() labelCategories = 'Categories';\n\n /\n i18n\n /\n @Prop() i18nPlainText = 'Filter by text';\n\n /\n Event dispatched whenever the a category gets selected in the dropdown\n /\n @Event() categoryChanged: EventEmitter<string>;\n\n /\n Event dispatched whenever the text input changes.\n /\n @Event() inputChanged: EventEmitter<InputState>;\n\n /\n Event dispatched whenever the filter state changes.\n */\n @Event() filterChanged: EventEmitter<FilterState>;\n\n get dropdown() {\n return this.hostElement.shadowRoot.querySelector('ix-dropdown');\n }\n\n @Watch('filterState')\n watchFilterState(newValue) {\n this.setFilterState(newValue);\n }\n\n componentDidLoad() {\n if (this.filterState !== undefined) {\n setTimeout(() => this.setFilterState(this.filterState));\n }\n\n this.hostElement?.addEventListener(\n 'keydown',\n this.handleFormElementKeyDown.bind(this)\n );\n\n this.formElement?.addEventListener('submit', (e) => e.preventDefault());\n\n if (this.textInput == null) {\n console.warn(\n 'ix-category-filter - unable to add event listeners to native input element'\n );\n return;\n }\n\n this.textInput.addEventListener('focusin', () => {\n this.hasFocus = true;\n });\n this.textInput.addEventListener('focusout', () => (this.hasFocus = false));\n this.textInput.addEventListener('input', () => {\n this.inputValue = this.textInput.value;\n const inputState = new InputState(this.inputValue, this.category);\n this.inputChanged.emit(inputState);\n\n if (!this.dropdown.show) {\n this.openDropdown();\n }\n });\n this.textInput.addEventListener(\n 'keydown',\n this.handleInputElementKeyDown.bind(this)\n );\n }\n\n private setFilterState(state: FilterState) {\n this.filterTokens = [];\n\n for (const token of state.tokens) {\n this.addToken(\n token,\n this.ID_CUSTOM_FILTER_VALUE,\n this.categoryLogicalOperator,\n false\n );\n }\n\n for (const category of state.categories) {\n this.addToken(category.value, category.id, category.operator, false);\n }\n\n this.emitFilterEvent();\n }\n\n private closeDropdown() {\n if (this.disabled \|\| this.readonly) {\n return;\n }\n\n this.dropdown.show = false;\n }\n\n private openDropdown() {\n if (this.disabled \|\| this.readonly) {\n return;\n }\n\n this.dropdown.show = true;\n }\n\n private handleFormElementKeyDown(e: KeyboardEvent) {\n switch (e.code) {\n case 'Enter':\n case 'NumpadEnter':\n if (!document.activeElement.classList.contains('dropdown-item')) {\n return;\n }\n\n const token = document.activeElement.getAttribute('data-id');\n\n if (this.hasCategorySelection()) {\n if (this.category !== undefined) {\n this.addToken(token, this.category);\n } else if (\n document.activeElement.classList.contains('category-item-id')\n ) {\n this.selectCategory(token);\n }\n } else {\n this.addToken(token);\n }\n\n e.preventDefault();\n break;\n\n case 'ArrowUp':\n this.focusPreviousItem();\n e.preventDefault();\n break;\n\n case 'ArrowDown':\n this.showDropdown = true;\n this.focusNextItem();\n e.preventDefault();\n break;\n\n case 'Escape':\n this.closeDropdown();\n break;\n }\n }\n\n private focusPreviousItem() {\n const sibling = document.activeElement.previousSibling;\n if (sibling instanceof HTMLElement) {\n sibling.focus();\n }\n }\n\n private focusNextItem() {\n const sibling = document.activeElement.nextSibling;\n if (sibling instanceof HTMLElement) {\n sibling.focus();\n }\n }\n\n private handleInputElementKeyDown(e: KeyboardEvent) {\n switch (e.code) {\n case 'ArrowDown':\n const selector = `.category-item-${\n this.category !== undefined ? 'value' : 'id'\n }`;\n let item = this.hostElement.shadowRoot.querySelector(selector);\n\n if (item instanceof HTMLElement) {\n item.focus();\n e.stopPropagation();\n } else if (this.suggestions?.length) {\n item = this.hostElement.shadowRoot.querySelector('.category-item');\n if (item instanceof HTMLElement) {\n item.focus();\n e.stopPropagation();\n }\n }\n break;\n\n case 'Backspace':\n if (this.textInput.value !== '') {\n return;\n }\n\n if (this.category !== undefined) {\n this.category = undefined;\n return;\n }\n\n const tokenCount = this.filterTokens.length;\n if (tokenCount > 0) {\n this.removeToken(tokenCount - 1);\n }\n break;\n\n case 'Enter':\n case 'NumpadEnter':\n this.addToken(this.inputValue, this.category);\n e.preventDefault();\n break;\n }\n }\n\n private emitFilterEvent() {\n const tokens = this.filterTokens\n .filter((item) => item.id === this.ID_CUSTOM_FILTER_VALUE)\n .map((item) => item.value);\n const categories = this.filterTokens.filter(\n (item) => item.id !== this.ID_CUSTOM_FILTER_VALUE\n );\n const filterState: FilterState = {\n tokens,\n categories,\n };\n\n this.filterChanged.emit(filterState);\n }\n\n private addToken(\n token: string,\n category: string = this.ID_CUSTOM_FILTER_VALUE,\n operator = this.categoryLogicalOperator,\n emitEvent = true\n ) {\n if (token === undefined \|\| token === null) {\n return;\n }\n\n const newToken = token.trim();\n\n if (newToken === '') {\n return;\n }\n\n if (this.hasToken(newToken)) {\n return;\n }\n\n const pair = { id: category, value: newToken, operator };\n this.filterTokens = [...this.filterTokens, pair];\n this.textInput.value = '';\n this.inputValue = '';\n this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n\n if (this.category !== undefined) {\n this.category = undefined;\n }\n\n this.isScrollStateDirty = true;\n\n this.textInput.focus();\n\n if (emitEvent) {\n this.emitFilterEvent();\n }\n }\n\n private removeToken(index: number) {\n this.filterTokens = this.filterTokens.filter((_, i) => i !== index);\n this.emitFilterEvent();\n }\n\n private getCategoryIds() {\n const ids = [];\n for (const id in this.categories) {\n if (Object.prototype.hasOwnProperty.call(this.categories, id)) {\n ids.push(id);\n }\n }\n\n return ids;\n }\n\n private selectCategory(category: string) {\n this.category = category;\n this.textInput.value = '';\n this.inputValue = '';\n this.textInput.focus();\n this.categoryChanged.emit(category);\n }\n\n private resetFilter(e: Event) {\n e.stopPropagation();\n this.closeDropdown();\n this.filterTokens = [];\n this.emitFilterEvent();\n }\n\n private filterMultiples(value: string) {\n if (this.repeatCategories) {\n return true;\n }\n\n const isCategoryAlreadySet = this.filterTokens.find(\n (token) => token.id === value\n );\n\n return !isCategoryAlreadySet;\n }\n\n private hasToken(token: string) {\n return this.filterTokens.some((filterToken) => {\n const hasSameValue = filterToken.value === token;\n\n if (!hasSameValue) {\n return false;\n }\n\n if (this.category !== undefined) {\n return this.category === filterToken.id;\n }\n\n if (filterToken.id) {\n return filterToken.id === this.ID_CUSTOM_FILTER_VALUE;\n }\n\n return hasSameValue;\n });\n }\n\n private filterDuplicateTokens(value: string) {\n return !this.hasToken(value);\n }\n\n private filterByInput(value: string) {\n if (this.inputValue === undefined \|\| this.inputValue === '') {\n return true;\n }\n\n return value.toLowerCase().indexOf(this.inputValue.toLowerCase()) !== -1;\n }\n\n private toggleCategoryOperator() {\n switch (this.categoryLogicalOperator) {\n case LogicalFilterOperator.EQUAL:\n this.categoryLogicalOperator = LogicalFilterOperator.NOT_EQUAL;\n break;\n\n case LogicalFilterOperator.NOT_EQUAL:\n this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n break;\n }\n }\n\n private getFilterChipLabel(value: {\n id: string;\n value: string;\n operator: LogicalFilterOperator;\n }): string {\n if (value.id === this.ID_CUSTOM_FILTER_VALUE) {\n return value.value;\n }\n\n const operatorString =\n value.operator === LogicalFilterOperator.EQUAL ? '=' : '!=';\n const label =\n this.categories[value.id]?.label ??\n this.nonSelectableCategories[value.id] ??\n value.id;\n\n return `${label} ${operatorString} ${value.value}`;\n }\n\n private getFilteredSuggestions() {\n if (!this.suggestions?.length) {\n return [];\n }\n\n return this.suggestions\n ?.filter((value) => this.filterByInput(value))\n .filter((value) => this.filterDuplicateTokens(value));\n }\n\n private hasCategorySelection() {\n return this.categories !== undefined;\n }\n\n private renderPlainSuggestions() {\n return (\n <div class=\"dropdown-item-container\">\n {this.getFilteredSuggestions().map((suggestion) => (\n <button\n class=\"dropdown-item\"\n data-id={suggestion}\n onClick={() => this.addToken(suggestion)}\n key={suggestion}\n title={suggestion}\n >\n {suggestion}\n </button>\n ))}\n </div>\n );\n }\n\n private renderOperatorButton() {\n if (this.staticOperator) {\n return '';\n }\n\n const params: BaseButtonProps = {\n type: 'button',\n variant: 'secondary',\n outline: false,\n ghost: true,\n iconOnly: true,\n iconOval: false,\n selected: false,\n disabled: this.disabled \|\| this.staticOperator !== undefined,\n loading: false,\n icon: '',\n onClick: (e: Event) => {\n e.stopPropagation();\n this.toggleCategoryOperator();\n },\n extraClasses: {\n 'btn-icon-32': true,\n 'btn-toggle-operator': true,\n },\n };\n\n return (\n <BaseButton {...params}>\n {this.categoryLogicalOperator === LogicalFilterOperator.NOT_EQUAL\n ? '='\n : '!='}\n </BaseButton>\n );\n }\n\n private getFilterOperatorString() {\n let operator: LogicalFilterOperator;\n if (this.staticOperator !== undefined) {\n operator = this.staticOperator;\n } else {\n operator = this.categoryLogicalOperator;\n }\n return `${operator === LogicalFilterOperator.EQUAL ? '=' : '!='} `;\n }\n\n private renderCategoryValues() {\n return (\n <div class=\"dropdown-item-container\">\n {this.renderOperatorButton()}\n <div class=\"dropdown-header\">\n {this.categories[this.category]?.label}\n </div>\n {this.categories[this.category]?.options\n .filter((value) => this.filterByInput(value))\n .filter((value) => this.filterDuplicateTokens(value))\n .map((id) => (\n <button\n class=\"dropdown-item category-item-value\"\n data-id={id}\n title={id}\n key={id}\n onClick={() => this.addToken(id, this.category)}\n >\n {`${this.getFilterOperatorString()} ${id}`}\n </button>\n ))}\n </div>\n );\n }\n\n private renderDropdownContent() {\n if (this.hasCategorySelection()) {\n if (this.category !== undefined) {\n return this.renderCategoryValues();\n } else {\n return this.renderCategorySelection();\n }\n } else return this.renderPlainSuggestions();\n }\n\n private renderCategorySelection() {\n return (\n <div class=\"dropdown-item-container\">\n {this.getCategoryIds()\n ?.filter((id) => this.filterByInput(this.categories[id].label))\n .filter((id) => this.filterMultiples(id))\n .map((id) => (\n <button\n class=\"dropdown-item category-item category-item-id\"\n data-id={id}\n title={this.categories[id].label}\n key={id}\n onClick={(e) => {\n e.preventDefault();\n this.selectCategory(id);\n }}\n tabindex=\"0\"\n >\n {this.categories[id]?.label}\n </button>\n ))}\n </div>\n );\n }\n\n private getDropdownHeader() {\n if (this.categories !== undefined) {\n if (this.category !== undefined) {\n return null;\n } else {\n return this.labelCategories;\n }\n }\n\n return this.i18nPlainText;\n }\n\n componentDidRender() {\n if (this.isScrollStateDirty) {\n if (!this.tmpDisableScrollIntoView) {\n this.textInput.scrollIntoView();\n }\n this.isScrollStateDirty = false;\n }\n }\n\n private getResetButton() {\n return (\n <ix-icon-button\n onClick={(e) => this.resetFilter(e)}\n class={{\n 'reset-button': true,\n 'hide-reset-button':\n !this.filterTokens.length && this.category === undefined,\n }}\n ghost\n oval\n icon={'clear'}\n size=\"16\"\n ></ix-icon-button>\n );\n }\n\n private getIconColor() {\n if (this.disabled) {\n return 'color-componentn-1';\n }\n\n if (this.readonly) {\n return 'color-std-txt';\n }\n\n return 'color-primary';\n }\n\n render() {\n return (\n <Host>\n <form ref={(el) => (this.formElement = el)}>\n <div\n read-only={this.readonly}\n class={{\n 'input-container': true,\n disabled: this.disabled,\n focus: this.hasFocus,\n readonly: this.readonly,\n 'no-icon': this.hideIcon,\n }}\n >\n <ix-icon\n color={this.getIconColor()}\n class={{ 'd-none': this.hideIcon }}\n name={this.icon}\n size=\"16\"\n ></ix-icon>\n <div class=\"token-container\">\n <ul class=\"list-unstyled\">\n {this.filterTokens.map((value, index) => (\n <li\n key={value.toString()}\n class={{\n animate__animated: true,\n animate__fadein: true,\n }}\n >\n <ix-filter-chip\n disabled={this.disabled}\n readonly={this.readonly}\n onClick={(e) => e.stopPropagation()}\n onCloseClick={() => this.removeToken(index)}\n >\n {this.getFilterChipLabel(value)}\n </ix-filter-chip>\n </li>\n ))}\n {this.categories === undefined ? (\n ''\n ) : (\n <li\n class={{\n 'category-preview': true,\n 'd-none': this.category === undefined,\n }}\n >\n {this.categories[this.category]?.label}\n </li>\n )}\n <input\n class={{\n 'text-input': true,\n 'hide-placeholder':\n this.readonly \|\|\n this.disabled \|\|\n this.category !== undefined,\n }}\n autocomplete=\"off\"\n name=\"category-filter-input\"\n disabled={this.disabled}\n readonly={this.readonly}\n ref={(el) => (this.textInput = el)}\n type=\"text\"\n placeholder={this.placeholder}\n ></input>\n </ul>\n </div>\n {!this.readonly && !this.disabled && this.getResetButton()}\n </div>\n </form>\n\n {this.disabled \|\| this.readonly ? (\n ''\n ) : (\n <ix-dropdown\n show={this.showDropdown}\n closeBehavior=\"outside\"\n offset={{ mainAxis: 2 }}\n anchor={this.textInput}\n trigger={this.hostElement}\n header={this.getDropdownHeader()}\n >\n {this.renderDropdownContent()}\n </ix-dropdown>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-category-filter.js","mappings":"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","names":[],"sources":["src/components/category-filter/category-filter.scss?tag=ix-category-filter&encapsulation=shadow","src/components/category-filter/category-filter.tsx"],"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\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/shadows';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n@import '../button/button';\n@import 'legacy/components/dropdown';\n@import 'legacy/components/forms';\n@import 'components/form/input';\n\n:host {\n @include ix-component;\n\n display: block;\n position: relative;\n height: auto;\n\n .reset-button {\n position: absolute;\n top: $tiny-space;\n right: $tiny-space;\n }\n\n .reset-button.hide-reset-button {\n display: none;\n }\n\n .input-container {\n &:not(.readonly):not(.disabled) {\n @include element-input('false');\n }\n\n &:not(.readonly):not(.disabled):hover {\n border-color: var(--theme-input--border-color--hover) !important;\n background-color: var(--theme-input--background--hover);\n }\n\n &:not(.readonly):not(.disabled).focus {\n outline: 1px solid var(--theme-color-focus-bdr);\n outline-offset: var(--theme-input--focus--outline-offset);\n border-color: var(--theme-input--border-color--focus) !important;\n }\n\n &.disabled {\n color: var(--theme-input--color--disabled);\n border-bottom: var(--theme-input--border-thickness, 1px) solid\n var(--theme-input--border-color-bottom--disabled);\n }\n\n &.readonly {\n @include element-input;\n }\n\n display: flex;\n height: auto;\n max-height: 3.75rem;\n padding: 1px $large-space 1px 1.75rem !important;\n\n &.no-icon {\n padding-left: $tiny-space;\n }\n }\n\n .token-container {\n flex-grow: 1;\n overflow: hidden;\n }\n\n .text-input {\n @include ellipsis;\n @include text-default;\n width: auto;\n height: 1.75rem;\n min-height: $large-space;\n background: transparent;\n flex-grow: 1;\n box-shadow: none;\n\n &,\n &:hover,\n &:focus\n &:focus-visible {\n border: none !important;\n outline: none !important;\n }\n\n &.hide-placeholder::placeholder {\n opacity: 0;\n }\n }\n\n .list-unstyled {\n display: flex;\n flex-wrap: wrap;\n list-style: none;\n padding: 0;\n margin: 0;\n overflow-y: auto;\n }\n\n ix-icon {\n position: absolute;\n top: $small-space;\n left: $small-space;\n }\n\n ix-filter-chip {\n margin-right: $tiny-space;\n }\n\n .category-preview {\n display: flex;\n align-items: center;\n height: $large-space;\n background-color: var(--theme-bg-3);\n border-top-left-radius: $default-space;\n border-bottom-left-radius: $default-space;\n padding: $small-space;\n margin: 2px 0;\n }\n\n ul {\n height: 100%;\n }\n\n ul > li,\n input {\n padding-inline-start: 0;\n padding-top: 2px;\n padding-bottom: 2px;\n }\n\n ix-dropdown {\n min-width: 10rem !important;\n\n .dropdown-item-container {\n display: flex;\n flex-direction: column;\n\n .dropdown-item {\n @include text-default-single;\n @include ellipsis;\n @include focus-visible {\n border-color: var(--theme-color-focus-bdr);\n }\n\n height: $large-control-height;\n margin: $tiny-space $small-space;\n padding-inline: $small-space;\n border: 1px solid transparent;\n border-radius: 100rem;\n width: auto;\n justify-content: flex-start;\n flex-grow: 1;\n }\n\n .category-item {\n border-end-end-radius: 0;\n border-start-end-radius: 0;\n }\n\n .category-item-value {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n }\n\n .btn-toggle-operator {\n width: 2rem;\n height: 2rem;\n margin-inline: $small-space;\n }\n }\n\n .d-none {\n display: none;\n }\n}\n","/\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 { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { FilterState } from './filter-state';\nimport { InputState } from './input-state';\nimport { LogicalFilterOperator } from './logical-filter-operator';\n\n@Component({\n tag: 'ix-category-filter',\n styleUrl: 'category-filter.scss',\n shadow: true,\n})\nexport class CategoryFilter {\n private readonly ID_CUSTOM_FILTER_VALUE = 'CW_CUSTOM_FILTER_VALUE';\n\n @State() showDropdown: boolean;\n @State() private textInput?: HTMLInputElement;\n private formElement?: HTMLFormElement;\n private isScrollStateDirty: boolean;\n\n @Element() hostElement: HTMLIxCategoryFilterElement;\n\n @State() hasFocus: boolean;\n @State() categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n @State() inputValue: string;\n @State() category: string;\n @State() filterTokens: Array<{\n id: string;\n value: string;\n operator: LogicalFilterOperator;\n }> = [];\n\n /\n If true the filter will be in disabled state\n /\n @Prop() disabled = false;\n\n /\n If true the filter will be in readonly mode\n /\n @Prop() readonly = false;\n\n /\n A set of search criteria to populate the component with.\n /\n @Prop() filterState: FilterState;\n\n /\n Placeholder text to be displayed in an empty input field.\n /\n @Prop() placeholder: string;\n\n /\n Configuration object hash used to populate the dropwdown menu for typeahead and quick selection functionality.\n * Each ID maps to an object with a label and an array of options to select from.\n /\n @Prop() categories: {\n [id: string]: {\n label: string;\n options: string[];\n };\n };\n\n /\n In certain use cases some categories may not be available for selection anymore.\n * To allow proper display of set filters with these categories this ID to label mapping can be populated.\n \n Configuration object hash used to supply labels to the filter chips in the input field.\n * Each ID maps to a string representing the label to display.\n /\n @Prop() nonSelectableCategories?: {\n [id: string]: string;\n } = {};\n\n /\n A list of strings that will be supplied as typeahead suggestions not tied to any categories.\n /\n @Prop() suggestions: string[];\n\n /\n The icon next to the actual text input\n * Defaults to 'search'\n /\n @Prop() icon = 'search';\n\n /\n Allows to hide the icon inside the text input.\n * Defaults to false\n /\n @Prop() hideIcon: boolean;\n\n /\n If set categories will always be filtered via the respective logical operator.\n * Toggling of the operator will not be available to the user.\n \n @since 2.2.0\n /\n @Prop() staticOperator?: LogicalFilterOperator;\n\n /\n If set to true allows that a single category can be set more than once.\n * An already set category will not appear in the category dropdown if set to false.\n \n Defaults to true\n /\n @Prop() repeatCategories = true;\n\n /\n @internal For debugging purposes only!\n /\n @Prop() tmpDisableScrollIntoView = true;\n\n /\n i18n\n /\n @Prop() labelCategories = 'Categories';\n\n /\n i18n\n /\n @Prop() i18nPlainText = 'Filter by text';\n\n /\n Event dispatched whenever the a category gets selected in the dropdown\n /\n @Event() categoryChanged: EventEmitter<string>;\n\n /\n Event dispatched whenever the text input changes.\n /\n @Event() inputChanged: EventEmitter<InputState>;\n\n /\n Event dispatched whenever the filter state changes.\n */\n @Event() filterChanged: EventEmitter<FilterState>;\n\n get dropdown() {\n return this.hostElement.shadowRoot.querySelector('ix-dropdown');\n }\n\n @Watch('filterState')\n watchFilterState(newValue) {\n this.setFilterState(newValue);\n }\n\n componentDidLoad() {\n if (this.filterState !== undefined) {\n setTimeout(() => this.setFilterState(this.filterState));\n }\n\n this.hostElement?.addEventListener(\n 'keydown',\n this.handleFormElementKeyDown.bind(this)\n );\n\n this.formElement?.addEventListener('submit', (e) => e.preventDefault());\n\n if (this.textInput == null) {\n console.warn(\n 'ix-category-filter - unable to add event listeners to native input element'\n );\n return;\n }\n\n this.textInput.addEventListener('focusin', () => {\n this.hasFocus = true;\n });\n this.textInput.addEventListener('focusout', () => (this.hasFocus = false));\n this.textInput.addEventListener('input', () => {\n this.inputValue = this.textInput.value;\n const inputState = new InputState(this.inputValue, this.category);\n this.inputChanged.emit(inputState);\n\n if (!this.dropdown.show) {\n this.openDropdown();\n }\n });\n this.textInput.addEventListener(\n 'keydown',\n this.handleInputElementKeyDown.bind(this)\n );\n }\n\n private setFilterState(state: FilterState) {\n this.filterTokens = [];\n\n for (const token of state.tokens) {\n this.addToken(\n token,\n this.ID_CUSTOM_FILTER_VALUE,\n this.categoryLogicalOperator,\n false\n );\n }\n\n for (const category of state.categories) {\n this.addToken(category.value, category.id, category.operator, false);\n }\n\n this.emitFilterEvent();\n }\n\n private closeDropdown() {\n if (this.disabled \|\| this.readonly) {\n return;\n }\n\n this.dropdown.show = false;\n }\n\n private openDropdown() {\n if (this.disabled \|\| this.readonly) {\n return;\n }\n\n this.dropdown.show = true;\n }\n\n private handleFormElementKeyDown(e: KeyboardEvent) {\n switch (e.code) {\n case 'Enter':\n case 'NumpadEnter':\n if (!document.activeElement.classList.contains('dropdown-item')) {\n return;\n }\n\n const token = document.activeElement.getAttribute('data-id');\n\n if (this.hasCategorySelection()) {\n if (this.category !== undefined) {\n this.addToken(token, this.category);\n } else if (\n document.activeElement.classList.contains('category-item-id')\n ) {\n this.selectCategory(token);\n }\n } else {\n this.addToken(token);\n }\n\n e.preventDefault();\n break;\n\n case 'ArrowUp':\n this.focusPreviousItem();\n e.preventDefault();\n break;\n\n case 'ArrowDown':\n this.showDropdown = true;\n this.focusNextItem();\n e.preventDefault();\n break;\n\n case 'Escape':\n this.closeDropdown();\n break;\n }\n }\n\n private focusPreviousItem() {\n const sibling = document.activeElement.previousSibling;\n if (sibling instanceof HTMLElement) {\n sibling.focus();\n }\n }\n\n private focusNextItem() {\n const sibling = document.activeElement.nextSibling;\n if (sibling instanceof HTMLElement) {\n sibling.focus();\n }\n }\n\n private handleInputElementKeyDown(e: KeyboardEvent) {\n switch (e.code) {\n case 'ArrowDown':\n const selector = `.category-item-${\n this.category !== undefined ? 'value' : 'id'\n }`;\n let item = this.hostElement.shadowRoot.querySelector(selector);\n\n if (item instanceof HTMLElement) {\n item.focus();\n e.stopPropagation();\n } else if (this.suggestions?.length) {\n item = this.hostElement.shadowRoot.querySelector('.category-item');\n if (item instanceof HTMLElement) {\n item.focus();\n e.stopPropagation();\n }\n }\n break;\n\n case 'Backspace':\n if (this.textInput.value !== '') {\n return;\n }\n\n if (this.category !== undefined) {\n this.category = undefined;\n return;\n }\n\n const tokenCount = this.filterTokens.length;\n if (tokenCount > 0) {\n this.removeToken(tokenCount - 1);\n }\n break;\n\n case 'Enter':\n case 'NumpadEnter':\n this.addToken(this.inputValue, this.category);\n e.preventDefault();\n break;\n }\n }\n\n private emitFilterEvent() {\n const tokens = this.filterTokens\n .filter((item) => item.id === this.ID_CUSTOM_FILTER_VALUE)\n .map((item) => item.value);\n const categories = this.filterTokens.filter(\n (item) => item.id !== this.ID_CUSTOM_FILTER_VALUE\n );\n const filterState: FilterState = {\n tokens,\n categories,\n };\n\n this.filterChanged.emit(filterState);\n }\n\n private addToken(\n token: string,\n category: string = this.ID_CUSTOM_FILTER_VALUE,\n operator = this.categoryLogicalOperator,\n emitEvent = true\n ) {\n if (token === undefined \|\| token === null) {\n return;\n }\n\n const newToken = token.trim();\n\n if (newToken === '') {\n return;\n }\n\n if (this.hasToken(newToken)) {\n return;\n }\n\n const pair = { id: category, value: newToken, operator };\n this.filterTokens = [...this.filterTokens, pair];\n this.textInput.value = '';\n this.inputValue = '';\n this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n\n if (this.category !== undefined) {\n this.category = undefined;\n }\n\n this.isScrollStateDirty = true;\n\n this.textInput.focus();\n\n if (emitEvent) {\n this.emitFilterEvent();\n }\n }\n\n private removeToken(index: number) {\n this.filterTokens = this.filterTokens.filter((_, i) => i !== index);\n this.emitFilterEvent();\n }\n\n private getCategoryIds() {\n const ids = [];\n for (const id in this.categories) {\n if (Object.prototype.hasOwnProperty.call(this.categories, id)) {\n ids.push(id);\n }\n }\n\n return ids;\n }\n\n private selectCategory(category: string) {\n this.category = category;\n this.textInput.value = '';\n this.inputValue = '';\n this.textInput.focus();\n this.categoryChanged.emit(category);\n }\n\n private resetFilter(e: Event) {\n e.stopPropagation();\n this.closeDropdown();\n this.filterTokens = [];\n this.emitFilterEvent();\n }\n\n private filterMultiples(value: string) {\n if (this.repeatCategories) {\n return true;\n }\n\n const isCategoryAlreadySet = this.filterTokens.find(\n (token) => token.id === value\n );\n\n return !isCategoryAlreadySet;\n }\n\n private hasToken(token: string) {\n return this.filterTokens.some((filterToken) => {\n const hasSameValue = filterToken.value === token;\n\n if (!hasSameValue) {\n return false;\n }\n\n if (this.category !== undefined) {\n return this.category === filterToken.id;\n }\n\n if (filterToken.id) {\n return filterToken.id === this.ID_CUSTOM_FILTER_VALUE;\n }\n\n return hasSameValue;\n });\n }\n\n private filterDuplicateTokens(value: string) {\n return !this.hasToken(value);\n }\n\n private filterByInput(value: string) {\n if (this.inputValue === undefined \|\| this.inputValue === '') {\n return true;\n }\n\n return value.toLowerCase().indexOf(this.inputValue.toLowerCase()) !== -1;\n }\n\n private toggleCategoryOperator() {\n switch (this.categoryLogicalOperator) {\n case LogicalFilterOperator.EQUAL:\n this.categoryLogicalOperator = LogicalFilterOperator.NOT_EQUAL;\n break;\n\n case LogicalFilterOperator.NOT_EQUAL:\n this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n break;\n }\n }\n\n private getFilterChipLabel(value: {\n id: string;\n value: string;\n operator: LogicalFilterOperator;\n }): string {\n if (value.id === this.ID_CUSTOM_FILTER_VALUE) {\n return value.value;\n }\n\n const operatorString =\n value.operator === LogicalFilterOperator.EQUAL ? '=' : '!=';\n const label =\n this.categories[value.id]?.label ??\n this.nonSelectableCategories[value.id] ??\n value.id;\n\n return `${label} ${operatorString} ${value.value}`;\n }\n\n private getFilteredSuggestions() {\n if (!this.suggestions?.length) {\n return [];\n }\n\n return this.suggestions\n ?.filter((value) => this.filterByInput(value))\n .filter((value) => this.filterDuplicateTokens(value));\n }\n\n private hasCategorySelection() {\n return this.categories !== undefined;\n }\n\n private renderPlainSuggestions() {\n return (\n <div class=\"dropdown-item-container\">\n {this.getFilteredSuggestions().map((suggestion) => (\n <button\n class=\"dropdown-item\"\n data-id={suggestion}\n onClick={() => this.addToken(suggestion)}\n key={suggestion}\n title={suggestion}\n >\n {suggestion}\n </button>\n ))}\n </div>\n );\n }\n\n private renderOperatorButton() {\n if (this.staticOperator) {\n return '';\n }\n\n const params: BaseButtonProps = {\n type: 'button',\n variant: 'secondary',\n outline: false,\n ghost: true,\n iconOnly: true,\n iconOval: false,\n selected: false,\n disabled: this.disabled \|\| this.staticOperator !== undefined,\n loading: false,\n icon: '',\n onClick: (e: Event) => {\n e.stopPropagation();\n this.toggleCategoryOperator();\n },\n extraClasses: {\n 'btn-icon-32': true,\n 'btn-toggle-operator': true,\n },\n };\n\n return (\n <BaseButton {...params}>\n {this.categoryLogicalOperator === LogicalFilterOperator.NOT_EQUAL\n ? '='\n : '!='}\n </BaseButton>\n );\n }\n\n private getFilterOperatorString() {\n let operator: LogicalFilterOperator;\n if (this.staticOperator !== undefined) {\n operator = this.staticOperator;\n } else {\n operator = this.categoryLogicalOperator;\n }\n return `${operator === LogicalFilterOperator.EQUAL ? '=' : '!='} `;\n }\n\n private renderCategoryValues() {\n return (\n <div class=\"dropdown-item-container\">\n {this.renderOperatorButton()}\n <div class=\"dropdown-header\">\n {this.categories[this.category]?.label}\n </div>\n {this.categories[this.category]?.options\n .filter((value) => this.filterByInput(value))\n .filter((value) => this.filterDuplicateTokens(value))\n .map((id) => (\n <button\n class=\"dropdown-item category-item-value\"\n data-id={id}\n title={id}\n key={id}\n onClick={(e) => {\n e.preventDefault();\n this.addToken(id, this.category);\n }}\n >\n {`${this.getFilterOperatorString()} ${id}`}\n </button>\n ))}\n </div>\n );\n }\n\n private renderDropdownContent() {\n if (this.hasCategorySelection()) {\n if (this.category !== undefined) {\n return this.renderCategoryValues();\n } else {\n return this.renderCategorySelection();\n }\n } else return this.renderPlainSuggestions();\n }\n\n private renderCategorySelection() {\n return (\n <div class=\"dropdown-item-container\">\n {this.getCategoryIds()\n ?.filter((id) => this.filterByInput(this.categories[id].label))\n .filter((id) => this.filterMultiples(id))\n .map((id) => (\n <button\n class=\"dropdown-item category-item category-item-id\"\n data-id={id}\n title={this.categories[id].label}\n key={id}\n onClick={(e) => {\n e.preventDefault();\n this.selectCategory(id);\n }}\n tabindex=\"0\"\n >\n {this.categories[id]?.label}\n </button>\n ))}\n </div>\n );\n }\n\n private getDropdownHeader() {\n if (this.categories !== undefined) {\n if (this.category !== undefined) {\n return null;\n } else {\n return this.labelCategories;\n }\n }\n\n return this.i18nPlainText;\n }\n\n componentDidRender() {\n if (this.isScrollStateDirty) {\n if (!this.tmpDisableScrollIntoView) {\n this.textInput.scrollIntoView();\n }\n this.isScrollStateDirty = false;\n }\n }\n\n private getResetButton() {\n return (\n <ix-icon-button\n onClick={(e) => this.resetFilter(e)}\n class={{\n 'reset-button': true,\n 'hide-reset-button':\n !this.filterTokens.length && this.category === undefined,\n }}\n ghost\n oval\n icon={'clear'}\n size=\"16\"\n ></ix-icon-button>\n );\n }\n\n private getIconColor() {\n if (this.disabled) {\n return 'color-componentn-1';\n }\n\n if (this.readonly) {\n return 'color-std-txt';\n }\n\n return 'color-primary';\n }\n\n render() {\n return (\n <Host>\n <form ref={(el) => (this.formElement = el)}>\n <div\n read-only={this.readonly}\n class={{\n 'input-container': true,\n disabled: this.disabled,\n focus: this.hasFocus,\n readonly: this.readonly,\n 'no-icon': this.hideIcon,\n }}\n >\n <ix-icon\n color={this.getIconColor()}\n class={{ 'd-none': this.hideIcon }}\n name={this.icon}\n size=\"16\"\n ></ix-icon>\n <div class=\"token-container\">\n <ul class=\"list-unstyled\">\n {this.filterTokens.map((value, index) => (\n <li\n key={value.toString()}\n class={{\n animate__animated: true,\n animate__fadein: true,\n }}\n >\n <ix-filter-chip\n disabled={this.disabled}\n readonly={this.readonly}\n onClick={(e) => e.stopPropagation()}\n onCloseClick={() => this.removeToken(index)}\n >\n {this.getFilterChipLabel(value)}\n </ix-filter-chip>\n </li>\n ))}\n {this.categories === undefined ? (\n ''\n ) : (\n <li\n class={{\n 'category-preview': true,\n 'd-none': this.category === undefined,\n }}\n >\n {this.categories[this.category]?.label}\n </li>\n )}\n <input\n class={{\n 'text-input': true,\n 'hide-placeholder':\n this.readonly \|\|\n this.disabled \|\|\n this.category !== undefined,\n }}\n autocomplete=\"off\"\n name=\"category-filter-input\"\n disabled={this.disabled}\n readonly={this.readonly}\n ref={(el) => (this.textInput = el)}\n type=\"text\"\n placeholder={this.placeholder}\n ></input>\n </ul>\n </div>\n {!this.readonly && !this.disabled && this.getResetButton()}\n </div>\n </form>\n\n {this.disabled \|\| this.readonly ? (\n ''\n ) : (\n <ix-dropdown\n show={this.showDropdown}\n closeBehavior=\"outside\"\n offset={{ mainAxis: 2 }}\n anchor={this.textInput}\n trigger={this.hostElement}\n header={this.getDropdownHeader()}\n >\n {this.renderDropdownContent()}\n </ix-dropdown>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/components/ix-checkbox-group.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+interface IxCheckboxGroup extends Components.IxCheckboxGroup, HTMLElement {}
+export const IxCheckboxGroup: {
+    prototype: IxCheckboxGroup;
+    new (): IxCheckboxGroup;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/ix-checkbox-group.js ADDED Viewed

@@ -0,0 +1,105 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { H as HookValidationLifecycle } from './validation.js';
+import { d as defineCustomElement$5 } from './field-label.js';
+import { d as defineCustomElement$4 } from './field-wrapper.js';
+import { d as defineCustomElement$3 } from './tooltip.js';
+import { d as defineCustomElement$2 } from './typography.js';
+const checkboxGroupCss = ":host{display:inline-block;position:relative}:host .checkbox-container{display:flex;flex-direction:row;gap:0.5rem;margin:0.25rem 0;flex-wrap:wrap}";
+const IxCheckboxGroupStyle0 = checkboxGroupCss;
+var __decorate = (undefined && undefined.__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;
+};
+const CheckboxGroup = /*@__PURE__*/ proxyCustomElement(class CheckboxGroup extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.showTextAsTooltip = false;
+        this.helperText = undefined;
+        this.label = undefined;
+        this.invalidText = undefined;
+        this.infoText = undefined;
+        this.validText = undefined;
+        this.warningText = undefined;
+        this.isInvalid = false;
+        this.isInfo = false;
+        this.isValid = false;
+        this.isWarning = false;
+    }
+    onClassFieldUpdate({ isInvalid, isInvalidByRequired, isInfo, isValid, isWarning, }) {
+        this.isInvalid = isInvalid || isInvalidByRequired;
+        this.isInfo = isInfo;
+        this.isValid = isValid;
+        this.isWarning = isWarning;
+    }
+    render() {
+        return (h(Host, { key: '50095203ee35ee6af564e05f984b3246d1d561fa' }, h("ix-field-wrapper", { key: '9471e667558059e1fbe1a00c80d47d01279b1c44', label: this.label, helperText: this.helperText, invalidText: this.invalidText, infoText: this.infoText, validText: this.validText, warningText: this.warningText, showTextAsTooltip: this.showTextAsTooltip, isInvalid: this.isInvalid, isInfo: this.isInfo, isValid: this.isValid, isWarning: this.isWarning }, h("slot", { key: '3799064141fa6c4d196e8dea5403653c353ff92c', name: "label", slot: "label" }), h("div", { key: '790381ff4816ba04cf26fcccce2b3cb191d6703e', class: 'checkbox-container' }, h("slot", { key: '1db0597a701e1513a9c2190fdea8189dcc87fda7' })))));
+    }
+    get hostElement() { return this; }
+    static get style() { return IxCheckboxGroupStyle0; }
+}, [1, "ix-checkbox-group", {
+        "helperText": [1, "helper-text"],
+        "label": [1],
+        "invalidText": [1, "invalid-text"],
+        "infoText": [1, "info-text"],
+        "validText": [1, "valid-text"],
+        "warningText": [1, "warning-text"],
+        "isInvalid": [32],
+        "isInfo": [32],
+        "isValid": [32],
+        "isWarning": [32]
+    }]);
+__decorate([
+    HookValidationLifecycle({
+        includeChildren: true,
+    })
+], CheckboxGroup.prototype, "onClassFieldUpdate", null);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ix-checkbox-group", "ix-field-label", "ix-field-wrapper", "ix-tooltip", "ix-typography"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ix-checkbox-group":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, CheckboxGroup);
+            }
+            break;
+        case "ix-field-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "ix-field-wrapper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "ix-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "ix-typography":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+const IxCheckboxGroup = CheckboxGroup;
+const defineCustomElement = defineCustomElement$1;
+export { IxCheckboxGroup, defineCustomElement };
+//# sourceMappingURL=ix-checkbox-group.js.map

package/components/ix-checkbox-group.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"ix-checkbox-group.js","mappings":";;;;;;;AAAA,MAAM,gBAAgB,GAAG,oJAAoJ,CAAC;AAC9K,8BAAe,gBAAgB;;;;;;;;;;;;MCiBlB,aAAa;;;;;QAgCxB,sBAAiB,GAAG,KAAK,CAAC;;;;;;;yBAEL,KAAK;sBACR,KAAK;uBACJ,KAAK;yBACH,KAAK;;IAK1B,kBAAkB,CAAC,EACjB,SAAS,EACT,mBAAmB,EACnB,MAAM,EACN,OAAO,EACP,SAAS,GACS;QAClB,IAAI,CAAC,SAAS,GAAG,SAAS,IAAI,mBAAmB,CAAC;QAClD,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QACrB,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;QACvB,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;KAC5B;IAED,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,yEACE,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,SAAS,EAAE,IAAI,CAAC,SAAS,IAEzB,6DAAM,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,GAAQ,EAEvC,4DAAK,KAAK,EAAE,oBAAoB,IAC9B,8DAAa,CACT,CACW,CACd,EACP;KACH;;;;;;;;;;;;;;;AArCD;IAHC,uBAAuB,CAAC;QACvB,eAAe,EAAE,IAAI;KACtB,CAAC;uDAYD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/checkbox-group/checkbox-group.scss?tag=ix-checkbox-group&encapsulation=shadow","src/components/checkbox-group/checkbox-group.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 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@import 'mixins/shadow-dom/component';\n\n:host {\n display: inline-block;\n position: relative;\n\n .checkbox-container {\n display: flex;\n flex-direction: row;\n gap: 0.5rem;\n margin: 0.25rem 0;\n flex-wrap: wrap;\n }\n}\n","import { Component, Element, Host, Prop, State, h } from '@stencil/core';\nimport {\n FieldWrapperInterface,\n HookValidationLifecycle,\n IxFormValidationState,\n ValidationResults,\n} from '../utils/field';\nimport { IxComponent } from '../utils/internal';\n\n/**\n * @since 2.4.0\n * @form-ready 2.4.0\n */\n@Component({\n tag: 'ix-checkbox-group',\n styleUrl: 'checkbox-group.scss',\n shadow: true,\n})\nexport class CheckboxGroup\n implements FieldWrapperInterface, IxFormValidationState, IxComponent\n{\n @Element() hostElement!: HTMLIxCheckboxGroupElement;\n /**\n * Show text below the field component\n */\n @Prop() helperText?: string;\n\n /**\n * Label for the field component\n */\n @Prop() label?: string;\n\n /**\n * Error text for the field component\n */\n @Prop() invalidText?: string;\n\n /**\n * Info text for the field component\n */\n @Prop() infoText?: string;\n /**\n * Valid text for the field component\n */\n @Prop() validText?: string;\n /**\n * Warning text for the field component\n */\n @Prop() warningText?: string;\n\n showTextAsTooltip = false;\n\n @State() isInvalid = false;\n @State() isInfo = false;\n @State() isValid = false;\n @State() isWarning = false;\n\n @HookValidationLifecycle({\n includeChildren: true,\n })\n onClassFieldUpdate({\n isInvalid,\n isInvalidByRequired,\n isInfo,\n isValid,\n isWarning,\n }: ValidationResults) {\n this.isInvalid = isInvalid || isInvalidByRequired;\n this.isInfo = isInfo;\n this.isValid = isValid;\n this.isWarning = isWarning;\n }\n\n render() {\n return (\n <Host>\n <ix-field-wrapper\n label={this.label}\n helperText={this.helperText}\n invalidText={this.invalidText}\n infoText={this.infoText}\n validText={this.validText}\n warningText={this.warningText}\n showTextAsTooltip={this.showTextAsTooltip}\n isInvalid={this.isInvalid}\n isInfo={this.isInfo}\n isValid={this.isValid}\n isWarning={this.isWarning}\n >\n <slot name=\"label\" slot=\"label\"></slot>\n\n <div class={'checkbox-container'}>\n <slot></slot>\n </div>\n </ix-field-wrapper>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/ix-checkbox.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+interface IxCheckbox extends Components.IxCheckbox, HTMLElement {}
+export const IxCheckbox: {
+    prototype: IxCheckbox;
+    new (): IxCheckbox;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/ix-checkbox.js ADDED Viewed

@@ -0,0 +1,141 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { H as HookValidationLifecycle } from './validation.js';
+import { m as makeRef } from './make-ref.js';
+import { d as defineCustomElement$2 } from './typography.js';
+const checkboxCss = ":host{--ix-checkbox-check-color:var(--theme-color-primary--contrast);display:inline-block;position:relative}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host button{all:unset}:host button{display:inline-flex;position:relative;align-items:center;justify-content:center;width:1.125rem;min-width:1.125rem;max-width:1.125rem;height:1.125rem;min-height:1.125rem;max-height:1.125rem;margin-right:0.5rem}:host button:disabled{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host button:focus-visible{outline:0.0625rem solid var(--theme-color-focus-bdr);outline-offset:var(--theme-checkbox--focus--outline-offset)}:host input[type=checkbox]{display:none}:host label{display:flex;justify-content:flex-start;align-items:flex-start;width:100%;height:100%}:host ix-typography{margin-top:0.125rem}:host button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.checked) button,:host([indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.checked:hover) button,:host([indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.checked:active) button,:host([indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(:disabled) button,:host(.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.checked:disabled) button,:host(.checked.disabled) button,:host([indeterminate]:disabled) button,:host([indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(.ix-info) button{--theme-checkbox-unchecked--background:var(--theme-checkbox-unchecked--background--info);--theme-checkbox-unchecked--background--hover:var(--theme-checkbox-unchecked--background--info--hover);--theme-checkbox-unchecked--background--active:var(--theme-checkbox-unchecked--background--info--active);--theme-checkbox-unchecked--border-color:var(--theme-checkbox-unchecked--border-color--info);--theme-checkbox-unchecked--border-color--hover:var(--theme-checkbox-unchecked--border-color--info--hover);--theme-checkbox-unchecked--border-color--active:var(--theme-checkbox-unchecked--border-color--info--active);--theme-checkbox-checked--background:var(--theme-checkbox-checked--background--info);--theme-checkbox-checked--background--hover:var(--theme-checkbox-checked--background--info--hover);--theme-checkbox-checked--background--active:var(--theme-checkbox-checked--background--info--active);--theme-checkbox-checked--border-color:var(--theme-checkbox-checked--border-color--info);--theme-checkbox-checked--border-color--hover:var(--theme-checkbox-checked--border-color--info--hover);--theme-checkbox-checked--border-color--active:var(--theme-checkbox-checked--border-color--info--active);--theme-checkbox-mixed--background:var(--theme-checkbox-mixed--background--info);--theme-checkbox-mixed--background--hover:var(--theme-checkbox-mixed--background--info--hover);--theme-checkbox-mixed--background--active:var(--theme-checkbox-mixed--background--info--active);--theme-checkbox-mixed--border-color:var(--theme-checkbox-mixed--border-color--info);--theme-checkbox-mixed--border-color--hover:var(--theme-checkbox-mixed--border-color--info--hover);--theme-checkbox-mixed--border-color--active:var(--theme-checkbox-mixed--border-color--info--active)}:host(.ix-info) button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(.ix-info:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(.ix-info:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.ix-info.checked) button,:host(.ix-info[indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.ix-info.checked:hover) button,:host(.ix-info[indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.ix-info.checked:active) button,:host(.ix-info[indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(.ix-info:disabled) button,:host(.ix-info.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.ix-info.checked:disabled) button,:host(.ix-info.checked.disabled) button,:host(.ix-info[indeterminate]:disabled) button,:host(.ix-info[indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(.ix-warning) button{--theme-checkbox-unchecked--background:var(--theme-checkbox-unchecked--background--warning);--theme-checkbox-unchecked--background--hover:var(--theme-checkbox-unchecked--background--warning--hover);--theme-checkbox-unchecked--background--active:var(--theme-checkbox-unchecked--background--warning--active);--theme-checkbox-unchecked--border-color:var(--theme-checkbox-unchecked--border-color--warning);--theme-checkbox-unchecked--border-color--hover:var(--theme-checkbox-unchecked--border-color--warning--hover);--theme-checkbox-unchecked--border-color--active:var(--theme-checkbox-unchecked--border-color--warning--active);--theme-checkbox-checked--background:var(--theme-checkbox-checked--background--warning);--theme-checkbox-checked--background--hover:var(--theme-checkbox-checked--background--warning--hover);--theme-checkbox-checked--background--active:var(--theme-checkbox-checked--background--warning--active);--theme-checkbox-checked--border-color:var(--theme-checkbox-checked--border-color--warning);--theme-checkbox-checked--border-color--hover:var(--theme-checkbox-checked--border-color--warning--hover);--theme-checkbox-checked--border-color--active:var(--theme-checkbox-checked--border-color--warning--active);--theme-checkbox-mixed--background:var(--theme-checkbox-mixed--background--warning);--theme-checkbox-mixed--background--hover:var(--theme-checkbox-mixed--background--warning--hover);--theme-checkbox-mixed--background--active:var(--theme-checkbox-mixed--background--warning--active);--theme-checkbox-mixed--border-color:var(--theme-checkbox-mixed--border-color--warning);--theme-checkbox-mixed--border-color--hover:var(--theme-checkbox-mixed--border-color--warning--hover);--theme-checkbox-mixed--border-color--active:var(--theme-checkbox-mixed--border-color--warning--active)}:host(.ix-warning) button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(.ix-warning:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(.ix-warning:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.ix-warning.checked) button,:host(.ix-warning[indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.ix-warning.checked:hover) button,:host(.ix-warning[indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.ix-warning.checked:active) button,:host(.ix-warning[indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(.ix-warning:disabled) button,:host(.ix-warning.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.ix-warning.checked:disabled) button,:host(.ix-warning.checked.disabled) button,:host(.ix-warning[indeterminate]:disabled) button,:host(.ix-warning[indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(.ix-invalid--required) button{--theme-checkbox-unchecked--background:var(--theme-checkbox-unchecked--background--invalid);--theme-checkbox-unchecked--background--hover:var(--theme-checkbox-unchecked--background--invalid--hover);--theme-checkbox-unchecked--background--active:var(--theme-checkbox-unchecked--background--invalid--active);--theme-checkbox-unchecked--border-color:var(--theme-checkbox-unchecked--border-color--invalid);--theme-checkbox-unchecked--border-color--hover:var(--theme-checkbox-unchecked--border-color--invalid--hover);--theme-checkbox-unchecked--border-color--active:var(--theme-checkbox-unchecked--border-color--invalid--active);--theme-checkbox-checked--background:var(--theme-checkbox-checked--background--invalid);--theme-checkbox-checked--background--hover:var(--theme-checkbox-checked--background--invalid--hover);--theme-checkbox-checked--background--active:var(--theme-checkbox-checked--background--invalid--active);--theme-checkbox-checked--border-color:var(--theme-checkbox-checked--border-color--invalid);--theme-checkbox-checked--border-color--hover:var(--theme-checkbox-checked--border-color--invalid--hover);--theme-checkbox-checked--border-color--active:var(--theme-checkbox-checked--border-color--invalid--active);--theme-checkbox-mixed--background:var(--theme-checkbox-mixed--background--invalid);--theme-checkbox-mixed--background--hover:var(--theme-checkbox-mixed--background--invalid--hover);--theme-checkbox-mixed--background--active:var(--theme-checkbox-mixed--background--invalid--active);--theme-checkbox-mixed--border-color:var(--theme-checkbox-mixed--border-color--invalid);--theme-checkbox-mixed--border-color--hover:var(--theme-checkbox-mixed--border-color--invalid--hover);--theme-checkbox-mixed--border-color--active:var(--theme-checkbox-mixed--border-color--invalid--active)}:host(.ix-invalid--required) button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(.ix-invalid--required:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(.ix-invalid--required:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.ix-invalid--required.checked) button,:host(.ix-invalid--required[indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.ix-invalid--required.checked:hover) button,:host(.ix-invalid--required[indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.ix-invalid--required.checked:active) button,:host(.ix-invalid--required[indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(.ix-invalid--required:disabled) button,:host(.ix-invalid--required.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.ix-invalid--required.checked:disabled) button,:host(.ix-invalid--required.checked.disabled) button,:host(.ix-invalid--required[indeterminate]:disabled) button,:host(.ix-invalid--required[indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(.ix-invalid) button{--theme-checkbox-unchecked--background:var(--theme-checkbox-unchecked--background--invalid);--theme-checkbox-unchecked--background--hover:var(--theme-checkbox-unchecked--background--invalid--hover);--theme-checkbox-unchecked--background--active:var(--theme-checkbox-unchecked--background--invalid--active);--theme-checkbox-unchecked--border-color:var(--theme-checkbox-unchecked--border-color--invalid);--theme-checkbox-unchecked--border-color--hover:var(--theme-checkbox-unchecked--border-color--invalid--hover);--theme-checkbox-unchecked--border-color--active:var(--theme-checkbox-unchecked--border-color--invalid--active);--theme-checkbox-checked--background:var(--theme-checkbox-checked--background--invalid);--theme-checkbox-checked--background--hover:var(--theme-checkbox-checked--background--invalid--hover);--theme-checkbox-checked--background--active:var(--theme-checkbox-checked--background--invalid--active);--theme-checkbox-checked--border-color:var(--theme-checkbox-checked--border-color--invalid);--theme-checkbox-checked--border-color--hover:var(--theme-checkbox-checked--border-color--invalid--hover);--theme-checkbox-checked--border-color--active:var(--theme-checkbox-checked--border-color--invalid--active);--theme-checkbox-mixed--background:var(--theme-checkbox-mixed--background--invalid);--theme-checkbox-mixed--background--hover:var(--theme-checkbox-mixed--background--invalid--hover);--theme-checkbox-mixed--background--active:var(--theme-checkbox-mixed--background--invalid--active);--theme-checkbox-mixed--border-color:var(--theme-checkbox-mixed--border-color--invalid);--theme-checkbox-mixed--border-color--hover:var(--theme-checkbox-mixed--border-color--invalid--hover);--theme-checkbox-mixed--border-color--active:var(--theme-checkbox-mixed--border-color--invalid--active)}:host(.ix-invalid) button{background-color:var(--theme-checkbox-unchecked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color)}:host(.ix-invalid:hover) button{background-color:var(--theme-checkbox-unchecked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--hover)}:host(.ix-invalid:active) button{background-color:var(--theme-checkbox-unchecked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--active)}:host(.ix-invalid.checked) button,:host(.ix-invalid[indeterminate]) button{background-color:var(--theme-checkbox-checked--background);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color)}:host(.ix-invalid.checked:hover) button,:host(.ix-invalid[indeterminate]:hover) button{background-color:var(--theme-checkbox-checked--background--hover);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--hover)}:host(.ix-invalid.checked:active) button,:host(.ix-invalid[indeterminate]:active) button{background-color:var(--theme-checkbox-checked--background--active);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--active)}:host(.ix-invalid:disabled) button,:host(.ix-invalid.disabled) button{background-color:var(--theme-checkbox-unchecked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-unchecked--border-color--disabled)}:host(.ix-invalid.checked:disabled) button,:host(.ix-invalid.checked.disabled) button,:host(.ix-invalid[indeterminate]:disabled) button,:host(.ix-invalid[indeterminate].disabled) button{background-color:var(--theme-checkbox-checked--background--disabled);border:var(--theme-checkbox--border-thickness) solid var(--theme-checkbox-checked--border-color--disabled)}:host(:disabled),:host(.disabled){pointer-events:none}:host(:disabled) button,:host(:disabled) label,:host(:disabled) input,:host(.disabled) button,:host(.disabled) label,:host(.disabled) input{pointer-events:none}";
+const IxCheckboxStyle0 = checkboxCss;
+/*
+ * SPDX-FileCopyrightText: 2024 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var __decorate = (undefined && undefined.__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;
+};
+const Checkbox = /*@__PURE__*/ proxyCustomElement(class Checkbox extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.checkedChange = createEvent(this, "checkedChange", 7);
+        this.valueChange = createEvent(this, "valueChange", 7);
+        this.formInternals = this.attachInternals();
+        this.inputRef = makeRef((checkboxRef) => {
+            checkboxRef.checked = this.checked;
+        });
+        this.name = undefined;
+        this.value = 'on';
+        this.label = undefined;
+        this.checked = false;
+        this.disabled = false;
+        this.indeterminate = false;
+        this.required = false;
+    }
+    setCheckedState(newChecked) {
+        this.checked = newChecked;
+        this.checkedChange.emit(this.checked);
+    }
+    onCheckedChange() {
+        this.updateFormInternalValue();
+    }
+    onValueChange() {
+        this.valueChange.emit(this.value);
+    }
+    componentWillLoad() {
+        this.updateFormInternalValue();
+    }
+    updateFormInternalValue() {
+        var _a;
+        if (this.checked) {
+            this.formInternals.setFormValue((_a = this.value) !== null && _a !== void 0 ? _a : 'on');
+        }
+        else {
+            this.formInternals.setFormValue(null);
+        }
+    }
+    /** @internal */
+    hasValidValue() {
+        return Promise.resolve(this.checked);
+    }
+    /** @internal */
+    getAssociatedFormElement() {
+        return Promise.resolve(this.formInternals.form);
+    }
+    updateClassMappings() { }
+    renderCheckmark() {
+        if (this.checked) {
+            return (h("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M3.65625 8.15625L8.4375 12.9375L14.625 3.9375", stroke: "var(--ix-checkbox-check-color)", "stroke-width": "2" })));
+        }
+        if (this.indeterminate) {
+            return (h("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("rect", { width: "18", height: "18", fill: "transparent" }), h("rect", { x: "3", y: "8", width: "12", height: "2", fill: "var(--ix-checkbox-check-color)" })));
+        }
+    }
+    render() {
+        return (h(Host, { key: '0cc32a63622ae40829ef544d116471d5e9666d5f', "aria-checked": `${this.checked}`, "aria-disabled": `${this.disabled}`, role: "checkbox", class: {
+                disabled: this.disabled,
+                checked: this.checked,
+            } }, h("label", { key: 'b21ec6c0b7937c5f998fc6edb87a77efa9a0c034' }, h("input", { key: 'e15124777edfa5841051be691325ea7bbdd47adf', "aria-checked": `${this.checked}`, disabled: this.disabled, checked: this.checked, ref: this.inputRef, type: "checkbox", onChange: () => this.setCheckedState(!this.checked) }), h("button", { key: '572b191b7f83581f70ab168587804e1be60e99c5', disabled: this.disabled, class: {
+                checked: this.checked,
+            }, onClick: () => this.setCheckedState(!this.checked) }, this.renderCheckmark()), h("ix-typography", { key: '0c757feb616094d959fc67969c291b8b3f280263', format: "label", textColor: this.disabled ? 'weak' : 'std' }, this.label, h("slot", { key: 'ed1f3922fb8d9398224d0f80d86ea87e83a63fb8' })))));
+    }
+    static get formAssociated() { return true; }
+    get hostElement() { return this; }
+    static get watchers() { return {
+        "checked": ["onCheckedChange"],
+        "value": ["onValueChange"]
+    }; }
+    static get style() { return IxCheckboxStyle0; }
+}, [65, "ix-checkbox", {
+        "name": [513],
+        "value": [513],
+        "label": [1],
+        "checked": [1540],
+        "disabled": [516],
+        "indeterminate": [516],
+        "required": [516],
+        "hasValidValue": [64],
+        "getAssociatedFormElement": [64]
+    }, undefined, {
+        "checked": ["onCheckedChange"],
+        "value": ["onValueChange"]
+    }]);
+__decorate([
+    HookValidationLifecycle()
+], Checkbox.prototype, "updateClassMappings", null);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ix-checkbox", "ix-typography"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ix-checkbox":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Checkbox);
+            }
+            break;
+        case "ix-typography":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+const IxCheckbox = Checkbox;
+const defineCustomElement = defineCustomElement$1;
+export { IxCheckbox, defineCustomElement };
+//# sourceMappingURL=ix-checkbox.js.map

package/components/ix-checkbox.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"ix-checkbox.js","mappings":"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","names":[],"sources":["src/components/checkbox/checkbox.scss?tag=ix-checkbox&encapsulation=shadow","src/components/checkbox/checkbox.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 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 @import 'mixins/shadow-dom/component';\n\n:host {\n --ix-checkbox-check-color: var(--theme-color-primary--contrast);\n\n @include ix-component;\n display: inline-block;\n position: relative;\n\n button {\n all: unset;\n }\n\n button {\n display: inline-flex;\n position: relative;\n\n align-items: center;\n justify-content: center;\n\n width: 1.125rem;\n min-width: 1.125rem;\n max-width: 1.125rem;\n height: 1.125rem;\n min-height: 1.125rem;\n max-height: 1.125rem;\n margin-right: 0.5rem;\n }\n\n button:disabled {\n background-color: var(--theme-checkbox-unchecked--background--disabled);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color--disabled);\n }\n\n button:focus-visible {\n outline: 0.0625rem solid var(--theme-color-focus-bdr);\n outline-offset: var(--theme-checkbox--focus--outline-offset);\n }\n\n input[type=\"checkbox\"] {\n display: none;\n }\n\n label {\n display: flex;\n\n justify-content: flex-start;\n align-items: flex-start;\n\n width: 100%;\n height: 100%;\n }\n\n ix-typography {\n margin-top: 0.125rem;\n }\n}\n\n@mixin checkbox-base() {\n :host {\n button {\n background-color: var(--theme-checkbox-unchecked--background);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color);\n }\n }\n\n :host(:hover) {\n button {\n background-color: var(--theme-checkbox-unchecked--background--hover);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color--hover);\n }\n }\n\n :host(:active) {\n button {\n background-color: var(--theme-checkbox-unchecked--background--active);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color--active);\n }\n }\n\n :host(.checked),\n :host([indeterminate]) {\n button {\n background-color: var(--theme-checkbox-checked--background);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-checked--border-color);\n }\n }\n\n :host(.checked:hover),\n :host([indeterminate]:hover) {\n button {\n background-color: var(--theme-checkbox-checked--background--hover);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-checked--border-color--hover);\n }\n }\n\n :host(.checked:active),\n :host([indeterminate]:active) {\n button {\n background-color: var(--theme-checkbox-checked--background--active);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-checked--border-color--active);\n }\n }\n\n :host(:disabled),\n :host(.disabled) {\n button {\n background-color: var(--theme-checkbox-unchecked--background--disabled);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color--disabled);\n }\n }\n\n :host(.checked:disabled),\n :host(.checked.disabled),\n :host([indeterminate]:disabled),\n :host([indeterminate].disabled) {\n button {\n background-color: var(--theme-checkbox-checked--background--disabled);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-checked--border-color--disabled);\n }\n }\n}\n\n@mixin checkbox-variant($selector) {\n :host(#{$selector}) {\n button {\n @content;\n }\n }\n\n :host(#{$selector}) {\n button {\n background-color: var(--theme-checkbox-unchecked--background);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color);\n }\n }\n\n :host(#{$selector}:hover) {\n button {\n background-color: var(--theme-checkbox-unchecked--background--hover);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color--hover);\n }\n }\n\n :host(#{$selector}:active) {\n button {\n background-color: var(--theme-checkbox-unchecked--background--active);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color--active);\n }\n }\n\n :host(#{$selector}.checked),\n :host(#{$selector}[indeterminate]) {\n button {\n background-color: var(--theme-checkbox-checked--background);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-checked--border-color);\n }\n }\n\n :host(#{$selector}.checked:hover),\n :host(#{$selector}[indeterminate]:hover) {\n button {\n background-color: var(--theme-checkbox-checked--background--hover);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-checked--border-color--hover);\n }\n }\n\n :host(#{$selector}.checked:active),\n :host(#{$selector}[indeterminate]:active) {\n button {\n background-color: var(--theme-checkbox-checked--background--active);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-checked--border-color--active);\n }\n }\n\n :host(#{$selector}:disabled),\n :host(#{$selector}.disabled) {\n button {\n background-color: var(--theme-checkbox-unchecked--background--disabled);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-unchecked--border-color--disabled);\n }\n }\n\n :host(#{$selector}.checked:disabled),\n :host(#{$selector}.checked.disabled),\n :host(#{$selector}[indeterminate]:disabled),\n :host(#{$selector}[indeterminate].disabled) {\n button {\n background-color: var(--theme-checkbox-checked--background--disabled);\n border: var(--theme-checkbox--border-thickness) solid\n var(--theme-checkbox-checked--border-color--disabled);\n }\n }\n}\n\n@mixin define-checkbox-vars($state, $type) {\n --theme-checkbox-#{$state}--background: var(--theme-checkbox-#{$state}--background--#{$type});\n --theme-checkbox-#{$state}--background--hover: var(--theme-checkbox-#{$state}--background--#{$type}--hover);\n --theme-checkbox-#{$state}--background--active: var(--theme-checkbox-#{$state}--background--#{$type}--active);\n\n --theme-checkbox-#{$state}--border-color: var(--theme-checkbox-#{$state}--border-color--#{$type});\n --theme-checkbox-#{$state}--border-color--hover: var(--theme-checkbox-#{$state}--border-color--#{$type}--hover);\n --theme-checkbox-#{$state}--border-color--active: var(--theme-checkbox-#{$state}--border-color--#{$type}--active);\n}\n\n@include checkbox-base();\n@include checkbox-variant(\n $selector: '.ix-info',\n) {\n @include define-checkbox-vars('unchecked', 'info');\n @include define-checkbox-vars('checked', 'info');\n @include define-checkbox-vars('mixed', 'info');\n}\n\n@include checkbox-variant(\n $selector: '.ix-warning',\n) {\n @include define-checkbox-vars('unchecked', 'warning');\n @include define-checkbox-vars('checked', 'warning');\n @include define-checkbox-vars('mixed', 'warning');\n}\n\n@include checkbox-variant(\n $selector: '.ix-invalid--required',\n) {\n @include define-checkbox-vars('unchecked', 'invalid');\n @include define-checkbox-vars('checked', 'invalid');\n @include define-checkbox-vars('mixed', 'invalid');\n}\n\n@include checkbox-variant(\n $selector: '.ix-invalid',\n) {\n @include define-checkbox-vars('unchecked', 'invalid');\n @include define-checkbox-vars('checked', 'invalid');\n @include define-checkbox-vars('mixed', 'invalid');\n}\n\n:host(:disabled),\n:host(.disabled) {\n pointer-events: none;\n\n button,\n label,\n input {\n pointer-events: none;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 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 AttachInternals,\n Component,\n Event,\n EventEmitter,\n Host,\n Prop,\n Watch,\n h,\n Element,\n Method,\n} from '@stencil/core';\nimport { HookValidationLifecycle, IxFormComponent } from '../utils/field';\nimport { makeRef } from '../utils/make-ref';\n\n/**\n * @since 2.4.0\n * @form-ready 2.4.0\n */\n@Component({\n tag: 'ix-checkbox',\n styleUrl: 'checkbox.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Checkbox implements IxFormComponent<string> {\n @Element() hostElement!: HTMLIxCheckboxElement;\n\n @AttachInternals() formInternals!: ElementInternals;\n\n /**\n * Name of the checkbox component\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * Value of the checkbox component\n */\n @Prop({ reflect: true }) value: string = 'on';\n\n /**\n * Label for the checkbox component\n */\n @Prop() label?: string;\n\n /**\n * Checked state of the checkbox component\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n\n /**\n * Disabled state of the checkbox component\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * Indeterminate state of the checkbox component\n */\n @Prop({ reflect: true }) indeterminate: boolean = false;\n\n /**\n * Required state of the checkbox component.\n *\n * If true, checkbox needs to be checked to be valid\n */\n @Prop({ reflect: true }) required = false;\n\n /**\n * Event emitted when the checked state of the checkbox changes\n */\n @Event() checkedChange!: EventEmitter<boolean>;\n\n /**\n * Event emitted when the value of the checkbox changes\n */\n @Event() valueChange!: EventEmitter<string>;\n\n private inputRef = makeRef<HTMLInputElement>((checkboxRef) => {\n checkboxRef.checked = this.checked;\n });\n\n private setCheckedState(newChecked: boolean) {\n this.checked = newChecked;\n this.checkedChange.emit(this.checked);\n }\n\n @Watch('checked')\n onCheckedChange() {\n this.updateFormInternalValue();\n }\n\n @Watch('value')\n onValueChange() {\n this.valueChange.emit(this.value);\n }\n\n componentWillLoad() {\n this.updateFormInternalValue();\n }\n\n updateFormInternalValue() {\n if (this.checked) {\n this.formInternals.setFormValue(this.value ?? 'on');\n } else {\n this.formInternals.setFormValue(null);\n }\n }\n\n /** @internal */\n @Method()\n hasValidValue(): Promise<boolean> {\n return Promise.resolve(this.checked);\n }\n\n /** @internal */\n @Method()\n getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n return Promise.resolve(this.formInternals.form);\n }\n\n @HookValidationLifecycle()\n updateClassMappings() {}\n\n private renderCheckmark() {\n if (this.checked) {\n return (\n <svg\n width=\"18\"\n height=\"18\"\n viewBox=\"0 0 18 18\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M3.65625 8.15625L8.4375 12.9375L14.625 3.9375\"\n stroke=\"var(--ix-checkbox-check-color)\"\n stroke-width=\"2\"\n />\n </svg>\n );\n }\n\n if (this.indeterminate) {\n return (\n <svg\n width=\"18\"\n height=\"18\"\n viewBox=\"0 0 18 18\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <rect width=\"18\" height=\"18\" fill=\"transparent\" />\n <rect\n x=\"3\"\n y=\"8\"\n width=\"12\"\n height=\"2\"\n fill=\"var(--ix-checkbox-check-color)\"\n />\n </svg>\n );\n }\n }\n\n render() {\n return (\n <Host\n aria-checked={`${this.checked}`}\n aria-disabled={`${this.disabled}`}\n role=\"checkbox\"\n class={{\n disabled: this.disabled,\n checked: this.checked,\n }}\n >\n <label>\n <input\n aria-checked={`${this.checked}`}\n disabled={this.disabled}\n checked={this.checked}\n ref={this.inputRef}\n type=\"checkbox\"\n onChange={() => this.setCheckedState(!this.checked)}\n />\n <button\n disabled={this.disabled}\n class={{\n checked: this.checked,\n }}\n onClick={() => this.setCheckedState(!this.checked)}\n >\n {this.renderCheckmark()}\n </button>\n <ix-typography\n format=\"label\"\n textColor={this.disabled ? 'weak' : 'std'}\n >\n {this.label}\n <slot></slot>\n </ix-typography>\n </label>\n </Host>\n );\n }\n}\n"],"version":3}