@siemens/ix 1.6.2 → 2.0.0-beta.0

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

@@ -1 +0,0 @@
-{"version":3,"names":["toastCss","Toast","getIcon","this","icon","h","name","color","iconColor","size","type","close","host","classList","add","setTimeout","closeToast","emit","render","progressBarStyle","progressBarClass","animationDuration","autoCloseDelay","animationPlayState","touched","push","Host","class","onPointerLeave","onPointerEnter","toastTitle","ghost","onClick","autoClose","join","style","onAnimationEnd","onTransitionEnd","progress","ToastContainer","PREFIX_POSITION_CLASS","hostContainer","document","getElementById","containerId","componentDidLoad","toastContainer","createElement","id","containerClass","position","body","appendChild","onPositionChange","newPosition","oldPosition","remove","async","config","toast","onClose","TypedEvent","removeToast","result","title","addEventListener","event","detail","message","innerText"],"sources":["./src/components/toast/toast.scss?tag=ix-toast&encapsulation=scoped","./src/components/toast/toast.tsx","./src/components/toast/toast-container.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  min-width: 17.5rem;\n  max-width: 17.5rem;\n  min-height: 3.5rem;\n\n  pointer-events: all;\n\n  background-color: var(--theme-toast--background);\n  border: var(--theme-toast--border-thickness) solid\n    var(--theme-toast--border-color);\n  border-radius: var(--theme-toast--border-radius);\n  box-shadow: var(--theme-toast--box-shadow);\n\n  --animate-duration: #{$medium-time};\n\n  .toast-body {\n    display: flex;\n    position: relative;\n    width: 100%;\n    flex-grow: 1;\n\n    .toast-icon {\n      display: flex;\n      align-items: flex-start;\n      margin: $default-space;\n    }\n\n    .toast-content {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      min-width: 0;\n      width: 100%;\n      max-width: 10.25rem;\n      margin-top: calc(\n        #{$default-space} + var(--theme-toast--border-thickness)\n      );\n      margin-bottom: $medium-space;\n\n      .toast-message {\n        min-width: 0;\n      }\n    }\n  }\n\n  .toast-close {\n    display: flex;\n    position: relative;\n    margin: $medium-space;\n    pointer-events: all;\n  }\n\n  .toast-progress-bar {\n    position: absolute;\n    bottom: 0;\n    height: $tiny-space;\n    width: 100%;\n    background-color: var(--theme-toast-timer-value--background);\n    transform-origin: left;\n\n    &--animated {\n      animation: trackProgress linear 1 forwards;\n    }\n  }\n\n  @keyframes trackProgress {\n    0% {\n      transform: scaleX(1);\n    }\n    100% {\n      transform: scaleX(0);\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 {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { ToastType } from './toast-utils';\n\n@Component({\n  tag: 'ix-toast',\n  styleUrl: 'toast.scss',\n  scoped: true,\n})\nexport class Toast {\n  /**\n   * Toast type\n   */\n  @Prop() type: ToastType = 'info';\n\n  /**\n   * Toast title\n   */\n  @Prop() toastTitle: string;\n\n  /**\n   * Autoclose title after delay\n   */\n  @Prop() autoCloseDelay = 5000;\n\n  /**\n   * Autoclose behavior\n   */\n  @Prop() autoClose = true;\n\n  /**\n   * Icon of toast\n   */\n  @Prop() icon: string;\n\n  /**\n   * Icon color of toast\n   */\n  @Prop() iconColor: string;\n\n  /**\n   * Toast closed\n   */\n  @Event() closeToast: EventEmitter;\n\n  @State() progress = 0;\n  @State() touched = false;\n\n  @Element() host!: HTMLIxToastElement;\n\n  private getIcon() {\n    if (this.icon) {\n      return <ix-icon name={this.icon} color={this.iconColor} size=\"24\" />;\n    }\n\n    switch (this.type) {\n      case 'info':\n        return <ix-icon name={'info'} size=\"24\" color=\"color-std-text\" />;\n\n      case 'error':\n        return <ix-icon name={'error'} size=\"24\" color=\"color-alarm\" />;\n\n      case 'success':\n        return <ix-icon name={'success'} size=\"24\" color=\"color-success\" />;\n\n      case 'warning':\n        return <ix-icon name={'warning'} size=\"24\" color=\"color-warning\" />;\n\n      default:\n        return '';\n    }\n  }\n\n  private close() {\n    if (this.host) {\n      this.host.classList.add('animate__fadeOut');\n    }\n    setTimeout(() => {\n      this.closeToast.emit();\n    }, 250);\n  }\n\n  render() {\n    let progressBarStyle: Record<string, string> = {};\n\n    const progressBarClass = ['toast-progress-bar'];\n\n    progressBarStyle = {\n      animationDuration: `${this.autoCloseDelay}ms`,\n      animationPlayState: this.touched ? 'paused' : 'running',\n    };\n\n    progressBarClass.push('toast-progress-bar--animated');\n\n    return (\n      <Host class=\"animate__animated animate__fadeIn\">\n        <div\n          class=\"toast-body\"\n          onPointerLeave={() => {\n            this.touched = false;\n          }}\n          onPointerEnter={() => {\n            this.touched = true;\n          }}\n        >\n          {this.type || this.icon ? (\n            <div class=\"toast-icon\">{this.getIcon()}</div>\n          ) : null}\n          <div class=\"toast-content\">\n            {this.toastTitle ? (\n              <div class=\"toast-title text-default-title-single\">\n                {this.toastTitle}\n              </div>\n            ) : null}\n            <div class=\"toast-message text-default\">\n              <slot></slot>\n            </div>\n          </div>\n          <div class=\"toast-close\">\n            <ix-icon-button\n              icon=\"close\"\n              size=\"24\"\n              ghost\n              onClick={() => this.closeToast.emit()}\n            />\n          </div>\n        </div>\n        {this.autoClose ? (\n          <div\n            class={progressBarClass.join(' ')}\n            style={progressBarStyle}\n            onAnimationEnd={() => {\n              this.close();\n            }}\n            onTransitionEnd={() => {\n              if (this.progress === 0) {\n                this.close();\n              }\n            }}\n          ></div>\n        ) : null}\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\nimport {\n  Component,\n  Element,\n  h,\n  Host,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { TypedEvent } from '../utils/typed-event';\nimport { ToastConfig } from './toast-utils';\n\n@Component({\n  tag: 'ix-toast-container',\n  scoped: true,\n})\nexport class ToastContainer {\n  @Element() host!: HTMLIxToastContainerElement;\n\n  /**\n   */\n  @Prop() containerId = 'toast-container';\n\n  /**\n   */\n  @Prop() containerClass = 'toast-container';\n\n  /**\n   */\n  @Prop() position: 'bottom-right' | 'top-right' = 'bottom-right';\n\n  private readonly PREFIX_POSITION_CLASS = 'toast-container--';\n\n  get hostContainer() {\n    return document.getElementById(this.containerId);\n  }\n\n  componentDidLoad() {\n    if (!document.getElementById(this.containerId)) {\n      const toastContainer = document.createElement('div');\n      toastContainer.id = this.containerId;\n      toastContainer.classList.add(this.containerClass);\n      toastContainer.classList.add(\n        `${this.PREFIX_POSITION_CLASS}${this.position}`\n      );\n      document.body.appendChild(toastContainer);\n    }\n  }\n\n  @Watch('position')\n  onPositionChange(newPosition: string, oldPosition: string) {\n    const toastContainer = document.getElementById(this.containerId);\n    toastContainer.classList.remove(\n      `${this.PREFIX_POSITION_CLASS}${oldPosition}`\n    );\n    toastContainer.classList.add(`${this.PREFIX_POSITION_CLASS}${newPosition}`);\n  }\n\n  /**\n   * Display a toast message\n   * @param config\n   */\n  @Method()\n  async showToast(config: ToastConfig) {\n    const toast = document.createElement('ix-toast');\n\n    const onClose = new TypedEvent<any | undefined>();\n\n    function removeToast(result?: any) {\n      toast.remove();\n      onClose.emit(result);\n    }\n\n    toast.toastTitle = config.title;\n    toast.type = config.type;\n    toast.autoClose = config.autoClose;\n    toast.autoCloseDelay = config.autoCloseDelay;\n    toast.icon = config.icon;\n    toast.iconColor = config.iconColor;\n    toast.addEventListener(\n      'closeToast',\n      (event: CustomEvent<any | undefined>) => {\n        const { detail } = event;\n        removeToast(detail);\n      }\n    );\n\n    if (typeof config.message === 'string') {\n      toast.innerText = config.message;\n    } else {\n      toast.appendChild(config.message);\n    }\n\n    this.hostContainer.appendChild(toast);\n\n    return {\n      onClose,\n      close: (result?: any) => {\n        removeToast(result);\n      },\n    };\n  }\n\n  render() {\n    return <Host></Host>;\n  }\n}\n"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-import{r as t,h as i,H as o,g as e}from"./p-1c64b073.js";import{i as s,s as a,o as n,d as l,a as r,b as h,c as d}from"./p-f34a16c6.js";function m(t){if(t.includes("-end")){return"end"}else if(t.includes("-start")){return"start"}return undefined}const f='.text-xs.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title.sc-ix-validation-tooltip{-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)}.text-default-title-single.sc-ix-validation-tooltip{-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.143em;color:var(--theme-color-std-text)}.text-l.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title.sc-ix-validation-tooltip{-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)}.text-l-title-single.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2.sc-ix-validation-tooltip{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl.sc-ix-validation-tooltip{-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)}a.sc-ix-validation-tooltip{color:var(--theme-color-primary)}.sc-ix-validation-tooltip-h{display:inline-block;position:relative}.sc-ix-validation-tooltip-h .validation-tooltip.sc-ix-validation-tooltip{background-color:var(--theme-tootlip--background);color:var(--theme-tooltip--color);padding:5px 10px;border-radius:4px;font-size:13px;border:1px solid var(--theme-tooltip--border-color);box-shadow:0 0 2px 0 rgba(0, 0, 40, 0.1), 0 4px 8px 0 rgba(0, 0, 40, 0.1), 0 12px 18px 0 rgba(0, 0, 40, 0.1)}.sc-ix-validation-tooltip-h .validation-tooltip.sc-ix-validation-tooltip #arrow.sc-ix-validation-tooltip,.sc-ix-validation-tooltip-h .validation-tooltip.sc-ix-validation-tooltip #arrow.sc-ix-validation-tooltip::before{position:absolute;width:8px;height:8px;background:inherit}.sc-ix-validation-tooltip-h .validation-tooltip.sc-ix-validation-tooltip #arrow.sc-ix-validation-tooltip{visibility:hidden}.sc-ix-validation-tooltip-h .validation-tooltip.sc-ix-validation-tooltip #arrow.sc-ix-validation-tooltip::before{visibility:visible;content:"";transform:rotate(45deg);background-color:var(--theme-tootlip--background)}.sc-ix-validation-tooltip-h .validation-tooltip.sc-ix-validation-tooltip>#arrow.sc-ix-validation-tooltip{bottom:-5px}.sc-ix-validation-tooltip-h .validation-tooltip.sc-ix-validation-tooltip>#arrow.sc-ix-validation-tooltip::before{border-right:1px solid var(--theme-tooltip--border-color);border-bottom:1px solid var(--theme-tooltip--border-color)}';const c=class{constructor(i){t(this,i);this.onSubmitBind=this.onSubmit.bind(this);this.onInputFocusBind=this.onInputFocus.bind(this);this.message=undefined;this.placement="top";this.isInputValid=true;this.tooltipPosition=undefined;this.arrowPosition=undefined}get arrow(){return this.hostElement.querySelector("#arrow")}get inputElement(){return this.hostElement.querySelector("input")}get formElement(){return this.inputElement.form}get tooltipElement(){return this.hostElement.querySelector(".validation-tooltip")}destoryAutoUpdate(){this.tooltipElement.style.display="none";if(this.autoUpdateCleanup){this.autoUpdateCleanup()}}applyTooltipPosition(){this.tooltipElement.style.display="block";let t={strategy:"fixed",middleware:[s(),a(),n({mainAxis:8})]};if(this.placement.includes("auto")){t.middleware.push(l({alignment:m(this.placement)}))}else{t.placement=this.placement}this.autoUpdateCleanup=r(this.inputElement,this.tooltipElement,(async()=>{t.middleware=[...t.middleware,h({element:this.arrow})];const i=await d(this.inputElement,this.tooltipElement,t);if(i.middlewareData.arrow){const{x:t,y:o}=i.middlewareData.arrow;this.arrowPosition={x:t,y:o};Object.assign(this.arrow.style,{left:t!=null?`${t}px`:"",top:o!=null?`${o}px`:""})}this.tooltipPosition={x:i.x,y:i.y}}),{ancestorResize:true,ancestorScroll:true,elementResize:true})}componentDidLoad(){if(!this.inputElement){throw Error("Validation tooltip is only working with an direct input child.")}if(!this.formElement){throw Error("Validation tooltip is only working with an form element.")}this.formElement.addEventListener("submit",this.onSubmitBind);this.inputElement.addEventListener("focus",this.onInputFocusBind);this.observer=new MutationObserver((()=>{if(this.inputElement.classList.contains("is-invalid")){this.isInputValid=false;this.validationChanged()}}));this.observer.observe(this.inputElement,{childList:false,subtree:false,attributes:true,attributeFilter:["class"]})}onInputFocus(){this.isInputValid=true}onSubmit(){if(this.formElement.classList.contains("needs-validation")){this.isInputValid=this.inputElement.validity.valid}}disconnectedCallback(){var t;(t=this.observer)===null||t===void 0?void 0:t.disconnect();this.destoryAutoUpdate();this.formElement.removeEventListener("submit",this.onSubmitBind);this.inputElement.removeEventListener("focus",this.onInputFocusBind)}validationChanged(){if(!this.isInputValid){this.applyTooltipPosition()}else{this.destoryAutoUpdate()}}render(){var t,e;return i(o,null,i("slot",null),i("div",{role:"tooltip",style:{display:"none",position:"fixed",top:"0",left:"0",transform:`translate(${Math.round(((t=this.tooltipPosition)===null||t===void 0?void 0:t.x)||0)}px,${Math.round(((e=this.tooltipPosition)===null||e===void 0?void 0:e.y)||0)}px)`},class:"validation-tooltip text-default"},this.message,i("slot",{name:"tooltip-message"}),i("div",{id:"arrow"})))}get hostElement(){return e(this)}static get watchers(){return{isInputValid:["validationChanged"]}}};c.style=f;export{c as ix_validation_tooltip};
-//# sourceMappingURL=p-a73580a5.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["getAlignment","placement","includes","undefined","validationTooltipCss","ValidationTooltip","this","onSubmitBind","onSubmit","bind","onInputFocusBind","onInputFocus","arrow","hostElement","querySelector","inputElement","formElement","form","tooltipElement","destoryAutoUpdate","style","display","autoUpdateCleanup","applyTooltipPosition","positionConfig","strategy","middleware","inline","shift","offset","mainAxis","push","autoPlacement","alignment","autoUpdate","async","element","computeResponse","computePosition","middlewareData","x","y","arrowPosition","Object","assign","left","top","tooltipPosition","ancestorResize","ancestorScroll","elementResize","componentDidLoad","Error","addEventListener","observer","MutationObserver","classList","contains","isInputValid","validationChanged","observe","childList","subtree","attributes","attributeFilter","validity","valid","disconnectedCallback","_a","disconnect","removeEventListener","render","h","Host","role","position","transform","Math","round","_b","class","message","name","id"],"sources":["./src/components/dropdown/alignment.ts","./src/components/validation-tooltip/validation-tooltip.scss?tag=ix-validation-tooltip&encapsulation=scoped","./src/components/validation-tooltip/validation-tooltip.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 */\nimport { Placement } from './placement';\n\nexport function getAlignment(placement: Placement) {\n  if (placement.includes('-end')) {\n    return 'end';\n  } else if (placement.includes('-start')) {\n    return 'start';\n  }\n\n  return undefined;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'fonts';\n\n:host {\n  display: inline-block;\n  position: relative;\n  $padding: 5px;\n\n  .validation-tooltip {\n    background-color: var(--theme-tootlip--background);\n    color: var(--theme-tooltip--color);\n    padding: $padding 10px;\n    border-radius: 4px;\n    font-size: 13px;\n    border: 1px solid var(--theme-tooltip--border-color);\n    box-shadow: 0 0 2px 0 rgba(0, 0, 40, 0.1), 0 4px 8px 0 rgba(0, 0, 40, 0.1),\n      0 12px 18px 0 rgba(0, 0, 40, 0.1);\n\n    #arrow,\n    #arrow::before {\n      position: absolute;\n      width: 8px;\n      height: 8px;\n      background: inherit;\n    }\n\n    #arrow {\n      visibility: hidden;\n    }\n\n    #arrow::before {\n      visibility: visible;\n      content: '';\n      transform: rotate(45deg);\n      background-color: var(--theme-tootlip--background);\n    }\n  }\n\n  .validation-tooltip > #arrow {\n    bottom: -5px;\n\n    &::before {\n      border-right: 1px solid var(--theme-tooltip--border-color);\n      border-bottom: 1px solid var(--theme-tooltip--border-color);\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 */\nimport {\n  arrow,\n  autoPlacement,\n  autoUpdate,\n  computePosition,\n  ComputePositionConfig,\n  inline,\n  offset,\n  shift,\n} from '@floating-ui/dom';\nimport { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { getAlignment } from '../dropdown/alignment';\nimport {\n  BasePlacement,\n  Placement,\n  PlacementWithAlignment,\n} from '../dropdown/placement';\n\ntype Position = { x: number; y: number };\n\n/**\n * @slot tooltip-message - Custom tooltip message with html support\n */\n@Component({\n  tag: 'ix-validation-tooltip',\n  styleUrl: 'validation-tooltip.scss',\n  scoped: true,\n})\nexport class ValidationTooltip {\n  @Element() hostElement: HTMLIxValidationTooltipElement;\n\n  /**\n   * Message of the tooltip\n   */\n  @Prop() message: string;\n\n  /**\n   * Placement of the tooltip\n   */\n  @Prop() placement: Placement = 'top';\n\n  @State() isInputValid = true;\n  @State() tooltipPosition: Position;\n  @State() arrowPosition: Position;\n\n  private onSubmitBind = this.onSubmit.bind(this);\n  private onInputFocusBind = this.onInputFocus.bind(this);\n  private autoUpdateCleanup: () => void;\n  private observer: MutationObserver;\n\n  get arrow() {\n    return this.hostElement.querySelector('#arrow') as HTMLElement;\n  }\n\n  get inputElement() {\n    return this.hostElement.querySelector('input');\n  }\n\n  get formElement() {\n    return this.inputElement.form;\n  }\n\n  get tooltipElement(): HTMLElement {\n    return this.hostElement.querySelector('.validation-tooltip');\n  }\n\n  private destoryAutoUpdate() {\n    this.tooltipElement.style.display = 'none';\n\n    if (this.autoUpdateCleanup) {\n      this.autoUpdateCleanup();\n    }\n  }\n\n  private applyTooltipPosition() {\n    this.tooltipElement.style.display = 'block';\n\n    let positionConfig: Partial<ComputePositionConfig> = {\n      strategy: 'fixed',\n      middleware: [\n        inline(),\n        shift(),\n        offset({\n          mainAxis: 8,\n        }),\n      ],\n    };\n\n    if (this.placement.includes('auto')) {\n      positionConfig.middleware.push(\n        autoPlacement({\n          alignment: getAlignment(this.placement),\n        })\n      );\n    } else {\n      positionConfig.placement = this.placement as\n        | BasePlacement\n        | PlacementWithAlignment;\n    }\n\n    this.autoUpdateCleanup = autoUpdate(\n      this.inputElement,\n      this.tooltipElement,\n      async () => {\n        positionConfig.middleware = [\n          ...positionConfig.middleware,\n          arrow({\n            element: this.arrow,\n          }),\n        ];\n        const computeResponse = await computePosition(\n          this.inputElement,\n          this.tooltipElement,\n          positionConfig\n        );\n\n        if (computeResponse.middlewareData.arrow) {\n          const { x, y } = computeResponse.middlewareData.arrow;\n          this.arrowPosition = {\n            x,\n            y,\n          };\n          Object.assign(this.arrow.style, {\n            left: x != null ? `${x}px` : '',\n            top: y != null ? `${y}px` : '',\n          });\n        }\n\n        this.tooltipPosition = {\n          x: computeResponse.x,\n          y: computeResponse.y,\n        };\n      },\n      {\n        ancestorResize: true,\n        ancestorScroll: true,\n        elementResize: true,\n      }\n    );\n  }\n\n  componentDidLoad() {\n    if (!this.inputElement) {\n      throw Error(\n        'Validation tooltip is only working with an direct input child.'\n      );\n    }\n\n    if (!this.formElement) {\n      throw Error('Validation tooltip is only working with an form element.');\n    }\n\n    this.formElement.addEventListener('submit', this.onSubmitBind);\n    this.inputElement.addEventListener('focus', this.onInputFocusBind);\n\n    this.observer = new MutationObserver(() => {\n      if (this.inputElement.classList.contains('is-invalid')) {\n        this.isInputValid = false;\n        this.validationChanged();\n      }\n    });\n\n    this.observer.observe(this.inputElement, {\n      childList: false,\n      subtree: false,\n      attributes: true,\n      attributeFilter: ['class'],\n    });\n  }\n\n  private onInputFocus() {\n    this.isInputValid = true;\n  }\n\n  private onSubmit() {\n    if (this.formElement.classList.contains('needs-validation')) {\n      this.isInputValid = this.inputElement.validity.valid;\n    }\n  }\n\n  disconnectedCallback() {\n    this.observer?.disconnect();\n    this.destoryAutoUpdate();\n\n    this.formElement.removeEventListener('submit', this.onSubmitBind);\n    this.inputElement.removeEventListener('focus', this.onInputFocusBind);\n  }\n\n  @Watch('isInputValid')\n  validationChanged() {\n    if (!this.isInputValid) {\n      this.applyTooltipPosition();\n    } else {\n      this.destoryAutoUpdate();\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n        <div\n          role=\"tooltip\"\n          style={{\n            display: 'none',\n            position: 'fixed',\n            top: '0',\n            left: '0',\n            transform: `translate(${Math.round(\n              this.tooltipPosition?.x || 0\n            )}px,${Math.round(this.tooltipPosition?.y || 0)}px)`,\n          }}\n          class=\"validation-tooltip text-default\"\n        >\n          {this.message}\n          <slot name=\"tooltip-message\"></slot>\n          <div id=\"arrow\"></div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/p-b14308ed.js

@@ -1,2 +0,0 @@
-function n(){const n=Array.from(document.querySelectorAll("ix-modal-container"));const[t]=n;if(n.length>1){console.warn("Multiple modal containers were found. The one instatiated first will be used.");return t}if(!t){const n=document.createElement("ix-modal-container");document.body.appendChild(n);return n}return t}async function t(t){const o=n();const e=await o.showModal(t);return e}function o(n){return n.closest("ix-modal")}function e(n,t){o(n).close(t)}function c(n,t){o(n).dismiss(t)}export{e as c,c as d,t as m};
-//# sourceMappingURL=p-b14308ed.js.map

package/dist/siemens-ix/p-b14308ed.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["getModalContainer","containerList","Array","from","document","querySelectorAll","container","length","console","warn","modalContainer","createElement","body","appendChild","async","modal","config","modalInstance","showModal","getIxModal","element","closest","closeModal","closeResult","close","dismissModal","dismissResult","dismiss"],"sources":["./src/components/modal/modal-utils.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { NotificationColor } from '../utils/notification-color';\nimport { TypedEvent } from '../utils/typed-event';\n\nexport interface ModalConfig<TReason = any> {\n  animation?: boolean;\n  ariaDescribedBy?: string;\n  ariaLabelledBy?: string;\n  backdrop?: boolean | 'static';\n  backdropClass?: string;\n  beforeDismiss?: (reason?: TReason) => boolean | Promise<boolean>;\n  centered?: boolean;\n  container?: string | HTMLElement;\n  content: string | HTMLElement;\n  keyboard?: boolean;\n  modalDialogClass?: string;\n  scrollable?: boolean;\n  size?: 'sm' | 'lg' | 'xl';\n  title: string;\n  windowClass?: string;\n  icon?: string;\n  iconColor?: NotificationColor;\n}\n\nexport interface ModalInstance<TReason = any> {\n  htmlElement: HTMLIxModalElement;\n  onClose: TypedEvent<TReason>;\n  onDismiss: TypedEvent<TReason>;\n}\n\nfunction getModalContainer() {\n  const containerList = Array.from(\n    document.querySelectorAll('ix-modal-container')\n  );\n  const [container] = containerList;\n  if (containerList.length > 1) {\n    console.warn(\n      'Multiple modal containers were found. The one instatiated first will be used.'\n    );\n    return container;\n  }\n  if (!container) {\n    const modalContainer = document.createElement('ix-modal-container');\n    document.body.appendChild(modalContainer);\n\n    return modalContainer;\n  }\n  return container;\n}\n\nexport async function modal<T = any>(\n  config: ModalConfig<T>\n): Promise<ModalInstance<T>> {\n  const modalContainer = getModalContainer();\n  const modalInstance = await modalContainer.showModal<T>(config);\n\n  return modalInstance;\n}\n\nfunction getIxModal(element: Element) {\n  return element.closest('ix-modal');\n}\n\nexport function closeModal<TClose = any>(\n  element: Element,\n  closeResult: TClose\n) {\n  getIxModal(element).close(closeResult);\n}\n\nexport function dismissModal(element: Element, dismissResult?: any) {\n  getIxModal(element).dismiss(dismissResult);\n}\n"],"mappings":"AAsCA,SAASA,IACP,MAAMC,EAAgBC,MAAMC,KAC1BC,SAASC,iBAAiB,uBAE5B,MAAOC,GAAaL,EACpB,GAAIA,EAAcM,OAAS,EAAG,CAC5BC,QAAQC,KACN,iFAEF,OAAOH,C,CAET,IAAKA,EAAW,CACd,MAAMI,EAAiBN,SAASO,cAAc,sBAC9CP,SAASQ,KAAKC,YAAYH,GAE1B,OAAOA,C,CAET,OAAOJ,CACT,CAEOQ,eAAeC,EACpBC,GAEA,MAAMN,EAAiBV,IACvB,MAAMiB,QAAsBP,EAAeQ,UAAaF,GAExD,OAAOC,CACT,CAEA,SAASE,EAAWC,GAClB,OAAOA,EAAQC,QAAQ,WACzB,C,SAEgBC,EACdF,EACAG,GAEAJ,EAAWC,GAASI,MAAMD,EAC5B,C,SAEgBE,EAAaL,EAAkBM,GAC7CP,EAAWC,GAASO,QAAQD,EAC9B,Q"}

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

@@ -1,2 +0,0 @@
-import{r as e,c as o,h as t,H as r,g as i}from"./p-1c64b073.js";const c='.sc-ix-toggle-h{display:flex;align-items:center;outline:none}.sc-ix-toggle-h .switch.sc-ix-toggle{position:relative;display:inline-flex;align-items:center;min-width:3rem;height:2rem}.sc-ix-toggle-h .switch.sc-ix-toggle:not(.disabled):not(:disabled):focus-visible{outline-color:var(--focus--border-color);outline-style:solid;outline-width:1px}.sc-ix-toggle-h .switch.sc-ix-toggle input.sc-ix-toggle{opacity:0;width:0;height:0}.sc-ix-toggle-h .slider.sc-ix-toggle{display:flex;align-items:center;justify-content:center;position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0}.sc-ix-toggle-h .slider.sc-ix-toggle .slider-track.sc-ix-toggle{background-color:var(--theme-switch-off--background);border-radius:2.125rem;border:1px solid var(--theme-switch-off--border-color);width:2.5rem;height:1rem}.sc-ix-toggle-h .slider.sc-ix-toggle:before{position:absolute;content:"";height:1.5rem;width:1.5rem;left:0.125rem;background-color:var(--theme-switch-thumb-off--background);transition:transform 150ms;border-radius:50%;border:1px solid var(--theme-switch-thumb-off--border-color);box-shadow:var(--theme-switch-thumb--box-shadow)}.sc-ix-toggle-h input.sc-ix-toggle:checked+.slider.sc-ix-toggle:before{transform:translateX(1.125rem);left:0.25rem}.sc-ix-toggle-h .text.sc-ix-toggle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-switch--color);padding:0 0.5rem;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.sc-ix-toggle-h:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-off--background--hover);border-color:var(--theme-switch-thumb-off--border-color--hover)}.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .slider-track.sc-ix-toggle{background-color:var(--theme-switch-off--background--hover);border-color:var(--theme-switch-off--border-color--hover)}.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .text.sc-ix-toggle{color:var(--theme-switch--color--hover)}.sc-ix-toggle-h:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-toggle-h:not(.disabled):not(:disabled):active .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-off--background--active);border-color:var(--theme-switch-thumb-off--border-color--active)}.sc-ix-toggle-h:not(.disabled):not(:disabled):active .slider-track.sc-ix-toggle{background-color:var(--theme-switch-off--background--active);border-color:var(--theme-switch-off--border-color--active)}.sc-ix-toggle-h:not(.disabled):not(:disabled):active .text.sc-ix-toggle{color:var(--theme-switch--color--active)}.checked.sc-ix-toggle-h .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-on--background);border-color:var(--theme-switch-thumb-on--border-color)}.checked.sc-ix-toggle-h .slider.sc-ix-toggle .slider-track.sc-ix-toggle{background-color:var(--theme-switch-on--background);border-color:var(--theme-switch-on--border-color)}.checked.sc-ix-toggle-h .text.sc-ix-toggle{color:var(--theme-switch--color)}.checked.sc-ix-toggle-h:not(.disabled):not(:disabled){cursor:pointer}.checked.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-on--background--hover);border-color:var(--theme-switch-thumb-on--border-color--hover)}.checked.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .slider.sc-ix-toggle .slider-track.sc-ix-toggle{background-color:var(--theme-switch-on--background--hover);border-color:var(--theme-switch-on--border-color--hover)}.checked.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .text.sc-ix-toggle{color:var(--theme-switch--color--hover)}.checked.sc-ix-toggle-h:not(.disabled):not(:disabled){cursor:pointer}.checked.sc-ix-toggle-h:not(.disabled):not(:disabled):active .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-on--background--active);border-color:var(--theme-switch-thumb-on--border-color--active)}.checked.sc-ix-toggle-h:not(.disabled):not(:disabled):active .slider-track.sc-ix-toggle{background-color:var(--theme-switch-on--background--active);border-color:var(--theme-switch-on--border-color--active)}.checked.sc-ix-toggle-h:not(.disabled):not(:disabled):active .text.sc-ix-toggle{color:var(--theme-switch--color--active)}.indeterminate.sc-ix-toggle-h .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-mixed--background);border-color:var(--theme-switch-thumb-mixed--border-color)}.indeterminate.sc-ix-toggle-h .slider.sc-ix-toggle .slider-track.sc-ix-toggle{background-color:var(--theme-switch-mixed--background);border-color:var(--theme-switch-mixed--border-color)}.indeterminate.sc-ix-toggle-h .text.sc-ix-toggle{color:var(--theme-switch--color)}.indeterminate.sc-ix-toggle-h:not(.disabled):not(:disabled){cursor:pointer}.indeterminate.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-mixed--background--hover);border-color:var(--theme-switch-thumb-mixed--border-color--hover)}.indeterminate.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .slider.sc-ix-toggle .slider-track.sc-ix-toggle{background-color:var(--theme-switch-mixed--background--hover);border-color:var(--theme-switch-mixed--border-color--hover)}.indeterminate.sc-ix-toggle-h:not(.disabled):not(:disabled):hover .text.sc-ix-toggle{color:var(--theme-switch--color--hover)}.indeterminate.sc-ix-toggle-h:not(.disabled):not(:disabled){cursor:pointer}.indeterminate.sc-ix-toggle-h:not(.disabled):not(:disabled):active .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-mixed--background--active);border-color:var(--theme-switch-thumb-mixed--border-color--active)}.indeterminate.sc-ix-toggle-h:not(.disabled):not(:disabled):active .slider-track.sc-ix-toggle{background-color:var(--theme-switch-mixed--background--active);border-color:var(--theme-switch-mixed--border-color--active)}.indeterminate.sc-ix-toggle-h:not(.disabled):not(:disabled):active .text.sc-ix-toggle{color:var(--theme-switch--color--active)}.indeterminate.sc-ix-toggle-h .slider.sc-ix-toggle:before{transform:translateX(0.625rem)}.disabled.sc-ix-toggle-h{pointer-events:none}.disabled.sc-ix-toggle-h .slider.sc-ix-toggle{cursor:initial;opacity:0.5}.disabled.sc-ix-toggle-h .slider.sc-ix-toggle:before{background-color:var(--theme-switch-thumb-off--background--disabled);border-color:var(--theme-switch-thumb-off--border-color--disabled)}.disabled.sc-ix-toggle-h .slider.sc-ix-toggle .slider-track.sc-ix-toggle{background-color:var(--theme-switch-off--background--disabled);border-color:var(--theme-switch-off--border-color--disabled)}.disabled.sc-ix-toggle-h .text.sc-ix-toggle{color:var(--theme-switch--color--disabled)}';const s=class{constructor(t){e(this,t);this.checkedChange=o(this,"checkedChange",7);this.checked=false;this.disabled=false;this.indeterminate=false;this.color="accent";this.textOn="On";this.textOff="Off";this.textIndeterminate="Mixed";this.hideText=false}async onKeyDown(e){const o=e.target;if(!this.hostElement.contains(o)){return}if(e.code==="Enter"||e.code==="NumpadEnter"){this.emitChange(e)}}emitChange(e){if(this.disabled||this.indeterminate){return}e.stopPropagation();e.preventDefault();this.checked=!this.checked;this.checkedChange.emit(this.checked)}getText(){if(this.indeterminate||this.checked===undefined){return this.textIndeterminate}return this.checked?this.textOn:this.textOff}render(){return t(r,{class:{disabled:this.disabled,checked:this.checked,indeterminate:this.indeterminate||this.checked===undefined}},t("label",{class:"switch",tabindex:this.disabled?-1:0},t("input",{tabindex:"-1",type:"checkbox",checked:this.checked,disabled:this.disabled,indeterminate:this.indeterminate||this.checked===undefined,id:this.hostElement.id,onChange:e=>this.emitChange(e)}),t("span",{class:"slider"},t("span",{class:"slider-track"}))),!this.hideText?t("span",{title:this.getText(),class:"text",onClick:e=>this.emitChange(e)},this.getText()):null)}get hostElement(){return i(this)}};s.style=c;export{s as ix_toggle};
-//# sourceMappingURL=p-b5c40bb3.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["toggleCss","CuiToggle","async","event","targetElement","target","this","hostElement","contains","code","emitChange","disabled","indeterminate","stopPropagation","preventDefault","checked","checkedChange","emit","getText","undefined","textIndeterminate","textOn","textOff","render","h","Host","class","tabindex","type","id","onChange","e","hideText","title","onClick"],"sources":["./src/components/toggle/toggle.scss?tag=ix-toggle&encapsulation=scoped","./src/components/toggle/toggle.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n@mixin toggle($state, $suffix: '') {\n  .slider {\n    &:before {\n      background-color: var(\n        --theme-switch-thumb-#{$state}--background#{$suffix}\n      );\n      border-color: var(--theme-switch-thumb-#{$state}--border-color#{$suffix});\n    }\n\n    .slider-track {\n      background-color: var(--theme-switch-#{$state}--background#{$suffix});\n      border-color: var(--theme-switch-#{$state}--border-color#{$suffix});\n    }\n  }\n\n  .text {\n    color: var(--theme-switch--color);\n  }\n\n  @include hover {\n    .slider {\n      &:before {\n        background-color: var(\n          --theme-switch-thumb-#{$state}--background--hover#{$suffix}\n        );\n        border-color: var(\n          --theme-switch-thumb-#{$state}--border-color--hover#{$suffix}\n        );\n      }\n\n      .slider-track {\n        background-color: var(\n          --theme-switch-#{$state}--background--hover#{$suffix}\n        );\n        border-color: var(\n          --theme-switch-#{$state}--border-color--hover#{$suffix}\n        );\n      }\n    }\n\n    .text {\n      color: var(--theme-switch--color--hover);\n    }\n  }\n\n  @include active {\n    .slider:before {\n      background-color: var(\n        --theme-switch-thumb-#{$state}--background--active#{$suffix}\n      );\n      border-color: var(\n        --theme-switch-thumb-#{$state}--border-color--active#{$suffix}\n      );\n    }\n\n    .slider-track {\n      background-color: var(\n        --theme-switch-#{$state}--background--active#{$suffix}\n      );\n      border-color: var(\n        --theme-switch-#{$state}--border-color--active#{$suffix}\n      );\n    }\n\n    .text {\n      color: var(--theme-switch--color--active);\n    }\n  }\n}\n\n:host {\n  $slide-toggle-width: 3rem;\n  display: flex;\n  align-items: center;\n  outline: none;\n\n  .switch {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    min-width: $slide-toggle-width;\n    height: $default-control-height;\n\n    @include focus-visible {\n      outline-color: var(--focus--border-color);\n      outline-style: solid;\n      outline-width: 1px;\n    }\n  }\n\n  .switch input {\n    opacity: 0;\n    width: 0;\n    height: 0;\n  }\n\n  .slider {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: absolute;\n    cursor: pointer;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n\n    .slider-track {\n      background-color: var(--theme-switch-off--background);\n      border-radius: 2.125rem;\n      border: 1px solid var(--theme-switch-off--border-color);\n      width: 2.5rem;\n      height: $default-space;\n    }\n  }\n\n  .slider:before {\n    position: absolute;\n    content: '';\n    height: 1.5rem;\n    width: 1.5rem;\n    left: 0.125rem;\n    background-color: var(--theme-switch-thumb-off--background);\n    -webkit-transition: transform $default-time;\n    transition: transform $default-time;\n    border-radius: 50%;\n    border: 1px solid var(--theme-switch-thumb-off--border-color);\n    box-shadow: var(--theme-switch-thumb--box-shadow);\n  }\n\n  input:checked + .slider:before {\n    -webkit-transform: translateX(1.125rem);\n    -ms-transform: translateX(1.125rem);\n    transform: translateX(1.125rem);\n    left: $tiny-space;\n  }\n\n  .text {\n    @include ellipsis;\n\n    color: var(--theme-switch--color);\n    padding: 0 $small-space;\n    position: relative;\n    user-select: none;\n  }\n\n  @include hover {\n    .slider:before {\n      background-color: var(--theme-switch-thumb-off--background--hover);\n      border-color: var(--theme-switch-thumb-off--border-color--hover);\n    }\n\n    .slider-track {\n      background-color: var(--theme-switch-off--background--hover);\n      border-color: var(--theme-switch-off--border-color--hover);\n    }\n\n    .text {\n      color: var(--theme-switch--color--hover);\n    }\n  }\n\n  @include active {\n    .slider:before {\n      background-color: var(--theme-switch-thumb-off--background--active);\n      border-color: var(--theme-switch-thumb-off--border-color--active);\n    }\n\n    .slider-track {\n      background-color: var(--theme-switch-off--background--active);\n      border-color: var(--theme-switch-off--border-color--active);\n    }\n\n    .text {\n      color: var(--theme-switch--color--active);\n    }\n  }\n\n  &.checked {\n    @include toggle('on');\n  }\n\n  &.indeterminate {\n    @include toggle('mixed');\n\n    .slider:before {\n      transform: translateX(0.625rem);\n    }\n  }\n\n  &.disabled {\n    pointer-events: none;\n    .slider {\n      cursor: initial;\n      opacity: 0.5;\n\n      &:before {\n        background-color: var(--theme-switch-thumb-off--background--disabled);\n        border-color: var(--theme-switch-thumb-off--border-color--disabled);\n      }\n\n      .slider-track {\n        background-color: var(--theme-switch-off--background--disabled);\n        border-color: var(--theme-switch-off--border-color--disabled);\n      }\n    }\n\n    .text {\n      color: var(--theme-switch--color--disabled);\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 {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-toggle',\n  styleUrl: 'toggle.scss',\n  scoped: true,\n})\nexport class CuiToggle {\n  /**\n   * Whether the slide-toggle element is checked or not.\n   */\n  @Prop({ mutable: true, reflect: true }) checked = false;\n\n  /**\n   * Whether the slide-toggle element is disabled or not.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * If true the control is in indeterminate state\n   */\n  @Prop() indeterminate = false;\n\n  /**\n   * Basic and status colors from color palette\n   * @deprecated Will be removed in 2.0.0\n   */\n  @Prop() color = 'accent';\n\n  /**\n   * Text for on state\n   */\n  @Prop() textOn = 'On';\n\n  /**\n   * Text for off state\n   */\n  @Prop() textOff = 'Off';\n\n  /**\n   * Text for indeterminate state\n   */\n  @Prop() textIndeterminate = 'Mixed';\n\n  /**\n   * Hide `on` and `off` text\n   */\n  @Prop() hideText = false;\n\n  /**\n   * An event will be dispatched each time the slide-toggle changes its value.\n   */\n  @Event() checkedChange: EventEmitter<boolean>;\n\n  @Element() hostElement!: HTMLIxToggleElement;\n\n  @Listen('keydown', { target: 'window' })\n  async onKeyDown(event: KeyboardEvent) {\n    const targetElement = event.target as HTMLElement;\n\n    if (!this.hostElement.contains(targetElement)) {\n      return;\n    }\n\n    if (event.code === 'Enter' || event.code === 'NumpadEnter') {\n      this.emitChange(event);\n    }\n  }\n\n  private emitChange(event: Event) {\n    if (this.disabled || this.indeterminate) {\n      return;\n    }\n\n    event.stopPropagation();\n    event.preventDefault();\n\n    this.checked = !this.checked;\n    this.checkedChange.emit(this.checked);\n  }\n\n  private getText() {\n    if (this.indeterminate || this.checked === undefined) {\n      return this.textIndeterminate;\n    }\n\n    return this.checked ? this.textOn : this.textOff;\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          checked: this.checked,\n          indeterminate: this.indeterminate || this.checked === undefined,\n        }}\n      >\n        <label class=\"switch\" tabindex={this.disabled ? -1 : 0}>\n          <input\n            tabindex=\"-1\"\n            type=\"checkbox\"\n            checked={this.checked}\n            disabled={this.disabled}\n            indeterminate={this.indeterminate || this.checked === undefined}\n            id={this.hostElement.id}\n            onChange={(e) => this.emitChange(e)}\n          />\n          <span class=\"slider\">\n            <span class=\"slider-track\"></span>\n          </span>\n        </label>\n        {!this.hideText ? (\n          <span\n            title={this.getText()}\n            class=\"text\"\n            onClick={(e) => this.emitChange(e)}\n          >\n            {this.getText()}\n          </span>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAY,ilN,MCyBLC,EAAS,M,mFAI8B,M,cAK/B,M,mBAKK,M,WAMR,S,YAKC,K,aAKC,M,uBAKU,Q,cAKT,K,CAUnBC,gBAAgBC,GACd,MAAMC,EAAgBD,EAAME,OAE5B,IAAKC,KAAKC,YAAYC,SAASJ,GAAgB,CAC7C,M,CAGF,GAAID,EAAMM,OAAS,SAAWN,EAAMM,OAAS,cAAe,CAC1DH,KAAKI,WAAWP,E,EAIZO,WAAWP,GACjB,GAAIG,KAAKK,UAAYL,KAAKM,cAAe,CACvC,M,CAGFT,EAAMU,kBACNV,EAAMW,iBAENR,KAAKS,SAAWT,KAAKS,QACrBT,KAAKU,cAAcC,KAAKX,KAAKS,Q,CAGvBG,UACN,GAAIZ,KAAKM,eAAiBN,KAAKS,UAAYI,UAAW,CACpD,OAAOb,KAAKc,iB,CAGd,OAAOd,KAAKS,QAAUT,KAAKe,OAASf,KAAKgB,O,CAG3CC,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACLf,SAAUL,KAAKK,SACfI,QAAST,KAAKS,QACdH,cAAeN,KAAKM,eAAiBN,KAAKS,UAAYI,YAGxDK,EAAA,SAAOE,MAAM,SAASC,SAAUrB,KAAKK,UAAY,EAAI,GACnDa,EAAA,SACEG,SAAS,KACTC,KAAK,WACLb,QAAST,KAAKS,QACdJ,SAAUL,KAAKK,SACfC,cAAeN,KAAKM,eAAiBN,KAAKS,UAAYI,UACtDU,GAAIvB,KAAKC,YAAYsB,GACrBC,SAAWC,GAAMzB,KAAKI,WAAWqB,KAEnCP,EAAA,QAAME,MAAM,UACVF,EAAA,QAAME,MAAM,oBAGdpB,KAAK0B,SACLR,EAAA,QACES,MAAO3B,KAAKY,UACZQ,MAAM,OACNQ,QAAUH,GAAMzB,KAAKI,WAAWqB,IAE/BzB,KAAKY,WAEN,K"}

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

@@ -1,2 +0,0 @@
-import{r as e,h as r,H as o}from"./p-1c64b073.js";import{g as t}from"./p-5b39e04e.js";const n=".btn{display:inline-flex;align-items:center;justify-content:center;height:2rem;font-size:0.875rem;font-weight:700;transition:150ms;padding:0 0.5rem;min-width:5rem;gap:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn .glyph{margin-right:0.25rem;font-weight:400}.btn:focus-visible,.btn.focus{box-shadow:none}.btn-primary{border-radius:var(--theme-btn--border-radius)}.btn-primary,.btn-primary.focus,.btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}.btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-primary.selected{background-color:var(--theme-btn-primary--background--selected)}.btn-primary.hover,.btn-primary:hover{border-color:var(--theme-btn-primary--border-color--hover) !important;background-color:var(--theme-btn-primary--background--hover) !important;color:var(--theme-btn-primary--color--hover) !important}.btn-primary.selected.hover,.btn-primary.selected:hover{background-color:var(--theme-btn-primary--background--selected-hover);color:var(--theme-btn-primary--color--selected-hover)}.btn-primary:not(:disabled):not(.disabled):active,.btn-primary:not(:disabled):not(.disabled).active,.show>.btn-primary.dropdown-toggle{border-color:var(--theme-btn-primary--border-color--active) !important;background-color:var(--theme-btn-primary--background--active) !important;color:var(--theme-btn-primary--color--active) !important}.btn-primary.selected:not(:disabled):not(.disabled):active,.btn-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-primary.selected.dropdown-toggle{background-color:var(--theme-btn-primary--background--selected-active);color:var(--theme-btn-primary--color--selected-active)}.btn-primary.disabled,.btn-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1}.btn-outline-primary{border-radius:var(--theme-btn--border-radius)}.btn-outline-primary,.btn-outline-primary.focus,.btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}.btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-primary.selected{background-color:var(--theme-btn-outline-primary--background--selected)}.btn-outline-primary.hover,.btn-outline-primary:hover{border-color:var(--theme-btn-outline-primary--border-color--hover) !important;background-color:var(--theme-btn-outline-primary--background--hover) !important;color:var(--theme-btn-outline-primary--color--hover) !important}.btn-outline-primary.selected.hover,.btn-outline-primary.selected:hover{background-color:var(--theme-btn-outline-primary--background--selected-hover);color:var(--theme-btn-outline-primary--color--selected-hover)}.btn-outline-primary:not(:disabled):not(.disabled):active,.btn-outline-primary:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.dropdown-toggle{border-color:var(--theme-btn-outline-primary--border-color--active) !important;background-color:var(--theme-btn-outline-primary--background--active) !important;color:var(--theme-btn-outline-primary--color--active) !important}.btn-outline-primary.selected:not(:disabled):not(.disabled):active,.btn-outline-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.selected.dropdown-toggle{background-color:var(--theme-btn-outline-primary--background--selected-active);color:var(--theme-btn-outline-primary--color--selected-active)}.btn-outline-primary.disabled,.btn-outline-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1}.btn-invisible-primary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-primary,.btn-invisible-primary.focus,.btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);border-color:transparent}.btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-primary.selected{background-color:var(--theme-btn-invisible-primary--background--selected)}.btn-invisible-primary.hover,.btn-invisible-primary:hover{background-color:var(--theme-btn-invisible-primary--background--hover) !important;color:var(--theme-btn-invisible-primary--color--hover) !important}.btn-invisible-primary.selected.hover,.btn-invisible-primary.selected:hover{background-color:var(--theme-btn-invisible-primary--background--selected-hover);color:var(--theme-btn-invisible-primary--color--selected-hover)}.btn-invisible-primary:not(:disabled):not(.disabled):active,.btn-invisible-primary:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.dropdown-toggle{background-color:var(--theme-btn-invisible-primary--background--active) !important;color:var(--theme-btn-invisible-primary--color--active) !important}.btn-invisible-primary.selected:not(:disabled):not(.disabled):active,.btn-invisible-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.selected.dropdown-toggle{background-color:var(--theme-btn-invisible-primary--background--selected-active);color:var(--theme-btn-invisible-primary--color--selected-active)}.btn-invisible-primary.disabled,.btn-invisible-primary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1}.btn-secondary{border-radius:var(--theme-btn--border-radius)}.btn-secondary,.btn-secondary.focus,.btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}.btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-secondary.selected{background-color:var(--theme-btn-secondary--background--selected)}.btn-secondary.hover,.btn-secondary:hover{border-color:var(--theme-btn-secondary--border-color--hover) !important;background-color:var(--theme-btn-secondary--background--hover) !important;color:var(--theme-btn-secondary--color--hover) !important}.btn-secondary.selected.hover,.btn-secondary.selected:hover{background-color:var(--theme-btn-secondary--background--selected-hover);color:var(--theme-btn-secondary--color--selected-hover)}.btn-secondary:not(:disabled):not(.disabled):active,.btn-secondary:not(:disabled):not(.disabled).active,.show>.btn-secondary.dropdown-toggle{border-color:var(--theme-btn-secondary--border-color--active) !important;background-color:var(--theme-btn-secondary--background--active) !important;color:var(--theme-btn-secondary--color--active) !important}.btn-secondary.selected:not(:disabled):not(.disabled):active,.btn-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-secondary.selected.dropdown-toggle{background-color:var(--theme-btn-secondary--background--selected-active);color:var(--theme-btn-secondary--color--selected-active)}.btn-secondary.disabled,.btn-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1}.btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}.btn-outline-secondary,.btn-outline-secondary.focus,.btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}.btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-secondary.selected{background-color:var(--theme-btn-outline-secondary--background--selected)}.btn-outline-secondary.hover,.btn-outline-secondary:hover{border-color:var(--theme-btn-outline-secondary--border-color--hover) !important;background-color:var(--theme-btn-outline-secondary--background--hover) !important;color:var(--theme-btn-outline-secondary--color--hover) !important}.btn-outline-secondary.selected.hover,.btn-outline-secondary.selected:hover{background-color:var(--theme-btn-outline-secondary--background--selected-hover);color:var(--theme-btn-outline-secondary--color--selected-hover)}.btn-outline-secondary:not(:disabled):not(.disabled):active,.btn-outline-secondary:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.dropdown-toggle{border-color:var(--theme-btn-outline-secondary--border-color--active) !important;background-color:var(--theme-btn-outline-secondary--background--active) !important;color:var(--theme-btn-outline-secondary--color--active) !important}.btn-outline-secondary.selected:not(:disabled):not(.disabled):active,.btn-outline-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.selected.dropdown-toggle{background-color:var(--theme-btn-outline-secondary--background--selected-active);color:var(--theme-btn-outline-secondary--color--selected-active)}.btn-outline-secondary.disabled,.btn-outline-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1}.btn-invisible-secondary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-secondary,.btn-invisible-secondary.focus,.btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);border-color:transparent}.btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-secondary.selected{background-color:var(--theme-btn-invisible-secondary--background--selected)}.btn-invisible-secondary.hover,.btn-invisible-secondary:hover{background-color:var(--theme-btn-invisible-secondary--background--hover) !important;color:var(--theme-btn-invisible-secondary--color--hover) !important}.btn-invisible-secondary.selected.hover,.btn-invisible-secondary.selected:hover{background-color:var(--theme-btn-invisible-secondary--background--selected-hover);color:var(--theme-btn-invisible-secondary--color--selected-hover)}.btn-invisible-secondary:not(:disabled):not(.disabled):active,.btn-invisible-secondary:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.dropdown-toggle{background-color:var(--theme-btn-invisible-secondary--background--active) !important;color:var(--theme-btn-invisible-secondary--color--active) !important}.btn-invisible-secondary.selected:not(:disabled):not(.disabled):active,.btn-invisible-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.selected.dropdown-toggle{background-color:var(--theme-btn-invisible-secondary--background--selected-active);color:var(--theme-btn-invisible-secondary--color--selected-active)}.btn-invisible-secondary.disabled,.btn-invisible-secondary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1}.btn-oval,.btn-icon{min-width:2rem;width:2rem}.btn-oval .glyph,.btn-icon .glyph{margin-right:0}.btn-oval{border-radius:6.25rem;width:2rem}.btn-icon-xs,.btn-icon-12{height:1rem;width:1rem;min-width:1rem;min-height:1rem}.btn-icon-s,.btn-icon-16{height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}.btn-icon-32{height:2rem;width:2rem;min-width:2rem;min-height:2rem}:host{display:inline-block;width:auto;height:2rem;vertical-align:middle}:host.disabled{pointer-events:none}:host .btn{width:100%;height:100%}:host button:not(:disabled){cursor:pointer}";const i=class{constructor(r){e(this,r);this.variant="Primary";this.outline=false;this.invisible=false;this.ghost=false;this.selected=false;this.disabled=false;this.type="button"}render(){return r(o,{class:{disabled:this.disabled}},r("button",{type:this.type,class:t(this.variant,this.outline,this.ghost||this.invisible,false,false,this.selected,this.disabled)},r("slot",null)))}};i.style=n;export{i as ix_button};
-//# sourceMappingURL=p-c5124f7b.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["buttonCss","Button","render","h","Host","class","disabled","this","type","getButtonClasses","variant","outline","ghost","invisible","selected"],"sources":["./src/components/button/button.scss?tag=ix-button&encapsulation=shadow","./src/components/button/button.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 './components/buttons';\n\n:host {\n  display: inline-block;\n  width: auto;\n  height: 2rem;\n  vertical-align: middle;\n\n  &.disabled {\n    pointer-events: none;\n  }\n\n  .btn {\n    width: 100%;\n    height: 100%;\n  }\n\n  button:not(:disabled) {\n    cursor: pointer;\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';\nimport { getButtonClasses } from './base-button';\n\nexport type ButtonVariant = 'Primary' | 'Secondary';\n\n@Component({\n  tag: 'ix-button',\n  shadow: true,\n  styleUrl: './button.scss',\n})\nexport class Button {\n  /**\n   * Button variant\n   */\n  @Prop() variant: ButtonVariant = 'Primary';\n\n  /**\n   * Outline button\n   */\n  @Prop() outline = false;\n\n  /**\n   * Invisible button\n   *\n   * @deprecated use ghost property\n   */\n  @Prop() invisible = false;\n\n  /**\n   * Button with no background or outline\n   */\n  @Prop() ghost = false;\n\n  /**\n   * Show button as selected. Should be used with outline or ghost\n   */\n  @Prop() selected = false;\n\n  /**\n   * Disable the button\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Type of the button\n   */\n  @Prop() type: 'button' | 'submit' = 'button';\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n        }}\n      >\n        <button\n          type={this.type}\n          class={getButtonClasses(\n            this.variant,\n            this.outline,\n            this.ghost || this.invisible,\n            false,\n            false,\n            this.selected,\n            this.disabled\n          )}\n        >\n          <slot></slot>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAY,iwZ,MCmBLC,EAAM,M,sCAIgB,U,aAKf,M,eAOE,M,WAKJ,M,cAKG,M,cAKiB,M,UAKA,Q,CAEpCC,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACLC,SAAUC,KAAKD,WAGjBH,EAAA,UACEK,KAAMD,KAAKC,KACXH,MAAOI,EACLF,KAAKG,QACLH,KAAKI,QACLJ,KAAKK,OAASL,KAAKM,UACnB,MACA,MACAN,KAAKO,SACLP,KAAKD,WAGPH,EAAA,c"}

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

@@ -1,2 +0,0 @@
-import{r as i,h as r,H as t,g as o}from"./p-1c64b073.js";const e='.sc-ix-counter-pill-h{display:inline-flex;width:-moz-fit-content;width:fit-content;position:relative;align-items:center;justify-content:center;border-radius:100px;padding:0px 6px;margin-left:0.25rem;min-width:1.5rem;height:1.25rem;min-height:1.25rem;max-height:1.25rem;cursor:auto}.sc-ix-counter-pill-h .with-icon.sc-ix-counter-pill{margin-right:0.25rem}.align-left.sc-ix-counter-pill-h{justify-content:flex-start}[variant=primary].sc-ix-counter-pill-h{background-color:var(--theme-color-primary);color:var(--theme-chip-primary--color)}[variant=primary].sc-ix-counter-pill-h .close-button.sc-ix-counter-pill{color:var(--theme-chip-primary--color);pointer-events:auto}[variant=primary].outline.sc-ix-counter-pill-h{color:var(--theme-chip-primary-outline--color);background-color:transparent;border:solid 1px var(--theme-chip-primary-outline--border-color)}[variant=primary].outline.sc-ix-counter-pill-h .close-button.sc-ix-counter-pill{color:var(--theme-chip-primary-outline--color)}[variant=alarm].sc-ix-counter-pill-h{color:var(--theme-color-alarm--contrast)}[variant=alarm].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-alarm)}[variant=alarm].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-alarm--contrast)}[variant=alarm].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=alarm].sc-ix-counter-pill-h:not(.outline).active::after,[variant=alarm].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=alarm].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-alarm)}[variant=alarm].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=alarm].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=alarm].outline.active.sc-ix-counter-pill-h::after,[variant=alarm].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=alarm].outline.active.sc-ix-counter-pill-h,[variant=alarm].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=critical].sc-ix-counter-pill-h{color:var(--theme-color-critical--contrast)}[variant=critical].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-critical)}[variant=critical].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-critical--contrast)}[variant=critical].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=critical].sc-ix-counter-pill-h:not(.outline).active::after,[variant=critical].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=critical].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-critical)}[variant=critical].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=critical].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=critical].outline.active.sc-ix-counter-pill-h::after,[variant=critical].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=critical].outline.active.sc-ix-counter-pill-h,[variant=critical].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=warning].sc-ix-counter-pill-h{color:var(--theme-color-warning--contrast)}[variant=warning].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-warning)}[variant=warning].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-warning--contrast)}[variant=warning].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=warning].sc-ix-counter-pill-h:not(.outline).active::after,[variant=warning].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=warning].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-warning)}[variant=warning].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=warning].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=warning].outline.active.sc-ix-counter-pill-h::after,[variant=warning].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=warning].outline.active.sc-ix-counter-pill-h,[variant=warning].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=info].sc-ix-counter-pill-h{color:var(--theme-color-info--contrast)}[variant=info].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-info)}[variant=info].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-info--contrast)}[variant=info].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=info].sc-ix-counter-pill-h:not(.outline).active::after,[variant=info].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=info].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-info)}[variant=info].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=info].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=info].outline.active.sc-ix-counter-pill-h::after,[variant=info].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=info].outline.active.sc-ix-counter-pill-h,[variant=info].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=neutral].sc-ix-counter-pill-h{color:var(--theme-color-neutral--contrast)}[variant=neutral].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-neutral)}[variant=neutral].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-neutral--contrast)}[variant=neutral].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=neutral].sc-ix-counter-pill-h:not(.outline).active::after,[variant=neutral].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=neutral].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-neutral)}[variant=neutral].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=neutral].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=neutral].outline.active.sc-ix-counter-pill-h::after,[variant=neutral].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=neutral].outline.active.sc-ix-counter-pill-h,[variant=neutral].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=success].sc-ix-counter-pill-h{color:var(--theme-color-success--contrast)}[variant=success].sc-ix-counter-pill-h:not(.outline){background-color:var(--theme-color-success)}[variant=success].sc-ix-counter-pill-h:not(.outline) .close-button.sc-ix-counter-pill{color:var(--theme-color-success--contrast)}[variant=success].sc-ix-counter-pill-h:not(.outline):hover::after{content:"";background-color:rgba(0, 0, 0, 0.05)}[variant=success].sc-ix-counter-pill-h:not(.outline).active::after,[variant=success].sc-ix-counter-pill-h:not(.outline):active::after{background-color:rgba(0, 0, 0, 0.1)}[variant=success].outline.sc-ix-counter-pill-h{color:var(--theme-chip-outline--color);border:solid 1px var(--theme-color-success)}[variant=success].outline.sc-ix-counter-pill-h:hover::after{display:none}[variant=success].outline.sc-ix-counter-pill-h:hover{background-color:var(--theme-chip-outline--background--hover)}[variant=success].outline.active.sc-ix-counter-pill-h::after,[variant=success].outline.sc-ix-counter-pill-h:active::after{display:none}[variant=success].outline.active.sc-ix-counter-pill-h,[variant=success].outline.sc-ix-counter-pill-h:active{background-color:var(--theme-chip-outline--background--active)}[variant=custom].outline.sc-ix-counter-pill-h{border:solid 1px transparent;background-color:transparent}.sc-ix-counter-pill-h .slot.sc-ix-counter-pill{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-counter-pill-h .hidden.sc-ix-counter-pill{width:0px;margin-right:0px}.sc-ix-counter-pill-h{min-height:1rem;max-height:1rem;height:1rem;font-size:0.75rem;padding:0 0.25rem;min-width:1rem;width:auto;padding:0 4px}.sc-ix-counter-pill-h .slot-container.sc-ix-counter-pill{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}';const n=class{constructor(r){i(this,r);this.variant="primary";this.outline=false;this.background=undefined;this.color=undefined;this.alignLeft=false}render(){return r(t,{class:{outline:this.outline,"align-left":this.alignLeft},style:this.variant==="custom"?{color:this.color,backgroundColor:this.background}:{},title:this.el.textContent},r("span",{class:"slot-container"},r("slot",null)))}get el(){return o(this)}};n.style=e;export{n as ix_counter_pill};
-//# sourceMappingURL=p-c7109071.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["counterPillCss","CounterPill","render","h","Host","class","outline","this","alignLeft","style","variant","color","backgroundColor","background","title","el","textContent"],"sources":["./src/components/counter-pill/counter-pill.scss?tag=ix-counter-pill&encapsulation=scoped","./src/components/counter-pill/counter-pill.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 './../pill/pill.scss';\n@import 'common-variables';\n@import 'mixins/text-truncation';\n\n:host {\n  .slot-container {\n    @include ellipsis;\n  }\n\n  min-height: 1rem;\n  max-height: 1rem;\n  height: 1rem;\n  font-size: $font-size-s;\n  padding: 0 $tiny-space;\n\n  min-width: 1rem;\n  width: auto;\n\n  padding: 0 4px;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-counter-pill',\n  styleUrl: 'counter-pill.scss',\n  scoped: true,\n})\nexport class CounterPill {\n  @Element() el: HTMLIxCounterPillElement;\n\n  /**\n   * Pill variant\n   */\n  @Prop({ reflect: true }) variant:\n    | 'primary'\n    | 'alarm'\n    | 'critical'\n    | 'warning'\n    | 'info'\n    | 'neutral'\n    | 'success'\n    | 'custom' = 'primary';\n\n  /**\n   * Show pill as outline\n   */\n  @Prop() outline = false;\n\n  /**\n   * Custom color for pill. Only working for `variant='custom'`\n   */\n  @Prop() background: string | undefined;\n\n  /**\n   * Custom font color for pill. Only working for `variant='custom'`\n   */\n  @Prop() color: string | undefined;\n\n  /**\n   * Align pill content left\n   */\n  @Prop() alignLeft = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          outline: this.outline,\n          'align-left': this.alignLeft,\n        }}\n        style={\n          this.variant === 'custom'\n            ? {\n                color: this.color,\n                backgroundColor: this.background,\n              }\n            : {}\n        }\n        title={this.el.textContent}\n      >\n        <span class=\"slot-container\">\n          <slot></slot>\n        </span>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,mjR,MCgBVC,EAAW,M,sCAcP,U,aAKG,M,8DAeE,K,CAEpBC,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACLC,QAASC,KAAKD,QACd,aAAcC,KAAKC,WAErBC,MACEF,KAAKG,UAAY,SACb,CACEC,MAAOJ,KAAKI,MACZC,gBAAiBL,KAAKM,YAExB,GAENC,MAAOP,KAAKQ,GAAGC,aAEfb,EAAA,QAAME,MAAM,kBACVF,EAAA,c"}

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

@@ -1,2 +0,0 @@
-import{r as i,c as e,h as s,H as t}from"./p-1c64b073.js";const n=".sc-ix-expanding-search-h{display:inline-flex;width:auto;height:2rem;align-items:center;justify-content:space-between;position:relative}.right-position.sc-ix-expanding-search-h{width:11.5625rem !important}.right-position.fullWidth.sc-ix-expanding-search-h{width:100% !important}.sc-ix-expanding-search-h .input-container.sc-ix-expanding-search{transition:all 0.3s ease-in-out}.sc-ix-expanding-search-h .disable-pointer.sc-ix-expanding-search{pointer-events:none}.sc-ix-expanding-search-h input.sc-ix-expanding-search{box-shadow:var(--theme-input--box-shadow);cursor:auto !important}.sc-ix-expanding-search-h .expanded.sc-ix-expanding-search{width:11.5625rem}.sc-ix-expanding-search-h .expanded.fullWidth.sc-ix-expanding-search{width:100%}.sc-ix-expanding-search-h .collapsed.sc-ix-expanding-search{width:1.5rem;border:none}.sc-ix-expanding-search-h .btn-search-icon.sc-ix-expanding-search{align-self:center;margin:auto;position:relative}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search{display:flex;max-width:2rem;max-height:2rem;border-radius:var(--theme-input--border-radius);transition:all 0.15s ease-in-out;z-index:1;align-items:center;position:relative;border:none}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled):hover{border-color:transparent}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled):active{border-color:transparent}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled):focus-visible{outline:none}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:not(.disabled):not(:disabled):focus-visible{outline:var(--focus--border-color);outline-width:1px;outline-style:solid}.sc-ix-expanding-search-h .btn-search.sc-ix-expanding-search:active{width:2rem;height:2rem;border-radius:var(--theme-input--border-radius);border:var(--theme-std-bdr-1) !important}.sc-ix-expanding-search-h .input-container.sc-ix-expanding-search{display:flex;position:absolute;align-items:center;flex-wrap:nowrap}.sc-ix-expanding-search-h .btn-clear.sc-ix-expanding-search{position:absolute;border-radius:var(--theme-input--border-radius);right:0px;margin-right:0.25rem}.sc-ix-expanding-search-h .input.sc-ix-expanding-search{padding-left:2rem !important;padding-right:2.5rem !important}.sc-ix-expanding-search-h .opacity-before.sc-ix-expanding-search{opacity:0}.sc-ix-expanding-search-h .opacity-after.sc-ix-expanding-search{opacity:1}";const a=class{expandInput(){setTimeout(this.focusTextInput,300);this.expanded=true}collapseInput(){if(!this.isFieldChanged&&this.expanded){this.expanded=false}}clearInput(){this.value="";this.isFieldChanged=false}onChange(i){this.value=i.target.value;if(this.isFieldChanged&&this.value===""){this.isFieldChanged=false}else{this.isFieldChanged=true}this.valueChange.emit(this.value)}constructor(s){i(this,s);this.valueChange=e(this,"valueChange",7);this.icon="search";this.placeholder="Enter text here";this.value="";this.fullWidth=false;this.isFieldChanged=false;this.expanded=false;this.hasFocus=false;this.focusTextInput=this.focusTextInput.bind(this)}focusTextInput(){var i;(i=this.textInput)===null||i===void 0?void 0:i.focus()}clearClicked(){var i;this.clearInput();(i=this.textInput)===null||i===void 0?void 0:i.focus();this.valueChange.emit(this.value)}render(){return s(t,{class:{expanded:this.expanded,"right-position":this.expanded,fullWidth:this.fullWidth}},s("button",{class:{btn:true,"btn-invisible-primary":true,"btn-icon":true,"btn-search":true,"disable-pointer":this.expanded},"data-testid":"button",onClick:()=>this.expandInput(),tabindex:this.expanded?-1:0},s("ix-icon",{class:"btn-search-icon",name:this.icon,size:this.expanded?"16":"24",color:this.hasFocus?"input-search-icon--color--focus":undefined})),s("div",{class:{expanded:this.expanded,fullWidth:this.fullWidth,collapsed:!this.expanded,"disable-pointer":!this.expanded,"input-container":true},"data-testid":"input-wrapper"},s("input",{class:{"form-control":true,input:this.expanded,"disable-pointer":!this.expanded,"opacity-before":!this.expanded,"opacity-after":this.expanded},ref:i=>this.textInput=i,"data-testid":"input",placeholder:this.placeholder,type:"text",value:this.value,onBlur:()=>{this.collapseInput();this.hasFocus=false},onFocus:()=>this.hasFocus=true,onInput:i=>this.onChange(i),tabindex:this.expanded?0:-1}),this.isFieldChanged?s("ix-icon-button",{class:"btn-clear",icon:"clear",ghost:true,size:"16","data-testid":"clear-button",onClick:()=>this.clearClicked()}):null))}};a.style=n;export{a as ix_expanding_search};
-//# sourceMappingURL=p-c724bb65.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["expandingSearchCss","ExpandingSearch","expandInput","setTimeout","this","focusTextInput","expanded","collapseInput","isFieldChanged","clearInput","value","onChange","e","target","valueChange","emit","constructor","hostRef","bind","_a","textInput","focus","clearClicked","render","h","Host","class","fullWidth","btn","onClick","tabindex","name","icon","size","color","hasFocus","undefined","collapsed","input","ref","el","placeholder","type","onBlur","onFocus","onInput","ghost"],"sources":["./src/components/expanding-search/expanding-search.scss?tag=ix-expanding-search&encapsulation=scoped","./src/components/expanding-search/expanding-search.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n$container-width: 11.5625rem;\n\n:host {\n  display: inline-flex;\n  width: auto;\n  height: $x-large-space;\n  align-items: center;\n  justify-content: space-between;\n  position: relative;\n\n  &.right-position {\n    width: $container-width !important;\n\n    &.fullWidth {\n      width: 100% !important;\n    }\n  }\n\n  .input-container {\n    transition: all 0.3s ease-in-out;\n  }\n\n  .disable-pointer {\n    pointer-events: none;\n  }\n\n  input {\n    box-shadow: var(--theme-input--box-shadow);\n    cursor: auto !important;\n  }\n\n  .expanded {\n    width: $container-width;\n\n    &.fullWidth {\n      width: 100%;\n    }\n  }\n\n  .collapsed {\n    width: $large-space;\n    border: none;\n  }\n\n  /*collapsed view*/\n  .btn-search-icon {\n    align-self: center;\n    margin: auto;\n    position: relative;\n  }\n\n  .btn-search {\n    display: flex;\n    max-width: $x-large-space;\n    max-height: $x-large-space;\n    border-radius: var(--theme-input--border-radius);\n    transition: all 0.15s ease-in-out;\n    z-index: 1;\n    align-items: center;\n    position: relative;\n    border: none;\n\n    @include hover {\n      border-color: transparent;\n    }\n\n    @include active {\n      border-color: transparent;\n    }\n\n    @include focus {\n      outline: none;\n    }\n\n    @include focus-visible {\n      outline: var(--focus--border-color);\n      outline-width: 1px;\n      outline-style: solid;\n    }\n  }\n\n  .btn-search:active {\n    width: $x-large-space;\n    height: $x-large-space;\n    border-radius: var(--theme-input--border-radius);\n    border: var(--theme-std-bdr-1) !important;\n  }\n\n  /*expanded view*/\n  .input-container {\n    display: flex;\n    position: absolute;\n    align-items: center;\n    flex-wrap: nowrap;\n  }\n\n  .btn-clear {\n    position: absolute;\n    border-radius: var(--theme-input--border-radius);\n    right: 0px;\n    margin-right: 0.25rem;\n  }\n\n  .input {\n    padding-left: $x-large-space !important;\n    padding-right: 2.5rem !important;\n  }\n\n  .opacity-before {\n    opacity: 0;\n  }\n\n  .opacity-after {\n    opacity: 1;\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  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-expanding-search',\n  styleUrl: 'expanding-search.scss',\n  scoped: true,\n})\nexport class ExpandingSearch {\n  /**\n   * Search icon\n   */\n  @Prop() icon = 'search';\n\n  /**\n   * Placeholder text\n   */\n  @Prop() placeholder = 'Enter text here';\n\n  /**\n   * Default value\n   */\n  @Prop({ mutable: true }) value = '';\n\n  /**\n   * If true the search field will fill all available horizontal space of it's parent container when expanded.\n   * @since 1.6.0\n   */\n  @Prop() fullWidth = false;\n\n  @State() isFieldChanged = false;\n\n  @State() expanded = false;\n\n  @State() hasFocus = false;\n\n  /**\n   * Value changed\n   */\n  @Event() valueChange: EventEmitter<string>;\n\n  private expandInput() {\n    setTimeout(this.focusTextInput, 300);\n    this.expanded = true;\n  }\n\n  private collapseInput() {\n    if (!this.isFieldChanged && this.expanded) {\n      this.expanded = false;\n    }\n  }\n\n  private clearInput() {\n    this.value = '';\n    this.isFieldChanged = false;\n  }\n\n  private onChange(e: InputEvent) {\n    this.value = (e.target as HTMLInputElement).value;\n    if (this.isFieldChanged && this.value === '') {\n      this.isFieldChanged = false;\n    } else {\n      this.isFieldChanged = true;\n    }\n\n    this.valueChange.emit(this.value);\n  }\n\n  private textInput?: HTMLInputElement;\n\n  constructor() {\n    this.focusTextInput = this.focusTextInput.bind(this);\n  }\n\n  private focusTextInput() {\n    this.textInput?.focus();\n  }\n\n  private clearClicked() {\n    this.clearInput();\n    this.textInput?.focus();\n    this.valueChange.emit(this.value);\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          expanded: this.expanded,\n          'right-position': this.expanded,\n          fullWidth: this.fullWidth,\n        }}\n      >\n        <button\n          class={{\n            btn: true,\n            'btn-invisible-primary': true,\n            'btn-icon': true,\n            'btn-search': true,\n            'disable-pointer': this.expanded,\n          }}\n          data-testid=\"button\"\n          onClick={() => this.expandInput()}\n          tabindex={this.expanded ? -1 : 0}\n        >\n          <ix-icon\n            class=\"btn-search-icon\"\n            name={this.icon}\n            size={this.expanded ? '16' : '24'}\n            color={\n              this.hasFocus ? 'input-search-icon--color--focus' : undefined\n            }\n          ></ix-icon>\n        </button>\n\n        <div\n          class={{\n            expanded: this.expanded,\n            fullWidth: this.fullWidth,\n            collapsed: !this.expanded,\n            'disable-pointer': !this.expanded,\n            'input-container': true,\n          }}\n          data-testid=\"input-wrapper\"\n        >\n          <input\n            class={{\n              'form-control': true,\n              input: this.expanded,\n              'disable-pointer': !this.expanded,\n              'opacity-before': !this.expanded,\n              'opacity-after': this.expanded,\n            }}\n            ref={(el) => (this.textInput = el)}\n            data-testid=\"input\"\n            placeholder={this.placeholder}\n            type=\"text\"\n            value={this.value}\n            onBlur={() => {\n              this.collapseInput();\n              this.hasFocus = false;\n            }}\n            onFocus={() => (this.hasFocus = true)}\n            onInput={(e: InputEvent) => this.onChange(e)}\n            tabindex={this.expanded ? 0 : -1}\n          />\n\n          {this.isFieldChanged ? (\n            <ix-icon-button\n              class=\"btn-clear\"\n              icon=\"clear\"\n              ghost={true}\n              size=\"16\"\n              data-testid=\"clear-button\"\n              onClick={() => this.clearClicked()}\n            />\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAqB,knF,MCwBdC,EAAe,MAiClBC,cACNC,WAAWC,KAAKC,eAAgB,KAChCD,KAAKE,SAAW,I,CAGVC,gBACN,IAAKH,KAAKI,gBAAkBJ,KAAKE,SAAU,CACzCF,KAAKE,SAAW,K,EAIZG,aACNL,KAAKM,MAAQ,GACbN,KAAKI,eAAiB,K,CAGhBG,SAASC,GACfR,KAAKM,MAASE,EAAEC,OAA4BH,MAC5C,GAAIN,KAAKI,gBAAkBJ,KAAKM,QAAU,GAAI,CAC5CN,KAAKI,eAAiB,K,KACjB,CACLJ,KAAKI,eAAiB,I,CAGxBJ,KAAKU,YAAYC,KAAKX,KAAKM,M,CAK7BM,YAAAC,G,6DA1De,S,iBAKO,kB,WAKW,G,eAMb,M,oBAEM,M,cAEN,M,cAEA,MAqClBb,KAAKC,eAAiBD,KAAKC,eAAea,KAAKd,K,CAGzCC,iB,OACNc,EAAAf,KAAKgB,aAAS,MAAAD,SAAA,SAAAA,EAAEE,O,CAGVC,e,MACNlB,KAAKK,cACLU,EAAAf,KAAKgB,aAAS,MAAAD,SAAA,SAAAA,EAAEE,QAChBjB,KAAKU,YAAYC,KAAKX,KAAKM,M,CAG7Ba,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACLpB,SAAUF,KAAKE,SACf,iBAAkBF,KAAKE,SACvBqB,UAAWvB,KAAKuB,YAGlBH,EAAA,UACEE,MAAO,CACLE,IAAK,KACL,wBAAyB,KACzB,WAAY,KACZ,aAAc,KACd,kBAAmBxB,KAAKE,UACzB,cACW,SACZuB,QAAS,IAAMzB,KAAKF,cACpB4B,SAAU1B,KAAKE,UAAY,EAAI,GAE/BkB,EAAA,WACEE,MAAM,kBACNK,KAAM3B,KAAK4B,KACXC,KAAM7B,KAAKE,SAAW,KAAO,KAC7B4B,MACE9B,KAAK+B,SAAW,kCAAoCC,aAK1DZ,EAAA,OACEE,MAAO,CACLpB,SAAUF,KAAKE,SACfqB,UAAWvB,KAAKuB,UAChBU,WAAYjC,KAAKE,SACjB,mBAAoBF,KAAKE,SACzB,kBAAmB,MACpB,cACW,iBAEZkB,EAAA,SACEE,MAAO,CACL,eAAgB,KAChBY,MAAOlC,KAAKE,SACZ,mBAAoBF,KAAKE,SACzB,kBAAmBF,KAAKE,SACxB,gBAAiBF,KAAKE,UAExBiC,IAAMC,GAAQpC,KAAKgB,UAAYoB,EAAG,cACtB,QACZC,YAAarC,KAAKqC,YAClBC,KAAK,OACLhC,MAAON,KAAKM,MACZiC,OAAQ,KACNvC,KAAKG,gBACLH,KAAK+B,SAAW,KAAK,EAEvBS,QAAS,IAAOxC,KAAK+B,SAAW,KAChCU,QAAUjC,GAAkBR,KAAKO,SAASC,GAC1CkB,SAAU1B,KAAKE,SAAW,GAAK,IAGhCF,KAAKI,eACJgB,EAAA,kBACEE,MAAM,YACNM,KAAK,QACLc,MAAO,KACPb,KAAK,KAAI,cACG,eACZJ,QAAS,IAAMzB,KAAKkB,iBAEpB,M"}

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

@@ -1,2 +0,0 @@
-import{r as e,c as i,h as t,H as o,g as d}from"./p-1c64b073.js";import{a as n}from"./p-810b5232.js";const a=e=>e?"true":"false";const r=":host{display:flex;flex-direction:column;background-color:var(--theme-blind-base--background);border:solid var(--theme-blind--border-thickness) var(--theme-blind-base--border-color);border-radius:var(--theme-blind--border-radius);overflow:hidden}:host .blind-header{all:unset;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;min-height:3rem;height:3rem;border:solid var(--theme-blind--border-thickness) transparent;border-radius:var(--theme-blind--border-radius) var(--theme-blind--border-radius) 0 0;padding-right:0.5rem;transition:border-radius 150ms;cursor:pointer;z-index:1;color:var(--theme-blind-header-closed--color);background-color:var(--theme-blind-header-closed--background)}:host .blind-header .collapse-icon{color:var(--theme-blind-header-icon-closed--color);padding:0.25rem 0.5rem}:host .blind-header .blind-header-title,:host .blind-header .blind-header-title-basic{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;flex-grow:1;height:100%}:host .blind-header .blind-header-title .blind-header-title-default,:host .blind-header .blind-header-title-basic .blind-header-title-default{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-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);-webkit-margin-end:0.5rem;margin-inline-end:0.5rem;flex-grow:1}:host .blind-header .blind-header-title-basic ix-icon{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}:host .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host .blind-header:not(.disabled):not(:disabled):hover{background-color:var(--theme-blind-header-open--background--hover)}:host .blind-header:not(.disabled):not(:disabled):hover .collapse-icon{color:var(--theme-blind-header-icon-open--color--hover)}:host .blind-header:not(.disabled):not(:disabled){cursor:pointer}:host .blind-header:not(.disabled):not(:disabled):active{background-color:var(--theme-blind-header-open--background--active)}:host .blind-header:not(.disabled):not(:disabled):active .collapse-icon{color:var(--theme-blind-header-icon-open--color--active)}:host .blind-header:not(.disabled):not(:disabled):focus-visible{border-color:var(--theme-color-focus-bdr);outline:none}:host .blind-header.closed{border-radius:var(--theme-blind--border-radius)}:host .blind-header.closed:not(.disabled):not(:disabled){cursor:pointer}:host .blind-header.closed:not(.disabled):not(:disabled):hover{background-color:var(--theme-blind-header-open--background--hover)}:host .blind-header.closed:not(.disabled):not(:disabled):hover .collapse-icon{color:var(--theme-blind-header-icon-closed--color--hover)}:host .blind-header.closed:not(.disabled):not(:disabled){cursor:pointer}:host .blind-header.closed:not(.disabled):not(:disabled):active{background-color:var(--theme-blind-header-open--background--active)}:host .blind-header.closed:not(.disabled):not(:disabled):active .collapse-icon{color:var(--theme-blind-header-icon-closed--color--active)}:host .blind-content{display:block;padding:1rem;transition-property:padding;transition-duration:150ms;transition-timing-function:ease-in}:host .blind-content.hide{max-height:0;padding-top:0px;padding-bottom:0px}";let s=0;const l=class{constructor(t){e(this,t);this.collapsedChange=i(this,"collapsedChange",7);this.id=++s;this.collapsed=false;this.label=undefined;this.icon=undefined}onHeaderClick(e){if(e.target.closest(".header-actions")){return}e.preventDefault();e.stopImmediatePropagation();this.collapsed=!this.collapsed;this.collapsedChange.emit(this.collapsed)}componentDidLoad(){this.animateCollapse(this.collapsed)}get content(){return this.hostElement.shadowRoot.querySelector(".blind-content")}animation(e){this.animateCollapse(e)}animateCollapse(e){if(e){this.rotateChevronRight()}else{this.rotateChevronDown()}}rotateChevronDown(){n({targets:this.chevronRef,duration:150,easing:"easeInOutSine",rotateZ:90});n({targets:this.content,duration:150,easing:"easeInOutSine",opacity:1})}rotateChevronRight(){n({targets:this.chevronRef,duration:150,easing:"easeInOutSine",rotateZ:0});n({targets:this.content,duration:150,easing:"easeInOutSine",opacity:0})}render(){return t(o,null,t("button",{class:{"blind-header":true,closed:this.collapsed},type:"button","aria-labelledby":`ix-blind-header-title-${this.id}`,"aria-controls":`ix-blind-content-section-${this.id}`,"aria-expanded":a(!this.collapsed),onClick:e=>this.onHeaderClick(e)},t("ix-icon",{class:"collapse-icon",name:"chevron-right-small",ref:e=>this.chevronRef=e}),t("div",{class:"blind-header-title",id:`ix-blind-header-title-${this.id}`},this.label!==undefined?t("span",{class:"blind-header-title-basic"},this.icon!==undefined?t("ix-icon",{name:this.icon}):"",t("span",{class:"blind-header-title-default"},this.label),t("span",{class:"header-actions",onClick:e=>e.stopImmediatePropagation()},t("slot",{name:"header-actions"}))):t("slot",{name:"custom-header"}))),t("section",{id:`ix-blind-content-section-${this.id}`,"aria-labelledby":`ix-blind-header-title-${this.id}`},t("div",{class:{"blind-content":true,hide:this.collapsed}},t("slot",null))))}get hostElement(){return d(this)}static get watchers(){return{collapsed:["animation"]}}};l.style=r;export{l as ix_blind};
-//# sourceMappingURL=p-ca4d28fb.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["a11yBoolean","value","blindCss","sequentialInstanceId","Blind","constructor","hostRef","this","id","onHeaderClick","e","target","closest","preventDefault","stopImmediatePropagation","collapsed","collapsedChange","emit","componentDidLoad","animateCollapse","content","hostElement","shadowRoot","querySelector","animation","isCollapsed","rotateChevronRight","rotateChevronDown","anime","targets","chevronRef","duration","easing","rotateZ","opacity","render","h","Host","class","closed","type","onClick","name","ref","label","undefined","icon","hide"],"sources":["./src/components/utils/a11y.ts","./src/components/blind/blind.scss?tag=ix-blind&encapsulation=shadow","./src/components/blind/blind.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nexport const a11yBoolean = (value: boolean) => (value ? 'true' : 'false');\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n  display: flex;\n  flex-direction: column;\n  background-color: var(--theme-blind-base--background);\n  border: solid var(--theme-blind--border-thickness)\n    var(--theme-blind-base--border-color);\n  border-radius: var(--theme-blind--border-radius);\n  overflow: hidden;\n\n  .blind-header {\n    all: unset;\n    @include ellipsis;\n\n    display: flex;\n    align-items: center;\n    min-height: 3rem;\n    height: 3rem;\n    border: solid var(--theme-blind--border-thickness) transparent;\n    border-radius: var(--theme-blind--border-radius)\n      var(--theme-blind--border-radius) 0 0;\n    padding-right: $small-space;\n    transition: border-radius $default-time;\n    cursor: pointer;\n\n    z-index: 1;\n\n    color: var(--theme-blind-header-closed--color);\n    background-color: var(--theme-blind-header-closed--background);\n\n    .collapse-icon {\n      color: var(--theme-blind-header-icon-closed--color);\n      padding: $tiny-space $small-space;\n    }\n\n    .blind-header-title,\n    .blind-header-title-basic {\n      @include ellipsis;\n      display: flex;\n      align-items: center;\n      flex-grow: 1;\n      height: 100%;\n\n      .blind-header-title-default {\n        @include ellipsis;\n        @include text-l-title;\n        margin-inline-end: $small-space;\n        flex-grow: 1;\n      }\n    }\n\n    .blind-header-title-basic ix-icon {\n      margin-inline-end: $small-space;\n    }\n\n    @include hover {\n      background-color: var(--theme-blind-header-open--background--hover);\n\n      .collapse-icon {\n        color: var(--theme-blind-header-icon-open--color--hover);\n      }\n    }\n\n    @include active {\n      background-color: var(--theme-blind-header-open--background--active);\n\n      .collapse-icon {\n        color: var(--theme-blind-header-icon-open--color--active);\n      }\n    }\n\n    @include focus-visible {\n      border-color: var(--theme-color-focus-bdr);\n      outline: none;\n    }\n\n    &.closed {\n      border-radius: var(--theme-blind--border-radius);\n\n      @include hover {\n        background-color: var(--theme-blind-header-open--background--hover);\n\n        .collapse-icon {\n          color: var(--theme-blind-header-icon-closed--color--hover);\n        }\n      }\n\n      @include active {\n        background-color: var(--theme-blind-header-open--background--active);\n\n        .collapse-icon {\n          color: var(--theme-blind-header-icon-closed--color--active);\n        }\n      }\n    }\n  }\n\n  .blind-content {\n    display: block;\n    padding: 1rem;\n    transition-property: padding;\n    transition-duration: $default-time;\n    transition-timing-function: ease-in;\n\n    &.hide {\n      max-height: 0;\n      padding-top: 0px;\n      padding-bottom: 0px;\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { a11yBoolean } from '../utils/a11y';\n\nlet sequentialInstanceId = 0;\n@Component({\n  tag: 'ix-blind',\n  styleUrl: 'blind.scss',\n  shadow: true,\n})\nexport class Blind {\n  /**\n   * Collapsed state\n   */\n  @Prop({ mutable: true, reflect: true }) collapsed = false;\n\n  /**\n   * Label of blind\n   */\n  @Prop() label: string;\n\n  /**\n   * Optional icon to be displayed next to the header label\n   * @since 1.5.0\n   */\n  @Prop() icon: string;\n\n  /**\n   * Collapsed state changed\n   */\n  @Event() collapsedChange: EventEmitter<boolean>;\n\n  @Element() hostElement!: HTMLIxBlindElement;\n\n  private chevronRef: HTMLElement;\n  private id = ++sequentialInstanceId;\n\n  constructor() {}\n\n  private onHeaderClick(e: Event) {\n    if ((e.target as Element).closest('.header-actions')) {\n      return;\n    }\n\n    e.preventDefault();\n    e.stopImmediatePropagation();\n\n    this.collapsed = !this.collapsed;\n    this.collapsedChange.emit(this.collapsed);\n  }\n\n  componentDidLoad() {\n    this.animateCollapse(this.collapsed);\n  }\n\n  get content() {\n    return this.hostElement.shadowRoot.querySelector('.blind-content');\n  }\n\n  @Watch('collapsed')\n  animation(isCollapsed: boolean) {\n    this.animateCollapse(isCollapsed);\n  }\n\n  private animateCollapse(isCollapsed: boolean) {\n    if (isCollapsed) {\n      this.rotateChevronRight();\n    } else {\n      this.rotateChevronDown();\n    }\n  }\n\n  private rotateChevronDown() {\n    anime({\n      targets: this.chevronRef,\n      duration: 150,\n      easing: 'easeInOutSine',\n      rotateZ: 90,\n    });\n    anime({\n      targets: this.content,\n      duration: 150,\n      easing: 'easeInOutSine',\n      opacity: 1,\n    });\n  }\n\n  private rotateChevronRight() {\n    anime({\n      targets: this.chevronRef,\n      duration: 150,\n      easing: 'easeInOutSine',\n      rotateZ: 0,\n    });\n    anime({\n      targets: this.content,\n      duration: 150,\n      easing: 'easeInOutSine',\n      opacity: 0,\n    });\n  }\n\n  render() {\n    return (\n      <Host>\n        <button\n          class={{\n            'blind-header': true,\n            closed: this.collapsed,\n          }}\n          type=\"button\"\n          aria-labelledby={`ix-blind-header-title-${this.id}`}\n          aria-controls={`ix-blind-content-section-${this.id}`}\n          aria-expanded={a11yBoolean(!this.collapsed)}\n          onClick={(e) => this.onHeaderClick(e)}\n        >\n          <ix-icon\n            class={'collapse-icon'}\n            name=\"chevron-right-small\"\n            ref={(ref) => (this.chevronRef = ref)}\n          ></ix-icon>\n          <div\n            class=\"blind-header-title\"\n            id={`ix-blind-header-title-${this.id}`}\n          >\n            {this.label !== undefined ? (\n              <span class=\"blind-header-title-basic\">\n                {this.icon !== undefined ? (\n                  <ix-icon name={this.icon}></ix-icon>\n                ) : (\n                  ''\n                )}\n                <span class=\"blind-header-title-default\">{this.label}</span>\n                <span\n                  class=\"header-actions\"\n                  onClick={(e) => e.stopImmediatePropagation()}\n                >\n                  <slot name=\"header-actions\"></slot>\n                </span>\n              </span>\n            ) : (\n              <slot name=\"custom-header\"></slot>\n            )}\n          </div>\n        </button>\n        <section\n          id={`ix-blind-content-section-${this.id}`}\n          aria-labelledby={`ix-blind-header-title-${this.id}`}\n        >\n          <div\n            class={{\n              'blind-content': true,\n              hide: this.collapsed,\n            }}\n          >\n            <slot></slot>\n          </div>\n        </section>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAQO,MAAMA,EAAeC,GAAoBA,EAAQ,OAAS,QCRjE,MAAMC,EAAW,kvGCsBjB,IAAIC,EAAuB,E,MAMdC,EAAK,MA2BhBC,YAAAC,G,2DAFQC,KAAAC,KAAOL,E,eArBqC,M,yCAyB5CM,cAAcC,GACpB,GAAKA,EAAEC,OAAmBC,QAAQ,mBAAoB,CACpD,M,CAGFF,EAAEG,iBACFH,EAAEI,2BAEFP,KAAKQ,WAAaR,KAAKQ,UACvBR,KAAKS,gBAAgBC,KAAKV,KAAKQ,U,CAGjCG,mBACEX,KAAKY,gBAAgBZ,KAAKQ,U,CAGxBK,cACF,OAAOb,KAAKc,YAAYC,WAAWC,cAAc,iB,CAInDC,UAAUC,GACRlB,KAAKY,gBAAgBM,E,CAGfN,gBAAgBM,GACtB,GAAIA,EAAa,CACflB,KAAKmB,oB,KACA,CACLnB,KAAKoB,mB,EAIDA,oBACNC,EAAM,CACJC,QAAStB,KAAKuB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,KAEXL,EAAM,CACJC,QAAStB,KAAKa,QACdW,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAILR,qBACNE,EAAM,CACJC,QAAStB,KAAKuB,WACdC,SAAU,IACVC,OAAQ,gBACRC,QAAS,IAEXL,EAAM,CACJC,QAAStB,KAAKa,QACdW,SAAU,IACVC,OAAQ,gBACRE,QAAS,G,CAIbC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,UACEE,MAAO,CACL,eAAgB,KAChBC,OAAQhC,KAAKQ,WAEfyB,KAAK,SAAQ,kBACI,yBAAyBjC,KAAKC,KAAI,gBACpC,4BAA4BD,KAAKC,KAAI,gBACrCR,GAAaO,KAAKQ,WACjC0B,QAAU/B,GAAMH,KAAKE,cAAcC,IAEnC0B,EAAA,WACEE,MAAO,gBACPI,KAAK,sBACLC,IAAMA,GAASpC,KAAKuB,WAAaa,IAEnCP,EAAA,OACEE,MAAM,qBACN9B,GAAI,yBAAyBD,KAAKC,MAEjCD,KAAKqC,QAAUC,UACdT,EAAA,QAAME,MAAM,4BACT/B,KAAKuC,OAASD,UACbT,EAAA,WAASM,KAAMnC,KAAKuC,OAAgB,GAItCV,EAAA,QAAME,MAAM,8BAA8B/B,KAAKqC,OAC/CR,EAAA,QACEE,MAAM,iBACNG,QAAU/B,GAAMA,EAAEI,4BAElBsB,EAAA,QAAMM,KAAK,qBAIfN,EAAA,QAAMM,KAAK,oBAIjBN,EAAA,WACE5B,GAAI,4BAA4BD,KAAKC,KAAI,kBACxB,yBAAyBD,KAAKC,MAE/C4B,EAAA,OACEE,MAAO,CACL,gBAAiB,KACjBS,KAAMxC,KAAKQ,YAGbqB,EAAA,e"}

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

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as i,H as s,g as n}from"./p-1c64b073.js";const o=".sc-ix-select-h{display:inline-block;position:relative;height:auto;border-radius:var(--theme-input--border-radius)}.sc-ix-select-h .select.sc-ix-select{position:relative;display:flex;align-items:center;height:auto;background-color:var(--theme-input--background);border:var(--theme-input--border-thickness) solid var(--theme-input--border-color);border-radius:var(--theme-input--border-radius);padding:0 0 0 0.5rem;box-shadow:var(--theme-inset-shadow-1) !important}.sc-ix-select-h .select.sc-ix-select:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-select-h .select.sc-ix-select:not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover)}.sc-ix-select-h .select.sc-ix-select:focus-within{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline:1px solid #119fff !important;outline-offset:var(--theme-input--focus--outline-offset)}.sc-ix-select-h .select.readonly.sc-ix-select{box-shadow:none !important}.sc-ix-select-h .hidden.sc-ix-select{display:none !important}.sc-ix-select-h .trigger.sc-ix-select{display:flex;align-items:center;flex-grow:1;height:100%}.sc-ix-select-h .input-container.sc-ix-select{display:flex;position:relative;align-items:flex-start;width:100%}.sc-ix-select-h .input-container.sc-ix-select .chips.sc-ix-select{position:relative;display:flex;align-items:center;flex-wrap:wrap;height:100%;max-height:3.5rem;flex-grow:1;overflow-y:auto}.sc-ix-select-h .input-container.sc-ix-select .chips.sc-ix-select>ix-filter-chip.sc-ix-select{margin:0.1rem}.sc-ix-select-h .input-container.sc-ix-select input.sc-ix-select{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);background:transparent;height:1.75rem;width:100%}.sc-ix-select-h .input-container.sc-ix-select input.sc-ix-select,.sc-ix-select-h .input-container.sc-ix-select input.sc-ix-select:hover,.sc-ix-select-h .input-container.sc-ix-select input.sc-ix-select:focus-visible{border:none;outline:none}.sc-ix-select-h .input-container.sc-ix-select input.sc-ix-select::-moz-placeholder{color:var(--theme-input-select-icon--color)}.sc-ix-select-h .input-container.sc-ix-select input.sc-ix-select::placeholder{color:var(--theme-input-select-icon--color)}.sc-ix-select-h .input-container.sc-ix-select input.hide-placeholder.sc-ix-select::-moz-placeholder{opacity:0}.sc-ix-select-h .input-container.sc-ix-select input.hide-placeholder.sc-ix-select::placeholder{opacity:0}.sc-ix-select-h .chevron-down-container.sc-ix-select{display:flex;align-items:center;justify-content:center;width:2rem;min-width:2rem;height:2rem}.sc-ix-select-h .chevron-down-container.sc-ix-select:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-select-h .chevron-down-container.sc-ix-select:not(.disabled):not(:disabled):hover{color:var(--theme-color-dynamic--hover)}.sc-ix-select-h .chevron-down-container.sc-ix-select:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-select-h .chevron-down-container.sc-ix-select:not(.disabled):not(:disabled):active{color:var(--theme-color-dynamic--hover)}.sc-ix-select-h .editable.sc-ix-select .chevron-down-container.sc-ix-select:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-select-h .editable.sc-ix-select .chevron-down-container.sc-ix-select:not(.disabled):not(:disabled):hover{color:var(--theme-color-std-text);background-color:var(--theme-btn-invisible-secondary--background--hover)}.sc-ix-select-h .editable.sc-ix-select .chevron-down-container.sc-ix-select:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-select-h .editable.sc-ix-select .chevron-down-container.sc-ix-select:not(.disabled):not(:disabled):active{color:var(--theme-color-std-text);background-color:var(--theme-btn-invisible-secondary--background--active)}.sc-ix-select-h .add-item.sc-ix-select{display:flex;justify-content:flex-start;align-items:center;position:relative;width:100%}.sc-ix-select-h .select-list-header.sc-ix-select{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;height:2rem;color:var(--theme-select-list-item-hint--color);margin:0 0.5rem 0 2rem}";const c=class{constructor(i){e(this,i);this.itemSelectionChange=t(this,"itemSelectionChange",7);this.addItem=t(this,"addItem",7);this.selectedIndices=[];this.allowClear=false;this.mode="single";this.editable=false;this.disabled=false;this.readonly=false;this.i18nPlaceholder="Select an option";this.i18nPlaceholderEditable="Type of select option";this.i18nSelectListHeader="Please select an option";this.i18nNoMatches="No matches";this.hideListHeader=false;this.dropdownShow=false;this.value=undefined;this.dropdownWrapperRef=undefined;this.dropdownAnchor=undefined;this.isDropdownEmpty=false;this.hasFocus=false;this.navigationItem=undefined;this.inputFilterText=undefined;this.inputValue=undefined}get items(){return Array.from(this.hostElement.querySelectorAll("ix-select-item"))}get selectedItems(){return this.items.filter((e=>e.selected))}get addItemButton(){return this.hostElement.querySelector(".add-item")}get isSingleMode(){return this.mode==="single"}get isMultipleMode(){return this.mode==="multiple"}get isEveryDropdownItemHidden(){return this.items.every((e=>e.classList.contains("d-none")))}watchSelectedIndices(e){if(!e){this.selectValue([]);return}if(Array.isArray(e)){this.selectValue([...e]);return}this.selectValue([e])}onItemClicked(e){const t=e.detail;this.emitItemClick(t)}emitItemClick(e){if(this.isMultipleMode&&Array.isArray(this.selectedIndices)){if(this.selectedIndices.includes(e)){this.selectedIndices=this.selectedIndices.filter((t=>t!==e))}else{this.selectedIndices=[...this.selectedIndices,e]}}else{this.selectedIndices=[e]}this.selectValue(this.selectedIndices);this.itemSelectionChange.emit(this.selectedIndices)}emitAddItem(e){if(e.trim()===""){return}const t=document.createElement("ix-select-item");t.value=e;t.label=e;this.addItemRef.appendChild(t);this.clearInput();this.emitItemClick(e);this.addItem.emit(e)}selectValue(e){var t;this.items.forEach((t=>{t.selected=e.some((e=>e===t.value))}));this.value=this.selectedItems.map((e=>e.label));if(this.isSingleMode){this.inputValue=((t=this.value)===null||t===void 0?void 0:t.length)?this.value[0]:null;return}this.inputValue=null}componentWillLoad(){if(this.selectedIndices){this.selectValue(Array.isArray(this.selectedIndices)?this.selectedIndices:[this.selectedIndices])}}onLabelChange(e){e.preventDefault();e.stopImmediatePropagation();this.selectValue(Array.isArray(this.selectedIndices)?this.selectedIndices:[this.selectedIndices])}disconnectedCallback(){if(this.labelMutationObserver){this.labelMutationObserver.disconnect()}}itemExists(e){return this.items.find((t=>t.label===e))}dropdownVisibilityChanged(e){this.dropdownShow=e.detail;this.hasFocus=e.detail;if(e.detail){this.inputRef.focus();this.inputRef.select();this.removeHiddenFromItems();this.isDropdownEmpty=this.isEveryDropdownItemHidden}else{this.navigationItem=undefined}}async onKeyDown(e){if(!this.dropdownShow){return}if(e.code==="ArrowDown"||e.code==="ArrowUp"){this.onArrowNavigation(e)}if(e.code==="Enter"||e.code==="NumpadEnter"){await this.onEnterNavigation()}if(e.code==="Escape"){this.dropdownShow=false}}async onEnterNavigation(){var e,t;if(this.isMultipleMode){return}if(this.editable&&!this.itemExists(this.inputFilterText)){this.emitAddItem(this.inputFilterText);this.navigationItem=this.items[this.items.length-1]}(e=this.navigationItem)===null||e===void 0?void 0:e.onItemClick();await((t=this.dropdownRef)===null||t===void 0?void 0:t.updatePosition());if(this.isSingleMode&&!this.editable){this.dropdownShow=false}}onArrowNavigation(e){e.stopPropagation();e.preventDefault();const t=this.items.find((e=>document.activeElement===e.querySelector("button")));this.navigationItem=t;const i=this.items.filter((e=>!e.classList.contains("d-none")));const s=i.indexOf(this.navigationItem);if(e.code==="ArrowDown"&&s<i.length-1){this.navigationItem=i[s+1]}else if(e.code==="ArrowUp"&&s>0){this.navigationItem=i[s-1]}this.setHoverEffectForNavigatedSelectItem()}setHoverEffectForNavigatedSelectItem(){var e;(e=this.navigationItem)===null||e===void 0?void 0:e.querySelector("button").focus()}filterItemsWithTypeahead(){this.inputFilterText=this.inputRef.value;if(this.inputFilterText){this.items.forEach((e=>{e.classList.remove("d-none");if(!e.label.toLowerCase().includes(this.inputFilterText.toLowerCase())){e.classList.add("d-none")}}))}else{this.removeHiddenFromItems()}this.isDropdownEmpty=this.isEveryDropdownItemHidden}removeHiddenFromItems(){this.items.forEach((e=>{e.classList.remove("d-none")}))}clearInput(){this.inputRef.value="";this.inputFilterText=""}clear(){this.clearInput();this.value=[];this.selectedIndices=[];this.itemSelectionChange.emit(null);this.dropdownShow=false}onInputBlur(e){if(this.editable){return}if(this.isSingleMode){if(this.dropdownShow&&this.isDropdownEmpty){this.dropdownShow=false}}if(!this.dropdownShow&&this.mode!=="multiple"){e.target["value"]=this.value}}placeholderValue(){if(this.editable){return this.i18nPlaceholderEditable}if(this.readonly){return""}return this.i18nPlaceholder}render(){var e,t,n;return i(s,null,i("div",{class:{"form-control":true,select:true,focus:this.hasFocus,editable:this.editable,disabled:this.disabled,readonly:this.readonly},ref:e=>{this.dropdownAnchor=e;if(!this.editable)this.dropdownWrapperRef=e}},i("div",{class:"input-container"},i("div",{class:"chips"},this.isMultipleMode?(e=this.selectedItems)===null||e===void 0?void 0:e.map((e=>i("ix-filter-chip",{disabled:this.disabled||this.readonly,key:e.value,onCloseClick:t=>{t.preventDefault();t.stopPropagation();this.emitItemClick(e.value)}},e.label))):"",i("div",{class:"trigger"},i("input",{"data-testid":"input",disabled:this.disabled,readOnly:this.readonly,type:"text",class:{"allow-clear":this.allowClear&&!!((t=this.value)===null||t===void 0?void 0:t.length)},placeholder:this.placeholderValue(),value:this.inputValue,ref:e=>this.inputRef=e,onBlur:e=>this.onInputBlur(e),onInput:()=>this.filterItemsWithTypeahead()}),this.allowClear&&(((n=this.value)===null||n===void 0?void 0:n.length)||this.inputFilterText)?i("ix-icon-button",{class:"clear",icon:"clear",ghost:true,oval:true,size:"16",onClick:e=>{e.preventDefault();e.stopPropagation();this.clear()}}):null,this.disabled||this.readonly?null:i("div",{class:"chevron-down-container",ref:e=>{if(this.editable)this.dropdownWrapperRef=e}},i("ix-icon",{class:"chevron",name:"chevron-down-small"})))))),i("ix-dropdown",{ref:e=>this.dropdownRef=e,show:this.dropdownShow,closeBehavior:this.isMultipleMode?"outside":"both",class:{"d-none":this.disabled||this.readonly},anchor:this.dropdownAnchor,trigger:this.dropdownWrapperRef,onShowChanged:e=>this.dropdownVisibilityChanged(e),placement:"auto-start",overwriteDropdownStyle:async()=>({minWidth:`${this.hostElement.clientWidth}px`})},i("div",{class:{"select-list-header":true,hidden:this.hideListHeader||this.isDropdownEmpty},title:this.i18nSelectListHeader},this.i18nSelectListHeader),i("slot",null),i("div",{ref:e=>this.addItemRef=e,class:"d-contents"}),this.itemExists(this.inputFilterText)?"":i("ix-dropdown-item",{"data-testid":"add-item",icon:"plus",class:{"add-item":true,"d-none":!(this.editable&&this.inputFilterText)},label:this.inputFilterText,onItemClick:e=>{e.preventDefault();e.stopPropagation();this.emitAddItem(this.inputFilterText)}}),this.isDropdownEmpty&&!this.editable?i("div",{class:"select-list-header"},this.i18nNoMatches):""))}get hostElement(){return n(this)}static get watchers(){return{selectedIndices:["watchSelectedIndices"]}}};c.style=o;class l extends CustomEvent{constructor(e){super("ix-select-item:labelChange",{bubbles:true,detail:e})}}const h=".sc-ix-select-item-h{display:block}";const r=class{constructor(i){e(this,i);this.itemClick=t(this,"itemClick",7);this.label=undefined;this.value=undefined;this.selected=false;this.hover=false}async onItemClick(e){e===null||e===void 0?void 0:e.preventDefault();e===null||e===void 0?void 0:e.stopPropagation();this.itemClick.emit(this.value)}componentDidRender(){if(!this.value){throw Error("ix-select-item must have a `value` property")}}labelChange(e,t){this.hostElement.dispatchEvent(new l({newValue:e,oldValue:t}))}render(){return i(s,null,i("ix-dropdown-item",{checked:this.selected,label:this.label?this.label:this.value,onItemClick:e=>this.onItemClick(e)}))}get hostElement(){return n(this)}static get watchers(){return{label:["labelChange"]}}};r.style=h;export{c as ix_select,r as ix_select_item};
-//# sourceMappingURL=p-cd4e3593.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["selectCss","Select","items","Array","from","this","hostElement","querySelectorAll","selectedItems","filter","item","selected","addItemButton","querySelector","isSingleMode","mode","isMultipleMode","isEveryDropdownItemHidden","every","classList","contains","watchSelectedIndices","newId","selectValue","isArray","onItemClicked","event","detail","emitItemClick","selectedIndices","includes","i","itemSelectionChange","emit","emitAddItem","value","trim","newItem","document","createElement","label","addItemRef","appendChild","clearInput","addItem","ids","forEach","some","map","inputValue","_a","length","componentWillLoad","onLabelChange","preventDefault","stopImmediatePropagation","disconnectedCallback","labelMutationObserver","disconnect","itemExists","find","dropdownVisibilityChanged","dropdownShow","hasFocus","inputRef","focus","select","removeHiddenFromItems","isDropdownEmpty","navigationItem","undefined","async","code","onArrowNavigation","onEnterNavigation","editable","inputFilterText","onItemClick","_b","dropdownRef","updatePosition","stopPropagation","focusItem","activeElement","selectItems","index","indexOf","setHoverEffectForNavigatedSelectItem","filterItemsWithTypeahead","remove","toLowerCase","add","clear","onInputBlur","e","target","placeholderValue","i18nPlaceholderEditable","readonly","i18nPlaceholder","render","h","Host","class","disabled","ref","dropdownAnchor","dropdownWrapperRef","key","onCloseClick","readOnly","type","allowClear","placeholder","onBlur","onInput","_c","icon","ghost","oval","size","onClick","name","show","closeBehavior","anchor","trigger","onShowChanged","placement","overwriteDropdownStyle","minWidth","clientWidth","hidden","hideListHeader","title","i18nSelectListHeader","i18nNoMatches","IxSelectItemLabelChangeEvent","CustomEvent","constructor","super","bubbles","selectItemCss","SelectItem","itemClick","componentDidRender","Error","labelChange","newValue","oldValue","dispatchEvent","checked"],"sources":["./src/components/select/select.scss?tag=ix-select&encapsulation=scoped","./src/components/select/select.tsx","./src/components/select-item/events.ts","./src/components/select-item/select-item.scss?tag=ix-select-item&encapsulation=scoped","./src/components/select-item/select-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/fonts';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n  display: inline-block;\n  position: relative;\n  height: auto;\n  border-radius: var(--theme-input--border-radius);\n\n  .select {\n    position: relative;\n    display: flex;\n    align-items: center;\n    height: auto;\n    background-color: var(--theme-input--background);\n    border: var(--theme-input--border-thickness) solid\n      var(--theme-input--border-color);\n    border-radius: var(--theme-input--border-radius);\n    padding: 0 0 0 $small-space;\n    box-shadow: var(--theme-inset-shadow-1) !important;\n\n    @include hover {\n      background-color: var(--theme-input--background--hover);\n      border-color: var(--theme-input--border-color--hover);\n    }\n\n    &:focus-within {\n      background-color: var(--theme-input--background--focus);\n      border-color: var(--theme-input--border-color--focus);\n      outline: 1px solid #119fff !important;\n      outline-offset: var(--theme-input--focus--outline-offset);\n    }\n  }\n\n  .select.readonly {\n    box-shadow: none !important;\n  }\n\n  .hidden {\n    display: none !important;\n  }\n\n  .trigger {\n    display: flex;\n    align-items: center;\n    flex-grow: 1;\n    height: 100%;\n  }\n\n  .input-container {\n    display: flex;\n    position: relative;\n    align-items: flex-start;\n    width: 100%;\n\n    .chips {\n      position: relative;\n      display: flex;\n      align-items: center;\n      flex-wrap: wrap;\n      height: 100%;\n      max-height: 3.5rem;\n      flex-grow: 1;\n      overflow-y: auto;\n\n      > ix-filter-chip {\n        margin: 0.1rem;\n      }\n    }\n\n    input {\n      @include ellipsis;\n      @include text-default;\n      background: transparent;\n      height: 1.75rem;\n      width: 100%;\n\n      &,\n      &:hover,\n      &:focus-visible {\n        border: none;\n        outline: none;\n      }\n\n      &::placeholder {\n        color: var(--theme-input-select-icon--color);\n      }\n\n      &.hide-placeholder::placeholder {\n        opacity: 0;\n      }\n    }\n  }\n\n  .chevron-down-container {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    min-width: 2rem;\n    height: 2rem;\n\n    @include hover {\n      color: var(--theme-color-dynamic--hover);\n    }\n\n    @include active {\n      color: var(--theme-color-dynamic--hover);\n    }\n  }\n\n  .editable {\n    .chevron-down-container {\n      @include hover {\n        color: var(--theme-color-std-text);\n        background-color: var(\n          --theme-btn-invisible-secondary--background--hover\n        );\n      }\n\n      @include active {\n        color: var(--theme-color-std-text);\n        background-color: var(\n          --theme-btn-invisible-secondary--background--active\n        );\n      }\n    }\n  }\n\n  .add-item {\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    position: relative;\n    width: 100%;\n  }\n\n  .select-list-header {\n    @include ellipsis;\n    display: flex;\n    align-items: center;\n    height: $default-control-height;\n    color: var(--theme-select-list-item-hint--color);\n    margin: 0 $small-space 0 $x-large-space;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { IxSelectItemLabelChangeEvent } from '../select-item/events';\n\n@Component({\n  tag: 'ix-select',\n  styleUrl: 'select.scss',\n  scoped: true,\n})\nexport class Select {\n  @Element() hostElement!: HTMLIxSelectElement;\n\n  /**\n   * Indices of selected items\n   * This corresponds to the value property of ix-select-items and therefor not neccessarily the indices of the items in the list.\n   */\n  @Prop({ mutable: true }) selectedIndices: string | string[] = [];\n\n  /**\n   * Show clear button\n   */\n  @Prop() allowClear = false;\n\n  /**\n   * Selection mode\n   */\n  @Prop() mode: 'single' | 'multiple' = 'single';\n\n  /**\n   * Select is extendable\n   */\n  @Prop() editable = false;\n\n  /**\n   * If true the select will be in disabled state\n   */\n  @Prop() disabled = false;\n\n  /**\n   * If true the select will be in readonly mode\n   */\n  @Prop() readonly = false;\n\n  /**\n   * Input field placeholder\n   */\n  @Prop() i18nPlaceholder = 'Select an option';\n\n  /**\n   * Input field placeholder for editable select\n   */\n  @Prop() i18nPlaceholderEditable = 'Type of select option';\n\n  /**\n   * Select list header\n   */\n  @Prop() i18nSelectListHeader = 'Please select an option';\n\n  /**\n   * Hint inside of dropdown if no items where found with current filter text\n   *\n   * @since 1.5.0\n   */\n  @Prop() i18nNoMatches = 'No matches';\n\n  /**\n   * Hide list header\n   *\n   * @since 1.5.0\n   @\n   */\n  @Prop() hideListHeader = false;\n\n  /**\n   * Item selection changed\n   */\n  @Event() itemSelectionChange: EventEmitter<string | string[]>;\n\n  /**\n   * Item added to selection\n   */\n  @Event() addItem: EventEmitter<string>;\n\n  @State() dropdownShow = false;\n  @State() value: string[];\n  @State() dropdownWrapperRef!: HTMLElement;\n  @State() dropdownAnchor!: HTMLElement;\n  @State() isDropdownEmpty = false;\n  @State() hasFocus = false;\n  @State() navigationItem: HTMLIxSelectItemElement;\n  @State() inputFilterText: string;\n  @State() inputValue: string;\n\n  private inputRef!: HTMLInputElement;\n  private dropdownRef!: HTMLIxDropdownElement;\n  private addItemRef!: HTMLDivElement;\n\n  private labelMutationObserver: MutationObserver;\n\n  get items() {\n    return Array.from(this.hostElement.querySelectorAll('ix-select-item'));\n  }\n\n  get selectedItems() {\n    return this.items.filter((item) => item.selected);\n  }\n\n  get addItemButton() {\n    return this.hostElement.querySelector('.add-item');\n  }\n\n  get isSingleMode() {\n    return this.mode === 'single';\n  }\n\n  get isMultipleMode() {\n    return this.mode === 'multiple';\n  }\n\n  get isEveryDropdownItemHidden() {\n    return this.items.every((item) => item.classList.contains('d-none'));\n  }\n\n  @Watch('selectedIndices')\n  watchSelectedIndices(newId: string | string[]) {\n    if (!newId) {\n      this.selectValue([]);\n      return;\n    }\n\n    if (Array.isArray(newId)) {\n      this.selectValue([...newId]);\n      return;\n    }\n\n    this.selectValue([newId]);\n  }\n\n  @Listen('itemClick')\n  onItemClicked(event: CustomEvent<string>) {\n    const newId = event.detail;\n    this.emitItemClick(newId);\n  }\n\n  private emitItemClick(newId: string) {\n    if (this.isMultipleMode && Array.isArray(this.selectedIndices)) {\n      if (this.selectedIndices.includes(newId)) {\n        this.selectedIndices = this.selectedIndices.filter((i) => i !== newId);\n      } else {\n        this.selectedIndices = [...this.selectedIndices, newId];\n      }\n    } else {\n      this.selectedIndices = [newId];\n    }\n\n    this.selectValue(this.selectedIndices);\n    this.itemSelectionChange.emit(this.selectedIndices);\n  }\n\n  private emitAddItem(value: string) {\n    if (value.trim() === '') {\n      return;\n    }\n\n    const newItem = document.createElement('ix-select-item');\n    newItem.value = value;\n    newItem.label = value;\n\n    this.addItemRef.appendChild(newItem);\n\n    this.clearInput();\n    this.emitItemClick(value);\n    this.addItem.emit(value);\n  }\n\n  private selectValue(ids: string[]) {\n    this.items.forEach((item) => {\n      item.selected = ids.some((i) => i === item.value);\n    });\n\n    this.value = this.selectedItems.map((item) => item.label);\n\n    if (this.isSingleMode) {\n      this.inputValue = this.value?.length ? this.value[0] : null;\n      return;\n    }\n\n    this.inputValue = null;\n  }\n\n  componentWillLoad() {\n    if (this.selectedIndices) {\n      this.selectValue(\n        Array.isArray(this.selectedIndices)\n          ? this.selectedIndices\n          : [this.selectedIndices]\n      );\n    }\n  }\n\n  @Listen('ix-select-item:labelChange')\n  onLabelChange(event: IxSelectItemLabelChangeEvent) {\n    event.preventDefault();\n    event.stopImmediatePropagation();\n    this.selectValue(\n      Array.isArray(this.selectedIndices)\n        ? this.selectedIndices\n        : [this.selectedIndices]\n    );\n  }\n\n  disconnectedCallback() {\n    if (this.labelMutationObserver) {\n      this.labelMutationObserver.disconnect();\n    }\n  }\n\n  private itemExists(item: string) {\n    return this.items.find((i) => i.label === item);\n  }\n\n  private dropdownVisibilityChanged(event: CustomEvent<boolean>) {\n    this.dropdownShow = event.detail;\n    this.hasFocus = event.detail;\n\n    if (event.detail) {\n      this.inputRef.focus();\n      this.inputRef.select();\n\n      this.removeHiddenFromItems();\n      this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n    } else {\n      this.navigationItem = undefined;\n    }\n  }\n\n  @Listen('keydown', {\n    target: 'window',\n  })\n  async onKeyDown(event: KeyboardEvent) {\n    if (!this.dropdownShow) {\n      return;\n    }\n\n    if (event.code === 'ArrowDown' || event.code === 'ArrowUp') {\n      this.onArrowNavigation(event);\n    }\n\n    if (event.code === 'Enter' || event.code === 'NumpadEnter') {\n      await this.onEnterNavigation();\n    }\n\n    if (event.code === 'Escape') {\n      this.dropdownShow = false;\n    }\n  }\n\n  private async onEnterNavigation() {\n    if (this.isMultipleMode) {\n      return;\n    }\n\n    if (this.editable && !this.itemExists(this.inputFilterText)) {\n      this.emitAddItem(this.inputFilterText);\n      this.navigationItem = this.items[this.items.length - 1];\n    }\n\n    this.navigationItem?.onItemClick();\n    await this.dropdownRef?.updatePosition();\n\n    if (this.isSingleMode && !this.editable) {\n      this.dropdownShow = false;\n    }\n  }\n\n  private onArrowNavigation(event: KeyboardEvent) {\n    event.stopPropagation();\n    event.preventDefault();\n\n    const focusItem = this.items.find(\n      (item) => document.activeElement === item.querySelector('button')\n    );\n    this.navigationItem = focusItem;\n\n    const selectItems = this.items.filter(\n      (i) => !i.classList.contains('d-none')\n    );\n\n    const index = selectItems.indexOf(this.navigationItem);\n\n    if (event.code === 'ArrowDown' && index < selectItems.length - 1) {\n      this.navigationItem = selectItems[index + 1];\n    } else if (event.code === 'ArrowUp' && index > 0) {\n      this.navigationItem = selectItems[index - 1];\n    }\n\n    this.setHoverEffectForNavigatedSelectItem();\n  }\n\n  private setHoverEffectForNavigatedSelectItem() {\n    this.navigationItem?.querySelector('button').focus();\n  }\n\n  private filterItemsWithTypeahead() {\n    this.inputFilterText = this.inputRef.value;\n\n    if (this.inputFilterText) {\n      this.items.forEach((item) => {\n        item.classList.remove('d-none');\n        if (\n          !item.label.toLowerCase().includes(this.inputFilterText.toLowerCase())\n        ) {\n          item.classList.add('d-none');\n        }\n      });\n    } else {\n      this.removeHiddenFromItems();\n    }\n\n    this.isDropdownEmpty = this.isEveryDropdownItemHidden;\n  }\n\n  private removeHiddenFromItems() {\n    this.items.forEach((item) => {\n      item.classList.remove('d-none');\n    });\n  }\n\n  private clearInput() {\n    this.inputRef.value = '';\n    this.inputFilterText = '';\n  }\n\n  private clear() {\n    this.clearInput();\n    this.value = [];\n    this.selectedIndices = [];\n    this.itemSelectionChange.emit(null);\n    this.dropdownShow = false;\n  }\n\n  private onInputBlur(e) {\n    if (this.editable) {\n      return;\n    }\n\n    if (this.isSingleMode) {\n      if (this.dropdownShow && this.isDropdownEmpty) {\n        this.dropdownShow = false;\n      }\n    }\n\n    if (!this.dropdownShow && this.mode !== 'multiple') {\n      e.target['value'] = this.value;\n    }\n  }\n\n  private placeholderValue() {\n    if (this.editable) {\n      return this.i18nPlaceholderEditable;\n    }\n\n    if (this.readonly) {\n      return '';\n    }\n\n    return this.i18nPlaceholder;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            'form-control': true,\n            select: true,\n            focus: this.hasFocus,\n            editable: this.editable,\n            disabled: this.disabled,\n            readonly: this.readonly,\n          }}\n          ref={(ref) => {\n            this.dropdownAnchor = ref;\n            if (!this.editable) this.dropdownWrapperRef = ref;\n          }}\n        >\n          <div class=\"input-container\">\n            <div class=\"chips\">\n              {this.isMultipleMode\n                ? this.selectedItems?.map((item) => (\n                    <ix-filter-chip\n                      disabled={this.disabled || this.readonly}\n                      key={item.value}\n                      onCloseClick={(e) => {\n                        e.preventDefault();\n                        e.stopPropagation();\n                        this.emitItemClick(item.value);\n                      }}\n                    >\n                      {item.label}\n                    </ix-filter-chip>\n                  ))\n                : ''}\n              <div class=\"trigger\">\n                <input\n                  data-testid=\"input\"\n                  disabled={this.disabled}\n                  readOnly={this.readonly}\n                  type=\"text\"\n                  class={{\n                    'allow-clear': this.allowClear && !!this.value?.length,\n                  }}\n                  placeholder={this.placeholderValue()}\n                  value={this.inputValue}\n                  ref={(ref) => (this.inputRef = ref)}\n                  onBlur={(e) => this.onInputBlur(e)}\n                  onInput={() => this.filterItemsWithTypeahead()}\n                />\n                {this.allowClear &&\n                (this.value?.length || this.inputFilterText) ? (\n                  <ix-icon-button\n                    class=\"clear\"\n                    icon=\"clear\"\n                    ghost\n                    oval\n                    size=\"16\"\n                    onClick={(e) => {\n                      e.preventDefault();\n                      e.stopPropagation();\n                      this.clear();\n                    }}\n                  />\n                ) : null}\n                {this.disabled || this.readonly ? null : (\n                  <div\n                    class=\"chevron-down-container\"\n                    ref={(ref) => {\n                      if (this.editable) this.dropdownWrapperRef = ref;\n                    }}\n                  >\n                    <ix-icon class=\"chevron\" name=\"chevron-down-small\" />\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n        <ix-dropdown\n          ref={(ref) => (this.dropdownRef = ref)}\n          show={this.dropdownShow}\n          closeBehavior={this.isMultipleMode ? 'outside' : 'both'}\n          class={{\n            'd-none': this.disabled || this.readonly,\n          }}\n          anchor={this.dropdownAnchor}\n          trigger={this.dropdownWrapperRef}\n          onShowChanged={(e) => this.dropdownVisibilityChanged(e)}\n          placement=\"auto-start\"\n          overwriteDropdownStyle={async () => {\n            return {\n              minWidth: `${this.hostElement.clientWidth}px`,\n            };\n          }}\n        >\n          <div\n            class={{\n              'select-list-header': true,\n              hidden: this.hideListHeader || this.isDropdownEmpty,\n            }}\n            title={this.i18nSelectListHeader}\n          >\n            {this.i18nSelectListHeader}\n          </div>\n          <slot></slot>\n          <div ref={(ref) => (this.addItemRef = ref)} class=\"d-contents\"></div>\n          {this.itemExists(this.inputFilterText) ? (\n            ''\n          ) : (\n            <ix-dropdown-item\n              data-testid=\"add-item\"\n              icon=\"plus\"\n              class={{\n                'add-item': true,\n                'd-none': !(this.editable && this.inputFilterText),\n              }}\n              label={this.inputFilterText}\n              onItemClick={(e) => {\n                e.preventDefault();\n                e.stopPropagation();\n                this.emitAddItem(this.inputFilterText);\n              }}\n            ></ix-dropdown-item>\n          )}\n          {this.isDropdownEmpty && !this.editable ? (\n            <div class=\"select-list-header\">{this.i18nNoMatches}</div>\n          ) : (\n            ''\n          )}\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nexport class IxSelectItemLabelChangeEvent extends CustomEvent<{\n  oldValue: string;\n  newValue: string;\n}> {\n  constructor(detail: { oldValue: string; newValue: string }) {\n    super('ix-select-item:labelChange', {\n      bubbles: true,\n      detail,\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: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 */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { IxSelectItemLabelChangeEvent } from './events';\n\n@Component({\n  tag: 'ix-select-item',\n  styleUrl: 'select-item.scss',\n  scoped: true,\n})\nexport class SelectItem {\n  @Element() hostElement: HTMLIxSelectItemElement;\n\n  /**\n   * Displayed name of the item\n   */\n  @Prop({ reflect: true }) label: string;\n\n  /**\n   * Item value\n   */\n  @Prop({ reflect: true }) value!: any;\n\n  /**\n   * Whether the item is selected.\n   */\n  @Prop() selected = false;\n\n  /**\n   * @internal\n   */\n  @Prop() hover = false;\n\n  /**\n   * Item clicked\n   */\n  @Event() itemClick: EventEmitter<string>;\n\n  /**\n   * @internal\n   * @param event\n   */\n  @Method()\n  async onItemClick(event?: CustomEvent<HTMLIxDropdownItemElement>) {\n    event?.preventDefault();\n    event?.stopPropagation();\n\n    this.itemClick.emit(this.value);\n  }\n\n  componentDidRender() {\n    if (!this.value) {\n      throw Error('ix-select-item must have a `value` property');\n    }\n  }\n\n  @Watch('label')\n  labelChange(newValue: string, oldValue: string) {\n    this.hostElement.dispatchEvent(\n      new IxSelectItemLabelChangeEvent({\n        newValue: newValue,\n        oldValue: oldValue,\n      })\n    );\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-dropdown-item\n          checked={this.selected}\n          label={this.label ? this.label : this.value}\n          onItemClick={(e) => this.onItemClick(e)}\n        ></ix-dropdown-item>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-import{r as e,c as i,h as t,H as a,g as n}from"./p-1c64b073.js";import{a as o}from"./p-810b5232.js";const s=".sc-ix-map-navigation-h{display:flex;position:relative;width:100%;height:100%}.sc-ix-map-navigation-h .map-nav.sc-ix-map-navigation{display:flex;margin-left:3.25rem;position:relative;height:100%;flex-grow:1;overflow:hidden}.sc-ix-map-navigation-h .map-nav-sidebar.sc-ix-map-navigation{display:flex;flex-direction:column;align-items:center;width:29.75rem;max-width:29.75rem;min-width:29.75rem;height:100%;left:4rem;background-color:var(--theme-map-navigation--background);-webkit-border-end:0.125rem solid var(--theme-map-navigation-separator--background);border-inline-end:0.125rem solid var(--theme-map-navigation-separator--background);z-index:99}.sc-ix-map-navigation-h .map-nav-sidebar-content.sc-ix-map-navigation{align-items:center;position:relative;overflow:auto;height:100%;width:100%}.sc-ix-map-navigation-h .map-nav-sidebar-content.sc-ix-map-navigation .map-nav-sidebar-static-content.sc-ix-map-navigation{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);display:flex;justify-content:space-between;margin-top:0.437rem;margin-bottom:0.812rem;margin-left:1rem;margin-right:1rem}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation{display:flex;position:relative;align-items:center;height:3.5rem;min-height:3.5rem;width:100%}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation .map-nav-header-brand.sc-ix-map-navigation{background-color:var(--theme-map-navigation-background);display:flex;align-items:center;height:100%;width:100%;padding:0 1rem;--theme-app-header--color:var(--theme-map-navigation-header--color);--theme-app-header-logo--color:var(--theme-map-navigation-logo--color)}.sc-ix-map-navigation-h .map-nav-header.sc-ix-map-navigation .map-nav-header-brand.sc-ix-map-navigation button.sc-ix-map-navigation{margin-left:1rem}.sc-ix-map-navigation-h .map-nav-header-content.sc-ix-map-navigation{display:flex;height:3.5rem;align-items:center;overflow:hidden;padding:0 1rem}.sc-ix-map-navigation-h .map-nav-header-content.sc-ix-map-navigation:empty{height:0}.sc-ix-map-navigation-h .map-nav-title.sc-ix-map-navigation{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);display:flex;align-items:center;flex-grow:1}.sc-ix-map-navigation-h .content.sc-ix-map-navigation{display:block;flex-grow:1;position:relative;height:100%;overflow:hidden;z-index:calc(var(--theme-z-index-sticky) - 1)}";const r=class{constructor(t){e(this,t);this.navigationToggled=i(this,"navigationToggled",7);this.contextMenuClick=i(this,"contextMenuClick",7);this.applicationName=undefined;this.navigationTitle=undefined;this.hideContextMenu=true;this.isSidebarOpen=true}get menu(){return this.hostElement.querySelector("ix-menu")}get menuOverlay(){return this.hostElement.querySelector("ix-menu-overlay")}get mapNavMenu(){return this.hostElement.querySelector(".map-nav-menu")}get sidebar(){return this.hostElement.querySelector(".map-nav-sidebar")}get overlay(){return this.hostElement.querySelector("#overlay")}componentDidRender(){this.appendMenu();this.closeOverlay()}appendMenu(){this.hostElement.querySelector("#menu-placeholder").appendChild(this.menu);this.menu.addEventListener("mapExpandChange",(e=>{const i=!e.detail;this.toggleSidebar(i)}));this.menu.enableMapExpand=true}async toggleSidebar(e){if(e!==undefined){this.isSidebarOpen=e}else{this.isSidebarOpen=!this.isSidebarOpen}if(this.isSidebarOpen){this.openSidebar()}else{this.closeSidebar()}this.navigationToggled.emit(this.isSidebarOpen);this.menu.toggleMapExpand(this.isSidebarOpen)}closeSidebar(){o({targets:this.sidebar,duration:r.defaultTime,marginLeft:[0,"-29.75rem"],opacity:[1,0],easing:"easeInSine",complete:()=>{this.sidebar.classList.add("d-none")}})}openSidebar(){o({targets:this.sidebar,duration:r.defaultTime,marginLeft:["-29.75rem",0],opacity:[0,1],easing:"easeOutSine",begin:()=>{this.sidebar.classList.remove("d-none")}})}async openOverlay(e,i,t,a){o({targets:this.overlay,duration:r.slowTime,backdropFilter:[0,"blur(1rem)"],translateX:["-4rem",0],opacity:[0,1],easing:"easeOutSine",begin:()=>{this.overlay.classList.remove("d-none")}});const n=document.createElement("ix-map-navigation-overlay");n.setAttribute("color",a);n.setAttribute("name",e);n.setAttribute("icon",t);n.setAttribute("slot","overlay");n.addEventListener("closeClick",(()=>this.closeOverlay()));n.appendChild(i);this.hostElement.appendChild(n)}async closeOverlay(){o({targets:this.overlay,duration:r.slowTime,backdropFilter:["blur(1rem)",0],translateX:[0,"-4rem"],opacity:[1,0],easing:"easeInSine",complete:()=>{var e;if(!this.overlay){return}(e=this.overlay.firstChild)===null||e===void 0?void 0:e.remove();this.overlay.classList.add("d-none")}})}render(){return t(a,null,t("div",{id:"menu-placeholder"}),t("div",{class:"map-nav"},t("div",{class:"map-nav-sidebar"},t("div",{class:"map-nav-header"},t("ix-application-header",{name:this.applicationName,class:"map-nav-header-brand"},t("slot",{name:"logo"}))),t("div",{class:"map-nav-sidebar-content"},t("div",{class:"map-nav-sidebar-static-content"},t("div",{class:"map-nav-title"},this.navigationTitle),this.hideContextMenu?"":t("ix-icon-button",{icon:"context-menu",ghost:true,size:"24",variant:"Secondary",onClick:e=>this.contextMenuClick.emit()})),t("div",{class:"map-nav-sidebar-user-content"},t("slot",{name:"sidebar-content"})))),t("div",{class:"content"},t("div",{class:"map-nav-header-content bg-2"},t("slot",{name:"content-header"})),t("main",null,t("slot",null),t("slot",{name:"overlay"})))))}get hostElement(){return n(this)}};r.defaultTime=150;r.slowTime=500;r.style=s;const l=".text-xs.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title.sc-ix-map-navigation-overlay{-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)}.text-default-title-single.sc-ix-map-navigation-overlay{-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.143em;color:var(--theme-color-std-text)}.text-l.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title.sc-ix-map-navigation-overlay{-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)}.text-l-title-single.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl.sc-ix-map-navigation-overlay{-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)}a.sc-ix-map-navigation-overlay{color:var(--theme-color-primary)}.sc-ix-map-navigation-overlay-h{position:absolute;width:100%;height:100%;z-index:2;top:0;left:0;background-color:var(--theme-overlay--background)}.sc-ix-map-navigation-overlay-h .overlay-header.sc-ix-map-navigation-overlay{display:flex;position:relative;justify-content:flex-start;align-items:center;height:3.5rem;background-color:var(--theme-overlay-header--background)}.sc-ix-map-navigation-overlay-h .overlay-header-content.sc-ix-map-navigation-overlay{display:flex;align-items:center;min-width:0}.sc-ix-map-navigation-overlay-h .overlay-header-content.sc-ix-map-navigation-overlay ix-icon.sc-ix-map-navigation-overlay{-webkit-margin-start:1rem;margin-inline-start:1rem;color:var(--theme-overlay-header--color)}.sc-ix-map-navigation-overlay-h .overlay-header-content.sc-ix-map-navigation-overlay .overlay-header-title.sc-ix-map-navigation-overlay{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-overlay-header--color);-webkit-margin-start:1rem;margin-inline-start:1rem}.sc-ix-map-navigation-overlay-h .color-indicator.sc-ix-map-navigation-overlay{display:inline-block;position:relative;width:0.5rem;height:100%;background-color:var(--theme-color-neutral)}.sc-ix-map-navigation-overlay-h .overlay-close.sc-ix-map-navigation-overlay{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:1rem;margin-inline-end:1rem}";const m=class{constructor(t){e(this,t);this.closeClick=i(this,"closeClick",7);this.name=undefined;this.icon=undefined;this.color=undefined}componentWillLoad(){o({targets:this.hostElement,duration:m.slowTime,backdropFilter:[0,"blur(1rem)"],translateX:["-4rem",0],opacity:[0,1],easing:"easeOutSine",begin:()=>{this.hostElement.classList.remove("d-none")}})}closeOverlay(){o({targets:this.hostElement,duration:m.slowTime,backdropFilter:["blur(1rem)",0],translateX:[0,"-4rem"],opacity:[1,0],easing:"easeInSine",complete:()=>{this.closeClick.emit();this.hostElement.classList.add("d-none")}})}render(){return t(a,null,t("div",{class:"overlay-header"},t("div",{class:{"color-indicator":true,"d-none":this.color==="undefined"||this.color===undefined},style:{"background-color":this.color?`var(--theme-${this.color})`:""}}),t("div",{class:"overlay-header-content"},t("ix-icon",{size:"32",name:this.icon}),t("span",{class:"overlay-header-title",title:this.name},this.name)),t("ix-icon-button",{class:"overlay-close",ghost:true,icon:"close",size:"24",onClick:()=>this.closeOverlay()})),t("slot",null))}get hostElement(){return n(this)}};m.slowTime=500;m.style=l;export{r as ix_map_navigation,m as ix_map_navigation_overlay};
-//# sourceMappingURL=p-cd75b455.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["mapNavigationCss","MapNavigation","menu","this","hostElement","querySelector","menuOverlay","mapNavMenu","sidebar","overlay","componentDidRender","appendMenu","closeOverlay","appendChild","addEventListener","event","state","detail","toggleSidebar","enableMapExpand","async","show","undefined","isSidebarOpen","openSidebar","closeSidebar","navigationToggled","emit","toggleMapExpand","anime","targets","duration","defaultTime","marginLeft","opacity","easing","complete","classList","add","begin","remove","name","component","icon","color","slowTime","backdropFilter","translateX","overlayInstance","document","createElement","setAttribute","_a","firstChild","render","h","Host","id","class","applicationName","navigationTitle","hideContextMenu","ghost","size","variant","onClick","_","contextMenuClick","mapNavigationOverlayCss","MapNavigationOverlay","componentWillLoad","closeClick","style","title"],"sources":["./src/components/map-navigation/map-navigation.scss?tag=ix-map-navigation&encapsulation=scoped","./src/components/map-navigation/map-navigation.tsx","./src/components/map-navigation-overlay/map-navigation-overlay.scss?tag=ix-map-navigation-overlay&encapsulation=scoped","./src/components/map-navigation-overlay/map-navigation-overlay.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/fonts';\n@import 'mixins/text-truncation';\n\n:host {\n  $appHeaderHeight: 3.5rem;\n  $appHeaderGradientHeight: 4rem;\n  $navHeaderHeight: 11.5rem;\n  $sidebarWidth: 29.75rem;\n\n  display: flex;\n  position: relative;\n  width: 100%;\n  height: 100%;\n\n  .map-nav {\n    display: flex;\n    margin-left: 3.25rem;\n    position: relative;\n    height: 100%;\n    flex-grow: 1;\n    overflow: hidden;\n  }\n\n  .map-nav-sidebar {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: $sidebarWidth;\n    max-width: $sidebarWidth;\n    min-width: $sidebarWidth;\n    height: 100%;\n    left: 4rem;\n    background-color: var(--theme-map-navigation--background);\n    border-inline-end: 0.125rem solid\n      var(--theme-map-navigation-separator--background);\n    z-index: 99;\n  }\n\n  .map-nav-sidebar-content {\n    align-items: center;\n    position: relative;\n    overflow: auto;\n    height: 100%;\n    width: 100%;\n\n    .map-nav-sidebar-static-content {\n      @include text-h2;\n      display: flex;\n      justify-content: space-between;\n      margin-top: 0.437rem;\n      margin-bottom: 0.812rem;\n      margin-left: $default-space;\n      margin-right: $default-space;\n    }\n  }\n\n  .map-nav-header {\n    display: flex;\n    position: relative;\n    align-items: center;\n    height: $appHeaderHeight;\n    min-height: $appHeaderHeight;\n    width: 100%;\n\n    .map-nav-header-brand {\n      background-color: var(--theme-map-navigation-background);\n      display: flex;\n      align-items: center;\n      height: 100%;\n      width: 100%;\n      padding: 0 $default-space;\n\n      --theme-app-header--color: var(--theme-map-navigation-header--color);\n      --theme-app-header-logo--color: var(--theme-map-navigation-logo--color);\n\n      button {\n        margin-left: $default-space;\n      }\n    }\n  }\n\n  .map-nav-header-content {\n    display: flex;\n    height: $appHeaderHeight;\n    align-items: center;\n    overflow: hidden;\n    padding: 0 $default-space;\n\n    &:empty {\n      height: 0;\n    }\n  }\n\n  .map-nav-title {\n    @include text-h2();\n\n    display: flex;\n    align-items: center;\n    flex-grow: 1;\n  }\n\n  .content {\n    display: block;\n    flex-grow: 1;\n    position: relative;\n    height: 100%;\n    overflow: hidden;\n    z-index: calc(var(--theme-z-index-sticky) - 1);\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n  tag: 'ix-map-navigation',\n  styleUrl: 'map-navigation.scss',\n  scoped: true,\n})\nexport class MapNavigation {\n  private static readonly defaultTime = 150;\n  private static readonly slowTime = 500;\n\n  @Element() hostElement: HTMLIxMapNavigationElement;\n\n  /**\n   * Application name\n   */\n  @Prop() applicationName: string;\n\n  /**\n   * Navigation title\n   */\n  @Prop() navigationTitle: string;\n\n  /**\n   * Hide the sidebar context menu button when set to true\n   */\n  @Prop() hideContextMenu = true;\n\n  @State() isSidebarOpen = true;\n\n  /**\n   * Navigation toggled\n   */\n  @Event() navigationToggled: EventEmitter<boolean>;\n\n  /**\n   * Context menu clicked\n   */\n  @Event() contextMenuClick: EventEmitter<void>;\n\n  get menu() {\n    return this.hostElement.querySelector('ix-menu');\n  }\n\n  get menuOverlay() {\n    return this.hostElement.querySelector('ix-menu-overlay');\n  }\n\n  get mapNavMenu() {\n    return this.hostElement.querySelector('.map-nav-menu');\n  }\n\n  get sidebar() {\n    return this.hostElement.querySelector('.map-nav-sidebar');\n  }\n\n  get overlay() {\n    return this.hostElement.querySelector('#overlay');\n  }\n\n  componentDidRender() {\n    this.appendMenu();\n    this.closeOverlay();\n  }\n\n  private appendMenu() {\n    this.hostElement.querySelector('#menu-placeholder').appendChild(this.menu);\n    this.menu.addEventListener(\n      'mapExpandChange',\n      (event: CustomEvent<boolean>) => {\n        const state = !event.detail;\n        this.toggleSidebar(state);\n      }\n    );\n    this.menu.enableMapExpand = true;\n  }\n\n  /**\n   * Change the visibility of the sidebar\n   *\n   * @param show new visibility state\n   * @since 1.6.0\n   */\n  @Method()\n  async toggleSidebar(show?: boolean) {\n    if (show !== undefined) {\n      this.isSidebarOpen = show;\n    } else {\n      this.isSidebarOpen = !this.isSidebarOpen;\n    }\n\n    if (this.isSidebarOpen) {\n      this.openSidebar();\n    } else {\n      this.closeSidebar();\n    }\n\n    this.navigationToggled.emit(this.isSidebarOpen);\n    this.menu.toggleMapExpand(this.isSidebarOpen);\n  }\n\n  private closeSidebar() {\n    anime({\n      targets: this.sidebar,\n      duration: MapNavigation.defaultTime,\n      marginLeft: [0, '-29.75rem'],\n      opacity: [1, 0],\n      easing: 'easeInSine',\n      complete: () => {\n        this.sidebar.classList.add('d-none');\n      },\n    });\n  }\n\n  private openSidebar() {\n    anime({\n      targets: this.sidebar,\n      duration: MapNavigation.defaultTime,\n      marginLeft: ['-29.75rem', 0],\n      opacity: [0, 1],\n      easing: 'easeOutSine',\n      begin: () => {\n        this.sidebar.classList.remove('d-none');\n      },\n    });\n  }\n\n  /**\n   * Open a overlay inside content area\n   * @deprecated Will be removed in 2.0.0. Use slot based approach\n   *\n   * @param name\n   * @param component\n   * @param icon\n   * @param color\n   */\n  @Method()\n  async openOverlay(\n    name: string,\n    component: HTMLElement,\n    icon?: string,\n    color?: string\n  ) {\n    anime({\n      targets: this.overlay,\n      duration: MapNavigation.slowTime,\n      backdropFilter: [0, 'blur(1rem)'],\n      translateX: ['-4rem', 0],\n      opacity: [0, 1],\n      easing: 'easeOutSine',\n      begin: () => {\n        this.overlay.classList.remove('d-none');\n      },\n    });\n\n    const overlayInstance = document.createElement('ix-map-navigation-overlay');\n    overlayInstance.setAttribute('color', color);\n    overlayInstance.setAttribute('name', name);\n    overlayInstance.setAttribute('icon', icon);\n    overlayInstance.setAttribute('slot', 'overlay');\n    overlayInstance.addEventListener('closeClick', () => this.closeOverlay());\n    overlayInstance.appendChild(component);\n    this.hostElement.appendChild(overlayInstance);\n  }\n\n  /**\n   * Close current shown overlay\n   * @deprecated Will be removed in 2.0.0. Use slot based approach\n   */\n  @Method()\n  async closeOverlay() {\n    anime({\n      targets: this.overlay,\n      duration: MapNavigation.slowTime,\n      backdropFilter: ['blur(1rem)', 0],\n      translateX: [0, '-4rem'],\n      opacity: [1, 0],\n      easing: 'easeInSine',\n      complete: () => {\n        if (!this.overlay) {\n          return;\n        }\n        this.overlay.firstChild?.remove();\n        this.overlay.classList.add('d-none');\n      },\n    });\n  }\n\n  render() {\n    return (\n      <Host>\n        <div id=\"menu-placeholder\"></div>\n        <div class=\"map-nav\">\n          <div class=\"map-nav-sidebar\">\n            <div class=\"map-nav-header\">\n              <ix-application-header\n                name={this.applicationName}\n                class=\"map-nav-header-brand\"\n              >\n                <slot name=\"logo\"></slot>\n              </ix-application-header>\n            </div>\n            <div class=\"map-nav-sidebar-content\">\n              <div class=\"map-nav-sidebar-static-content\">\n                <div class=\"map-nav-title\">{this.navigationTitle}</div>\n                {this.hideContextMenu ? (\n                  ''\n                ) : (\n                  <ix-icon-button\n                    icon=\"context-menu\"\n                    ghost\n                    size=\"24\"\n                    variant=\"Secondary\"\n                    onClick={(_) => this.contextMenuClick.emit()}\n                  ></ix-icon-button>\n                )}\n              </div>\n              <div class=\"map-nav-sidebar-user-content\">\n                <slot name=\"sidebar-content\"></slot>\n              </div>\n            </div>\n          </div>\n          <div class=\"content\">\n            <div class=\"map-nav-header-content bg-2\">\n              <slot name=\"content-header\"></slot>\n            </div>\n            <main>\n              <slot></slot>\n              <slot name=\"overlay\"></slot>\n            </main>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'common-variables';\n@import 'fonts';\n@import 'mixins/text-truncation';\n\n:host {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  z-index: 2;\n  top: 0;\n  left: 0;\n\n  background-color: var(--theme-overlay--background);\n\n  .overlay-header {\n    display: flex;\n    position: relative;\n    justify-content: flex-start;\n    align-items: center;\n    height: 3.5rem;\n\n    background-color: var(--theme-overlay-header--background);\n  }\n\n  .overlay-header-content {\n    display: flex;\n    align-items: center;\n    min-width: 0;\n\n    ix-icon {\n      margin-inline-start: $default-space;\n      color: var(--theme-overlay-header--color);\n    }\n\n    .overlay-header-title {\n      @include text-h2;\n      @include ellipsis;\n      color: var(--theme-overlay-header--color);\n      margin-inline-start: $default-space;\n    }\n  }\n\n  .color-indicator {\n    display: inline-block;\n    position: relative;\n    width: $small-space;\n    height: 100%;\n    background-color: var(--theme-color-neutral);\n  }\n\n  .overlay-close {\n    margin-inline-start: auto;\n    margin-inline-end: $default-space;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n  tag: 'ix-map-navigation-overlay',\n  styleUrl: 'map-navigation-overlay.scss',\n  scoped: true,\n})\nexport class MapNavigationOverlay {\n  private static readonly slowTime = 500;\n\n  @Element() hostElement: HTMLIxMapNavigationOverlayElement;\n\n  /**\n   * Title of overlay\n   */\n  @Prop() name: string;\n\n  /**\n   * Icon of overlay\n   */\n  @Prop() icon: string;\n\n  /**\n   * Color of icon\n   */\n  @Prop() color: string;\n\n  /**\n   * Event closed\n   */\n  @Event() closeClick: EventEmitter;\n\n  componentWillLoad() {\n    anime({\n      targets: this.hostElement,\n      duration: MapNavigationOverlay.slowTime,\n      backdropFilter: [0, 'blur(1rem)'],\n      translateX: ['-4rem', 0],\n      opacity: [0, 1],\n      easing: 'easeOutSine',\n      begin: () => {\n        this.hostElement.classList.remove('d-none');\n      },\n    });\n  }\n\n  private closeOverlay() {\n    anime({\n      targets: this.hostElement,\n      duration: MapNavigationOverlay.slowTime,\n      backdropFilter: ['blur(1rem)', 0],\n      translateX: [0, '-4rem'],\n      opacity: [1, 0],\n      easing: 'easeInSine',\n      complete: () => {\n        this.closeClick.emit();\n        this.hostElement.classList.add('d-none');\n      },\n    });\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"overlay-header\">\n          <div\n            class={{\n              'color-indicator': true,\n              'd-none': this.color === 'undefined' || this.color === undefined,\n            }}\n            style={{\n              'background-color': this.color\n                ? `var(--theme-${this.color})`\n                : '',\n            }}\n          ></div>\n          <div class=\"overlay-header-content\">\n            <ix-icon size=\"32\" name={this.icon}></ix-icon>\n            <span class=\"overlay-header-title\" title={this.name}>\n              {this.name}\n            </span>\n          </div>\n          <ix-icon-button\n            class=\"overlay-close\"\n            ghost\n            icon=\"close\"\n            size=\"24\"\n            onClick={() => this.closeOverlay()}\n          ></ix-icon-button>\n        </div>\n\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -1,2 +0,0 @@
-import{r as t,h as e,H as i,g as n}from"./p-1c64b073.js";const o=".sc-ix-group-context-menu-h{display:block;position:relative;-webkit-margin-before:0.3125rem;margin-block-start:0.3125rem;-webkit-margin-end:0.3125rem;margin-inline-end:0.3125rem;-webkit-margin-start:auto;margin-inline-start:auto}.sc-ix-group-context-menu-h ix-icon-button.sc-ix-group-context-menu::after{display:none}.sc-ix-group-context-menu-h .hide.sc-ix-group-context-menu{visibility:collapse}";const r=class{constructor(e){t(this,e);this.showContextMenu=false}get dropdownElement(){return this.host.querySelector("ix-dropdown")}get groupDropdownItem(){return this.host.querySelectorAll("ix-group-dropdown-item")}configureDropdown(t){this.dropdownElement.positioningStrategy="fixed";this.dropdownElement.trigger=t}componentWillRender(){this.showContextMenu=!!this.dropdownElement}render(){return e(i,null,e("ix-icon-button",{class:{hide:!this.showContextMenu},ref:t=>this.dropdownElement?this.configureDropdown(t):null,size:"24",ghost:true,icon:"context-menu"}),e("slot",null))}get host(){return n(this)}};r.style=o;export{r as ix_group_context_menu};
-//# sourceMappingURL=p-cf2717c1.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["groupContextMenuCss","GroupContextMenu","dropdownElement","this","host","querySelector","groupDropdownItem","querySelectorAll","configureDropdown","triggerElement","positioningStrategy","trigger","componentWillRender","showContextMenu","render","h","Host","class","hide","ref","size","ghost","icon"],"sources":["./src/components/group/group-context-menu.scss?tag=ix-group-context-menu&encapsulation=scoped","./src/components/group/group-context-menu.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:host {\n  display: block;\n  position: relative;\n  margin-block-start: 0.3125rem;\n  margin-inline-end: 0.3125rem;\n  margin-inline-start: auto;\n\n  ix-icon-button {\n    &::after {\n      display: none;\n    }\n  }\n\n  .hide {\n    visibility: collapse;\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';\n\n@Component({\n  tag: 'ix-group-context-menu',\n  styleUrl: './group-context-menu.scss',\n  scoped: true,\n})\nexport class GroupContextMenu {\n  @Element() host!: HTMLIxGroupContextMenuElement;\n\n  @State() showContextMenu = false;\n\n  get dropdownElement() {\n    return this.host.querySelector('ix-dropdown');\n  }\n\n  get groupDropdownItem() {\n    return this.host.querySelectorAll('ix-group-dropdown-item');\n  }\n\n  private configureDropdown(triggerElement: HTMLElement) {\n    this.dropdownElement.positioningStrategy = 'fixed';\n    this.dropdownElement.trigger = triggerElement;\n  }\n\n  componentWillRender() {\n    this.showContextMenu = !!this.dropdownElement;\n  }\n\n  render() {\n    return (\n      <Host>\n        <ix-icon-button\n          class={{ hide: !this.showContextMenu }}\n          ref={(ref) =>\n            this.dropdownElement ? this.configureDropdown(ref) : null\n          }\n          size=\"24\"\n          ghost={true}\n          icon=\"context-menu\"\n        ></ix-icon-button>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAsB,+Y,MCgBfC,EAAgB,M,8CAGA,K,CAEvBC,sBACF,OAAOC,KAAKC,KAAKC,cAAc,c,CAG7BC,wBACF,OAAOH,KAAKC,KAAKG,iBAAiB,yB,CAG5BC,kBAAkBC,GACxBN,KAAKD,gBAAgBQ,oBAAsB,QAC3CP,KAAKD,gBAAgBS,QAAUF,C,CAGjCG,sBACET,KAAKU,kBAAoBV,KAAKD,e,CAGhCY,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,kBACEE,MAAO,CAAEC,MAAOf,KAAKU,iBACrBM,IAAMA,GACJhB,KAAKD,gBAAkBC,KAAKK,kBAAkBW,GAAO,KAEvDC,KAAK,KACLC,MAAO,KACPC,KAAK,iBAEPP,EAAA,a"}

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

@@ -1,2 +0,0 @@
-import{r as e,c as i,h as a,H as s,g as l}from"./p-1c64b073.js";import{U as t}from"./p-076c29d1.js";const o=".sc-ix-upload-h{display:block;min-height:4rem;height:4rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload{display:flex;flex-direction:row;align-items:center;justify-content:space-between;overflow:hidden;height:100%;width:100%;padding:1rem;border:1px dashed var(--theme-upload--border-color);border-radius:var(--theme-upload--border-radius);color:var(--theme-upload-text--color)}.sc-ix-upload-h .file-upload-area.multiline.sc-ix-upload{max-height:unset;height:auto}.sc-ix-upload-h .file-upload-area.multiline.sc-ix-upload .glyph.sc-ix-upload{align-self:flex-start;-webkit-margin-before:3px;margin-block-start:3px}.sc-ix-upload-h .file-upload-area.multiline.sc-ix-upload>div.sc-ix-upload{align-self:flex-start}.sc-ix-upload-h .file-upload-area.sc-ix-upload:not(.multiline) .state.sc-ix-upload,.sc-ix-upload-h .file-upload-area.sc-ix-upload:not(.multiline) .upload-text.sc-ix-upload{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-upload-h .file-upload-area.file-over.sc-ix-upload{border-color:var(--theme-upload--border-color--dragover);border-style:solid}.sc-ix-upload-h .file-upload-area.checking.sc-ix-upload{color:var(--theme-upload-text--color--checking);border-style:solid}.sc-ix-upload-h .file-upload-area.disabled.sc-ix-upload{border-style:solid;color:var(--theme-upload-text--color--disabled)}.sc-ix-upload-h .file-upload-area.sc-ix-upload ix-button.sc-ix-upload{-webkit-margin-start:1rem;margin-inline-start:1rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload .upload-browser.sc-ix-upload{opacity:0;overflow:hidden;position:absolute;z-index:-1}.sc-ix-upload-h .file-upload-area.sc-ix-upload .loader.sc-ix-upload{margin:2.187rem auto;font-size:0.937rem;width:1rem;height:1rem;border-radius:50%;position:relative;text-indent:-9999em;animation:optimise-loading 1.1s infinite ease;transform:translateZ(0)}.sc-ix-upload-h .file-upload-area.sc-ix-upload .upload-filename.sc-ix-upload{margin-bottom:1rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload{display:flex;align-items:center}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload>ix-spinner.sc-ix-upload{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem;height:1.5rem;width:1.5rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload>i.sc-ix-upload{-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload>i.glyph-error.sc-ix-upload{color:var(--theme-color-alarm)}.sc-ix-upload-h .file-upload-area.sc-ix-upload .state.sc-ix-upload>i.glyph-success.sc-ix-upload{color:var(--theme-color-success)}";const r=class{get inputElement(){return this.hostElement.querySelector("#upload-browser")}constructor(a){e(this,a);this.filesChanged=i(this,"filesChanged",7);this.accept=undefined;this.multiple=false;this.multiline=false;this.disabled=false;this.state=t.SELECT_FILE;this.selectFileText="+ Drag files here or…";this.loadingText="Checking files…";this.uploadFailedText="Upload failed. Please try again.";this.uploadSuccessText="Upload successful";this.i18nUploadFile="Upload file…";this.i18nUploadDisabled="File upload currently not possible.";this.isFileOver=false}fileDropped(e){e.preventDefault();const i=e.dataTransfer.files;this.isFileOver=false;this.filesToUpload=this.convertToFileArray(i);this.filesChanged.emit(this.filesToUpload)}fileOver(e){e.preventDefault();e.dataTransfer.dropEffect="move";if(!this.multiple&&e.dataTransfer.items.length>1){e.preventDefault();e.stopPropagation();e.dataTransfer.effectAllowed="none";e.dataTransfer.dropEffect="none"}else{this.isFileOver=true}}fileLeave(){this.isFileOver=false}fileChangeEvent(e){this.filesToUpload=this.convertToFileArray(e.target.files);this.filesChanged.emit(this.filesToUpload);this.inputElement.type="";this.inputElement.type="file"}convertToFileArray(e){let i=[];if(e instanceof FileList){i=Array.from(e)}else{i=[e]}return i}renderUploadState(){if(this.disabled){return a("span",{class:"state"},a("span",{class:"upload-text"},this.i18nUploadDisabled))}switch(this.state){case t.SELECT_FILE:return a("span",{class:"state"},a("span",{class:"upload-text"},this.selectFileText));case t.LOADING:return a("span",{class:"state"},a("ix-spinner",{variant:"primary"}),a("span",{class:"upload-text"},this.loadingText));case t.UPLOAD_FAILED:return a("span",{class:"state"},a("i",{class:"glyph glyph-error"}),a("span",{class:"upload-text"},this.uploadFailedText));case t.UPLOAD_SUCCESSED:return a("span",{class:"state"},a("i",{class:"glyph glyph-success"}),a("span",{class:"upload-text"},this.uploadSuccessText));default:return""}}async setFilesToUpload(e){this.filesToUpload=e}render(){return a(s,null,a("div",{class:{"file-upload-area":true,"file-over":this.isFileOver,checking:this.state===t.LOADING,disabled:this.disabled,multiline:this.multiline},onDrop:e=>this.fileDropped(e),onDragOver:e=>this.fileOver(e),onDragLeave:()=>this.fileLeave(),draggable:!this.disabled},this.renderUploadState(),a("div",null,a("input",{multiple:this.multiple,type:"file",class:"upload-browser",id:"upload-browser",onChange:e=>{this.fileChangeEvent(e)},accept:this.accept}),a("ix-button",{tabindex:"-1",outline:true,onClick:()=>this.inputElement.click(),disabled:this.disabled||this.state===t.LOADING},this.i18nUploadFile))))}get hostElement(){return l(this)}};r.style=o;export{r as ix_upload};
-//# sourceMappingURL=p-d5302336.entry.js.map