@siemens/ix 3.0.0-alpha.0 → 3.0.0-alpha.1

package/dist/siemens-ix/p-2927de2b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["numberInputCss","numberInputIds","NumberInput","constructor","hostRef","this","value","required","disabled","readonly","isInvalid","isValid","isInfo","isWarning","isInvalidByRequired","inputRef","makeRef","slotEndRef","slotStartRef","numberInputId","touched","updateClassMappings","result","mapValidationResult","componentWillLoad","updateFormInternalValue","connectedCallback","disposableChangesAndVisibilityObservers","addDisposableChangesAndVisibilityObservers","hostElement","updatePaddings","bind","disconnectedCallback","_a","call","adjustPaddingForStartAndEnd","current","formInternals","setFormValue","toString","getAssociatedFormElement","form","hasValidValue","Promise","resolve","getNativeInputElement","waitForCurrent","focusInput","focus","isTouched","render","showStepperButtons","h","Host","key","class","id","label","helperText","invalidText","infoText","warningText","validText","showTextAsTooltip","controlRef","SlotStart","onSlotChange","InputElement","min","max","pattern","type","placeholder","onKeyPress","event","checkAllowedKeys","valueChange","emit","Number","onBlur","onInputBlur","SlotEnd","ghost","icon","iconMinus","size","onClick","stepDown","checkInternalValidity","iconPlus","stepUp","__decorate","HookValidationLifecycle","prototype"],"sources":["src/components/input/number-input.scss?tag=ix-number-input&encapsulation=shadow","src/components/input/number-input.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 './input.mixins.scss';\n\n@include input-field;\n\n:host {\n  .input-wrapper.show-stepper-buttons {\n    input[type='number'] {\n      min-width: 6rem;\n    }\n  }\n\n  .number-stepper-container {\n    display: flex;\n    position: relative;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    margin-right: 0.25rem;\n\n    &.container-hidden {\n      display: none;\n    }\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 { iconMinus, iconPlus } from '@siemens/ix-icons/icons';\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport {\n  HookValidationLifecycle,\n  IxInputFieldComponent,\n  ValidationResults,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\nimport { InputElement, SlotEnd, SlotStart } from './input.fc';\nimport {\n  addDisposableChangesAndVisibilityObservers,\n  adjustPaddingForStartAndEnd,\n  checkAllowedKeys,\n  checkInternalValidity,\n  DisposableChangesAndVisibilityObservers,\n  mapValidationResult,\n  onInputBlur,\n} from './input.util';\n\nlet numberInputIds = 0;\n\n/**\n * @since 2.6.0\n * @form-ready 2.6.0\n * @slot start - Element will be displayed at the start of the input\n * @slot end - Element will be displayed at the end of the input\n */\n@Component({\n  tag: 'ix-number-input',\n  styleUrl: 'number-input.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class NumberInput implements IxInputFieldComponent<number> {\n  @Element() hostElement!: HTMLIxNumberInputElement;\n  @AttachInternals() formInternals!: ElementInternals;\n\n  /**\n   * name of the input element\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /**\n   * placeholder of the input element\n   */\n  @Prop({ reflect: true }) placeholder?: string;\n\n  /**\n   * The value of the input field\n   */\n  @Prop({ reflect: true, mutable: true }) value: number = 0;\n\n  /**\n   * Indicates if the field is required\n   */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /**\n   * Disables the input field\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Indicates if the field is read-only\n   */\n  @Prop() readonly: boolean = false;\n\n  /**\n   * The helper text for the input field\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * The info text for the input field\n   */\n  @Prop() infoText?: string;\n\n  /**\n   * Indicates if the text should be shown as a tooltip\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * The valid text for the input field\n   */\n  @Prop() validText?: string;\n\n  /**\n   * The warning text for the input field\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * The label for the input field\n   */\n  @Prop({ reflect: true }) label?: string;\n\n  /**\n   * The error text for the input field\n   */\n  @Prop() invalidText?: string;\n\n  /**\n   * The pattern for the input field\n   */\n  @Prop() pattern?: string;\n\n  /**\n   * The minimum value for the input field\n   */\n  @Prop() min?: string | number;\n\n  /**\n   * The maximum value for the input field\n   */\n  @Prop() max?: string | number;\n\n  /**\n   * The allowed characters pattern for the input field\n   */\n  @Prop() allowedCharactersPattern?: string;\n\n  /**\n   * Indicates if the stepper buttons should be shown\n   */\n  @Prop() showStepperButtons?: boolean;\n\n  /**\n   * Event emitted when the value of the input field changes\n   */\n  @Event() valueChange!: EventEmitter<number>;\n\n  /**\n   * Event emitted when the validity state of the input field changes\n   */\n  @Event() validityStateChange!: EventEmitter<ValidityState>;\n\n  /**\n   * Event emitted when the input field loses focus\n   */\n  @Event() ixBlur!: EventEmitter<void>;\n\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n  @State() isInvalidByRequired = false;\n\n  private readonly inputRef = makeRef<HTMLInputElement>();\n  private readonly slotEndRef = makeRef<HTMLDivElement>();\n  private readonly slotStartRef = makeRef<HTMLDivElement>();\n  private readonly numberInputId = `number-input-${numberInputIds++}`;\n  private touched = false;\n\n  private disposableChangesAndVisibilityObservers?: DisposableChangesAndVisibilityObservers;\n\n  @HookValidationLifecycle()\n  updateClassMappings(result: ValidationResults) {\n    mapValidationResult(this, result);\n  }\n\n  componentWillLoad() {\n    this.updateFormInternalValue(this.value);\n  }\n\n  connectedCallback() {\n    this.disposableChangesAndVisibilityObservers =\n      addDisposableChangesAndVisibilityObservers(\n        this.hostElement,\n        this.updatePaddings.bind(this)\n      );\n  }\n\n  disconnectedCallback() {\n    this.disposableChangesAndVisibilityObservers?.();\n  }\n\n  private updatePaddings() {\n    adjustPaddingForStartAndEnd(\n      this.slotStartRef.current,\n      this.slotEndRef.current,\n      this.inputRef.current\n    );\n  }\n\n  updateFormInternalValue(value: number) {\n    this.formInternals.setFormValue(value.toString());\n    this.value = value;\n  }\n\n  /** @internal */\n  @Method()\n  async getAssociatedFormElement(): Promise<HTMLFormElement | null> {\n    return this.formInternals.form;\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(!!this.value);\n  }\n\n  /**\n   * Returns the native input element used under the hood\n   */\n  @Method()\n  getNativeInputElement(): Promise<HTMLInputElement> {\n    return this.inputRef.waitForCurrent();\n  }\n\n  /**\n   * Focuses the input field\n   */\n  @Method()\n  async focusInput(): Promise<void> {\n    return (await this.getNativeInputElement()).focus();\n  }\n\n  /**\n   * Returns true if the input field has been touched\n   * @internal\n   */\n  @Method()\n  isTouched(): Promise<boolean> {\n    return Promise.resolve(this.touched);\n  }\n\n  render() {\n    const showStepperButtons =\n      this.showStepperButtons && (this.disabled || this.readonly) === false;\n\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          readonly: this.readonly,\n        }}\n      >\n        <ix-field-wrapper\n          id={this.numberInputId}\n          required={this.required}\n          label={this.label}\n          helperText={this.helperText}\n          invalidText={this.invalidText}\n          infoText={this.infoText}\n          warningText={this.warningText}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          isInvalid={this.isInvalid}\n          isValid={this.isValid}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          controlRef={this.inputRef}\n        >\n          <div\n            class={{\n              'input-wrapper': true,\n              'show-stepper-buttons': !!this.showStepperButtons,\n            }}\n          >\n            <SlotStart\n              slotStartRef={this.slotStartRef}\n              onSlotChange={() => this.updatePaddings()}\n            ></SlotStart>\n\n            <InputElement\n              id={this.numberInputId}\n              readonly={this.readonly}\n              disabled={this.disabled}\n              min={this.min}\n              max={this.max}\n              pattern={this.pattern}\n              type={'number'}\n              isInvalid={this.isInvalid}\n              required={this.required}\n              value={this.value}\n              placeholder={this.placeholder}\n              inputRef={this.inputRef}\n              onKeyPress={(event) => checkAllowedKeys(this, event)}\n              valueChange={(value) => this.valueChange.emit(Number(value))}\n              updateFormInternalValue={(value) =>\n                this.updateFormInternalValue(Number(value))\n              }\n              onBlur={() => {\n                onInputBlur(this, this.inputRef.current);\n                this.touched = true;\n              }}\n            ></InputElement>\n            <SlotEnd\n              slotEndRef={this.slotEndRef}\n              onSlotChange={() => this.updatePaddings()}\n            >\n              <div\n                class={{\n                  'number-stepper-container': true,\n                  'container-hidden': !showStepperButtons,\n                }}\n              >\n                <ix-icon-button\n                  ghost\n                  icon={iconMinus}\n                  size=\"16\"\n                  class=\"number-stepper-button step-minus\"\n                  onClick={() => {\n                    if (!this.inputRef.current) {\n                      return;\n                    }\n                    this.inputRef.current.stepDown();\n                    checkInternalValidity(this, this.inputRef.current);\n                    this.updateFormInternalValue(\n                      Number(this.inputRef.current.value)\n                    );\n                    this.valueChange.emit(this.value);\n                  }}\n                ></ix-icon-button>\n                <ix-icon-button\n                  ghost\n                  icon={iconPlus}\n                  size=\"16\"\n                  class=\"number-stepper-button step-plus\"\n                  onClick={() => {\n                    if (!this.inputRef.current) {\n                      return;\n                    }\n                    this.inputRef.current.stepUp();\n                    checkInternalValidity(this, this.inputRef.current);\n                    this.updateFormInternalValue(\n                      Number(this.inputRef.current.value)\n                    );\n                    this.valueChange.emit(this.value);\n                  }}\n                ></ix-icon-button>\n              </div>\n            </SlotEnd>\n          </div>\n        </ix-field-wrapper>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-2aa40bcf.entry.js

@@ -0,0 +1,2 @@
+import{r,h as e,H as a}from"./p-DtF9fwpD.js";const o=":host{}: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{background-color:var(--theme-menu--background);width:100%;box-shadow:none;border:none;border-radius:unset;display:flex;flex-direction:column}:host .card.standaloneAppearance{box-shadow:0 0 2px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 12px 18px 0 rgba(0, 0, 0, 0.1);border-radius:4px}:host .card.rounded{border-radius:4px}:host .card.left{border-radius:4px 0 0 4px;height:100%}:host .card.right{border-radius:0 4px 4px 0;height:100%}:host .card .header{padding:1rem;flex:0 1 auto}:host .card .separator{border:1px solid var(--theme-datepicker-separator--background);width:100%;flex:0 1 auto}:host .card .content{padding:0 1rem 1rem 1rem;flex:1 1 auto;display:flex;flex-direction:column;justify-content:center}";const t=class{constructor(e){r(this,e);this.individual=true;this.corners="rounded"}cardClasses(){var r;return{card:true,standaloneAppearance:(r=this.standaloneAppearance)!==null&&r!==void 0?r:this.individual,rounded:this.corners==="rounded",left:this.corners==="left",right:this.corners==="right"}}render(){return e(a,{key:"9310b246c56469a92bf77d955c88bb4005d6c5a1"},e("div",{key:"041094bc9a9a9049bbcdc5f24f4987ee547bb7b0",class:this.cardClasses()},e("div",{key:"80c76215cebf46bb7cb9cb3caf0ff74e9dc6cbda",class:"header"},e("slot",{key:"e1844c4fb35169db3a9077bc6dcabd260a99629f",name:"header"})),e("div",{key:"49cbbfa20d3a2e2751a974152efb03ecaa74b128",class:"separator"}),e("div",{key:"6583ffd0762ad265b6e2c8ba2a536af743669abe",class:"content"},e("slot",{key:"ee6202f5162c4972ee04cf548aa0e541e62f994d"}))))}};t.style=o;export{t as ix_date_time_card};
+//# sourceMappingURL=p-2aa40bcf.entry.js.map

package/dist/siemens-ix/p-2aa40bcf.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dateTimeCardCss","DateTimeCard","constructor","hostRef","this","individual","corners","cardClasses","card","standaloneAppearance","_a","rounded","left","right","render","h","Host","key","class","name"],"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: 0 0 2px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.1),\n        0 12px 18px 0 rgba(0, 0, 0, 0.1);\n      border-radius: 4px;\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    .header {\n      padding: $default-space;\n      flex: 0 1 auto;\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      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}\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  /**\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    };\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.cardClasses()}>\n          <div class=\"header\">\n            <slot name=\"header\"></slot>\n          </div>\n\n          <div class=\"separator\"></div>\n\n          <div class=\"content\">\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6CAAA,MAAMA,EAAkB,i+C,MCqBXC,EAAY,MALzB,WAAAC,CAAAC,G,UAYUC,KAAUC,WAAY,KAKtBD,KAAOE,QAAwB,SA6BxC,CA3BS,WAAAC,G,MACN,MAAO,CACLC,KAAM,KACNC,sBAAsBC,EAAAN,KAAKK,wBAAwB,MAAAC,SAAA,EAAAA,EAAAN,KAAKC,WACxDM,QAASP,KAAKE,UAAY,UAC1BM,KAAMR,KAAKE,UAAY,OACvBO,MAAOT,KAAKE,UAAY,Q,CAI5B,MAAAQ,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAOd,KAAKG,eACfQ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,UACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,YAGbJ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,cAEXH,EAAK,OAAAE,IAAA,2CAAAC,MAAM,WACTH,EAAA,QAAAE,IAAA,+C","ignoreList":[]}

package/dist/siemens-ix/p-2c95e67c.entry.js

@@ -0,0 +1,2 @@
+export{a as ix_menu_settings}from"./p-z5yZxfe2.js";import"./p-DtF9fwpD.js";import"./p-CrTP-icT.js";
+//# sourceMappingURL=p-2c95e67c.entry.js.map

package/dist/siemens-ix/p-2c95e67c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}

package/dist/siemens-ix/p-2d9eb88d.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as o,g as r}from"./p-DtF9fwpD.js";const a=":host{min-width:11.937rem;max-width:11.937rem;width:11.937rem;display:flex;flex-direction:column;border:1px solid var(--theme-tile--border);border-radius:var(--theme-tile--border-radius);background-color:var(--theme-color-2);color:var(--theme-color-std-text);box-shadow:var(--theme-tile--box-shadow)}: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 .tile-header{display:flex;align-items:center;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host .tile-header,:host .tile-subheader,:host .tile-content,:host .tile-footer{padding:0 1rem}:host .tile-header,:host .tile-content{flex-grow:1}:host .tile-header.has-content{display:flex;height:2.5rem;max-height:2.5rem;padding-inline-end:0.5rem}:host .tile-subheader{color:var(--theme-btn-invisible-secondary--color);flex-grow:0}:host .tile-footer.has-content{border-block-start:1px solid var(--theme-color-1);height:2.5rem}:host(.tile-small){height:2.5rem;min-height:2.5rem;max-height:2.5rem}:host(.tile-medium){height:5rem;min-height:5rem;max-height:5rem}:host(.tile-big){height:10rem;min-height:10rem;max-height:10rem}:host(:active),:host(:focus-visible),:host(:visited){outline:none}";const s=class{constructor(t){e(this,t);this.size="medium";this.hasHeaderSlot=false;this.hasFooterSlot=false}handleHeaderSlotChange(){this.hasHeaderSlot=!!this.hostElement.querySelector('[slot="header"]')}handleFooterSlotChange(){this.hasFooterSlot=!!this.hostElement.querySelector('[slot="footer"]')}render(){return t(o,{key:"9d7bee223ebb60d5b7b833b83a8978a6de4312c3",class:{"tile-small":this.size==="small","tile-medium":this.size==="medium","tile-big":this.size==="big"}},t("div",{key:"ef1cd8af669f9ac371851871363af07c29621fb9",class:{"tile-header":true,"has-content":this.hasHeaderSlot}},t("slot",{key:"c30d7aa4b1a03603afc4a15a319fc8016019ce67",name:"header",onSlotchange:()=>this.handleHeaderSlotChange()})),t("div",{key:"8ff416fde19e1de8e780ce67cfeb61b363f34fd8",class:"tile-subheader"},t("slot",{key:"bb55d56b37f157caa7647c08e45b604241e9324e",name:"subheader"})),t("div",{key:"6b5925d40599b48f9b5203a43c036f046b7b06fe",class:"tile-content"},t("slot",{key:"cfd0d916840326385b7e31e54e7a8b1d75c07439"})),t("div",{key:"e7a8280e2fb1fd1975562cca52cc4636a68b2f51",class:{"tile-footer":true,"has-content":this.hasFooterSlot}},t("slot",{key:"da347b625fcc997e61de7d1e712341aa81a963d1",name:"footer",onSlotchange:()=>this.handleFooterSlotChange()})))}get hostElement(){return r(this)}};s.style=a;export{s as ix_tile};
+//# sourceMappingURL=p-2d9eb88d.entry.js.map

package/dist/siemens-ix/p-2d9eb88d.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["tileCss","Tile","constructor","hostRef","this","size","hasHeaderSlot","hasFooterSlot","handleHeaderSlotChange","hostElement","querySelector","handleFooterSlotChange","render","h","Host","key","class","name","onSlotchange"],"sources":["src/components/tile/tile.scss?tag=ix-tile&encapsulation=shadow","src/components/tile/tile.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 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n@import 'legacy/mixins/fonts';\n\n@mixin set-height($height) {\n  height: $height;\n  min-height: $height;\n  max-height: $height;\n}\n\n$heightSmall: 2.5rem;\n$heightMedium: 5rem;\n$heightBig: 10rem;\n$width: 11.937rem;\n\n:host {\n  @include ix-component;\n\n  min-width: $width;\n  max-width: $width;\n  width: $width;\n\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--theme-tile--border);\n  border-radius: var(--theme-tile--border-radius);\n\n  background-color: var(--theme-color-2);\n  color: var(--theme-color-std-text);\n  box-shadow: var(--theme-tile--box-shadow);\n\n  // @each $key, $value in $color-map-status {\n  //   &.tile-#{$key} {\n  //     background-color: #{$value};\n  //     color: automatic-text-color($value, 65);\n  //   }\n  // }\n\n  .tile-header {\n    display: flex;\n    align-items: center;\n\n    @include text-l-title;\n  }\n\n  .tile-header,\n  .tile-subheader,\n  .tile-content,\n  .tile-footer {\n    padding: 0 $default-space;\n  }\n\n  .tile-header,\n  .tile-content {\n    flex-grow: 1;\n  }\n\n  .tile-header.has-content {\n    display: flex;\n    height: $large-control-height;\n    max-height: $large-control-height;\n    padding-inline-end: $small-space;\n  }\n\n  .tile-subheader {\n    color: var(--theme-btn-invisible-secondary--color);\n    flex-grow: 0;\n  }\n\n  .tile-footer.has-content {\n    border-block-start: 1px solid var(--theme-color-1);\n    height: $large-control-height;\n  }\n}\n\n:host(.tile-small) {\n  @include set-height($heightSmall);\n}\n\n:host(.tile-medium) {\n  @include set-height($heightMedium);\n}\n\n:host(.tile-big) {\n  @include set-height($heightBig);\n}\n\n:host(:active),\n:host(:focus-visible),\n:host(:visited) {\n  outline: none;\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, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'ix-tile',\n  styleUrl: 'tile.scss',\n  shadow: true,\n})\nexport class Tile {\n  @Element() hostElement!: HTMLIxTileElement;\n\n  /**\n   * Size of the tile - one of 'small', 'medium' or 'large'\n   */\n  @Prop() size: 'small' | 'medium' | 'big' = 'medium';\n\n  @State() hasHeaderSlot: boolean = false;\n  @State() hasFooterSlot: boolean = false;\n\n  handleHeaderSlotChange() {\n    this.hasHeaderSlot = !!this.hostElement.querySelector('[slot=\"header\"]');\n  }\n\n  handleFooterSlotChange() {\n    this.hasFooterSlot = !!this.hostElement.querySelector('[slot=\"footer\"]');\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'tile-small': this.size === 'small',\n          'tile-medium': this.size === 'medium',\n          'tile-big': this.size === 'big',\n        }}\n      >\n        <div\n          class={{\n            'tile-header': true,\n            'has-content': this.hasHeaderSlot,\n          }}\n        >\n          <slot\n            name=\"header\"\n            onSlotchange={() => this.handleHeaderSlotChange()}\n          ></slot>\n        </div>\n        <div class=\"tile-subheader\">\n          <slot name=\"subheader\"></slot>\n        </div>\n        <div class=\"tile-content\">\n          <slot></slot>\n        </div>\n        <div\n          class={{\n            'tile-footer': true,\n            'has-content': this.hasFooterSlot,\n          }}\n        >\n          <slot\n            name=\"footer\"\n            onSlotchange={() => this.handleFooterSlotChange()}\n          ></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAU,w8D,MCgBHC,EAAI,MALjB,WAAAC,CAAAC,G,UAWUC,KAAIC,KAA+B,SAElCD,KAAaE,cAAY,MACzBF,KAAaG,cAAY,KAkDnC,CAhDC,sBAAAC,GACEJ,KAAKE,gBAAkBF,KAAKK,YAAYC,cAAc,kB,CAGxD,sBAAAC,GACEP,KAAKG,gBAAkBH,KAAKK,YAAYC,cAAc,kB,CAGxD,MAAAE,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,aAAcZ,KAAKC,OAAS,QAC5B,cAAeD,KAAKC,OAAS,SAC7B,WAAYD,KAAKC,OAAS,QAG5BQ,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,cAAe,KACf,cAAeZ,KAAKE,gBAGtBO,EAAA,QAAAE,IAAA,2CACEE,KAAK,SACLC,aAAc,IAAMd,KAAKI,4BAG7BK,EAAK,OAAAE,IAAA,2CAAAC,MAAM,kBACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,eAEbJ,EAAK,OAAAE,IAAA,2CAAAC,MAAM,gBACTH,EAAA,QAAAE,IAAA,8CAEFF,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,cAAe,KACf,cAAeZ,KAAKG,gBAGtBM,EAAA,QAAAE,IAAA,2CACEE,KAAK,SACLC,aAAc,IAAMd,KAAKO,4B","ignoreList":[]}

package/dist/siemens-ix/p-316cf983.entry.js

@@ -0,0 +1,2 @@
+import{r,h as t,H as e,g as o}from"./p-DtF9fwpD.js";import{h as a}from"./p-i60z1FJC.js";const s=":host{display:flex;flex-direction:column;position:relative;padding:1.5rem 0rem 0.25rem 2rem;width:100%;height:100%;overflow:hidden}: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 .content{flex-grow:1;overflow:auto;padding-right:1.5rem;position:relative}:host .content-header.slotted{margin-bottom:1rem;padding-right:1.5rem}";const b=class{constructor(t){r(this,t);this.isContentHeaderSlotted=false}get contentHeaderSlot(){return this.hostElement.shadowRoot.querySelector(".content-header slot")}render(){return t(e,{key:"5ff3dde4c94bd5f40598a6b8fc9043ab2755c9a7"},t("div",{key:"cb2d5d8d011649e5f2cb67d8b7857b7bd096ca44",class:{"content-header":true,slotted:this.isContentHeaderSlotted}},t("slot",{key:"1a0c6b612ff4364e6bdd10b15745160925b61efd",name:"header",onSlotchange:()=>{this.isContentHeaderSlotted=a(this.contentHeaderSlot)}})),t("div",{key:"5eabaf6bcd0c33d982bd1b88862873383b58fae6",class:"content"},t("slot",{key:"25fa713021e9c01c08282da185c2fc14b6d06b3f"})))}get hostElement(){return o(this)}};b.style=s;export{b as ix_content};
+//# sourceMappingURL=p-316cf983.entry.js.map

package/dist/siemens-ix/p-316cf983.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["contentCss","Content","constructor","hostRef","this","isContentHeaderSlotted","contentHeaderSlot","hostElement","shadowRoot","querySelector","render","h","Host","key","class","slotted","name","onSlotchange","hasSlottedElements"],"sources":["src/components/content/content.scss?tag=ix-content&encapsulation=shadow","src/components/content/content.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:host {\n  @include ix-component;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  padding: 1.5rem 0rem 0.25rem 2rem;\n\n  width: 100%;\n  height: 100%;\n\n  overflow: hidden;\n\n  .content {\n    flex-grow: 1;\n    overflow: auto;\n    padding-right: 1.5rem;\n    position: relative;\n  }\n\n  .content-header.slotted {\n    margin-bottom: 1rem;\n    padding-right: 1.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 { Component, Element, h, Host, State } from '@stencil/core';\nimport { hasSlottedElements } from '../utils/shadow-dom';\n\n/**\n * @since 2.1.0\n * @slot header - Display content at the top of the content page\n */\n@Component({\n  tag: 'ix-content',\n  styleUrl: 'content.scss',\n  shadow: true,\n})\nexport class Content {\n  @Element() hostElement!: HTMLIxContentElement;\n\n  @State() isContentHeaderSlotted = false;\n\n  get contentHeaderSlot() {\n    return this.hostElement.shadowRoot!.querySelector(\n      '.content-header slot'\n    ) as HTMLSlotElement;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            'content-header': true,\n            slotted: this.isContentHeaderSlotted,\n          }}\n        >\n          <slot\n            name=\"header\"\n            onSlotchange={() => {\n              this.isContentHeaderSlotted = hasSlottedElements(\n                this.contentHeaderSlot\n              );\n            }}\n          ></slot>\n        </div>\n        <div class=\"content\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"wFAAA,MAAMA,EAAa,ohC,MCqBNC,EAAO,MALpB,WAAAC,CAAAC,G,UAQWC,KAAsBC,uBAAG,KAgCnC,CA9BC,qBAAIC,GACF,OAAOF,KAAKG,YAAYC,WAAYC,cAClC,uB,CAIJ,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CACEC,MAAO,CACL,iBAAkB,KAClBC,QAASX,KAAKC,yBAGhBM,EAAA,QAAAE,IAAA,2CACEG,KAAK,SACLC,aAAc,KACZb,KAAKC,uBAAyBa,EAC5Bd,KAAKE,kBACN,KAIPK,EAAK,OAAAE,IAAA,2CAAAC,MAAM,WACTH,EAAa,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/siemens-ix/p-320281ab.entry.js

@@ -0,0 +1,2 @@
+import{r as o,c as e,h as r,H as t,F as n,g as i}from"./p-DtF9fwpD.js";import{a as d}from"./p-Ou74PMQs.js";import{B as a}from"./p-CZ1HWy6s.js";import{b as s}from"./p-Bb7pDeaQ.js";import{f as l}from"./p-CrTP-icT.js";const b=":host{display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host button{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host ix-icon{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none}:host(.disabled){cursor:default}:host .btn-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-danger,:host .btn-danger.focus,:host .btn-danger:focus-visible{background-color:var(--theme-btn-danger--background);color:var(--theme-btn-danger--color);--ix-button-color:var(--theme-btn-danger--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-danger--border-color);border-style:solid}:host .btn-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger.selected:not(.disabled):not(:disabled):active,:host .btn-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-danger--border-color--hover);background-color:var(--theme-btn-danger--background--hover);color:var(--theme-btn-danger--color--hover)}:host .btn-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-danger:not(.disabled):not(:disabled):active,:host .btn-danger:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-danger--border-color--active);background-color:var(--theme-btn-danger--background--active);color:var(--theme-btn-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-danger.disabled,:host(.disabled) .btn-danger:disabled{pointer-events:none;border-color:var(--theme-btn-danger--border-color--disabled);background-color:var(--theme-btn-danger--background--disabled);color:var(--theme-btn-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-danger--color--disabled)}:host .btn-outline-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-danger,:host .btn-outline-danger.focus,:host .btn-outline-danger:focus-visible{background-color:var(--theme-btn-outline-danger--background);color:var(--theme-btn-outline-danger--color);--ix-button-color:var(--theme-btn-outline-danger--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-danger--border-color);border-style:solid}:host .btn-outline-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger.selected:not(.disabled):not(:disabled):active,:host .btn-outline-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-danger--border-color--hover);background-color:var(--theme-btn-outline-danger--background--hover);color:var(--theme-btn-outline-danger--color--hover)}:host .btn-outline-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-danger:not(.disabled):not(:disabled):active,:host .btn-outline-danger:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-danger--border-color--active);background-color:var(--theme-btn-outline-danger--background--active);color:var(--theme-btn-outline-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-danger.disabled,:host(.disabled) .btn-outline-danger:disabled{pointer-events:none;border-color:var(--theme-btn-outline-danger--border-color--disabled);background-color:var(--theme-btn-outline-danger--background--disabled);color:var(--theme-btn-outline-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-danger--color--disabled)}:host .btn-invisible-danger{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-danger,:host .btn-invisible-danger.focus,:host .btn-invisible-danger:focus-visible{background-color:var(--theme-btn-invisible-danger--background);color:var(--theme-btn-invisible-danger--color);--ix-button-color:var(--theme-btn-invisible-danger--color);border-color:transparent}:host .btn-invisible-danger:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-danger.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-danger.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-danger--background--hover);color:var(--theme-btn-invisible-danger--color--hover)}:host .btn-invisible-danger:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-danger:not(.disabled):not(:disabled):active,:host .btn-invisible-danger:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-danger--background--active);color:var(--theme-btn-invisible-danger--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-danger.disabled,:host(.disabled) .btn-invisible-danger:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-danger--background--disabled);color:var(--theme-btn-invisible-danger--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-danger--color--disabled)}:host .btn-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-primary,:host .btn-primary.focus,:host .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}:host .btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):active,:host .btn-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):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)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):active,:host .btn-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-primary.disabled,:host(.disabled) .btn-primary:disabled{pointer-events:none;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)}:host .btn-outline-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-primary,:host .btn-outline-primary.focus,:host .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}:host .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)}:host .btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):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)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):active,:host .btn-outline-primary:not(.disabled):not(:disabled).active{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)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-primary.disabled,:host(.disabled) .btn-outline-primary:disabled{pointer-events:none;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)}:host .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-primary,:host .btn-invisible-primary.focus,:host .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}:host .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)}:host .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):active,:host .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-primary.disabled,:host(.disabled) .btn-invisible-primary:disabled{pointer-events:none;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)}:host .btn-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-secondary,:host .btn-secondary.focus,:host .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}:host .btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):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)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):active,:host .btn-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-secondary.disabled,:host(.disabled) .btn-secondary:disabled{pointer-events:none;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)}:host .btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-secondary,:host .btn-outline-secondary.focus,:host .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}:host .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)}:host .btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):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)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):active,:host .btn-outline-secondary:not(.disabled):not(:disabled).active{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)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-secondary.disabled,:host(.disabled) .btn-outline-secondary:disabled{pointer-events:none;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)}:host .btn-invisible-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-secondary,:host .btn-invisible-secondary.focus,:host .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}:host .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)}:host .btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-secondary.disabled,:host(.disabled) .btn-invisible-secondary:disabled{pointer-events:none;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)}:host{min-width:5rem}:host{display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host button{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host ix-icon{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none}:host(.disabled){cursor:default}:host .btn-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-primary,:host .btn-primary.focus,:host .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}:host .btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):active,:host .btn-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):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)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):active,:host .btn-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-primary.disabled,:host(.disabled) .btn-primary:disabled{pointer-events:none;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)}:host .btn-outline-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-primary,:host .btn-outline-primary.focus,:host .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}:host .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)}:host .btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):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)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):active,:host .btn-outline-primary:not(.disabled):not(:disabled).active{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)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-primary.disabled,:host(.disabled) .btn-outline-primary:disabled{pointer-events:none;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)}:host .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-primary,:host .btn-invisible-primary.focus,:host .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}:host .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)}:host .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):active,:host .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-primary.disabled,:host(.disabled) .btn-invisible-primary:disabled{pointer-events:none;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)}:host .btn-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-secondary,:host .btn-secondary.focus,:host .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}:host .btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):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)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):active,:host .btn-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-secondary.disabled,:host(.disabled) .btn-secondary:disabled{pointer-events:none;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)}:host .btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-secondary,:host .btn-outline-secondary.focus,:host .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}:host .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)}:host .btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):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)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):active,:host .btn-outline-secondary:not(.disabled):not(:disabled).active{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)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-secondary.disabled,:host(.disabled) .btn-outline-secondary:disabled{pointer-events:none;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)}:host .btn-invisible-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-secondary,:host .btn-invisible-secondary.focus,:host .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}:host .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)}:host .btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-secondary.disabled,:host(.disabled) .btn-invisible-secondary:disabled{pointer-events:none;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)}:host{display:flex;position:relative;flex-direction:row;flex-wrap:nowrap;align-items:center;margin-right:0.25rem;max-width:15rem;min-width:0}: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 li{display:contents}:host .btn{pointer-events:all;width:-moz-fit-content;width:fit-content;padding-right:0;padding-left:0.25rem}:host .chevron{pointer-events:none;margin-left:0.5rem;margin-right:0rem;color:var(--theme-color-soft-text)}:host ::slotted(a[href]){text-decoration:none !important}:host ::slotted(a[href]:active){text-decoration:none !important}:host(:last-child) .btn:not(.dropdown-trigger){color:var(--theme-color-soft-text)}:host(.hide-chevron){cursor:default}:host(.hide-chevron) .btn{padding-right:0.5rem;pointer-events:none}:host(.invisible){display:none}:host(:focus-visible){outline:none}";const c=class{constructor(r){o(this,r);this.itemClick=e(this,"itemClick",7);this.ghost=true;this.visible=true;this.showChevron=true;this.isDropdownTrigger=false}componentDidLoad(){this.animationFadeIn()}componentWillLoad(){this.a11y=s(this.hostElement,["aria-describedby","aria-controls","aria-expanded"])}animationFadeIn(){d({targets:this.hostElement,duration:150,opacity:[0,1],translateX:["-100%","0%"],easing:"linear"})}render(){const o={variant:this.ghost?"primary":"secondary",outline:false,ghost:this.ghost,iconOnly:false,iconOval:false,disabled:false,icon:this.icon,iconSize:"16",loading:false,selected:false,type:"button",tabIndex:this.hostElement.tabIndex!==-1?this.hostElement.tabIndex:0,extraClasses:{"dropdown-trigger":this.isDropdownTrigger},ariaAttributes:this.a11y};if(!this.visible){return r(t,{class:"invisible"})}return r(t,{class:{"hide-chevron":!this.showChevron},onClick:()=>this.itemClick.emit(this.label)},r("li",null,r(a,Object.assign({},o,{afterContent:r(n,null,this.showChevron?r("ix-icon",{name:l,size:"16",class:"chevron"}):null)}),this.label,r("slot",null))))}get hostElement(){return i(this)}};c.style=b;export{c as ix_breadcrumb_item};
+//# sourceMappingURL=p-320281ab.entry.js.map

package/dist/siemens-ix/p-320281ab.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["breadcrumbItemCss","BreadcrumbItem","constructor","hostRef","this","ghost","visible","showChevron","isDropdownTrigger","componentDidLoad","animationFadeIn","componentWillLoad","a11y","a11yHostAttributes","hostElement","animejs","targets","duration","opacity","translateX","easing","render","props","variant","outline","iconOnly","iconOval","disabled","icon","iconSize","loading","selected","type","tabIndex","extraClasses","ariaAttributes","h","Host","class","onClick","itemClick","emit","label","BaseButton","Object","assign","afterContent","Fragment","name","iconChevronRightSmall","size"],"sources":["src/components/breadcrumb-item/breadcrumb-item.scss?tag=ix-breadcrumb-item&encapsulation=shadow","src/components/breadcrumb-item/breadcrumb-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 'mixins/shadow-dom/component';\n@import '../button/button-mixin';\n@import '../button/button';\n\n@include all-btn-variants;\n\n:host {\n  @include ix-component;\n  display: flex;\n  position: relative;\n  flex-direction: row;\n  flex-wrap: nowrap;\n  align-items: center;\n  margin-right: 0.25rem;\n  max-width: 15rem;\n  min-width: 0;\n\n  li {\n    display: contents;\n  }\n\n  .btn {\n    pointer-events: all;\n    width: fit-content;\n    padding-right: 0;\n    padding-left: 0.25rem;\n  }\n\n  .chevron {\n    pointer-events: none;\n    margin-left: 0.5rem;\n    margin-right: 0rem;\n    color: var(--theme-color-soft-text);\n  }\n\n  ::slotted(a[href]) {\n    text-decoration: none !important;\n  }\n\n  ::slotted(a[href]:active) {\n    text-decoration: none !important;\n  }\n}\n\n:host(:last-child) {\n  .btn:not(.dropdown-trigger) {\n    color: var(--theme-color-soft-text);\n  }\n}\n\n:host(.hide-chevron) {\n  cursor: default;\n\n  .btn {\n    padding-right: 0.5rem;\n    pointer-events: none;\n  }\n}\n\n:host(.invisible) {\n  display: none;\n}\n\n:host(:focus-visible) {\n  outline: none;\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  Fragment,\n  h,\n  Host,\n  Prop,\n  State,\n} from '@stencil/core';\nimport animejs from 'animejs';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { a11yHostAttributes } from '../utils/a11y';\nimport { iconChevronRightSmall } from '@siemens/ix-icons/icons';\n\nexport type BreadcrumbItemLinkTarget =\n  | '_self'\n  | '_blank'\n  | '_parent'\n  | '_top'\n  | string;\n\n@Component({\n  tag: 'ix-breadcrumb-item',\n  styleUrl: 'breadcrumb-item.scss',\n  shadow: true,\n})\nexport class BreadcrumbItem {\n  @Element() hostElement!: HTMLIxBreadcrumbItemElement;\n\n  /**\n   * Breadcrumb label\n   */\n  @Prop() label?: string;\n\n  /**\n   * Icon to be displayed next ot the label\n   */\n  @Prop() icon?: string;\n\n  /**@internal */\n  @Prop() ghost: boolean = true;\n\n  /**@internal */\n  @Prop() visible = true;\n\n  /**@internal */\n  @Prop() showChevron = true;\n\n  /** @internal */\n  @Prop() isDropdownTrigger = false;\n\n  /**@internal */\n  @Event() itemClick!: EventEmitter<string>;\n\n  @State() a11y: any;\n\n  componentDidLoad() {\n    this.animationFadeIn();\n  }\n\n  componentWillLoad() {\n    this.a11y = a11yHostAttributes(this.hostElement, [\n      'aria-describedby',\n      'aria-controls',\n      'aria-expanded',\n    ]);\n  }\n\n  animationFadeIn() {\n    animejs({\n      targets: this.hostElement,\n      duration: 150,\n      opacity: [0, 1],\n      translateX: ['-100%', '0%'],\n      easing: 'linear',\n    });\n  }\n\n  render() {\n    const props: BaseButtonProps = {\n      variant: this.ghost ? 'primary' : 'secondary',\n      outline: false,\n      ghost: this.ghost,\n      iconOnly: false,\n      iconOval: false,\n      disabled: false,\n      icon: this.icon,\n      iconSize: '16',\n      loading: false,\n      selected: false,\n      type: 'button',\n      tabIndex:\n        this.hostElement.tabIndex !== -1 ? this.hostElement.tabIndex : 0,\n      extraClasses: {\n        'dropdown-trigger': this.isDropdownTrigger,\n      },\n      ariaAttributes: this.a11y,\n    };\n\n    if (!this.visible) {\n      return <Host class={'invisible'}></Host>;\n    }\n\n    return (\n      <Host\n        class={{\n          'hide-chevron': !this.showChevron,\n        }}\n        onClick={() => this.itemClick.emit(this.label)}\n      >\n        <li>\n          <BaseButton\n            {...props}\n            afterContent={\n              <Fragment>\n                {this.showChevron ? (\n                  <ix-icon\n                    name={iconChevronRightSmall}\n                    size=\"16\"\n                    class={'chevron'}\n                  ></ix-icon>\n                ) : null}\n              </Fragment>\n            }\n          >\n            {this.label}\n            <slot></slot>\n          </BaseButton>\n        </li>\n      </Host>\n    );\n  }\n}\n"],"mappings":"uNAAA,MAAMA,EAAoB,w4sC,MCqCbC,EAAc,MAL3B,WAAAC,CAAAC,G,+CAmBUC,KAAKC,MAAY,KAGjBD,KAAOE,QAAG,KAGVF,KAAWG,YAAG,KAGdH,KAAiBI,kBAAG,KAmF7B,CA5EC,gBAAAC,GACEL,KAAKM,iB,CAGP,iBAAAC,GACEP,KAAKQ,KAAOC,EAAmBT,KAAKU,YAAa,CAC/C,mBACA,gBACA,iB,CAIJ,eAAAJ,GACEK,EAAQ,CACNC,QAASZ,KAAKU,YACdG,SAAU,IACVC,QAAS,CAAC,EAAG,GACbC,WAAY,CAAC,QAAS,MACtBC,OAAQ,U,CAIZ,MAAAC,GACE,MAAMC,EAAyB,CAC7BC,QAASnB,KAAKC,MAAQ,UAAY,YAClCmB,QAAS,MACTnB,MAAOD,KAAKC,MACZoB,SAAU,MACVC,SAAU,MACVC,SAAU,MACVC,KAAMxB,KAAKwB,KACXC,SAAU,KACVC,QAAS,MACTC,SAAU,MACVC,KAAM,SACNC,SACE7B,KAAKU,YAAYmB,YAAa,EAAK7B,KAAKU,YAAYmB,SAAW,EACjEC,aAAc,CACZ,mBAAoB9B,KAAKI,mBAE3B2B,eAAgB/B,KAAKQ,MAGvB,IAAKR,KAAKE,QAAS,CACjB,OAAO8B,EAACC,EAAI,CAACC,MAAO,a,CAGtB,OACEF,EAACC,EAAI,CACHC,MAAO,CACL,gBAAiBlC,KAAKG,aAExBgC,QAAS,IAAMnC,KAAKoC,UAAUC,KAAKrC,KAAKsC,QAExCN,EAAA,UACEA,EAACO,EAAUC,OAAAC,OAAA,GACLvB,EAAK,CACTwB,aACEV,EAACW,EAAQ,KACN3C,KAAKG,YACJ6B,EAAA,WACEY,KAAMC,EACNC,KAAK,KACLZ,MAAO,YAEP,QAIPlC,KAAKsC,MACNN,EAAA,e","ignoreList":[]}

package/dist/siemens-ix/p-32612a51.entry.js

@@ -0,0 +1,2 @@
+import{r as t,d as r,h as a,F as e,H as o,g as i,c as s}from"./p-DtF9fwpD.js";import{B as n}from"./p-CZ1HWy6s.js";import{c as l,h as c}from"./p-i60z1FJC.js";import{m as b}from"./p-bcj7UEIC.js";const h=":host{display:flex;position:relative;width:-moz-fit-content;width:fit-content}: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 .avatar{display:flex;align-items:center}:host .avatar>.avatar-image{height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px}:host .avatar>.avatar-initials{display:flex;align-items:center;justify-content:center;height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px;background-color:var(--theme-avatar--background);color:var(--theme-avatar--color)}:host .avatar #avatar-path-background{fill:var(--theme-avatar--background)}:host .avatar #avatar-path-person{fill:var(--theme-avatar--color)}:host .user-info{display:flex;flex-direction:row;position:relative;height:2.5rem;padding:1rem;width:12.75rem;min-width:12.75rem;max-width:12.75rem;gap:1rem}:host .user-info .avatar{width:2rem;pointer-events:none}:host .user-info .user{display:flex;position:relative;flex-direction:column;justify-content:center;max-width:10rem;width:100%;overflow:hidden}:host .user-info .username{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .user-info .extra{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host(.avatar-button) button{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem;padding:0px;border-radius:100px !important}:host(.avatar-button) .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host(.avatar-button) .btn-invisible-primary,:host(.avatar-button) .btn-invisible-primary.focus,:host(.avatar-button) .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}:host(.avatar-button) .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)}:host(.avatar-button) .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host(.avatar-button) .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled):active,:host(.avatar-button) .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.avatar-button) .avatar{transform:scale(0.8)}";function d(t){const{initials:r}=t;if(r){return a("div",{class:"avatar-initials"},r)}return a("svg",{class:"avatar-image",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32"},a("g",{fill:"none","fill-rule":"evenodd"},a("path",{id:"avatar-path-background",d:"M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n          16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z"}),a("path",{id:"avatar-path-person",d:"M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n        6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n        9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n        6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z"})))}function v(t){return a("div",{class:"avatar"},t.image?a("img",{src:t.image,class:"avatar-image"}):a(d,{initials:t.initials}))}function m(t){return a(e,null,a("div",{class:"user-info",onClick:t=>t.preventDefault()},a(v,{image:t.image,initials:t.initials}),a("div",{class:"user"},a("div",{class:"username"},t.userName),t.extra&&a("ix-typography",{class:"extra","text-color":"soft"},t.extra))))}const u=class{constructor(r){t(this,r);this.isClosestApplicationHeader=false;this.hasSlottedElements=false}componentWillLoad(){const t=l("ix-application-header",this.hostElement);this.isClosestApplicationHeader=t!==null}async slottedChanged(){this.hasSlottedElements=c(this.slotElement)}resolveAvatarTrigger(){return new Promise(((t,a)=>{r((()=>{const r=this.hostElement.shadowRoot.querySelector("button");if(r){t(r)}else{a(new Error("ix-avatar - trigger element not found"))}}))}))}onDropdownClick(t){if(t.target===this.dropdownElement){t.preventDefault()}}render(){if(this.isClosestApplicationHeader){return a(o,{slot:"ix-application-header-avatar",class:"avatar-button"},a(n,{disabled:false,ghost:true,iconOval:false,icon:undefined,iconOnly:false,loading:false,outline:false,selected:false,type:"button",variant:"primary"},a(v,{image:this.image,initials:this.initials})),a("ix-dropdown",{ref:t=>this.dropdownElement=t,trigger:this.resolveAvatarTrigger(),class:"avatar-dropdown",onClick:t=>this.onDropdownClick(t)},this.username&&a(e,null,a(m,{extra:this.extra,image:this.image,initials:this.initials,userName:this.username}),this.hasSlottedElements&&a("ix-divider",{onClick:t=>t.preventDefault()})),a("slot",{onSlotchange:()=>this.slottedChanged(),ref:t=>this.slotElement=t})))}return a(o,null,a(v,{image:this.image,initials:this.initials}))}get hostElement(){return i(this)}};u.style=h;const p=":host{display:block;color:var(--theme-color-std-text)}: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 g=class{constructor(r){t(this,r);this.itemClick=s(this,"itemClick",7);this.dropdownItemRef=b()}async getDropdownItemElement(){return this.dropdownItemRef.waitForCurrent()}render(){return a("ix-dropdown-item",{key:"e85fb837da97c6416740a89efe5d8792d9e718f8",ref:this.dropdownItemRef,icon:this.icon,label:this.label,onClick:t=>this.itemClick.emit(t)})}get hostElement(){return i(this)}};g.style=p;export{u as ix_avatar,g as ix_menu_avatar_item};
+//# sourceMappingURL=p-32612a51.entry.js.map

package/dist/siemens-ix/p-32612a51.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["avatarCss","DefaultAvatar","props","initials","h","class","xmlns","width","height","viewBox","fill","id","d","AvatarImage","image","src","UserInfo","Fragment","onClick","event","preventDefault","userName","extra","Avatar","constructor","hostRef","this","isClosestApplicationHeader","hasSlottedElements","componentWillLoad","closest","closestElement","hostElement","slottedChanged","slotElement","resolveAvatarTrigger","Promise","resolve","reject","readTask","button","shadowRoot","querySelector","Error","onDropdownClick","target","dropdownElement","render","Host","slot","BaseButton","disabled","ghost","iconOval","icon","undefined","iconOnly","loading","outline","selected","type","variant","ref","trigger","e","username","onSlotchange","menuAvatarItemCss","MenuAvatarItem","dropdownItemRef","makeRef","getDropdownItemElement","waitForCurrent","key","label","itemClick","emit"],"sources":["src/components/avatar/avatar.scss?tag=ix-avatar&encapsulation=shadow","src/components/avatar/avatar.tsx","src/components/menu-avatar-item/menu-avatar-item.scss?tag=ix-menu-avatar-item&encapsulation=shadow","src/components/menu-avatar-item/menu-avatar-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/text-truncation';\n@import 'mixins/hover';\n@import './../button/button-mixin';\n@import 'mixins/scrollbar';\n\n:host {\n  @include scrollbar();\n  display: flex;\n  position: relative;\n  width: fit-content;\n\n  .avatar {\n    display: flex;\n    align-items: center;\n\n    > .avatar-image {\n      height: 2rem;\n      width: 2rem;\n      min-height: 2rem;\n      min-width: 2rem;\n      border-radius: 100px;\n    }\n\n    > .avatar-initials {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      height: 2rem;\n      width: 2rem;\n      min-height: 2rem;\n      min-width: 2rem;\n      border-radius: 100px;\n      background-color: var(--theme-avatar--background);\n      color: var(--theme-avatar--color);\n    }\n\n    #avatar-path-background {\n      fill: var(--theme-avatar--background);\n    }\n\n    #avatar-path-person {\n      fill:var(--theme-avatar--color);\n    }\n  }\n}\n\n:host {\n  .user-info {\n    display: flex;\n    flex-direction: row;\n    position: relative;\n    height: 2.5rem;\n    padding: 1rem;\n    width: 12.75rem;\n    min-width: 12.75rem;\n    max-width: 12.75rem;\n\n    gap: 1rem;\n\n    .avatar {\n      width: 2rem;\n      pointer-events: none;\n    }\n\n    .user {\n      display: flex;\n      position: relative;\n      flex-direction: column;\n      justify-content: center;\n      max-width: 10rem;\n      width: 100%;\n      overflow: hidden;\n    }\n\n    .username {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .extra {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n}\n\n:host(.avatar-button) {\n  button {\n    @include btn-base;\n    padding: 0px;\n\n    border-radius: 100px !important;\n  }\n\n  @include btn-base-variant('invisible-primary', false);\n\n  .avatar {\n    transform: scale(0.8);\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  Fragment,\n  h,\n  Host,\n  Prop,\n  readTask,\n  State,\n} from '@stencil/core';\nimport { BaseButton } from '../button/base-button';\nimport { closestElement, hasSlottedElements } from '../utils/shadow-dom';\n\nfunction DefaultAvatar(props: { initials?: string }) {\n  const { initials } = props;\n\n  if (initials) {\n    return <div class={'avatar-initials'}>{initials}</div>;\n  }\n\n  return (\n    <svg\n      class={'avatar-image'}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"32\"\n      height=\"32\"\n      viewBox=\"0 0 32 32\"\n    >\n      <g fill=\"none\" fill-rule=\"evenodd\">\n        <path\n          id=\"avatar-path-background\"\n          d=\"M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n          16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z\"\n        />\n        <path\n          id=\"avatar-path-person\"\n          d=\"M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n        6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n        9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n        6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z\"\n        />\n      </g>\n    </svg>\n  );\n}\n\nfunction AvatarImage(props: { image?: string; initials?: string }) {\n  return (\n    <div class=\"avatar\">\n      {props.image ? (\n        <img src={props.image} class=\"avatar-image\"></img>\n      ) : (\n        <DefaultAvatar initials={props.initials} />\n      )}\n    </div>\n  );\n}\n\nfunction UserInfo(props: {\n  image?: string;\n  initials?: string;\n  userName: string;\n  extra?: string;\n}) {\n  return (\n    <Fragment>\n      <div class=\"user-info\" onClick={(event) => event.preventDefault()}>\n        <AvatarImage image={props.image} initials={props.initials} />\n        <div class=\"user\">\n          <div class=\"username\">{props.userName}</div>\n          {props.extra && (\n            <ix-typography class=\"extra\" text-color={'soft'}>\n              {props.extra}\n            </ix-typography>\n          )}\n        </div>\n      </div>\n    </Fragment>\n  );\n}\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-avatar',\n  styleUrl: 'avatar.scss',\n  shadow: true,\n})\nexport class Avatar {\n  @Element() hostElement!: HTMLIxAvatarElement;\n\n  /**\n   * Display an avatar image\n   *\n   */\n  @Prop() image?: string;\n\n  /**\n   * Display the initials of the user. Will be overwritten by image\n   *\n   */\n  @Prop() initials?: string;\n\n  /**\n   * If set an info card displaying the username will be placed inside the dropdown.\n   * Note: Only working if avatar is part of the ix-application-header\n   *\n   * @since 2.1.0\n   */\n  @Prop() username?: string;\n\n  /**\n   * Optional description text that will be displayed underneath the username.\n   * Note: Only working if avatar is part of the ix-application-header\n   *\n   * @since 2.1.0\n   */\n  @Prop() extra?: string;\n\n  @State() isClosestApplicationHeader = false;\n  @State() hasSlottedElements = false;\n\n  private slotElement?: HTMLSlotElement;\n  private dropdownElement?: HTMLIxDropdownElement;\n\n  componentWillLoad() {\n    const closest = closestElement('ix-application-header', this.hostElement);\n    this.isClosestApplicationHeader = closest !== null;\n  }\n\n  private async slottedChanged() {\n    this.hasSlottedElements = hasSlottedElements(this.slotElement);\n  }\n\n  private resolveAvatarTrigger() {\n    return new Promise<HTMLElement>((resolve, reject) => {\n      readTask(() => {\n        const button = this.hostElement.shadowRoot!.querySelector('button');\n        if (button) {\n          resolve(button);\n        } else {\n          reject(new Error('ix-avatar - trigger element not found'));\n        }\n      });\n    });\n  }\n\n  private onDropdownClick(event: MouseEvent) {\n    if (event.target === this.dropdownElement) {\n      event.preventDefault();\n    }\n  }\n\n  render() {\n    if (this.isClosestApplicationHeader) {\n      return (\n        <Host slot=\"ix-application-header-avatar\" class={'avatar-button'}>\n          <BaseButton\n            disabled={false}\n            ghost={true}\n            iconOval={false}\n            icon={undefined}\n            iconOnly={false}\n            loading={false}\n            outline={false}\n            selected={false}\n            type=\"button\"\n            variant=\"primary\"\n          >\n            <AvatarImage image={this.image} initials={this.initials} />\n          </BaseButton>\n          <ix-dropdown\n            ref={(ref) => (this.dropdownElement = ref as HTMLIxDropdownElement)}\n            trigger={this.resolveAvatarTrigger()}\n            class=\"avatar-dropdown\"\n            onClick={(e) => this.onDropdownClick(e)}\n          >\n            {this.username && (\n              <Fragment>\n                <UserInfo\n                  extra={this.extra}\n                  image={this.image}\n                  initials={this.initials}\n                  userName={this.username}\n                />\n                {this.hasSlottedElements && (\n                  <ix-divider onClick={(e) => e.preventDefault()}></ix-divider>\n                )}\n              </Fragment>\n            )}\n            <slot\n              onSlotchange={() => this.slottedChanged()}\n              ref={(ref) => (this.slotElement = ref as HTMLSlotElement)}\n            ></slot>\n          </ix-dropdown>\n        </Host>\n      );\n    }\n\n    return (\n      <Host>\n        <AvatarImage image={this.image} initials={this.initials} />\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  display: block;\n  color: var(--theme-color-std-text);\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  Method,\n  Prop,\n} from '@stencil/core';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport { makeRef } from '../utils/make-ref';\n\n@Component({\n  tag: 'ix-menu-avatar-item',\n  styleUrl: 'menu-avatar-item.scss',\n  shadow: true,\n})\nexport class MenuAvatarItem implements DropdownItemWrapper {\n  @Element() hostElement!: HTMLIxMenuAvatarItemElement;\n\n  /**\n   * Avatar dropdown icon\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Avatar dropdown label\n   */\n  @Prop() label?: string;\n\n  /**\n   * Avatar dropdown item clicked\n   */\n  @Event() itemClick!: EventEmitter<MouseEvent>;\n\n  private dropdownItemRef = makeRef<HTMLIxDropdownItemElement>();\n\n  /** @internal */\n  @Method()\n  async getDropdownItemElement() {\n    return this.dropdownItemRef.waitForCurrent();\n  }\n\n  render() {\n    return (\n      <ix-dropdown-item\n        ref={this.dropdownItemRef}\n        icon={this.icon}\n        label={this.label}\n        onClick={(e) => this.itemClick.emit(e)}\n      ></ix-dropdown-item>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-3677ae1c.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as i,H as t,g as s}from"./p-DtF9fwpD.js";import{H as a}from"./p-Cdt22lfd.js";const l=":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 n=undefined&&undefined.__decorate||function(e,i,t,s){var a=arguments.length,l=a<3?i:s===null?s=Object.getOwnPropertyDescriptor(i,t):s,n;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")l=Reflect.decorate(e,i,t,s);else for(var o=e.length-1;o>=0;o--)if(n=e[o])l=(a<3?n(l):a>3?n(i,t,l):n(i,t))||l;return a>3&&l&&Object.defineProperty(i,t,l),l};const o=class{constructor(i){e(this,i);this.direction="column";this.showTextAsTooltip=false;this.isInvalid=false;this.isInfo=false;this.isValid=false;this.isWarning=false}onClassFieldUpdate({isInvalid:e,isInvalidByRequired:i,isInfo:t,isValid:s,isWarning:a}){this.isInvalid=e||i;this.isInfo=t;this.isValid=s;this.isWarning=a}render(){return i(t,{key:"27aee735ce40e2c2f3b019afad6a44ed1029c2c6"},i("ix-field-wrapper",{key:"70b0666837cc8ed83defc9844cc58003f489a22e",label:this.label,helperText:this.helperText,invalidText:this.invalidText,infoText:this.infoText,validText:this.validText,warningText:this.warningText,showTextAsTooltip:this.showTextAsTooltip,isInvalid:this.isInvalid,isInfo:this.isInfo,isValid:this.isValid,isWarning:this.isWarning},i("div",{key:"59485040ff9509b58b7bd8f7f50e53970585ffb5",class:{"checkbox-container":true,"row-layout":this.direction==="row"}},i("slot",{key:"af5f7db97a6efec492299336428bbb9ded00fbca"}))))}get hostElement(){return s(this)}};n([a({includeChildren:true})],o.prototype,"onClassFieldUpdate",null);o.style=l;export{o as ix_checkbox_group};
+//# sourceMappingURL=p-3677ae1c.entry.js.map

package/dist/siemens-ix/p-3677ae1c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["checkboxGroupCss","CheckboxGroup","constructor","hostRef","this","direction","showTextAsTooltip","isInvalid","isInfo","isValid","isWarning","onClassFieldUpdate","isInvalidByRequired","render","h","Host","key","label","helperText","invalidText","infoText","validText","warningText","class","__decorate","HookValidationLifecycle","includeChildren","prototype"],"sources":["src/components/checkbox-group/checkbox-group.scss?tag=ix-checkbox-group&encapsulation=shadow","src/components/checkbox-group/checkbox-group.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n  display: inline-block;\n  position: relative;\n\n  .checkbox-container {\n    display: flex;\n    flex-direction: column;\n    gap: 1rem;\n    margin: 0.375rem 0;\n    flex-wrap: wrap;\n\n    &.row-layout {\n      flex-direction: row;\n    }\n  }\n}\n","import { Component, Element, Host, Prop, State, h } from '@stencil/core';\nimport {\n  FieldWrapperInterface,\n  HookValidationLifecycle,\n  IxFormValidationState,\n  ValidationResults,\n} from '../utils/input';\nimport { IxComponent } from '../utils/internal';\n\n/**\n * @since 2.6.0\n * @form-ready 2.6.0\n */\n@Component({\n  tag: 'ix-checkbox-group',\n  styleUrl: 'checkbox-group.scss',\n  shadow: true,\n})\nexport class CheckboxGroup\n  implements FieldWrapperInterface, IxFormValidationState, IxComponent\n{\n  @Element() hostElement!: HTMLIxCheckboxGroupElement;\n  /**\n   * Optional helper text displayed below the checkbox group\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * Label for the checkbox group\n   */\n  @Prop() label?: string;\n\n  /**\n   * Alignment of the checkboxes in the group\n   */\n  @Prop() direction: 'row' | 'column' = 'column';\n\n  /**\n   * Error text for the checkbox group\n   */\n  @Prop() invalidText?: string;\n\n  /**\n   * Info text for the checkbox group\n   */\n  @Prop() infoText?: string;\n  /**\n   * Valid text for the checkbox group\n   */\n  @Prop() validText?: string;\n  /**\n   * Warning text for the checkbox group\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * Show helper, info, warning, error and valid text as tooltip\n   */\n  @Prop() showTextAsTooltip = false;\n\n  @State() isInvalid = false;\n  @State() isInfo = false;\n  @State() isValid = false;\n  @State() isWarning = false;\n\n  @HookValidationLifecycle({\n    includeChildren: true,\n  })\n  onClassFieldUpdate({\n    isInvalid,\n    isInvalidByRequired,\n    isInfo,\n    isValid,\n    isWarning,\n  }: ValidationResults) {\n    this.isInvalid = isInvalid || isInvalidByRequired;\n    this.isInfo = isInfo;\n    this.isValid = isValid;\n    this.isWarning = isWarning;\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-field-wrapper\n          label={this.label}\n          helperText={this.helperText}\n          invalidText={this.invalidText}\n          infoText={this.infoText}\n          validText={this.validText}\n          warningText={this.warningText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          isInvalid={this.isInvalid}\n          isInfo={this.isInfo}\n          isValid={this.isValid}\n          isWarning={this.isWarning}\n        >\n          <div\n            class={{\n              'checkbox-container': true,\n              'row-layout': this.direction === 'row',\n            }}\n          >\n            <slot></slot>\n          </div>\n        </ix-field-wrapper>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAmB,+M,iXCkBZC,EAAa,MAL1B,WAAAC,CAAAC,G,UAsBUC,KAASC,UAAqB,SAuB9BD,KAAiBE,kBAAG,MAEnBF,KAASG,UAAG,MACZH,KAAMI,OAAG,MACTJ,KAAOK,QAAG,MACVL,KAASM,UAAG,KA8CtB,CAzCC,kBAAAC,EAAmBJ,UACjBA,EAASK,oBACTA,EAAmBJ,OACnBA,EAAMC,QACNA,EAAOC,UACPA,IAEAN,KAAKG,UAAYA,GAAaK,EAC9BR,KAAKI,OAASA,EACdJ,KAAKK,QAAUA,EACfL,KAAKM,UAAYA,C,CAGnB,MAAAG,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,oBAAAE,IAAA,2CACEC,MAAOb,KAAKa,MACZC,WAAYd,KAAKc,WACjBC,YAAaf,KAAKe,YAClBC,SAAUhB,KAAKgB,SACfC,UAAWjB,KAAKiB,UAChBC,YAAalB,KAAKkB,YAClBhB,kBAAmBF,KAAKE,kBACxBC,UAAWH,KAAKG,UAChBC,OAAQJ,KAAKI,OACbC,QAASL,KAAKK,QACdC,UAAWN,KAAKM,WAEhBI,EAAA,OAAAE,IAAA,2CACEO,MAAO,CACL,qBAAsB,KACtB,aAAcnB,KAAKC,YAAc,QAGnCS,EAAA,QAAAE,IAAA,+C,oCAnCVQ,EAAA,CAHCC,EAAwB,CACvBC,gBAAiB,QAalBzB,EAAA0B,UAAA,2B","ignoreList":[]}

package/dist/siemens-ix/p-38d3e0c8.entry.js

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

package/dist/siemens-ix/p-38d3e0c8.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["flipTileContentCss","FlipTileContent","constructor","hostRef","this","contentVisible","render","h","Host","key"],"sources":["src/components/flip-tile-content/flip-tile-content.css?tag=ix-flip-tile-content&encapsulation=shadow","src/components/flip-tile-content/flip-tile-content.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: block;\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 { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-flip-tile-content',\n  styleUrl: 'flip-tile-content.css',\n  shadow: true,\n})\nexport class FlipTileContent {\n  /**\n   * Controls the visibility of the content\n   *\n   * @internal\n   */\n  @Prop() contentVisible = false;\n\n  render() {\n    return <Host>{this.contentVisible ? <slot></slot> : null}</Host>;\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,uB,MCedC,EAAe,MAL5B,WAAAC,CAAAC,G,UAWUC,KAAcC,eAAG,KAK1B,CAHC,MAAAC,GACE,OAAOC,EAACC,EAAM,CAAAC,IAAA,4CAAAL,KAAKC,eAAiBE,EAAA,aAAgB,K","ignoreList":[]}

package/dist/siemens-ix/p-3af8304e.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as o,H as r}from"./p-DtF9fwpD.js";import{a as t,u as a}from"./p-CrTP-icT.js";const i=":host{display:flex;flex-grow:1;height:2.5rem;border-radius:var(--theme-kpi--border-radius);padding:0.375rem 0.25rem;min-width:0}: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 span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .kpi-container{display:flex;height:100%;width:100%;border-block-end:2px solid grey}:host .kpi-container.alarm{border-block-end-color:var(--theme-color-alarm)}:host .kpi-container.warning{border-block-end-color:var(--theme-color-warning)}:host .kpi-container .kpi-label{display:flex;align-items:center;color:var(--theme-kpi-display-label--color);flex-grow:1;flex-shrink:9999}:host .kpi-container .kpi-label ix-icon{margin-inline-end:0.25rem}:host .kpi-container .kpi-value-container{display:flex;align-items:flex-end}:host .kpi-container .kpi-value{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text);color:var(--theme-kpi-display-value--color)}:host .kpi-container .kpi-unit{margin-inline-start:0.5rem;color:var(--theme-kpi-display-units--color)}:host .kpi-container .kpi-label,:host .kpi-container .kpi-unit{margin-block-start:0.125rem}:host:not(.disabled):not(:disabled){cursor:pointer}:host:not(.disabled):not(:disabled):hover{background-color:var(--theme-kpi-display--background--hover)}:host:not(.disabled):not(:disabled){cursor:pointer}:host:not(.disabled):not(:disabled):active,:host:not(.disabled):not(:disabled).active{background-color:var(--theme-kpi-display--background--active)}:host:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--focus--border-color)}:host(.stacked){height:3.75rem}:host(.stacked) .kpi-container{justify-content:center;flex-wrap:wrap}:host(.stacked) .kpi-container .kpi-label{width:100%;justify-content:center}";const s=class{constructor(o){e(this,o);this.state="neutral";this.orientation="horizontal"}getStateIcon(){switch(this.state){case"alarm":return o("ix-icon",{color:"kpi-display-icon--color",name:a,size:"16"});case"warning":return o("ix-icon",{color:"kpi-display-icon--color",name:t,size:"16"});default:return""}}getTooltipText(){let e=`${this.label}: ${this.value}`;if(this.unit){e=e.concat(` ${this.unit}`)}return e}render(){return o(r,{key:"38a4e2796e0d81480954980e7e5e07118040fecc",title:this.getTooltipText(),tabindex:"1",class:{stacked:this.orientation==="vertical"}},o("div",{key:"256e5b1bbd41d4f085077a11ed953d3b21c6f0fa",class:{"kpi-container":true,alarm:this.state==="alarm",warning:this.state==="warning"}},o("span",{key:"8100ec8be76d87343df2cd77390995216aa12a23",class:"kpi-label"},this.getStateIcon(),o("span",{key:"0119615ca8e9a676619dd2dc8c16278d6a4bf630",class:"kpi-label-text"},this.label)),o("span",{key:"c6e6fd1d6ea4175935d158c1fbb223140bfcdd3e",class:"kpi-value-container"},o("span",{key:"63ea001b1b819f0876287c4ba1e36a2a1bb1c609",class:"kpi-value"},this.value),this.unit?o("span",{class:"kpi-unit"},this.unit):"")))}};s.style=i;export{s as ix_kpi};
+//# sourceMappingURL=p-3af8304e.entry.js.map

package/dist/siemens-ix/p-3af8304e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["kpiCss","Kpi","constructor","hostRef","this","state","orientation","getStateIcon","h","color","name","iconAlarm","size","iconWarning","getTooltipText","tooltip","label","value","unit","concat","render","Host","key","title","tabindex","class","stacked","alarm","warning"],"sources":["src/components/kpi/kpi.scss?tag=ix-kpi&encapsulation=shadow","src/components/kpi/kpi.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:host {\n  @include ix-component;\n\n  display: flex;\n  flex-grow: 1;\n  height: $large-control-height;\n  border-radius: var(--theme-kpi--border-radius);\n  padding: 0.375rem $tiny-space;\n  min-width: 0;\n\n  span {\n    @include ellipsis;\n  }\n\n  .kpi-container {\n    display: flex;\n    height: 100%;\n    width: 100%;\n    border-block-end: 2px solid grey;\n\n    &.alarm {\n      border-block-end-color: var(--theme-color-alarm);\n    }\n\n    &.warning {\n      border-block-end-color: var(--theme-color-warning);\n    }\n\n    .kpi-label {\n      display: flex;\n      align-items: center;\n      color: var(--theme-kpi-display-label--color);\n      flex-grow: 1;\n      flex-shrink: 9999;\n\n      ix-icon {\n        margin-inline-end: $tiny-space;\n      }\n    }\n\n    .kpi-value-container {\n      display: flex;\n      align-items: flex-end;\n    }\n\n    .kpi-value {\n      @include text-xl;\n\n      color: var(--theme-kpi-display-value--color);\n    }\n\n    .kpi-unit {\n      margin-inline-start: $small-space;\n      color: var(--theme-kpi-display-units--color);\n    }\n\n    .kpi-label,\n    .kpi-unit {\n      margin-block-start: 0.125rem;\n    }\n  }\n\n  @include hover {\n    background-color: var(--theme-kpi-display--background--hover);\n  }\n\n  @include active {\n    background-color: var(--theme-kpi-display--background--active);\n  }\n\n  @include focus-visible {\n    outline: 1px solid var(--focus--border-color);\n  }\n}\n\n:host(.stacked) {\n  height: 3.75rem;\n\n  .kpi-container {\n    justify-content: center;\n    flex-wrap: wrap;\n\n    .kpi-label {\n      width: 100%;\n      justify-content: center;\n    }\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 { iconAlarm, iconWarning } from '@siemens/ix-icons/icons';\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-kpi',\n  styleUrl: 'kpi.scss',\n  shadow: true,\n})\nexport class Kpi {\n  /**\n   *\n   */\n  @Prop() label?: string;\n\n  /**\n   *\n   */\n  @Prop() value?: string | number;\n\n  /**\n   *\n   */\n  @Prop() unit?: string;\n\n  /**\n   *\n   */\n  @Prop() state: 'neutral' | 'warning' | 'alarm' = 'neutral';\n\n  /**\n   *\n   */\n  @Prop() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n  private getStateIcon() {\n    switch (this.state) {\n      case 'alarm':\n        return (\n          <ix-icon\n            color=\"kpi-display-icon--color\"\n            name={iconAlarm}\n            size=\"16\"\n          ></ix-icon>\n        );\n\n      case 'warning':\n        return (\n          <ix-icon\n            color=\"kpi-display-icon--color\"\n            name={iconWarning}\n            size=\"16\"\n          ></ix-icon>\n        );\n\n      default:\n        return '';\n    }\n  }\n\n  private getTooltipText() {\n    let tooltip = `${this.label}: ${this.value}`;\n\n    if (this.unit) {\n      tooltip = tooltip.concat(` ${this.unit}`);\n    }\n\n    return tooltip;\n  }\n\n  render() {\n    return (\n      <Host\n        title={this.getTooltipText()}\n        tabindex=\"1\"\n        class={{\n          stacked: this.orientation === 'vertical',\n        }}\n      >\n        <div\n          class={{\n            'kpi-container': true,\n            alarm: this.state === 'alarm',\n            warning: this.state === 'warning',\n          }}\n        >\n          <span class=\"kpi-label\">\n            {this.getStateIcon()}\n            <span class=\"kpi-label-text\">{this.label}</span>\n          </span>\n          <span class=\"kpi-value-container\">\n            <span class=\"kpi-value\">{this.value}</span>\n            {this.unit ? <span class=\"kpi-unit\">{this.unit}</span> : ''}\n          </span>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAS,ygF,MCiBFC,EAAG,MALhB,WAAAC,CAAAC,G,UAwBUC,KAAKC,MAAoC,UAKzCD,KAAWE,YAA8B,YAiElD,CA/DS,YAAAC,GACN,OAAQH,KAAKC,OACX,IAAK,QACH,OACEG,EAAA,WACEC,MAAM,0BACNC,KAAMC,EACNC,KAAK,OAIX,IAAK,UACH,OACEJ,EAAA,WACEC,MAAM,0BACNC,KAAMG,EACND,KAAK,OAIX,QACE,MAAO,G,CAIL,cAAAE,GACN,IAAIC,EAAU,GAAGX,KAAKY,UAAUZ,KAAKa,QAErC,GAAIb,KAAKc,KAAM,CACbH,EAAUA,EAAQI,OAAO,IAAIf,KAAKc,O,CAGpC,OAAOH,C,CAGT,MAAAK,GACE,OACEZ,EAACa,EACC,CAAAC,IAAA,2CAAAC,MAAOnB,KAAKU,iBACZU,SAAS,IACTC,MAAO,CACLC,QAAStB,KAAKE,cAAgB,aAGhCE,EAAA,OAAAc,IAAA,2CACEG,MAAO,CACL,gBAAiB,KACjBE,MAAOvB,KAAKC,QAAU,QACtBuB,QAASxB,KAAKC,QAAU,YAG1BG,EAAM,QAAAc,IAAA,2CAAAG,MAAM,aACTrB,KAAKG,eACNC,EAAM,QAAAc,IAAA,2CAAAG,MAAM,kBAAkBrB,KAAKY,QAErCR,EAAM,QAAAc,IAAA,2CAAAG,MAAM,uBACVjB,EAAA,QAAAc,IAAA,2CAAMG,MAAM,aAAarB,KAAKa,OAC7Bb,KAAKc,KAAOV,EAAM,QAAAiB,MAAM,YAAYrB,KAAKc,MAAe,K","ignoreList":[]}

package/dist/siemens-ix/p-3d57eed7.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,H as s,g as h}from"./p-DtF9fwpD.js";import{a as o}from"./p-Ou74PMQs.js";import{A as a}from"./p-Dp15M30K.js";import{a as r}from"./p-CyFFBc_G.js";import{m as n}from"./p-D6vSVaHq.js";import{p as l,D as d,E as p,F as c,G as b}from"./p-CrTP-icT.js";import"./p-BdCnOrqW.js";const m=":host{background-color:var(--theme-color-2);display:flex;position:relative;overflow:hidden;box-sizing:border-box}: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 aside{width:100%;height:100%}:host .title-text{display:flex;align-items:center;gap:var(--theme-space-1);overflow:hidden}:host .title-text .title-text-overflow{width:100%;height:100%;display:contents}:host .title-text .title-text-overflow *{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .header-gap{gap:var(--theme-space-1)}:host .top-bottom-pane{display:flex;flex-direction:column;flex-grow:1}:host .top-bottom-pane .title{display:flex;flex-direction:row;align-items:center;margin:var(--theme-space--1) var(--theme-space-2) var(--theme-space--1) var(--theme-space-2)}:host .top-bottom-pane .title-finished{padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .top-bottom-pane .title-expanded{display:flex;flex-direction:row}:host .top-bottom-pane .title-hide-on-collapse{display:flex;flex-direction:row-reverse;justify-content:space-between;padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane{display:flex;flex-grow:1}:host .left-right-pane .title{display:flex;flex-direction:column;align-items:center;margin:var(--theme-space-2) var(--theme-space--1) var(--theme-space-2) var(--theme-space--1)}:host .left-right-pane .title .title-text{flex-direction:row-reverse;justify-content:start;flex-direction:row}:host .left-right-pane .title .rotate{writing-mode:vertical-lr;text-orientation:mixed;transform:rotate(180deg);flex-direction:row-reverse}:host .left-right-pane .title .rotate ix-icon{transform:rotate(90deg)}:host .left-right-pane .title-finished{padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane .title-expanded{display:flex;flex-direction:row}:host .left-right-pane .title-hide-on-collapse{display:flex;flex-direction:row-reverse;justify-content:space-between;padding:0 !important;margin:var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2)}:host .left-right-pane.expanded{flex-direction:column}:host .mobile-pane{display:flex;flex-direction:column;flex-grow:1}:host .mobile-pane .title-mobile{display:flex;flex-direction:row-reverse;justify-content:space-between;margin:var(--theme-space-1) var(--theme-space-2)}:host .side-pane-content{padding:var(--theme-space-1) var(--theme-space-2);overflow:auto;height:100%;width:100%}:host(.not-visible){display:none}:host(.inline-color){background-color:var(--theme-color-1)}:host(.box-shadow){box-shadow:0 0 1rem black}:host(.nav-left-border){border-left:var(--theme-app-header--border-width) solid var(--theme-color-weak-bdr)}:host(.left-pane-border){border-right:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.right-pane-border){border-left:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.top-pane-border){border-bottom:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.bottom-pane-border){border-top:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.mobile-overlay){width:100%;position:absolute;z-index:100 !important}:host(.mobile-overlay) .side-pane-content{height:calc(100% - 2.5rem)}:host(.mobile-border-top){border-bottom:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.mobile-border-bottom){border-top:var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr)}:host(.top-expanded){top:0}:host(.bottom-expanded){bottom:0}:host(.left-right-pane){height:100%}:host(.top-bottom-pane){width:100%}";const f=class{constructor(i){t(this,i);this.expandedChanged=e(this,"expandedChanged",7);this.variantChanged=e(this,"variantChanged",7);this.borderlessChanged=e(this,"borderlessChanged",7);this.hideOnCollapseChanged=e(this,"hideOnCollapseChanged",7);this.slotChanged=e(this,"slotChanged",7);this.variant="inline";this.hideOnCollapse=false;this.size="240px";this.borderless=false;this.expanded=false;this.composition="top";this.ignoreLayoutSettings=false;this.isMobile=false;this.expandIcon="";this.showContent=false;this.minimizeIcon="";this.floating=false;this.parentWidthPx=0;this.parentHeightPx=0;this.animations=new Map;this.animationCounter=0}get currentSlot(){return this.hostElement.getAttribute("slot")}get isBottomTopPane(){return this.composition==="bottom"||this.composition==="top"}get isLeftRightPane(){return this.composition==="left"||this.composition==="right"}get isMobileTop(){return this.composition==="top"||this.composition==="left"}componentWillLoad(){this.setIcons();this.floating=this.variant==="floating";if(this.expanded){this.onParentSizeChange()}this.isMobile=n("sm");r.onChange.on((()=>{this.isMobile=n("sm")}));if(this.currentSlot){this.setPosition(this.currentSlot)}this.mutationObserver=new MutationObserver((t=>{t.forEach((t=>{if(t.type==="attributes"&&t.attributeName==="slot"){const e=this.currentSlot;const i=t.oldValue;if(e!==i){this.slotChanged.emit({slot:i!==null&&i!==void 0?i:"",newSlot:e!==null&&e!==void 0?e:""});if(e){this.setPosition(e)}}}}))}));this.mutationObserver.observe(this.hostElement,{attributes:true,attributeOldValue:true});const t=this.hostElement.parentElement;this.resizeObserver=new ResizeObserver((t=>{this.parentWidthPx=t[0].borderBoxSize[0].inlineSize;this.parentHeightPx=t[0].borderBoxSize[0].blockSize}));if(t)this.resizeObserver.observe(t)}disconnectedCallback(){var t,e;(t=this.mutationObserver)===null||t===void 0?void 0:t.disconnect();(e=this.resizeObserver)===null||e===void 0?void 0:e.disconnect()}setPosition(t){if(f.validPositions.includes(t)){this.composition=t}}getExpandPaneSize(){let t;if(this.isBottomTopPane){if(this.size.includes("px")){const e=Math.round(this.parentHeightPx/2);const i=Number(this.size.replace("px",""));if(e&&e<i){t=`${e}px`}else{t=`${i}px`}}else{if(this.size==="50%"){t=`${Math.round(this.parentHeightPx/2)}px`}else{t=`${Math.round(this.parentHeightPx/3)}px`}}}else{if(this.size.includes("px")){const e=Math.round(this.parentWidthPx/2);const i=Number(this.size.replace("px",""));if(e&&e<i){t=`${e}px`}else{t=`${i}px`}}else{if(this.size==="50%"){t=`${Math.round(this.parentWidthPx/2)}px`}else{t=`${Math.round(this.parentWidthPx/3)}px`}}}return t}setIcons(){const{expandIcon:t,minimizeIcon:e}=this.getIconNames();this.expandIcon=t;this.minimizeIcon=e}getIconNames(){let t="";let e="";switch(this.composition){case"left":t=this.isMobile?d:b;e=this.isMobile?p:c;break;case"right":t=this.isMobile?p:c;e=this.isMobile?d:b;break;case"bottom":t=p;e=d;break;case"top":t=d;e=p;break}return{expandIcon:t,minimizeIcon:e}}getKey(){return(this.animationCounter++).toString()}animateVerticalFadeIn(t){let e=this.getKey();let i=o({targets:this.hostElement,duration:a.mediumTime,width:t,easing:"easeInOutSine",delay:0,begin:()=>{if(!this.expanded){this.showContent=false;this.animateVerticalPadding("0px")}else{this.animateVerticalPadding("8px")}},complete:()=>{if(this.expanded){this.showContent=true}this.animations.delete(e)}});this.animations.set(e,i)}animateHorizontalFadeIn(t){let e=this.getKey();let i=o({targets:this.hostElement,duration:a.mediumTime,height:t,easing:"easeInOutSine",delay:0,begin:()=>{if(!this.expanded){this.showContent=false;if(!this.isMobile)this.animateHorizontalPadding("0px")}else{if(!this.isMobile)this.animateHorizontalPadding("8px")}},complete:()=>{if(this.expanded){this.showContent=true}this.animations.delete(e)}});this.animations.set(e,i)}removePadding(){o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:0,paddingTop:0,paddingBottom:0,paddingLeft:0,paddingRight:0,delay:0})}animateHorizontalPadding(t,e=a.mediumTime){let i=this.getKey();let s=o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:e,paddingTop:t,paddingBottom:t,easing:"easeInOutSine",delay:0,complete:()=>{this.animations.delete(i)}});this.animations.set(i,s)}animateVerticalPadding(t,e=a.mediumTime){let i=this.getKey();let s=o({targets:this.hostElement.shadowRoot.querySelector("#title-div"),duration:e,paddingLeft:t,paddingRight:t,easing:"easeInOutSine",delay:0,complete:()=>{this.animations.delete(i)}});this.animations.set(i,s)}clearAnimations(){this.animations.forEach((t=>t.pause()));this.animations.clear();this.animationCounter=0}onMobileChange(){this.setIcons();this.hostElement.style.removeProperty("width");this.hostElement.style.removeProperty("height");this.hostElement.style.removeProperty("min-height");this.onParentSizeChange()}onPositionChange(){this.setIcons();this.hostElement.style.removeProperty("width");this.hostElement.style.removeProperty("height");this.onParentSizeChange()}onHideOnCollapseChange(t){var e;this.onParentSizeChange();this.hideOnCollapseChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",hideOnCollapse:t})}onVariantChange(t){var e;this.floating=t==="floating";this.variantChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",variant:t})}onBorderlessChange(t){var e;this.borderlessChanged.emit({slot:(e=this.currentSlot)!==null&&e!==void 0?e:"",borderless:t})}dispatchExpandedChangedEvent(){var t;const e=this.expandedChanged.emit({slot:(t=this.currentSlot)!==null&&t!==void 0?t:"",expanded:!this.expanded});if(!e.defaultPrevented){this.expanded=!this.expanded}}onParentSizeChange(){this.clearAnimations();this.removePadding();if(this.expanded){if(this.isMobile){this.hostElement.style.height="100%"}else{const t=this.getExpandPaneSize();if(this.isBottomTopPane){this.hostElement.style.height=t;this.animateHorizontalPadding("8px",0)}else{this.hostElement.style.width=t;this.animateVerticalPadding("8px",0)}}this.showContent=true}else{this.showContent=false;if(this.isMobile){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPaneMobile}else{if(this.isBottomTopPane){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPane}else{this.hostElement.style.width=this.hideOnCollapse?"0":f.collapsedPane}}}}onSizeChange(){if(this.expanded){if(this.isMobile){this.hostElement.style.minHeight=this.hideOnCollapse?"0":f.collapsedPaneMobile;this.animateHorizontalFadeIn("100%")}else{const t=this.getExpandPaneSize();if(this.isBottomTopPane){this.hostElement.style.height=this.hideOnCollapse?"0":f.collapsedPane;this.animateHorizontalFadeIn(t)}else{this.hostElement.style.width=this.hideOnCollapse?"0":f.collapsedPane;this.animateVerticalFadeIn(t)}}}else{this.showContent=false;if(this.isMobile){this.hostElement.style.height=f.collapsedPaneMobile}else{if(this.isBottomTopPane){this.animateHorizontalFadeIn(f.collapsedPane)}else{this.animateVerticalFadeIn(f.collapsedPane)}}}}render(){return i(s,{key:"48aefc1145058d559cb713356c94b112f9b6c236",class:{"inline-color":!this.floating,"mobile-overlay":this.expanded&&this.isMobile,"top-expanded":this.expanded&&this.isMobileTop&&this.isMobile,"bottom-expanded":this.expanded&&!this.isMobileTop&&this.isMobile,"top-bottom-pane":this.isBottomTopPane&&!this.isMobile,"left-right-pane":this.isLeftRightPane&&!this.isMobile,[`${this.composition}-pane-border`]:!this.borderless&&!this.isMobile&&!this.floating,"nav-left-border":!this.borderless&&!this.isMobile&&this.composition!=="right"&&this.floating,"mobile-border-top":!this.borderless&&this.isMobileTop&&this.isMobile&&!this.expanded&&!this.floating,"mobile-border-bottom":!this.borderless&&!this.isMobileTop&&this.isMobile&&!this.expanded&&!this.floating,"box-shadow":this.floating,"aria-expanded":this.expanded,"not-visible":this.hideOnCollapse&&!this.expanded}},i("aside",{key:"373c760c22f98edff6f27e3c6c161d2c1d90c527",id:`pane-${this.composition}`,class:{"top-bottom-pane":this.isBottomTopPane&&!this.isMobile,"left-right-pane":this.isLeftRightPane&&!this.isMobile,"mobile-pane":this.isMobile,expanded:this.expanded}},i("div",{key:"2fcbd2bc94f9c3e518e41ce42be7d8c56daa91b4",id:"title-div",class:{title:!this.isMobile&&!this.hideOnCollapse&&!this.showContent,"title-finished":!this.isMobile&&!this.hideOnCollapse&&this.showContent,"title-expanded":!this.isMobile&&!this.hideOnCollapse&&this.expanded,"title-hide-on-collapse":!this.isMobile&&this.hideOnCollapse,"title-mobile":this.isMobile,"header-gap":!this.isMobile&&!this.hideOnCollapse}},i("ix-icon-button",{key:"cbb99e9885a41c88a66d839c45d4f67f37d37f80",class:"title-icon",size:"24",icon:this.expanded?this.isMobile||this.hideOnCollapse?l:this.expandIcon:this.minimizeIcon,ghost:true,onClick:()=>this.dispatchExpandedChangedEvent(),"aria-controls":`pane-${this.composition}`}),i("span",{key:"edc04216716b06e9c13dbf94500225e71099e6d5",class:{"title-text":true,rotate:!this.expanded&&!this.isMobile&&this.isLeftRightPane}},this.icon?i("ix-icon",{size:"24",name:this.icon}):null,i("div",{key:"2a1f686a93e3aee1b4374405df12b79c9b5f787b",class:"title-text-overflow"},i("ix-typography",{key:"b0a42df1078d4360d2058262ac07551220fed513",format:"h4"},this.heading)))),i("div",{key:"5c4f24e9e0dee32bfb1d5502f487fdaf6b4c9859",class:"side-pane-content",hidden:!this.showContent},i("slot",{key:"f28c9aa0dde2a4d14cf16f0849ec31025a80c37b"}))))}get hostElement(){return h(this)}static get watchers(){return{isMobile:["onMobileChange"],composition:["onPositionChange"],hideOnCollapse:["onHideOnCollapseChange"],variant:["onVariantChange"],borderless:["onBorderlessChange"],parentHeightPx:["onParentSizeChange"],parentWidthPx:["onParentSizeChange"],expanded:["onSizeChange"],size:["onSizeChange"]}}};f.validPositions=["top","left","bottom","right"];f.collapsedPane="40px";f.collapsedPaneMobile="48px";f.style=m;export{f as ix_pane};
+//# sourceMappingURL=p-3d57eed7.entry.js.map

package/dist/siemens-ix/p-3d57eed7.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["paneCss","Pane","constructor","hostRef","this","variant","hideOnCollapse","size","borderless","expanded","composition","ignoreLayoutSettings","isMobile","expandIcon","showContent","minimizeIcon","floating","parentWidthPx","parentHeightPx","animations","Map","animationCounter","currentSlot","hostElement","getAttribute","isBottomTopPane","isLeftRightPane","isMobileTop","componentWillLoad","setIcons","onParentSizeChange","matchBreakpoint","applicationLayoutService","onChange","on","setPosition","mutationObserver","MutationObserver","mutations","forEach","mutation","type","attributeName","newSlot","oldSlot","oldValue","slotChanged","emit","slot","observe","attributes","attributeOldValue","parentElement","resizeObserver","ResizeObserver","entries","borderBoxSize","inlineSize","blockSize","disconnectedCallback","_a","disconnect","_b","value","validPositions","includes","getExpandPaneSize","expandPaneSize","referenceValue","Math","round","currentValue","Number","replace","getIconNames","iconDoubleChevronUp","iconDoubleChevronLeft","iconDoubleChevronDown","iconDoubleChevronRight","getKey","toString","animateVerticalFadeIn","key","animation","anime","targets","duration","Animation","mediumTime","width","easing","delay","begin","animateVerticalPadding","complete","delete","set","animateHorizontalFadeIn","height","animateHorizontalPadding","removePadding","shadowRoot","querySelector","paddingTop","paddingBottom","paddingLeft","paddingRight","clearAnimations","pause","clear","onMobileChange","style","removeProperty","onPositionChange","onHideOnCollapseChange","hideOnCollapseChanged","onVariantChange","variantChanged","onBorderlessChange","borderlessChanged","dispatchExpandedChangedEvent","event","expandedChanged","defaultPrevented","collapsedPaneMobile","collapsedPane","onSizeChange","minHeight","render","h","Host","class","id","title","icon","iconClose","ghost","onClick","rotate","name","format","heading","hidden"],"sources":["src/components/pane/pane.scss?tag=ix-pane&encapsulation=shadow","src/components/pane/pane.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 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n@mixin set-border($composition) {\n  @if $composition {\n    border-#{$composition}: var(--theme-app-header--border-width) solid var(--theme-color-soft-bdr);\n  }\n}\n\n:host {\n  @include ix-component;\n  background-color: var(--theme-color-2);\n  display: flex;\n  position: relative;\n  overflow: hidden;\n  box-sizing: border-box;\n\n  aside {\n    width: 100%;\n    height: 100%;\n  }\n\n  .title-text {\n    display: flex;\n    align-items: center;\n    gap: var(--theme-space-1);\n    overflow: hidden;\n\n    .title-text-overflow {\n      width: 100%;\n      height: 100%;\n      display: contents;\n\n      * {\n        text-overflow: ellipsis;\n        white-space: nowrap;\n        overflow: hidden;\n      }\n    }\n  }\n\n  .header-gap {\n    gap: var(--theme-space-1);\n  }\n\n  .top-bottom-pane {\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n\n    .title {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      margin: var(--theme-space--1) var(--theme-space-2) var(--theme-space--1) var(--theme-space-2);\n    }\n\n    .title-finished {\n      padding: 0 !important;\n      margin: var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2);\n    }\n\n    .title-expanded {\n      display: flex;\n      flex-direction: row;\n    }\n\n    .title-hide-on-collapse {\n      display: flex;\n      flex-direction: row-reverse;\n      justify-content: space-between;\n      padding: 0 !important;\n      margin: var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2);\n    }\n  }\n\n  .left-right-pane {\n    display: flex;\n    flex-grow: 1;\n\n    .title {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      margin: var(--theme-space-2) var(--theme-space--1)  var(--theme-space-2) var(--theme-space--1);\n\n      .title-text {\n        flex-direction: row-reverse;\n        justify-content: start;\n        flex-direction: row;\n      }\n\n      .rotate {\n        writing-mode: vertical-lr;\n        text-orientation: mixed;\n        transform: rotate(180deg);\n        flex-direction: row-reverse;\n\n        ix-icon {\n          transform: rotate(90deg);\n        }\n      }\n    }\n\n    .title-finished {\n      padding: 0 !important;\n      margin: var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2);\n    }\n\n    .title-expanded {\n      display: flex;\n      flex-direction: row;\n    }\n\n    .title-hide-on-collapse {\n      display: flex;\n      flex-direction: row-reverse;\n      justify-content: space-between;\n      padding: 0 !important;\n      margin: var(--theme-space-2) var(--theme-space-2) var(--theme-space-2) var(--theme-space-2);\n    }\n  }\n\n  .left-right-pane.expanded {\n    flex-direction: column;\n  }\n\n  .mobile-pane {\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n\n    .title-mobile {\n      display: flex;\n      flex-direction: row-reverse;\n      justify-content: space-between;\n      margin: var(--theme-space-1) var(--theme-space-2);\n    }\n  }\n\n  .side-pane-content {\n    padding: var(--theme-space-1) var(--theme-space-2);\n    overflow: auto;\n    height: 100%;\n    width: 100%;\n  }\n}\n\n:host(.not-visible) {\n  display: none;\n}\n\n:host(.inline-color) {\n  background-color: var(--theme-color-1);\n}\n\n:host(.box-shadow) {\n  box-shadow: 0 0 1rem black;\n}\n\n:host(.nav-left-border) {\n  border-left: var(--theme-app-header--border-width) solid var(--theme-color-weak-bdr);\n}\n\n:host(.left-pane-border) {\n  @include set-border(right);\n}\n\n:host(.right-pane-border) {\n  @include set-border(left);\n}\n\n:host(.top-pane-border) {\n  @include set-border(bottom);\n}\n\n:host(.bottom-pane-border) {\n  @include set-border(top);\n}\n\n:host(.mobile-overlay) {\n  width: 100%;\n  position: absolute;\n  z-index: 100 !important;\n\n  .side-pane-content {\n    height: calc(100% - 2.5rem);\n  }\n}\n\n:host(.mobile-border-top) {\n  @include set-border(bottom);\n}\n\n:host(.mobile-border-bottom) {\n  @include set-border(top);\n}\n\n:host(.top-expanded) {\n  top: 0;\n}\n\n:host(.bottom-expanded) {\n  bottom: 0;\n}\n\n:host(.left-right-pane) {\n  height: 100%;\n}\n\n:host(.top-bottom-pane) {\n  width: 100%;\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  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport Animation from '../utils/animation';\nimport { applicationLayoutService } from '../utils/application-layout';\nimport { matchBreakpoint } from '../utils/breakpoints';\nimport {\n  iconClose,\n  iconDoubleChevronDown,\n  iconDoubleChevronLeft,\n  iconDoubleChevronRight,\n  iconDoubleChevronUp,\n} from '@siemens/ix-icons/icons';\n\nexport type Composition = 'top' | 'left' | 'bottom' | 'right';\nexport type ExpandedChangedEvent = {\n  slot: string;\n  expanded: boolean;\n};\nexport type SlotChangedEvent = {\n  slot: string;\n  newSlot: string;\n};\nexport type HideOnCollapseChangedEvent = {\n  slot: string;\n  hideOnCollapse: boolean;\n};\nexport type VariantChangedEvent = {\n  slot: string;\n  variant: 'floating' | 'inline';\n};\nexport type BorderlessChangedEvent = {\n  slot: string;\n  borderless: boolean;\n};\n\n/**\n * @since 2.1.0\n */\n@Component({\n  tag: 'ix-pane',\n  styleUrl: 'pane.scss',\n  shadow: true,\n})\nexport class Pane {\n  @Element() hostElement!: HTMLIxPaneElement;\n\n  /**\n   * Title of the side panel\n   */\n  @Prop() heading?: string;\n\n  /**\n   * Variant of the side pane.\n   * Defaults to the variant attribute of the pane layout. If used standalone it defaults to inline.\n   */\n  @Prop() variant: 'floating' | 'inline' = 'inline';\n\n  /**\n   * Define if the pane should have a collapsed state\n   */\n  @Prop() hideOnCollapse: boolean = false;\n\n  /**\n   * The maximum size of the sidebar, when it is expanded\n   */\n  @Prop() size:\n    | '240px'\n    | '320px'\n    | '360px'\n    | '480px'\n    | '600px'\n    | '33%'\n    | '50%' = '240px';\n\n  /**\n   * Toggle the border of the pane.\n   * Defaults to the borderless attribute of the pane layout. If used standalone it defaults to false.\n   */\n  @Prop() borderless: boolean = false;\n\n  /**\n   * State of the pane\n   */\n  @Prop({ mutable: true }) expanded: boolean = false;\n\n  /**\n   * Defines the position of the pane inside it's container.\n   * Inside a pane layout this property will automatically be set to the name of slot the pane is assigned to.\n   */\n  @Prop({ mutable: true }) composition: Composition = 'top';\n\n  /**\n   * Name of the icon\n   */\n  @Prop() icon?: string;\n\n  /**\n   * @internal\n   * Prevents overwriting of the variant and borderless property when used inside layout\n   */\n  @Prop() ignoreLayoutSettings: boolean = false;\n\n  /**\n   * @internal\n   */\n  @Prop({ mutable: true }) isMobile: boolean = false;\n\n  /**\n   * This event is triggered when the pane either expands or contracts\n   */\n  @Event() expandedChanged!: EventEmitter<ExpandedChangedEvent>;\n\n  /**\n   * This event is triggered when the variant of the pane is changed\n   */\n  @Event() variantChanged!: EventEmitter<VariantChangedEvent>;\n\n  /**\n   * This event is triggered when the variant of the pane is changed\n   */\n  @Event() borderlessChanged!: EventEmitter<BorderlessChangedEvent>;\n\n  /**\n   * @internal\n   */\n  @Event() hideOnCollapseChanged!: EventEmitter<HideOnCollapseChangedEvent>;\n\n  /**\n   * @internal\n   */\n  @Event() slotChanged!: EventEmitter<SlotChangedEvent>;\n\n  @State() private expandIcon = '';\n  @State() private showContent = false;\n  @State() private minimizeIcon = '';\n  @State() private floating = false;\n  @State() private parentWidthPx = 0;\n  @State() private parentHeightPx = 0;\n\n  private static readonly validPositions = ['top', 'left', 'bottom', 'right'];\n  private static readonly collapsedPane = '40px';\n  private static readonly collapsedPaneMobile = '48px';\n  private readonly animations: Map<string, anime.AnimeInstance> = new Map();\n  private animationCounter = 0;\n\n  private mutationObserver?: MutationObserver;\n  private resizeObserver?: ResizeObserver;\n\n  get currentSlot() {\n    return this.hostElement.getAttribute('slot');\n  }\n\n  get isBottomTopPane() {\n    return this.composition === 'bottom' || this.composition === 'top';\n  }\n\n  get isLeftRightPane() {\n    return this.composition === 'left' || this.composition === 'right';\n  }\n\n  get isMobileTop() {\n    return this.composition === 'top' || this.composition === 'left';\n  }\n\n  componentWillLoad() {\n    this.setIcons();\n\n    this.floating = this.variant === 'floating';\n\n    if (this.expanded) {\n      this.onParentSizeChange();\n    }\n\n    this.isMobile = matchBreakpoint('sm');\n    applicationLayoutService.onChange.on(() => {\n      this.isMobile = matchBreakpoint('sm');\n    });\n\n    if (this.currentSlot) {\n      this.setPosition(this.currentSlot);\n    }\n\n    this.mutationObserver = new MutationObserver((mutations) => {\n      mutations.forEach((mutation) => {\n        if (\n          mutation.type === 'attributes' &&\n          mutation.attributeName === 'slot'\n        ) {\n          const newSlot = this.currentSlot;\n          const oldSlot = mutation.oldValue;\n\n          if (newSlot !== oldSlot) {\n            this.slotChanged.emit({\n              slot: oldSlot ?? '',\n              newSlot: newSlot ?? '',\n            });\n\n            if (newSlot) {\n              this.setPosition(newSlot);\n            }\n          }\n        }\n      });\n    });\n    this.mutationObserver.observe(this.hostElement, {\n      attributes: true,\n      attributeOldValue: true,\n    });\n\n    const parentElement = this.hostElement.parentElement;\n    this.resizeObserver = new ResizeObserver((entries) => {\n      this.parentWidthPx = entries[0].borderBoxSize[0].inlineSize;\n      this.parentHeightPx = entries[0].borderBoxSize[0].blockSize;\n    });\n    if (parentElement) this.resizeObserver.observe(parentElement);\n  }\n\n  disconnectedCallback() {\n    this.mutationObserver?.disconnect();\n    this.resizeObserver?.disconnect();\n  }\n\n  private setPosition(value: string) {\n    if (Pane.validPositions.includes(value)) {\n      this.composition = value as Composition;\n    }\n  }\n\n  private getExpandPaneSize() {\n    let expandPaneSize: string;\n\n    if (this.isBottomTopPane) {\n      if (this.size.includes('px')) {\n        const referenceValue = Math.round(this.parentHeightPx / 2);\n        const currentValue = Number(this.size.replace('px', ''));\n\n        if (referenceValue && referenceValue < currentValue) {\n          expandPaneSize = `${referenceValue}px`;\n        } else {\n          expandPaneSize = `${currentValue}px`;\n        }\n      } else {\n        if (this.size === '50%') {\n          expandPaneSize = `${Math.round(this.parentHeightPx / 2)}px`;\n        } else {\n          expandPaneSize = `${Math.round(this.parentHeightPx / 3)}px`;\n        }\n      }\n    } else {\n      if (this.size.includes('px')) {\n        const referenceValue = Math.round(this.parentWidthPx / 2);\n        const currentValue = Number(this.size.replace('px', ''));\n\n        if (referenceValue && referenceValue < currentValue) {\n          expandPaneSize = `${referenceValue}px`;\n        } else {\n          expandPaneSize = `${currentValue}px`;\n        }\n      } else {\n        if (this.size === '50%') {\n          expandPaneSize = `${Math.round(this.parentWidthPx / 2)}px`;\n        } else {\n          expandPaneSize = `${Math.round(this.parentWidthPx / 3)}px`;\n        }\n      }\n    }\n\n    return expandPaneSize;\n  }\n\n  private setIcons() {\n    const { expandIcon, minimizeIcon } = this.getIconNames();\n    this.expandIcon = expandIcon;\n    this.minimizeIcon = minimizeIcon;\n  }\n\n  private getIconNames(): { expandIcon: string; minimizeIcon: string } {\n    let expandIcon = '';\n    let minimizeIcon = '';\n\n    switch (this.composition) {\n      case 'left':\n        expandIcon = this.isMobile\n          ? iconDoubleChevronUp\n          : iconDoubleChevronLeft;\n        minimizeIcon = this.isMobile\n          ? iconDoubleChevronDown\n          : iconDoubleChevronRight;\n        break;\n      case 'right':\n        expandIcon = this.isMobile\n          ? iconDoubleChevronDown\n          : iconDoubleChevronRight;\n        minimizeIcon = this.isMobile\n          ? iconDoubleChevronUp\n          : iconDoubleChevronLeft;\n        break;\n      case 'bottom':\n        expandIcon = iconDoubleChevronDown;\n        minimizeIcon = iconDoubleChevronUp;\n        break;\n      case 'top':\n        expandIcon = iconDoubleChevronUp;\n        minimizeIcon = iconDoubleChevronDown;\n        break;\n    }\n\n    return { expandIcon, minimizeIcon };\n  }\n\n  private getKey() {\n    return (this.animationCounter++).toString();\n  }\n\n  private animateVerticalFadeIn(size: string) {\n    let key = this.getKey();\n    let animation = anime({\n      targets: this.hostElement,\n      duration: Animation.mediumTime,\n      width: size,\n      easing: 'easeInOutSine',\n      delay: 0,\n      begin: () => {\n        if (!this.expanded) {\n          this.showContent = false;\n          this.animateVerticalPadding('0px');\n        } else {\n          this.animateVerticalPadding('8px');\n        }\n      },\n      complete: () => {\n        if (this.expanded) {\n          this.showContent = true;\n        }\n\n        this.animations.delete(key);\n      },\n    });\n\n    this.animations.set(key, animation);\n  }\n\n  private animateHorizontalFadeIn(size: string) {\n    let key = this.getKey();\n    let animation = anime({\n      targets: this.hostElement,\n      duration: Animation.mediumTime,\n      height: size,\n      easing: 'easeInOutSine',\n      delay: 0,\n      begin: () => {\n        if (!this.expanded) {\n          this.showContent = false;\n          if (!this.isMobile) this.animateHorizontalPadding('0px');\n        } else {\n          if (!this.isMobile) this.animateHorizontalPadding('8px');\n        }\n      },\n      complete: () => {\n        if (this.expanded) {\n          this.showContent = true;\n        }\n\n        this.animations.delete(key);\n      },\n    });\n\n    this.animations.set(key, animation);\n  }\n\n  private removePadding() {\n    anime({\n      targets: this.hostElement.shadowRoot!.querySelector('#title-div'),\n      duration: 0,\n      paddingTop: 0,\n      paddingBottom: 0,\n      paddingLeft: 0,\n      paddingRight: 0,\n      delay: 0,\n    });\n  }\n\n  private animateHorizontalPadding(\n    size: string,\n    duration = Animation.mediumTime\n  ) {\n    let key = this.getKey();\n    let animation = anime({\n      targets: this.hostElement.shadowRoot!.querySelector('#title-div'),\n      duration: duration,\n      paddingTop: size,\n      paddingBottom: size,\n      easing: 'easeInOutSine',\n      delay: 0,\n      complete: () => {\n        this.animations.delete(key);\n      },\n    });\n\n    this.animations.set(key, animation);\n  }\n\n  private animateVerticalPadding(\n    size: string,\n    duration = Animation.mediumTime\n  ) {\n    let key = this.getKey();\n    let animation = anime({\n      targets: this.hostElement.shadowRoot!.querySelector('#title-div'),\n      duration: duration,\n      paddingLeft: size,\n      paddingRight: size,\n      easing: 'easeInOutSine',\n      delay: 0,\n      complete: () => {\n        this.animations.delete(key);\n      },\n    });\n\n    this.animations.set(key, animation);\n  }\n\n  private clearAnimations() {\n    this.animations.forEach((animation) => animation.pause());\n    this.animations.clear();\n    this.animationCounter = 0;\n  }\n\n  @Watch('isMobile')\n  onMobileChange() {\n    this.setIcons();\n    this.hostElement.style.removeProperty('width');\n    this.hostElement.style.removeProperty('height');\n    this.hostElement.style.removeProperty('min-height');\n    this.onParentSizeChange();\n  }\n\n  @Watch('composition')\n  onPositionChange() {\n    this.setIcons();\n    this.hostElement.style.removeProperty('width');\n    this.hostElement.style.removeProperty('height');\n    this.onParentSizeChange();\n  }\n\n  @Watch('hideOnCollapse')\n  onHideOnCollapseChange(value: boolean) {\n    this.onParentSizeChange();\n\n    this.hideOnCollapseChanged.emit({\n      slot: this.currentSlot ?? '',\n      hideOnCollapse: value,\n    });\n  }\n\n  @Watch('variant')\n  onVariantChange(value: 'inline' | 'floating') {\n    this.floating = value === 'floating';\n\n    this.variantChanged.emit({\n      slot: this.currentSlot ?? '',\n      variant: value,\n    });\n  }\n\n  @Watch('borderless')\n  onBorderlessChange(value: boolean) {\n    this.borderlessChanged.emit({\n      slot: this.currentSlot ?? '',\n      borderless: value,\n    });\n  }\n\n  private dispatchExpandedChangedEvent() {\n    const event = this.expandedChanged.emit({\n      slot: this.currentSlot ?? '',\n      expanded: !this.expanded,\n    });\n\n    if (!event.defaultPrevented) {\n      this.expanded = !this.expanded;\n    }\n  }\n\n  @Watch('parentHeightPx')\n  @Watch('parentWidthPx')\n  onParentSizeChange() {\n    this.clearAnimations();\n    this.removePadding();\n\n    if (this.expanded) {\n      if (this.isMobile) {\n        this.hostElement.style.height = '100%';\n      } else {\n        const expandPaneSize = this.getExpandPaneSize();\n\n        if (this.isBottomTopPane) {\n          this.hostElement.style.height = expandPaneSize;\n          this.animateHorizontalPadding('8px', 0);\n        } else {\n          this.hostElement.style.width = expandPaneSize;\n          this.animateVerticalPadding('8px', 0);\n        }\n      }\n\n      this.showContent = true;\n    } else {\n      this.showContent = false;\n\n      if (this.isMobile) {\n        this.hostElement.style.height = this.hideOnCollapse\n          ? '0'\n          : Pane.collapsedPaneMobile;\n      } else {\n        if (this.isBottomTopPane) {\n          this.hostElement.style.height = this.hideOnCollapse\n            ? '0'\n            : Pane.collapsedPane;\n        } else {\n          this.hostElement.style.width = this.hideOnCollapse\n            ? '0'\n            : Pane.collapsedPane;\n        }\n      }\n    }\n  }\n\n  @Watch('expanded')\n  @Watch('size')\n  onSizeChange() {\n    if (this.expanded) {\n      if (this.isMobile) {\n        this.hostElement.style.minHeight = this.hideOnCollapse\n          ? '0'\n          : Pane.collapsedPaneMobile;\n        this.animateHorizontalFadeIn('100%');\n      } else {\n        const expandPaneSize = this.getExpandPaneSize();\n\n        if (this.isBottomTopPane) {\n          this.hostElement.style.height = this.hideOnCollapse\n            ? '0'\n            : Pane.collapsedPane;\n          this.animateHorizontalFadeIn(expandPaneSize);\n        } else {\n          this.hostElement.style.width = this.hideOnCollapse\n            ? '0'\n            : Pane.collapsedPane;\n          this.animateVerticalFadeIn(expandPaneSize);\n        }\n      }\n    } else {\n      this.showContent = false;\n\n      if (this.isMobile) {\n        this.hostElement.style.height = Pane.collapsedPaneMobile;\n      } else {\n        if (this.isBottomTopPane) {\n          this.animateHorizontalFadeIn(Pane.collapsedPane);\n        } else {\n          this.animateVerticalFadeIn(Pane.collapsedPane);\n        }\n      }\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'inline-color': !this.floating,\n          'mobile-overlay': this.expanded && this.isMobile,\n          'top-expanded': this.expanded && this.isMobileTop && this.isMobile,\n          'bottom-expanded':\n            this.expanded && !this.isMobileTop && this.isMobile,\n          'top-bottom-pane': this.isBottomTopPane && !this.isMobile,\n          'left-right-pane': this.isLeftRightPane && !this.isMobile,\n          [`${this.composition}-pane-border`]:\n            !this.borderless && !this.isMobile && !this.floating,\n          'nav-left-border':\n            !this.borderless &&\n            !this.isMobile &&\n            this.composition !== 'right' &&\n            this.floating,\n          'mobile-border-top':\n            !this.borderless &&\n            this.isMobileTop &&\n            this.isMobile &&\n            !this.expanded &&\n            !this.floating,\n          'mobile-border-bottom':\n            !this.borderless &&\n            !this.isMobileTop &&\n            this.isMobile &&\n            !this.expanded &&\n            !this.floating,\n          'box-shadow': this.floating,\n          'aria-expanded': this.expanded,\n          'not-visible': this.hideOnCollapse && !this.expanded,\n        }}\n      >\n        <aside\n          id={`pane-${this.composition}`}\n          class={{\n            'top-bottom-pane': this.isBottomTopPane && !this.isMobile,\n            'left-right-pane': this.isLeftRightPane && !this.isMobile,\n            'mobile-pane': this.isMobile,\n            expanded: this.expanded,\n          }}\n        >\n          <div\n            id=\"title-div\"\n            class={{\n              title:\n                !this.isMobile && !this.hideOnCollapse && !this.showContent,\n              'title-finished':\n                !this.isMobile && !this.hideOnCollapse && this.showContent,\n              'title-expanded':\n                !this.isMobile && !this.hideOnCollapse && this.expanded,\n              'title-hide-on-collapse': !this.isMobile && this.hideOnCollapse,\n              'title-mobile': this.isMobile,\n              'header-gap': !this.isMobile && !this.hideOnCollapse,\n            }}\n          >\n            <ix-icon-button\n              class=\"title-icon\"\n              size=\"24\"\n              icon={\n                this.expanded\n                  ? this.isMobile || this.hideOnCollapse\n                    ? iconClose\n                    : this.expandIcon\n                  : this.minimizeIcon\n              }\n              ghost\n              onClick={() => this.dispatchExpandedChangedEvent()}\n              aria-controls={`pane-${this.composition}`}\n            />\n            <span\n              class={{\n                'title-text': true,\n                rotate:\n                  !this.expanded && !this.isMobile && this.isLeftRightPane,\n              }}\n            >\n              {this.icon ? (\n                <ix-icon size=\"24\" name={this.icon}></ix-icon>\n              ) : null}\n              <div class=\"title-text-overflow\">\n                <ix-typography format=\"h4\">{this.heading}</ix-typography>\n              </div>\n            </span>\n          </div>\n          <div class=\"side-pane-content\" hidden={!this.showContent}>\n            <slot></slot>\n          </div>\n        </aside>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/p-3f03f070.entry.js

@@ -0,0 +1,2 @@
+import{r,h as o,H as t,c as e,g as a}from"./p-DtF9fwpD.js";import{a as s}from"./p-i60z1FJC.js";import{p as c}from"./p-CrTP-icT.js";const l=":host{display:block;position:relative;overflow:auto;padding:0 0.5rem 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}";const b=class{constructor(o){r(this,o)}render(){return o(t,{key:"966dfdf390ee974c55f0a1c05e63b1b0480826ad"},o("slot",{key:"ef9e15cdce6192604d87cafc83caad2b73e820d9"}))}};b.style=l;const i=":host{display:flex;padding:0.5rem 0 0.5rem 0.5rem;align-items:center;gap:1rem}: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 .modal-title{flex-grow:1}:host .modal-close{align-self:flex-start}";const h=class{constructor(o){r(this,o);this.closeClick=e(this,"closeClick",7);this.hideClose=false}onIconChange(r){if(this.parentDialog){if(r){this.parentDialog.classList.add("with-icon")}else{this.parentDialog.classList.remove("with-icon")}}}componentDidLoad(){this.parentDialog=s(this.hostElement,"ix-modal");this.onIconChange(this.icon)}onCloseClick(r){const o=this.closeClick.emit(r);if(o.defaultPrevented||r.defaultPrevented){return}this.parentDialog.dismissModal()}render(){return o(t,{key:"6b75c891d3e4d19ce6f8692e73d1aa03c04b0cc4"},this.icon?o("ix-icon",{name:this.icon,color:this.iconColor,size:"32"}):null,o("div",{key:"34e9e7683b1c4b9c800442c6b587cb2a6e58349e",class:"modal-title"},o("ix-typography",{key:"f98c534d57ecebaa2201e3cfbaa697e42b728774",format:"h5"},o("slot",{key:"bd2904a4745d9e695d4e91aef8225a268a8ee2b5"}))),!this.hideClose?o("ix-icon-button",{class:"modal-close",onClick:r=>this.onCloseClick(r),ghost:true,icon:c}):null)}get hostElement(){return a(this)}static get watchers(){return{icon:["onIconChange"]}}};h.style=i;export{b as ix_modal_content,h as ix_modal_header};
+//# sourceMappingURL=p-3f03f070.entry.js.map

package/dist/siemens-ix/p-3f03f070.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["modalContentCss","ModalContent","render","h","Host","key","modalHeaderCss","ModalHeader","constructor","hostRef","this","hideClose","onIconChange","icon","parentDialog","classList","add","remove","componentDidLoad","closestPassShadow","hostElement","onCloseClick","event","ce","closeClick","emit","defaultPrevented","dismissModal","name","color","iconColor","size","class","format","onClick","ghost","iconClose"],"sources":["src/components/modal-content/modal-content.scss?tag=ix-modal-content&encapsulation=shadow","src/components/modal-content/modal-content.tsx","src/components/modal-header/modal-header.scss?tag=ix-modal-header&encapsulation=shadow","src/components/modal-header/modal-header.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\n  display: block;\n  position: relative;\n  overflow: auto;\n  padding: 0 0.5rem 0.5rem;\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 } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-modal-content',\n  styleUrl: 'modal-content.scss',\n  shadow: true,\n})\nexport class ModalContent {\n  render() {\n    return (\n      <Host>\n        <slot></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 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: flex;\n  padding: 0.5rem 0 0.5rem 0.5rem;\n  align-items: center;\n  gap: 1rem;\n\n  .modal-title {\n    flex-grow: 1;\n  }\n\n  .modal-close  {\n    align-self: flex-start;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { closestPassShadow } from '../utils/shadow-dom';\nimport { iconClose } from '@siemens/ix-icons/icons';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-modal-header',\n  styleUrl: 'modal-header.scss',\n  shadow: true,\n})\nexport class ModalHeader {\n  @Element() hostElement!: HTMLIxModalHeaderElement;\n\n  /**\n   * Hide the close button\n   */\n  @Prop() hideClose = false;\n\n  /**\n   * Icon of the Header\n   */\n  @Prop() icon?: string;\n\n  @Watch('icon')\n  onIconChange(icon?: string) {\n    if (this.parentDialog) {\n      if (icon) {\n        this.parentDialog.classList.add('with-icon');\n      } else {\n        this.parentDialog.classList.remove('with-icon');\n      }\n    }\n  }\n\n  /**\n   * Icon color\n   */\n  @Prop() iconColor?: string;\n\n  /**\n   * Emits when close icon is clicked and closes the modal\n   * Can be prevented, in which case only the event is triggered, and the modal remains open\n   */\n  @Event() closeClick!: EventEmitter<MouseEvent>;\n\n  private parentDialog!: HTMLIxModalElement;\n\n  componentDidLoad() {\n    this.parentDialog = closestPassShadow(\n      this.hostElement,\n      'ix-modal'\n    ) as HTMLIxModalElement;\n    this.onIconChange(this.icon);\n  }\n\n  private onCloseClick(event: MouseEvent) {\n    const ce = this.closeClick.emit(event);\n    if (ce.defaultPrevented || event.defaultPrevented) {\n      return;\n    }\n\n    this.parentDialog.dismissModal();\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.icon ? (\n          <ix-icon name={this.icon} color={this.iconColor} size=\"32\"></ix-icon>\n        ) : null}\n        <div class=\"modal-title\">\n          <ix-typography format=\"h5\">\n            <slot></slot>\n          </ix-typography>\n        </div>\n        {!this.hideClose ? (\n          <ix-icon-button\n            class=\"modal-close\"\n            onClick={(event) => this.onCloseClick(event)}\n            ghost\n            icon={iconClose}\n          ></ix-icon-button>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"mIAAA,MAAMA,EAAkB,u0B,MCmBXC,EAAY,M,yBACvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAa,QAAAE,IAAA,6C,aCvBrB,MAAMC,EAAiB,i5B,MC8BVC,EAAW,MALxB,WAAAC,CAAAC,G,iDAWUC,KAASC,UAAG,KAsErB,CA9DC,YAAAC,CAAaC,GACX,GAAIH,KAAKI,aAAc,CACrB,GAAID,EAAM,CACRH,KAAKI,aAAaC,UAAUC,IAAI,Y,KAC3B,CACLN,KAAKI,aAAaC,UAAUE,OAAO,Y,GAkBzC,gBAAAC,GACER,KAAKI,aAAeK,EAClBT,KAAKU,YACL,YAEFV,KAAKE,aAAaF,KAAKG,K,CAGjB,YAAAQ,CAAaC,GACnB,MAAMC,EAAKb,KAAKc,WAAWC,KAAKH,GAChC,GAAIC,EAAGG,kBAAoBJ,EAAMI,iBAAkB,CACjD,M,CAGFhB,KAAKI,aAAaa,c,CAGpB,MAAAzB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFK,KAAKG,KACJV,EAAA,WAASyB,KAAMlB,KAAKG,KAAMgB,MAAOnB,KAAKoB,UAAWC,KAAK,OACpD,KACJ5B,EAAK,OAAAE,IAAA,2CAAA2B,MAAM,eACT7B,EAAe,iBAAAE,IAAA,2CAAA4B,OAAO,MACpB9B,EAAA,QAAAE,IAAA,gDAGFK,KAAKC,UACLR,EAAA,kBACE6B,MAAM,cACNE,QAAUZ,GAAUZ,KAAKW,aAAaC,GACtCa,MAAK,KACLtB,KAAMuB,IAEN,K","ignoreList":[]}

package/dist/siemens-ix/p-43e8cbf1.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as o,h as t,H as r,g as a}from"./p-DtF9fwpD.js";import{H as i}from"./p-Cdt22lfd.js";import{m as n}from"./p-bcj7UEIC.js";import{m as d,T as l,o as s}from"./p-CANRrgK_.js";import"./p-Bb7pDeaQ.js";import"./p-CX81WQtk.js";import"./p-pXYAoEyc.js";import"./p-Ou74PMQs.js";const b='input{font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}input[type=number]{text-align:right}input[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input:-webkit-autofill,input:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}input::-moz-placeholder{color:var(--theme-input-hint--color)}input::placeholder{color:var(--theme-input-hint--color)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),input:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}input:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only,input:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}input.read-only::-moz-placeholder,input:read-only::-moz-placeholder{color:transparent}input:-moz-read-only::placeholder{color:transparent}input.read-only::placeholder,input:read-only::placeholder{color:transparent}input:disabled,input.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}input:disabled::-moz-placeholder,input.disabled::-moz-placeholder{color:transparent}input:disabled::placeholder,input.disabled::placeholder{color:transparent}textarea{font-feature-settings:"clig" off, "liga" off;font-family:Siemens Sans, Siemens Sans, Arial, Helvetica, sans-serif;font-style:normal;font-size:var(--theme-ms-0);line-height:var(--theme-line-height-md);font-weight:var(--theme-font-weight-normal);letter-spacing:var(--theme-letter-spacing-xl);text-decoration:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;min-height:2rem;width:auto;padding:0.25rem 0.5rem;background-color:var(--theme-input--background);color:var(--theme-input--color);-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;text-overflow:ellipsis;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);box-shadow:var(--theme-input--box-shadow)}textarea[type=number]{text-align:right}textarea[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}textarea:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea:-webkit-autofill,textarea:autofill{-webkit-box-shadow:0 0 0 1000px var(--theme-color-component-info) inset !important;-webkit-text-fill-color:var(--theme-input--color--autofill) !important;background-color:var(--theme-input--background--autofill) !important;border:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color--autofill) !important;color:var(--theme-input--color--autofill) !important}textarea::-moz-placeholder{color:var(--theme-input-hint--color)}textarea::placeholder{color:var(--theme-input-hint--color)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:hover:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){border-color:var(--theme-input--border-color--hover) !important;background-color:var(--theme-input--background--hover)}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:-moz-read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea.focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only),textarea:focus:not(.readonly,.read-only,.disabled,[readonly],[disabled],:read-only){outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-input--focus--outline-offset);border-color:var(--theme-input--border-color--focus) !important}textarea:-moz-read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only,textarea:read-only{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--readonly)}textarea.read-only::-moz-placeholder,textarea:read-only::-moz-placeholder{color:transparent}textarea:-moz-read-only::placeholder{color:transparent}textarea.read-only::placeholder,textarea:read-only::placeholder{color:transparent}textarea:disabled,textarea.disabled{box-shadow:none;background-color:transparent;outline:none;border:none;border-radius:0;color:var(--theme-input--color--disabled);border-bottom:var(--theme-input--border-thickness, 1px) solid var(--theme-input--border-color-bottom--disabled)}textarea:disabled::-moz-placeholder,textarea.disabled::-moz-placeholder{color:transparent}textarea:disabled::placeholder,textarea.disabled::placeholder{color:transparent}textarea{min-height:2rem;height:3.25rem;padding:calc(0.375rem - var(--theme-input--border-thickness)) calc(0.5rem - var(--theme-input--border-thickness))}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]),input.ix-info:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--info)}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-info:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--info--hover) !important}textarea.ix-info:not(.disabled):not(:disabled):not([disabled]):active,input.ix-info:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--info--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]),input.ix-warning:not(.disabled):not(:disabled):not([disabled]){border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--warning--active) !important}textarea.ix-warning:not(.disabled):not(:disabled):not([disabled]):active,input.ix-warning:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--warning--active) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]),input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]){background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):hover{border-color:var(--theme-input--border-color--invalid--hover) !important}textarea[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active,input[class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled]):active{border-color:var(--theme-input--border-color--invalid--active) !important}:host{display:inline-block;position:relative;width:auto}: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-wrapper{display:flex;position:relative;align-items:center;width:100%;height:100%}:host input{width:100%;height:100%}:host .start-container,:host .end-container{display:flex;position:absolute;align-items:center;justify-content:center;z-index:1}:host .start-container{left:0}:host .end-container{right:0}:host .start-container ::slotted(*){margin-left:0.5rem}:host .start-container ::slotted(ix-icon.size-24),:host .start-container ::slotted(ix-icon-button.btn-icon-16){margin-left:0.25rem}:host .start-container ::slotted(ix-icon-button.btn-icon-32){margin-left:0}:host .end-container ::slotted(*){margin-right:0.5rem}:host .end-container ::slotted(ix-icon.size-24),:host .end-container ::slotted(ix-icon-button.btn-icon-16){margin-right:0.25rem}:host .end-container ::slotted(ix-icon-button.btn-icon-32){margin-right:0}:host .bottom-text{margin-top:0.25rem;margin-bottom:0.25rem}:host(.disabled){pointer-events:none}:host(.disabled) input,:host(.disabled) textarea{pointer-events:none}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input{border-color:var(--theme-input--border-color--info)}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--info--hover) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--info--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input{border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--warning--active) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input{background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input:hover,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input:hover{border-color:var(--theme-input--border-color--invalid--hover) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) input:active,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) input:active{border-color:var(--theme-input--border-color--invalid--active) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea{border-color:var(--theme-input--border-color--info)}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea:hover{border-color:var(--theme-input--border-color--info--hover) !important}:host(.ix-info:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--info--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea{border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea:hover{border-color:var(--theme-input--border-color--warning--active) !important}:host(.ix-warning:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--warning--active) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) textarea,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea{background-color:var(--theme-input--background--invalid);border-color:var(--theme-input--border-color--invalid) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) textarea:hover,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea:hover{border-color:var(--theme-input--border-color--invalid--hover) !important}:host([class*=ix-invalid]:not(.disabled):not(:disabled):not([disabled])) textarea:active,:host(.ix-invalid--required:not(.disabled):not(:disabled):not([disabled])) textarea:active{border-color:var(--theme-input--border-color--invalid--active) !important}';var c=undefined&&undefined.__decorate||function(e,o,t,r){var a=arguments.length,i=a<3?o:r===null?r=Object.getOwnPropertyDescriptor(o,t):r,n;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")i=Reflect.decorate(e,o,t,r);else for(var d=e.length-1;d>=0;d--)if(n=e[d])i=(a<3?n(i):a>3?n(o,t,i):n(o,t))||i;return a>3&&i&&Object.defineProperty(o,t,i),i};const h=class{constructor(t){e(this,t);this.valueChange=o(this,"valueChange",7);this.validityStateChange=o(this,"validityStateChange",7);this.ixBlur=o(this,"ixBlur",7);if(t.$hostElement$["s-ei"]){this.formInternals=t.$hostElement$["s-ei"]}else{this.formInternals=t.$hostElement$.attachInternals();t.$hostElement$["s-ei"]=this.formInternals}this.value="";this.required=false;this.disabled=false;this.readonly=false;this.resizeBehavior="both";this.isInvalid=false;this.isValid=false;this.isInfo=false;this.isWarning=false;this.isInvalidByRequired=false;this.textAreaRef=n();this.touched=false}updateClassMappings(e){d(this,e)}componentWillLoad(){this.updateFormInternalValue(this.value)}updateFormInternalValue(e){this.formInternals.setFormValue(e);this.value=e}async getAssociatedFormElement(){return this.formInternals.form}hasValidValue(){return Promise.resolve(!!this.value)}getNativeInputElement(){return this.textAreaRef.waitForCurrent()}async focusInput(){return(await this.getNativeInputElement()).focus()}isTouched(){return Promise.resolve(this.touched)}render(){return t(r,{key:"4ed1e77e5a025a8d1b65e3a25008d4fca1bc8ad8",class:{disabled:this.disabled,readonly:this.readonly}},t("ix-field-wrapper",{key:"b6ba1fb2ffe4f26ba0359eb84b973c33c35ebe55",required:this.required,label:this.label,helperText:this.helperText,invalidText:this.invalidText,infoText:this.infoText,warningText:this.warningText,validText:this.validText,showTextAsTooltip:this.showTextAsTooltip,isInvalid:this.isInvalid,isValid:this.isValid,isInfo:this.isInfo,isWarning:this.isWarning,controlRef:this.textAreaRef},!!this.maxLength&&this.maxLength>0&&t("ix-typography",{key:"00f8ab4aa178a1af626d55ce31767a664ef9756e",class:"bottom-text",slot:"bottom-right",textColor:"soft"},this.value.length,"/",this.maxLength),t("div",{key:"acba6f724a576aad52da6d056ac8c55d17e20d53",class:"input-wrapper"},t(l,{key:"626449aeefaba4a31e5b6d96f8638c1cf962555a",minLength:this.minLength,maxLength:this.maxLength,textareaCols:this.textareaCols,textareaRows:this.textareaRows,textareaHeight:this.textareaHeight,textareaWidth:this.textareaWidth,resizeBehavior:this.resizeBehavior,readonly:this.readonly,disabled:this.disabled,isInvalid:this.isInvalid,required:this.required,value:this.value,placeholder:this.placeholder,textAreaRef:this.textAreaRef,valueChange:e=>this.valueChange.emit(e),updateFormInternalValue:e=>this.updateFormInternalValue(e),onBlur:()=>{s(this,this.textAreaRef.current);this.touched=true}}))))}static get formAssociated(){return true}get hostElement(){return a(this)}};c([i()],h.prototype,"updateClassMappings",null);h.style=b;export{h as ix_textarea};
+//# sourceMappingURL=p-43e8cbf1.entry.js.map