@siemens/ix 3.0.0-alpha.4 → 3.0.0

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

@@ -0,0 +1 @@
+{"version":3,"names":["paneLayoutCss","Panes","constructor","hostRef","this","layout","variant","borderless","isMobile","paneElements","panes","currentPanes","hostElement","querySelectorAll","componentWillLoad","length","observer","MutationObserver","mutations","_a","addedNodes","item","nodeName","_b","removedNodes","observe","childList","matchBreakpoint","applicationLayoutService","onChange","on","componentDidLoad","setPanes","disconnectedCallback","disconnect","setPaneVariant","pane","ignoreLayoutSettings","setPaneBorder","hasVisibleLeftPane","find","slot","hideOnCollapse","composition","setPaneZIndex","isTop","isBottom","isLeft","isRight","zIndex","style","toString","forEach","push","floating","closeFloatingPanes","expanded","configurePanes","topCount","bottomCount","leftCount","rightCount","forceUpdate","onSlotChanged","onCollapsibleChanged","event","detail","currentSlot","onVariantChanged","onPaneElementsChange","onVariableChange","onBorderChange","onLayoutChange","onMobileChange","hasPadding","hasPaddingMobile","slotExists","isFloating","render","h","Host","key","class","row","name","col","onClick","minHeight","display"],"sources":["src/components/pane-layout/pane-layout.scss?tag=ix-pane-layout&encapsulation=shadow","src/components/pane-layout/pane-layout.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/shadow-dom/component';\n\n@mixin set-padding($composition) {\n  @if $composition {\n    padding-#{$composition}: 2.5rem;\n  }\n}\n\n@mixin set-absolute($composition) {\n  @if $composition {\n    position: absolute;\n    #{$composition}: 0;\n  }\n}\n\n:host {\n  @include ix-component;\n  display: flex;\n  position: relative;\n  width: 100%;\n  height: 100%;\n\n  .side-panes-wrapper {\n    height: 100%;\n    width: 100%;\n  }\n\n  .row {\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    position: relative;\n  }\n\n  .col {\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    position: relative;\n  }\n\n  .content {\n    width: 100%;\n    height: 100%;\n    overflow: auto;\n  }\n\n  .absolute-top {\n    width: 100%;\n    @include set-absolute(top);\n  }\n\n  .absolute-bottom {\n    width: 100%;\n    @include set-absolute(bottom);\n  }\n\n  .absolute-left {\n    height: 100%;\n    @include set-absolute(left);\n  }\n\n  .absolute-right {\n    height: 100%;\n    @include set-absolute(right);\n  }\n\n  .padding-top {\n    @include set-padding(top);\n  }\n\n  .padding-bottom {\n    @include set-padding(bottom);\n  }\n\n  .padding-left {\n    @include set-padding(left);\n  }\n\n  .padding-right {\n    @include set-padding(right);\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  forceUpdate,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { Composition } from '../pane/pane';\nimport { applicationLayoutService } from '../utils/application-layout';\nimport { matchBreakpoint } from '../utils/breakpoints';\n\n@Component({\n  tag: 'ix-pane-layout',\n  styleUrl: 'pane-layout.scss',\n  shadow: true,\n})\nexport class Panes {\n  @Element() hostElement!: HTMLIxPaneLayoutElement;\n\n  /**\n   * Choose the layout of the panes.\n   * When set to 'full-vertical' the vertical panes (left, right) will get the full height.\n   * When set to 'full-horizontal' the horizontal panes (top, bottom) will get the full width.\n   */\n  @Prop() layout: 'full-vertical' | 'full-horizontal' = 'full-vertical';\n\n  /**\n   * Set the default variant for all panes in the layout\n   */\n  @Prop() variant: 'floating' | 'inline' = 'inline';\n\n  /**\n   * Set the default border state for all panes in the layout\n   */\n  @Prop() borderless: boolean = false;\n\n  @State() private isMobile = false;\n  @State() private paneElements = 0;\n\n  private panes: Array<{\n    slot: string;\n    hideOnCollapse: boolean;\n    floating: boolean;\n  }> = [];\n\n  private observer?: MutationObserver;\n\n  get currentPanes() {\n    return this.hostElement.querySelectorAll('ix-pane');\n  }\n\n  componentWillLoad() {\n    this.paneElements = this.currentPanes.length;\n\n    this.observer = new MutationObserver((mutations) => {\n      if (mutations[0].addedNodes.item(0)?.nodeName === 'IX-PANE') {\n        this.paneElements += 1;\n      } else if (mutations[0].removedNodes.item(0)?.nodeName === 'IX-PANE') {\n        this.paneElements -= 1;\n      }\n    });\n    this.observer.observe(this.hostElement, {\n      childList: true,\n    });\n\n    this.isMobile = matchBreakpoint('sm');\n    applicationLayoutService.onChange.on(() => {\n      this.isMobile = matchBreakpoint('sm');\n    });\n  }\n\n  componentDidLoad() {\n    this.setPanes(this.currentPanes);\n  }\n\n  disconnectedCallback() {\n    this.observer?.disconnect();\n  }\n\n  private setPaneVariant(pane: HTMLIxPaneElement) {\n    if (!pane.ignoreLayoutSettings) {\n      pane.variant = this.variant;\n    }\n  }\n\n  private setPaneBorder(pane: HTMLIxPaneElement) {\n    if (!pane.ignoreLayoutSettings) {\n      if (this.borderless) {\n        pane.borderless = true;\n      } else {\n        const hasVisibleLeftPane = !!this.panes.find(\n          (pane) => pane.slot === 'left' && !pane.hideOnCollapse\n        );\n        if (\n          pane.variant === 'floating' &&\n          this.layout === 'full-vertical' &&\n          hasVisibleLeftPane &&\n          (pane.composition === 'top' || pane.composition === 'bottom')\n        ) {\n          pane.borderless = true;\n        } else {\n          pane.borderless = false;\n        }\n      }\n    }\n  }\n\n  private setPaneZIndex(pane: HTMLIxPaneElement) {\n    const isTop = pane.slot === 'top';\n    const isBottom = pane.slot === 'bottom';\n    const isLeft = pane.slot === 'left';\n    const isRight = pane.slot === 'right';\n\n    let zIndex = 1;\n    if (this.isMobile) {\n      if (isBottom || isTop) {\n        zIndex = 3;\n      }\n    } else {\n      if (this.layout === 'full-vertical') {\n        if (isLeft || isRight) {\n          zIndex = 3;\n        }\n      } else {\n        if (isBottom || isTop) {\n          zIndex = 3;\n        }\n      }\n    }\n    pane.style.zIndex = zIndex.toString();\n  }\n\n  private setPanes(panes: NodeListOf<HTMLIxPaneElement>) {\n    this.panes = [];\n    panes.forEach((pane) => {\n      this.panes.push({\n        slot: pane.slot,\n        hideOnCollapse: pane.hideOnCollapse,\n        floating: pane.variant === 'floating',\n      });\n    });\n  }\n\n  private closeFloatingPanes() {\n    this.currentPanes.forEach((pane) => {\n      if (pane.expanded && pane.variant === 'floating') {\n        pane.expanded = false;\n      }\n    });\n  }\n\n  private configurePanes() {\n    let topCount = 0;\n    let bottomCount = 0;\n    let leftCount = 0;\n    let rightCount = 0;\n\n    this.currentPanes.forEach((pane) => {\n      const isTop = pane.slot === 'top';\n      const isBottom = pane.slot === 'bottom';\n      const isLeft = pane.slot === 'left';\n      const isRight = pane.slot === 'right';\n\n      if (isLeft) {\n        if (leftCount) {\n          pane.slot = '';\n          return;\n        }\n        leftCount++;\n      } else if (isRight) {\n        if (rightCount) {\n          pane.slot = '';\n          return;\n        }\n        rightCount++;\n      } else if (isTop) {\n        if (topCount) {\n          pane.slot = '';\n          return;\n        }\n        topCount++;\n      } else if (isBottom) {\n        if (bottomCount) {\n          pane.slot = '';\n          return;\n        }\n        bottomCount++;\n      } else {\n        pane.slot = '';\n        return;\n      }\n\n      this.setPaneVariant(pane);\n      this.setPaneBorder(pane);\n      this.setPaneZIndex(pane);\n    });\n\n    this.setPanes(this.currentPanes);\n    forceUpdate(this.hostElement);\n  }\n\n  @Listen('slotChanged')\n  onSlotChanged() {\n    this.configurePanes();\n  }\n\n  @Listen('hideOnCollapseChanged')\n  onCollapsibleChanged(event: CustomEvent) {\n    const { slot, hideOnCollapse } = event.detail;\n\n    this.panes.forEach((currentSlot) => {\n      if (currentSlot.slot === slot) {\n        currentSlot.hideOnCollapse = hideOnCollapse;\n      }\n    });\n\n    forceUpdate(this.hostElement);\n  }\n\n  @Listen('variantChanged')\n  onVariantChanged(event: CustomEvent) {\n    const { slot, variant } = event.detail;\n\n    this.panes.forEach((currentSlot) => {\n      if (currentSlot.slot === slot) {\n        currentSlot.floating = variant === 'floating';\n      }\n    });\n\n    forceUpdate(this.hostElement);\n  }\n\n  @Watch('paneElements')\n  onPaneElementsChange() {\n    this.configurePanes();\n  }\n\n  @Watch('variant')\n  onVariableChange() {\n    this.currentPanes.forEach((pane) => {\n      this.setPaneVariant(pane);\n      this.setPaneBorder(pane);\n    });\n\n    this.setPanes(this.currentPanes);\n    forceUpdate(this.hostElement);\n  }\n\n  @Watch('borderless')\n  onBorderChange() {\n    this.currentPanes.forEach((pane) => {\n      this.setPaneBorder(pane);\n    });\n  }\n\n  @Watch('layout')\n  onLayoutChange() {\n    this.currentPanes.forEach((pane) => {\n      this.setPaneBorder(pane);\n      this.setPaneZIndex(pane);\n    });\n  }\n\n  @Watch('isMobile')\n  onMobileChange() {\n    this.currentPanes.forEach((pane) => {\n      this.setPaneZIndex(pane);\n    });\n  }\n\n  private hasPadding(composition: Composition) {\n    const pane = this.panes.find((pane) => pane.slot === composition);\n    return pane ? !pane.hideOnCollapse && pane.floating : false;\n  }\n\n  private hasPaddingMobile(composition: Composition) {\n    const pane = this.panes.find((pane) => pane.slot === composition);\n    return pane && !pane.hideOnCollapse;\n  }\n\n  private slotExists(composition: Composition) {\n    const pane = this.panes.find((pane) => pane.slot === composition);\n    return !!pane;\n  }\n\n  private isFloating(composition: Composition) {\n    const pane = this.panes.find((pane) => pane.slot === composition);\n    return pane ? pane.floating : false;\n  }\n\n  render() {\n    return (\n      <Host>\n        {!this.isMobile ? (\n          this.layout == 'full-vertical' ? (\n            <div class=\"side-panes-wrapper\">\n              <div\n                class={{\n                  row: true,\n                  'padding-left': this.hasPadding('left'),\n                  'padding-right': this.hasPadding('right'),\n                }}\n              >\n                <div\n                  key=\"left\"\n                  class={{ 'absolute-left': this.isFloating('left') }}\n                >\n                  <slot name=\"left\"></slot>\n                </div>\n                <div\n                  class={{\n                    col: true,\n                    'padding-top': this.hasPadding('top'),\n                    'padding-bottom': this.hasPadding('bottom'),\n                  }}\n                >\n                  <div\n                    key=\"top\"\n                    class={{ 'absolute-top': this.isFloating('top') }}\n                  >\n                    <slot name=\"top\"></slot>\n                  </div>\n                  <div\n                    key=\"content\"\n                    class=\"content\"\n                    onClick={() => this.closeFloatingPanes()}\n                  >\n                    <slot name=\"content\"></slot>\n                    <slot></slot>\n                  </div>\n                  <div\n                    key=\"bottom\"\n                    class={{ 'absolute-bottom': this.isFloating('bottom') }}\n                  >\n                    <slot name=\"bottom\"></slot>\n                  </div>\n                </div>\n                <div\n                  key=\"right\"\n                  class={{ 'absolute-right': this.isFloating('right') }}\n                >\n                  <slot name=\"right\"></slot>\n                </div>\n              </div>\n            </div>\n          ) : (\n            <div class=\"side-panes-wrapper\">\n              <div\n                class={{\n                  col: true,\n                  'padding-top': this.hasPadding('top'),\n                  'padding-bottom': this.hasPadding('bottom'),\n                }}\n              >\n                <div\n                  key=\"top\"\n                  class={{ 'absolute-top': this.isFloating('top') }}\n                >\n                  <slot name=\"top\"></slot>\n                </div>\n                <div\n                  class={{\n                    row: true,\n                    'padding-left': this.hasPadding('left'),\n                    'padding-right': this.hasPadding('right'),\n                  }}\n                >\n                  <div\n                    key=\"left\"\n                    class={{ 'absolute-left': this.isFloating('left') }}\n                  >\n                    <slot name=\"left\"></slot>\n                  </div>\n                  <div\n                    key=\"content\"\n                    class=\"content\"\n                    onClick={() => this.closeFloatingPanes()}\n                  >\n                    <slot name=\"content\"></slot>\n                    <slot></slot>\n                  </div>\n                  <div\n                    key=\"right\"\n                    class={{ 'absolute-right': this.isFloating('right') }}\n                  >\n                    <slot name=\"right\"></slot>\n                  </div>\n                </div>\n                <div\n                  key=\"bottom\"\n                  class={{ 'absolute-bottom': this.isFloating('bottom') }}\n                >\n                  <slot name=\"bottom\"></slot>\n                </div>\n              </div>\n            </div>\n          )\n        ) : (\n          <div class=\"col\">\n            <div\n              key=\"top\"\n              style={{\n                minHeight: this.hasPaddingMobile('top') ? '48px' : '0',\n                display: this.slotExists('top') ? 'block' : 'none',\n              }}\n            >\n              <slot name=\"top\"></slot>\n            </div>\n            <div\n              key=\"left\"\n              style={{\n                minHeight: this.hasPaddingMobile('left') ? '48px' : '0',\n                display: this.slotExists('left') ? 'block' : 'none',\n              }}\n            >\n              <slot name=\"left\"></slot>\n            </div>\n            <div\n              key=\"content\"\n              class=\"content\"\n              onClick={() => this.closeFloatingPanes()}\n            >\n              <slot name=\"content\"></slot>\n              <slot></slot>\n            </div>\n            <div\n              key=\"right\"\n              style={{\n                minHeight: this.hasPaddingMobile('right') ? '48px' : '0',\n                display: this.slotExists('right') ? 'block' : 'none',\n              }}\n            >\n              <slot name=\"right\"></slot>\n            </div>\n            <div\n              key=\"bottom\"\n              style={{\n                minHeight: this.hasPaddingMobile('bottom') ? '48px' : '0',\n                display: this.slotExists('bottom') ? 'block' : 'none',\n              }}\n            >\n              <slot name=\"bottom\"></slot>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as s,H as e,g as n}from"./p-BNpBEtDH.js";import{r as o}from"./p-UQa1aROL.js";import{d as h}from"./p-D3K9vmFp.js";const r=t=>!Number.isNaN(Number(t));const c=(t,i)=>{t.classList.add(i)};class d{static create(t,i=d.defaultConfig){return new d(t,i)}static mergeStyle(t,i){for(let s in i){if(t.style[s]!==i[s]){t.style[s]=i[s]}}}static getMaxBrowserHeight(){const t=document.createElement("div");const i=document.createElement("div");d.mergeStyle(t,{position:"absolute",height:"1px",opacity:0});d.mergeStyle(i,{height:"1e7px"});t.appendChild(i);document.body.appendChild(t);const s=i.offsetHeight;document.body.removeChild(t);return s}constructor(t,i){this._lastRepaint=null;this._maxElementHeight=d.getMaxBrowserHeight();this.refresh(t,i);const s=this._config;const e=()=>{const t=this._getScrollPosition();const i=this._lastRepaint;this._renderAnimationFrame=window.requestAnimationFrame(e);if(t===i){return}const n=i?t-i:0;if(!i||n<0||n>this._averageHeight){let i=this._renderChunk();this._lastRepaint=t;if(i!==false&&typeof s.afterRender==="function"){s.afterRender()}}};e()}destroy(){window.cancelAnimationFrame(this._renderAnimationFrame)}refresh(t,i=d.defaultConfig){this._config=i;if(!t||t.nodeType!==1){throw new Error("HyperList requires a valid DOM Node container")}this._element=t;const s=this._config;const e=this._scroller||s.scroller||document.createElement(s.scrollerTagName||"tr");if(typeof s.useFragment!=="boolean"){this._config.useFragment=true}if(!s.generate){throw new Error("Missing required `generate` function")}if(!r(s.total)){throw new Error("Invalid required `total` value, expected number")}if(!Array.isArray(s.itemHeight)&&!r(s.itemHeight)){throw new Error(`\n        Invalid required \`itemHeight\` value, expected number or array\n      `.trim())}else if(r(s.itemHeight)){this._itemHeights=Array(s.total).fill(s.itemHeight)}else{this._itemHeights=[s.itemHeight]}Object.keys(d.defaultConfig).filter((t=>t in s)).forEach((t=>{const i=s[t];const e=r(i);if(i&&typeof i!=="string"&&typeof i!=="number"){let i=`Invalid optional \`${t}\`, expected string or number`;throw new Error(i)}else if(e){s[t]=`${i}px`}}));const n=Boolean(s.horizontal);const o=s[n?"width":"height"];if(o){const t=r(o);const i=t?false:o.slice(-1)==="%";const s=t?parseInt(o,10):parseInt(o.replace(/px|%/,""),10);const e=window[n?"innerWidth":"innerHeight"];if(i){this._containerSize=e*s/100}else{this._containerSize=r(o)?o:s}}const h=s.scrollContainer;const c=s.itemHeight*s.total;const l=this._maxElementHeight;if(c>l){console.warn(["HyperList: The maximum element height",l+"px has","been exceeded; please reduce your item height."].join(" "))}const a={width:`${s.width}`,height:h?`${c}px`:`${s.height}`,overflow:h?"none":"auto",position:"relative"};d.mergeStyle(t,a);if(h){d.mergeStyle(s.scrollContainer,{overflow:"auto"})}const f={opacity:"0",position:"absolute",[n?"height":"width"]:"1px",[n?"width":"height"]:`${c}px`};d.mergeStyle(e,f);if(!this._scroller){t.appendChild(e)}const u=this._computeScrollPadding();this._scrollPaddingBottom=u.bottom;this._scrollPaddingTop=u.top;this._scroller=e;this._scrollHeight=this._computeScrollHeight();this._itemPositions=this._itemPositions||Array(s.total).fill(0);this._computePositions(0);this._renderChunk(this._lastRepaint!==null);if(typeof s.afterRender==="function"){s.afterRender()}}_getRow(t){const i=this._config;let s=i.generate(t);let e=s.height;if(e!==undefined&&r(e)){s=s.element;if(e!==this._itemHeights[t]){this._itemHeights[t]=e;this._computePositions(t);this._scrollHeight=this._computeScrollHeight()}}else{e=this._itemHeights[t]}if(!s||s.nodeType!==1){throw new Error(`Generator did not return a DOM Node for index: ${t}`)}c(s,i.rowClassName||"vrow");const n=this._itemPositions[t]+this._scrollPaddingTop;d.mergeStyle(s,{position:"absolute",[i.horizontal?"left":"top"]:`${n}px`});return s}_getScrollPosition(){const t=this._config;if(typeof t.overrideScrollPosition==="function"){return t.overrideScrollPosition()}return this._element[t.horizontal?"scrollLeft":"scrollTop"]}_renderChunk(t=false){const i=this._config;const s=this._element;const e=this._getScrollPosition();const n=i.total;let o=this._getFrom(e)-1;if(o<0||o-this._screenItemsLen<0){o=0}if(!t&&this._lastFrom===o){return false}this._lastFrom=o;let h=o+this._cachedItemsLen;if(h>n||h+this._cachedItemsLen>n){h=n}const r=i.useFragment?document.createDocumentFragment():[];const c=this._scroller;r[i.useFragment?"appendChild":"push"](c);for(let t=o;t<h;t++){let s=this._getRow(t);r[i.useFragment?"appendChild":"push"](s)}if(i.applyPatch){return i.applyPatch(s,r)}s.innerHTML="";s.appendChild(r)}_computePositions(t=1){const i=this._config;const s=i.total;if(t<1){t=1}for(let i=t;i<s;i++){this._itemPositions[i]=this._itemHeights[i-1]+this._itemPositions[i-1]}}_computeScrollHeight(){const t=this._config;const i=Boolean(t.horizontal);const s=t.total;const e=this._itemHeights.reduce(((t,i)=>t+i),0)+this._scrollPaddingBottom+this._scrollPaddingTop;d.mergeStyle(this._scroller,{opacity:0,position:"absolute",top:"0px",[i?"height":"width"]:"1px",[i?"width":"height"]:`${e}px`});const n=this._itemHeights.slice(0).sort(((t,i)=>t-i));const o=Math.floor(s/2);const h=s%2===0?(n[o]+n[o-1])/2:n[o];const r=i?"clientWidth":"clientHeight";const c=t.scrollContainer?t.scrollContainer:this._element;const l=c[r]?c[r]:this._containerSize;this._screenItemsLen=Math.ceil(l/h);this._containerSize=l;this._cachedItemsLen=Math.max(this._cachedItemsLen||0,this._screenItemsLen*3);this._averageHeight=h;return e}_computeScrollPadding(){const t=this._config;const i=Boolean(t.horizontal);const s=window.getComputedStyle(this._element);const e=t=>{const i=s.getPropertyValue(`padding-${t}`);return parseInt(i,10)||0};if(i){return{bottom:e("right"),top:e("left")}}else{return{bottom:e("bottom"),top:e("top")}}}_getFrom(t){let i=0;while(this._itemPositions[i]<t){i++}return i}}d.defaultConfig={width:"100%",height:"100%"};const l=":host{display:block}";const a=class{constructor(s){t(this,s);this.contextChange=i(this,"contextChange",7);this.nodeToggled=i(this,"nodeToggled",7);this.nodeClicked=i(this,"nodeClicked",7);this.nodeRemoved=i(this,"nodeRemoved",7);this.model={};this.context={};this.updates=new Map;this.hasFirstRender=false}updatePadding(t,i){t.style.paddingLeft=i.level+"rem"}getVirtualizerOptions(){const t=this.buildTreeList(this.model[this.root]);return{width:"100%",height:"100%",itemHeight:32,total:t.length,generate:i=>{const s=t[i];const e=this.hostElement.querySelector(`[data-tree-node-id="${s.id}"]`);const n=this.getContext(s.id);if(e){e.hasChildren=s.hasChildren;e.context=Object.assign({},n);if(this.updates.has(s.id)){const t=this.updates.get(s.id);if(t){t(s,Object.assign({},this.context))}}this.updatePadding(e,s);return e}const h=t=>{this.updates.set(s.id,t)};let r=null;if(this.renderItem){r=this.renderItem(i,s,t,Object.assign({},this.context),h)}if(r===null){r=o(s,n,h)}const c=r;c.setAttribute("data-tree-node-id",s.id);c.style.paddingRight="1rem";this.updatePadding(c,s);return c}}}setContext(t,i){this.context=Object.assign(Object.assign({},this.context),{[t]:i});this.contextChange.emit(this.context)}getContext(t){if(!this.context){return{isExpanded:false,isSelected:false}}if(!this.context[t]){this.context[t]={isExpanded:false,isSelected:false}}return this.context[t]}buildTreeList(t,i=0){const s=[];if(t===null||t===void 0?void 0:t.hasChildren){const e=i+1;t.children.forEach((t=>{const n=this.model[t];const o=this.getContext(t);s.push(Object.assign(Object.assign({},n),{level:i}));if(n.hasChildren&&o.isExpanded){s.push(...this.buildTreeList(n,e))}}))}return s}componentDidLoad(){this.initList();this.observer=new MutationObserver((t=>{let i=[];t.forEach((t=>{i=[...i,...Array.from(t.removedNodes)];t.addedNodes.forEach((t=>{const s=i.indexOf(t);if(s>=0){i.splice(s,1)}}))}));this.nodeRemoved.emit(i)}));this.observer.observe(this.hostElement,{childList:true})}componentWillRender(){this.hasFirstRender=true;if(this.isListInitialized()){this.refreshList()}else{this.initList()}}connectedCallback(){if(this.hasFirstRender){this.initList()}}disconnectedCallback(){var t,i;(t=this.hyperlist)===null||t===void 0?void 0:t.destroy();(i=this.observer)===null||i===void 0?void 0:i.disconnect()}modelChange(){if(this.hasFirstRender&&!this.isListInitialized()){this.initList()}}isListInitialized(){var t;const i=(t=this.hyperlist)===null||t===void 0?void 0:t._itemPositions;return i!==undefined&&i.length&&!(i===null||i===void 0?void 0:i.some((t=>t===undefined||Number.isNaN(t))))}refreshList(){if(this.hyperlist){this.hyperlist.refresh(this.hostElement,this.getVirtualizerOptions())}}initList(){var t;if(!this.model){return}(t=this.hyperlist)===null||t===void 0?void 0:t.destroy();const i=this.getVirtualizerOptions();this.hyperlist=new d(this.hostElement,i)}onToggle(t){const{target:i}=t;t.preventDefault();t.stopPropagation();if(!(i instanceof HTMLElement)){return}const s=i.getAttribute("data-tree-node-id");if(!s){return}const e=this.model[s];if(!e.hasChildren){return}const n=this.getContext(s);n.isExpanded=!n.isExpanded;this.nodeToggled.emit({id:s,isExpanded:n.isExpanded});this.setContext(s,n)}onTreeItemClick(t){const{target:i}=t;if(!(i instanceof HTMLElement)){return}const s=i.getAttribute("data-tree-node-id");if(!s){return}const e=this.model[s];const n=t.composedPath();const o=n.indexOf(this.hostElement);const r=n.slice(0,o);const c=h.pathIncludesTrigger(r);if(c){return}if(!t.defaultPrevented){Object.values(this.context).forEach((t=>t.isSelected=false));const t=this.getContext(s);t.isSelected=true;this.setContext(s,t)}if(this.toggleOnItemClick&&e.hasChildren){const t=this.getContext(s);t.isExpanded=!t.isExpanded;this.nodeToggled.emit({id:s,isExpanded:t.isExpanded});this.setContext(s,t)}this.nodeClicked.emit(s)}render(){return s(e,{key:"334ea5dcb9482db02edbde78d1129e34b4c10988",onClick:t=>this.onTreeItemClick(t)},s("slot",{key:"672d437ccefd8e58cef11ac61c166bf3e51369ba"}))}get hostElement(){return n(this)}static get watchers(){return{model:["modelChange"]}}};a.style=l;export{a as ix_tree};
+//# sourceMappingURL=p-d6caa4f4.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["isNumber","input","Number","isNaN","addClass","element","className","classList","add","VirtualList","create","userProvidedConfig","defaultConfig","mergeStyle","style","i","getMaxBrowserHeight","wrapper","document","createElement","fixture","position","height","opacity","appendChild","body","maxElementHeight","offsetHeight","removeChild","constructor","this","_lastRepaint","_maxElementHeight","refresh","config","_config","render","scrollTop","_getScrollPosition","lastRepaint","_renderAnimationFrame","window","requestAnimationFrame","diff","_averageHeight","rendered","_renderChunk","afterRender","destroy","cancelAnimationFrame","nodeType","Error","_element","scroller","_scroller","scrollerTagName","useFragment","generate","total","Array","isArray","itemHeight","trim","_itemHeights","fill","Object","keys","filter","prop","forEach","value","isValueNumber","msg","isHorizontal","Boolean","horizontal","isValuePercent","slice","numberValue","parseInt","replace","innerSize","_containerSize","scrollContainer","scrollerHeight","console","warn","join","elementStyle","width","overflow","scrollerStyle","padding","_computeScrollPadding","_scrollPaddingBottom","bottom","_scrollPaddingTop","top","_scrollHeight","_computeScrollHeight","_itemPositions","_computePositions","_getRow","item","undefined","rowClassName","overrideScrollPosition","force","from","_getFrom","_screenItemsLen","_lastFrom","to","_cachedItemsLen","fragment","createDocumentFragment","row","applyPatch","innerHTML","scrollHeight","reduce","a","b","sortedItemHeights","sort","middle","Math","floor","averageHeight","clientProp","containerHeight","ceil","max","isHoriz","styles","getComputedStyle","location","cssValue","getPropertyValue","treeCss","Tree","hostRef","model","context","updates","Map","hasFirstRender","updatePadding","paddingLeft","level","getVirtualizerOptions","list","buildTreeList","root","length","index","renderedTreeItem","hostElement","querySelector","id","getContext","hasChildren","assign","has","doUpdate","get","update","callback","set","innerElement","renderItem","renderDefaultItem","el","setAttribute","paddingRight","setContext","contextChange","emit","isExpanded","isSelected","itemList","newLevel","children","push","componentDidLoad","initList","observer","MutationObserver","records","removed","record","removedNodes","addedNodes","an","indexOf","splice","nodeRemoved","observe","childList","componentWillRender","isListInitialized","refreshList","connectedCallback","disconnectedCallback","_a","hyperlist","_b","disconnect","modelChange","itemPositions","some","onToggle","event","target","preventDefault","stopPropagation","HTMLElement","getAttribute","nodeToggled","onTreeItemClick","path","composedPath","treeIndex","treePath","hasTrigger","dropdownController","pathIncludesTrigger","defaultPrevented","values","c","toggleOnItemClick","nodeClicked","h","Host","key","onClick"],"sources":["src/components/utils/lazy-list/lazy.ts","src/components/tree/tree.css?tag=ix-tree&encapsulation=shadow","src/components/tree/tree.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n// Manually forked from https://github.com/tbranyen/hyperlist to remove\n// features a direct document calls\n//\n// Hyperlist is licensed MIT. https://github.com/tbranyen/hyperlist\n\nexport type VirtualListConfig = {\n  applyPatch?: (\n    element: HTMLElement,\n    fragment: DocumentFragment | DocumentFragment[]\n  ) => void;\n  overrideScrollPosition?: () => void;\n  rowClassName?: string;\n  scrollContainer?: HTMLElement;\n  width: string;\n  height: string;\n  afterRender?: () => void;\n  scrollerTagName?: string;\n  scroller?: HTMLElement;\n  useFragment?: boolean;\n  generate?: (index: number) => HTMLElement;\n  total?: number;\n  itemHeight?: number;\n  horizontal?: boolean;\n};\n\nconst isNumber = (input: unknown) => !Number.isNaN(Number(input));\n\nconst addClass = (element: HTMLElement, className: string) => {\n  element.classList.add(className);\n};\n\nexport class VirtualList {\n  _config!: VirtualListConfig;\n  _lastRepaint: null;\n  _maxElementHeight: number;\n  _renderAnimationFrame!: number;\n  _averageHeight!: number;\n\n  static readonly defaultConfig: VirtualListConfig = {\n    width: '100%',\n    height: '100%',\n  };\n  _element: any;\n  _scroller: any;\n  _itemHeights!: number[];\n  _containerSize!: number | string;\n  _scrollPaddingBottom!: number;\n  _scrollPaddingTop!: number;\n  _scrollHeight: any;\n  _itemPositions: any;\n  _screenItemsLen!: number;\n  _lastFrom!: number;\n  _cachedItemsLen: any;\n\n  static create(\n    element: HTMLElement,\n    userProvidedConfig: VirtualListConfig = VirtualList.defaultConfig\n  ) {\n    return new VirtualList(element, userProvidedConfig);\n  }\n\n  static mergeStyle(element: HTMLElement, style: any) {\n    for (let i in style) {\n      if (element.style[i as any] !== style[i]) {\n        element.style[i as any] = style[i];\n      }\n    }\n  }\n\n  static getMaxBrowserHeight() {\n    // Create two elements, the wrapper is `1px` tall and is transparent and\n    // positioned at the top of the page. Inside that is an element that gets\n    // set to 1 billion pixels. Then reads the max height the browser can\n    // calculate.\n    const wrapper = document.createElement('div');\n    const fixture = document.createElement('div');\n\n    // As said above, these values get set to put the fixture elements into the\n    // right visual state.\n    VirtualList.mergeStyle(wrapper, {\n      position: 'absolute',\n      height: '1px',\n      opacity: 0,\n    });\n    VirtualList.mergeStyle(fixture, { height: '1e7px' });\n\n    // Add the fixture into the wrapper element.\n    wrapper.appendChild(fixture);\n\n    // Apply to the page, the values won't kick in unless this is attached.\n    document.body.appendChild(wrapper);\n\n    // Get the maximum element height in pixels.\n    const maxElementHeight = fixture.offsetHeight;\n\n    // Remove the element immediately after reading the value.\n    document.body.removeChild(wrapper);\n\n    return maxElementHeight;\n  }\n\n  constructor(element: HTMLElement, userProvidedConfig: VirtualListConfig) {\n    this._lastRepaint = null;\n    this._maxElementHeight = VirtualList.getMaxBrowserHeight();\n\n    this.refresh(element, userProvidedConfig);\n\n    const config = this._config;\n\n    // Create internal render loop.\n    const render = () => {\n      const scrollTop = this._getScrollPosition();\n      const lastRepaint = this._lastRepaint;\n\n      this._renderAnimationFrame = window.requestAnimationFrame(render);\n\n      if (scrollTop === lastRepaint) {\n        return;\n      }\n\n      const diff = lastRepaint ? scrollTop - lastRepaint : 0;\n      if (!lastRepaint || diff < 0 || diff > this._averageHeight) {\n        let rendered = this._renderChunk();\n\n        this._lastRepaint = scrollTop;\n\n        if (rendered !== false && typeof config.afterRender === 'function') {\n          config.afterRender();\n        }\n      }\n    };\n\n    render();\n  }\n\n  destroy() {\n    window.cancelAnimationFrame(this._renderAnimationFrame);\n  }\n\n  refresh(\n    element: HTMLElement,\n    userProvidedConfig: VirtualListConfig = VirtualList.defaultConfig\n  ) {\n    this._config = userProvidedConfig;\n\n    if (!element || element.nodeType !== 1) {\n      throw new Error('HyperList requires a valid DOM Node container');\n    }\n\n    this._element = element;\n\n    const config = this._config as any;\n\n    const scroller =\n      this._scroller ||\n      config.scroller ||\n      document.createElement(config.scrollerTagName || 'tr');\n\n    // Default configuration option `useFragment` to `true`.\n    if (typeof config.useFragment !== 'boolean') {\n      this._config.useFragment = true;\n    }\n\n    if (!config.generate) {\n      throw new Error('Missing required `generate` function');\n    }\n\n    if (!isNumber(config.total)) {\n      throw new Error('Invalid required `total` value, expected number');\n    }\n\n    if (!Array.isArray(config.itemHeight) && !isNumber(config.itemHeight)) {\n      throw new Error(\n        `\n        Invalid required \\`itemHeight\\` value, expected number or array\n      `.trim()\n      );\n    } else if (isNumber(config.itemHeight)) {\n      this._itemHeights = Array(config.total).fill(config.itemHeight);\n    } else {\n      this._itemHeights = [config.itemHeight as any];\n    }\n\n    // Width and height should be coerced to string representations. Either in\n    // `%` or `px`.\n    Object.keys(VirtualList.defaultConfig)\n      .filter((prop) => prop in config)\n      .forEach((prop) => {\n        const value = config[prop as any];\n        const isValueNumber = isNumber(value);\n\n        if (value && typeof value !== 'string' && typeof value !== 'number') {\n          let msg = `Invalid optional \\`${prop}\\`, expected string or number`;\n          throw new Error(msg);\n        } else if (isValueNumber) {\n          config[prop] = `${value}px`;\n        }\n      });\n\n    const isHorizontal = Boolean(config.horizontal);\n    const value = config[isHorizontal ? 'width' : 'height'];\n\n    if (value) {\n      const isValueNumber = isNumber(value);\n      const isValuePercent = isValueNumber ? false : value.slice(-1) === '%';\n      // Compute the containerHeight as number\n      const numberValue = isValueNumber\n        ? parseInt(value, 10)\n        : parseInt(value.replace(/px|%/, ''), 10);\n      const innerSize = window[isHorizontal ? 'innerWidth' : 'innerHeight'];\n\n      if (isValuePercent) {\n        this._containerSize = (innerSize * numberValue) / 100;\n      } else {\n        this._containerSize = isNumber(value) ? value : numberValue;\n      }\n    }\n\n    const scrollContainer = config.scrollContainer;\n    const scrollerHeight = config.itemHeight * config.total;\n    const maxElementHeight = this._maxElementHeight;\n\n    if (scrollerHeight > maxElementHeight) {\n      console.warn(\n        [\n          'HyperList: The maximum element height',\n          maxElementHeight + 'px has',\n          'been exceeded; please reduce your item height.',\n        ].join(' ')\n      );\n    }\n\n    // Decorate the container element with styles that will match\n    // the user supplied configuration.\n    const elementStyle = {\n      width: `${config.width}`,\n      height: scrollContainer ? `${scrollerHeight}px` : `${config.height}`,\n      overflow: scrollContainer ? 'none' : 'auto',\n      position: 'relative',\n    };\n\n    VirtualList.mergeStyle(element, elementStyle);\n\n    if (scrollContainer) {\n      VirtualList.mergeStyle(config.scrollContainer, { overflow: 'auto' });\n    }\n\n    const scrollerStyle = {\n      opacity: '0',\n      position: 'absolute',\n      [isHorizontal ? 'height' : 'width']: '1px',\n      [isHorizontal ? 'width' : 'height']: `${scrollerHeight}px`,\n    };\n\n    VirtualList.mergeStyle(scroller, scrollerStyle);\n\n    // Only append the scroller element once.\n    if (!this._scroller) {\n      element.appendChild(scroller);\n    }\n\n    const padding = this._computeScrollPadding();\n    this._scrollPaddingBottom = padding.bottom;\n    this._scrollPaddingTop = padding.top;\n\n    // Set the scroller instance.\n    this._scroller = scroller;\n    this._scrollHeight = this._computeScrollHeight();\n\n    // Reuse the item positions if refreshed, otherwise set to empty array.\n    this._itemPositions = this._itemPositions || Array(config.total).fill(0);\n\n    // Each index in the array should represent the position in the DOM.\n    this._computePositions(0);\n\n    // Render after refreshing. Force render if we're calling refresh manually.\n    this._renderChunk(this._lastRepaint !== null);\n\n    if (typeof config.afterRender === 'function') {\n      config.afterRender();\n    }\n  }\n\n  _getRow(i: number) {\n    const config = this._config as any;\n    let item = config.generate(i) as any;\n    let height = item.height;\n\n    if (height !== undefined && isNumber(height)) {\n      item = item.element;\n\n      // The height isn't the same as predicted, compute positions again\n      if (height !== this._itemHeights[i]) {\n        this._itemHeights[i] = height;\n        this._computePositions(i);\n        this._scrollHeight = this._computeScrollHeight();\n      }\n    } else {\n      height = this._itemHeights[i];\n    }\n\n    if (!item || item.nodeType !== 1) {\n      throw new Error(`Generator did not return a DOM Node for index: ${i}`);\n    }\n\n    addClass(item, config.rowClassName || 'vrow');\n\n    const top = this._itemPositions[i] + this._scrollPaddingTop;\n\n    VirtualList.mergeStyle(item, {\n      position: 'absolute',\n      [config.horizontal ? 'left' : 'top']: `${top}px`,\n    });\n\n    return item;\n  }\n\n  _getScrollPosition() {\n    const config = this._config;\n\n    if (typeof config.overrideScrollPosition === 'function') {\n      return config.overrideScrollPosition();\n    }\n\n    return this._element[config.horizontal ? 'scrollLeft' : 'scrollTop'];\n  }\n\n  _renderChunk(force: boolean = false) {\n    const config = this._config;\n    const element = this._element;\n    const scrollTop = this._getScrollPosition();\n    const total: number = config.total!;\n\n    let from = this._getFrom(scrollTop) - 1;\n\n    if (from < 0 || from - this._screenItemsLen < 0) {\n      from = 0;\n    }\n\n    if (!force && this._lastFrom === from) {\n      return false;\n    }\n\n    this._lastFrom = from;\n\n    let to = from + this._cachedItemsLen;\n\n    if (to > total || to + this._cachedItemsLen > total) {\n      to = total;\n    }\n\n    // Append all the new rows in a document fragment that we will later append\n    // to the parent node\n    const fragment: any = config.useFragment\n      ? document.createDocumentFragment()\n      : [\n          // Sometimes you'll pass fake elements to this tool and Fragments require\n          // real elements.\n        ];\n\n    // The element that forces the container to scroll.\n    const scroller = this._scroller;\n\n    // Keep the scroller in the list of children.\n    fragment[config.useFragment ? 'appendChild' : 'push'](scroller);\n\n    for (let i = from; i < to; i++) {\n      let row = this._getRow(i);\n\n      fragment[config.useFragment ? 'appendChild' : 'push'](row);\n    }\n\n    if (config.applyPatch) {\n      return config.applyPatch(element, fragment);\n    }\n\n    element.innerHTML = '';\n    element.appendChild(fragment);\n  }\n\n  _computePositions(from = 1) {\n    const config = this._config;\n    const total = config.total!;\n\n    if (from < 1) {\n      from = 1;\n    }\n\n    for (let i = from; i < total; i++) {\n      this._itemPositions[i] =\n        this._itemHeights[i - 1] + this._itemPositions[i - 1];\n    }\n  }\n\n  _computeScrollHeight() {\n    const config = this._config as any;\n    const isHorizontal = Boolean(config.horizontal);\n    const total = config.total;\n    const scrollHeight =\n      this._itemHeights.reduce((a, b) => a + b, 0) +\n      this._scrollPaddingBottom +\n      this._scrollPaddingTop;\n\n    VirtualList.mergeStyle(this._scroller, {\n      opacity: 0,\n      position: 'absolute',\n      top: '0px',\n      [isHorizontal ? 'height' : 'width']: '1px',\n      [isHorizontal ? 'width' : 'height']: `${scrollHeight}px`,\n    });\n\n    // Calculate the height median\n    const sortedItemHeights = this._itemHeights.slice(0).sort((a, b) => a - b);\n    const middle = Math.floor(total / 2);\n    const averageHeight =\n      total % 2 === 0\n        ? (sortedItemHeights[middle] + sortedItemHeights[middle - 1]) / 2\n        : sortedItemHeights[middle];\n\n    const clientProp = isHorizontal ? 'clientWidth' : 'clientHeight';\n    const element = config.scrollContainer\n      ? config.scrollContainer\n      : this._element;\n    const containerHeight = element[clientProp]\n      ? element[clientProp]\n      : this._containerSize;\n    this._screenItemsLen = Math.ceil(containerHeight / averageHeight);\n    this._containerSize = containerHeight;\n\n    // Cache 3 times the number of items that fit in the container viewport.\n    this._cachedItemsLen = Math.max(\n      this._cachedItemsLen || 0,\n      this._screenItemsLen * 3\n    );\n    this._averageHeight = averageHeight;\n\n    return scrollHeight;\n  }\n\n  _computeScrollPadding() {\n    const config = this._config;\n    const isHoriz = Boolean(config.horizontal);\n    const styles = window.getComputedStyle(this._element);\n\n    const padding = (location: string) => {\n      const cssValue = styles.getPropertyValue(`padding-${location}`);\n      return parseInt(cssValue, 10) || 0;\n    };\n\n    if (isHoriz) {\n      return {\n        bottom: padding('right'),\n        top: padding('left'),\n      };\n    } else {\n      return {\n        bottom: padding('bottom'),\n        top: padding('top'),\n      };\n    }\n  }\n\n  _getFrom(scrollTop: number) {\n    let i = 0;\n\n    while (this._itemPositions[i] < scrollTop) {\n      i++;\n    }\n\n    return i;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n  display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport { VirtualList, VirtualListConfig } from './../utils/lazy-list';\nimport { renderDefaultItem } from '../tree-item/default-tree-item';\nimport {\n  TreeContext,\n  TreeItem,\n  TreeItemContext,\n  TreeItemVisual,\n  TreeModel,\n  UpdateCallback,\n} from './tree-model';\nimport { dropdownController } from '../dropdown/dropdown-controller';\n\n@Component({\n  tag: 'ix-tree',\n  styleUrl: 'tree.css',\n  shadow: true,\n})\nexport class Tree {\n  @Element() hostElement!: HTMLIxTreeElement;\n\n  /**\n   * Initial root element will not be rendered\n   */\n  @Prop() root!: string;\n\n  /**\n   * Tree model\n   */\n  @Prop() model: TreeModel<any> = {};\n\n  /**\n   * Render function of tree items\n   */\n  @Prop() renderItem?: <T = any>(\n    index: number,\n    data: T,\n    dataList: Array<T>,\n    context: TreeContext,\n    update: (callback: UpdateCallback) => void\n  ) => HTMLElement;\n\n  /**\n   * Selection and collapsed state management\n   */\n  @Prop({ mutable: true }) context: TreeContext = {};\n\n  /**\n   * Enable to toggle items by click on the item\n   * @since 3.0.0\n   */\n  @Prop() toggleOnItemClick?: boolean;\n\n  /**\n   * Context changed\n   */\n  @Event() contextChange!: EventEmitter<TreeContext>;\n\n  /**\n   * Node toggled event\n   */\n  @Event() nodeToggled!: EventEmitter<{ id: string; isExpanded: boolean }>;\n\n  /**\n   * Node clicked event\n   */\n  @Event() nodeClicked!: EventEmitter<string>;\n\n  /**\n   * Emits removed nodes\n   */\n  @Event() nodeRemoved!: EventEmitter<any>;\n\n  private hyperlist?: VirtualList;\n\n  private readonly updates = new Map<string, UpdateCallback>();\n  private observer!: MutationObserver;\n  private hasFirstRender = false;\n\n  private updatePadding(element: HTMLElement, item: TreeItemVisual<unknown>) {\n    element.style.paddingLeft = item.level + 'rem';\n  }\n\n  private getVirtualizerOptions(): VirtualListConfig {\n    const list = this.buildTreeList(this.model[this.root]);\n\n    return {\n      width: '100%',\n      height: '100%',\n      itemHeight: 32,\n      total: list.length,\n      generate: (index: number) => {\n        const item = list[index];\n\n        const renderedTreeItem = this.hostElement.querySelector(\n          `[data-tree-node-id=\"${item.id}\"]`\n        ) as HTMLIxTreeItemElement;\n\n        const context = this.getContext(item.id);\n\n        if (renderedTreeItem) {\n          renderedTreeItem.hasChildren = item.hasChildren;\n          renderedTreeItem.context = { ...context };\n\n          if (this.updates.has(item.id)) {\n            const doUpdate = this.updates.get(item.id);\n\n            if (doUpdate) {\n              doUpdate(item, { ...this.context });\n            }\n          }\n\n          this.updatePadding(renderedTreeItem, item);\n          return renderedTreeItem;\n        }\n\n        const update = (callback: UpdateCallback) => {\n          this.updates.set(item.id, callback);\n        };\n\n        let innerElement: HTMLElement | null = null;\n        if (this.renderItem) {\n          innerElement = this.renderItem(\n            index,\n            item,\n            list,\n            { ...this.context },\n            update\n          );\n        }\n\n        if (innerElement === null) {\n          innerElement = renderDefaultItem(item, context, update);\n        }\n\n        const el = innerElement;\n        el.setAttribute('data-tree-node-id', item.id);\n        el.style.paddingRight = '1rem';\n        this.updatePadding(el, item);\n\n        return el;\n      },\n    };\n  }\n\n  private setContext(id: string, context: TreeItemContext) {\n    this.context = {\n      ...this.context,\n      [id]: context,\n    };\n\n    this.contextChange.emit(this.context);\n  }\n\n  private getContext(id: string): TreeItemContext {\n    if (!this.context) {\n      return {\n        isExpanded: false,\n        isSelected: false,\n      };\n    }\n    if (!this.context[id]) {\n      this.context[id] = {\n        isExpanded: false,\n        isSelected: false,\n      };\n    }\n    return this.context[id];\n  }\n\n  private buildTreeList(\n    root: TreeItem<any>,\n    level: number = 0\n  ): TreeItemVisual<any>[] {\n    const itemList: TreeItemVisual<any>[] = [];\n\n    if (root?.hasChildren) {\n      const newLevel = level + 1;\n      root.children.forEach((id: string) => {\n        const item = this.model[id];\n        const context = this.getContext(id);\n        itemList.push({ ...item, level });\n        if (item.hasChildren && context.isExpanded) {\n          itemList.push(...this.buildTreeList(item, newLevel));\n        }\n      });\n    }\n\n    return itemList;\n  }\n\n  componentDidLoad() {\n    this.initList();\n\n    this.observer = new MutationObserver((records) => {\n      let removed: unknown[] = [];\n\n      records.forEach((record) => {\n        removed = [...removed, ...Array.from(record.removedNodes)];\n\n        record.addedNodes.forEach((an) => {\n          const index = removed.indexOf(an);\n          if (index >= 0) {\n            removed.splice(index, 1);\n          }\n        });\n      });\n\n      this.nodeRemoved.emit(removed);\n    });\n\n    this.observer.observe(this.hostElement, {\n      childList: true,\n    });\n  }\n\n  componentWillRender() {\n    this.hasFirstRender = true;\n\n    if (this.isListInitialized()) {\n      this.refreshList();\n    } else {\n      this.initList();\n    }\n  }\n\n  connectedCallback() {\n    if (this.hasFirstRender) {\n      this.initList();\n    }\n  }\n\n  disconnectedCallback() {\n    this.hyperlist?.destroy();\n    this.observer?.disconnect();\n  }\n\n  @Watch('model')\n  modelChange() {\n    if (this.hasFirstRender && !this.isListInitialized()) {\n      this.initList();\n    }\n  }\n\n  private isListInitialized() {\n    //@ts-ignore\n    const itemPositions = this.hyperlist?._itemPositions;\n\n    return (\n      itemPositions !== undefined &&\n      itemPositions.length &&\n      !itemPositions?.some(\n        (item: number) => item === undefined || Number.isNaN(item)\n      )\n    );\n  }\n\n  private refreshList() {\n    if (this.hyperlist) {\n      this.hyperlist.refresh(this.hostElement, this.getVirtualizerOptions());\n    }\n  }\n\n  private initList() {\n    if (!this.model) {\n      return;\n    }\n\n    this.hyperlist?.destroy();\n    const config = this.getVirtualizerOptions();\n    this.hyperlist = new VirtualList(this.hostElement, config);\n  }\n\n  @Listen('toggle')\n  onToggle(event: CustomEvent) {\n    const { target } = event;\n    event.preventDefault();\n    event.stopPropagation();\n\n    if (!(target instanceof HTMLElement)) {\n      return;\n    }\n\n    const id = target.getAttribute('data-tree-node-id');\n    if (!id) {\n      return;\n    }\n\n    const item = this.model[id];\n    if (!item.hasChildren) {\n      return;\n    }\n\n    const context = this.getContext(id);\n    context.isExpanded = !context.isExpanded;\n    this.nodeToggled.emit({ id, isExpanded: context.isExpanded });\n    this.setContext(id, context);\n  }\n\n  onTreeItemClick(event: Event) {\n    const { target } = event;\n    if (!(target instanceof HTMLElement)) {\n      return;\n    }\n\n    const id = target.getAttribute('data-tree-node-id');\n    if (!id) {\n      return;\n    }\n\n    const item = this.model[id];\n    const path = event.composedPath();\n    const treeIndex = path.indexOf(this.hostElement);\n    const treePath = path.slice(0, treeIndex);\n    const hasTrigger = dropdownController.pathIncludesTrigger(treePath);\n\n    if (hasTrigger) {\n      return;\n    }\n\n    if (!event.defaultPrevented) {\n      Object.values(this.context).forEach((c) => (c.isSelected = false));\n      const context = this.getContext(id);\n      context.isSelected = true;\n      this.setContext(id, context);\n    }\n\n    if (this.toggleOnItemClick && item.hasChildren) {\n      const context = this.getContext(id);\n      context.isExpanded = !context.isExpanded;\n      this.nodeToggled.emit({\n        id: id,\n        isExpanded: context.isExpanded,\n      });\n      this.setContext(id, context);\n    }\n\n    this.nodeClicked.emit(id);\n  }\n\n  render() {\n    return (\n      <Host onClick={(event: Event) => this.onTreeItemClick(event)}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"names":["radioGroupCss","RadiobuttonGroup","constructor","hostRef","this","direction","required","isInvalid","isValid","isInfo","isWarning","touched","groupRef","makeRef","observer","MutationObserver","ensureOnlyLastRadioChecked","hasNestedRequiredRadio","radiobuttonElements","Array","from","hostElement","querySelectorAll","connectedCallback","observe","childList","subtree","attributes","attributeFilter","componentWillLoad","selectInitialValue","disconnectedCallback","disconnect","value","forEach","radiobutton","checked","checkedRadios","filter","radio","index","length","some","onValueChangeHandler","newValue","onCheckedChangeHandler","event","target","valueChange","emit","onClassField","isInvalidByRequired","hasValidValue","Promise","resolve","find","isTouched","render","h","Host","key","onIxBlur","ref","label","helperText","invalidText","infoText","warningText","validText","showTextAsTooltip","controlRef","class","__decorate","HookValidationLifecycle","includeChildren","prototype"],"sources":["src/components/radio-group/radio-group.scss?tag=ix-radio-group&encapsulation=shadow","src/components/radio-group/radio-group.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n  display: inline-block;\n  position: relative;\n\n  .checkbox-container {\n    display: flex;\n    flex-direction: column;\n    gap: 1rem;\n    margin: 0.375rem 0;\n    flex-wrap: wrap;\n\n    &.row-layout {\n      flex-direction: row;\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport {\n  Component,\n  Element,\n  EventEmitter,\n  Host,\n  Event,\n  Listen,\n  Prop,\n  State,\n  h,\n  Watch,\n  Method,\n} from '@stencil/core';\nimport {\n  ValidationResults,\n  HookValidationLifecycle,\n  FieldWrapperInterface,\n  IxFormValidationState,\n} from '../utils/input';\nimport { makeRef } from '../utils/make-ref';\n\n/**\n * @form-ready\n */\n@Component({\n  tag: 'ix-radio-group',\n  styleUrl: 'radio-group.scss',\n  shadow: true,\n})\nexport class RadiobuttonGroup\n  implements FieldWrapperInterface, IxFormValidationState\n{\n  @Element() hostElement!: HTMLIxRadioGroupElement;\n  /**\n   * Show text below the field component\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * Label for the field component\n   */\n  @Prop() label?: string;\n\n  /**\n   * Value of the radiobutton group component\n   */\n  @Prop() value?: string;\n\n  /**\n   * Error text for the field component\n   */\n  @Prop() invalidText?: string;\n\n  /**\n   * Info text for the field component\n   */\n  @Prop() infoText?: string;\n\n  /**\n   * Warning text for the field component\n   */\n  @Prop() warningText?: string;\n\n  /**\n   * Valid text for the field component\n   */\n  @Prop() validText?: string;\n\n  /**\n   * Show helper, info, warning, error and valid text as tooltip\n   */\n  @Prop() showTextAsTooltip?: boolean;\n\n  /**\n   * Alignment of the radio buttons in the group\n   */\n  @Prop() direction: 'column' | 'row' = 'column';\n\n  /**\n   * Required state of the checkbox component\n   *\n   * @internal\n   */\n  @Prop() required?: boolean = false;\n\n  /**\n   * Event emitted when the value of the radiobutton group changes\n   */\n  @Event() valueChange!: EventEmitter<string>;\n\n  @State() isInvalid = false;\n  @State() isValid = false;\n  @State() isInfo = false;\n  @State() isWarning = false;\n\n  private touched = false;\n  private readonly groupRef = makeRef<HTMLIxRadioGroupElement>();\n\n  private readonly observer = new MutationObserver(() => {\n    this.ensureOnlyLastRadioChecked();\n    this.hasNestedRequiredRadio();\n  });\n\n  private get radiobuttonElements() {\n    return Array.from(this.hostElement.querySelectorAll('ix-radio'));\n  }\n\n  connectedCallback(): void {\n    this.observer.observe(this.hostElement, {\n      childList: true,\n      subtree: true,\n      attributes: true,\n      attributeFilter: ['checked', 'required'],\n    });\n  }\n\n  componentWillLoad(): void | Promise<void> {\n    this.selectInitialValue();\n    this.ensureOnlyLastRadioChecked();\n    this.hasNestedRequiredRadio();\n  }\n\n  disconnectedCallback(): void {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n  }\n\n  private selectInitialValue() {\n    if (!this.value) {\n      return;\n    }\n    this.radiobuttonElements.forEach((radiobutton) => {\n      radiobutton.checked = radiobutton.value === this.value;\n    });\n  }\n\n  private ensureOnlyLastRadioChecked() {\n    const checkedRadios = this.radiobuttonElements.filter(\n      (radio) => radio.checked\n    );\n    checkedRadios.forEach((radio, index) => {\n      if (index === checkedRadios.length - 1) {\n        return;\n      }\n      radio.checked = false;\n    });\n  }\n\n  private hasNestedRequiredRadio() {\n    this.required = this.radiobuttonElements.some(\n      (radiobutton) => radiobutton.required\n    );\n  }\n\n  @Watch('value')\n  onValueChangeHandler(newValue: string) {\n    this.touched = true;\n    this.radiobuttonElements.forEach((radiobutton) => {\n      radiobutton.checked = radiobutton.value === newValue;\n    });\n  }\n\n  @Listen('checkedChange')\n  onCheckedChangeHandler(event: CustomEvent<boolean>) {\n    this.radiobuttonElements.forEach((radiobutton) => {\n      if (radiobutton !== event.target) {\n        radiobutton.checked = false;\n        return;\n      }\n      radiobutton.checked = true;\n      this.valueChange.emit(radiobutton.value);\n    });\n  }\n\n  @HookValidationLifecycle({\n    includeChildren: true,\n  })\n  onClassField({\n    isInvalid,\n    isInfo,\n    isValid,\n    isWarning,\n    isInvalidByRequired,\n  }: ValidationResults) {\n    this.isInvalid = isInvalid || isInvalidByRequired;\n    this.isInfo = isInfo;\n    this.isValid = isValid;\n    this.isWarning = isWarning;\n  }\n\n  /** @internal */\n  @Method()\n  hasValidValue(): Promise<boolean> {\n    return Promise.resolve(\n      !!Array.from(this.hostElement.querySelectorAll('ix-radio')).find(\n        (radio) => radio.checked\n      )\n    );\n  }\n\n  /** @internal */\n  @Method()\n  isTouched(): Promise<boolean> {\n    return Promise.resolve(this.touched);\n  }\n\n  render() {\n    return (\n      <Host onIxBlur={() => (this.touched = true)} ref={this.groupRef}>\n        <ix-field-wrapper\n          label={this.label}\n          helperText={this.helperText}\n          invalidText={this.invalidText}\n          infoText={this.infoText}\n          warningText={this.warningText}\n          validText={this.validText}\n          showTextAsTooltip={this.showTextAsTooltip}\n          isValid={this.isValid}\n          isInfo={this.isInfo}\n          isWarning={this.isWarning}\n          isInvalid={this.isInvalid}\n          controlRef={this.groupRef}\n        >\n          <div\n            class={{\n              'checkbox-container': true,\n              'row-layout': this.direction === 'row',\n            }}\n          >\n            <slot></slot>\n          </div>\n        </ix-field-wrapper>\n      </Host>\n    );\n  }\n}\n"],"mappings":"wIAAA,MAAMA,EAAgB,+M,iXCqCTC,EAAgB,MAL7B,WAAAC,CAAAC,G,mDAoDUC,KAASC,UAAqB,SAO9BD,KAAQE,SAAa,MAOpBF,KAASG,UAAG,MACZH,KAAOI,QAAG,MACVJ,KAAMK,OAAG,MACTL,KAASM,UAAG,MAEbN,KAAOO,QAAG,MACDP,KAAQQ,SAAGC,IAEXT,KAAAU,SAAW,IAAIC,kBAAiB,KAC/CX,KAAKY,6BACLZ,KAAKa,wBAAwB,GAwIhC,CArIC,uBAAYC,GACV,OAAOC,MAAMC,KAAKhB,KAAKiB,YAAYC,iBAAiB,Y,CAGtD,iBAAAC,GACEnB,KAAKU,SAASU,QAAQpB,KAAKiB,YAAa,CACtCI,UAAW,KACXC,QAAS,KACTC,WAAY,KACZC,gBAAiB,CAAC,UAAW,a,CAIjC,iBAAAC,GACEzB,KAAK0B,qBACL1B,KAAKY,6BACLZ,KAAKa,wB,CAGP,oBAAAc,GACE,GAAI3B,KAAKU,SAAU,CACjBV,KAAKU,SAASkB,Y,EAIV,kBAAAF,GACN,IAAK1B,KAAK6B,MAAO,CACf,M,CAEF7B,KAAKc,oBAAoBgB,SAASC,IAChCA,EAAYC,QAAUD,EAAYF,QAAU7B,KAAK6B,KAAK,G,CAIlD,0BAAAjB,GACN,MAAMqB,EAAgBjC,KAAKc,oBAAoBoB,QAC5CC,GAAUA,EAAMH,UAEnBC,EAAcH,SAAQ,CAACK,EAAOC,KAC5B,GAAIA,IAAUH,EAAcI,OAAS,EAAG,CACtC,M,CAEFF,EAAMH,QAAU,KAAK,G,CAIjB,sBAAAnB,GACNb,KAAKE,SAAWF,KAAKc,oBAAoBwB,MACtCP,GAAgBA,EAAY7B,U,CAKjC,oBAAAqC,CAAqBC,GACnBxC,KAAKO,QAAU,KACfP,KAAKc,oBAAoBgB,SAASC,IAChCA,EAAYC,QAAUD,EAAYF,QAAUW,CAAQ,G,CAKxD,sBAAAC,CAAuBC,GACrB1C,KAAKc,oBAAoBgB,SAASC,IAChC,GAAIA,IAAgBW,EAAMC,OAAQ,CAChCZ,EAAYC,QAAU,MACtB,M,CAEFD,EAAYC,QAAU,KACtBhC,KAAK4C,YAAYC,KAAKd,EAAYF,MAAM,G,CAO5C,YAAAiB,EAAa3C,UACXA,EAASE,OACTA,EAAMD,QACNA,EAAOE,UACPA,EAASyC,oBACTA,IAEA/C,KAAKG,UAAYA,GAAa4C,EAC9B/C,KAAKK,OAASA,EACdL,KAAKI,QAAUA,EACfJ,KAAKM,UAAYA,C,CAKnB,aAAA0C,GACE,OAAOC,QAAQC,UACXnC,MAAMC,KAAKhB,KAAKiB,YAAYC,iBAAiB,aAAaiC,MACzDhB,GAAUA,EAAMH,U,CAOvB,SAAAoB,GACE,OAAOH,QAAQC,QAAQlD,KAAKO,Q,CAG9B,MAAA8C,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,SAAU,IAAOzD,KAAKO,QAAU,KAAOmD,IAAK1D,KAAKQ,UACrD8C,EAAA,oBAAAE,IAAA,2CACEG,MAAO3D,KAAK2D,MACZC,WAAY5D,KAAK4D,WACjBC,YAAa7D,KAAK6D,YAClBC,SAAU9D,KAAK8D,SACfC,YAAa/D,KAAK+D,YAClBC,UAAWhE,KAAKgE,UAChBC,kBAAmBjE,KAAKiE,kBACxB7D,QAASJ,KAAKI,QACdC,OAAQL,KAAKK,OACbC,UAAWN,KAAKM,UAChBH,UAAWH,KAAKG,UAChB+D,WAAYlE,KAAKQ,UAEjB8C,EAAA,OAAAE,IAAA,2CACEW,MAAO,CACL,qBAAsB,KACtB,aAAcnE,KAAKC,YAAc,QAGnCqD,EAAA,QAAAE,IAAA,+C,iGApDVY,EAAA,CAHCC,EAAwB,CACvBC,gBAAiB,QAalBzE,EAAA0E,UAAA,qB","ignoreList":[]}

package/dist/siemens-ix/{p-000cfb14.entry.js → p-dd11dd49.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as o,H as r}from"./p-BNpBEtDH.js";import{f as t}from"./p-CrTP-icT.js";const n=".btn{display:inline-flex;align-items:center;justify-content:center;height:2rem;font-size:0.875rem;font-weight:700;transition:var(--theme-default-time);padding:0 0.5rem;min-width:5rem;gap:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn .glyph{margin-right:0.25rem;font-weight:400}.btn:focus-visible,.btn.focus{box-shadow:none}.btn-primary{border-radius:var(--theme-btn--border-radius)}.btn-primary,.btn-primary.focus,.btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}.btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-primary.hover,.btn-primary:hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}.btn-primary.selected.hover,.btn-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-primary:not(:disabled):not(.disabled):active,.btn-primary:not(:disabled):not(.disabled).active,.show>.btn-primary.dropdown-toggle{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}.btn-primary.selected:not(:disabled):not(.disabled):active,.btn-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-primary.disabled,.btn-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}.btn-outline-primary{border-radius:var(--theme-btn--border-radius)}.btn-outline-primary,.btn-outline-primary.focus,.btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}.btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-outline-primary.hover,.btn-outline-primary:hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}.btn-outline-primary.selected.hover,.btn-outline-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-outline-primary:not(:disabled):not(.disabled):active,.btn-outline-primary:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.dropdown-toggle{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}.btn-outline-primary.selected:not(:disabled):not(.disabled):active,.btn-outline-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-outline-primary.disabled,.btn-outline-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}.btn-invisible-primary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-primary,.btn-invisible-primary.focus,.btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}.btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-invisible-primary.hover,.btn-invisible-primary:hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}.btn-invisible-primary.selected.hover,.btn-invisible-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-invisible-primary:not(:disabled):not(.disabled):active,.btn-invisible-primary:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.dropdown-toggle{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}.btn-invisible-primary.selected:not(:disabled):not(.disabled):active,.btn-invisible-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-invisible-primary.disabled,.btn-invisible-primary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}.btn-secondary{border-radius:var(--theme-btn--border-radius)}.btn-secondary,.btn-secondary.focus,.btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}.btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-secondary.hover,.btn-secondary:hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}.btn-secondary.selected.hover,.btn-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-secondary:not(:disabled):not(.disabled):active,.btn-secondary:not(:disabled):not(.disabled).active,.show>.btn-secondary.dropdown-toggle{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}.btn-secondary.selected:not(:disabled):not(.disabled):active,.btn-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-secondary.disabled,.btn-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}.btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}.btn-outline-secondary,.btn-outline-secondary.focus,.btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}.btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-outline-secondary.hover,.btn-outline-secondary:hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}.btn-outline-secondary.selected.hover,.btn-outline-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-outline-secondary:not(:disabled):not(.disabled):active,.btn-outline-secondary:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.dropdown-toggle{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}.btn-outline-secondary.selected:not(:disabled):not(.disabled):active,.btn-outline-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-outline-secondary.disabled,.btn-outline-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}.btn-invisible-secondary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-secondary,.btn-invisible-secondary.focus,.btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}.btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-invisible-secondary.hover,.btn-invisible-secondary:hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}.btn-invisible-secondary.selected.hover,.btn-invisible-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-invisible-secondary:not(:disabled):not(.disabled):active,.btn-invisible-secondary:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.dropdown-toggle{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}.btn-invisible-secondary.selected:not(:disabled):not(.disabled):active,.btn-invisible-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-invisible-secondary.disabled,.btn-invisible-secondary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}.btn-oval,.btn-icon{min-width:2rem;width:2rem}.btn-oval .glyph,.btn-icon .glyph{margin-right:0}.btn-oval{border-radius:6.25rem;width:2rem}.btn-icon-xs,.btn-icon-12{height:1rem;width:1rem;min-width:1rem;min-height:1rem}.btn-icon-s,.btn-icon-16{height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}.btn-icon-32{height:2rem;width:2rem;min-width:2rem;min-height:2rem}:host{display:inline-flex;height:2rem;font-size:0.875rem;font-weight:400;min-width:2rem}:host .link-button{display:inline-flex;position:relative;width:100%;padding:0 0.25rem 0 0;align-items:center;justify-content:center;background-color:transparent;color:var(--theme-color-primary);cursor:pointer;text-decoration:none}:host .link-button .link{display:block;position:relative;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):hover{color:var(--theme-color-dynamic--hover)}:host .link-button:not(.disabled):not(:disabled):hover .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):active,:host .link-button:not(.disabled):not(:disabled).active{color:var(--theme-color-dynamic--active)}:host .link-button:not(.disabled):not(:disabled):active .link,:host .link-button:not(.disabled):not(:disabled).active .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button.disabled{cursor:default;color:var(--theme-color-weak-text)}:host .link-button a{all:unset}:host :focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";const i=class{constructor(o){e(this,o);this.disabled=false;this.target="_self"}render(){return o(r,{key:"8d558c6e3040a669a95973a11ec8aba725053937"},o("a",{key:"915bfd275ac021eec6f05929208df8856d937b65",title:this.url,tabindex:"0",class:{"link-button":true,disabled:this.disabled},href:this.disabled?undefined:this.url,target:this.target},o("ix-icon",{key:"216cbfcf435f2ac46c515f7721fc2bda9a0ebb9b",class:"icon",name:t,size:"16"}),o("div",{key:"523e74973932a089166f015fa76daa7d73bd653f",class:{link:true,disabled:this.disabled}},o("slot",{key:"a9c650e9b77d2bba0e60f78bd96c036f6fc02c7a"}))))}};i.style=n;export{i as ix_link_button};
-//# sourceMappingURL=p-000cfb14.entry.js.map
+import{r as e,h as o,H as r}from"./p-BNpBEtDH.js";import{f as t}from"./p-CrTP-icT.js";const n=".btn{display:inline-flex;align-items:center;justify-content:center;height:2rem;font-size:0.875rem;font-weight:700;transition:var(--theme-default-time);padding:0 0.5rem;min-width:5rem;gap:0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn .glyph{margin-right:0.25rem;font-weight:400}.btn:focus-visible,.btn.focus{box-shadow:none}.btn-primary{border-radius:var(--theme-btn--border-radius)}.btn-primary,.btn-primary.focus,.btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}.btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-primary.hover,.btn-primary:hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}.btn-primary.selected.hover,.btn-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-primary:not(:disabled):not(.disabled):active,.btn-primary:not(:disabled):not(.disabled).active,.show>.btn-primary.dropdown-toggle{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}.btn-primary.selected:not(:disabled):not(.disabled):active,.btn-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-primary.disabled,.btn-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}.btn-outline-primary{border-radius:var(--theme-btn--border-radius)}.btn-outline-primary,.btn-outline-primary.focus,.btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}.btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-outline-primary.hover,.btn-outline-primary:hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}.btn-outline-primary.selected.hover,.btn-outline-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-outline-primary:not(:disabled):not(.disabled):active,.btn-outline-primary:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.dropdown-toggle{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}.btn-outline-primary.selected:not(:disabled):not(.disabled):active,.btn-outline-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-outline-primary.disabled,.btn-outline-primary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}.btn-invisible-primary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-primary,.btn-invisible-primary.focus,.btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}.btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-invisible-primary.hover,.btn-invisible-primary:hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}.btn-invisible-primary.selected.hover,.btn-invisible-primary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-invisible-primary:not(:disabled):not(.disabled):active,.btn-invisible-primary:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.dropdown-toggle{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}.btn-invisible-primary.selected:not(:disabled):not(.disabled):active,.btn-invisible-primary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-primary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-invisible-primary.disabled,.btn-invisible-primary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}.btn-secondary{border-radius:var(--theme-btn--border-radius)}.btn-secondary,.btn-secondary.focus,.btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}.btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-secondary.hover,.btn-secondary:hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}.btn-secondary.selected.hover,.btn-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-secondary:not(:disabled):not(.disabled):active,.btn-secondary:not(:disabled):not(.disabled).active,.show>.btn-secondary.dropdown-toggle{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}.btn-secondary.selected:not(:disabled):not(.disabled):active,.btn-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-secondary.disabled,.btn-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}.btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}.btn-outline-secondary,.btn-outline-secondary.focus,.btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}.btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-outline-secondary.hover,.btn-outline-secondary:hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}.btn-outline-secondary.selected.hover,.btn-outline-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-outline-secondary:not(:disabled):not(.disabled):active,.btn-outline-secondary:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.dropdown-toggle{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}.btn-outline-secondary.selected:not(:disabled):not(.disabled):active,.btn-outline-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-outline-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-outline-secondary.disabled,.btn-outline-secondary:disabled{pointer-events:none;cursor:initial;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}.btn-invisible-secondary{border-radius:var(--theme-btn--border-radius);--bs-btn-border-width:0px;--bs-btn-active-border-color:none}.btn-invisible-secondary,.btn-invisible-secondary.focus,.btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}.btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}.btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}.btn-invisible-secondary.hover,.btn-invisible-secondary:hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}.btn-invisible-secondary.selected.hover,.btn-invisible-secondary.selected:hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}.btn-invisible-secondary:not(:disabled):not(.disabled):active,.btn-invisible-secondary:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.dropdown-toggle{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}.btn-invisible-secondary.selected:not(:disabled):not(.disabled):active,.btn-invisible-secondary.selected:not(:disabled):not(.disabled).active,.show>.btn-invisible-secondary.selected.dropdown-toggle{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}.btn-invisible-secondary.disabled,.btn-invisible-secondary:disabled{pointer-events:none;cursor:initial;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}.btn-oval,.btn-icon{min-width:2rem;width:2rem}.btn-oval .glyph,.btn-icon .glyph{margin-right:0}.btn-oval{border-radius:6.25rem;width:2rem}.btn-icon-xs,.btn-icon-12{height:1rem;width:1rem;min-width:1rem;min-height:1rem}.btn-icon-s,.btn-icon-16{height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}.btn-icon-32{height:2rem;width:2rem;min-width:2rem;min-height:2rem}:host{display:inline-flex;height:2rem;font-size:0.875rem;font-weight:400;min-width:2rem}:host .link-button{display:inline-flex;position:relative;width:100%;padding:0 0.25rem 0 0;align-items:center;justify-content:center;background-color:transparent;color:var(--theme-color-primary);cursor:pointer;text-decoration:none}:host .link-button .link{display:block;position:relative;width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):hover{color:var(--theme-color-dynamic--hover)}:host .link-button:not(.disabled):not(:disabled):hover .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button:not(.disabled):not(:disabled){cursor:pointer}:host .link-button:not(.disabled):not(:disabled):active,:host .link-button:not(.disabled):not(:disabled).active{color:var(--theme-color-dynamic--active)}:host .link-button:not(.disabled):not(:disabled):active .link,:host .link-button:not(.disabled):not(:disabled).active .link{text-decoration:underline;text-underline-offset:0.2rem}:host .link-button.disabled{cursor:default;color:var(--theme-color-weak-text)}:host .link-button a{all:unset}:host :focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";const i=class{constructor(o){e(this,o);this.disabled=false;this.target="_self"}render(){return o(r,{key:"0f76f75d757b7b90d5fc8c4552276e41b6428312"},o("a",{key:"48515c1d185900b72c62e938b86fcdf41532ab9c",title:this.url,tabindex:"0",class:{"link-button":true,disabled:this.disabled},href:this.disabled?undefined:this.url,target:this.target},o("ix-icon",{key:"f3fc4f402c9245113fe85f05068ed8e1087c7f51",class:"icon",name:t,size:"16"}),o("div",{key:"38563a986bf32fd87f3029bba5ca4dde1bea67bf",class:{link:true,disabled:this.disabled}},o("slot",{key:"9e305448f5b367db3c54fcab6522fbcb2d388c6c"}))))}};i.style=n;export{i as ix_link_button};
+//# sourceMappingURL=p-dd11dd49.entry.js.map

package/dist/siemens-ix/{p-000cfb14.entry.js.map → p-dd11dd49.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["linkButtonCss","LinkButton","constructor","hostRef","this","disabled","target","render","h","Host","key","title","url","tabindex","class","href","undefined","name","iconChevronRightSmall","size","link"],"sources":["src/components/link-button/link-button.scss?tag=ix-link-button&encapsulation=shadow","src/components/link-button/link-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 'legacy/components/buttons';\n@import 'mixins/hover';\n\n:host {\n  display: inline-flex;\n  height: $x-large-space;\n  font-size: $font-size-default;\n  font-weight: $font-weight-normal;\n  min-width: $x-large-space;\n\n  .link-button {\n    display: inline-flex;\n    position: relative;\n    width: 100%;\n    padding: 0 $tiny-space 0 0;\n    align-items: center;\n    justify-content: center;\n    background-color: transparent;\n    color: var(--theme-color-primary);\n    cursor: pointer;\n    text-decoration: none;\n\n    .link {\n      display: block;\n      position: relative;\n      width: 100%;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      overflow: hidden;\n    }\n\n    @include hover {\n      color: var(--theme-color-dynamic--hover);\n\n      .link {\n        text-decoration: underline;\n        text-underline-offset: 0.2rem;\n      }\n    }\n\n    @include active {\n      color: var(--theme-color-dynamic--active);\n\n      .link {\n        text-decoration: underline;\n        text-underline-offset: 0.2rem;\n      }\n    }\n\n    &.disabled {\n      cursor: default;\n      color: var(--theme-color-weak-text);\n    }\n\n    a {\n      all: unset;\n    }\n  }\n\n  :focus-visible {\n    outline: 1px solid var(--theme-color-focus-bdr);\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 { iconChevronRightSmall } from '@siemens/ix-icons/icons';\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-link-button',\n  styleUrl: 'link-button.scss',\n  shadow: true,\n})\nexport class LinkButton {\n  /**\n   * Disable the link button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Url for the link button\n   */\n  @Prop() url?: string;\n\n  /**\n   * Specifies where to open the link\n   *\n   * https://www.w3schools.com/html/html_links.asp\n   */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  render() {\n    return (\n      <Host>\n        <a\n          title={this.url}\n          tabindex=\"0\"\n          class={{\n            'link-button': true,\n            disabled: this.disabled,\n          }}\n          href={this.disabled ? undefined : this.url}\n          target={this.target}\n        >\n          <ix-icon\n            class=\"icon\"\n            name={iconChevronRightSmall}\n            size=\"16\"\n          ></ix-icon>\n          <div\n            class={{\n              link: true,\n              disabled: this.disabled,\n            }}\n          >\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAgB,2wb,MCoBTC,EAAU,MALvB,WAAAC,CAAAC,G,UASUC,KAAQC,SAAG,MAYXD,KAAME,OAA4C,OAgC3D,CA9BC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EACE,KAAAE,IAAA,2CAAAC,MAAOP,KAAKQ,IACZC,SAAS,IACTC,MAAO,CACL,cAAe,KACfT,SAAUD,KAAKC,UAEjBU,KAAMX,KAAKC,SAAWW,UAAYZ,KAAKQ,IACvCN,OAAQF,KAAKE,QAEbE,EACE,WAAAE,IAAA,2CAAAI,MAAM,OACNG,KAAMC,EACNC,KAAK,OAEPX,EAAA,OAAAE,IAAA,2CACEI,MAAO,CACLM,KAAM,KACNf,SAAUD,KAAKC,WAGjBG,EAAA,QAAAE,IAAA,+C","ignoreList":[]}
+{"version":3,"names":["linkButtonCss","LinkButton","constructor","hostRef","this","disabled","target","render","h","Host","key","title","url","tabindex","class","href","undefined","name","iconChevronRightSmall","size","link"],"sources":["src/components/link-button/link-button.scss?tag=ix-link-button&encapsulation=shadow","src/components/link-button/link-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 'legacy/components/buttons';\n@import 'mixins/hover';\n\n:host {\n  display: inline-flex;\n  height: $x-large-space;\n  font-size: $font-size-default;\n  font-weight: $font-weight-normal;\n  min-width: $x-large-space;\n\n  .link-button {\n    display: inline-flex;\n    position: relative;\n    width: 100%;\n    padding: 0 $tiny-space 0 0;\n    align-items: center;\n    justify-content: center;\n    background-color: transparent;\n    color: var(--theme-color-primary);\n    cursor: pointer;\n    text-decoration: none;\n\n    .link {\n      display: block;\n      position: relative;\n      width: 100%;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      overflow: hidden;\n    }\n\n    @include hover {\n      color: var(--theme-color-dynamic--hover);\n\n      .link {\n        text-decoration: underline;\n        text-underline-offset: 0.2rem;\n      }\n    }\n\n    @include active {\n      color: var(--theme-color-dynamic--active);\n\n      .link {\n        text-decoration: underline;\n        text-underline-offset: 0.2rem;\n      }\n    }\n\n    &.disabled {\n      cursor: default;\n      color: var(--theme-color-weak-text);\n    }\n\n    a {\n      all: unset;\n    }\n  }\n\n  :focus-visible {\n    outline: 1px solid var(--theme-color-focus-bdr);\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 { iconChevronRightSmall } from '@siemens/ix-icons/icons';\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-link-button',\n  styleUrl: 'link-button.scss',\n  shadow: true,\n})\nexport class LinkButton {\n  /**\n   * Disable the link button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Url for the link button\n   */\n  @Prop() url?: string;\n\n  /**\n   * Specifies where to open the link\n   *\n   * https://www.w3schools.com/html/html_links.asp\n   */\n  @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n  render() {\n    return (\n      <Host>\n        <a\n          title={this.url}\n          tabindex=\"0\"\n          class={{\n            'link-button': true,\n            disabled: this.disabled,\n          }}\n          href={this.disabled ? undefined : this.url}\n          target={this.target}\n        >\n          <ix-icon\n            class=\"icon\"\n            name={iconChevronRightSmall}\n            size=\"16\"\n          ></ix-icon>\n          <div\n            class={{\n              link: true,\n              disabled: this.disabled,\n            }}\n          >\n            <slot></slot>\n          </div>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAgB,2wb,MCiBTC,EAAU,MALvB,WAAAC,CAAAC,G,UASUC,KAAQC,SAAG,MAYXD,KAAME,OAA4C,OAgC3D,CA9BC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EACE,KAAAE,IAAA,2CAAAC,MAAOP,KAAKQ,IACZC,SAAS,IACTC,MAAO,CACL,cAAe,KACfT,SAAUD,KAAKC,UAEjBU,KAAMX,KAAKC,SAAWW,UAAYZ,KAAKQ,IACvCN,OAAQF,KAAKE,QAEbE,EACE,WAAAE,IAAA,2CAAAI,MAAM,OACNG,KAAMC,EACNC,KAAK,OAEPX,EAAA,OAAAE,IAAA,2CACEI,MAAO,CACLM,KAAM,KACNf,SAAUD,KAAKC,WAGjBG,EAAA,QAAAE,IAAA,+C","ignoreList":[]}

package/dist/siemens-ix/{p-2290614f.entry.js → p-e09ab46a.entry.js}

@@ -1,2 +1,2 @@
-import{r,h as o,H as e}from"./p-BNpBEtDH.js";const t=":host{display:flex;padding:0.5rem;justify-content:flex-end;align-items:center;gap:0.5rem;align-self:stretch}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";const a=class{constructor(o){r(this,o)}render(){return o(e,{key:"b496e182f94cc4616cb39bc2df97ca4ac143d962"},o("slot",{key:"b555ce404e2e8a950e4db1011267e60a5f5a4740"}))}};a.style=t;export{a as ix_modal_footer};
-//# sourceMappingURL=p-2290614f.entry.js.map
+import{r,h as o,H as e}from"./p-BNpBEtDH.js";const t=":host{display:flex;padding:0.5rem;justify-content:flex-end;align-items:center;gap:0.5rem;align-self:stretch}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";const a=class{constructor(o){r(this,o)}render(){return o(e,{key:"d7d9f3a59d96c4f31c601daef5895a360bdd7d24"},o("slot",{key:"3ae29be9862f27ef3b903ea8005d0143e1925273"}))}};a.style=t;export{a as ix_modal_footer};
+//# sourceMappingURL=p-e09ab46a.entry.js.map

package/dist/siemens-ix/{p-2290614f.entry.js.map → p-e09ab46a.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["modalFooterCss","ModalFooter","render","h","Host","key"],"sources":["src/components/modal-footer/modal-footer.scss?tag=ix-modal-footer&encapsulation=shadow","src/components/modal-footer/modal-footer.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: flex;\n  padding: 0.5rem;\n  justify-content: flex-end;\n  align-items: center;\n  gap: 0.5rem;\n  align-self: stretch;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 2.0.0\n */\n@Component({\n  tag: 'ix-modal-footer',\n  styleUrl: 'modal-footer.scss',\n  shadow: true,\n})\nexport class ModalFooter {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6CAAA,MAAMA,EAAiB,u2B,MCmBVC,EAAW,M,yBACtB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAa,QAAAE,IAAA,6C","ignoreList":[]}
+{"version":3,"names":["modalFooterCss","ModalFooter","render","h","Host","key"],"sources":["src/components/modal-footer/modal-footer.scss?tag=ix-modal-footer&encapsulation=shadow","src/components/modal-footer/modal-footer.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  display: flex;\n  padding: 0.5rem;\n  justify-content: flex-end;\n  align-items: center;\n  gap: 0.5rem;\n  align-self: stretch;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'ix-modal-footer',\n  styleUrl: 'modal-footer.scss',\n  shadow: true,\n})\nexport class ModalFooter {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6CAAA,MAAMA,EAAiB,u2B,MCgBVC,EAAW,M,yBACtB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAa,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/siemens-ix/{p-5963369c.entry.js → p-e3c930ac.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as e,H as i,g as s}from"./p-BNpBEtDH.js";import{c as o,a,s as r,o as n,b as l,f as c,h}from"./p-CAqtPJ4-.js";import{r as d}from"./p-CFRrPFxi.js";import{m as f}from"./p-bcj7UEIC.js";import{b as m}from"./p-CKoABG1h.js";const p='.dialog{margin:0;padding:0;border:none;max-width:18.25rem;width:-moz-max-content;width:max-content;background-color:transparent;overflow-wrap:break-word;box-shadow:none;overflow:visible}.tooltip-container{display:block;position:relative;width:auto;height:100%;background:var(--theme-tootlip--background);color:var(--theme-color-std-text);padding:0.375rem 0.75rem 0.375rem 0.875rem;box-shadow:var(--theme-shadow-4);border-radius:0.25rem}.content-wrapper{overflow:auto}.tooltip-title{display:flex;align-items:center}.tooltip-title ::slotted(ix-icon){margin-right:0.35rem}.arrow,.arrow::before{position:absolute;width:12px;height:12px;background:inherit}.arrow{visibility:hidden}.arrow::before{visibility:visible;content:"";transform:rotate(45deg);background-color:var(--theme-tootlip--background)}';const u=t=>t!==null?`${t}px`:"";let b=0;const v=class{constructor(e){t(this,e);this.interactive=false;this.placement="top";this.showDelay=0;this.hideDelay=50;this.animationFrame=false;this.visible=false;this.instance=b++;this.dialogRef=f()}get arrowElement(){return this.hostElement.shadowRoot.querySelector(".arrow")}async showTooltip(t){this.clearTimeouts();if(this.showTooltipTimeout||this.visibleFor===t){return}const e=await this.dialogRef.waitForCurrent();this.showTooltipTimeout=setTimeout((()=>{this.setAnchorElement(t);e.showPopover();this.applyTooltipPosition(t,e);this.registerTooltipListener(e)}),this.showDelay)}async hideTooltip(t=this.hideDelay){this.clearTimeouts();if(this.hideTooltipTimeout||!this.visible){return}if(this.interactive&&t===50){t=150}const e=await this.dialogRef.waitForCurrent();this.hideTooltipTimeout=setTimeout((()=>{var t,i;this.setAnchorElement();e.hidePopover();(t=this.disposeAutoUpdate)===null||t===void 0?void 0:t.call(this);(i=this.disposeTooltipListener)===null||i===void 0?void 0:i.call(this)}),t)}setAnchorElement(t){if(!t){this.visibleFor=undefined;this.visible=false}else{this.visibleFor=t;this.visible=true}}computeArrowPosition({placement:t,middlewareData:e}){let{x:i,y:s}=e.arrow;const o={top:"unset",right:"unset",bottom:"unset",left:"unset"};if(t.startsWith("top")){return Object.assign(Object.assign({},o),{left:u(i),top:u(s)})}if(t.startsWith("right")){return Object.assign(Object.assign({},o),{left:u(-6),top:u(s)})}if(t.startsWith("bottom")){return Object.assign(Object.assign({},o),{left:u(i),top:u(-6)})}if(t.startsWith("left")){return Object.assign(Object.assign({},o),{right:u(-6),top:u(s)})}}async computeTooltipPosition(t,e){return o(t,e,{strategy:"fixed",placement:this.placement,middleware:[r(),n(12),l({element:this.arrowElement}),c({fallbackStrategy:"initialPlacement",fallbackAxisSideDirection:"end",padding:10}),h()]})}applyTooltipArrowPosition(t){const e=this.computeArrowPosition(t);Object.assign(this.arrowElement.style,e)}async applyTooltipPosition(t,e){if(!t){return}return new Promise((i=>{var s;(s=this.disposeAutoUpdate)===null||s===void 0?void 0:s.call(this);this.disposeAutoUpdate=a(t,e,(async()=>{var s;const o=await this.computeTooltipPosition(t,e);const a=(s=o.middlewareData.hide)===null||s===void 0?void 0:s.referenceHidden;if(a){this.hideTooltip(0);i(o)}if(o.middlewareData.arrow){this.applyTooltipArrowPosition(o)}const{x:r,y:n}=o;Object.assign(e.style,{left:u(r),top:u(n)});i(o)}),{ancestorResize:true,ancestorScroll:true,elementResize:true,animationFrame:this.animationFrame})}))}async queryAnchorElements(){if(this.for){if(Array.isArray(this.for)){return this.resolveElements(this.for)}else{return this.resolveElements([this.for])}}}async resolveElements(t){const e=[];await Promise.all(t.map((async t=>{if(typeof t==="string"){const i=await d(t,this.hostElement);if(i){e.push(...i)}}else if(t instanceof HTMLElement){e.push(t)}else if(t instanceof Promise){e.push(await t)}})));return e}async registerTriggerListener(){var t;(t=this.disposeTriggerListener)===null||t===void 0?void 0:t.call(this);const e=await this.queryAnchorElements();if(!e){return}const i=[];e.forEach((t=>{i.push(...[{element:t,eventType:"mouseenter",callback:()=>{this.showTooltip(t)}},{element:t,eventType:"mouseleave",callback:()=>{this.hideTooltip()}},{element:t,eventType:"focus",callback:()=>{this.showTooltip(t)}},{element:t,eventType:"focusout",callback:()=>{this.hideTooltip()}}])}));this.disposeTriggerListener=m(i)}registerTooltipListener(t){var e;(e=this.disposeTooltipListener)===null||e===void 0?void 0:e.call(this);this.disposeTooltipListener=m([{element:t,eventType:"mouseenter",callback:()=>{if(this.interactive){this.clearHideTimeout()}}},{element:t,eventType:"focus",callback:()=>{if(this.interactive){this.clearHideTimeout()}}},{element:t,eventType:"mouseleave",callback:()=>{this.hideTooltip()}},{element:t,eventType:"focusout",callback:()=>{this.hideTooltip()}},{element:t,eventType:"click",callback:t=>{t.stopPropagation()}},{element:document,eventType:"keydown",callback:t=>{if(t.key==="Escape"){this.hideTooltip()}}}])}registerDomChangeListener(){const t=new MutationObserver((()=>{this.registerTriggerListener()}));t.observe(document.body,{attributes:true,attributeFilter:["data-ix-tooltip"],childList:true,subtree:true});this.disposeDomChangeListener=()=>{t.disconnect()}}clearHideTimeout(){clearTimeout(this.hideTooltipTimeout);this.hideTooltipTimeout=undefined}clearShowTimeout(){clearTimeout(this.showTooltipTimeout);this.showTooltipTimeout=undefined}clearTimeouts(){this.clearHideTimeout();this.clearShowTimeout()}componentWillLoad(){this.registerTriggerListener()}componentDidLoad(){this.registerDomChangeListener()}disconnectedCallback(){var t,e,i,s;this.clearTimeouts();(t=this.disposeAutoUpdate)===null||t===void 0?void 0:t.call(this);(e=this.disposeTriggerListener)===null||e===void 0?void 0:e.call(this);(i=this.disposeTooltipListener)===null||i===void 0?void 0:i.call(this);(s=this.disposeDomChangeListener)===null||s===void 0?void 0:s.call(this)}render(){return e(i,{key:"de71d4a53d4b9d1c5631eb52ebc58a9070e20c34",role:"tooltip",class:{visible:this.visible}},e("dialog",{key:"677ef22f8e4554645454312012303df2ec9e4c57",ref:this.dialogRef,id:"tooltip-"+this.instance,class:"dialog",popover:"manual",inert:!this.visible},e("div",{key:"3965cab3b146c941c78238e3c5ce1f2c66014098",class:"tooltip-container"},e("div",{key:"e9e3f38fec696d38327b3fbb5e848d248e74881e",class:"content-wrapper"},e("div",{key:"24c518e1ff9486dd8a28135bbf67312e78572a9e",class:"tooltip-title"},e("slot",{key:"a21f9fec2aad1c4bd9859998c31b368cf1f3afc3",name:"title-icon"}),e("ix-typography",{key:"1dbbacaa0240b375f7d4ede44fce1ed8ba4409d4",format:"h5"},this.titleContent,e("slot",{key:"c0e1a995fdce329322f02f39b9ecf7452e5230e7",name:"title-content"}))),e("slot",{key:"1288a8f910a647a47ddf9167cdb8928a933a76dc"}),e("div",{key:"db76a2a402a20e13430f3573d1823d95a247f3e2",class:"arrow"})))))}get hostElement(){return s(this)}};v.style=p;export{v as ix_tooltip};
-//# sourceMappingURL=p-5963369c.entry.js.map
+import{r as t,h as e,H as i,g as s}from"./p-BNpBEtDH.js";import{c as o,a,s as r,o as n,b as l,f as c,h}from"./p-CAqtPJ4-.js";import{r as d}from"./p-CFRrPFxi.js";import{m as f}from"./p-bcj7UEIC.js";import{b as m}from"./p-CKoABG1h.js";const b='.dialog{margin:0;padding:0;border:none;max-width:18.25rem;width:-moz-max-content;width:max-content;background-color:transparent;overflow-wrap:break-word;box-shadow:none;overflow:visible}.tooltip-container{display:block;position:relative;width:auto;height:100%;background:var(--theme-tootlip--background);color:var(--theme-color-std-text);padding:0.375rem 0.75rem 0.375rem 0.875rem;box-shadow:var(--theme-shadow-4);border-radius:0.25rem}.content-wrapper{overflow:auto}.tooltip-title{display:flex;align-items:center}.tooltip-title ::slotted(ix-icon){margin-right:0.35rem}.arrow,.arrow::before{position:absolute;width:12px;height:12px;background:inherit}.arrow{visibility:hidden}.arrow::before{visibility:visible;content:"";transform:rotate(45deg);background-color:var(--theme-tootlip--background)}';const p=t=>t!==null?`${t}px`:"";let u=0;const v=class{constructor(e){t(this,e);this.interactive=false;this.placement="top";this.showDelay=0;this.hideDelay=50;this.animationFrame=false;this.visible=false;this.instance=u++;this.dialogRef=f()}get arrowElement(){return this.hostElement.shadowRoot.querySelector(".arrow")}async showTooltip(t){this.clearTimeouts();if(this.showTooltipTimeout||this.visibleFor===t){return}const e=await this.dialogRef.waitForCurrent();this.showTooltipTimeout=setTimeout((()=>{this.setAnchorElement(t);e.showPopover();this.applyTooltipPosition(t,e);this.registerTooltipListener(e)}),this.showDelay)}async hideTooltip(t=this.hideDelay){this.clearTimeouts();if(this.hideTooltipTimeout||!this.visible){return}if(this.interactive&&t===50){t=150}const e=await this.dialogRef.waitForCurrent();this.hideTooltipTimeout=setTimeout((()=>{var t,i;this.setAnchorElement();e.hidePopover();(t=this.disposeAutoUpdate)===null||t===void 0?void 0:t.call(this);(i=this.disposeTooltipListener)===null||i===void 0?void 0:i.call(this)}),t)}setAnchorElement(t){if(!t){this.visibleFor=undefined;this.visible=false}else{this.visibleFor=t;this.visible=true}}computeArrowPosition({placement:t,middlewareData:e}){let{x:i,y:s}=e.arrow;const o={top:"unset",right:"unset",bottom:"unset",left:"unset"};if(t.startsWith("top")){return Object.assign(Object.assign({},o),{left:p(i),top:p(s)})}if(t.startsWith("right")){return Object.assign(Object.assign({},o),{left:p(-6),top:p(s)})}if(t.startsWith("bottom")){return Object.assign(Object.assign({},o),{left:p(i),top:p(-6)})}if(t.startsWith("left")){return Object.assign(Object.assign({},o),{right:p(-6),top:p(s)})}}async computeTooltipPosition(t,e){return o(t,e,{strategy:"fixed",placement:this.placement,middleware:[r(),n(12),l({element:this.arrowElement}),c({fallbackStrategy:"initialPlacement",fallbackAxisSideDirection:"end",padding:10}),h()]})}applyTooltipArrowPosition(t){const e=this.computeArrowPosition(t);Object.assign(this.arrowElement.style,e)}async applyTooltipPosition(t,e){if(!t){return}return new Promise((i=>{var s;(s=this.disposeAutoUpdate)===null||s===void 0?void 0:s.call(this);this.disposeAutoUpdate=a(t,e,(async()=>{var s;const o=await this.computeTooltipPosition(t,e);const a=(s=o.middlewareData.hide)===null||s===void 0?void 0:s.referenceHidden;if(a){this.hideTooltip(0);i(o)}if(o.middlewareData.arrow){this.applyTooltipArrowPosition(o)}const{x:r,y:n}=o;Object.assign(e.style,{left:p(r),top:p(n)});i(o)}),{ancestorResize:true,ancestorScroll:true,elementResize:true,animationFrame:this.animationFrame})}))}async queryAnchorElements(){if(this.for){if(Array.isArray(this.for)){return this.resolveElements(this.for)}else{return this.resolveElements([this.for])}}}async resolveElements(t){const e=[];await Promise.all(t.map((async t=>{if(typeof t==="string"){const i=await d(t,this.hostElement);if(i){e.push(...i)}}else if(t instanceof HTMLElement){e.push(t)}else if(t instanceof Promise){e.push(await t)}})));return e}async registerTriggerListener(){var t;(t=this.disposeTriggerListener)===null||t===void 0?void 0:t.call(this);const e=await this.queryAnchorElements();if(!e){return}const i=[];e.forEach((t=>{i.push(...[{element:t,eventType:"mouseenter",callback:()=>{this.showTooltip(t)}},{element:t,eventType:"mouseleave",callback:()=>{this.hideTooltip()}},{element:t,eventType:"focus",callback:()=>{this.showTooltip(t)}},{element:t,eventType:"focusout",callback:()=>{this.hideTooltip()}}])}));this.disposeTriggerListener=m(i)}registerTooltipListener(t){var e;(e=this.disposeTooltipListener)===null||e===void 0?void 0:e.call(this);this.disposeTooltipListener=m([{element:t,eventType:"mouseenter",callback:()=>{if(this.interactive){this.clearHideTimeout()}}},{element:t,eventType:"focus",callback:()=>{if(this.interactive){this.clearHideTimeout()}}},{element:t,eventType:"mouseleave",callback:()=>{this.hideTooltip()}},{element:t,eventType:"focusout",callback:()=>{this.hideTooltip()}},{element:t,eventType:"click",callback:t=>{t.stopPropagation()}},{element:document,eventType:"keydown",callback:t=>{if(t.key==="Escape"){this.hideTooltip()}}}])}registerDomChangeListener(){const t=new MutationObserver((()=>{this.registerTriggerListener()}));t.observe(document.body,{attributes:true,attributeFilter:["data-ix-tooltip"],childList:true,subtree:true});this.disposeDomChangeListener=()=>{t.disconnect()}}clearHideTimeout(){clearTimeout(this.hideTooltipTimeout);this.hideTooltipTimeout=undefined}clearShowTimeout(){clearTimeout(this.showTooltipTimeout);this.showTooltipTimeout=undefined}clearTimeouts(){this.clearHideTimeout();this.clearShowTimeout()}componentWillLoad(){this.registerTriggerListener()}componentDidLoad(){this.registerDomChangeListener()}disconnectedCallback(){var t,e,i,s;this.clearTimeouts();(t=this.disposeAutoUpdate)===null||t===void 0?void 0:t.call(this);(e=this.disposeTriggerListener)===null||e===void 0?void 0:e.call(this);(i=this.disposeTooltipListener)===null||i===void 0?void 0:i.call(this);(s=this.disposeDomChangeListener)===null||s===void 0?void 0:s.call(this)}render(){return e(i,{key:"36a8743eb0ebda55e9a470456692051caac17894",role:"tooltip",class:{visible:this.visible}},e("dialog",{key:"8ed7a8a435fc50977e6cc8bf5792ec48347c6c81",ref:this.dialogRef,id:"tooltip-"+this.instance,class:"dialog",popover:"manual",inert:!this.visible},e("div",{key:"37c134036a13e239bc7ce7951e8cff288fce97b9",class:"tooltip-container"},e("div",{key:"c1053f7ab1fc20a5b172ff987d51c3a4d56db73e",class:"content-wrapper"},e("div",{key:"045242b42cb66b6272dd23980bce24dff91d2ffd",class:"tooltip-title"},e("slot",{key:"5743b9415b8f8ea6bcdca917a3e43e3c03f3abe4",name:"title-icon"}),e("ix-typography",{key:"c86c5b07775d2fc179cf20d43f87357802718ed1",format:"h5"},this.titleContent,e("slot",{key:"b42f2ad9086133679eeb45ec0706a0b41fbc54ed",name:"title-content"}))),e("slot",{key:"06f6215566b2a8df46ffb801c36f1fd743b87754"}),e("div",{key:"fe47bb2898758e28a6d81eb2f5f5d17f49d1fecc",class:"arrow"})))))}get hostElement(){return s(this)}};v.style=b;export{v as ix_tooltip};
+//# sourceMappingURL=p-e3c930ac.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["tooltipCss","numberToPixel","value","tooltipInstance","Tooltip","constructor","hostRef","this","interactive","placement","showDelay","hideDelay","animationFrame","visible","instance","dialogRef","makeRef","arrowElement","hostElement","shadowRoot","querySelector","showTooltip","anchorElement","clearTimeouts","showTooltipTimeout","visibleFor","dialog","waitForCurrent","setTimeout","setAnchorElement","showPopover","applyTooltipPosition","registerTooltipListener","hideTooltip","hideTooltipTimeout","hidePopover","_a","disposeAutoUpdate","call","_b","disposeTooltipListener","undefined","computeArrowPosition","middlewareData","x","y","arrow","resetPosition","top","right","bottom","left","startsWith","Object","assign","computeTooltipPosition","target","computePosition","strategy","middleware","shift","offset","element","flip","fallbackStrategy","fallbackAxisSideDirection","padding","hide","applyTooltipArrowPosition","computeResponse","arrowPosition","style","Promise","resolve","autoUpdate","async","isHidden","referenceHidden","ancestorResize","ancestorScroll","elementResize","queryAnchorElements","for","Array","isArray","resolveElements","references","elements","all","map","reference","resolvedElements","resolveSelector","push","HTMLElement","registerTriggerListener","disposeTriggerListener","triggerElementList","listeners","forEach","eventType","callback","addDisposableEventListenerAsArray","clearHideTimeout","event","stopPropagation","document","key","registerDomChangeListener","observer","MutationObserver","observe","body","attributes","attributeFilter","childList","subtree","disposeDomChangeListener","disconnect","clearTimeout","clearShowTimeout","componentWillLoad","componentDidLoad","disconnectedCallback","_c","_d","render","h","Host","role","class","ref","id","popover","inert","name","format","titleContent"],"sources":["src/components/tooltip/tooltip.scss?tag=ix-tooltip&encapsulation=shadow","src/components/tooltip/tooltip.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2025 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.dialog {\n  margin: 0;\n  padding: 0;\n  border: none;\n  max-width: 18.25rem;\n  width: max-content;\n  background-color: transparent;\n  overflow-wrap: break-word;\n  box-shadow: none;\n  overflow: visible;\n}\n\n.tooltip-container {\n  display: block;\n  position: relative;\n  width: auto;\n  height: 100%;\n  background: var(--theme-tootlip--background);\n  color: var(--theme-color-std-text);\n  padding: 0.375rem 0.75rem 0.375rem 0.875rem;\n\n  box-shadow: var(--theme-shadow-4);\n  border-radius: 0.25rem;\n}\n\n.content-wrapper {\n  overflow: auto;\n}\n\n.tooltip-title {\n  display: flex;\n  align-items: center;\n\n  ::slotted(ix-icon) {\n    margin-right: 0.35rem;\n  }\n}\n\n.arrow,\n.arrow::before {\n  position: absolute;\n  width: 12px;\n  height: 12px;\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 * SPDX-FileCopyrightText: 2025 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  arrow,\n  autoUpdate,\n  computePosition,\n  ComputePositionReturn,\n  flip,\n  hide,\n  offset,\n  shift,\n} from '@floating-ui/dom';\nimport {\n  Component,\n  Element,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { resolveSelector } from '../utils/find-element';\nimport { ElementReference } from 'src/components';\nimport { makeRef } from '../utils/make-ref';\nimport { addDisposableEventListenerAsArray } from '../utils/disposable-event-listener';\n\ntype ArrowPosition = {\n  top?: string;\n  left?: string;\n  right?: string;\n};\n\nconst numberToPixel = (value?: number | null) =>\n  value !== null ? `${value}px` : '';\n\nlet tooltipInstance = 0;\n\n/**\n * @slot title-icon - Icon of tooltip title\n * @slot title-content - Content of tooltip title\n */\n@Component({\n  tag: 'ix-tooltip',\n  styleUrl: 'tooltip.scss',\n  shadow: true,\n})\nexport class Tooltip {\n  /**\n   * CSS selector for hover trigger element e.g. `for=\"[data-my-custom-select]\"`\n   */\n  @Prop() for?: ElementReference | ElementReference[];\n\n  /**\n   * Title of the tooltip\n   */\n  @Prop() titleContent?: string;\n\n  /**\n   * Define if the user can access the tooltip via mouse.\n   */\n  @Prop() interactive = false;\n\n  /**\n   * Initial placement of the tooltip.\n   * If the selected placement doesn't have enough space, the tooltip will be repositioned to another location.\n   */\n  @Prop() placement: 'top' | 'right' | 'bottom' | 'left' = 'top';\n\n  /** @internal */\n  @Prop() showDelay = 0;\n\n  /** @internal */\n  @Prop() hideDelay = 50;\n\n  /** @internal */\n  @Prop() animationFrame = false;\n\n  @Element() hostElement!: HTMLIxTooltipElement;\n\n  @State() private visible = false;\n\n  private hideTooltipTimeout?: NodeJS.Timeout;\n  private showTooltipTimeout?: NodeJS.Timeout;\n  private visibleFor?: Element;\n\n  private disposeAutoUpdate?: () => void;\n  private disposeTriggerListener?: () => void;\n  private disposeTooltipListener?: () => void;\n  private disposeDomChangeListener?: () => void;\n\n  private readonly instance = tooltipInstance++;\n\n  private readonly dialogRef = makeRef<HTMLDialogElement>();\n\n  private get arrowElement(): HTMLElement {\n    return this.hostElement.shadowRoot!.querySelector('.arrow')!;\n  }\n\n  /** @internal */\n  @Method()\n  async showTooltip(anchorElement: Element) {\n    this.clearTimeouts();\n\n    if (this.showTooltipTimeout || this.visibleFor === anchorElement) {\n      return;\n    }\n\n    const dialog = await this.dialogRef.waitForCurrent();\n\n    this.showTooltipTimeout = setTimeout(() => {\n      this.setAnchorElement(anchorElement);\n      dialog.showPopover();\n      this.applyTooltipPosition(anchorElement, dialog);\n      this.registerTooltipListener(dialog);\n    }, this.showDelay);\n  }\n\n  /** @internal */\n  @Method()\n  async hideTooltip(hideDelay: number = this.hideDelay) {\n    this.clearTimeouts();\n\n    if (this.hideTooltipTimeout || !this.visible) {\n      return;\n    }\n\n    if (this.interactive && hideDelay === 50) {\n      hideDelay = 150;\n    }\n\n    const dialog = await this.dialogRef.waitForCurrent();\n\n    this.hideTooltipTimeout = setTimeout(() => {\n      this.setAnchorElement();\n      dialog.hidePopover();\n      this.disposeAutoUpdate?.();\n      this.disposeTooltipListener?.();\n    }, hideDelay);\n  }\n\n  private setAnchorElement(anchorElement?: Element) {\n    if (!anchorElement) {\n      this.visibleFor = undefined;\n      this.visible = false;\n    } else {\n      this.visibleFor = anchorElement;\n      this.visible = true;\n    }\n  }\n\n  private computeArrowPosition({\n    placement,\n    middlewareData,\n  }: ComputePositionReturn): ArrowPosition | undefined {\n    let { x, y } = middlewareData.arrow!;\n    const resetPosition = {\n      top: 'unset',\n      right: 'unset',\n      bottom: 'unset',\n      left: 'unset',\n    };\n\n    if (placement.startsWith('top')) {\n      return {\n        ...resetPosition,\n        left: numberToPixel(x),\n        top: numberToPixel(y),\n      };\n    }\n\n    if (placement.startsWith('right')) {\n      return {\n        ...resetPosition,\n        left: numberToPixel(-6),\n        top: numberToPixel(y),\n      };\n    }\n\n    if (placement.startsWith('bottom')) {\n      return {\n        ...resetPosition,\n        left: numberToPixel(x),\n        top: numberToPixel(-6),\n      };\n    }\n\n    if (placement.startsWith('left')) {\n      return {\n        ...resetPosition,\n        right: numberToPixel(-6),\n        top: numberToPixel(y),\n      };\n    }\n  }\n\n  private async computeTooltipPosition(\n    target: Element,\n    dialog: HTMLDialogElement\n  ): Promise<ComputePositionReturn> {\n    return computePosition(target, dialog, {\n      strategy: 'fixed',\n      placement: this.placement,\n      middleware: [\n        shift(),\n        offset(12),\n        arrow({\n          element: this.arrowElement,\n        }),\n        flip({\n          fallbackStrategy: 'initialPlacement',\n          fallbackAxisSideDirection: 'end',\n          padding: 10,\n        }),\n        hide(),\n      ],\n    });\n  }\n\n  private applyTooltipArrowPosition(computeResponse: ComputePositionReturn) {\n    const arrowPosition = this.computeArrowPosition(computeResponse);\n    Object.assign(this.arrowElement.style, arrowPosition);\n  }\n\n  private async applyTooltipPosition(\n    target: Element,\n    dialog: HTMLDialogElement\n  ): Promise<ComputePositionReturn | undefined> {\n    if (!target) {\n      return;\n    }\n\n    return new Promise<ComputePositionReturn>((resolve) => {\n      this.disposeAutoUpdate?.();\n\n      this.disposeAutoUpdate = autoUpdate(\n        target,\n        dialog,\n        async () => {\n          const computeResponse = await this.computeTooltipPosition(\n            target,\n            dialog\n          );\n\n          const isHidden = computeResponse.middlewareData.hide?.referenceHidden;\n\n          if (isHidden) {\n            this.hideTooltip(0);\n            resolve(computeResponse);\n          }\n\n          if (computeResponse.middlewareData.arrow) {\n            this.applyTooltipArrowPosition(computeResponse);\n          }\n\n          const { x, y } = computeResponse;\n          Object.assign(dialog.style, {\n            left: numberToPixel(x),\n            top: numberToPixel(y),\n          });\n\n          resolve(computeResponse);\n        },\n        {\n          ancestorResize: true,\n          ancestorScroll: true,\n          elementResize: true,\n          animationFrame: this.animationFrame,\n        }\n      );\n    });\n  }\n\n  private async queryAnchorElements(): Promise<HTMLElement[] | undefined> {\n    if (this.for) {\n      if (Array.isArray(this.for)) {\n        return this.resolveElements(this.for);\n      } else {\n        return this.resolveElements([this.for]);\n      }\n    }\n  }\n\n  private async resolveElements(\n    references: ElementReference[]\n  ): Promise<HTMLElement[]> {\n    const elements: HTMLElement[] = [];\n\n    await Promise.all(\n      references.map(async (reference) => {\n        if (typeof reference === 'string') {\n          const resolvedElements = await resolveSelector(\n            reference,\n            this.hostElement\n          );\n\n          if (resolvedElements) {\n            elements.push(...resolvedElements);\n          }\n        } else if (reference instanceof HTMLElement) {\n          elements.push(reference);\n        } else if (reference instanceof Promise) {\n          elements.push(await reference);\n        }\n      })\n    );\n\n    return elements;\n  }\n\n  private async registerTriggerListener() {\n    this.disposeTriggerListener?.();\n\n    const triggerElementList = await this.queryAnchorElements();\n\n    if (!triggerElementList) {\n      return;\n    }\n\n    const listeners: {\n      element: Element | Window | Document;\n      eventType: string;\n      callback: EventListenerOrEventListenerObject;\n    }[] = [];\n\n    triggerElementList.forEach((element) => {\n      listeners.push(\n        ...[\n          {\n            element: element,\n            eventType: 'mouseenter',\n            callback: () => {\n              this.showTooltip(element);\n            },\n          },\n          {\n            element: element,\n            eventType: 'mouseleave',\n            callback: () => {\n              this.hideTooltip();\n            },\n          },\n          {\n            element: element,\n            eventType: 'focus',\n            callback: () => {\n              this.showTooltip(element);\n            },\n          },\n          {\n            element: element,\n            eventType: 'focusout',\n            callback: () => {\n              this.hideTooltip();\n            },\n          },\n        ]\n      );\n    });\n\n    this.disposeTriggerListener = addDisposableEventListenerAsArray(listeners);\n  }\n\n  private registerTooltipListener(dialog: HTMLDialogElement) {\n    this.disposeTooltipListener?.();\n\n    this.disposeTooltipListener = addDisposableEventListenerAsArray([\n      {\n        element: dialog,\n        eventType: 'mouseenter',\n        callback: () => {\n          if (this.interactive) {\n            this.clearHideTimeout();\n          }\n        },\n      },\n      {\n        element: dialog,\n        eventType: 'focus',\n        callback: () => {\n          if (this.interactive) {\n            this.clearHideTimeout();\n          }\n        },\n      },\n      {\n        element: dialog,\n        eventType: 'mouseleave',\n        callback: () => {\n          this.hideTooltip();\n        },\n      },\n      {\n        element: dialog,\n        eventType: 'focusout',\n        callback: () => {\n          this.hideTooltip();\n        },\n      },\n      {\n        element: dialog,\n        eventType: 'click',\n        callback: (event: Event) => {\n          event.stopPropagation();\n        },\n      },\n      {\n        element: document,\n        eventType: 'keydown',\n        callback: (event: Event) => {\n          if ((event as KeyboardEvent).key === 'Escape') {\n            this.hideTooltip();\n          }\n        },\n      },\n    ]);\n  }\n\n  private registerDomChangeListener() {\n    const observer = new MutationObserver(() => {\n      this.registerTriggerListener();\n    });\n\n    observer.observe(document.body, {\n      attributes: true,\n      attributeFilter: ['data-ix-tooltip'],\n      childList: true,\n      subtree: true,\n    });\n\n    this.disposeDomChangeListener = () => {\n      observer.disconnect();\n    };\n  }\n\n  private clearHideTimeout() {\n    clearTimeout(this.hideTooltipTimeout);\n    this.hideTooltipTimeout = undefined;\n  }\n\n  private clearShowTimeout() {\n    clearTimeout(this.showTooltipTimeout);\n    this.showTooltipTimeout = undefined;\n  }\n\n  private clearTimeouts() {\n    this.clearHideTimeout();\n    this.clearShowTimeout();\n  }\n\n  componentWillLoad() {\n    this.registerTriggerListener();\n  }\n\n  componentDidLoad() {\n    this.registerDomChangeListener();\n  }\n\n  disconnectedCallback() {\n    this.clearTimeouts();\n\n    this.disposeAutoUpdate?.();\n    this.disposeTriggerListener?.();\n    this.disposeTooltipListener?.();\n    this.disposeDomChangeListener?.();\n  }\n\n  render() {\n    return (\n      <Host role=\"tooltip\" class={{ visible: this.visible }}>\n        <dialog\n          ref={this.dialogRef}\n          id={'tooltip-' + this.instance}\n          class=\"dialog\"\n          popover=\"manual\"\n          inert={!this.visible}\n        >\n          <div class=\"tooltip-container\">\n            <div class=\"content-wrapper\">\n              <div class={'tooltip-title'}>\n                <slot name=\"title-icon\"></slot>\n                <ix-typography format=\"h5\">\n                  {this.titleContent}\n                  <slot name=\"title-content\"></slot>\n                </ix-typography>\n              </div>\n              <slot></slot>\n              <div class=\"arrow\"></div>\n            </div>\n          </div>\n        </dialog>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/siemens-ix/{p-933f6e1f.entry.js → p-ea310106.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as r,H as o,g as i}from"./p-BNpBEtDH.js";import{f as a,C as s}from"./p-CrTP-icT.js";const c='@charset "UTF-8";:host{position:relative;display:flex;align-items:center;justify-content:center;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}:host .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}:host .text span,:host .text span::before{pointer-events:none}:host .circle{display:flex;justify-content:center;align-items:center;height:3rem;width:3rem;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}:host .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}:host .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}:host .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}:host .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-pill-outline--background);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:14px;color:var(--theme-pill-outline--color);cursor:pointer}:host .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}:host .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}:host .hidden{display:none}:host(.circle){height:72px}:host(.top)::after{top:0}:host(.bottom)::after{bottom:0}:host(.stretched){flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover:not(.circle)){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}:host(:hover:not(.circle))::after{background-color:var(--theme-tab-indicator--background--hover)}:host(:active:not(.circle)){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}:host(:active:not(.circle))::after{background-color:var(--theme-tab-indicator--background--active)}:host(:focus-visible){outline:0px solid var(--focus--border-color)}:host(:focus-visible) .circle{outline:1px solid var(--focus--border-color)}:host(:focus-visible:not(.circle)){outline:1px solid var(--focus--border-color)}:host(.disabled){pointer-events:none;color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}:host(.disabled)::after{background-color:var(--theme-tab-indicator--background--disabled)}:host(.selected:not(.disabled)){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}:host(.selected:not(.disabled))::after{background-color:var(--theme-tab-indicator--background--selected)}:host(.icon){padding:1.5rem 0.5rem}:host(.small-tab){height:32px;padding:1rem}:host(.small-tab.icon){padding:1rem 0.25rem}';const l=class{constructor(r){t(this,r);this.tabClick=e(this,"tabClick",7);this.selected=false;this.disabled=false;this.small=false;this.icon=false;this.rounded=false;this.layout="auto";this.placement="bottom"}tabItemClasses(t){return{selected:t.selected,disabled:t.disabled,"small-tab":t.small,icon:t.small,stretched:t.layout==="stretched",bottom:t.placement==="bottom",top:t.placement==="top",circle:t.circle}}render(){return r(o,{key:"cbdfbecd0c8d59f2929fc30e19c771dc17477e9f",class:this.tabItemClasses({selected:this.selected,disabled:this.disabled,small:this.small,icon:this.icon,layout:this.layout,placement:this.placement,circle:this.rounded}),tabIndex:0,onClick:t=>{if(t.defaultPrevented)return;const e=this.tabClick.emit({nativeEvent:t});if(e.defaultPrevented){t.stopPropagation()}}},r("div",{key:"a791bae7e669185abc5d17f590337e06969ac91b",class:{circle:this.rounded,text:!this.rounded,selected:this.selected,disabled:this.disabled}},r("slot",{key:"4f107c1be1047b45603026cb3bb5dd9fa44ec816"})),r("div",{key:"b0c60b8a83dbff18299be163d950f335e4806285",class:{counter:true,selected:this.selected,hidden:!(this.rounded&&this.counter!==undefined),disabled:this.disabled}},this.counter))}};l.style=c;const n=t=>{if(typeof __zone_symbol__requestAnimationFrame==="function"){return __zone_symbol__requestAnimationFrame(t)}if(typeof requestAnimationFrame==="function"){return requestAnimationFrame(t)}return setTimeout(t)};const h=":host{width:auto;display:flex;align-items:center;position:relative}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .tab-items{overflow:hidden;scroll-behavior:smooth;width:100%}:host .tab-items .items-content{display:flex;align-items:center}:host .arrow{position:absolute;display:flex;align-items:center;justify-content:center;width:32px;height:32px;top:0;bottom:0;left:0;margin:auto 0;border-radius:4px;color:var(--theme-btn-invisible-primary--color);background-color:var(--theme-btn-invisible-primary--background);z-index:2}:host .arrow:hover{color:var(--theme-btn-invisible-primary--color--hover);background-color:var(--theme-btn-invisible-primary--background--hover)}:host .arrow:active{color:var(--theme-btn-invisible-primary--color--active);background-color:var(--theme-btn-invisible-primary--background--active)}:host .arrow.right{left:auto;right:0}:host .overflow-shadow{display:block;position:relative;height:100%;width:100%;pointer-events:all}:host .overflow-shadow.shadow-left{-webkit-mask-image:linear-gradient(90deg, transparent 0px, black 45px);mask-image:linear-gradient(90deg, transparent 0px, black 45px)}:host .overflow-shadow.shadow-right{-webkit-mask-image:linear-gradient(90deg, black calc(100% - 45px), transparent 100%);mask-image:linear-gradient(90deg, black calc(100% - 45px), transparent 100%)}:host .overflow-shadow.shadow-both{-webkit-mask-image:linear-gradient(90deg, transparent 0px, black 45px, black calc(100% - 45px), transparent 100%);mask-image:linear-gradient(90deg, transparent 0px, black 45px, black calc(100% - 45px), transparent 100%)}";const d=class{constructor(r){t(this,r);this.selectedChange=e(this,"selectedChange",7);this.small=false;this.rounded=false;this.selected=0;this.layout="auto";this.placement="bottom";this.totalItems=0;this.currentScrollAmount=0;this.scrollAmount=100;this.scrollActionAmount=0;this.showArrowPrevious=false;this.showArrowNext=false;this.windowStartSize=window.innerWidth;this.clickAction={timeout:null,isClick:true}}onWindowResize(){this.totalItems=0;this.totalItems=this.getTabs().length;if(this.windowStartSize===0)return this.windowStartSize=window.innerWidth;this.move(this.windowStartSize-window.innerWidth);this.windowStartSize=window.innerWidth}getTabs(){return Array.from(this.hostElement.querySelectorAll("ix-tab-item"))}getTab(t){return this.getTabs()[t]}getTabsWrapper(){var t;return(t=this.hostElement.shadowRoot)===null||t===void 0?void 0:t.querySelector(".items-content")}initResizeObserver(){const t=this.hostElement.parentElement;if(!t)return;this.resizeObserver=new ResizeObserver((()=>{this.renderArrows()}));this.resizeObserver.observe(t)}showArrows(){try{const t=this.getTabsWrapper();return t&&t.scrollWidth>Math.ceil(t.getBoundingClientRect().width)&&this.layout==="auto"}catch(t){return false}}showPreviousArrow(){try{return this.showArrows()===true&&this.scrollActionAmount<0}catch(t){return false}}showNextArrow(){try{const t=this.getTabsWrapper();if(!t){return false}const e=t.getBoundingClientRect();return this.showArrows()===true&&this.scrollActionAmount>(t.scrollWidth-e.width)*-1}catch(t){return false}}move(t,e=false){const r=this.getTabsWrapper();if(!r){return}const o=r.getBoundingClientRect().width;const i=-this.currentScrollAmount+o-r.scrollWidth;t=t<i?i:t;t+=this.currentScrollAmount;t=Math.min(t,0);const a=[`transform: translateX(${t}px);`,e?"transition: all ease-in-out 400ms;":""].join("");r.setAttribute("style",a);if(e)this.currentScrollAmount=this.scrollActionAmount=t;else this.scrollActionAmount=t}onSelectedChange(t){var e;if(!this.showArrows())return;const r=this.getTab(t).getBoundingClientRect();const o=(e=this.getTabsWrapper())===null||e===void 0?void 0:e.clientWidth;const i=32;if(r.left<i){this.move(-r.left+i,true)}else if(o&&r.right>o-i){this.move(o-r.right-i,true)}}setSelected(t){this.selected=t}clickTab(t){if(!this.clickAction.isClick||this.dragStop()){return}const{defaultPrevented:e}=this.selectedChange.emit(t);if(e){return}this.setSelected(t)}dragStart(t,e){if(!this.showArrows())return;if(e.button>0)return;this.clickAction.timeout=this.clickAction.timeout===null?setTimeout((()=>this.clickAction.isClick=false),300):null;const r=parseFloat(window.getComputedStyle(t).left);const o=e.clientX;const i=t=>this.dragMove(t,r,o);const a=()=>{window.removeEventListener("mousemove",i,false);window.removeEventListener("click",a,false);this.dragStop()};window.addEventListener("click",a);window.addEventListener("mousemove",i,false)}dragMove(t,e,r){this.move(t.clientX+e-r)}dragStop(){if(this.clickAction.timeout){clearTimeout(this.clickAction.timeout);this.clickAction.timeout=null}if(this.clickAction.isClick)return false;this.currentScrollAmount=this.scrollActionAmount;this.clickAction.isClick=true;return true}componentWillLoad(){const t=this.getTabs();t.map(((t,e)=>{if(this.small)t.setAttribute("small","true");if(this.rounded)t.setAttribute("rounded","true");t.setAttribute("layout",this.layout);t.setAttribute("selected",e===this.selected?"true":"false");t.setAttribute("placement",this.placement)}));this.initResizeObserver()}componentDidRender(){const t=this.getTabs();this.totalItems=t.length;t.map(((t,e)=>{t.setAttribute("selected",e===this.selected?"true":"false")}))}componentWillRender(){this.renderArrows()}renderArrows(){n((()=>{this.showArrowNext=this.showNextArrow();this.showArrowPrevious=this.showPreviousArrow()}))}componentDidLoad(){const t=this.getTabs();t.forEach((t=>{t.addEventListener("mousedown",(e=>this.dragStart(t,e)))}))}disconnectedCallback(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect()}onTabClick(t){if(t.defaultPrevented){return}const e=t.target;const r=this.getTabs();r.forEach(((t,r)=>{if(!t.disabled&&t===e){this.clickTab(r)}}))}render(){return r(o,{key:"d732d69d0c9fe6b8000b683821625cf0e0024974"},this.showArrowPrevious&&r("div",{key:"500a5a3d76313289e652fd8bdad50f56bde3d91f",class:"arrow",onClick:()=>this.move(this.scrollAmount,true)},r("ix-icon",{key:"6acadf35ee826b0814e1152b70f95ee81e6c23c8",name:s})),r("div",{key:"58288db2899bd9fc95ae0e97c70bc789e718a591",class:{"tab-items":true,"overflow-shadow":true,"shadow-left":this.showArrowPrevious,"shadow-right":this.showArrowNext,"shadow-both":this.showArrowNext&&this.showArrowPrevious}},r("div",{key:"08c98c34c63db36d8927c1edbe12083690faf86c",class:"items-content"},r("slot",{key:"e15792a7cd6b6b2679fa46e7e3c1fb37eafdfec6"}))),this.showArrowNext&&r("div",{key:"1c389a54121cc7453a18c7966ba3df6af51dd2da",class:"arrow right",onClick:()=>this.move(-this.scrollAmount,true)},r("ix-icon",{key:"9c604bfb38f9e31f3826ceb27d7ad4682e70c9b6",name:a})))}get hostElement(){return i(this)}static get watchers(){return{selected:["onSelectedChange"]}}};d.style=h;export{l as ix_tab_item,d as ix_tabs};
-//# sourceMappingURL=p-933f6e1f.entry.js.map
+import{r as t,c as e,h as r,H as o,g as a}from"./p-BNpBEtDH.js";import{f as i,C as s}from"./p-CrTP-icT.js";const c='@charset "UTF-8";:host{position:relative;display:flex;align-items:center;justify-content:center;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}:host .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}:host .text span,:host .text span::before{pointer-events:none}:host .circle{display:flex;justify-content:center;align-items:center;height:3rem;width:3rem;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}:host .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}:host .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}:host .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}:host .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-pill-outline--background);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:14px;color:var(--theme-pill-outline--color);cursor:pointer}:host .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}:host .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}:host .hidden{display:none}:host(.circle){height:72px}:host(.top)::after{top:0}:host(.bottom)::after{bottom:0}:host(.stretched){flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover:not(.circle)){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}:host(:hover:not(.circle))::after{background-color:var(--theme-tab-indicator--background--hover)}:host(:active:not(.circle)){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}:host(:active:not(.circle))::after{background-color:var(--theme-tab-indicator--background--active)}:host(:focus-visible){outline:0px solid var(--focus--border-color)}:host(:focus-visible) .circle{outline:1px solid var(--focus--border-color)}:host(:focus-visible:not(.circle)){outline:1px solid var(--focus--border-color)}:host(.disabled){pointer-events:none;color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}:host(.disabled)::after{background-color:var(--theme-tab-indicator--background--disabled)}:host(.selected:not(.disabled)){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}:host(.selected:not(.disabled))::after{background-color:var(--theme-tab-indicator--background--selected)}:host(.icon){padding:1.5rem 0.5rem}:host(.small-tab){height:32px;padding:1rem}:host(.small-tab.icon){padding:1rem 0.25rem}';const l=class{constructor(r){t(this,r);this.tabClick=e(this,"tabClick",7);this.selected=false;this.disabled=false;this.small=false;this.icon=false;this.rounded=false;this.layout="auto";this.placement="bottom"}tabItemClasses(t){return{selected:t.selected,disabled:t.disabled,"small-tab":t.small,icon:t.small,stretched:t.layout==="stretched",bottom:t.placement==="bottom",top:t.placement==="top",circle:t.circle}}render(){return r(o,{key:"a096af02399a879b9b7ed8562fccee14f9ddc0dd",class:this.tabItemClasses({selected:this.selected,disabled:this.disabled,small:this.small,icon:this.icon,layout:this.layout,placement:this.placement,circle:this.rounded}),tabIndex:0,onClick:t=>{if(t.defaultPrevented)return;const e=this.tabClick.emit({nativeEvent:t});if(e.defaultPrevented){t.stopPropagation()}}},r("div",{key:"189d7bf9653455ed4680d1c9479617069c709f5a",class:{circle:this.rounded,text:!this.rounded,selected:this.selected,disabled:this.disabled}},r("slot",{key:"ada9f604be911038afe1e1b2a540a7159b72b8e8"})),r("div",{key:"6505968a278bfeb85b323d90ef46fe8183b8415d",class:{counter:true,selected:this.selected,hidden:!(this.rounded&&this.counter!==undefined),disabled:this.disabled}},this.counter))}};l.style=c;const n=t=>{if(typeof __zone_symbol__requestAnimationFrame==="function"){return __zone_symbol__requestAnimationFrame(t)}if(typeof requestAnimationFrame==="function"){return requestAnimationFrame(t)}return setTimeout(t)};const h=":host{width:auto;display:flex;align-items:center;position:relative}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .tab-items{overflow:hidden;scroll-behavior:smooth;width:100%}:host .tab-items .items-content{display:flex;align-items:center}:host .arrow{position:absolute;display:flex;align-items:center;justify-content:center;width:32px;height:32px;top:0;bottom:0;left:0;margin:auto 0;border-radius:4px;color:var(--theme-btn-invisible-primary--color);background-color:var(--theme-btn-invisible-primary--background);z-index:2}:host .arrow:hover{color:var(--theme-btn-invisible-primary--color--hover);background-color:var(--theme-btn-invisible-primary--background--hover)}:host .arrow:active{color:var(--theme-btn-invisible-primary--color--active);background-color:var(--theme-btn-invisible-primary--background--active)}:host .arrow.right{left:auto;right:0}:host .overflow-shadow{display:block;position:relative;height:100%;width:100%;pointer-events:all}:host .overflow-shadow.shadow-left{-webkit-mask-image:linear-gradient(90deg, transparent 0px, black 45px);mask-image:linear-gradient(90deg, transparent 0px, black 45px)}:host .overflow-shadow.shadow-right{-webkit-mask-image:linear-gradient(90deg, black calc(100% - 45px), transparent 100%);mask-image:linear-gradient(90deg, black calc(100% - 45px), transparent 100%)}:host .overflow-shadow.shadow-both{-webkit-mask-image:linear-gradient(90deg, transparent 0px, black 45px, black calc(100% - 45px), transparent 100%);mask-image:linear-gradient(90deg, transparent 0px, black 45px, black calc(100% - 45px), transparent 100%)}";const d=class{constructor(r){t(this,r);this.selectedChange=e(this,"selectedChange",7);this.small=false;this.rounded=false;this.selected=0;this.layout="auto";this.placement="bottom";this.totalItems=0;this.currentScrollAmount=0;this.scrollAmount=100;this.scrollActionAmount=0;this.showArrowPrevious=false;this.showArrowNext=false;this.windowStartSize=window.innerWidth;this.clickAction={timeout:null,isClick:true}}onWindowResize(){this.totalItems=0;this.totalItems=this.getTabs().length;if(this.windowStartSize===0)return this.windowStartSize=window.innerWidth;this.move(this.windowStartSize-window.innerWidth);this.windowStartSize=window.innerWidth}getTabs(){return Array.from(this.hostElement.querySelectorAll("ix-tab-item"))}getTab(t){return this.getTabs()[t]}getTabsWrapper(){var t;return(t=this.hostElement.shadowRoot)===null||t===void 0?void 0:t.querySelector(".items-content")}initResizeObserver(){const t=this.hostElement.parentElement;if(!t)return;this.resizeObserver=new ResizeObserver((()=>{this.renderArrows()}));this.resizeObserver.observe(t)}showArrows(){try{const t=this.getTabsWrapper();return t&&t.scrollWidth>Math.ceil(t.getBoundingClientRect().width)&&this.layout==="auto"}catch(t){return false}}showPreviousArrow(){try{return this.showArrows()===true&&this.scrollActionAmount<0}catch(t){return false}}showNextArrow(){try{const t=this.getTabsWrapper();if(!t){return false}const e=t.getBoundingClientRect();return this.showArrows()===true&&this.scrollActionAmount>(t.scrollWidth-e.width)*-1}catch(t){return false}}move(t,e=false){const r=this.getTabsWrapper();if(!r){return}const o=r.getBoundingClientRect().width;const a=-this.currentScrollAmount+o-r.scrollWidth;t=t<a?a:t;t+=this.currentScrollAmount;t=Math.min(t,0);const i=[`transform: translateX(${t}px);`,e?"transition: all ease-in-out 400ms;":""].join("");r.setAttribute("style",i);if(e)this.currentScrollAmount=this.scrollActionAmount=t;else this.scrollActionAmount=t}onSelectedChange(t){var e;if(!this.showArrows())return;const r=this.getTab(t).getBoundingClientRect();const o=(e=this.getTabsWrapper())===null||e===void 0?void 0:e.clientWidth;const a=32;if(r.left<a){this.move(-r.left+a,true)}else if(o&&r.right>o-a){this.move(o-r.right-a,true)}}setSelected(t){this.selected=t}clickTab(t){if(!this.clickAction.isClick||this.dragStop()){return}const{defaultPrevented:e}=this.selectedChange.emit(t);if(e){return}this.setSelected(t)}dragStart(t,e){if(!this.showArrows())return;if(e.button>0)return;this.clickAction.timeout=this.clickAction.timeout===null?setTimeout((()=>this.clickAction.isClick=false),300):null;const r=parseFloat(window.getComputedStyle(t).left);const o=e.clientX;const a=t=>this.dragMove(t,r,o);const i=()=>{window.removeEventListener("mousemove",a,false);window.removeEventListener("click",i,false);this.dragStop()};window.addEventListener("click",i);window.addEventListener("mousemove",a,false)}dragMove(t,e,r){this.move(t.clientX+e-r)}dragStop(){if(this.clickAction.timeout){clearTimeout(this.clickAction.timeout);this.clickAction.timeout=null}if(this.clickAction.isClick)return false;this.currentScrollAmount=this.scrollActionAmount;this.clickAction.isClick=true;return true}componentWillLoad(){const t=this.getTabs();t.map(((t,e)=>{if(this.small)t.setAttribute("small","true");if(this.rounded)t.setAttribute("rounded","true");t.setAttribute("layout",this.layout);t.setAttribute("selected",e===this.selected?"true":"false");t.setAttribute("placement",this.placement)}));this.initResizeObserver()}componentDidRender(){const t=this.getTabs();this.totalItems=t.length;t.map(((t,e)=>{t.setAttribute("selected",e===this.selected?"true":"false")}))}componentWillRender(){this.renderArrows()}renderArrows(){n((()=>{this.showArrowNext=this.showNextArrow();this.showArrowPrevious=this.showPreviousArrow()}))}componentDidLoad(){const t=this.getTabs();t.forEach((t=>{t.addEventListener("mousedown",(e=>this.dragStart(t,e)))}))}disconnectedCallback(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect()}onTabClick(t){if(t.defaultPrevented){return}const e=t.target;const r=this.getTabs();r.forEach(((t,r)=>{if(!t.disabled&&t===e){this.clickTab(r)}}))}render(){return r(o,{key:"087e7e19b3ad5f5c759d8f083350cfa22f209da3"},this.showArrowPrevious&&r("div",{key:"d339e9498044204193be9ee20b6c7a8a7ea885b1",class:"arrow",onClick:()=>this.move(this.scrollAmount,true)},r("ix-icon",{key:"f4703821ad1adf4bc75c3697693486cc33f9f830",name:s})),r("div",{key:"cffe3545110b1638cafdc2643c2fbbbe3eabe303",class:{"tab-items":true,"overflow-shadow":true,"shadow-left":this.showArrowPrevious,"shadow-right":this.showArrowNext,"shadow-both":this.showArrowNext&&this.showArrowPrevious}},r("div",{key:"4162663c6e5894b3e7467413a5a5fd05a7912f79",class:"items-content"},r("slot",{key:"3f55e88974efedcc9091073eab61a9746d6dbb38"}))),this.showArrowNext&&r("div",{key:"e8b9eed8a5457a0c29c82ffe0098a8e70a22a2ac",class:"arrow right",onClick:()=>this.move(-this.scrollAmount,true)},r("ix-icon",{key:"59a5552eddceab33b773d7c00aa5416d9fed35b7",name:i})))}get hostElement(){return a(this)}static get watchers(){return{selected:["onSelectedChange"]}}};d.style=h;export{l as ix_tab_item,d as ix_tabs};
+//# sourceMappingURL=p-ea310106.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["tabItemCss","TabItem","constructor","hostRef","this","selected","disabled","small","icon","rounded","layout","placement","tabItemClasses","props","stretched","bottom","top","circle","render","h","Host","key","class","tabIndex","onClick","event","defaultPrevented","clientEvent","tabClick","emit","nativeEvent","stopPropagation","text","counter","hidden","undefined","requestAnimationFrameNoNgZone","callback","__zone_symbol__requestAnimationFrame","requestAnimationFrame","setTimeout","tabsCss","Tabs","totalItems","currentScrollAmount","scrollAmount","scrollActionAmount","showArrowPrevious","showArrowNext","windowStartSize","window","innerWidth","clickAction","timeout","isClick","onWindowResize","getTabs","length","move","Array","from","hostElement","querySelectorAll","getTab","getTabsWrapper","_a","shadowRoot","querySelector","initResizeObserver","parentElement","resizeObserver","ResizeObserver","renderArrows","observe","showArrows","tabWrapper","scrollWidth","Math","ceil","getBoundingClientRect","width","error","showPreviousArrow","showNextArrow","tabWrapperRect","amount","click","tabsWrapper","tabsWrapperVisibleWidth","maxScrollWidth","min","styles","join","setAttribute","onSelectedChange","newValue","tabRect","wrapperWidth","clientWidth","arrowWidth","left","right","setSelected","index","clickTab","dragStop","selectedChange","dragStart","element","button","tabPositionX","parseFloat","getComputedStyle","mousedownPositionX","clientX","dragMove","windowClick","removeEventListener","addEventListener","tabX","mousedownX","clearTimeout","componentWillLoad","tabs","map","componentDidRender","componentWillRender","componentDidLoad","forEach","disconnectedCallback","disconnect","onTabClick","target","tab","name","iconChevronLeftSmall","iconChevronRightSmall"],"sources":["src/components/tab-item/tab-item.scss?tag=ix-tab-item&encapsulation=shadow","src/components/tab-item/tab-item.tsx","src/components/utils/requestAnimationFrame.ts","src/components/tabs/tabs.scss?tag=ix-tabs&encapsulation=shadow","src/components/tabs/tabs.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 10px $large-space;\n  line-height: 20px;\n  font-size: 14px;\n  font-weight: bold;\n  background-color: var(--theme-tab--background);\n  color: var(--theme-tab--color);\n\n  &::after {\n    content: '';\n    position: absolute;\n    background-color: var(--theme-tab-indicator--background);\n    width: 100%;\n    height: var(--theme-tab-indicator--height);\n    left: 0;\n  }\n\n  .text {\n    @include ellipsis;\n\n    span,\n    span::before {\n      pointer-events: none;\n    }\n\n    vertical-align: middle;\n  }\n\n  .circle {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 3rem;\n    width: 3rem;\n    background-color: var(--theme-animated-tab-indicator--background);\n    border-radius: 50%;\n    border: 2px solid var(--theme-animated-tab-circle--border-color);\n    color: var(--theme-an…icon--color);\n    cursor: pointer;\n\n    &.selected:not(.disabled) {\n      background-color: var(--theme-animated-tab-circle--background--selected);\n      color: var(--theme-animated-tab-icon--color--selected);\n      border-color: var(--theme-animated-tab-circle--border-color--selected);\n\n      &:hover {\n        background-color: var(\n          --theme-animated-tab-circle--background--selected\n        );\n      }\n    }\n\n    &:hover {\n      background-color: var(--theme-animated-tab-circle--background--hover);\n    }\n\n    &:active {\n      background-color: var(--theme-animated-tab-circle--background--active);\n    }\n\n    &:active {\n      background-color: var(--theme-animated-tab-circle--background--active);\n    }\n\n    &.disabled {\n      background-color: var(--theme-animated-tab-circle--background--disabled);\n      border-color: var(--theme-animated-tab-circle--border-color--disabled);\n    }\n  }\n\n  .counter {\n    position: absolute;\n    z-index: 1;\n    height: 16px;\n    width: auto;\n    background-color: var(--theme-pill-outline--background);\n    border: 1px solid var(--theme-tab-pill--border-color);\n    border-radius: 100px;\n    bottom: 6px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    padding-left: $tiny-space;\n    padding-right: $tiny-space;\n    font-size: 12px;\n    line-height: 14px;\n    color: var(--theme-pill-outline--color);\n    cursor: pointer;\n\n    &.selected {\n      border-color: var(--theme-tab-pill--border-color--selected);\n    }\n\n    &.disabled {\n      border-color: var(--theme-tab-pill--border-color--disabled);\n    }\n  }\n\n  .hidden {\n    display: none;\n  }\n}\n\n:host(.circle) {\n  height: 72px;\n}\n\n:host(.top) {\n  &::after {\n    top: 0;\n  }\n}\n\n:host(.bottom) {\n  &::after {\n    bottom: 0;\n  }\n}\n\n:host(.stretched) {\n  flex-basis: 100%;\n  width: 100%;\n  @include ellipsis;\n}\n\n:host(:hover:not(.circle)) {\n  background-color: var(--theme-tab--background--hover);\n  color: var(--theme-tab-color-hover);\n  cursor: pointer;\n\n  &::after {\n    background-color: var(--theme-tab-indicator--background--hover);\n  }\n}\n\n:host(:active:not(.circle)) {\n  background-color: var(--theme-tab--background--active);\n  color: var(--theme-tab-color--active);\n\n  &::after {\n    background-color: var(--theme-tab-indicator--background--active);\n  }\n}\n\n:host(:focus-visible) {\n  outline: 0px solid var(--focus--border-color);\n\n  .circle {\n    outline: 1px solid var(--focus--border-color);\n  }\n}\n\n:host(:focus-visible:not(.circle)) {\n  outline: 1px solid var(--focus--border-color);\n}\n\n:host(.disabled) {\n  pointer-events: none;\n  color: var(--theme-tab--color--disabled);\n  background-color: var(--theme-tab--background--disabled);\n\n  &::after {\n    background-color: var(--theme-tab-indicator--background--disabled);\n  }\n}\n\n:host(.selected:not(.disabled)) {\n  background-color: var(--theme-tab--background--selected);\n  color: var(--theme-tab--color--selected);\n\n  &::after {\n    background-color: var(--theme-tab-indicator--background--selected);\n  }\n}\n\n:host(.icon) {\n  padding: $large-space $small-space;\n}\n\n:host(.small-tab) {\n  height: 32px;\n  padding: $default-space;\n}\n\n:host(.small-tab.icon) {\n  padding: $default-space $tiny-space;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\nexport type TabClickDetail = {\n  nativeEvent: MouseEvent;\n};\n\n@Component({\n  tag: 'ix-tab-item',\n  styleUrl: 'tab-item.scss',\n  shadow: true,\n})\nexport class TabItem {\n  /**\n   * Set selected tab\n   */\n  @Prop() selected = false;\n\n  /**\n   * Set disabled tab\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Set small size tab\n   */\n  @Prop() small = false;\n\n  /**\n   * Set icon only tab\n   */\n  @Prop() icon = false;\n\n  /**\n   * Set rounded tab\n   */\n  @Prop() rounded = false;\n\n  /**\n   * Set counter value\n   */\n  @Prop() counter?: number;\n\n  /**\n   * Set layout width style\n   */\n  @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n  /**\n   * Set selected placement\n   */\n  @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n  /**\n   * Emitted when the tab is clicked.\n   */\n  @Event() tabClick!: EventEmitter<TabClickDetail>;\n\n  private tabItemClasses(props: {\n    selected: boolean;\n    disabled: boolean;\n    small: boolean;\n    icon: boolean;\n    circle: boolean;\n    layout: 'auto' | 'stretched';\n    placement: 'bottom' | 'top';\n  }) {\n    return {\n      selected: props.selected,\n      disabled: props.disabled,\n      'small-tab': props.small,\n      icon: props.small,\n      stretched: props.layout === 'stretched',\n      bottom: props.placement === 'bottom',\n      top: props.placement === 'top',\n      circle: props.circle,\n    };\n  }\n\n  render() {\n    return (\n      <Host\n        class={this.tabItemClasses({\n          selected: this.selected,\n          disabled: this.disabled,\n          small: this.small,\n          icon: this.icon,\n          layout: this.layout,\n          placement: this.placement,\n          circle: this.rounded,\n        })}\n        tabIndex={0}\n        onClick={(event: MouseEvent) => {\n          if (event.defaultPrevented) return;\n\n          const clientEvent = this.tabClick.emit({\n            nativeEvent: event,\n          });\n\n          if (clientEvent.defaultPrevented) {\n            event.stopPropagation();\n          }\n        }}\n      >\n        <div\n          class={{\n            circle: this.rounded,\n            text: !this.rounded,\n            selected: this.selected,\n            disabled: this.disabled,\n          }}\n        >\n          <slot></slot>\n        </div>\n        <div\n          class={{\n            counter: true,\n            selected: this.selected,\n            hidden: !(this.rounded && this.counter !== undefined),\n            disabled: this.disabled,\n          }}\n        >\n          {this.counter}\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\ndeclare const __zone_symbol__requestAnimationFrame: any;\n\n/**\n * Prevents angular from change detection when requesting an animation frame\n *\n * Credits goes to:\n * https://github.com/ionic-team/ionic-framework/blob/main/core/src/utils/helpers.ts\n */\nexport const requestAnimationFrameNoNgZone = (\n  callback: (...args: any[]) => void\n) => {\n  if (typeof __zone_symbol__requestAnimationFrame === 'function') {\n    return __zone_symbol__requestAnimationFrame(callback);\n  }\n  if (typeof requestAnimationFrame === 'function') {\n    return requestAnimationFrame(callback);\n  }\n  return setTimeout(callback);\n};\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n  @include ix-component;\n  width: auto;\n  display: flex;\n  align-items: center;\n  position: relative;\n\n  .tab-items {\n    overflow: hidden;\n    scroll-behavior: smooth;\n    width: 100%;\n\n    .items-content {\n      display: flex;\n      align-items: center;\n    }\n  }\n\n  .arrow {\n    position: absolute;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    margin: auto 0;\n    border-radius: 4px;\n    color: var(--theme-btn-invisible-primary--color);\n    background-color: var(--theme-btn-invisible-primary--background);\n    z-index: 2;\n\n    &:hover {\n      color: var(--theme-btn-invisible-primary--color--hover);\n      background-color: var(--theme-btn-invisible-primary--background--hover);\n    }\n\n    &:active {\n      color: var(--theme-btn-invisible-primary--color--active);\n      background-color: var(--theme-btn-invisible-primary--background--active);\n    }\n\n    &.right {\n      left: auto;\n      right: 0;\n    }\n  }\n\n  .overflow-shadow {\n    display: block;\n    position: relative;\n    height: 100%;\n    width: 100%;\n    pointer-events: all;\n\n    &.shadow-left {\n      mask-image: linear-gradient(90deg, transparent 0px, black 45px);\n    }\n\n    &.shadow-right {\n      mask-image: linear-gradient(\n        90deg,\n        black calc(100% - 45px),\n        transparent 100%\n      );\n    }\n\n    &.shadow-both {\n      mask-image: linear-gradient(\n        90deg,\n        transparent 0px,\n        black 45px,\n        black calc(100% - 45px),\n        transparent 100%\n      );\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\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 { requestAnimationFrameNoNgZone } from '../utils/requestAnimationFrame';\nimport {\n  iconChevronLeftSmall,\n  iconChevronRightSmall,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-tabs',\n  styleUrl: 'tabs.scss',\n  shadow: true,\n})\nexport class Tabs {\n  @Element() hostElement!: HTMLIxTabsElement;\n\n  /**\n   * Set tab items to small size\n   */\n  @Prop() small = false;\n\n  /**\n   * Set rounded tabs\n   */\n  @Prop() rounded = false;\n\n  /**\n   * Set default selected tab by index\n   */\n  @Prop({ mutable: true }) selected = 0;\n\n  /**\n   * Set layout width style\n   */\n  @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n  /**\n   * Set placement style\n   */\n  @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n  /**\n   * `selected` property changed\n   */\n  @Event() selectedChange!: EventEmitter<number>;\n\n  @State() totalItems = 0;\n  @State() currentScrollAmount = 0;\n  @State() scrollAmount = 100;\n  @State() scrollActionAmount = 0;\n  @State() showArrowPrevious = false;\n  @State() showArrowNext = false;\n\n  private windowStartSize = window.innerWidth;\n  private resizeObserver?: ResizeObserver;\n\n  private clickAction: {\n    timeout: NodeJS.Timeout | null;\n    isClick: boolean;\n  } = {\n    timeout: null,\n    isClick: true,\n  };\n\n  @Listen('resize', { target: 'window' })\n  onWindowResize() {\n    this.totalItems = 0;\n    this.totalItems = this.getTabs().length;\n\n    if (this.windowStartSize === 0)\n      return (this.windowStartSize = window.innerWidth);\n    this.move(this.windowStartSize - window.innerWidth);\n    this.windowStartSize = window.innerWidth;\n  }\n\n  private getTabs() {\n    return Array.from(this.hostElement.querySelectorAll('ix-tab-item'));\n  }\n\n  private getTab(tabIndex: number) {\n    return this.getTabs()[tabIndex];\n  }\n\n  private getTabsWrapper() {\n    return this.hostElement.shadowRoot?.querySelector('.items-content');\n  }\n\n  private initResizeObserver() {\n    const parentElement = this.hostElement.parentElement;\n    if (!parentElement) return;\n    this.resizeObserver = new ResizeObserver(() => {\n      this.renderArrows();\n    });\n    this.resizeObserver.observe(parentElement);\n  }\n\n  private showArrows() {\n    try {\n      const tabWrapper = this.getTabsWrapper();\n      return (\n        tabWrapper &&\n        tabWrapper.scrollWidth >\n          Math.ceil(tabWrapper.getBoundingClientRect().width) &&\n        this.layout === 'auto'\n      );\n    } catch (error) {\n      return false;\n    }\n  }\n\n  private showPreviousArrow() {\n    try {\n      return this.showArrows() === true && this.scrollActionAmount < 0;\n    } catch (error) {\n      return false;\n    }\n  }\n\n  private showNextArrow() {\n    try {\n      const tabWrapper = this.getTabsWrapper();\n\n      if (!tabWrapper) {\n        return false;\n      }\n\n      const tabWrapperRect = tabWrapper.getBoundingClientRect();\n\n      return (\n        this.showArrows() === true &&\n        this.scrollActionAmount >\n          (tabWrapper.scrollWidth - tabWrapperRect.width) * -1\n      );\n    } catch (error) {\n      return false;\n    }\n  }\n\n  private move(amount: number, click = false) {\n    const tabsWrapper = this.getTabsWrapper();\n\n    if (!tabsWrapper) {\n      return;\n    }\n\n    const tabsWrapperVisibleWidth = tabsWrapper.getBoundingClientRect().width;\n    const maxScrollWidth =\n      -this.currentScrollAmount +\n      tabsWrapperVisibleWidth -\n      tabsWrapper.scrollWidth;\n\n    amount = amount < maxScrollWidth ? maxScrollWidth : amount;\n    amount += this.currentScrollAmount;\n    amount = Math.min(amount, 0);\n\n    const styles = [\n      `transform: translateX(${amount}px);`,\n      click ? 'transition: all ease-in-out 400ms;' : '',\n    ].join('');\n\n    tabsWrapper.setAttribute('style', styles);\n\n    if (click) this.currentScrollAmount = this.scrollActionAmount = amount;\n    else this.scrollActionAmount = amount;\n  }\n\n  @Watch('selected')\n  onSelectedChange(newValue: number) {\n    if (!this.showArrows()) return;\n\n    const tabRect = this.getTab(newValue).getBoundingClientRect();\n    const wrapperWidth = this.getTabsWrapper()?.clientWidth;\n    const arrowWidth = 32;\n\n    if (tabRect.left < arrowWidth) {\n      this.move(-tabRect.left + arrowWidth, true);\n    } else if (wrapperWidth && tabRect.right > wrapperWidth - arrowWidth) {\n      this.move(wrapperWidth - tabRect.right - arrowWidth, true);\n    }\n  }\n\n  private setSelected(index: number) {\n    this.selected = index;\n  }\n\n  private clickTab(index: number) {\n    if (!this.clickAction.isClick || this.dragStop()) {\n      return;\n    }\n\n    const { defaultPrevented } = this.selectedChange.emit(index);\n    if (defaultPrevented) {\n      return;\n    }\n\n    this.setSelected(index);\n  }\n\n  private dragStart(element: HTMLIxTabItemElement, event: MouseEvent) {\n    if (!this.showArrows()) return;\n    if (event.button > 0) return;\n\n    this.clickAction.timeout =\n      this.clickAction.timeout === null\n        ? setTimeout(() => (this.clickAction.isClick = false), 300)\n        : null;\n\n    const tabPositionX = parseFloat(window.getComputedStyle(element).left);\n    const mousedownPositionX = event.clientX;\n    const move = (event: MouseEvent) =>\n      this.dragMove(event, tabPositionX, mousedownPositionX);\n    const windowClick = () => {\n      window.removeEventListener('mousemove', move, false);\n      window.removeEventListener('click', windowClick, false);\n      this.dragStop();\n    };\n    window.addEventListener('click', windowClick);\n    window.addEventListener('mousemove', move, false);\n  }\n\n  private dragMove(event: MouseEvent, tabX: number, mousedownX: number) {\n    this.move(event.clientX + tabX - mousedownX);\n  }\n\n  private dragStop() {\n    if (this.clickAction.timeout) {\n      clearTimeout(this.clickAction.timeout);\n      this.clickAction.timeout = null;\n    }\n\n    if (this.clickAction.isClick) return false;\n\n    this.currentScrollAmount = this.scrollActionAmount;\n    this.clickAction.isClick = true;\n\n    return true;\n  }\n\n  componentWillLoad() {\n    const tabs = this.getTabs();\n\n    tabs.map((element, index) => {\n      if (this.small) element.setAttribute('small', 'true');\n\n      if (this.rounded) element.setAttribute('rounded', 'true');\n\n      element.setAttribute('layout', this.layout);\n      element.setAttribute(\n        'selected',\n        index === this.selected ? 'true' : 'false'\n      );\n\n      element.setAttribute('placement', this.placement);\n    });\n\n    this.initResizeObserver();\n  }\n\n  componentDidRender() {\n    const tabs = this.getTabs();\n    this.totalItems = tabs.length;\n\n    tabs.map((element, index) => {\n      element.setAttribute(\n        'selected',\n        index === this.selected ? 'true' : 'false'\n      );\n    });\n  }\n\n  componentWillRender() {\n    this.renderArrows();\n  }\n\n  private renderArrows() {\n    requestAnimationFrameNoNgZone(() => {\n      this.showArrowNext = this.showNextArrow();\n      this.showArrowPrevious = this.showPreviousArrow();\n    });\n  }\n\n  componentDidLoad() {\n    const tabs = this.getTabs();\n    tabs.forEach((element) => {\n      element.addEventListener('mousedown', (event) =>\n        this.dragStart(element, event)\n      );\n    });\n  }\n\n  disconnectedCallback() {\n    this.resizeObserver?.disconnect();\n  }\n\n  @Listen('tabClick')\n  onTabClick(event: CustomEvent) {\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    const target = event.target;\n    const tabs = this.getTabs();\n\n    tabs.forEach((tab, index) => {\n      if (!tab.disabled && tab === target) {\n        this.clickTab(index);\n      }\n    });\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.showArrowPrevious && (\n          <div class=\"arrow\" onClick={() => this.move(this.scrollAmount, true)}>\n            <ix-icon name={iconChevronLeftSmall}></ix-icon>\n          </div>\n        )}\n        <div\n          class={{\n            'tab-items': true,\n            'overflow-shadow': true,\n            'shadow-left': this.showArrowPrevious,\n            'shadow-right': this.showArrowNext,\n            'shadow-both': this.showArrowNext && this.showArrowPrevious,\n          }}\n        >\n          <div class=\"items-content\">\n            <slot></slot>\n          </div>\n        </div>\n        {this.showArrowNext && (\n          <div\n            class=\"arrow right\"\n            onClick={() => this.move(-this.scrollAmount, true)}\n          >\n            <ix-icon name={iconChevronRightSmall}></ix-icon>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}