@siemens/ix 0.0.0-pr-1373-20240705054533 → 0.0.0-pr-1522-20241022123832

package/dist/siemens-ix/p-8f48462b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["categoryFilterCss","IxCategoryFilterStyle0","CategoryFilter","this","ID_CUSTOM_FILTER_VALUE","textInput","makeRef","LogicalFilterOperator","EQUAL","dropdown","_a","hostElement","shadowRoot","querySelector","watchFilterState","newValue","setFilterState","preventDefault","e","onFocusIn","hasFocus","onFocusOut","onInput","inputValue","_b","current","value","inputState","InputState","category","inputChanged","emit","_c","show","openDropdown","componentDidLoad","setTimeout","filterState","undefined","formElement","formKeyDownListener","addDisposableEventListener","handleFormElementKeyDown","preventDefaultListener","console","warn","inputKeyDownListener","handleInputElementKeyDown","focusInListener","focusOutListener","inputListener","state","filterTokens","token","tokens","addToken","categoryLogicalOperator","categories","id","operator","emitFilterEvent","closeDropdown","disabled","readonly","code","document","activeElement","classList","contains","getAttribute","hasCategorySelection","selectCategory","focusPreviousItem","showDropdown","focusNextItem","sibling","previousSibling","HTMLElement","focus","nextSibling","selector","item","stopPropagation","suggestions","length","_e","_d","tokenCount","removeToken","filter","map","filterChanged","emitEvent","newToken","trim","hasToken","pair","isScrollStateDirty","index","_","i","getCategoryIds","ids","Object","prototype","hasOwnProperty","call","push","categoryChanged","resetFilter","filterMultiples","repeatCategories","isCategoryAlreadySet","find","some","filterToken","hasSameValue","filterDuplicateTokens","filterByInput","toLowerCase","indexOf","toggleCategoryOperator","NOT_EQUAL","getFilterChipLabel","operatorString","label","nonSelectableCategories","getFilteredSuggestions","renderPlainSuggestions","h","class","suggestion","onClick","key","title","renderOperatorButton","staticOperator","params","type","variant","outline","ghost","iconOnly","iconOval","selected","loading","icon","extraClasses","BaseButton","assign","getFilterOperatorString","renderCategoryValues","options","renderDropdownContent","renderCategorySelection","tabindex","getDropdownHeader","labelCategories","i18nPlainText","componentDidRender","tmpDisableScrollIntoView","scrollIntoView","disconnectedCallback","getResetButton","oval","size","getIconColor","render","Host","ref","el","hideIcon","color","name","toString","animate__animated","animate__fadein","onCloseClick","autocomplete","placeholder","closeBehavior","offset","mainAxis","anchor","waitForCurrent","trigger","header"],"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';\nimport { makeRef } from '../utils/make-ref';\nimport {\n  addDisposableEventListener,\n  DisposableEventListener,\n} from '../utils/disposable-event-listener';\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  private formKeyDownListener?: DisposableEventListener;\n  private preventDefaultListener?: DisposableEventListener;\n  private inputKeyDownListener?: DisposableEventListener;\n  private focusInListener?: DisposableEventListener;\n  private focusOutListener?: DisposableEventListener;\n  private inputListener?: DisposableEventListener;\n\n  private readonly textInput? = makeRef<HTMLInputElement>();\n  private formElement?: HTMLFormElement;\n  private isScrollStateDirty?: boolean;\n\n  @Element() hostElement!: HTMLIxCategoryFilterElement;\n\n  @State() showDropdown = false;\n  @State() hasFocus = false;\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 dropdown menu for type-ahead 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 type-ahead 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 = false;\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 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: FilterState) {\n    this.setFilterState(newValue);\n  }\n\n  private preventDefault(e: Event) {\n    e.preventDefault();\n  }\n\n  private onFocusIn() {\n    this.hasFocus = true;\n  }\n\n  private onFocusOut() {\n    this.hasFocus = false;\n  }\n\n  private onInput() {\n    this.inputValue = this.textInput?.current?.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\n  componentDidLoad() {\n    setTimeout(() => {\n      if (this.filterState !== undefined) {\n        this.setFilterState(this.filterState);\n      }\n    });\n\n    if (this.formElement !== undefined) {\n      this.formKeyDownListener = addDisposableEventListener(\n        this.formElement,\n        'keydown',\n        () => this.handleFormElementKeyDown\n      );\n\n      this.preventDefaultListener = addDisposableEventListener(\n        this.formElement,\n        'submit',\n        this.preventDefault\n      );\n    }\n\n    if (this.textInput?.current == null) {\n      console.warn(\n        'ix-category-filter - unable to add event listeners to native input element'\n      );\n      return;\n    }\n\n    this.inputKeyDownListener = addDisposableEventListener(\n      this.textInput.current,\n      'keydown',\n      () => this.handleInputElementKeyDown\n    );\n\n    this.focusInListener = addDisposableEventListener(\n      this.textInput.current,\n      'focusin',\n      () => this.onFocusIn()\n    );\n\n    this.focusOutListener = addDisposableEventListener(\n      this.textInput.current,\n      'focusout',\n      () => this.onFocusOut()\n    );\n\n    this.inputListener = addDisposableEventListener(\n      this.textInput.current,\n      'input',\n      () => this.onInput()\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    if (this.dropdown) {\n      this.dropdown.show = false;\n    }\n  }\n\n  private openDropdown() {\n    if (this.disabled || this.readonly) {\n      return;\n    }\n\n    if (this.dropdown) {\n      this.dropdown.show = true;\n    }\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 (token === null) {\n          break;\n        }\n\n        if (this.hasCategorySelection()) {\n          if (this.category !== '') {\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 !== '' ? '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\n      case 'Backspace':\n        if (this.textInput?.current?.value !== '') {\n          return;\n        }\n\n        if (this.category !== '') {\n          this.category = '';\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    if (this.textInput?.current) {\n      this.textInput.current.value = '';\n    }\n    this.inputValue = '';\n    this.categoryLogicalOperator = LogicalFilterOperator.EQUAL;\n\n    if (this.category !== '') {\n      this.category = '';\n    }\n\n    this.isScrollStateDirty = true;\n\n    this.textInput?.current?.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    if (this.textInput?.current) {\n      this.textInput.current.value = '';\n    }\n    this.inputValue = '';\n    this.textInput?.current?.focus();\n    this.categoryChanged.emit(category);\n  }\n\n  private resetFilter(e: Event) {\n    e.stopPropagation();\n    this.closeDropdown();\n    this.filterTokens = [];\n    if (this.category) {\n      this.category = '';\n      this.categoryChanged.emit(undefined);\n    }\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 !== '') {\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    if (this.categories === undefined) {\n      return;\n    }\n\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 !== '') {\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(\n            (id) =>\n              this.categories && this.filterByInput(this.categories[id].label)\n          )\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 !== '') {\n        return undefined;\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?.current?.scrollIntoView();\n      }\n      this.isScrollStateDirty = false;\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.preventDefaultListener) {\n      this.preventDefaultListener();\n    }\n    if (this.formKeyDownListener) {\n      this.formKeyDownListener();\n    }\n    if (this.inputKeyDownListener) {\n      this.inputKeyDownListener?.();\n    }\n    if (this.focusInListener) {\n      this.focusInListener();\n    }\n    if (this.focusOutListener) {\n      this.focusOutListener();\n    }\n    if (this.inputListener) {\n      this.inputListener();\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 === '',\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 === '',\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 || this.disabled || this.category !== '',\n                  }}\n                  autocomplete=\"off\"\n                  name=\"category-filter-input\"\n                  disabled={this.disabled}\n                  readonly={this.readonly}\n                  ref={this.textInput}\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?.waitForCurrent()}\n            trigger={this.hostElement}\n            header={this.getDropdownHeader()}\n          >\n            {this.renderDropdownContent()}\n          </ix-dropdown>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/p-9144ea56.entry.js

@@ -0,0 +1,2 @@
+import{r,h as a,H as o,g as c}from"./p-f87cd962.js";const e=":host{display:flex;position:relative;flex-direction:column;align-items:flex-start;align-self:flex-start;overflow:hidden;width:20rem;border:1px solid var(--ix-card-border-color, var(--theme-color-soft-bdr));border-radius:var(--theme-default-border-radius)}: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 .card-content{display:block;position:relative;flex-shrink:0;flex-grow:1;width:100%;height:calc(100% - 2rem);background-color:var(--ix-card-background, transparent);border-top-left-radius:var(--theme-default-border-radius);border-top-right-radius:var(--theme-default-border-radius)}:host .card-footer{display:flex;position:relative;width:100%}:host(.card-insight),:host(.card-outline){--ix-card-background:transparent;--ix-card-border-color:var(--theme-color-soft-bdr)}:host(.card-notification),:host(.card-filled){--ix-card-background:var(--theme-color-component-1)}:host(.card-alarm){--ix-card-background:var(--theme-color-alarm);color:var(--theme-color-alarm--contrast)}:host(.card-critical){--ix-card-background:var(--theme-color-critical);color:var(--theme-color-critical--contrast)}:host(.card-warning){--ix-card-background:var(--theme-color-warning);color:var(--theme-color-warning--contrast)}:host(.card-success){--ix-card-background:var(--theme-color-success);color:var(--theme-color-success--contrast)}:host(.card-info){--ix-card-background:var(--theme-color-info);color:var(--theme-color-info--contrast)}:host(.card-neutral){--ix-card-background:var(--theme-color-neutral);color:var(--theme-color-neutral--contrast)}:host(.card-primary){--ix-card-background:var(--theme-color-primary);color:var(--theme-color-neutral--contrast)}:host(:not(.card-insight)){--ix-card-border-color:transparent}:host(.card-insight:hover){--ix-card-background:var(--theme-color-ghost--hover)}:host(.card-notification:hover){--ix-card-background:var(--theme-color-component-1--hover)}:host(.card-alarm:hover){--ix-card-background:var(--theme-color-alarm--hover)}:host(.card-critical:hover){--ix-card-background:var(--theme-color-critical--hover)}:host(.card-warning:hover){--ix-card-background:var(--theme-color-warning--hover)}:host(.card-success:hover){--ix-card-background:var(--theme-color-success--hover)}:host(.card-info:hover){--ix-card-background:var(--theme-color-info--hover)}:host(.card-neutral:hover){--ix-card-background:var(--theme-color-neutral--hover)}:host(.card-primary:hover){--ix-card-background:var(--theme-color-primary--hover)}:host(.card-insight:active){--ix-card-background:var(--theme-color-ghost--active)}:host(.card-notification:active){--ix-card-background:var(--theme-color-component-1--active)}:host(.card-alarm:active){--ix-card-background:var(--theme-color-alarm--active)}:host(.card-critical:active){--ix-card-background:var(--theme-color-critical--active)}:host(.card-warning:active){--ix-card-background:var(--theme-color-warning--active)}:host(.card-success:active){--ix-card-background:var(--theme-color-success--active)}:host(.card-info:active){--ix-card-background:var(--theme-color-info--active)}:host(.card-neutral:active){--ix-card-background:var(--theme-color-neutral--active)}:host(.card-primary:active){--ix-card-background:var(--theme-color-primary--active)}:host(.selected){--ix-card-border-color:var(--theme-color-dynamic)}:host(.selected.card-insight){--ix-card-background:var(--theme-color-ghost--selected)}:host(.selected.card-notification){--ix-card-background:var(--theme-color-ghost--selected)}:host(.selected.card-alarm){--ix-card-background:var(--theme-color-alarm--active)}:host(.selected.card-critical){--ix-card-background:var(--theme-color-critical--active)}:host(.selected.card-warning){--ix-card-background:var(--theme-color-warning--active)}:host(.selected.card-success){--ix-card-background:var(--theme-color-success--active)}:host(.selected.card-info){--ix-card-background:var(--theme-color-info--active)}:host(.selected.card-neutral){--ix-card-background:var(--theme-color-neutral--active)}:host(.selected.card-primary){--ix-card-background:var(--theme-color-primary--active)}";const t=e;const d=class{constructor(a){r(this,a);this.variant="insight";this.selected=false}render(){return a(o,{key:"47a06ae7be967b6077ec9851b22724f39f08bdb5",class:{selected:this.selected,[`card-${this.variant}`]:true}},a("div",{key:"3bd791183108512f4f150e4223c6b3487104d9f6",class:"card-content"},a("slot",{key:"7b500f330a7c751385deadaabf9f0a4fbaff7444"})),a("div",{key:"700082bfb35c5ecb56d70502500112e1232f2afb",class:"card-footer"},a("slot",{key:"bd156f9ac6728f9cf5a92bb8a454083a50a40cce",name:"card-accordion"})))}get hostElement(){return c(this)}};d.style=t;const i=":host{display:flex;position:relative;flex-direction:column;align-items:flex-start;gap:0.5rem;padding:1rem;height:100%}: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}";const s=i;const l=class{constructor(a){r(this,a)}render(){return a(o,{key:"5aa8feca0f04a5ce7fc449df4eb6410880d12a61"},a("slot",{key:"ca5e1a9691c69af3f845b22b4186533d09547734"}))}};l.style=s;export{d as ix_card,l as ix_card_content};
+//# sourceMappingURL=p-9144ea56.entry.js.map

package/dist/siemens-ix/p-9144ea56.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cardCss","IxCardStyle0","Card","render","h","Host","key","class","selected","this","variant","name","cardContentCss","IxCardContentStyle0","CardContent"],"sources":["src/components/card/card.scss?tag=ix-card&encapsulation=shadow","src/components/card/card.tsx","src/components/card-content/card-content.scss?tag=ix-card-content&encapsulation=shadow","src/components/card-content/card-content.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  @include ix-component;\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: flex-start;\n  overflow: hidden;\n\n  width: 20rem;\n\n  border: 1px solid var(--ix-card-border-color, var(--theme-color-soft-bdr));\n  border-radius: var(--theme-default-border-radius);\n\n  .card-content {\n    display: block;\n    position: relative;\n    flex-shrink: 0;\n    flex-grow: 1;\n    width: 100%;\n    height: calc(100% - 2rem);\n    background-color: var(--ix-card-background, transparent);\n    border-top-left-radius: var(--theme-default-border-radius);\n    border-top-right-radius: var(--theme-default-border-radius);\n  }\n\n  .card-footer {\n    display: flex;\n    position: relative;\n    width: 100%;\n  }\n}\n\n:host(.card-insight), :host(.card-outline) {\n  --ix-card-background: transparent;\n  --ix-card-border-color: var(--theme-color-soft-bdr);\n}\n\n:host(.card-notification), :host(.card-filled) {\n  --ix-card-background: var(--theme-color-component-1);\n}\n\n:host(.card-alarm) {\n  --ix-card-background: var(--theme-color-alarm);\n  color: var(--theme-color-alarm--contrast);\n}\n\n:host(.card-critical) {\n  --ix-card-background: var(--theme-color-critical);\n  color: var(--theme-color-critical--contrast);\n}\n\n:host(.card-warning) {\n  --ix-card-background: var(--theme-color-warning);\n  color: var(--theme-color-warning--contrast);\n}\n\n:host(.card-success) {\n  --ix-card-background: var(--theme-color-success);\n  color: var(--theme-color-success--contrast);\n}\n\n:host(.card-info) {\n  --ix-card-background: var(--theme-color-info);\n  color: var(--theme-color-info--contrast);\n}\n\n:host(.card-neutral) {\n  --ix-card-background: var(--theme-color-neutral);\n  color: var(--theme-color-neutral--contrast);\n}\n\n:host(.card-primary) {\n  --ix-card-background: var(--theme-color-primary);\n  color: var(--theme-color-neutral--contrast);\n}\n\n:host(:not(.card-insight)) {\n  --ix-card-border-color: transparent;\n}\n\n// ### Hover ###\n\n:host(.card-insight:hover) {\n  --ix-card-background: var(--theme-color-ghost--hover);\n}\n\n:host(.card-notification:hover) {\n  --ix-card-background: var(--theme-color-component-1--hover);\n}\n\n:host(.card-alarm:hover) {\n  --ix-card-background: var(--theme-color-alarm--hover);\n}\n\n:host(.card-critical:hover) {\n  --ix-card-background: var(--theme-color-critical--hover);\n}\n\n:host(.card-warning:hover) {\n  --ix-card-background: var(--theme-color-warning--hover);\n}\n\n:host(.card-success:hover) {\n  --ix-card-background: var(--theme-color-success--hover);\n}\n\n:host(.card-info:hover) {\n  --ix-card-background: var(--theme-color-info--hover);\n}\n\n:host(.card-neutral:hover) {\n  --ix-card-background: var(--theme-color-neutral--hover);\n}\n\n:host(.card-primary:hover) {\n  --ix-card-background: var(--theme-color-primary--hover);\n}\n\n// ### Active ###\n\n:host(.card-insight:active) {\n  --ix-card-background: var(--theme-color-ghost--active);\n}\n\n:host(.card-notification:active) {\n  --ix-card-background: var(--theme-color-component-1--active);\n}\n\n:host(.card-alarm:active) {\n  --ix-card-background: var(--theme-color-alarm--active);\n}\n\n:host(.card-critical:active) {\n  --ix-card-background: var(--theme-color-critical--active);\n}\n\n:host(.card-warning:active) {\n  --ix-card-background: var(--theme-color-warning--active);\n}\n\n:host(.card-success:active) {\n  --ix-card-background: var(--theme-color-success--active);\n}\n\n:host(.card-info:active) {\n  --ix-card-background: var(--theme-color-info--active);\n}\n\n:host(.card-neutral:active) {\n  --ix-card-background: var(--theme-color-neutral--active);\n}\n\n:host(.card-primary:active) {\n  --ix-card-background: var(--theme-color-primary--active);\n}\n\n// ### Selected ###\n\n:host(.selected) {\n  --ix-card-border-color: var(--theme-color-dynamic);\n}\n\n:host(.selected.card-insight) {\n  --ix-card-background: var(--theme-color-ghost--selected);\n}\n\n:host(.selected.card-notification) {\n  --ix-card-background: var(--theme-color-ghost--selected);\n}\n\n:host(.selected.card-alarm) {\n  --ix-card-background: var(--theme-color-alarm--active);\n}\n\n:host(.selected.card-critical) {\n  --ix-card-background: var(--theme-color-critical--active);\n}\n\n:host(.selected.card-warning) {\n  --ix-card-background: var(--theme-color-warning--active);\n}\n\n:host(.selected.card-success) {\n  --ix-card-background: var(--theme-color-success--active);\n}\n\n:host(.selected.card-info) {\n  --ix-card-background: var(--theme-color-info--active);\n}\n\n:host(.selected.card-neutral) {\n  --ix-card-background: var(--theme-color-neutral--active);\n}\n\n:host(.selected.card-primary) {\n  --ix-card-background: var(--theme-color-primary--active);\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n//TODO(IX-1601): Remove insight, notification in 3.0\nexport type CardVariant =\n  | 'insight'\n  | 'notification'\n  | 'alarm'\n  | 'critical'\n  | 'warning'\n  | 'info'\n  | 'neutral'\n  | 'success'\n  | 'primary'\n  | 'outline'\n  | 'filled';\n\n/**\n * @since 1.6.0\n */\n@Component({\n  tag: 'ix-card',\n  styleUrl: 'card.scss',\n  shadow: true,\n})\nexport class Card {\n  @Element() hostElement!: HTMLIxCardElement;\n\n  /**\n   * Card variant\n   * @deprecated variant insight and notification will be removed in 3.0. Use 'outline' or 'filled' instead.\n   */\n  @Prop() variant: CardVariant = 'insight';\n\n  /**\n   * @since 2.1.0\n   */\n  @Prop() selected: boolean = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.selected,\n          [`card-${this.variant}`]: true,\n        }}\n      >\n        <div class=\"card-content\">\n          <slot></slot>\n        </div>\n        <div class=\"card-footer\">\n          <slot name=\"card-accordion\"></slot>\n        </div>\n      </Host>\n    );\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@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 0.5rem;\n  padding: 1rem;\n  height: 100%;\n}\n","import { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 1.6.0\n */\n@Component({\n  tag: 'ix-card-content',\n  styleUrl: 'card-content.scss',\n  shadow: true,\n})\nexport class CardContent {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oDAAA,MAAMA,EAAU,kpJAChB,MAAAC,EAAeD,E,MCuBFE,EAAI,M,sCAOgB,U,cAKH,K,CAE5B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLC,SAAUC,KAAKD,SACf,CAAC,QAAQC,KAAKC,WAAY,OAG5BN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,gBACTH,EAAA,QAAAE,IAAA,8CAEFF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,eACTH,EAAA,QAAAE,IAAA,2CAAMK,KAAK,oB,8CClDrB,MAAMC,EAAiB,i3BACvB,MAAAC,EAAeD,E,MCSFE,EAAW,M,yBACtB,MAAAX,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C"}

package/dist/siemens-ix/p-98af5c4d.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as a,H as e}from"./p-f87cd962.js";const i=":host{display:flex;flex-direction:row;align-items:flex-start;padding:0}:host .titleGroup{display:flex;flex-direction:column;flex:1 1 0}:host .titleGroup .secondary{padding:0.25rem 0}:host .subtitle{margin-top:-0.125rem}:host .backButton{margin-right:0.5rem}:host .buttons{flex:0 0 auto}";const o=i;const c=class{constructor(a){t(this,a);this.backButtonClick=s(this,"backButtonClick",7);this.variant="primary";this.headerTitle=undefined;this.headerSubtitle=undefined;this.hasBackButton=false}render(){return a(e,{key:"05d59f8a62e29a886537cd2249a91cbaca560a42"},this.hasBackButton?a("ix-icon-button",{class:"backButton",variant:"primary",icon:"arrow-left",ghost:true,onClick:()=>this.backButtonClick.emit()}):null,a("div",{key:"eb02e3fc080a29379290e77b5db2049f77c990cb",class:"titleGroup"},a("ix-typography",{key:"de9edd86198e18414247d584f7cdb0f1e98243a3",format:this.variant==="secondary"?"h4":"h3",class:this.variant==="secondary"?"secondary":""},this.headerTitle),!!this.headerSubtitle&&a("ix-typography",{key:"debacfac59173251d1a53dda88cba8d96021e78e",format:"h6",color:"soft",class:this.variant==="secondary"?"subtitle":""},this.headerSubtitle)),a("div",{key:"1726ad1632965b087a49052c698ddea09dd38017",class:"buttons"},a("slot",{key:"bc275ead0f7e070a60dfb5c94fbc786fdda36fc3"})))}};c.style=o;export{c as ix_content_header};
+//# sourceMappingURL=p-98af5c4d.entry.js.map

package/dist/siemens-ix/p-98af5c4d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["contentHeaderCss","IxContentHeaderStyle0","ContentHeader","undefined","render","h","Host","key","this","hasBackButton","class","variant","icon","ghost","onClick","backButtonClick","emit","format","headerTitle","headerSubtitle","color"],"sources":["src/components/content-header/content-header.scss?tag=ix-content-header&encapsulation=shadow","src/components/content-header/content-header.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:host {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  padding: 0;\n\n  .titleGroup {\n    display: flex;\n    flex-direction: column;\n    flex: 1 1 0;\n\n    .secondary {\n      padding: 0.25rem 0;\n    }\n  }\n\n  .subtitle {\n    margin-top: -0.125rem;\n  }\n\n  .backButton {\n    margin-right: 0.5rem;\n  }\n\n  .buttons {\n    flex: 0 0 auto;\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 { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\nexport type ContentHeaderVariant = 'primary' | 'secondary';\n\n@Component({\n  tag: 'ix-content-header',\n  styleUrl: 'content-header.scss',\n  shadow: true,\n})\nexport class ContentHeader {\n  /**\n   * Variant of content header\n   */\n  @Prop() variant: ContentHeaderVariant = 'primary';\n\n  /**\n   * Title of Header\n   */\n  @Prop() headerTitle?: string;\n\n  /**\n   * Subtitle of Header\n   */\n  @Prop() headerSubtitle: string | undefined = undefined;\n\n  /**\n   * Display a back button\n   */\n  @Prop() hasBackButton: boolean = false;\n\n  /**\n   * Triggered when back button is clicked\n   */\n  @Event() backButtonClick!: EventEmitter<void>;\n\n  render() {\n    return (\n      <Host>\n        {this.hasBackButton ? (\n          <ix-icon-button\n            class={'backButton'}\n            variant=\"primary\"\n            icon={'arrow-left'}\n            ghost={true}\n            onClick={() => this.backButtonClick.emit()}\n          ></ix-icon-button>\n        ) : null}\n\n        <div class=\"titleGroup\">\n          <ix-typography\n            format={this.variant === 'secondary' ? 'h4' : 'h3'}\n            class={this.variant === 'secondary' ? 'secondary' : ''}\n          >\n            {this.headerTitle}\n          </ix-typography>\n          {!!this.headerSubtitle && (\n            <ix-typography\n              format={'h6'}\n              color={'soft'}\n              class={this.variant === 'secondary' ? 'subtitle' : ''}\n            >\n              {this.headerSubtitle}\n            </ix-typography>\n          )}\n        </div>\n        <div class=\"buttons\">\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAmB,iSACzB,MAAAC,EAAeD,E,MCiBFE,EAAa,M,uFAIgB,U,+CAUKC,U,mBAKZ,K,CAOjC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFC,KAAKC,cACJJ,EAAA,kBACEK,MAAO,aACPC,QAAQ,UACRC,KAAM,aACNC,MAAO,KACPC,QAAS,IAAMN,KAAKO,gBAAgBC,SAEpC,KAEJX,EAAA,OAAAE,IAAA,2CAAKG,MAAM,cACTL,EAAA,iBAAAE,IAAA,2CACEU,OAAQT,KAAKG,UAAY,YAAc,KAAO,KAC9CD,MAAOF,KAAKG,UAAY,YAAc,YAAc,IAEnDH,KAAKU,eAELV,KAAKW,gBACNd,EAAA,iBAAAE,IAAA,2CACEU,OAAQ,KACRG,MAAO,OACPV,MAAOF,KAAKG,UAAY,YAAc,WAAa,IAElDH,KAAKW,iBAIZd,EAAA,OAAAE,IAAA,2CAAKG,MAAM,WACTL,EAAA,QAAAE,IAAA,8C"}

package/dist/siemens-ix/p-99a1cd81.entry.js

@@ -0,0 +1,2 @@
+import{r as s,h as t,H as e}from"./p-f87cd962.js";const o=":host{display:block;position:relative}:host ::slotted(*){height:100%;width:100%}";const a=o;const c=class{constructor(t){s(this,t);this.itemName=undefined}render(){const s={};s["grid-area"]=this.itemName;return t(e,{key:"4d5f0b2b585bbbfac78c8e0b68aa32e8d21f23e4",style:s},t("slot",{key:"a6885cd7ba93f5267347030a1c0ff708ad5aff7d"}))}};c.style=a;export{c as ix_css_grid_item};
+//# sourceMappingURL=p-99a1cd81.entry.js.map

package/dist/siemens-ix/{p-96a3a750.entry.js → p-9b8c6123.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,H as o,g as r,c as s}from"./p-f87cd962.js";import{g as i}from"./p-712e0ee0.js";const n=":host{display:block;position:relative;height:2rem;width:2rem;margin-block-start:0.3125rem;margin-inline-end:0.3125rem;margin-inline-start:auto}:host .hide{visibility:collapse}:host ::slotted(ix-dropdown){cursor:default}";const a=n;const c=class{constructor(t){e(this,t);this.showContextMenu=false}getTrigger(){return this.hostElement}configureDropdown(e,t){e.positioningStrategy="fixed";e.trigger=t}onSlotChange(){const e=this.hostElement.shadowRoot.querySelector("slot");if(!e){return}const t=i(e);this.showContextMenu=t.length!==0;const o=t.find((e=>e.tagName==="IX-DROPDOWN"));const r=this.getTrigger();if(!r){return}if(!o){return}this.configureDropdown(o,r)}render(){return t(o,{key:"f0540e7922380e5d6dc1ccd3a9cf89f8899f0b8f"},t("ix-icon-button",{key:"d252cde38720925875096a6e57d494da800139f3",class:{hide:!this.showContextMenu},size:"24",ghost:true,icon:"context-menu"}),t("slot",{key:"e5f04fcdd55f57bd9bad2beeb5982f6c6352f19b",onSlotchange:()=>this.onSlotChange()}))}get hostElement(){return r(this)}};c.style=a;const l=":host{display:flex;min-height:2.25rem;height:2.25rem}: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{display:flex;height:100%;width:100%;align-items:center;justify-content:flex-start;position:relative;outline:none;background-color:var(--theme-group-item--background);border:1px solid transparent;color:var(--theme-color-std-text);cursor:pointer;padding-left:2.5rem}:host>button:focus-visible{border:1px solid var(--theme-color-focus-bdr)}:host ix-icon{margin-right:0.25rem;margin-top:-0.125rem}:host .group-entry-selection-indicator{position:absolute;left:-1px;height:calc(100% + 2px);width:0.25rem}:host .group-entry-text{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .group-entry-text-secondary{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text)}:host .group-entry-text-secondary,:host .group-entry-text-secondary span{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.suppress-selection){pointer-events:none}:host(.selected){border-top-width:0.062rem !important;background-color:var(--theme-color-ghost--selected)}:host(.selected) .group-entry-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host(:hover){background-color:var(--theme-color-ghost--selected-hover);border-color:var(--theme-group-item--border-color--hover)}:host(.selected:hover){background-color:var(--theme-color-ghost--selected-hover)}:host(:active){background-color:var(--theme-color-ghost--selected-active);border-color:var(--theme-group-item--border-color--active)}:host(.selected:active){background-color:var(--theme-color-ghost--selected-active)}";const h=l;const d=class{constructor(t){e(this,t);this.selectedChanged=s(this,"selectedChanged",7);this.icon=undefined;this.text=undefined;this.secondaryText=undefined;this.suppressSelection=false;this.selected=undefined;this.focusable=true;this.index=undefined}clickListen(){if(this.suppressSelection){return}this.selectedChanged.emit(this.hostElement)}render(){return t(o,{key:"1263d38096b46d1f07775d0907018af567054e6d",class:{selected:this.selected&&!this.suppressSelection,"suppress-selection":this.suppressSelection}},t("button",{key:"f5ca23ab1328e745e9bb8299db8d15a450cd3af7",tabindex:this.focusable?0:-1},t("div",{key:"3a60d30b7686a8b3b67343e7c5cbd5b1faacf0e4",class:"group-entry-selection-indicator"}),this.icon?t("ix-icon",{size:"16",name:this.icon}):null,this.text?t("span",{class:"group-entry-text"},t("span",{title:this.text},this.text)):null,this.secondaryText?t("span",{class:"group-entry-text-secondary"},t("span",{title:this.secondaryText},this.secondaryText)):null,t("slot",{key:"a24a61b86fea34c7124b5345bd41c08550a145b5"})))}get hostElement(){return r(this)}};d.style=h;export{c as ix_group_context_menu,d as ix_group_item};
-//# sourceMappingURL=p-96a3a750.entry.js.map
+import{r as e,h as t,H as o,g as r,c as s}from"./p-f87cd962.js";import{g as i}from"./p-345e1c73.js";const n=":host{display:block;position:relative;height:2rem;width:2rem;margin-block-start:0.3125rem;margin-inline-end:0.3125rem;margin-inline-start:auto}:host .hide{visibility:collapse}:host ::slotted(ix-dropdown){cursor:default}";const c=n;const a=class{constructor(t){e(this,t);this.showContextMenu=false}getTrigger(){return this.hostElement}configureDropdown(e,t){e.positioningStrategy="fixed";e.trigger=t}onSlotChange(){const e=this.hostElement.shadowRoot.querySelector("slot");if(!e){return}const t=i(e);this.showContextMenu=t.length!==0;const o=t.find((e=>e.tagName==="IX-DROPDOWN"));const r=this.getTrigger();if(!r){return}if(!o){return}this.configureDropdown(o,r)}render(){return t(o,{key:"7b826fefe006824752b7d0ff090dfc84f520b2cd"},t("ix-icon-button",{key:"1009c080580c54ba55697af262cd990dc8c57ca1",class:{hide:!this.showContextMenu},size:"24",ghost:true,icon:"context-menu"}),t("slot",{key:"8063b600fd52fa51e00b9cec030f896a2d27e146",onSlotchange:()=>this.onSlotChange()}))}get hostElement(){return r(this)}};a.style=c;const l=":host{display:flex;min-height:2.25rem;height:2.25rem}: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{display:flex;height:100%;width:100%;align-items:center;justify-content:flex-start;position:relative;outline:none;background-color:var(--theme-group-item--background);border:1px solid transparent;color:var(--theme-color-std-text);cursor:pointer;padding-left:2.5rem}:host>button:focus-visible{border:1px solid var(--theme-color-focus-bdr)}:host ix-icon{margin-right:0.25rem;margin-top:-0.125rem}:host .group-entry-selection-indicator{position:absolute;left:-1px;height:calc(100% + 2px);width:0.25rem}:host .group-entry-text{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .group-entry-text-secondary{display:flex;justify-content:flex-end;flex-grow:1;white-space:nowrap;color:var(--theme-color-soft-text)}:host .group-entry-text-secondary,:host .group-entry-text-secondary span{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.selected){border-top-width:0.062rem !important;background-color:var(--theme-color-ghost--selected)}:host(.selected) .group-entry-selection-indicator{background-color:var(--theme-group-item-indicator--background--selected)}:host(:hover){background-color:var(--theme-color-ghost--selected-hover);border-color:var(--theme-group-item--border-color--hover)}:host(.selected:hover){background-color:var(--theme-color-ghost--selected-hover)}:host(:active){background-color:var(--theme-color-ghost--selected-active);border-color:var(--theme-group-item--border-color--active)}:host(.selected:active){background-color:var(--theme-color-ghost--selected-active)}";const h=l;const d=class{constructor(t){e(this,t);this.selectedChanged=s(this,"selectedChanged",7);this.icon=undefined;this.text=undefined;this.secondaryText=undefined;this.suppressSelection=false;this.selected=false;this.focusable=true;this.index=undefined}clickListen(){this.selectedChanged.emit(this.hostElement)}render(){return t(o,{key:"5b28eda518fc9ade8ac54e64f4d9b6027bceafff",class:{selected:this.selected&&!this.suppressSelection}},t("button",{key:"961ee833f92bdb256088bf4218053d8075ea2b69",tabindex:this.focusable?0:-1},t("div",{key:"69e64634c4db377177ddd6c90cb0aff3665c286c",class:"group-entry-selection-indicator"}),this.icon?t("ix-icon",{size:"16",name:this.icon}):null,this.text?t("span",{class:"group-entry-text"},t("span",{title:this.text},this.text)):null,this.secondaryText?t("span",{class:"group-entry-text-secondary"},t("span",{title:this.secondaryText},this.secondaryText)):null,t("slot",{key:"a948a499ad743906f9cc21dd0b54f4163cf86037"})))}get hostElement(){return r(this)}};d.style=h;export{a as ix_group_context_menu,d as ix_group_item};
+//# sourceMappingURL=p-9b8c6123.entry.js.map

package/dist/siemens-ix/p-9b8c6123.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["groupContextMenuCss","IxGroupContextMenuStyle0","GroupContextMenu","getTrigger","this","hostElement","configureDropdown","dropdownElement","triggerElement","positioningStrategy","trigger","onSlotChange","slot","shadowRoot","querySelector","elements","getSlottedElements","showContextMenu","length","find","elm","tagName","render","h","Host","key","class","hide","size","ghost","icon","onSlotchange","groupItemCss","IxGroupItemStyle0","GroupItem","clickListen","selectedChanged","emit","selected","suppressSelection","tabindex","focusable","name","text","title","secondaryText"],"sources":["src/components/group/group-context-menu.scss?tag=ix-group-context-menu&encapsulation=shadow","src/components/group/group-context-menu.tsx","src/components/group-item/group-item.scss?tag=ix-group-item&encapsulation=shadow","src/components/group-item/group-item.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:host {\n  display: block;\n  position: relative;\n\n  height: 2rem;\n  width: 2rem;\n\n  margin-block-start: 0.3125rem;\n  margin-inline-end: 0.3125rem;\n  margin-inline-start: auto;\n\n  .hide {\n    visibility: collapse;\n  }\n\n  ::slotted(ix-dropdown) {\n    cursor: default;\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 { Component, Element, h, Host, State } from '@stencil/core';\nimport { getSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n  tag: 'ix-group-context-menu',\n  styleUrl: './group-context-menu.scss',\n  shadow: true,\n})\nexport class GroupContextMenu {\n  @Element() hostElement!: HTMLIxGroupContextMenuElement;\n\n  @State() showContextMenu = false;\n\n  private getTrigger() {\n    return this.hostElement;\n  }\n\n  private configureDropdown(\n    dropdownElement: HTMLIxDropdownElement,\n    triggerElement: HTMLElement\n  ) {\n    dropdownElement.positioningStrategy = 'fixed';\n    dropdownElement.trigger = triggerElement;\n  }\n\n  private onSlotChange() {\n    const slot = this.hostElement.shadowRoot.querySelector('slot');\n    if (!slot) {\n      return;\n    }\n    const elements = getSlottedElements(slot);\n    this.showContextMenu = elements.length !== 0;\n\n    const dropdownElement = elements.find(\n      (elm: Element) => elm.tagName === 'IX-DROPDOWN'\n    );\n\n    const triggerElement = this.getTrigger();\n\n    if (!triggerElement) {\n      return;\n    }\n\n    if (!dropdownElement) {\n      return;\n    }\n\n    this.configureDropdown(dropdownElement, triggerElement);\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-icon-button\n          class={{ hide: !this.showContextMenu }}\n          size=\"24\"\n          ghost={true}\n          icon={'context-menu'}\n        ></ix-icon-button>\n        <slot onSlotchange={() => this.onSlotChange()}></slot>\n      </Host>\n    );\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\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/shadow-dom/hover';\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n$focusBorderWidth: 1px;\n\n:host {\n  @include ix-component;\n  display: flex;\n  min-height: 2.25rem;\n  height: 2.25rem;\n\n  > button {\n    display: flex;\n    height: 100%;\n    width: 100%;\n    align-items: center;\n    justify-content: flex-start;\n    position: relative;\n    outline: none;\n    background-color: var(--theme-group-item--background);\n    border: 1px solid transparent;\n    color: var(--theme-color-std-text);\n    cursor: pointer;\n\n    padding-left: 2.5rem;\n\n    &:focus-visible {\n      border: $focusBorderWidth solid var(--theme-color-focus-bdr);\n    }\n  }\n\n  ix-icon {\n    margin-right: $tiny-space;\n    margin-top: -0.125rem;\n  }\n\n  .group-entry-selection-indicator {\n    position: absolute;\n    left: -#{$focusBorderWidth};\n    height: calc(100% + #{$focusBorderWidth * 2});\n    width: $tiny-space;\n  }\n\n  .group-entry-text {\n    @include text-default;\n    @include ellipsis();\n  }\n\n  .group-entry-text-secondary {\n    &,\n    span {\n      @include text-default;\n      @include ellipsis;\n    }\n\n    display: flex;\n    justify-content: flex-end;\n    flex-grow: 1;\n    white-space: nowrap;\n    color: var(--theme-color-soft-text);\n  }\n}\n\n:host(.selected) {\n  border-top-width: 0.062rem !important;\n  background-color: var(--theme-color-ghost--selected);\n\n  .group-entry-selection-indicator {\n    background-color: var(--theme-group-item-indicator--background--selected);\n  }\n}\n\n:host(:hover) {\n  background-color: var(--theme-color-ghost--selected-hover);\n  border-color: var(--theme-group-item--border-color--hover);\n}\n\n:host(.selected:hover) {\n  background-color: var(--theme-color-ghost--selected-hover);\n}\n\n:host(:active) {\n  background-color: var(--theme-color-ghost--selected-active);\n  border-color: var(--theme-group-item--border-color--active);\n}\n\n:host(.selected:active) {\n  background-color: var(--theme-color-ghost--selected-active);\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  Listen,\n  Prop,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-group-item',\n  styleUrl: 'group-item.scss',\n  shadow: true,\n})\nexport class GroupItem {\n  @Element() hostElement!: HTMLIxGroupItemElement;\n\n  /**\n   * Group item icon\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Group item text\n   */\n  @Prop() text?: string;\n\n  /**\n   * Group item secondary text\n   */\n  @Prop() secondaryText?: string;\n\n  /**\n   * Supress the selection of the group\n   */\n  @Prop() suppressSelection = false;\n\n  /**\n   * Show selected state\n   */\n  @Prop() selected: boolean = false;\n\n  /**\n   * The elements tabindex attribute will get set accordingly.\n   * If true tabindex will be 0, -1 otherwise.\n   */\n  @Prop() focusable = true;\n\n  /**\n   * Selection changed\n   */\n  @Event() selectedChanged!: EventEmitter<HTMLIxGroupItemElement>;\n\n  /**\n   * Index\n   */\n  @Prop() index?: number;\n\n  @Listen('click', { passive: true })\n  clickListen() {\n    this.selectedChanged.emit(this.hostElement);\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.selected && !this.suppressSelection,\n        }}\n      >\n        <button tabindex={this.focusable ? 0 : -1}>\n          <div class=\"group-entry-selection-indicator\"></div>\n          {this.icon ? <ix-icon size=\"16\" name={this.icon}></ix-icon> : null}\n          {this.text ? (\n            <span class=\"group-entry-text\">\n              <span title={this.text}>{this.text}</span>\n            </span>\n          ) : null}\n          {this.secondaryText ? (\n            <span class=\"group-entry-text-secondary\">\n              <span title={this.secondaryText}>{this.secondaryText}</span>\n            </span>\n          ) : null}\n          <slot></slot>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAsB,8NAC5B,MAAAC,EAAeD,E,MCgBFE,EAAgB,M,8CAGA,K,CAEnB,UAAAC,GACN,OAAOC,KAAKC,W,CAGN,iBAAAC,CACNC,EACAC,GAEAD,EAAgBE,oBAAsB,QACtCF,EAAgBG,QAAUF,C,CAGpB,YAAAG,GACN,MAAMC,EAAOR,KAAKC,YAAYQ,WAAWC,cAAc,QACvD,IAAKF,EAAM,CACT,M,CAEF,MAAMG,EAAWC,EAAmBJ,GACpCR,KAAKa,gBAAkBF,EAASG,SAAW,EAE3C,MAAMX,EAAkBQ,EAASI,MAC9BC,GAAiBA,EAAIC,UAAY,gBAGpC,MAAMb,EAAiBJ,KAAKD,aAE5B,IAAKK,EAAgB,CACnB,M,CAGF,IAAKD,EAAiB,CACpB,M,CAGFH,KAAKE,kBAAkBC,EAAiBC,E,CAG1C,MAAAc,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,kBAAAE,IAAA,2CACEC,MAAO,CAAEC,MAAOvB,KAAKa,iBACrBW,KAAK,KACLC,MAAO,KACPC,KAAM,iBAERP,EAAA,QAAAE,IAAA,2CAAMM,aAAc,IAAM3B,KAAKO,iB,8CCpEvC,MAAMqB,EAAe,kqFACrB,MAAAC,EAAeD,E,MCwBFE,EAAS,M,sKAqBQ,M,cAKA,M,eAMR,K,qBAapB,WAAAC,GACE/B,KAAKgC,gBAAgBC,KAAKjC,KAAKC,Y,CAGjC,MAAAiB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLY,SAAUlC,KAAKkC,WAAalC,KAAKmC,oBAGnChB,EAAA,UAAAE,IAAA,2CAAQe,SAAUpC,KAAKqC,UAAY,GAAK,GACtClB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oCACVtB,KAAK0B,KAAOP,EAAA,WAASK,KAAK,KAAKc,KAAMtC,KAAK0B,OAAmB,KAC7D1B,KAAKuC,KACJpB,EAAA,QAAMG,MAAM,oBACVH,EAAA,QAAMqB,MAAOxC,KAAKuC,MAAOvC,KAAKuC,OAE9B,KACHvC,KAAKyC,cACJtB,EAAA,QAAMG,MAAM,8BACVH,EAAA,QAAMqB,MAAOxC,KAAKyC,eAAgBzC,KAAKyC,gBAEvC,KACJtB,EAAA,QAAAE,IAAA,8C"}

package/dist/siemens-ix/p-9cd40e56.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,H as r,g as s}from"./p-f87cd962.js";import{c as o}from"./p-e898862b.js";const l=":host{display:flex;position:relative;flex-direction:column;align-items:flex-start;margin:0.5rem}: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 .CardList_Title{display:flex;position:relative;height:1.5rem;align-items:center;width:100%;margin-bottom:0.5rem}:host .CardList_Title__Label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .CardList__Title__Button{margin-right:1rem;transition:var(--theme-default-time) transform ease-in-out}:host .CardList__Title__Button__Collapsed{transform:rotate(-90deg)}:host .CardList__Title__Show__All{align-self:center;margin-left:auto;margin-right:0px;flex-shrink:0}:host .CardList__Content{display:flex;position:relative;height:calc(100% - 1.5rem);width:100%;gap:1.5rem;transition:var(--theme-default-time) ease-in-out;overflow:auto}:host .CardList__Content__Collapsed{min-height:0px;max-height:0px;overflow:hidden;opacity:0}:host .CardList__Style__Flexbox__Scroll{flex-wrap:wrap}:host .CardList__Style__Infinite__Scroll{flex-wrap:nowrap;-ms-overflow-style:none;scrollbar-width:none}:host .CardList__Style__Infinite__Scroll::-webkit-scrollbar{display:none}:host .CardList__Overflow{display:block;position:relative;height:100%;width:100%;pointer-events:all;-webkit-mask-image:var(--ix-card-list-overflow, none);mask-image:var(--ix-card-list-overflow, none)}:host .Show__All__Card{display:flex;position:relative;align-self:flex-start;justify-self:center;max-width:11.25rem;min-width:11.25rem;width:11.25rem;min-height:11.25rem;max-height:11.25rem;height:11.25rem;--ix-card-border-color:var(--theme-color-primary);color:var(--theme-color-primary)}:host .CardList__Style__Infinite__Scroll .Show__All__Card{margin-top:2.375rem}:host .CardList__Style__Flexbox__Scroll .Show__All__Card{margin-bottom:2.375rem}:host .Show__All__Card:hover{background-color:var(--theme-color-ghost--hover)}:host .Show__All__Card:active{background-color:var(--theme-color-ghost--active)}:host .Show__All__Card__Content{display:flex;justify-content:center;align-items:center}:host .Show__All__Card__Icon{display:flex;position:absolute;height:4rem;width:4rem;justify-content:center;align-items:center}:host .Show__All__Card__Text{margin-bottom:0px;margin-top:auto}";const a=l;function n(t){if(t.label===""){return null}return i("div",{class:"CardList_Title"},i("ix-icon-button",{ghost:true,icon:"chevron-down",onClick:t.onClick,color:"color-primary",class:{CardList__Title__Button:true,CardList__Title__Button__Collapsed:t.isCollapsed}}),i("ix-typography",{class:"CardList_Title__Label",format:"body-lg"},t.label),!t.hideShowAll&&i("ix-button",{class:"CardList__Title__Show__All",ghost:true,onClick:t.onShowAllClick},i("span",null,t.showAllLabel),i("span",null,!isNaN(t.showAllCounter)?` (${t.showAllCounter})`:null)))}const h=class{constructor(i){t(this,i);this.collapseChanged=e(this,"collapseChanged",7);this.showAllClick=e(this,"showAllClick",7);this.showMoreCardClick=e(this,"showMoreCardClick",7);this.label=undefined;this.collapse=false;this.listStyle="stack";this.maxVisibleCards=12;this.showAllCount=undefined;this.suppressOverflowHandling=false;this.hideShowAll=false;this.i18nShowAll="Show all";this.i18nMoreCards="There are more cards available";this.hasOverflowingElements=false;this.numberOfOverflowingElements=0;this.numberOfAllChildElements=0;this.leftScrollDistance=0;this.rightScrollDistance=0}onCardListVisibilityToggle(){this.collapse=!this.collapse;this.collapseChanged.emit(this.collapse)}onShowAllClick(t){this.showAllClick.emit({nativeEvent:t})}getListChildren(){const t=this.hostElement.shadowRoot.querySelector(".CardList__Content > slot");return t.assignedElements({flatten:true})}changeVisibilityOfSlotChildren(){const t=this.getListChildren();t.forEach(((t,e)=>{if(t instanceof HTMLElement){if(e>this.maxVisibleCards-1){t.classList.add("d-none");return}t.classList.remove("d-none")}}));this.hasOverflowingElements=t.length>this.maxVisibleCards;this.numberOfOverflowingElements=t.length-this.maxVisibleCards;this.numberOfAllChildElements=t.length;this.detectOverflow()}registerOverflowHandler(){this.observer=o((()=>{this.changeVisibilityOfSlotChildren()}));this.observer.observe(this.hostElement.shadowRoot.querySelector(".CardList__Content"),{childList:true,subtree:true});requestAnimationFrame((()=>{this.changeVisibilityOfSlotChildren()}))}shouldHandleOverflow(){if(this.suppressOverflowHandling){return false}if(this.listStyle==="stack"||this.listStyle==="scroll"){return true}}get listElement(){return this.hostElement.shadowRoot.querySelector(".CardList__Content")}onCardListScroll(){this.detectOverflow()}isShowMoreCardVisible(){return this.suppressOverflowHandling===false&&this.hasOverflowingElements}getOpacityFromScrollDistance(t){if(!this.listElement){return 0}if(t===0){return 0}if(t>100){return 1}return t/100}computeMaskLayer(){const t=80;const e=`linear-gradient(\n      90deg,\n      transparent 0px,\n      black ${t*(this.getOpacityFromScrollDistance(this.leftScrollDistance)>0?1:0)}px,\n      black calc(100% - ${t*(this.getOpacityFromScrollDistance(this.rightScrollDistance)>0?1:0)}px),\n      transparent 100%\n    )`;return{"--ix-card-list-overflow":e}}detectOverflow(){const{clientWidth:t,scrollWidth:e,scrollLeft:i}=this.listElement;this.leftScrollDistance=i;this.rightScrollDistance=e-i-t}componentDidLoad(){if(this.shouldHandleOverflow()){this.registerOverflowHandler()}}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){return i(r,{key:"af1146a880e7d31e84072a1495baf6c8f71904a2"},i(n,{key:"ee470eed580f651cc00706bee8c86968af4e4eb8",isCollapsed:this.collapse,label:this.label,showAllLabel:this.i18nShowAll,showAllCounter:this.showAllCount===undefined?this.numberOfAllChildElements:this.showAllCount,onClick:()=>this.onCardListVisibilityToggle(),onShowAllClick:t=>this.onShowAllClick(t),hideShowAll:this.hideShowAll}),i("div",{key:"852ebdc56b009729a1767a6a99452475906daea0",class:{CardList__Overflow:true},style:this.computeMaskLayer()},i("div",{key:"f2d9411e9123e9c632d98cf0839b0dea2096c6e8",class:{CardList__Content:true,CardList__Content__Collapsed:this.collapse,CardList__Style__Flexbox__Scroll:this.listStyle==="stack",CardList__Style__Infinite__Scroll:this.listStyle==="scroll"},onScroll:()=>this.onCardListScroll()},i("slot",{key:"82ba7fcb51a102081eb363ecf99146b1ab08554a",onSlotchange:()=>this.changeVisibilityOfSlotChildren()}),this.isShowMoreCardVisible()?i("ix-card",{class:{Show__All__Card:true},onClick:t=>this.showMoreCardClick.emit({nativeEvent:t})},i("ix-card-content",{class:"Show__All__Card__Content"},i("ix-icon",{name:"more-menu",size:"32",class:"Show__All__Card__Icon"}),i("span",{class:"Show__All__Card__Text"},this.i18nMoreCards," (",this.numberOfOverflowingElements,")"))):null)))}get hostElement(){return s(this)}};h.style=a;export{h as ix_card_list};
+//# sourceMappingURL=p-9cd40e56.entry.js.map

package/dist/siemens-ix/p-9cd40e56.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cardListCss","IxCardListStyle0","CardListTitle","props","label","h","class","ghost","icon","onClick","color","CardList__Title__Button","CardList__Title__Button__Collapsed","isCollapsed","format","hideShowAll","onShowAllClick","showAllLabel","isNaN","showAllCounter","CardList","onCardListVisibilityToggle","this","collapse","collapseChanged","emit","event","showAllClick","nativeEvent","getListChildren","slot","hostElement","shadowRoot","querySelector","assignedElements","flatten","changeVisibilityOfSlotChildren","childElements","forEach","element","index","HTMLElement","maxVisibleCards","classList","add","remove","hasOverflowingElements","length","numberOfOverflowingElements","numberOfAllChildElements","detectOverflow","registerOverflowHandler","observer","createMutationObserver","observe","childList","subtree","requestAnimationFrame","shouldHandleOverflow","suppressOverflowHandling","listStyle","listElement","onCardListScroll","isShowMoreCardVisible","getOpacityFromScrollDistance","distance","computeMaskLayer","maxOverflowWidth","maskLayer","leftScrollDistance","rightScrollDistance","clientWidth","scrollWidth","scrollLeft","componentDidLoad","disconnectedCallback","disconnect","render","Host","key","i18nShowAll","showAllCount","undefined","e","CardList__Overflow","style","CardList__Content","CardList__Content__Collapsed","CardList__Style__Flexbox__Scroll","CardList__Style__Infinite__Scroll","onScroll","onSlotchange","Show__All__Card","showMoreCardClick","name","size","i18nMoreCards"],"sources":["src/components/card-list/card-list.scss?tag=ix-card-list&encapsulation=shadow","src/components/card-list/card-list.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@import 'mixins/shadow-dom/component';\n\n$CardList__Title__Height: 1.5rem;\n\n:host {\n  @include ix-component;\n\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  align-items: flex-start;\n  margin: 0.5rem;\n\n  .CardList_Title {\n    display: flex;\n    position: relative;\n    height: $CardList__Title__Height;\n    align-items: center;\n    width: 100%;\n    margin-bottom: 0.5rem;\n\n    &__Label {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n  }\n\n  .CardList__Title__Button {\n    margin-right: 1rem;\n    transition: var(--theme-default-time) transform ease-in-out;\n  }\n\n  .CardList__Title__Button__Collapsed {\n    transform: rotate(-90deg);\n  }\n\n  .CardList__Title__Show__All {\n    align-self: center;\n    margin-left: auto;\n    margin-right: 0px;\n    flex-shrink: 0;\n  }\n\n  .CardList__Content {\n    display: flex;\n    position: relative;\n    height: calc(100% - #{$CardList__Title__Height});\n    width: 100%;\n    gap: 1.5rem;\n    transition: var(--theme-default-time) ease-in-out;\n    overflow: auto;\n  }\n\n  .CardList__Content__Collapsed {\n    min-height: 0px;\n    max-height: 0px;\n    overflow: hidden;\n    opacity: 0;\n  }\n\n  .CardList__Style__Flexbox__Scroll {\n    flex-wrap: wrap;\n  }\n\n  .CardList__Style__Infinite__Scroll {\n    flex-wrap: nowrap;\n\n    -ms-overflow-style: none;\n    scrollbar-width: none;\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  .CardList__Overflow {\n    display: block;\n    position: relative;\n    height: 100%;\n    width: 100%;\n    pointer-events: all;\n    mask-image: var(--ix-card-list-overflow, none);\n  }\n\n  .Show__All__Card {\n    display: flex;\n    position: relative;\n\n    align-self: flex-start;\n    justify-self: center;\n\n    max-width: 11.25rem;\n    min-width: 11.25rem;\n    width: 11.25rem;\n\n    min-height: 11.25rem;\n    max-height: 11.25rem;\n    height: 11.25rem;\n\n    --ix-card-border-color: var(--theme-color-primary);\n    color: var(--theme-color-primary);\n  }\n\n  .CardList__Style__Infinite__Scroll .Show__All__Card {\n    margin-top: 2.375rem;\n  }\n\n  .CardList__Style__Flexbox__Scroll .Show__All__Card {\n    margin-bottom: 2.375rem;\n  }\n\n  .Show__All__Card:hover {\n    background-color: var(--theme-color-ghost--hover);\n  }\n\n  .Show__All__Card:active {\n    background-color: var(--theme-color-ghost--active);\n  }\n\n  .Show__All__Card__Content {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .Show__All__Card__Icon {\n    display: flex;\n    position: absolute;\n    height: 4rem;\n    width: 4rem;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .Show__All__Card__Text {\n    margin-bottom: 0px;\n    margin-top: auto;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\n\nfunction CardListTitle(props: {\n  label: string;\n  isCollapsed: boolean;\n  onClick: (e: MouseEvent) => void;\n  onShowAllClick: (e: MouseEvent) => void;\n  showAllLabel: string;\n  showAllCounter: number;\n  hideShowAll: boolean;\n}) {\n  if (props.label === '') {\n    return null;\n  }\n\n  return (\n    <div class=\"CardList_Title\">\n      <ix-icon-button\n        ghost\n        icon={'chevron-down'}\n        onClick={props.onClick}\n        color=\"color-primary\"\n        class={{\n          CardList__Title__Button: true,\n          CardList__Title__Button__Collapsed: props.isCollapsed,\n        }}\n      ></ix-icon-button>\n      <ix-typography class=\"CardList_Title__Label\" format=\"body-lg\">\n        {props.label}\n      </ix-typography>\n      {!props.hideShowAll && (\n        <ix-button\n          class=\"CardList__Title__Show__All\"\n          ghost\n          onClick={props.onShowAllClick}\n        >\n          <span>{props.showAllLabel}</span>\n          <span>\n            {!isNaN(props.showAllCounter) ? ` (${props.showAllCounter})` : null}\n          </span>\n        </ix-button>\n      )}\n    </div>\n  );\n}\n\n/**\n * @since 1.6.0\n */\n@Component({\n  tag: 'ix-card-list',\n  styleUrl: 'card-list.scss',\n  shadow: true,\n})\nexport class CardList {\n  /**\n   * Name the card list\n   */\n  @Prop() label: string;\n\n  /**\n   * Collapse the list\n   */\n  @Prop({ mutable: true }) collapse = false;\n\n  /**\n   * List style\n   */\n  @Prop() listStyle: 'stack' | 'scroll' = 'stack';\n\n  /**\n   * Maximal visible cards\n   *\n   * @internal\n   */\n  @Prop() maxVisibleCards = 12;\n\n  /**\n   * Overwrite the default show all count.\n   * */\n  @Prop() showAllCount: number | undefined;\n\n  /**\n   * Suppress the overflow handling of child elements\n   */\n  @Prop() suppressOverflowHandling = false;\n\n  /**\n   * Hide the show all button\n   *\n   * @since 2.2.0\n   */\n  @Prop() hideShowAll = false;\n\n  /**\n   * i18n Show all button\n   */\n  @Prop() i18nShowAll = 'Show all';\n\n  /**\n   * i18n More cards available\n   */\n  @Prop() i18nMoreCards = 'There are more cards available';\n\n  /**\n   * Fire event when the collapse state is changed by the user\n   */\n  @Event() collapseChanged: EventEmitter<boolean>;\n\n  /**\n   * Fire event when the collapse state is changed by the user\n   */\n  @Event() showAllClick: EventEmitter<{\n    nativeEvent: MouseEvent;\n  }>;\n\n  /**\n   * Fire event when the show more card is clicked.\n   */\n  @Event() showMoreCardClick: EventEmitter<{\n    nativeEvent: MouseEvent;\n  }>;\n\n  @Element() hostElement: HTMLIxCardListElement;\n\n  @State() private hasOverflowingElements = false;\n  @State() private numberOfOverflowingElements = 0;\n  @State() private numberOfAllChildElements = 0;\n  @State() private leftScrollDistance = 0;\n  @State() private rightScrollDistance = 0;\n\n  private observer: MutationObserver;\n\n  private onCardListVisibilityToggle() {\n    this.collapse = !this.collapse;\n    this.collapseChanged.emit(this.collapse);\n  }\n\n  private onShowAllClick(event: MouseEvent) {\n    this.showAllClick.emit({\n      nativeEvent: event,\n    });\n  }\n\n  private getListChildren() {\n    const slot = this.hostElement.shadowRoot.querySelector(\n      '.CardList__Content > slot'\n    ) as HTMLSlotElement;\n    return slot.assignedElements({ flatten: true });\n  }\n\n  private changeVisibilityOfSlotChildren() {\n    const childElements = this.getListChildren();\n    childElements.forEach((element, index) => {\n      if (element instanceof HTMLElement) {\n        if (index > this.maxVisibleCards - 1) {\n          element.classList.add('d-none');\n          return;\n        }\n        element.classList.remove('d-none');\n      }\n    });\n    this.hasOverflowingElements = childElements.length > this.maxVisibleCards;\n    this.numberOfOverflowingElements =\n      childElements.length - this.maxVisibleCards;\n\n    this.numberOfAllChildElements = childElements.length;\n    this.detectOverflow();\n  }\n\n  private registerOverflowHandler() {\n    this.observer = createMutationObserver(() => {\n      this.changeVisibilityOfSlotChildren();\n    });\n\n    this.observer.observe(\n      this.hostElement.shadowRoot.querySelector('.CardList__Content'),\n      {\n        childList: true,\n        subtree: true,\n      }\n    );\n\n    requestAnimationFrame(() => {\n      this.changeVisibilityOfSlotChildren();\n    });\n  }\n\n  private shouldHandleOverflow() {\n    if (this.suppressOverflowHandling) {\n      return false;\n    }\n    if (this.listStyle === 'stack' || this.listStyle === 'scroll') {\n      return true;\n    }\n  }\n\n  private get listElement() {\n    return this.hostElement.shadowRoot.querySelector('.CardList__Content');\n  }\n\n  private onCardListScroll() {\n    this.detectOverflow();\n  }\n\n  private isShowMoreCardVisible() {\n    return (\n      this.suppressOverflowHandling === false && this.hasOverflowingElements\n    );\n  }\n\n  private getOpacityFromScrollDistance(distance: number) {\n    if (!this.listElement) {\n      return 0;\n    }\n\n    if (distance === 0) {\n      return 0;\n    }\n\n    if (distance > 100) {\n      return 1;\n    }\n\n    return distance / 100;\n  }\n\n  private computeMaskLayer() {\n    const maxOverflowWidth = 80;\n    const maskLayer = `linear-gradient(\n      90deg,\n      transparent 0px,\n      black ${\n        maxOverflowWidth *\n        (this.getOpacityFromScrollDistance(this.leftScrollDistance) > 0 ? 1 : 0)\n      }px,\n      black calc(100% - ${\n        maxOverflowWidth *\n        (this.getOpacityFromScrollDistance(this.rightScrollDistance) > 0\n          ? 1\n          : 0)\n      }px),\n      transparent 100%\n    )`;\n    return {\n      '--ix-card-list-overflow': maskLayer,\n    };\n  }\n\n  @Listen('resize', { target: 'window' })\n  private detectOverflow() {\n    const { clientWidth, scrollWidth, scrollLeft } = this.listElement;\n\n    this.leftScrollDistance = scrollLeft;\n    this.rightScrollDistance = scrollWidth - scrollLeft - clientWidth;\n  }\n\n  componentDidLoad() {\n    if (this.shouldHandleOverflow()) {\n      this.registerOverflowHandler();\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <CardListTitle\n          isCollapsed={this.collapse}\n          label={this.label}\n          showAllLabel={this.i18nShowAll}\n          showAllCounter={\n            this.showAllCount === undefined\n              ? this.numberOfAllChildElements\n              : this.showAllCount\n          }\n          onClick={() => this.onCardListVisibilityToggle()}\n          onShowAllClick={(e) => this.onShowAllClick(e)}\n          hideShowAll={this.hideShowAll}\n        ></CardListTitle>\n        <div\n          class={{\n            CardList__Overflow: true,\n          }}\n          style={this.computeMaskLayer()}\n        >\n          <div\n            class={{\n              CardList__Content: true,\n              CardList__Content__Collapsed: this.collapse,\n              CardList__Style__Flexbox__Scroll: this.listStyle === 'stack',\n              CardList__Style__Infinite__Scroll: this.listStyle === 'scroll',\n            }}\n            onScroll={() => this.onCardListScroll()}\n          >\n            <slot\n              onSlotchange={() => this.changeVisibilityOfSlotChildren()}\n            ></slot>\n            {this.isShowMoreCardVisible() ? (\n              <ix-card\n                class={{\n                  Show__All__Card: true,\n                }}\n                onClick={(event) =>\n                  this.showMoreCardClick.emit({\n                    nativeEvent: event,\n                  })\n                }\n              >\n                <ix-card-content class=\"Show__All__Card__Content\">\n                  <ix-icon\n                    name={'more-menu'}\n                    size={'32'}\n                    class={'Show__All__Card__Icon'}\n                  ></ix-icon>\n                  <span class=\"Show__All__Card__Text\">\n                    {this.i18nMoreCards} ({this.numberOfOverflowingElements})\n                  </span>\n                </ix-card-content>\n              </ix-card>\n            ) : null}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/{p-2946fd70.entry.js → p-ad0c6a32.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as t,h as r,H as e}from"./p-f87cd962.js";const n=".form-control,.form-control-plaintext{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}.form-control::-moz-placeholder,.form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.form-control::placeholder,.form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.form-control:focus-visible{color:var(--theme-input--color)}.form-control[type=number]{text-align:right}.form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.form-control.readonly,.form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only,.form-control[readonly],.form-control[readOnly],.form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only::-moz-placeholder,.form-control[readonly]::-moz-placeholder,.form-control[readOnly]::-moz-placeholder,.form-control.readonly::-moz-placeholder{color:transparent}.form-control:-moz-read-only::placeholder{color:transparent}.form-control:read-only::placeholder,.form-control[readonly]::placeholder,.form-control[readOnly]::placeholder,.form-control.readonly::placeholder{color:transparent}.form-control:disabled,.form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}.form-control:disabled::-moz-placeholder,.form-control.disabled::-moz-placeholder{color:transparent}.form-control:disabled::placeholder,.form-control.disabled::placeholder{color:transparent}.form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.form-control{padding:0 0.312rem}textarea.form-control{padding:0.375rem 0.5rem}input.disabled,input:disabled{color:var(--theme-input--color--disabled)}input:-moz-read-only{cursor:default}input:read-only,input.readonly{cursor:default}:host{display:inline-flex;width:auto;height:2rem;align-items:center;justify-content:space-between;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 .input-container{transition:all var(--theme-medium-time) ease-in-out}:host input{box-shadow:var(--theme-input--box-shadow);cursor:auto !important;width:100%}:host .expanded{width:11.5625rem}:host .expanded.fullWidth{width:100%}:host .collapsed{width:1.5rem;border:none}:host .btn-search-icon{align-self:center;margin:auto;position:relative}:host .btn-search{display:flex;max-width:2rem;max-height:2rem;border-radius:var(--theme-input--border-radius);transition:all var(--theme-default-time) ease-in-out;z-index:1;align-items:center;position:relative;border:none}:host .btn-search:not(.disabled):not(:disabled){cursor:pointer}:host .btn-search:not(.disabled):not(:disabled):hover{border-color:transparent}:host .btn-search:not(.disabled):not(:disabled){cursor:pointer}:host .btn-search:not(.disabled):not(:disabled):active,:host .btn-search:not(.disabled):not(:disabled).active{border-color:transparent}:host .btn-search:not(.disabled):not(:disabled):focus-visible{outline:none}:host .btn-search:not(.disabled):not(:disabled):focus-visible{outline:var(--focus--border-color);outline-width:1px;outline-style:solid}:host .btn-search.btn-search--expanded{margin-left:0.25rem;pointer-events:none}:host .btn-search:active{width:2rem;height:2rem;border-radius:var(--theme-input--border-radius);border:var(--theme-std-bdr-1) !important}:host .input-container{display:flex;position:absolute;align-items:center;flex-wrap:nowrap}:host .btn-clear{position:absolute;border-radius:var(--theme-input--border-radius);right:0px;margin-right:0.25rem}:host .input{padding-left:2rem !important;padding-right:2.5rem !important}:host .opacity-before{opacity:0}:host .opacity-after{opacity:1}:host(.right-position){width:11.5625rem !important}:host(.right-position.fullWidth){width:100% !important}:host(.right-position.fullWidth) .fullWidth{width:100% !important}";const a=n;const i=class{expandInput(){setTimeout(this.focusTextInput,300);this.expanded=true}collapseInput(){if(!this.isFieldChanged&&this.expanded){this.expanded=false}}clearInput(){this.value="";this.isFieldChanged=false}onChange(o){this.value=o.target.value;if(this.isFieldChanged&&this.value===""){this.isFieldChanged=false}else{this.isFieldChanged=true}this.valueChange.emit(this.value)}constructor(r){o(this,r);this.valueChange=t(this,"valueChange",7);this.icon="search";this.placeholder="Enter text here";this.value="";this.fullWidth=false;this.isFieldChanged=false;this.expanded=false;this.hasFocus=false;this.focusTextInput=this.focusTextInput.bind(this)}focusTextInput(){var o;(o=this.textInput)===null||o===void 0?void 0:o.focus()}clearClicked(){var o;this.clearInput();(o=this.textInput)===null||o===void 0?void 0:o.focus();this.valueChange.emit(this.value)}render(){return r(e,{key:"ce6a0b2941966880a2a47a20ddf39820d8110836",class:{expanded:this.expanded,"right-position":this.expanded,fullWidth:this.fullWidth}},r("ix-icon-button",{key:"e773bc67a18476c86d530e14a0b062f1b10caae7",size:this.expanded?"16":"24",icon:this.icon,ghost:true,variant:"primary","data-testid":"button",onClick:()=>this.expandInput(),tabindex:this.expanded?-1:0,color:this.hasFocus?"input-search-icon--color--focus":undefined,class:{"btn-search":true,"btn-search--expanded":this.expanded}}),r("div",{key:"ab6b7f77f88713c1b0230a83a3c2eb50df35f340",class:{expanded:this.expanded,fullWidth:this.fullWidth,collapsed:!this.expanded,"disable-pointer":!this.expanded,"input-container":true},"data-testid":"input-wrapper"},r("input",{key:"fb3f5e5c926a5eed3d2a0bac878ef806684f9d8d",class:{"form-control":true,input:this.expanded,"disable-pointer":!this.expanded,"opacity-before":!this.expanded,"opacity-after":this.expanded},ref:o=>this.textInput=o,"data-testid":"input",placeholder:this.placeholder,type:"text",value:this.value,onBlur:()=>{this.collapseInput();this.hasFocus=false},onFocus:()=>this.hasFocus=true,onInput:o=>this.onChange(o),tabindex:this.expanded?0:-1}),this.isFieldChanged?r("ix-icon-button",{class:"btn-clear",icon:"clear",ghost:true,size:"16","data-testid":"clear-button",onClick:()=>this.clearClicked()}):null))}};i.style=a;export{i as ix_expanding_search};
-//# sourceMappingURL=p-2946fd70.entry.js.map
+import{r as o,c as t,h as r,H as e}from"./p-f87cd962.js";const n=".form-control,.form-control-plaintext{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}.form-control::-moz-placeholder,.form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.form-control::placeholder,.form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.form-control:focus-visible{color:var(--theme-input--color)}.form-control[type=number]{text-align:right}.form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.form-control.readonly,.form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only,.form-control[readonly],.form-control[readOnly],.form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only::-moz-placeholder,.form-control[readonly]::-moz-placeholder,.form-control[readOnly]::-moz-placeholder,.form-control.readonly::-moz-placeholder{color:transparent}.form-control:-moz-read-only::placeholder{color:transparent}.form-control:read-only::placeholder,.form-control[readonly]::placeholder,.form-control[readOnly]::placeholder,.form-control.readonly::placeholder{color:transparent}.form-control:disabled,.form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}.form-control:disabled::-moz-placeholder,.form-control.disabled::-moz-placeholder{color:transparent}.form-control:disabled::placeholder,.form-control.disabled::placeholder{color:transparent}.form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.form-control{padding:0 0.312rem}textarea.form-control{padding:0.375rem 0.5rem}input.disabled,input:disabled{color:var(--theme-input--color--disabled)}input:-moz-read-only{cursor:default}input:read-only,input.readonly{cursor:default}:host{display:inline-flex;width:auto;height:2rem;align-items:center;justify-content:space-between;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 .input-container{transition:all var(--theme-medium-time) ease-in-out}:host input{box-shadow:var(--theme-input--box-shadow);cursor:auto !important;width:100%}:host .expanded{width:11.5625rem}:host .expanded.fullWidth{width:100%}:host .collapsed{width:1.5rem;border:none}:host .btn-search-icon{align-self:center;margin:auto;position:relative}:host .btn-search{display:flex;max-width:2rem;max-height:2rem;border-radius:var(--theme-input--border-radius);transition:all var(--theme-default-time) ease-in-out;z-index:1;align-items:center;position:relative;border:none}:host .btn-search:not(.disabled):not(:disabled){cursor:pointer}:host .btn-search:not(.disabled):not(:disabled):hover{border-color:transparent}:host .btn-search:not(.disabled):not(:disabled){cursor:pointer}:host .btn-search:not(.disabled):not(:disabled):active,:host .btn-search:not(.disabled):not(:disabled).active{border-color:transparent}:host .btn-search:not(.disabled):not(:disabled):focus-visible{outline:none}:host .btn-search:not(.disabled):not(:disabled):focus-visible{outline:var(--focus--border-color);outline-width:1px;outline-style:solid}:host .btn-search.btn-search--expanded{margin-left:0.25rem;pointer-events:none}:host .btn-search:active{width:2rem;height:2rem;border-radius:var(--theme-input--border-radius);border:var(--theme-std-bdr-1) !important}:host .input-container{display:flex;position:absolute;align-items:center;flex-wrap:nowrap}:host .btn-clear{position:absolute;border-radius:var(--theme-input--border-radius);right:0px;margin-right:0.25rem}:host .input{padding-left:2rem !important;padding-right:2.5rem !important}:host .opacity-before{opacity:0}:host .opacity-after{opacity:1}:host(.right-position){width:11.5625rem !important}:host(.right-position.fullWidth){width:100% !important}:host(.right-position.fullWidth) .fullWidth{width:100% !important}";const a=n;const i=class{expandInput(){setTimeout(this.focusTextInput,300);this.expanded=true}collapseInput(){if(!this.isFieldChanged&&this.expanded){this.expanded=false}}clearInput(){this.value="";this.isFieldChanged=false}onChange(o){this.value=o.target.value;if(this.isFieldChanged&&this.value===""){this.isFieldChanged=false}else{this.isFieldChanged=true}this.valueChange.emit(this.value)}constructor(r){o(this,r);this.valueChange=t(this,"valueChange",7);this.icon="search";this.placeholder="Enter text here";this.value="";this.fullWidth=false;this.isFieldChanged=false;this.expanded=false;this.hasFocus=false;this.focusTextInput=this.focusTextInput.bind(this)}focusTextInput(){var o;(o=this.textInput)===null||o===void 0?void 0:o.focus()}clearClicked(){var o;this.clearInput();(o=this.textInput)===null||o===void 0?void 0:o.focus();this.valueChange.emit(this.value)}render(){return r(e,{key:"d289390fddfab1d5c066487efc9ea757f9f86957",class:{expanded:this.expanded,"right-position":this.expanded,fullWidth:this.fullWidth}},r("ix-icon-button",{key:"d8f230fb82e0a6012a2b3b2d98ed13d05a45ca8b",size:this.expanded?"16":"24",icon:this.icon,ghost:true,variant:"primary","data-testid":"button",onClick:()=>this.expandInput(),tabindex:this.expanded?-1:0,color:this.hasFocus?"input-search-icon--color--focus":undefined,class:{"btn-search":true,"btn-search--expanded":this.expanded}}),r("div",{key:"7c1cbb723fee8dd2c2b92d55938362bb01fb2750",class:{expanded:this.expanded,fullWidth:this.fullWidth,collapsed:!this.expanded,"disable-pointer":!this.expanded,"input-container":true},"data-testid":"input-wrapper"},r("input",{key:"0ea65313e1e6d06c8ff19b715577687f468d2c7a",class:{"form-control":true,input:this.expanded,"disable-pointer":!this.expanded,"opacity-before":!this.expanded,"opacity-after":this.expanded},ref:o=>this.textInput=o,"data-testid":"input",placeholder:this.placeholder,type:"text",value:this.value,onBlur:()=>{this.collapseInput();this.hasFocus=false},onFocus:()=>this.hasFocus=true,onInput:o=>this.onChange(o),tabindex:this.expanded?0:-1}),this.isFieldChanged?r("ix-icon-button",{class:"btn-clear",icon:"clear",ghost:true,size:"16","data-testid":"clear-button",onClick:()=>this.clearClicked()}):null))}};i.style=a;export{i as ix_expanding_search};
+//# sourceMappingURL=p-ad0c6a32.entry.js.map

package/dist/siemens-ix/p-af7a836c.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,H as s,g as o}from"./p-f87cd962.js";import{a as r}from"./p-71206084.js";import{c as a}from"./p-10a522ca.js";import{c as n}from"./p-e898862b.js";import"./p-c4749812.js";function h(e,t,{debounceTimeEnter:i,debounceTimeLeave:s}={debounceTimeEnter:0,debounceTimeLeave:500}){let o;let r;return{onEnter:()=>{clearTimeout(r);o=setTimeout((()=>{e()}),i)},onLeave:()=>{clearTimeout(o);r=setTimeout((()=>{t()}),s)}}}const c=":host{display:flex;flex-direction:column;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 .category{display:flex;position:relative;align-items:center;width:100%;height:100%}:host .category-text{width:100%;padding-right:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .category-chevron{margin-left:auto;margin-right:0;transition:var(--theme-default-time) transform ease-in-out}:host .category-chevron--open{transform:rotate(-180deg)}:host .menu-items{overflow:hidden;max-height:0;transition:var(--theme-default-time) max-height ease-in-out}:host .menu-items--expanded{max-height:999999999px;padding:0.25rem 0 0.25rem 1.625rem}:host .menu-items--collapsed{display:none}:host .category-dropdown ::slotted(ix-menu-item){--ix-menu-item-height:2.5rem}:host .category-dropdown-header{pointer-events:none;padding-left:0.125rem;min-width:256px}:host ::slotted(ix-menu-item){--ix-menu-item-height:2.5rem}:host(.expanded){background-color:var(--theme-color-ghost--active)}:host ::slotted(a[href]){text-decoration:none !important}";const d=c;const l=40;const m=150;const u=class{constructor(i){e(this,i);this.closeOtherCategories=t(this,"closeOtherCategories",7);this.enterLeaveDebounce=h((()=>{this.onPointerEnter()}),(()=>{this.onPointerLeave()}));this.label=undefined;this.icon=undefined;this.notifications=undefined;this.menuExpand=false;this.showItems=false;this.showDropdown=false;this.nestedItems=[]}isNestedItemActive(){return this.getNestedItems().some((e=>e.active))}getNestedItems(){return Array.from(this.hostElement.querySelectorAll(":scope ix-menu-item"))}getNestedItemsHeight(){const e=this.getNestedItems();return e.length*l}onExpandCategory(e){if(e){this.animateFadeIn()}else{this.animateFadeOut()}}animateFadeOut(){const e=25;r({targets:this.menuItemsContainer,duration:m,easing:"easeInSine",opacity:[1,0],maxHeight:[this.getNestedItemsHeight()+l,0],complete:()=>{setTimeout((()=>{this.showItems=false;this.showDropdown=false}),m+e)}})}animateFadeIn(){r({targets:this.menuItemsContainer,duration:m,easing:"easeInSine",opacity:[0,1],maxHeight:[0,this.getNestedItemsHeight()+l],begin:()=>{this.showItems=true;this.showDropdown=false}})}onPointerEnter(){if(this.ixMenu.expand){return}this.closeOtherCategories.emit();this.showDropdown=true}onPointerLeave(){this.showDropdown=false}onCategoryClick(e){e.stopPropagation();if(this.ixMenu.expand){e===null||e===void 0?void 0:e.stopPropagation();this.onExpandCategory(!this.showItems);return}}onNestedItemsChanged(){this.nestedItems=this.getNestedItems()}isCategoryItemListVisible(){return this.menuExpand&&(this.showItems||this.isNestedItemActive())}componentWillLoad(){const e=a(this.hostElement);if(!e){throw Error("ix-menu-category can only be used as a child of ix-menu")}this.ixMenu=e;this.menuExpand=this.ixMenu.expand;this.showItems=this.isCategoryItemListVisible()}componentDidLoad(){this.observer=n((()=>this.onNestedItemsChanged()));this.observer.observe(this.hostElement,{attributes:true,childList:true,subtree:true});requestAnimationFrame((()=>{this.onNestedItemsChanged()}));this.ixMenu.addEventListener("expandChange",(({detail:e})=>{this.menuExpand=e;if(!e){this.clearMenuItemStyles()}this.showItems=this.isCategoryItemListVisible()}))}clearMenuItemStyles(){this.menuItemsContainer.style.removeProperty("max-height");this.menuItemsContainer.style.removeProperty("opacity")}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}render(){return i(s,{key:"2dc5cedfcf0413b8ff028500713525937ec02c80",class:{expanded:this.showItems},onPointerEnter:()=>{this.enterLeaveDebounce.onEnter()},onPointerLeave:e=>{if(e.pointerType==="touch"){return}this.enterLeaveDebounce.onLeave()}},i("ix-menu-item",{key:"ca62e9a5040b9d678f210e3059042991093d6888",class:"category-parent",active:this.isNestedItemActive(),notifications:this.notifications,icon:this.icon,onClick:e=>this.onCategoryClick(e),onFocus:()=>this.onPointerEnter(),isCategory:true},i("div",{key:"ec7ef5039ba69016667897145d76430212042e12",class:"category"},i("div",{key:"45f60214b8b3f1ed1d790cd88577f42dcd49e61c",class:"category-text"},this.label),i("ix-icon",{key:"6508c8ae4bd0bde77655ae792454b749c8ea4a5a",name:"chevron-down-small",class:{"category-chevron":true,"category-chevron--open":this.showItems}}))),i("div",{key:"665b58c0601e1ff8adaf8711409d5fac21c3a648",ref:e=>this.menuItemsContainer=e,class:{"menu-items":true,"menu-items--expanded":this.showItems,"menu-items--collapsed":!this.showItems}},this.showItems?i("slot",null):null),i("ix-dropdown",{key:"d1169055ec0f2f77eefa0578330a6b6d3d6b104e",closeBehavior:"both",show:this.showDropdown,onShowChanged:({detail:e})=>{this.showDropdown=e},class:"category-dropdown",anchor:this.hostElement,placement:"right-start",offset:{mainAxis:3},onClick:e=>{if(e.target instanceof HTMLElement){if(e.target.tagName==="IX-MENU-ITEM"){this.showDropdown=false}else{e.preventDefault()}}}},i("ix-dropdown-item",{key:"879fd845db7d24c660a0aac9130a6199795953b8",class:"category-dropdown-header"},i("ix-typography",{key:"38e4a6a50649934d42e46dceb1d52dc1836b1cc1",format:"label",bold:true,color:"std"},this.label)),i("ix-divider",{key:"322f4280179c91e1bef5de85c78d1efee6c73851"}),i("slot",{key:"3d44d4fc1b26f92af6093bb2dd415fcb82cba89c"})))}get hostElement(){return o(this)}};u.style=d;export{u as ix_menu_category};
+//# sourceMappingURL=p-af7a836c.entry.js.map

package/dist/siemens-ix/p-af7a836c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createEnterLeaveDebounce","enterCallback","leaveCallback","debounceTimeEnter","debounceTimeLeave","enterTimeout","leaveTimeout","onEnter","clearTimeout","setTimeout","onLeave","menuCategoryCss","IxMenuCategoryStyle0","DefaultIxMenuItemHeight","DefaultAnimationTimeout","MenuCategory","this","enterLeaveDebounce","onPointerEnter","onPointerLeave","isNestedItemActive","getNestedItems","some","item","active","Array","from","hostElement","querySelectorAll","getNestedItemsHeight","items","length","onExpandCategory","showItems","animateFadeIn","animateFadeOut","slotHideThresholdMs","anime","targets","menuItemsContainer","duration","easing","opacity","maxHeight","complete","showDropdown","begin","ixMenu","expand","closeOtherCategories","emit","onCategoryClick","e","stopPropagation","onNestedItemsChanged","nestedItems","isCategoryItemListVisible","menuExpand","componentWillLoad","closestMenu","closestIxMenu","Error","componentDidLoad","observer","createMutationObserver","observe","attributes","childList","subtree","requestAnimationFrame","addEventListener","detail","clearMenuItemStyles","style","removeProperty","disconnectedCallback","disconnect","render","h","Host","key","class","expanded","event","pointerType","notifications","icon","onClick","onFocus","isCategory","label","name","ref","closeBehavior","show","onShowChanged","dropdownShown","anchor","placement","offset","mainAxis","target","HTMLElement","tagName","preventDefault","format","bold","color"],"sources":["src/components/menu-category/enter-leave.ts","src/components/menu-category/menu-category.scss?tag=ix-menu-category&encapsulation=shadow","src/components/menu-category/menu-category.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 */\nexport function createEnterLeaveDebounce(\n  enterCallback: Function,\n  leaveCallback: Function,\n  {\n    debounceTimeEnter,\n    debounceTimeLeave,\n  }: {\n    debounceTimeEnter: number;\n    debounceTimeLeave: number;\n  } = {\n    debounceTimeEnter: 0,\n    debounceTimeLeave: 500,\n  }\n) {\n  let enterTimeout: NodeJS.Timeout;\n  let leaveTimeout: NodeJS.Timeout;\n\n  return {\n    onEnter: () => {\n      clearTimeout(leaveTimeout);\n      enterTimeout = setTimeout(() => {\n        enterCallback();\n      }, debounceTimeEnter);\n    },\n    onLeave: () => {\n      clearTimeout(enterTimeout);\n      leaveTimeout = setTimeout(() => {\n        leaveCallback();\n      }, debounceTimeLeave);\n    },\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\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n:host {\n  @include ix-component;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n\n  .category {\n    display: flex;\n    position: relative;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n  }\n\n  .category-text {\n    width: 100%;\n    padding-right: 0.25rem;\n    @include ellipsis;\n  }\n\n  .category-chevron {\n    margin-left: auto;\n    margin-right: 0;\n    transition: var(--theme-default-time) transform ease-in-out;\n  }\n\n  .category-chevron--open {\n    transform: rotate(-180deg);\n  }\n\n  .menu-items {\n    overflow: hidden;\n    max-height: 0;\n    transition: var(--theme-default-time) max-height ease-in-out;\n  }\n\n  .menu-items--expanded {\n    max-height: 999999999px;\n    padding: 0.25rem 0 0.25rem 1.625rem;\n  }\n\n  .menu-items--collapsed {\n    display: none;\n  }\n\n  .category-dropdown {\n    ::slotted(ix-menu-item) {\n      --ix-menu-item-height: 2.5rem;\n    }\n  }\n\n  .category-dropdown-header {\n    pointer-events: none;\n    padding-left: 0.125rem;\n    min-width: 256px;\n  }\n\n  ::slotted(ix-menu-item) {\n    --ix-menu-item-height: 2.5rem;\n  }\n}\n\n:host(.expanded) {\n  background-color: var(--theme-color-ghost--active);\n}\n\n:host {\n  ::slotted(a[href]) {\n    text-decoration: none !important;\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 */\nimport {\n  Component,\n  Element,\n  h,\n  Host,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { closestIxMenu } from '../utils/application-layout/context';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { createEnterLeaveDebounce } from './enter-leave';\n\nconst DefaultIxMenuItemHeight = 40;\nconst DefaultAnimationTimeout = 150;\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-menu-category',\n  styleUrl: 'menu-category.scss',\n  shadow: true,\n})\nexport class MenuCategory {\n  @Element() hostElement: HTMLIxMenuCategoryElement;\n\n  /**\n   * Display name of the category\n   */\n  @Prop() label: string;\n\n  /**\n   * Icon of the category\n   */\n  @Prop() icon: string;\n\n  /**\n   * Show notification count on the category\n   */\n  @Prop() notifications: number;\n\n  /** @internal */\n  // eslint-disable-next-line @stencil-community/decorators-style\n  @Event({ bubbles: true, cancelable: true })\n  closeOtherCategories: EventEmitter;\n\n  @State() menuExpand = false;\n  @State() showItems = false;\n  @State() showDropdown = false;\n  @State() nestedItems: HTMLIxMenuItemElement[] = [];\n\n  private observer: MutationObserver;\n  private menuItemsContainer: HTMLDivElement;\n  private ixMenu: HTMLIxMenuElement;\n\n  private enterLeaveDebounce = createEnterLeaveDebounce(\n    () => {\n      this.onPointerEnter();\n    },\n    () => {\n      this.onPointerLeave();\n    }\n  );\n\n  private isNestedItemActive() {\n    return this.getNestedItems().some((item) => item.active);\n  }\n\n  private getNestedItems() {\n    return Array.from(\n      this.hostElement.querySelectorAll(':scope ix-menu-item')\n    ) as HTMLIxMenuItemElement[];\n  }\n\n  private getNestedItemsHeight() {\n    const items = this.getNestedItems();\n\n    return items.length * DefaultIxMenuItemHeight;\n  }\n\n  private onExpandCategory(showItems: boolean) {\n    if (showItems) {\n      this.animateFadeIn();\n    } else {\n      this.animateFadeOut();\n    }\n  }\n\n  private animateFadeOut() {\n    const slotHideThresholdMs = 25;\n    anime({\n      targets: this.menuItemsContainer,\n      duration: DefaultAnimationTimeout,\n      easing: 'easeInSine',\n      opacity: [1, 0],\n      maxHeight: [this.getNestedItemsHeight() + DefaultIxMenuItemHeight, 0],\n      complete: () => {\n        setTimeout(() => {\n          this.showItems = false;\n          this.showDropdown = false;\n        }, DefaultAnimationTimeout + slotHideThresholdMs);\n      },\n    });\n  }\n\n  private animateFadeIn() {\n    anime({\n      targets: this.menuItemsContainer,\n      duration: DefaultAnimationTimeout,\n      easing: 'easeInSine',\n      opacity: [0, 1],\n      maxHeight: [0, this.getNestedItemsHeight() + DefaultIxMenuItemHeight],\n      begin: () => {\n        this.showItems = true;\n        this.showDropdown = false;\n      },\n    });\n  }\n\n  private onPointerEnter() {\n    if (this.ixMenu.expand) {\n      return;\n    }\n    this.closeOtherCategories.emit();\n    this.showDropdown = true;\n  }\n\n  @Listen('closeOtherCategories', { target: 'window' })\n  private onPointerLeave() {\n    this.showDropdown = false;\n  }\n\n  private onCategoryClick(e: MouseEvent) {\n    e.stopPropagation();\n    if (this.ixMenu.expand) {\n      e?.stopPropagation();\n      this.onExpandCategory(!this.showItems);\n      return;\n    }\n  }\n\n  private onNestedItemsChanged() {\n    this.nestedItems = this.getNestedItems();\n  }\n\n  private isCategoryItemListVisible() {\n    return this.menuExpand && (this.showItems || this.isNestedItemActive());\n  }\n\n  componentWillLoad() {\n    const closestMenu = closestIxMenu(this.hostElement);\n    if (!closestMenu) {\n      throw Error('ix-menu-category can only be used as a child of ix-menu');\n    }\n    this.ixMenu = closestMenu;\n\n    this.menuExpand = this.ixMenu.expand;\n    this.showItems = this.isCategoryItemListVisible();\n  }\n\n  componentDidLoad() {\n    this.observer = createMutationObserver(() => this.onNestedItemsChanged());\n    this.observer.observe(this.hostElement, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n    });\n\n    requestAnimationFrame(() => {\n      this.onNestedItemsChanged();\n    });\n\n    this.ixMenu.addEventListener(\n      'expandChange',\n      ({ detail: menuExpand }: CustomEvent<boolean>) => {\n        this.menuExpand = menuExpand;\n        if (!menuExpand) {\n          this.clearMenuItemStyles();\n        }\n        this.showItems = this.isCategoryItemListVisible();\n      }\n    );\n  }\n\n  clearMenuItemStyles() {\n    this.menuItemsContainer.style.removeProperty('max-height');\n    this.menuItemsContainer.style.removeProperty('opacity');\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          expanded: this.showItems,\n        }}\n        onPointerEnter={() => {\n          this.enterLeaveDebounce.onEnter();\n        }}\n        onPointerLeave={(event: PointerEvent) => {\n          if (event.pointerType === 'touch') {\n            return;\n          }\n          this.enterLeaveDebounce.onLeave();\n        }}\n      >\n        <ix-menu-item\n          class={'category-parent'}\n          active={this.isNestedItemActive()}\n          notifications={this.notifications}\n          icon={this.icon}\n          onClick={(e) => this.onCategoryClick(e)}\n          onFocus={() => this.onPointerEnter()}\n          isCategory\n        >\n          <div class=\"category\">\n            <div class=\"category-text\">{this.label}</div>\n            <ix-icon\n              name={'chevron-down-small'}\n              class={{\n                'category-chevron': true,\n                'category-chevron--open': this.showItems,\n              }}\n            ></ix-icon>\n          </div>\n        </ix-menu-item>\n        <div\n          ref={(ref) => (this.menuItemsContainer = ref!)}\n          class={{\n            'menu-items': true,\n            'menu-items--expanded': this.showItems,\n            'menu-items--collapsed': !this.showItems,\n          }}\n        >\n          {this.showItems ? <slot></slot> : null}\n        </div>\n        <ix-dropdown\n          closeBehavior={'both'}\n          show={this.showDropdown}\n          onShowChanged={({ detail: dropdownShown }: CustomEvent<boolean>) => {\n            this.showDropdown = dropdownShown;\n          }}\n          class={'category-dropdown'}\n          anchor={this.hostElement}\n          placement=\"right-start\"\n          offset={{\n            mainAxis: 3,\n          }}\n          onClick={(e) => {\n            if (e.target instanceof HTMLElement) {\n              if (e.target.tagName === 'IX-MENU-ITEM') {\n                this.showDropdown = false;\n              } else {\n                e.preventDefault();\n              }\n            }\n          }}\n        >\n          <ix-dropdown-item class={'category-dropdown-header'}>\n            <ix-typography format=\"label\" bold color=\"std\">\n              {this.label}\n            </ix-typography>\n          </ix-dropdown-item>\n          <ix-divider></ix-divider>\n          <slot></slot>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/{p-6fd7ecd0.entry.js → p-b247d124.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as o,H as r}from"./p-f87cd962.js";const t=".btn{display:inline-flex;align-items:center;justify-content:center;height:2rem;font-size:0.875rem;font-weight:700;transition:var(--theme-default-time);padding:0 0.5rem;min-width:5rem;gap:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn .glyph{margin-right:0.25rem;font-weight:400}.btn:focus-visible,.btn.focus{box-shadow:none}.btn-primary{border-radius:var(--theme-btn--border-radius)}.btn-primary,.btn-primary.focus,.btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}.btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-primary.hover,.btn-primary:hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}.btn-primary.selected.hover,.btn-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-primary:not(:disabled):not(.disabled):active,.btn-primary:not(:disabled):not(.disabled).active,.show>.btn-primary.dropdown-toggle{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}.btn-primary.selected:not(:disabled):not(.disabled):active,.btn-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-primary.disabled,.btn-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}.btn-outline-primary{border-radius:var(--theme-btn--border-radius)}.btn-outline-primary,.btn-outline-primary.focus,.btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}.btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-outline-primary.hover,.btn-outline-primary:hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}.btn-outline-primary.selected.hover,.btn-outline-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-outline-primary:not(:disabled):not(.disabled):active,.btn-outline-primary:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.dropdown-toggle{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}.btn-outline-primary.selected:not(:disabled):not(.disabled):active,.btn-outline-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-outline-primary.disabled,.btn-outline-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}.btn-invisible-primary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-primary,.btn-invisible-primary.focus,.btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}.btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-invisible-primary.hover,.btn-invisible-primary:hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}.btn-invisible-primary.selected.hover,.btn-invisible-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-invisible-primary:not(:disabled):not(.disabled):active,.btn-invisible-primary:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.dropdown-toggle{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}.btn-invisible-primary.selected:not(:disabled):not(.disabled):active,.btn-invisible-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-invisible-primary.disabled,.btn-invisible-primary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}.btn-secondary{border-radius:var(--theme-btn--border-radius)}.btn-secondary,.btn-secondary.focus,.btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}.btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-secondary.hover,.btn-secondary:hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}.btn-secondary.selected.hover,.btn-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-secondary:not(:disabled):not(.disabled):active,.btn-secondary:not(:disabled):not(.disabled).active,.show>.btn-secondary.dropdown-toggle{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}.btn-secondary.selected:not(:disabled):not(.disabled):active,.btn-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-secondary.disabled,.btn-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}.btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}.btn-outline-secondary,.btn-outline-secondary.focus,.btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}.btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-outline-secondary.hover,.btn-outline-secondary:hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}.btn-outline-secondary.selected.hover,.btn-outline-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-outline-secondary:not(:disabled):not(.disabled):active,.btn-outline-secondary:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.dropdown-toggle{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}.btn-outline-secondary.selected:not(:disabled):not(.disabled):active,.btn-outline-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-outline-secondary.disabled,.btn-outline-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}.btn-invisible-secondary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-secondary,.btn-invisible-secondary.focus,.btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}.btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-invisible-secondary.hover,.btn-invisible-secondary:hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}.btn-invisible-secondary.selected.hover,.btn-invisible-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-invisible-secondary:not(:disabled):not(.disabled):active,.btn-invisible-secondary:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.dropdown-toggle{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}.btn-invisible-secondary.selected:not(:disabled):not(.disabled):active,.btn-invisible-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-invisible-secondary.disabled,.btn-invisible-secondary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}.btn-oval,.btn-icon{min-width:2rem;width:2rem}.btn-oval .glyph,.btn-icon .glyph{margin-right:0}.btn-oval{border-radius:6.25rem;width:2rem}.btn-icon-xs,.btn-icon-12{height:1rem;width:1rem;min-width:1rem;min-height:1rem}.btn-icon-s,.btn-icon-16{height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}.btn-icon-32{height:2rem;width:2rem;min-width:2rem;min-height:2rem}:host{display:inline-flex;height:2rem;font-size:0.875rem;font-weight:400;min-width:2rem}:host .link-button{display:inline-flex;position:relative;width:100%;padding:0 0.25rem 0 0;align-items:center;justify-content:center;background-color:transparent;color:var(--theme-color-primary);cursor:pointer;text-decoration:none}:host .link-button .link{display:block;position:relative;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):hover{color:var(--theme-color-dynamic--hover)}:host .link-button:not(.disabled):not(:disabled):hover .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):active,:host .link-button:not(.disabled):not(:disabled).active{color:var(--theme-color-dynamic--active)}:host .link-button:not(.disabled):not(:disabled):active .link,:host .link-button:not(.disabled):not(:disabled).active .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button.disabled{cursor:default;color:var(--theme-color-weak-text)}:host .link-button a{all:unset}:host :focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";const n=t;const i=class{constructor(o){e(this,o);this.disabled=false;this.url=undefined;this.target="_self"}render(){return o(r,{key:"c0753708c00f43909af85a98f619b407545a69a2"},o("a",{key:"a7935cfb13d2743192bd678bf99e7e2dc09657f5",title:this.url,tabindex:"0",class:{"link-button":true,disabled:this.disabled},href:this.disabled?undefined:this.url,target:this.target},o("ix-icon",{key:"e18e4e6c7f69fce4cf7c9708f3ec18a14e825b3f",class:"icon",name:"chevron-right-small",size:"16"}),o("div",{key:"20d6785d5ecd08978bdb8a58c0e11b85584143f8",class:{link:true,disabled:this.disabled}},o("slot",{key:"6d5ac72219c3565dc5c3adec23b59e6d0bdf93a7"}))))}};i.style=n;export{i as ix_link_button};
-//# sourceMappingURL=p-6fd7ecd0.entry.js.map
+import{r as e,h as o,H as r}from"./p-f87cd962.js";const t=".btn{display:inline-flex;align-items:center;justify-content:center;height:2rem;font-size:0.875rem;font-weight:700;transition:var(--theme-default-time);padding:0 0.5rem;min-width:5rem;gap:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn .glyph{margin-right:0.25rem;font-weight:400}.btn:focus-visible,.btn.focus{box-shadow:none}.btn-primary{border-radius:var(--theme-btn--border-radius)}.btn-primary,.btn-primary.focus,.btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}.btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-primary.hover,.btn-primary:hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}.btn-primary.selected.hover,.btn-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-primary:not(:disabled):not(.disabled):active,.btn-primary:not(:disabled):not(.disabled).active,.show>.btn-primary.dropdown-toggle{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}.btn-primary.selected:not(:disabled):not(.disabled):active,.btn-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-primary.disabled,.btn-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}.btn-outline-primary{border-radius:var(--theme-btn--border-radius)}.btn-outline-primary,.btn-outline-primary.focus,.btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}.btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-outline-primary.hover,.btn-outline-primary:hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}.btn-outline-primary.selected.hover,.btn-outline-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-outline-primary:not(:disabled):not(.disabled):active,.btn-outline-primary:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.dropdown-toggle{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}.btn-outline-primary.selected:not(:disabled):not(.disabled):active,.btn-outline-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-outline-primary.disabled,.btn-outline-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}.btn-invisible-primary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-primary,.btn-invisible-primary.focus,.btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}.btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-invisible-primary.hover,.btn-invisible-primary:hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}.btn-invisible-primary.selected.hover,.btn-invisible-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-invisible-primary:not(:disabled):not(.disabled):active,.btn-invisible-primary:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.dropdown-toggle{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}.btn-invisible-primary.selected:not(:disabled):not(.disabled):active,.btn-invisible-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-invisible-primary.disabled,.btn-invisible-primary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}.btn-secondary{border-radius:var(--theme-btn--border-radius)}.btn-secondary,.btn-secondary.focus,.btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}.btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-secondary.hover,.btn-secondary:hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}.btn-secondary.selected.hover,.btn-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-secondary:not(:disabled):not(.disabled):active,.btn-secondary:not(:disabled):not(.disabled).active,.show>.btn-secondary.dropdown-toggle{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}.btn-secondary.selected:not(:disabled):not(.disabled):active,.btn-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-secondary.disabled,.btn-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}.btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}.btn-outline-secondary,.btn-outline-secondary.focus,.btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}.btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-outline-secondary.hover,.btn-outline-secondary:hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}.btn-outline-secondary.selected.hover,.btn-outline-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-outline-secondary:not(:disabled):not(.disabled):active,.btn-outline-secondary:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.dropdown-toggle{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}.btn-outline-secondary.selected:not(:disabled):not(.disabled):active,.btn-outline-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-outline-secondary.disabled,.btn-outline-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}.btn-invisible-secondary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-secondary,.btn-invisible-secondary.focus,.btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}.btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-invisible-secondary.hover,.btn-invisible-secondary:hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}.btn-invisible-secondary.selected.hover,.btn-invisible-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-invisible-secondary:not(:disabled):not(.disabled):active,.btn-invisible-secondary:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.dropdown-toggle{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}.btn-invisible-secondary.selected:not(:disabled):not(.disabled):active,.btn-invisible-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-invisible-secondary.disabled,.btn-invisible-secondary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}.btn-oval,.btn-icon{min-width:2rem;width:2rem}.btn-oval .glyph,.btn-icon .glyph{margin-right:0}.btn-oval{border-radius:6.25rem;width:2rem}.btn-icon-xs,.btn-icon-12{height:1rem;width:1rem;min-width:1rem;min-height:1rem}.btn-icon-s,.btn-icon-16{height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}.btn-icon-32{height:2rem;width:2rem;min-width:2rem;min-height:2rem}:host{display:inline-flex;height:2rem;font-size:0.875rem;font-weight:400;min-width:2rem}:host .link-button{display:inline-flex;position:relative;width:100%;padding:0 0.25rem 0 0;align-items:center;justify-content:center;background-color:transparent;color:var(--theme-color-primary);cursor:pointer;text-decoration:none}:host .link-button .link{display:block;position:relative;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):hover{color:var(--theme-color-dynamic--hover)}:host .link-button:not(.disabled):not(:disabled):hover .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):active,:host .link-button:not(.disabled):not(:disabled).active{color:var(--theme-color-dynamic--active)}:host .link-button:not(.disabled):not(:disabled):active .link,:host .link-button:not(.disabled):not(:disabled).active .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button.disabled{cursor:default;color:var(--theme-color-weak-text)}:host .link-button a{all:unset}:host :focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";const n=t;const i=class{constructor(o){e(this,o);this.disabled=false;this.url=undefined;this.target="_self"}render(){return o(r,{key:"a5d4157783cfbae867203855b423e5b1cfbec480"},o("a",{key:"bd2a490f6b87fc512b3bbc9a2ba19bf66897ecfb",title:this.url,tabindex:"0",class:{"link-button":true,disabled:this.disabled},href:this.disabled?undefined:this.url,target:this.target},o("ix-icon",{key:"1ca10d4f2a78bde1ed47ef1afd017de9b39920c7",class:"icon",name:"chevron-right-small",size:"16"}),o("div",{key:"e5bd4edc164919a86dcba6e26e6b5dcf2c0bc577",class:{link:true,disabled:this.disabled}},o("slot",{key:"72c88d1ede7884b89dfc055e61fe9fc23d76f808"}))))}};i.style=n;export{i as ix_link_button};
+//# sourceMappingURL=p-b247d124.entry.js.map

package/dist/siemens-ix/p-b53aa733.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e,H as o,g as i}from"./p-f87cd962.js";import{c as s}from"./p-e898862b.js";import{m as a}from"./p-ce563a48.js";import{m as r}from"./p-c146af8e.js";import"./p-c4749812.js";const h=':host{position:relative;display:block;cursor:pointer;height:var(--ix-menu-item-height, 3rem);min-height:var(--ix-menu-item-height, 3rem);max-height:var(--ix-menu-item-height, 3rem)}:host .tab{all:unset;box-sizing:border-box;display:flex;position:relative;align-items:center;height:var(--ix-menu-item-height, 3rem);width:100%;z-index:500;padding-left:0.875rem}:host .tab:not(.disabled):not(:disabled).hover,:host .tab:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}:host .tab:not(.disabled):not(:disabled).active,:host .tab:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}:host .tab-icon{color:var(--theme-nav-item-primary-icon--color);position:relative;pointer-events:none}:host .tab:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:-1px}:host .notification{display:inline-flex;position:absolute;top:0.25rem;left:1.5rem}:host .notification .pill{display:inline-flex;justify-content:center;align-items:center;height:0.5rem;min-width:1rem;position:relative;border-radius:6.25rem;background-color:var(--theme-color-primary);font-size:0.75rem;font-weight:bold;line-height:1;font-family:Siemens Sans, Arial, sans-serif;color:var(--theme-color-primary--contrast);padding:0.25rem}:host .tab-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-nav-item-primary--color);margin:0 1rem 0 1.25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}:host(.active) .tab,:host(.selected) .tab{background-color:var(--theme-nav-item-primary--background--selected)}:host(.active) .tab::before,:host(.selected) .tab::before{content:"";background-color:var(--theme-nav-item-primary--border-color--selected);height:var(--ix-menu-item-height, 3rem);width:0.25rem;left:0;position:absolute}:host(.active) .tab>.glyph,:host(.selected) .tab>.glyph{color:var(--theme-nav-item-primary-icon--color--selected)}:host(.disabled){color:var(--theme-color-weak-text);pointer-events:none;cursor:default}:host(.disabled) .tab>.tab-icon{color:var(--theme-color-weak-text)}:host(.disabled) .tab-text{color:var(--theme-color-weak-text)}:host(.bottom-tab),:host([slot=bottom]){min-height:2.25rem;height:2.25rem;max-height:2.25rem}:host(.bottom-tab) .tab,:host([slot=bottom]) .tab{height:2.25rem}:host(.bottom-tab) .tab::before,:host([slot=bottom]) .tab::before{height:2.25rem;background-color:transparent}:host(.bottom-tab).active:hover,:host(.bottom-tab).selected:hover,:host([slot=bottom]).active:hover,:host([slot=bottom]).selected:hover{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.bottom-tab).active:active,:host(.bottom-tab).selected:active,:host([slot=bottom]).active:active,:host([slot=bottom]).selected:active{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.bottom-tab.active) .tab,:host(.bottom-tab.selected) .tab,:host(.active[slot=bottom]) .tab,:host(.selected[slot=bottom]) .tab{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.tab-nested) .tab{flex-direction:row;padding-left:1.375rem}:host(.tab-nested) .tab .notification{position:relative;top:0;left:0;padding-left:0.5rem}:host(.tab-nested) .tab .tab-icon{padding-left:0.5rem;padding-right:0.5rem}:host(.tab-nested) .tab .tab-text{margin-left:0.5rem}:host(.tab-nested) .tab::before{display:none}';const n=h;const c=class{constructor(e){t(this,e);this.buttonRef=a();this.isHostedInsideCategory=false;this.observer=s((()=>{this.setTooltip()}));this.label=undefined;this.home=false;this.bottom=false;this.tabIcon=undefined;this.icon=undefined;this.notifications=undefined;this.active=false;this.disabled=false;this.isCategory=false;this.tooltip=undefined;this.menuExpanded=false}componentWillLoad(){this.isHostedInsideCategory=!!this.hostElement.closest("ix-menu-category");this.onIconChange();this.onTabIconChange();this.menuExpanded=r.nativeElement.expand;this.menuExpandedDisposer=r.expandChange.on((t=>this.menuExpanded=t))}componentWillRender(){this.setTooltip()}setTooltip(){var t;this.tooltip=(t=this.label)!==null&&t!==void 0?t:this.hostElement.textContent}connectedCallback(){this.observer.observe(this.hostElement,{subtree:true,childList:true,characterData:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}if(this.menuExpandedDisposer){this.menuExpandedDisposer.dispose()}}onIconChange(){if(!this.isHostedInsideCategory&&!this.hostElement.icon&&!this.hostElement.tabIcon){this.icon="document"}}onTabIconChange(){if(!this.isHostedInsideCategory&&!this.hostElement.icon&&!this.hostElement.tabIcon){this.tabIcon="document"}}render(){var t;let i={};if(this.home){i={slot:"home"}}if(this.bottom){i={slot:"bottom"}}return e(o,Object.assign({key:"cfaec510f5f9c13dd6ddc93c9cee91ff60032dd9",class:{disabled:this.disabled,"home-tab":this.home,"bottom-tab":this.bottom,active:this.active,"tab-nested":this.isHostedInsideCategory}},i),e("button",{key:"fd607d3ce61a36f8cd3089442490a71164f35123",class:"tab",tabIndex:this.disabled?-1:0,role:"listitem",ref:this.buttonRef},(this.icon||this.tabIcon)&&e("ix-icon",{key:"20de89f6bed4e0dcf41322dd7f15006db51e0edb",class:"tab-icon",name:(t=this.icon)!==null&&t!==void 0?t:this.tabIcon}),this.notifications?e("div",{class:"notification"},e("div",{class:"pill"},this.notifications)):null,e("span",{key:"825452aa535d6f79c1d3b836655b96bfecc8fc76",class:"tab-text text-default"},this.label,e("slot",{key:"20fafb4552c98352838983c97f826dba4d789674"}))),!this.isCategory&&!this.isHostedInsideCategory&&!this.menuExpanded&&e("ix-tooltip",{key:"0461a1bc372efb2e15d3e6bebc98a32ce2ab8261",for:this.buttonRef.waitForCurrent(),placement:"right",showDelay:1e3},this.tooltip))}get hostElement(){return i(this)}static get watchers(){return{icon:["onIconChange"],tabIcon:["onTabIconChange"]}}};c.style=n;export{c as ix_menu_item};
+//# sourceMappingURL=p-b53aa733.entry.js.map

package/dist/siemens-ix/p-b53aa733.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["menuItemCss","IxMenuItemStyle0","MenuItem","this","buttonRef","makeRef","isHostedInsideCategory","observer","createMutationObserver","setTooltip","componentWillLoad","hostElement","closest","onIconChange","onTabIconChange","menuExpanded","menuController","nativeElement","expand","menuExpandedDisposer","expandChange","on","componentWillRender","tooltip","_a","label","textContent","connectedCallback","observe","subtree","childList","characterData","disconnectedCallback","disconnect","dispose","icon","tabIcon","render","extendedAttributes","home","slot","bottom","h","Host","Object","assign","key","class","disabled","active","tabIndex","role","ref","name","notifications","isCategory","for","waitForCurrent","placement","showDelay"],"sources":["src/components/menu-item/menu-item.scss?tag=ix-menu-item&encapsulation=shadow","src/components/menu-item/menu-item.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 'mixins/hover';\n@import 'mixins/text-truncation';\n\n$menuItemHeight: 3rem;\n$menuItemPadding: 0.875rem;\n\n:host {\n  position: relative;\n  display: block;\n  cursor: pointer;\n\n  height: var(--ix-menu-item-height, $menuItemHeight);\n  min-height: var(--ix-menu-item-height, $menuItemHeight);\n  max-height: var(--ix-menu-item-height, $menuItemHeight);\n\n  .tab {\n    all: unset;\n    box-sizing: border-box;\n    display: flex;\n    position: relative;\n    align-items: center;\n    height: var(--ix-menu-item-height, $menuItemHeight);\n    width: calc(100%);\n    z-index: 500;\n    padding-left: $menuItemPadding;\n\n    @include ghost-hover-pressed;\n  }\n\n  .tab-icon {\n    color: var(--theme-nav-item-primary-icon--color);\n    position: relative;\n    pointer-events: none;\n  }\n\n  .tab:focus-visible {\n    outline: 1px solid var(--theme-color-focus-bdr);\n    outline-offset: -1px;\n  }\n\n  .notification {\n    display: inline-flex;\n    position: absolute;\n    top: 0.25rem;\n    left: 1.5rem;\n\n    .pill {\n      display: inline-flex;\n      justify-content: center;\n      align-items: center;\n      height: 0.5rem;\n      min-width: 1rem;\n      position: relative;\n      border-radius: 6.25rem;\n      background-color: var(--theme-color-primary);\n      font-size: 0.75rem;\n      font-weight: bold;\n      line-height: 1;\n      font-family: Siemens Sans, Arial, sans-serif;\n      color: var(--theme-color-primary--contrast);\n      padding: $tiny-space;\n    }\n  }\n\n  .tab-text {\n    @include ellipsis;\n    color: var(--theme-nav-item-primary--color);\n    margin: 0 1rem 0 1.25rem;\n    user-select: none;\n    width: 100%;\n  }\n}\n\n:host(.active),\n:host(.selected) {\n  .tab {\n    background-color: var(--theme-nav-item-primary--background--selected);\n  }\n\n  .tab::before {\n    content: '';\n    background-color: var(--theme-nav-item-primary--border-color--selected);\n    height: var(--ix-menu-item-height, $menuItemHeight);\n    width: 0.25rem;\n    left: 0;\n    position: absolute;\n  }\n\n  .tab > .glyph {\n    color: var(--theme-nav-item-primary-icon--color--selected);\n  }\n}\n\n:host(.disabled) {\n  color: var(--theme-color-weak-text);\n  pointer-events: none;\n  cursor: default;\n\n  .tab > .tab-icon {\n    color: var(--theme-color-weak-text);\n  }\n\n  .tab-text {\n    color: var(--theme-color-weak-text);\n  }\n}\n\n:host(.bottom-tab),\n:host([slot='bottom']) {\n  $bottom-height: 2.25rem;\n\n  min-height: $bottom-height;\n  height: $bottom-height;\n  max-height: $bottom-height;\n\n  .tab {\n    height: $bottom-height;\n  }\n\n  .tab::before {\n    height: $bottom-height;\n    background-color: transparent;\n  }\n\n  &.active,\n  &.selected {\n    &:hover {\n      background-color: var(--theme-nav-item-secondary--background--selected);\n    }\n\n    &:active {\n      background-color: var(--theme-nav-item-secondary--background--selected);\n    }\n  }\n}\n\n:host(.bottom-tab.active),\n:host(.bottom-tab.selected),\n:host(.active[slot='bottom']),\n:host(.selected[slot='bottom']) {\n  .tab {\n    background-color: var(--theme-nav-item-secondary--background--selected);\n  }\n}\n\n:host(.tab-nested) {\n  .tab {\n    flex-direction: row;\n    padding-left: calc(0.5rem + $menuItemPadding);\n\n    .notification {\n      position: relative;\n      top: 0;\n      left: 0;\n      padding-left: 0.5rem;\n    }\n\n    .tab-icon {\n      padding-left: 0.5rem;\n      padding-right: 0.5rem;\n    }\n\n    .tab-text {\n      margin-left: 0.5rem;\n    }\n\n    &::before {\n      display: none;\n    }\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 { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { makeRef } from '../utils/make-ref';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { Disposable } from '../utils/typed-event';\n\n/**\n * @slot menu-item-label Custom label\n */\n@Component({\n  tag: 'ix-menu-item',\n  styleUrl: 'menu-item.scss',\n  shadow: true,\n})\nexport class MenuItem {\n  /**\n   * Label of the menu item. Will also be used as tooltip text\n   *\n   * @since 2.2.0\n   */\n  @Prop() label?: string;\n\n  /**\n   * Move the Tab to a top position.\n   */\n  @Prop() home = false;\n\n  /**\n   * Caution: this is no longer working. Please use slot=\"bottom\" instead.\n   *\n   * Place tab on bottom\n   */\n  @Prop() bottom = false;\n\n  /**\n   * Name of the icon you want to display. Icon names can be resolved from the documentation @link https://ix.siemens.io/docs/icon-library/icons\n   *\n   * @deprecated since 2.0.0 use `icon` property. Will be removed in 3.0.0\n   */\n  @Prop({ mutable: true }) tabIcon?: string;\n\n  /**\n   * Name of the icon you want to display. Icon names can be resolved from the documentation @link https://ix.siemens.io/docs/icon-library/icons\n   */\n  @Prop({ mutable: true }) icon?: string;\n\n  /**\n   * Show notification count on tab\n   */\n  @Prop() notifications?: number;\n\n  /**\n   * State to display active\n   */\n  @Prop() active: boolean = false;\n\n  /**\n   * Disable tab and remove event handlers\n   */\n  @Prop() disabled: boolean = false;\n\n  /** @internal */\n  @Prop() isCategory: boolean = false;\n\n  @Element() hostElement!: HTMLIxMenuItemElement;\n\n  @State() tooltip?: string;\n  @State() menuExpanded: boolean = false;\n\n  private buttonRef = makeRef<HTMLButtonElement>();\n  private isHostedInsideCategory = false;\n  private menuExpandedDisposer: Disposable;\n\n  private observer: MutationObserver = createMutationObserver(() => {\n    this.setTooltip();\n  });\n\n  componentWillLoad() {\n    this.isHostedInsideCategory =\n      !!this.hostElement.closest('ix-menu-category');\n\n    this.onIconChange();\n    this.onTabIconChange();\n\n    this.menuExpanded = menuController.nativeElement.expand;\n    this.menuExpandedDisposer = menuController.expandChange.on(\n      (expand) => (this.menuExpanded = expand)\n    );\n  }\n\n  componentWillRender() {\n    this.setTooltip();\n  }\n\n  setTooltip() {\n    this.tooltip = this.label ?? this.hostElement.textContent;\n  }\n\n  connectedCallback() {\n    this.observer.observe(this.hostElement, {\n      subtree: true,\n      childList: true,\n      characterData: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n\n    if (this.menuExpandedDisposer) {\n      this.menuExpandedDisposer.dispose();\n    }\n  }\n\n  @Watch('icon')\n  onIconChange() {\n    if (\n      !this.isHostedInsideCategory &&\n      !this.hostElement.icon &&\n      !this.hostElement.tabIcon\n    ) {\n      this.icon = 'document';\n    }\n  }\n\n  @Watch('tabIcon')\n  onTabIconChange() {\n    if (\n      !this.isHostedInsideCategory &&\n      !this.hostElement.icon &&\n      !this.hostElement.tabIcon\n    ) {\n      this.tabIcon = 'document';\n    }\n  }\n\n  render() {\n    let extendedAttributes = {};\n    if (this.home) {\n      extendedAttributes = {\n        slot: 'home',\n      };\n    }\n\n    if (this.bottom) {\n      extendedAttributes = {\n        slot: 'bottom',\n      };\n    }\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          'home-tab': this.home,\n          'bottom-tab': this.bottom,\n          active: this.active,\n          'tab-nested': this.isHostedInsideCategory,\n        }}\n        {...extendedAttributes}\n      >\n        <button\n          class=\"tab\"\n          tabIndex={this.disabled ? -1 : 0}\n          role=\"listitem\"\n          ref={this.buttonRef}\n        >\n          {(this.icon || this.tabIcon) && (\n            <ix-icon\n              class={'tab-icon'}\n              name={this.icon ?? this.tabIcon}\n            ></ix-icon>\n          )}\n          {this.notifications ? (\n            <div class=\"notification\">\n              <div class=\"pill\">{this.notifications}</div>\n            </div>\n          ) : null}\n          <span class=\"tab-text text-default\">\n            {this.label}\n            <slot></slot>\n          </span>\n        </button>\n        {!this.isCategory &&\n          !this.isHostedInsideCategory &&\n          !this.menuExpanded && (\n            <ix-tooltip\n              for={this.buttonRef.waitForCurrent()}\n              placement={'right'}\n              showDelay={1000}\n            >\n              {this.tooltip}\n            </ix-tooltip>\n          )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"6LAAA,MAAMA,EAAc,wzGACpB,MAAAC,EAAeD,E,MCsBFE,EAAQ,M,yBAuDXC,KAAAC,UAAYC,IACZF,KAAAG,uBAAyB,MAGzBH,KAAAI,SAA6BC,GAAuB,KAC1DL,KAAKM,YAAY,I,+BAjDJ,M,YAOE,M,oFAsBS,M,cAKE,M,gBAGE,M,yCAKG,K,CAUjC,iBAAAC,GACEP,KAAKG,yBACDH,KAAKQ,YAAYC,QAAQ,oBAE7BT,KAAKU,eACLV,KAAKW,kBAELX,KAAKY,aAAeC,EAAeC,cAAcC,OACjDf,KAAKgB,qBAAuBH,EAAeI,aAAaC,IACrDH,GAAYf,KAAKY,aAAeG,G,CAIrC,mBAAAI,GACEnB,KAAKM,Y,CAGP,UAAAA,G,MACEN,KAAKoB,SAAUC,EAAArB,KAAKsB,SAAK,MAAAD,SAAA,EAAAA,EAAIrB,KAAKQ,YAAYe,W,CAGhD,iBAAAC,GACExB,KAAKI,SAASqB,QAAQzB,KAAKQ,YAAa,CACtCkB,QAAS,KACTC,UAAW,KACXC,cAAe,M,CAInB,oBAAAC,GACE,GAAI7B,KAAKI,SAAU,CACjBJ,KAAKI,SAAS0B,Y,CAGhB,GAAI9B,KAAKgB,qBAAsB,CAC7BhB,KAAKgB,qBAAqBe,S,EAK9B,YAAArB,GACE,IACGV,KAAKG,yBACLH,KAAKQ,YAAYwB,OACjBhC,KAAKQ,YAAYyB,QAClB,CACAjC,KAAKgC,KAAO,U,EAKhB,eAAArB,GACE,IACGX,KAAKG,yBACLH,KAAKQ,YAAYwB,OACjBhC,KAAKQ,YAAYyB,QAClB,CACAjC,KAAKiC,QAAU,U,EAInB,MAAAC,G,MACE,IAAIC,EAAqB,GACzB,GAAInC,KAAKoC,KAAM,CACbD,EAAqB,CACnBE,KAAM,O,CAIV,GAAIrC,KAAKsC,OAAQ,CACfH,EAAqB,CACnBE,KAAM,S,CAGV,OACEE,EAACC,EAAIC,OAAAC,OAAA,CAAAC,IAAA,2CACHC,MAAO,CACLC,SAAU7C,KAAK6C,SACf,WAAY7C,KAAKoC,KACjB,aAAcpC,KAAKsC,OACnBQ,OAAQ9C,KAAK8C,OACb,aAAc9C,KAAKG,yBAEjBgC,GAEJI,EAAA,UAAAI,IAAA,2CACEC,MAAM,MACNG,SAAU/C,KAAK6C,UAAY,EAAI,EAC/BG,KAAK,WACLC,IAAKjD,KAAKC,YAERD,KAAKgC,MAAQhC,KAAKiC,UAClBM,EAAA,WAAAI,IAAA,2CACEC,MAAO,WACPM,MAAM7B,EAAArB,KAAKgC,QAAI,MAAAX,SAAA,EAAAA,EAAIrB,KAAKiC,UAG3BjC,KAAKmD,cACJZ,EAAA,OAAKK,MAAM,gBACTL,EAAA,OAAKK,MAAM,QAAQ5C,KAAKmD,gBAExB,KACJZ,EAAA,QAAAI,IAAA,2CAAMC,MAAM,yBACT5C,KAAKsB,MACNiB,EAAA,QAAAI,IAAA,gDAGF3C,KAAKoD,aACJpD,KAAKG,yBACLH,KAAKY,cACJ2B,EAAA,cAAAI,IAAA,2CACEU,IAAKrD,KAAKC,UAAUqD,iBACpBC,UAAW,QACXC,UAAW,KAEVxD,KAAKoB,S"}

package/dist/siemens-ix/{p-b804b8c5.entry.js → p-b6a11e17.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,H as a}from"./p-f87cd962.js";const l=":host(.keyValue){display:flex;flex-direction:row;align-items:center;gap:1rem}:host(.keyValue) .keyValue__icon{padding:0.25rem 0}:host(.keyValue) .keyValue__content{display:flex;flex-grow:1;align-items:flex-start}:host(.keyValue) .keyValue__content,:host(.keyValue) .keyValue__content .content__label,:host(.keyValue) .keyValue__content .content__value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}:host(.keyValue) .keyValue__content .content__label{color:var(--theme-color-soft-text)}:host(.keyValue) .keyValue__content .content__value{width:100%}:host(.keyValue.keyValue--column){padding:0.5rem 0;border-bottom:1px solid var(--theme-color-soft-bdr)}:host(.keyValue.keyValue--column) .keyValue__content{flex-direction:column}:host(.keyValue.keyValue--column) .keyValue__content .content__label,:host(.keyValue.keyValue--column) .keyValue__content .content__value:not(.has-customValue){padding:2px 0}:host(.keyValue.keyValue--row){padding:0.25rem 0}:host(.keyValue.keyValue--row) .keyValue__content{flex-direction:row;gap:1rem;align-items:center}:host(.keyValue.keyValue--row) .keyValue__content .content__label,:host(.keyValue.keyValue--row) .keyValue__content .content__value:not(.has-customValue){padding:6px 0}:host(.keyValue.keyValue--row) .keyValue__content .content__label{min-width:8rem}";const o=l;const n=class{constructor(t){e(this,t);this.icon=undefined;this.label=undefined;this.labelPosition="top";this.value=undefined}render(){return t(a,{key:"8431e1a89798f462874f9357d36bd0535c19da6c",class:`keyValue keyValue--${this.labelPosition==="top"?"column":"row"}`},this.icon&&t("ix-icon",{key:"193efc04890c932b8f5c0d075539dec5f49dc37c",name:this.icon,size:"24",class:"keyValue__icon"}),t("div",{key:"8fe5d19dd71dab858d1b70689649e9c50ba610a2",class:"keyValue__content"},t("div",{key:"d8b2eee83899e12fe88afb3e453ca1a00560a200",class:"content__label"},this.label),t("div",{key:"b0aef82462c4dbdd4cc0f0b878b5684f7154cb8f",class:{content__value:true,"has-customValue":this.value===undefined}},this.value!==undefined?this.value:t("slot",{name:"custom-value"}))))}};n.style=o;export{n as ix_key_value};
-//# sourceMappingURL=p-b804b8c5.entry.js.map
+import{r as e,h as t,H as a}from"./p-f87cd962.js";const l=":host(.keyValue){display:flex;flex-direction:row;align-items:center;gap:1rem}:host(.keyValue) .keyValue__icon{padding:0.25rem 0}:host(.keyValue) .keyValue__content{display:flex;flex-grow:1;align-items:flex-start}:host(.keyValue) .keyValue__content,:host(.keyValue) .keyValue__content .content__label,:host(.keyValue) .keyValue__content .content__value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}:host(.keyValue) .keyValue__content .content__label{color:var(--theme-color-soft-text)}:host(.keyValue) .keyValue__content .content__value{width:100%}:host(.keyValue.keyValue--column){padding:0.5rem 0;border-bottom:1px solid var(--theme-color-soft-bdr)}:host(.keyValue.keyValue--column) .keyValue__content{flex-direction:column}:host(.keyValue.keyValue--column) .keyValue__content .content__label,:host(.keyValue.keyValue--column) .keyValue__content .content__value:not(.has-customValue){padding:2px 0}:host(.keyValue.keyValue--row){padding:0.25rem 0}:host(.keyValue.keyValue--row) .keyValue__content{flex-direction:row;gap:1rem;align-items:center}:host(.keyValue.keyValue--row) .keyValue__content .content__label,:host(.keyValue.keyValue--row) .keyValue__content .content__value:not(.has-customValue){padding:6px 0}:host(.keyValue.keyValue--row) .keyValue__content .content__label{min-width:8rem}";const o=l;const n=class{constructor(t){e(this,t);this.icon=undefined;this.label=undefined;this.labelPosition="top";this.value=undefined}render(){return t(a,{key:"8b70abf3b47ceff1c1fe0806ba70db831b9273be",class:`keyValue keyValue--${this.labelPosition==="top"?"column":"row"}`},this.icon&&t("ix-icon",{key:"353b1d7f802f28dad6b2f6a8fed396d4a7aad21d",name:this.icon,size:"24",class:"keyValue__icon"}),t("div",{key:"4e13c0418cea7492216b6894322ae91ad732248e",class:"keyValue__content"},t("div",{key:"533bcfd4e5c474fc222ed782ac4d30a3ed1749b9",class:"content__label"},this.label),t("div",{key:"fc54a18806ece000ce2c8d039bf98b5fe406a013",class:{content__value:true,"has-customValue":this.value===undefined}},this.value!==undefined?this.value:t("slot",{name:"custom-value"}))))}};n.style=o;export{n as ix_key_value};
+//# sourceMappingURL=p-b6a11e17.entry.js.map

package/dist/siemens-ix/p-b9e66925.entry.js

@@ -0,0 +1,2 @@
+import{r as s,h as t,H as o}from"./p-f87cd962.js";const e=":host{display:block}";const l=e;const a=class{constructor(t){s(this,t);this.contentVisible=false}render(){return t(o,{key:"ae499b00da903e80a7cf53e15185d2a5bf9b3819"},this.contentVisible?t("slot",null):null)}};a.style=l;export{a as ix_flip_tile_content};
+//# sourceMappingURL=p-b9e66925.entry.js.map

package/dist/siemens-ix/{p-2908cacd.entry.js → p-b9f67de0.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as r,H as s,g as o}from"./p-f87cd962.js";import{c as i}from"./p-e898862b.js";const a=":host{display:block;position:relative;width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;min-width:2rem}: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 .steps{display:flex;height:100%}:host .steps.vertical{flex-direction:column}";const c=a;const h=class{constructor(r){t(this,r);this.stepSelected=e(this,"stepSelected",7);this.vertical=false;this.clickable=false;this.selectedIndex=0}getSteps(){return Array.from(this.hostElement.querySelectorAll("ix-workflow-step"))}updateSteps(){let t=this.getSteps();t.forEach(((e,r)=>{e.vertical=this.vertical;e.clickable=this.clickable;e.selected=this.selectedIndex===r;if(t.length===1){e.position="single";return}if(r===0){e.position="first"}else if(r===t.length-1){e.position="last"}else{e.position="undefined"}}))}onStepSelectionChanged(t){const e=t.detail;const r=this.getSteps();const s=r.findIndex((t=>t===e));const o=this.stepSelected.emit(s);if(o.defaultPrevented){return}r.forEach(((t,e)=>{t.selected=e===s}))}componentWillLoad(){this.updateSteps()}componentDidLoad(){this.observer=i((t=>{for(let e of t){if(e.type==="childList"){this.updateSteps()}}}));this.observer.observe(this.hostElement,{childList:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}componentDidRender(){this.updateSteps()}render(){return r(s,{key:"55b4e6010ba6bc751be94a8790a8dd12d58c9830"},r("div",{key:"f8186e2ef01beda230a9f41000ec82456f198ff1",class:{steps:true,vertical:this.vertical}},r("slot",{key:"1b2d632a8d0ba11a2425809aac3b6f31ce74588b"})))}get hostElement(){return o(this)}};h.style=c;export{h as ix_workflow_steps};
-//# sourceMappingURL=p-2908cacd.entry.js.map
+import{r as t,c as e,h as r,H as s,g as o}from"./p-f87cd962.js";import{c as i}from"./p-e898862b.js";const a=":host{display:block;position:relative;width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;min-width:2rem}: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 .steps{display:flex;height:100%}:host .steps.vertical{flex-direction:column}";const c=a;const h=class{constructor(r){t(this,r);this.stepSelected=e(this,"stepSelected",7);this.vertical=false;this.clickable=false;this.selectedIndex=0}getSteps(){return Array.from(this.hostElement.querySelectorAll("ix-workflow-step"))}updateSteps(){let t=this.getSteps();t.forEach(((e,r)=>{e.vertical=this.vertical;e.clickable=this.clickable;e.selected=this.selectedIndex===r;if(t.length===1){e.position="single";return}if(r===0){e.position="first"}else if(r===t.length-1){e.position="last"}else{e.position="undefined"}}))}onStepSelectionChanged(t){const e=t.detail;const r=this.getSteps();const s=r.findIndex((t=>t===e));const o=this.stepSelected.emit(s);if(o.defaultPrevented){return}r.forEach(((t,e)=>{t.selected=e===s}))}componentWillLoad(){this.updateSteps()}componentDidLoad(){this.observer=i((t=>{for(let e of t){if(e.type==="childList"){this.updateSteps()}}}));this.observer.observe(this.hostElement,{childList:true})}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}componentDidRender(){this.updateSteps()}render(){return r(s,{key:"5ea659c84398f6a69e26ec364d5ee4a25c55aca0"},r("div",{key:"4b7f09b4d9952c4f3f88dc74a612560076aad412",class:{steps:true,vertical:this.vertical}},r("slot",{key:"95106389f7cbb0708a2904b8f407156e9470a380"})))}get hostElement(){return o(this)}};h.style=c;export{h as ix_workflow_steps};
+//# sourceMappingURL=p-b9f67de0.entry.js.map