@siemens/ix 0.0.0-pr-1974-20250624072317 → 0.0.0-pr-1974-20250627115746

package/dist/siemens-ix/p-7b455f16.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["timePickerCss","LUXON_FORMAT_PATTERNS","hours","minutes","seconds","milliseconds","HOUR_INTERVAL_DEFAULT","MINUTE_INTERVAL_DEFAULT","SECOND_INTERVAL_DEFAULT","MILLISECOND_INTERVAL_DEFAULT","CONFIRM_BUTTON_DEFAULT","HEADER_DEFAULT","FORMATTED_TIME_EMPTY","hour","minute","second","millisecond","TimePicker","constructor","hostRef","this","format","corners","standaloneAppearance","dateTimePickerAppearance","showHour","showMinutes","showSeconds","hideHeader","hourInterval","minuteInterval","secondInterval","millisecondInterval","time","DateTime","now","toFormat","textSelectTime","i18nConfirmTime","textTime","i18nHeader","i18nHourColumnHeader","i18nMinuteColumnHeader","i18nSecondColumnHeader","i18nMillisecondColumnHeader","formattedTime","timePickerDescriptors","isUnitFocused","focusedUnit","focusedValue","focusScrollAlignment","watchFormatIntervalPropHandler","newValue","initPicker","updateScrollPositions","watchHourIntervalPropHandler","Number","isInteger","timeRef","setTimePickerDescriptors","printIntervalError","watchMinuteIntervalPropHandler","watchSecondIntervalPropHandler","watchMillisecondIntervalPropHandler","intervalName","value","console","error","watchTimePropHandler","timeFormat","fromFormat","isValid","Error","_time","getCurrentTime","_a","onTimeChange","formattedTimeOld","setTimeRef","getFormattedTime","componentWillLoad","invalidReason","invalidExplanation","setInitialFocusedValueAndUnit","componentDidLoad","setupVisibilityObserver","componentDidRender","elementContainer","getElementContainer","elementList","getElementList","focus","preventScroll","isElementVisible","scrollIntoView","block","scrollTop","disconnectedCallback","visibilityObserver","disconnect","handleKeyDown","event","shouldPreventDefault","newValueInterval","key","updateFocusedValue","moveFocusToAdjacentUnit","select","preventDefault","onUnitCellBlur","onUnitCellFocus","unit","hostElement","shadowRoot","querySelector","number","element","container","elementRect","getBoundingClientRect","containerRect","top","bottom","numberArray","getNumberArrayForUnit","maxValue","length","minValue","direction","currentUnitIndex","findIndex","d","newUnitIndex","newUnit","selectedValue","firstVisibleDescriptor","find","descriptor","hidden","isValidSelection","includes","dropdownElement","tagName","parentElement","MutationObserver","mutations","mutationObserverCallback","observe","attributes","attributeFilter","mutation","type","dropdown","target","classList","contains","elementsReady","areElementsRendered","elementLists","querySelectorAll","Array","from","some","list","offsetHeight","undefined","timeUpdate","endOf","get","set","changeTimeReference","newTimeRef","currentHour","plus","minus","timeChange","emit","isFormat12Hour","cleanFormat","inQuote","i","char","test","uses12HourFormat","hourNumbers","minuteNumbers","secondNumbers","millisecondsNumbers","Math","ceil","_","filter","header","item","isSelected","String","Object","assign","elementListScrollToTop","scrollBehaviour","elementListHeight","clientHeight","elementContainerHeight","scrollPositionOffset","scrollPosition","offsetTop","scrollTo","behavior","unitKey","formatUnitValue","toString","padStart","getColumnSeparator","currentIndex","nextUnit","getElementContainerTabIndex","descriptorUnit","getConfirmButtonText","getHeaderText","render","h","Host","timePickerAppearance","hasFooter","class","slot","map","index","columns","title","tabIndex","selected","onClick","onFocus","onBlur","tabindex","role","footer","timeSelect","__decorate","OnListener","prototype"],"sources":["src/components/time-picker/time-picker.scss?tag=ix-time-picker&encapsulation=shadow","src/components/time-picker/time-picker.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/shadow-dom/component';\n@import 'mixins/input';\n\n@include form;\n\n:host {\n  @include ix-component;\n  @import 'legacy/components/forms';\n\n  display: block;\n  position: relative;\n  width: fit-content;\n\n  .standaloneAppearance {\n    box-shadow: none;\n  }\n\n  .hidden {\n    display: none;\n  }\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: $large-control-height;\n  }\n\n  .clock {\n    display: flex;\n    justify-content: center;\n    align-items: start;\n\n    .flex {\n      display: flex;\n      height: 100%;\n      align-items: start;\n\n      .columns {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: space-around;\n        margin-top: 1px;\n\n        .column-header {\n          height: 2.5rem;\n          width: 2.5rem;\n          line-height: 2.5rem;\n          text-align: center;\n          color: var(--theme-color-soft-text);\n          text-overflow: ellipsis;\n          overflow: hidden;\n          white-space: nowrap;\n        }\n      }\n\n      .column-seperator {\n        display: flex;\n        align-items: center;\n        margin: 0 0.125rem;\n        min-height: 100%;\n        margin-top: 3.25rem;\n      }\n    }\n\n    .element-list {\n      list-style-type: none;\n      overflow: auto;\n      max-height: 15.375rem;\n      padding-top: 0.125rem;\n\n      button {\n        all: unset;\n      }\n\n      .element-container {\n        width: 2.375rem;\n        height: 2.375rem;\n        margin: 0.125rem;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        cursor: pointer;\n        color: var(--theme-color-primary);\n\n        &:hover {\n          background-color: var(--theme-datepicker-day--background--hover);\n        }\n\n        &:focus {\n          outline: 1px solid var(--theme-color-focus-bdr);\n          outline-offset: 1px;\n        }\n      }\n\n      .selected {\n        background-color: var(--theme-datepicker-day--background--selected);\n        color: var(--theme-datepicker-day--color--selected);\n\n        &:hover {\n          background-color: var(\n            --theme-datepicker-day--background--selected-hover\n          );\n        }\n      }\n\n      .element-list-padding {\n        width: 2.5rem;\n        height: 12.563rem;\n        min-height: 12.563rem;\n      }\n    }\n\n    div.element-list {\n      scrollbar-width: none;\n      -ms-overflow-style: none;\n\n      &::-webkit-scrollbar {\n        display: none;\n      }\n    }\n  }\n\n  .footer {\n    display: flex;\n    justify-content: space-between;\n    gap: 0.5rem;\n    flex-wrap: wrap;\n\n    .confirm-button {\n      margin-left: auto;\n    }\n\n    &--compact {\n      flex-direction: column;\n      align-items: center;\n\n      .confirm-button {\n        margin-left: initial;\n      }\n    }\n\n    .time-ref-buttons {\n      &--datetime-picker-appearance {\n        margin-left: auto;\n      }\n\n      button {\n        all: unset;\n        width: 2.625rem;\n        height: 1.875rem;\n        text-align: center;\n        border: 1px solid var(--theme-color-primary);\n        color: var(--theme-color-primary);\n        background-color: var(--theme-color-secondary);\n        font-weight: 700;\n\n        &:focus {\n          outline: 1px solid var(--theme-color-focus-bdr);\n          outline-offset: var(--theme-btn--focus--outline-offset);\n        }\n\n        &:hover {\n          cursor: pointer;\n          background-color: var(--theme-color-secondary-hover);\n          border-color: var(--theme-btn-primary--background--hover);\n        }\n\n        &.selected {\n          color: var(--theme-color-secondary);\n          background-color: var(--theme-btn-primary--background);\n\n          &:hover {\n            background-color: var(--theme-btn-primary--background--hover);\n            border-color: var(--theme-btn-primary--background--hover);\n          }\n        }\n      }\n    }\n  }\n\n  .default-space {\n    margin-left: $default-space;\n  }\n\n  .text-align {\n    text-align: center;\n  }\n\n  .hidden {\n    display: none;\n  }\n\n  .time-reference {\n    margin-top: 0.5rem;\n    margin-bottom: 0.5rem;\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  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { DateTime } from 'luxon';\nimport { DateTimeCardCorners } from '../date-time-card/date-time-card';\nimport { OnListener } from '../utils/listener';\n\nexport type TimePickerCorners = DateTimeCardCorners;\n\ntype TimePickerDescriptorUnit = 'hour' | 'minute' | 'second' | 'millisecond';\n\ninterface TimePickerDescriptor {\n  unit: TimePickerDescriptorUnit;\n  header: string;\n  hidden: boolean;\n  numberArray: number[];\n}\n\ninterface TimeOutputFormat {\n  hour: string;\n  minute: string;\n  second: string;\n  millisecond: string;\n}\n\nconst LUXON_FORMAT_PATTERNS = {\n  // h, hh, H, HH and various time formats that include hours\n  hours: /\\b[Hh]\\b|HH|hh|H{3,4}|h{3,4}|t|tt|ttt|tttt|T|TT|TTT|TTTT/,\n  // m, mm and time formats that include minutes\n  minutes: /\\bm\\b|mm|t|tt|ttt|tttt|T|TT|TTT|TTTT/,\n  // s, ss and time formats that include seconds\n  seconds: /\\bs\\b|ss|tt|ttt|tttt|TT|TTT|TTTT/,\n  // S, SSS (milliseconds), u/uu/uuu (fractional seconds), x/X (timestamps)\n  milliseconds: /\\bS\\b|SSS|u|uu|uuu/,\n};\n\nconst HOUR_INTERVAL_DEFAULT = 1;\nconst MINUTE_INTERVAL_DEFAULT = 1;\nconst SECOND_INTERVAL_DEFAULT = 1;\nconst MILLISECOND_INTERVAL_DEFAULT = 100;\n\nconst CONFIRM_BUTTON_DEFAULT = 'Confirm';\nconst HEADER_DEFAULT = 'Time';\n\nconst FORMATTED_TIME_EMPTY: TimeOutputFormat = {\n  hour: '',\n  minute: '',\n  second: '',\n  millisecond: '',\n};\n\n@Component({\n  tag: 'ix-time-picker',\n  styleUrl: 'time-picker.scss',\n  shadow: true,\n})\nexport class TimePicker {\n  @Element() hostElement!: HTMLIxTimePickerElement;\n\n  /**\n   * Format of time string\n   * See {@link \"https://moment.github.io/luxon/#/formatting?id=table-of-tokens\"} for all available tokens.\n   * Note: Formats that combine date and time (like f or F) are not supported. Timestamp tokens x and X are not supported either.\n   */\n  @Prop() format: string = 'TT';\n  @Watch('format')\n  watchFormatIntervalPropHandler(newValue: string) {\n    if (!newValue) {\n      return;\n    }\n\n    this.initPicker();\n    this.updateScrollPositions();\n  }\n\n  /**\n   * Corner style\n   */\n  @Prop() corners: TimePickerCorners = 'rounded';\n\n  /**\n   * Controls the visual presentation and styling of the component when it is displayed as a standalone element\n   */\n  @Prop() standaloneAppearance: boolean = true;\n\n  /**\n   * @internal Temporary prop needed until datetime-picker is reworked for new design\n   */\n  @Prop() dateTimePickerAppearance: boolean = false;\n\n  /**\n   * Show hour input\n   *\n   * @deprecated This is now determined by the format that is used. Will be removed in 4.0.0\n   */\n  @Prop() showHour = true;\n\n  /**\n   * Show minutes input\n   *\n   * @deprecated This is now determined by the format that is used. Will be removed in 4.0.0\n   */\n  @Prop() showMinutes = true;\n\n  /**\n   * Show seconds input\n   *\n   * @deprecated This is now determined by the format that is used. Will be removed in 4.0.0\n   */\n  @Prop() showSeconds = true;\n\n  /**\n   * Hides the header of the picker.\n   *\n   * @since 3.2.0\n   */\n  @Prop() hideHeader: boolean = false;\n\n  /**\n   * Interval for hour selection\n   *\n   * @since 3.2.0\n   */\n  @Prop({ mutable: true }) hourInterval: number = HOUR_INTERVAL_DEFAULT;\n  @Watch('hourInterval')\n  watchHourIntervalPropHandler(newValue: number) {\n    if (\n      Number.isInteger(newValue) &&\n      newValue >= 0 &&\n      newValue <= (this.timeRef ? 12 : 23)\n    ) {\n      this.setTimePickerDescriptors();\n      return;\n    }\n\n    this.printIntervalError('hour', newValue);\n    this.hourInterval = HOUR_INTERVAL_DEFAULT;\n  }\n\n  /**\n   * Interval for minute selection\n   *\n   * @since 3.2.0\n   */\n  @Prop({ mutable: true }) minuteInterval: number = MINUTE_INTERVAL_DEFAULT;\n  @Watch('minuteInterval')\n  watchMinuteIntervalPropHandler(newValue: number) {\n    if (newValue >= 0 && newValue <= 59) {\n      this.setTimePickerDescriptors();\n      return;\n    }\n\n    this.printIntervalError('minute', newValue);\n    this.minuteInterval = MINUTE_INTERVAL_DEFAULT;\n  }\n\n  /**\n   * Interval for second selection\n   *\n   * @since 3.2.0\n   */\n  @Prop({ mutable: true }) secondInterval: number = SECOND_INTERVAL_DEFAULT;\n  @Watch('secondInterval')\n  watchSecondIntervalPropHandler(newValue: number) {\n    if (newValue >= 0 && newValue <= 59) {\n      this.setTimePickerDescriptors();\n      return;\n    }\n\n    this.printIntervalError('second', newValue);\n    this.secondInterval = SECOND_INTERVAL_DEFAULT;\n  }\n\n  /**\n   * Interval for millisecond selection\n   *\n   * @since 3.2.0\n   */\n  @Prop({ mutable: true }) millisecondInterval: number =\n    MILLISECOND_INTERVAL_DEFAULT;\n  @Watch('millisecondInterval')\n  watchMillisecondIntervalPropHandler(newValue: number) {\n    if (newValue >= 0 && newValue <= 999) {\n      this.setTimePickerDescriptors();\n      return;\n    }\n\n    this.printIntervalError('millisecond', newValue);\n    this.millisecondInterval = MILLISECOND_INTERVAL_DEFAULT;\n  }\n\n  private printIntervalError(intervalName: string, value: number) {\n    console.error(\n      `Value ${value} is not valid for ${intervalName}-interval. Falling back to default.`\n    );\n  }\n\n  /**\n   * Select time with format string\n   * Format has to match the `format` property.\n   */\n  @Prop() time: string = DateTime.now().toFormat(this.format);\n\n  @Watch('time')\n  watchTimePropHandler(newValue: string) {\n    const timeFormat = DateTime.fromFormat(newValue, this.format);\n    if (!timeFormat.isValid) {\n      throw new Error('Format is not supported or not correct');\n    }\n\n    this._time = timeFormat;\n  }\n\n  /**\n   * Set time reference\n   *\n   * @deprecated This is determined by the currently set time. Will be removed in 4.0.0.\n   */\n  @Prop() timeReference: 'AM' | 'PM' | undefined;\n\n  /**\n   * Text of time select button\n   *\n   * @deprecated Use `i18nConfirmTime` instead. Will be removed in 4.0.0.\n   */\n  @Prop() textSelectTime = CONFIRM_BUTTON_DEFAULT;\n\n  /**\n   * Text of the time confirm button\n   */\n  @Prop({ attribute: 'i18n-confirm-time' }) i18nConfirmTime =\n    CONFIRM_BUTTON_DEFAULT;\n\n  /**\n   * Text for top label\n   *\n   * @deprecated Use `i18nHeader` instead. Will be removed in 4.0.0.\n   */\n  @Prop() textTime: string = HEADER_DEFAULT;\n\n  /**\n   * Text for top header\n   */\n  @Prop({ attribute: 'i18n-header' }) i18nHeader: string = HEADER_DEFAULT;\n\n  /**\n   * Text for hour column header\n   */\n  @Prop({ attribute: 'i18n-column-header' }) i18nHourColumnHeader: string =\n    'hr';\n\n  /**\n   * Text for minute column header\n   */\n  // eslint-disable-next-line @stencil-community/decorators-style\n  @Prop({ attribute: 'i18n-minute-column-header' })\n  i18nMinuteColumnHeader: string = 'min';\n\n  /**\n   * Text for second column header\n   */\n  // eslint-disable-next-line @stencil-community/decorators-style\n  @Prop({ attribute: 'i18n-second-column-header' })\n  i18nSecondColumnHeader: string = 'sec';\n\n  /**\n   * Text for millisecond column header\n   */\n  // eslint-disable-next-line @stencil-community/decorators-style\n  @Prop({ attribute: 'i18n-millisecond-column-header' })\n  i18nMillisecondColumnHeader: string = 'ms';\n\n  /**\n   * Time event\n   */\n  @Event() timeSelect!: EventEmitter<string>;\n\n  /**\n   * Time change event\n   */\n  @Event() timeChange!: EventEmitter<string>;\n\n  /**\n   * Get the current time based on the wanted format\n   */\n  @Method()\n  async getCurrentTime() {\n    return this._time?.toFormat(this.format);\n  }\n\n  @State() private _time?: DateTime;\n  @Watch('_time')\n  onTimeChange() {\n    const formattedTimeOld = this.formattedTime;\n    this.setTimeRef();\n    this.formattedTime = this.getFormattedTime();\n\n    this.updateScrollPositions(formattedTimeOld);\n  }\n\n  @State() private timeRef?: 'AM' | 'PM' | undefined;\n  @State() private formattedTime: TimeOutputFormat = FORMATTED_TIME_EMPTY;\n  @State() private timePickerDescriptors: TimePickerDescriptor[] = [];\n  @State() private isUnitFocused: boolean = false;\n  @State() private focusedUnit: TimePickerDescriptorUnit = 'hour';\n  @State() private focusedValue: number = 0;\n\n  private visibilityObserver?: MutationObserver;\n  private focusScrollAlignment: 'start' | 'end' = 'start';\n\n  componentWillLoad() {\n    this.initPicker();\n  }\n\n  private initPicker() {\n    this._time = DateTime.fromFormat(this.time, this.format);\n\n    if (!this._time.isValid) {\n      console.error(\n        `Invalid time format. The configured format does not match the format of the passed time. ${this._time.invalidReason}: ${this._time.invalidExplanation}`\n      );\n\n      this._time = DateTime.now();\n    }\n\n    this.setTimeRef();\n    this.setTimePickerDescriptors();\n    this.setInitialFocusedValueAndUnit();\n\n    this.watchHourIntervalPropHandler(this.hourInterval);\n    this.watchMinuteIntervalPropHandler(this.minuteInterval);\n    this.watchSecondIntervalPropHandler(this.secondInterval);\n    this.watchMillisecondIntervalPropHandler(this.millisecondInterval);\n  }\n\n  componentDidLoad() {\n    this.updateScrollPositions();\n    this.setupVisibilityObserver();\n  }\n\n  componentDidRender() {\n    if (this.isUnitFocused) {\n      const elementContainer = this.getElementContainer(\n        this.focusedUnit,\n        this.focusedValue\n      );\n      const elementList = this.getElementList(this.focusedUnit);\n\n      if (elementContainer) {\n        elementContainer.focus({ preventScroll: true });\n\n        if (!this.isElementVisible(elementContainer, elementList)) {\n          elementContainer.scrollIntoView({\n            block: this.focusScrollAlignment,\n          });\n\n          if (this.focusScrollAlignment === 'end') {\n            elementList.scrollTop += 4;\n          } else {\n            elementList.scrollTop -= 4;\n          }\n        }\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.visibilityObserver) {\n      this.visibilityObserver.disconnect();\n    }\n  }\n\n  @OnListener<TimePicker>('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (!this.isUnitFocused) {\n      return;\n    }\n\n    let newValue = this.focusedValue;\n    let shouldPreventDefault = true;\n    let newValueInterval;\n\n    switch (this.focusedUnit) {\n      case 'hour':\n        newValueInterval = this.hourInterval;\n        break;\n      case 'minute':\n        newValueInterval = this.minuteInterval;\n        break;\n      case 'second':\n        newValueInterval = this.secondInterval;\n        break;\n      case 'millisecond':\n        newValueInterval = this.millisecondInterval;\n        break;\n    }\n\n    switch (event.key) {\n      case 'Tab':\n        // Let tab navigation work normally and reset focused value/unit\n        shouldPreventDefault = false;\n        this.setInitialFocusedValueAndUnit();\n        break;\n\n      case 'ArrowUp':\n        newValue -= newValueInterval;\n        this.focusScrollAlignment = 'start';\n        this.updateFocusedValue(newValue);\n        break;\n\n      case 'ArrowDown':\n        newValue += newValueInterval;\n        this.focusScrollAlignment = 'end';\n        this.updateFocusedValue(newValue);\n        break;\n\n      case 'ArrowLeft':\n        this.moveFocusToAdjacentUnit(-1);\n        break;\n\n      case 'ArrowRight':\n        this.moveFocusToAdjacentUnit(1);\n        break;\n\n      case 'Enter':\n      case ' ':\n        this.select(this.focusedUnit, this.focusedValue);\n        break;\n\n      default:\n        return;\n    }\n\n    if (shouldPreventDefault) {\n      event.preventDefault();\n    }\n  }\n\n  onUnitCellBlur() {\n    this.isUnitFocused = false;\n  }\n\n  onUnitCellFocus() {\n    this.isUnitFocused = true;\n  }\n\n  private getElementList(unit: TimePickerDescriptorUnit): HTMLDivElement {\n    return this.hostElement.shadowRoot?.querySelector(\n      `[data-element-list-id=\"${unit}\"]`\n    ) as HTMLDivElement;\n  }\n\n  private getElementContainer(\n    unit: TimePickerDescriptorUnit,\n    number: number\n  ): HTMLDivElement {\n    return this.hostElement.shadowRoot?.querySelector(\n      `[data-element-container-id=\"${unit}-${number}\"]`\n    ) as HTMLDivElement;\n  }\n\n  private isElementVisible(\n    element: HTMLElement,\n    container: HTMLElement\n  ): boolean {\n    const elementRect = element.getBoundingClientRect();\n    const containerRect = container.getBoundingClientRect();\n\n    return (\n      elementRect.top >= containerRect.top &&\n      elementRect.bottom <= containerRect.bottom\n    );\n  }\n\n  private updateFocusedValue(value: number) {\n    const numberArray = this.getNumberArrayForUnit(this.focusedUnit);\n    const maxValue = numberArray[numberArray.length - 1];\n    const minValue = numberArray[0];\n\n    if (value > maxValue) {\n      value = minValue;\n      this.focusScrollAlignment = 'start';\n    } else if (value < minValue) {\n      value = maxValue;\n      this.focusScrollAlignment = 'end';\n    }\n\n    this.focusedValue = value;\n  }\n\n  private moveFocusToAdjacentUnit(direction: number) {\n    const currentUnitIndex = this.timePickerDescriptors.findIndex(\n      (d) => d.unit === this.focusedUnit\n    );\n    const newUnitIndex = currentUnitIndex + direction;\n\n    // Check if new index is within bounds\n    if (newUnitIndex >= 0 && newUnitIndex < this.timePickerDescriptors.length) {\n      const newUnit = this.timePickerDescriptors[newUnitIndex].unit;\n\n      const selectedValue = Number(this.formattedTime[newUnit]);\n\n      this.focusedUnit = newUnit;\n      this.updateFocusedValue(selectedValue);\n    }\n  }\n\n  private setInitialFocusedValueAndUnit() {\n    const firstVisibleDescriptor = this.timePickerDescriptors.find(\n      (descriptor) => !descriptor.hidden\n    );\n    if (!firstVisibleDescriptor) {\n      return;\n    }\n\n    const selectedValue = Number(\n      this.formattedTime[firstVisibleDescriptor.unit]\n    );\n    const isValidSelection =\n      firstVisibleDescriptor.numberArray.includes(selectedValue);\n\n    this.focusedValue = isValidSelection\n      ? selectedValue\n      : firstVisibleDescriptor.numberArray[0];\n\n    this.focusedUnit = firstVisibleDescriptor.unit;\n  }\n\n  private setupVisibilityObserver() {\n    let dropdownElement: Element | null = this.hostElement;\n    while (dropdownElement && dropdownElement.tagName !== 'IX-DROPDOWN') {\n      dropdownElement = dropdownElement.parentElement;\n    }\n\n    if (!dropdownElement) {\n      return;\n    }\n\n    this.visibilityObserver = new MutationObserver((mutations) =>\n      this.mutationObserverCallback(mutations)\n    );\n\n    this.visibilityObserver.observe(dropdownElement, {\n      attributes: true,\n      attributeFilter: ['class', 'style'],\n    });\n  }\n\n  private mutationObserverCallback(mutations: MutationRecord[]) {\n    for (const mutation of mutations) {\n      if (mutation.type !== 'attributes') {\n        continue;\n      }\n\n      const dropdown = mutation.target as HTMLElement;\n\n      if (!dropdown.classList.contains('show')) {\n        // keep picker in sync with input\n        this._time = DateTime.fromFormat(this.time, this.format);\n        this.setInitialFocusedValueAndUnit();\n\n        continue;\n      }\n\n      const elementsReady = this.areElementsRendered();\n      if (!elementsReady) {\n        continue;\n      }\n\n      this.updateScrollPositions();\n    }\n  }\n\n  private areElementsRendered(): boolean {\n    const elementLists =\n      this.hostElement.shadowRoot?.querySelectorAll('.element-list');\n\n    if (!elementLists || elementLists.length === 0) {\n      return false;\n    }\n\n    return Array.from(elementLists).some(\n      (list) => (list as HTMLElement).offsetHeight > 0\n    );\n  }\n\n  private getFormattedTime(): TimeOutputFormat {\n    if (!this._time) {\n      return FORMATTED_TIME_EMPTY;\n    }\n\n    return {\n      hour:\n        this.timeRef !== undefined\n          ? this._time.toFormat('h')\n          : this._time.toFormat('H'),\n      minute: this._time.toFormat('m'),\n      second: this._time.toFormat('s'),\n      millisecond: this._time.toFormat('S'),\n    };\n  }\n\n  private timeUpdate(unit: TimePickerDescriptorUnit, value: number): number {\n    let maxValue = DateTime.now().endOf('day').get(unit);\n\n    if (unit === 'hour') {\n      if (this.timeRef === 'PM') {\n        // 12 PM should remain 12, other PM hours add 12\n        value = value === 12 ? 12 : value + 12;\n      } else if (this.timeRef === 'AM') {\n        // 12 AM should be 0, other AM hours remain as is\n        value = value === 12 ? 0 : value;\n        maxValue = 12;\n      }\n    }\n\n    if (value > maxValue) {\n      value = maxValue;\n    } else if (value < 0) {\n      value = 0;\n    }\n\n    this._time = this._time?.set({\n      [unit]: value,\n    });\n    return value;\n  }\n\n  private changeTimeReference(newTimeRef: 'AM' | 'PM') {\n    if (!this._time) {\n      return;\n    }\n\n    if (this.timeRef === newTimeRef) {\n      return;\n    }\n\n    this.timeRef = newTimeRef;\n    const currentHour = this._time.hour;\n\n    if (newTimeRef === 'PM' && currentHour < 12) {\n      this._time = this._time.plus({ hours: 12 });\n    } else if (newTimeRef === 'AM' && currentHour >= 12) {\n      this._time = this._time.minus({ hours: 12 });\n    }\n\n    this.timeChange.emit(this._time!.toFormat(this.format));\n  }\n\n  private isFormat12Hour(format: string): boolean {\n    // Remove any text that's inside quotes (literal text in Luxon format strings)\n    let cleanFormat = '';\n    let inQuote = false;\n\n    for (let i = 0; i < format.length; i++) {\n      const char = format[i];\n      if (char === \"'\") {\n        inQuote = !inQuote;\n      } else if (!inQuote) {\n        cleanFormat += char;\n      }\n    }\n\n    // Check for specific 12-hour format tokens\n    // Case-sensitive matching to distinguish between 'h' and 'H'\n    return /h|a|t/.test(cleanFormat);\n  }\n\n  private setTimeRef() {\n    const uses12HourFormat = this.isFormat12Hour(this.format);\n\n    if (uses12HourFormat && this._time) {\n      this.timeRef = this._time!.hour >= 12 ? 'PM' : 'AM';\n    } else {\n      this.timeRef = undefined;\n    }\n  }\n\n  private setTimePickerDescriptors() {\n    let hourNumbers = [];\n    let minuteNumbers = [];\n    let secondNumbers = [];\n    let millisecondsNumbers = [];\n\n    if (this.timeRef !== undefined) {\n      hourNumbers = Array.from(\n        { length: Math.ceil(12 / this.hourInterval) },\n        (_, i) => i * this.hourInterval + 1\n      ).filter((hour) => hour <= 12);\n    } else {\n      hourNumbers = Array.from(\n        { length: Math.ceil(24 / this.hourInterval) },\n        (_, i) => i * this.hourInterval\n      );\n    }\n\n    minuteNumbers = Array.from(\n      { length: Math.ceil(60 / this.minuteInterval) },\n      (_, i) => i * this.minuteInterval\n    );\n    secondNumbers = Array.from(\n      { length: Math.ceil(60 / this.secondInterval) },\n      (_, i) => i * this.secondInterval\n    );\n    millisecondsNumbers = Array.from(\n      { length: Math.ceil(1000 / this.millisecondInterval) },\n      (_, i) => i * this.millisecondInterval\n    );\n\n    this.timePickerDescriptors = [\n      {\n        unit: 'hour',\n        header: this.i18nHourColumnHeader,\n        hidden:\n          !LUXON_FORMAT_PATTERNS.hours.test(this.format) || !this.showHour,\n        numberArray: hourNumbers,\n      },\n      {\n        unit: 'minute',\n        header: this.i18nMinuteColumnHeader,\n        hidden:\n          !LUXON_FORMAT_PATTERNS.minutes.test(this.format) || !this.showMinutes,\n        numberArray: minuteNumbers,\n      },\n      {\n        unit: 'second',\n        header: this.i18nSecondColumnHeader,\n        hidden:\n          !LUXON_FORMAT_PATTERNS.seconds.test(this.format) || !this.showSeconds,\n        numberArray: secondNumbers,\n      },\n      {\n        unit: 'millisecond',\n        header: this.i18nMillisecondColumnHeader,\n        hidden: !LUXON_FORMAT_PATTERNS.milliseconds.test(this.format),\n        numberArray: millisecondsNumbers,\n      },\n    ];\n\n    this.timePickerDescriptors = this.timePickerDescriptors.filter(\n      (item) => !item.hidden\n    );\n  }\n\n  private getNumberArrayForUnit(unit: TimePickerDescriptorUnit): number[] {\n    const descriptor = this.timePickerDescriptors.find(\n      (descriptor) => descriptor.unit === unit\n    );\n    return descriptor ? descriptor.numberArray : [];\n  }\n\n  private isSelected(unit: TimePickerDescriptorUnit, number: number): boolean {\n    return this.formattedTime![unit] === String(number);\n  }\n\n  private select(unit: TimePickerDescriptorUnit, number: number) {\n    this.formattedTime = {\n      ...this.formattedTime!,\n      [unit]: String(number),\n    };\n\n    this.timeUpdate(unit, number);\n    this.elementListScrollToTop(unit, number, 'smooth');\n    this.timeChange.emit(this._time!.toFormat(this.format));\n  }\n\n  private elementListScrollToTop(\n    unit: TimePickerDescriptorUnit,\n    number: number,\n    scrollBehaviour: 'smooth' | 'instant'\n  ) {\n    const elementList = this.getElementList(unit);\n    const elementContainer = this.getElementContainer(unit, number);\n\n    if (elementList && elementContainer) {\n      const elementListHeight = elementList.clientHeight;\n      const elementContainerHeight = elementContainer.clientHeight;\n\n      // Offset which is used to adjust the scroll position to account for margins, elements being hidden, etc.\n      let scrollPositionOffset = 15;\n      if (this.hideHeader) {\n        // 74 --> height of the header container\n        scrollPositionOffset -= 74;\n      }\n\n      const scrollPosition =\n        elementContainer.offsetTop -\n        elementListHeight / 2 +\n        elementContainerHeight / 2 -\n        scrollPositionOffset;\n\n      elementList.scrollTo({\n        top: scrollPosition,\n        behavior: scrollBehaviour,\n      });\n    }\n  }\n\n  /**\n   * Updates all scroll positions of the time picker elements\n   * Updates only the elements that have changed if `formattedTimeOld` is provided\n   */\n  private updateScrollPositions(\n    formattedTimeOld: TimeOutputFormat | undefined = undefined\n  ) {\n    for (const key in this.formattedTime) {\n      const unitKey = key as keyof TimeOutputFormat;\n\n      if (\n        !formattedTimeOld ||\n        this.formattedTime[unitKey] !== formattedTimeOld[unitKey]\n      ) {\n        this.elementListScrollToTop(\n          unitKey as TimePickerDescriptorUnit,\n          Number(this.formattedTime[unitKey]),\n          'instant'\n        );\n      }\n    }\n  }\n\n  private formatUnitValue(\n    unit: TimePickerDescriptorUnit,\n    value: number\n  ): string {\n    if (unit === 'millisecond') {\n      return value.toString().padStart(3, '0');\n    }\n\n    return value < 10 ? `0${value}` : value.toString();\n  }\n\n  private getColumnSeparator(currentIndex: number): string {\n    if (currentIndex + 1 < this.timePickerDescriptors.length) {\n      const nextUnit = this.timePickerDescriptors[currentIndex + 1].unit;\n      return nextUnit === 'millisecond' ? '.' : ':';\n    }\n\n    return ':';\n  }\n\n  private getElementContainerTabIndex(\n    number: number,\n    descriptorUnit: TimePickerDescriptorUnit\n  ): string {\n    return number === this.focusedValue && descriptorUnit === this.focusedUnit\n      ? '0'\n      : '-1';\n  }\n\n  private getConfirmButtonText(): string {\n    if (this.i18nConfirmTime !== CONFIRM_BUTTON_DEFAULT) {\n      return this.i18nConfirmTime;\n    }\n\n    if (this.textSelectTime !== CONFIRM_BUTTON_DEFAULT) {\n      return this.textSelectTime;\n    }\n\n    return this.i18nConfirmTime;\n  }\n\n  private getHeaderText(): string {\n    if (this.i18nHeader !== HEADER_DEFAULT) {\n      return this.i18nHeader;\n    }\n\n    if (this.textTime != HEADER_DEFAULT) {\n      return this.textTime;\n    }\n\n    return this.i18nHeader;\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-date-time-card\n          standaloneAppearance={this.standaloneAppearance}\n          timePickerAppearance={true}\n          corners={this.corners}\n          hasFooter={true}\n          hideHeader={this.hideHeader}\n        >\n          <div class=\"header\" slot=\"header\">\n            <ix-typography format=\"h5\">{this.getHeaderText()}</ix-typography>\n          </div>\n          <div class=\"clock\">\n            {this.timePickerDescriptors.map((descriptor, index: number) => (\n              <div class=\"flex\">\n                <div class={{ columns: true, hidden: descriptor.hidden }}>\n                  <div class=\"column-header\" title={descriptor.header}>\n                    {descriptor.header}\n                  </div>\n                  <div\n                    data-element-list-id={descriptor.unit}\n                    class=\"element-list\"\n                    tabIndex={-1}\n                  >\n                    {descriptor.numberArray.map((number) => (\n                      <button\n                        data-element-container-id={`${descriptor.unit}-${number}`}\n                        class={{\n                          selected: this.isSelected(descriptor.unit, number),\n                          'element-container': true,\n                        }}\n                        onClick={() => this.select(descriptor.unit, number)}\n                        onFocus={() => {\n                          this.focusedUnit = descriptor.unit;\n                          this.focusedValue = number;\n                          this.onUnitCellFocus();\n                        }}\n                        onBlur={() => this.onUnitCellBlur()}\n                        tabindex={this.getElementContainerTabIndex(\n                          number,\n                          descriptor.unit\n                        )}\n                        role=\"button\"\n                        aria-label={`${descriptor.header}: ${number}`}\n                      >\n                        {this.formatUnitValue(descriptor.unit, number)}\n                      </button>\n                    ))}\n                    <div class=\"element-list-padding\"></div>\n                  </div>\n                </div>\n\n                {index !== this.timePickerDescriptors.length - 1 && (\n                  <div\n                    class={{\n                      'column-seperator': true,\n                      hidden: descriptor.hidden,\n                    }}\n                  >\n                    {this.getColumnSeparator(index)}\n                  </div>\n                )}\n              </div>\n            ))}\n          </div>\n\n          <div\n            class={{\n              footer: true,\n              'footer--compact': this.timePickerDescriptors.length <= 2,\n            }}\n            slot=\"footer\"\n          >\n            {this.timeRef && (\n              <div\n                class={{\n                  'time-ref-buttons': true,\n                  'time-ref-buttons--datetime-picker-appearance':\n                    this.dateTimePickerAppearance,\n                }}\n              >\n                <button\n                  data-am-pm-id=\"AM\"\n                  class={{ selected: this.timeRef === 'AM' }}\n                  onClick={() => this.changeTimeReference('AM')}\n                >\n                  AM\n                </button>\n                <button\n                  data-am-pm-id=\"PM\"\n                  class={{ selected: this.timeRef === 'PM' }}\n                  onClick={() => this.changeTimeReference('PM')}\n                >\n                  PM\n                </button>\n              </div>\n            )}\n            {!this.dateTimePickerAppearance && (\n              <ix-button\n                class=\"confirm-button\"\n                onClick={() => {\n                  this.timeSelect.emit(this._time?.toFormat(this.format));\n                }}\n              >\n                {this.getConfirmButtonText()}\n              </ix-button>\n            )}\n          </div>\n        </ix-date-time-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-7b5eb3ca.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["blindCss","sequentialInstanceId","Blind","constructor","hostRef","this","collapsed","variant","blindId","onHeaderClick","collapsedChange","emit","componentDidLoad","animateCollapse","content","hostElement","shadowRoot","querySelector","animation","isCollapsed","rotateChevronRight","rotateChevronDown","anime","targets","chevronRef","duration","easing","rotateZ","opacity","render","h","Host","key","class","closed","type","a11yBoolean","onClick","name","iconChevronRightSmall","color","ref","id","label","undefined","Fragment","icon","title","format","bold","sublabel","hide"],"sources":["src/components/blind/blind.scss?tag=ix-blind&encapsulation=shadow","src/components/blind/blind.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\n@import 'common-variables';\n@import 'legacy/mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n@mixin blind($variant: 'filled') {\n  :host(.blind-#{$variant}) {\n    @if $variant == 'outline' {\n      border: solid\n        var(--theme-blind--border-thickness)\n        var(--theme-blind-base--border-color);\n    }\n\n    .blind-header {\n      @if $variant == 'outline' {\n        background-color: var(--theme-color-ghost);\n      } @else {\n        background-color: var(--theme-color-#{$variant});\n      }\n\n      @if $variant == 'filled' or $variant == 'outline' {\n        @include ghost-hover-pressed;\n      } @else {\n        @include hover {\n          background-color: var(--theme-color-#{$variant}--hover);\n        }\n\n        @include active {\n          background-color: var(--theme-color-#{$variant}--active);\n        }\n      }\n    }\n\n    @if $variant == 'filled' or $variant == 'outline' {\n      .blind-header-title-label {\n        color: var(--theme-color-std-text);\n      }\n      .blind-header-title-sublabel {\n        color: var(--theme-color-soft-text);\n      }\n    } @else {\n      .blind-header-title-label,\n      .blind-header-title-sublabel {\n        color: var(--theme-color-#{$variant}--contrast);\n      }\n    }\n\n    @if $variant == 'outline' {\n      border-color: var(--theme-color-soft-bdr);\n    } @else {\n      background-color: var(--theme-blind-base--background);\n    }\n  }\n}\n\n:host {\n  @include ix-component;\n  display: flex;\n  flex-direction: column;\n  border-radius: var(--theme-blind--border-radius);\n  overflow: hidden;\n\n  .blind-header-wrapper {\n    position: relative;\n    min-height: 3rem;\n    height: 3rem;\n    overflow: hidden;\n  }\n\n  .blind-header-content {\n    display: flex;\n    position: relative;\n    align-items: center;\n    justify-content: flex-start;\n\n    width: 100%;\n    height: 100%;\n\n    pointer-events: none;\n    padding-left: 0.5rem;\n  }\n\n  .blind-header-title {\n    display: flex;\n    position: relative;\n    align-items: center;\n    flex-grow: 1;\n    margin-right: 0.5rem;\n  }\n\n  .blind-header {\n    all: unset;\n    @include ellipsis;\n\n    display: block;\n    position: absolute;\n\n    top: 0px;\n    left: 0px;\n\n    pointer-events: all;\n\n    padding-left: 2.5rem;\n    min-height: 3rem;\n    height: 3rem;\n    width: calc(100% - 2 * var(--theme-blind--border-thickness));\n    border: solid var(--theme-blind--border-thickness) transparent;\n    border-radius: var(--theme-blind--border-radius)\n      var(--theme-blind--border-radius) 0 0;\n    cursor: pointer;\n\n    @include focus-visible {\n      border-color: var(--theme-color-focus-bdr);\n      outline: none;\n    }\n  }\n\n  .blind-header-title-icon,\n  .collapse-icon {\n    margin-right: $small-space;\n  }\n\n  .blind-header-title-row {\n    display: flex;\n    flex-grow: 1;\n    overflow: hidden;\n  }\n\n  .blind-header-title-col {\n    display: inline-flex;\n    align-items: center;\n    width: calc(100% - 1rem);\n    overflow: hidden;\n  }\n\n  .blind-header-title-col:not(:first-of-type) {\n    justify-content: flex-end;\n  }\n  ix-typography {\n    flex-grow: 1;\n    @include ellipsis;\n  }\n\n  .blind-header-title-label {\n    @include ellipsis;\n    padding-inline-end: 0.5rem;\n  }\n\n  .blind-header-title-sublabel {\n    @include ellipsis;\n    padding-inline: 0.5rem;\n  }\n\n  .blind-header-title {\n    display: flex;\n    align-items: center;\n    flex-grow: 1;\n    height: 100%;\n    min-width: 0;\n  }\n\n  .blind-header-labels {\n    display: inline-flex;\n    flex-grow: 1;\n    min-width: 0;\n  }\n\n  .blind-content {\n    display: block;\n    padding: 1rem;\n    transition-property: padding;\n    transition-duration: var(--theme-default-time);\n    transition-timing-function: ease-in;\n\n    &.hide {\n      max-height: 0;\n      padding-top: 0px;\n      padding-bottom: 0px;\n    }\n  }\n\n  .header-actions {\n    pointer-events: all;\n    margin-left: auto;\n  }\n}\n\n$blind-variants: (\n  alarm,\n  critical,\n  info,\n  neutral,\n  filled,\n  success,\n  warning,\n  primary,\n  outline\n);\n\n@each $variant in $blind-variants {\n  @include blind($variant);\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Host,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { CardVariant } from '../card/card';\nimport { a11yBoolean } from '../utils/a11y';\nimport { iconChevronRightSmall } from '@siemens/ix-icons/icons';\n\nexport type BlindVariant = CardVariant;\n\nlet sequentialInstanceId = 0;\n\n@Component({\n  tag: 'ix-blind',\n  styleUrl: 'blind.scss',\n  shadow: true,\n})\nexport class Blind {\n  /**\n   * Collapsed state\n   */\n  @Prop({ mutable: true, reflect: true }) collapsed = false;\n\n  /**\n   * Label of blind\n   */\n  @Prop() label?: string;\n\n  /**\n   * Secondary label inside blind header\n   */\n  @Prop() sublabel?: string;\n\n  /**\n   * Optional icon to be displayed next to the header label\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Blind variant\n   */\n  @Prop() variant: BlindVariant = 'filled';\n\n  /**\n   * Collapsed state changed\n   */\n  @Event() collapsedChange!: EventEmitter<boolean>;\n\n  @Element() hostElement!: HTMLIxBlindElement;\n\n  private chevronRef?: HTMLElement;\n  private blindId = ++sequentialInstanceId;\n\n  constructor() {}\n\n  private onHeaderClick() {\n    this.collapsed = !this.collapsed;\n    this.collapsedChange.emit(this.collapsed);\n  }\n\n  componentDidLoad() {\n    this.animateCollapse(this.collapsed);\n  }\n\n  get content() {\n    return this.hostElement.shadowRoot!.querySelector('.blind-content');\n  }\n\n  @Watch('collapsed')\n  animation(isCollapsed: boolean) {\n    this.animateCollapse(isCollapsed);\n  }\n\n  private animateCollapse(isCollapsed: boolean) {\n    if (isCollapsed) {\n      this.rotateChevronRight();\n    } else {\n      this.rotateChevronDown();\n    }\n  }\n\n  private rotateChevronDown() {\n    anime({\n      targets: this.chevronRef,\n      duration: 150,\n      easing: 'easeInOutSine',\n      rotateZ: 90,\n    });\n    anime({\n      targets: this.content,\n      duration: 150,\n      easing: 'easeInOutSine',\n      opacity: 1,\n    });\n  }\n\n  private rotateChevronRight() {\n    anime({\n      targets: this.chevronRef,\n      duration: 150,\n      easing: 'easeInOutSine',\n      rotateZ: 0,\n    });\n    anime({\n      targets: this.content,\n      duration: 150,\n      easing: 'easeInOutSine',\n      opacity: 0,\n    });\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          [`blind-${this.variant}`]: true,\n        }}\n      >\n        <div class={'blind-header-wrapper'}>\n          <button\n            class={{\n              'blind-header': true,\n              [`blind-${this.variant}`]: true,\n              closed: this.collapsed,\n            }}\n            type=\"button\"\n            aria-labelledby={`ix-blind-header-title-${this.blindId}`}\n            aria-controls={`ix-blind-content-section-${this.blindId}`}\n            aria-expanded={a11yBoolean(!this.collapsed)}\n            onClick={() => this.onHeaderClick()}\n          >\n            <slot name=\"custom-header\"></slot>\n          </button>\n\n          <div class={'blind-header-content'}>\n            <ix-icon\n              class=\"collapse-icon\"\n              name={iconChevronRightSmall}\n              color={\n                this.variant === 'filled' || this.variant === 'outline'\n                  ? 'color-primary'\n                  : `color-${this.variant}--contrast`\n              }\n              ref={(ref: HTMLElement | undefined) => (this.chevronRef = ref)}\n            ></ix-icon>\n            <div\n              class=\"blind-header-title\"\n              id={`ix-blind-header-title-${this.blindId}`}\n            >\n              {this.label !== undefined ? (\n                <Fragment>\n                  {this.icon && (\n                    <ix-icon\n                      class=\"blind-header-title-icon\"\n                      name={this.icon}\n                      color={\n                        this.variant === 'filled' || this.variant === 'outline'\n                          ? 'color-std-text'\n                          : `color-${this.variant}--contrast`\n                      }\n                    ></ix-icon>\n                  )}\n                  <div class={'blind-header-title-row'}>\n                    <div class=\"blind-header-title-col\">\n                      <ix-typography title={this.label} format=\"label-lg\" bold>\n                        <div\n                          class=\"blind-header-title-label\"\n                          title={this.label}\n                        >\n                          {this.label}\n                        </div>\n                      </ix-typography>\n                    </div>\n\n                    {this.sublabel && (\n                      <div class=\"blind-header-title-col\">\n                        <ix-typography title={this.sublabel}>\n                          <div class=\"blind-header-title-sublabel\">\n                            {this.sublabel}\n                          </div>\n                        </ix-typography>\n                      </div>\n                    )}\n                  </div>\n                  <div class=\"header-actions\">\n                    <slot name=\"header-actions\"></slot>\n                  </div>\n                </Fragment>\n              ) : null}\n            </div>\n          </div>\n        </div>\n        <section\n          id={`ix-blind-content-section-${this.blindId}`}\n          aria-labelledby={`ix-blind-header-title-${this.blindId}`}\n        >\n          <div\n            class={{\n              'blind-content': true,\n              hide: this.collapsed,\n            }}\n          >\n            {!this.collapsed ? <slot></slot> : null}\n          </div>\n        </section>\n      </Host>\n    );\n  }\n}\n"],"mappings":"8KAAA,MAAMA,EAAW,+jUC2BjB,IAAIC,EAAuB,E,MAOdC,EAAK,MAoChB,WAAAC,CAAAC,G,2DAhCwCC,KAASC,UAAG,MAoB5CD,KAAOE,QAAiB,SAUxBF,KAAOG,UAAKP,CAEJ,CAER,aAAAQ,GACNJ,KAAKC,WAAaD,KAAKC,UACvBD,KAAKK,gBAAgBC,KAAKN,KAAKC,U,CAGjC,gBAAAM,GACEP,KAAKQ,gBAAgBR,KAAKC,U,CAG5B,WAAIQ,GACF,OAAOT,KAAKU,YAAYC,WAAYC,cAAc,iB,CAIpD,SAAAC,CAAUC,GACRd,KAAKQ,gBAAgBM,E,CAGf,eAAAN,CAAgBM,GACtB,GAAIA,EAAa,CACfd,KAAKe,oB,KACA,CACLf,KAAKgB,mB,EAID,iBAAAA,GACNC,EAAM,CACJC,QAASlB,KAAKmB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,KAEXL,EAAM,CACJC,QAASlB,KAAKS,QACdW,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAIL,kBAAAR,GACNE,EAAM,CACJC,QAASlB,KAAKmB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,IAEXL,EAAM,CACJC,QAASlB,KAAKS,QACdW,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAIb,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,CAAC,SAAS5B,KAAKE,WAAY,OAG7BuB,EAAK,OAAAE,IAAA,2CAAAC,MAAO,wBACVH,EAAA,UAAAE,IAAA,2CACEC,MAAO,CACL,eAAgB,KAChB,CAAC,SAAS5B,KAAKE,WAAY,KAC3B2B,OAAQ7B,KAAKC,WAEf6B,KAAK,SAAQ,kBACI,yBAAyB9B,KAAKG,UAChC,4CAA4BH,KAAKG,UAAS,gBAC1C4B,GAAa/B,KAAKC,WACjC+B,QAAS,IAAMhC,KAAKI,iBAEpBqB,EAAA,QAAAE,IAAA,2CAAMM,KAAK,mBAGbR,EAAK,OAAAE,IAAA,2CAAAC,MAAO,wBACVH,EACE,WAAAE,IAAA,2CAAAC,MAAM,gBACNK,KAAMC,EACNC,MACEnC,KAAKE,UAAY,UAAYF,KAAKE,UAAY,UAC1C,gBACA,SAASF,KAAKE,oBAEpBkC,IAAMA,GAAkCpC,KAAKmB,WAAaiB,IAE5DX,EACE,OAAAE,IAAA,2CAAAC,MAAM,qBACNS,GAAI,yBAAyBrC,KAAKG,WAEjCH,KAAKsC,QAAUC,UACdd,EAACe,EAAQ,KACNxC,KAAKyC,MACJhB,EAAA,WACEG,MAAM,0BACNK,KAAMjC,KAAKyC,KACXN,MACEnC,KAAKE,UAAY,UAAYF,KAAKE,UAAY,UAC1C,iBACA,SAASF,KAAKE,sBAIxBuB,EAAK,OAAAG,MAAO,0BACVH,EAAK,OAAAG,MAAM,0BACTH,EAAe,iBAAAiB,MAAO1C,KAAKsC,MAAOK,OAAO,WAAWC,KAAI,MACtDnB,EAAA,OACEG,MAAM,2BACNc,MAAO1C,KAAKsC,OAEXtC,KAAKsC,SAKXtC,KAAK6C,UACJpB,EAAK,OAAAG,MAAM,0BACTH,EAAA,iBAAeiB,MAAO1C,KAAK6C,UACzBpB,EAAK,OAAAG,MAAM,+BACR5B,KAAK6C,aAMhBpB,EAAK,OAAAG,MAAM,kBACTH,EAAA,QAAMQ,KAAK,qBAGb,QAIVR,EAAA,WAAAE,IAAA,2CACEU,GAAI,4BAA4BrC,KAAKG,UAAS,kBAC7B,yBAAyBH,KAAKG,WAE/CsB,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,gBAAiB,KACjBkB,KAAM9C,KAAKC,aAGXD,KAAKC,UAAYwB,EAAA,aAAgB,O","ignoreList":[]}

package/dist/siemens-ix/p-7da60ba2.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as i,H as s,a as r}from"./p-B6NtGPRE.js";import{H as a}from"./p-zYzFdFx8.js";import{m as n}from"./p-bcj7UEIC.js";const h=":host{display:inline-block;position:relative}:host .checkbox-container{display:flex;flex-direction:column;gap:1rem;margin:0.375rem 0;flex-wrap:wrap}:host .checkbox-container.row-layout{flex-direction:row}";var l=undefined&&undefined.__decorate||function(e,t,i,s){var r=arguments.length,a=r<3?t:s===null?s=Object.getOwnPropertyDescriptor(t,i):s,n;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")a=Reflect.decorate(e,t,i,s);else for(var h=e.length-1;h>=0;h--)if(n=e[h])a=(r<3?n(a):r>3?n(t,i,a):n(t,i))||a;return r>3&&a&&Object.defineProperty(t,i,a),a};const o=class{constructor(i){e(this,i);this.valueChange=t(this,"valueChange",7);this.direction="column";this.required=false;this.isInvalid=false;this.isValid=false;this.isInfo=false;this.isWarning=false;this.touched=false;this.groupRef=n();this.observer=new MutationObserver((()=>{this.ensureOnlyLastRadioChecked();this.hasNestedRequiredRadio()}))}get radiobuttonElements(){return Array.from(this.hostElement.querySelectorAll("ix-radio"))}connectedCallback(){this.observer.observe(this.hostElement,{childList:true,subtree:true,attributes:true,attributeFilter:["checked","required"]})}componentWillLoad(){this.selectInitialValue();this.ensureOnlyLastRadioChecked();this.hasNestedRequiredRadio()}disconnectedCallback(){if(this.observer){this.observer.disconnect()}}selectInitialValue(){if(!this.value){return}this.radiobuttonElements.forEach((e=>{e.checked=e.value===this.value}))}ensureOnlyLastRadioChecked(){const e=this.radiobuttonElements.filter((e=>e.checked));e.forEach(((t,i)=>{if(i===e.length-1){return}t.checked=false}))}hasNestedRequiredRadio(){this.required=this.radiobuttonElements.some((e=>e.required))}onValueChangeHandler(e){this.touched=true;this.radiobuttonElements.forEach((t=>{t.checked=t.value===e}))}onCheckedChangeHandler(e){this.radiobuttonElements.forEach((t=>{if(t!==e.target){t.checked=false;return}t.checked=true;this.valueChange.emit(t.value)}))}onClassField({isInvalid:e,isInfo:t,isValid:i,isWarning:s,isInvalidByRequired:r}){this.isInvalid=e||r;this.isInfo=t;this.isValid=i;this.isWarning=s}hasValidValue(){return Promise.resolve(!!Array.from(this.hostElement.querySelectorAll("ix-radio")).find((e=>e.checked)))}isTouched(){return Promise.resolve(this.touched)}render(){return i(s,{key:"df02d0574b1201f9dc2e4ffc0cca3b796ab38a26",onIxBlur:()=>this.touched=true,ref:this.groupRef},i("ix-field-wrapper",{key:"69166196117663244ea5dd946238b9429a71e467",label:this.label,helperText:this.helperText,invalidText:this.invalidText,infoText:this.infoText,warningText:this.warningText,validText:this.validText,showTextAsTooltip:this.showTextAsTooltip,isValid:this.isValid,isInfo:this.isInfo,isWarning:this.isWarning,isInvalid:this.isInvalid,controlRef:this.groupRef},i("div",{key:"dcea2d79018de3bb2b6d74e650964b37eb33f67a",class:{"checkbox-container":true,"row-layout":this.direction==="row"}},i("slot",{key:"4a2a181e1fd167681e7d43d70072a6bd8d5761d2"}))))}get hostElement(){return r(this)}static get watchers(){return{value:["onValueChangeHandler"]}}};l([a({includeChildren:true})],o.prototype,"onClassField",null);o.style=h;export{o as ix_radio_group};
-//# sourceMappingURL=p-7da60ba2.entry.js.map

package/dist/siemens-ix/p-80dfc634.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["dateTimeCardCss","DateTimeCard","constructor","hostRef","this","timePickerAppearance","hideHeader","hasFooter","individual","corners","cardClasses","card","standaloneAppearance","_a","rounded","left","right","straight","render","h","Host","key","class","name","content"],"sources":["src/components/date-time-card/date-time-card.scss?tag=ix-date-time-card&encapsulation=shadow","src/components/date-time-card/date-time-card.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/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  .card {\n    background-color: var(--theme-menu--background);\n    width: 100%;\n    box-shadow: none;\n    border: none;\n    border-radius: unset;\n    display: flex;\n    flex-direction: column;\n\n    &.standaloneAppearance {\n      box-shadow: var(--theme-shadow-4);\n      border-radius: 0.25rem;\n    }\n\n    &.rounded {\n      border-radius: 4px;\n    }\n\n    &.left {\n      border-radius: 4px 0 0 4px;\n      height: 100%;\n    }\n\n    &.right {\n      border-radius: 0 4px 4px 0;\n      height: 100%;\n    }\n\n    &.straight {\n      border-radius: 0;\n    }\n\n    .header-container {\n      width: 100%;\n\n      .header {\n        padding: $default-space;\n        flex: 0 1 auto;\n      }\n    }\n\n    .separator {\n      border: 1px solid var(--theme-datepicker-separator--background);\n      width: 100%;\n      flex: 0 1 auto;\n    }\n\n    .content {\n      &--time-picker {\n        padding: 0 $default-space;\n      }\n\n      padding: 0 $default-space $default-space $default-space;\n      flex: 1 1 auto;\n      display: flex;\n      flex-direction: column;\n      justify-content: center;\n    }\n\n    .footer-container {\n      width: 100%;\n\n      .footer {\n        padding: $default-space;\n      }\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, h, Host, Prop } from '@stencil/core';\n\nexport type DateTimeCardCorners = 'rounded' | 'left' | 'right' | 'straight';\n\n/**\n * @internal\n */\n@Component({\n  tag: 'ix-date-time-card',\n  styleUrl: 'date-time-card.scss',\n  shadow: true,\n})\nexport class DateTimeCard {\n  /** @internal */\n  @Prop() standaloneAppearance?: boolean;\n\n  /** Timepicker specific styling */\n  @Prop() timePickerAppearance: boolean = false;\n\n  /**\n   * Hide header\n   */\n  @Prop() hideHeader: boolean = false;\n\n  /**\n   * Display footer\n   */\n  @Prop() hasFooter: boolean = false;\n\n  /**\n   * set styles\n   */\n  @Prop() individual: boolean = true;\n\n  /**\n   * Set corners style\n   */\n  @Prop() corners: DateTimeCardCorners = 'rounded';\n\n  private cardClasses() {\n    return {\n      card: true,\n      standaloneAppearance: this.standaloneAppearance ?? this.individual,\n      rounded: this.corners === 'rounded',\n      left: this.corners === 'left',\n      right: this.corners === 'right',\n      straight: this.corners === 'straight',\n    };\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.cardClasses()}>\n          {!this.hideHeader && (\n            <div class=\"header-container\">\n              <div class=\"header\">\n                <slot name=\"header\"></slot>\n              </div>\n              <div class=\"separator\"></div>\n            </div>\n          )}\n\n          <div\n            class={{\n              content: true,\n              'content--time-picker': this.timePickerAppearance,\n            }}\n          >\n            <slot></slot>\n          </div>\n\n          {this.hasFooter && (\n            <div class=\"footer-container\">\n              <div class=\"separator\"></div>\n              <div class=\"footer\">\n                <slot name=\"footer\"></slot>\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAkB,yoD,MCqBXC,EAAY,MALzB,WAAAC,CAAAC,G,UAUUC,KAAoBC,qBAAY,MAKhCD,KAAUE,WAAY,MAKtBF,KAASG,UAAY,MAKrBH,KAAUI,WAAY,KAKtBJ,KAAOK,QAAwB,SA+CxC,CA7CS,WAAAC,G,MACN,MAAO,CACLC,KAAM,KACNC,sBAAsBC,EAAAT,KAAKQ,wBAAwB,MAAAC,SAAA,EAAAA,EAAAT,KAAKI,WACxDM,QAASV,KAAKK,UAAY,UAC1BM,KAAMX,KAAKK,UAAY,OACvBO,MAAOZ,KAAKK,UAAY,QACxBQ,SAAUb,KAAKK,UAAY,W,CAI/B,MAAAS,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAOlB,KAAKM,gBACbN,KAAKE,YACLa,EAAK,OAAAE,IAAA,2CAAAC,MAAM,oBACTH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,UACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,YAEbJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,eAIfH,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACLE,QAAS,KACT,uBAAwBpB,KAAKC,uBAG/Bc,EAAA,QAAAE,IAAA,8CAGDjB,KAAKG,WACJY,EAAK,OAAAE,IAAA,2CAAAC,MAAM,oBACTH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,cACXH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,UACTH,EAAM,QAAAE,IAAA,2CAAAE,KAAK,c","ignoreList":[]}

package/dist/siemens-ix/p-8774e0a8.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as a,H as s}from"./p-B6NtGPRE.js";const c=":host{display:block}";const b=class{constructor(a){e(this,a);this.labelChange=t(this,"labelChange",7)}watchLabel(e,t){this.labelChange.emit({name:"ix-menu-settings-item",oldLabel:t,newLabel:e})}render(){return a(s,{key:"0b3eefcc50ced96c2d024f44ca3a9ba1e48cd1c2"},a("slot",{key:"86e2570bf9670b222d8bb883af0002100ea78279"}))}static get watchers(){return{label:["watchLabel"]}}};b.style=c;export{b as ix_menu_settings_item};
-//# sourceMappingURL=p-8774e0a8.entry.js.map

package/dist/siemens-ix/p-92513d0e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["typographyCss","IxTypography","constructor","hostRef","this","bold","textDecoration","getTextColor","color","startsWith","endsWith","replace","render","typographyClass","_a","format","style","textColor","h","Host","key","class"],"sources":["src/components/typography/typography.scss?tag=ix-typography&encapsulation=shadow","src/components/typography/typography.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/shadow-dom/component';\n@import 'legacy/mixins/fonts';\n@import 'components/fonts';\n@import 'mixins/fonts';\n\n:host {\n  @include ix-component;\n\n  display: block;\n  position: relative;\n}\n\n:host(.text-xs) {\n  @include text-xs;\n}\n\n:host(.text-s) {\n  @include text-s;\n}\n\n:host(.text-caption) {\n  @include text-caption;\n}\n\n:host(.text-caption-single) {\n  @include text-caption-single;\n}\n\n:host(.text-default) {\n  @include text-default;\n}\n\n:host(.text-default-single) {\n  @include text-default-single;\n}\n\n:host(.text-default-title) {\n  @include text-default-title;\n}\n\n:host(.text-default-title-single) {\n  @include text-default-title-single;\n}\n\n:host(.text-l) {\n  @include text-l;\n}\n\n:host(.text-l-single) {\n  @include text-l-single;\n}\n\n:host(.text-l-title) {\n  @include text-l-title;\n}\n\n:host(.text-l-title-single) {\n  @include text-l-title-single;\n}\n\n:host(.text-h2) {\n  @include text-h2;\n}\n\n:host(.text-xl) {\n  @include text-xl;\n}\n\n$typography-formats: label, label-xs, label-sm, label-lg, body, body-xs, body-sm,\n  body-lg, display, display-xs, display-sm, display-lg, display-xl, display-xxl,\n  h6, h5, h4, h3, h2, h1, code, code-sm, code-lg;\n\n@each $format in $typography-formats {\n  :host(.typography-#{$format}) {\n    @extend .typography-#{$format};\n  }\n}\n\n$typography-decoration: none, underline, line-through;\n@each $decoration in $typography-decoration {\n  :host(.typography-decoration-#{$decoration}) {\n    @extend .typography-decoration-#{$decoration};\n  }\n}\n\n:host(.typography-weight-bold) {\n  @extend .typography-weight-bold;\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, h, Host, Prop } from '@stencil/core';\n\nexport type TypographyVariants =\n  | 'x-small'\n  | 'small'\n  | 'caption'\n  | 'caption-single'\n  | 'default'\n  | 'default-single'\n  | 'default-title'\n  | 'default-title-single'\n  | 'large'\n  | 'large-single'\n  | 'large-title'\n  | 'large-title-single'\n  | 'h2'\n  | 'display-large';\n\nexport type TypographyColors =\n  | 'alarm'\n  | 'alarm-contrast'\n  | 'contrast'\n  | 'critical-contrast'\n  | 'info-contrast'\n  | 'inv-contrast'\n  | 'inv-soft'\n  | 'inv-std'\n  | 'inv-weak'\n  | 'neutral-contrast'\n  | 'primary-contrast'\n  | 'soft'\n  | 'std'\n  | 'success-contrast'\n  | 'warning-contrast'\n  | 'weak';\n\ntype TypographyFormatLabel = 'label' | 'label-xs' | 'label-sm' | 'label-lg';\ntype TypographyFormatBody = 'body' | 'body-xs' | 'body-sm' | 'body-lg';\ntype TypographyFormatDisplay =\n  | 'display'\n  | 'display-xs'\n  | 'display-sm'\n  | 'display-lg'\n  | 'display-xl'\n  | 'display-xxl';\ntype TypographyFormatHeading = 'h6' | 'h5' | 'h4' | 'h3' | 'h2' | 'h1';\ntype TypographyFormatCode = 'code' | 'code-sm' | 'code-lg';\n\nexport type TypographyFormat =\n  | TypographyFormatLabel\n  | TypographyFormatBody\n  | TypographyFormatDisplay\n  | TypographyFormatHeading\n  | TypographyFormatCode;\n\nexport type TextDecoration = 'none' | 'underline' | 'line-through';\n\n@Component({\n  tag: 'ix-typography',\n  styleUrl: 'typography.scss',\n  shadow: true,\n})\nexport class IxTypography {\n  /**\n   * Text format\n   */\n  @Prop() format?: TypographyFormat;\n\n  /**\n   * Text color based on theme variables\n   */\n  @Prop() textColor?: TypographyColors;\n\n  /**\n   * Display text bold\n   */\n  @Prop() bold = false;\n\n  /**\n   * Text decoration\n   */\n  @Prop() textDecoration: TextDecoration = 'none';\n\n  private static getTextColor(color: TypographyColors) {\n    if (color.startsWith('inv-') || !color.endsWith('-contrast')) {\n      return `var(--theme-color-${color}-text)`;\n    }\n\n    return `var(--theme-color-${color.replace('-', '--')})`;\n  }\n\n  render() {\n    let typographyClass: Record<string, boolean> = {};\n    typographyClass[`typography-${this.format ?? 'body'}`] = true;\n\n    if (this.textDecoration !== 'none') {\n      typographyClass[`typography-decoration-${this.textDecoration}`] = true;\n    }\n\n    typographyClass['typography-weight-bold'] = this.bold;\n\n    let style = {};\n\n    if (this.textColor) {\n      style = {\n        color: IxTypography.getTextColor(this.textColor),\n      };\n    }\n\n    return (\n      <Host class={typographyClass} style={style}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAgB,oxb,MCuETC,EAAY,MALzB,WAAAC,CAAAC,G,UAmBUC,KAAIC,KAAG,MAKPD,KAAcE,eAAmB,MAkC1C,CAhCS,mBAAOC,CAAaC,GAC1B,GAAIA,EAAMC,WAAW,UAAYD,EAAME,SAAS,aAAc,CAC5D,MAAO,qBAAqBF,S,CAG9B,MAAO,qBAAqBA,EAAMG,QAAQ,IAAK,Q,CAGjD,MAAAC,G,MACE,IAAIC,EAA2C,GAC/CA,EAAgB,eAAcC,EAAAV,KAAKW,UAAU,MAAAD,SAAA,EAAAA,EAAA,UAAY,KAEzD,GAAIV,KAAKE,iBAAmB,OAAQ,CAClCO,EAAgB,yBAAyBT,KAAKE,kBAAoB,I,CAGpEO,EAAgB,0BAA4BT,KAAKC,KAEjD,IAAIW,EAAQ,GAEZ,GAAIZ,KAAKa,UAAW,CAClBD,EAAQ,CACNR,MAAOP,EAAaM,aAAaH,KAAKa,W,CAI1C,OACEC,EAACC,EAAK,CAAAC,IAAA,2CAAAC,MAAOR,EAAiBG,MAAOA,GACnCE,EAAa,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/siemens-ix/p-9513a275.entry.js

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

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

@@ -1 +0,0 @@
-{"version":3,"names":["emptyStateCss","EmptyState","constructor","hostRef","this","layout","render","h","Host","key","class","icon","name","size","color","format","header","subHeader","action","onClick","actionClick","emit"],"sources":["src/components/empty-state/empty-state.scss?tag=ix-empty-state&encapsulation=shadow","src/components/empty-state/empty-state.tsx"],"sourcesContent":["@import 'common-variables';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n\n  .label__subHeader {\n    color: var(--theme-color-soft-text);\n  }\n}\n\n:host(.emptyState.emptyState--large) {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  gap: $default-space;\n\n  .emptyState__icon {\n    width: 3.5rem;\n    height: 3.5rem;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    ix-icon {\n      transform: scale(1.75);\n    }\n  }\n\n  .emptyState__content {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: $large-space;\n\n    .content__label {\n      display: flex;\n      flex-direction: column;\n      justify-content: center;\n      align-items: center;\n      gap: $small-space;\n    }\n  }\n\n  .label__subHeader,\n  ix-typography {\n    text-align: center;\n  }\n}\n\n:host(.emptyState.emptyState--compact) {\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  gap: $default-space;\n\n  .emptyState__icon {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    height: $large-control-height;\n  }\n\n  .emptyState__content {\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    gap: $default-space;\n  }\n}\n\n:host(.emptyState.emptyState--compactBreak) {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  gap: $default-space;\n\n  .emptyState__icon {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    height: $large-control-height;\n  }\n\n  .emptyState__content {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    gap: $small-space;\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 EmptyStateLayout = 'large' | 'compact' | 'compactBreak';\n\n@Component({\n  tag: 'ix-empty-state',\n  styleUrl: 'empty-state.scss',\n  shadow: true,\n})\nexport class EmptyState {\n  /**\n   * Optional empty state layout - one of 'large', 'compact' or 'compactBreak'\n   */\n  @Prop() layout: EmptyStateLayout = 'large';\n\n  /**\n   * Optional empty state icon\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Empty state header\n   */\n  @Prop() header!: string;\n\n  /**\n   * Optional empty state sub header\n   */\n  @Prop() subHeader?: string;\n\n  /**\n   * Optional empty state action\n   */\n  @Prop() action?: string;\n\n  /**\n   * Empty state action click event\n   */\n  @Event() actionClick!: EventEmitter<void>;\n\n  render() {\n    return (\n      <Host class={`emptyState emptyState--${this.layout}`}>\n        {this.icon && (\n          <div class=\"emptyState__icon\">\n            {/* TODO: replace size for large layout with '56' if available */}\n            <ix-icon\n              name={this.icon}\n              size={this.layout === 'large' ? '32' : '32'}\n              color=\"color-soft-text\"\n            />\n          </div>\n        )}\n\n        <div class=\"emptyState__content\">\n          <div class=\"content__label\">\n            <ix-typography format={this.layout === 'large' ? 'h3' : 'body'}>\n              {this.header}\n            </ix-typography>\n\n            {this.subHeader && (\n              <div class=\"label__subHeader\">{this.subHeader}</div>\n            )}\n          </div>\n\n          {this.action && (\n            <div class=\"content__action\">\n              <ix-button onClick={() => this.actionClick.emit()}>\n                {this.action}\n              </ix-button>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,0zE,MCkBTC,EAAU,MALvB,WAAAC,CAAAC,G,mDASUC,KAAMC,OAAqB,OA+DpC,CApCC,MAAAC,GACE,OACEC,EAACC,EAAK,CAAAC,IAAA,2CAAAC,MAAO,0BAA0BN,KAAKC,UACzCD,KAAKO,MACJJ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,oBAETH,EACE,WAAAE,IAAA,2CAAAG,KAAMR,KAAKO,KACXE,KAAMT,KAAKC,SAAW,QAAU,KAAO,KACvCS,MAAM,qBAKZP,EAAK,OAAAE,IAAA,2CAAAC,MAAM,uBACTH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,kBACTH,EAAA,iBAAAE,IAAA,2CAAeM,OAAQX,KAAKC,SAAW,QAAU,KAAO,QACrDD,KAAKY,QAGPZ,KAAKa,WACJV,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oBAAoBN,KAAKa,YAIvCb,KAAKc,QACJX,EAAK,OAAAE,IAAA,2CAAAC,MAAM,mBACTH,EAAW,aAAAE,IAAA,2CAAAU,QAAS,IAAMf,KAAKgB,YAAYC,QACxCjB,KAAKc,U","ignoreList":[]}

package/dist/siemens-ix/p-97eb6c3c.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["templateBuilder","inputTemplate","templateString","forEach","row","reduce","pV","cV","cssGridCss","smQuery","mdQuery","lgQuery","mediaQueryCollection","name","query","CssGrid","constructor","hostRef","this","disposeMediaQueryListener","mediaQueries","componentWillRender","map","mediaQuery","window","matchMedia","callback","applyTemplate","push","addEventListener","Object","assign","disconnectedCallback","mq","index","removeEventListener","findNextTemplate","type","templates","typeIndex","findIndex","nextTemplate","active","find","matches","length","template","currentTemplate","render","style","h","Host","key"],"sources":["src/components/css-grid/builder.ts","src/components/css-grid/css-grid.scss?tag=ix-css-grid&encapsulation=shadow","src/components/css-grid/css-grid.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 */\nexport function templateBuilder(inputTemplate: string[][]) {\n  let templateString = '';\n\n  inputTemplate.forEach((row) => {\n    templateString += '\"';\n    templateString = row.reduce((pV, cV) => {\n      return `${pV} ${cV}`;\n    }, templateString);\n    templateString += '\"\\n';\n  });\n\n  return templateString;\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\n:host {\n  display: grid;\n  position: relative;\n  row-gap: $large-space;\n  column-gap: $large-space;\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, h, Host, Prop, State } from '@stencil/core';\nimport { templateBuilder } from './builder';\n\nconst smQuery = 'only screen and (max-width: 576px)';\nconst mdQuery = 'only screen and (max-width: 768px)';\nconst lgQuery = 'only screen and (max-width: 992px)';\n\nexport type CssGridTemplateType = 'sm' | 'md' | 'lg';\n\nconst mediaQueryCollection: Array<{\n  name: CssGridTemplateType;\n  query: string;\n}> = [\n  { name: 'sm', query: smQuery },\n  { name: 'md', query: mdQuery },\n  { name: 'lg', query: lgQuery },\n];\n\n/**\n * @internal\n */\n@Component({\n  tag: 'ix-css-grid',\n  styleUrl: 'css-grid.scss',\n  shadow: true,\n})\nexport class CssGrid {\n  /**\n   * Define css grid template\n   */\n  @Prop() templates?: Partial<Record<CssGridTemplateType, string[][]>>;\n\n  @State() currentTemplate?: string[][];\n\n  private disposeMediaQueryListener: ((event: MediaQueryListEvent) => void)[] =\n    [];\n  private mediaQueries: {\n    mediaQuery: MediaQueryList;\n    name: CssGridTemplateType;\n    query: string;\n  }[] = [];\n\n  componentWillRender() {\n    this.mediaQueries = mediaQueryCollection.map((query) => {\n      const mediaQuery = window.matchMedia(query.query);\n\n      const callback = () => {\n        this.applyTemplate();\n      };\n      this.disposeMediaQueryListener.push(callback);\n      mediaQuery.addEventListener('change', callback);\n\n      return {\n        ...query,\n        mediaQuery,\n      };\n    });\n\n    this.applyTemplate();\n  }\n\n  disconnectedCallback() {\n    this.mediaQueries.forEach((mq, index) => {\n      mq.mediaQuery.removeEventListener(\n        'change',\n        this.disposeMediaQueryListener[index]\n      );\n    });\n  }\n\n  private findNextTemplate(type: CssGridTemplateType): string[][] {\n    if (!this.templates) {\n      return [];\n    }\n    const typeIndex = this.mediaQueries.findIndex((mq) => mq.name === type);\n    const nextTemplate = this.templates[this.mediaQueries[typeIndex + 1].name];\n    if (!nextTemplate) {\n      return this.findNextTemplate(this.mediaQueries[typeIndex + 1].name);\n    }\n    return nextTemplate;\n  }\n\n  private applyTemplate() {\n    if (!this.templates) {\n      return;\n    }\n    let active = this.mediaQueries.find((mq) => mq.mediaQuery.matches);\n\n    if (!active) {\n      active = this.mediaQueries[this.mediaQueries.length - 1];\n    }\n\n    const template = this.templates[active.name];\n\n    if (template) {\n      this.currentTemplate = template;\n    } else {\n      this.currentTemplate = this.findNextTemplate(active.name);\n    }\n  }\n\n  render() {\n    const style: Record<string, string> = {};\n    if (this.currentTemplate && this.currentTemplate.length !== 0) {\n      style['grid-template-areas'] = templateBuilder(this.currentTemplate);\n    }\n    return (\n      <Host style={style}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAQM,SAAUA,EAAgBC,GAC9B,IAAIC,EAAiB,GAErBD,EAAcE,SAASC,IACrBF,GAAkB,IAClBA,EAAiBE,EAAIC,QAAO,CAACC,EAAIC,IACxB,GAAGD,KAAMC,KACfL,GACHA,GAAkB,KAAK,IAGzB,OAAOA,CACT,CCpBA,MAAMM,EAAa,gGCYnB,MAAMC,EAAU,qCAChB,MAAMC,EAAU,qCAChB,MAAMC,EAAU,qCAIhB,MAAMC,EAGD,CACH,CAAEC,KAAM,KAAMC,MAAOL,GACrB,CAAEI,KAAM,KAAMC,MAAOJ,GACrB,CAAEG,KAAM,KAAMC,MAAOH,I,MAWVI,EAAO,MALpB,WAAAC,CAAAC,G,UAaUC,KAAyBC,0BAC/B,GACMD,KAAYE,aAId,EAwEP,CAtEC,mBAAAC,GACEH,KAAKE,aAAeR,EAAqBU,KAAKR,IAC5C,MAAMS,EAAaC,OAAOC,WAAWX,EAAMA,OAE3C,MAAMY,EAAW,KACfR,KAAKS,eAAe,EAEtBT,KAAKC,0BAA0BS,KAAKF,GACpCH,EAAWM,iBAAiB,SAAUH,GAEtC,OACKI,OAAAC,OAAAD,OAAAC,OAAA,GAAAjB,GACH,CAAAS,cACA,IAGJL,KAAKS,e,CAGP,oBAAAK,GACEd,KAAKE,aAAajB,SAAQ,CAAC8B,EAAIC,KAC7BD,EAAGV,WAAWY,oBACZ,SACAjB,KAAKC,0BAA0Be,GAChC,G,CAIG,gBAAAE,CAAiBC,GACvB,IAAKnB,KAAKoB,UAAW,CACnB,MAAO,E,CAET,MAAMC,EAAYrB,KAAKE,aAAaoB,WAAWP,GAAOA,EAAGpB,OAASwB,IAClE,MAAMI,EAAevB,KAAKoB,UAAUpB,KAAKE,aAAamB,EAAY,GAAG1B,MACrE,IAAK4B,EAAc,CACjB,OAAOvB,KAAKkB,iBAAiBlB,KAAKE,aAAamB,EAAY,GAAG1B,K,CAEhE,OAAO4B,C,CAGD,aAAAd,GACN,IAAKT,KAAKoB,UAAW,CACnB,M,CAEF,IAAII,EAASxB,KAAKE,aAAauB,MAAMV,GAAOA,EAAGV,WAAWqB,UAE1D,IAAKF,EAAQ,CACXA,EAASxB,KAAKE,aAAaF,KAAKE,aAAayB,OAAS,E,CAGxD,MAAMC,EAAW5B,KAAKoB,UAAUI,EAAO7B,MAEvC,GAAIiC,EAAU,CACZ5B,KAAK6B,gBAAkBD,C,KAClB,CACL5B,KAAK6B,gBAAkB7B,KAAKkB,iBAAiBM,EAAO7B,K,EAIxD,MAAAmC,GACE,MAAMC,EAAgC,GACtC,GAAI/B,KAAK6B,iBAAmB7B,KAAK6B,gBAAgBF,SAAW,EAAG,CAC7DI,EAAM,uBAAyBjD,EAAgBkB,KAAK6B,gB,CAEtD,OACEG,EAACC,EAAK,CAAAC,IAAA,2CAAAH,MAAOA,GACXC,EAAa,QAAAE,IAAA,6C","ignoreList":[]}