@siemens/ix 1.4.0 → 1.5.0-beta.0

package/dist/siemens-ix/p-5ce07b8b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["f","module","exports","r","e","n","t","o","i","c","require","u","a","Error","code","p","call","length","_dereq_","Object","defineProperty","value","_createClass","defineProperties","target","props","descriptor","enumerable","configurable","writable","key","Constructor","protoProps","staticProps","prototype","_defineProperty","obj","_classCallCheck","instance","TypeError","defaultConfig","width","height","isNumber","input","Number","addClass","document","documentElement","element","className","classList","add","oldClass","getAttribute","setAttribute","HyperList","create","userProvidedConfig","mergeStyle","style","getMaxBrowserHeight","wrapper","createElement","fixture","position","opacity","appendChild","body","maxElementHeight","offsetHeight","removeChild","_this","this","_config","_lastRepaint","_maxElementHeight","refresh","config","render","scrollTop","_getScrollPosition","lastRepaint","_renderAnimationFrame","window","requestAnimationFrame","diff","_averageHeight","rendered","_renderChunk","afterRender","destroy","cancelAnimationFrame","_scrollerStyle","assign","nodeType","_element","scroller","_scroller","scrollerTagName","useFragment","generate","total","Array","isArray","itemHeight","trim","_itemHeights","fill","keys","filter","prop","forEach","isValueNumber","msg","isHoriz","Boolean","horizontal","isValuePercent","slice","numberValue","parseInt","replace","innerSize","_containerSize","scrollContainer","scrollerHeight","console","warn","join","elementStyle","overflow","scrollerStyle","padding","_computeScrollPadding","_scrollPaddingBottom","bottom","_scrollPaddingTop","top","_scrollHeight","_computeScrollHeight","_itemPositions","_computePositions","_getRow","item","undefined","rowClassName","overrideScrollPosition","force","from","reverse","_getReverseFrom","_getFrom","_screenItemsLen","_lastFrom","to","_cachedItemsLen","fragment","createDocumentFragment","row","applyPatch","innerHTML","arguments","_HyperList$mergeStyle2","_this2","scrollHeight","reduce","b","sortedItemHeights","sort","middle","Math","floor","averageHeight","clientProp","containerHeight","ceil","max","scrollLeft","isReverse","styles","getComputedStyle","location","cssValue","getPropertyValue","default","treeCss","Tree","toggleListener","Map","itemClickListener","updates","hasFirstRender","getVirtualizerOptions","list","buildTreeList","model","root","setToggleListener","el","index","hasChildren","has","toggleCallback","preventDefault","stopPropagation","context","getContext","id","isExpanded","setContext","addEventListener","set","renderedTreeItem","host","querySelector","doUpdate","get","update","callback","innerElement","renderItem","renderDefaultItem","paddingLeft","level","paddingRight","itemClickCallback","values","isSelected","contextChange","emit","itemList","newLevel","children","push","componentDidLoad","initList","observer","MutationObserver","records","removed","record","removedNodes","addedNodes","an","indexOf","splice","nodeRemoved","observe","childList","componentWillRender","isListInitialized","refreshList","disconnectedCallback","hyperlist","disconnect","modelChange","itemPositions","_a","some","isNaN","Hyperlist","h","Host","treeItemCss","TreeItem","class","selected","onClick","toggle","name","size","_b","color","_c","itemClick","text"],"sources":["../../node_modules/hyperlist/dist/hyperlist.js","./src/components/tree/tree.css?tag=ix-tree&encapsulation=scoped","./src/components/tree/tree.tsx","./src/components/tree-item/tree-item.scss?tag=ix-tree-item&encapsulation=scoped","./src/components/tree-item/tree-item.tsx"],"sourcesContent":["(function(f){if(typeof exports===\"object\"&&typeof module!==\"undefined\"){module.exports=f()}else if(typeof define===\"function\"&&define.amd){define([],f)}else{var g;if(typeof window!==\"undefined\"){g=window}else if(typeof global!==\"undefined\"){g=global}else if(typeof self!==\"undefined\"){g=self}else{g=this}g.HyperList = f()}})(function(){var define,module,exports;return (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c=\"function\"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error(\"Cannot find module '\"+i+\"'\");throw a.code=\"MODULE_NOT_FOUND\",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u=\"function\"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(_dereq_,module,exports){\n'use strict';\n\n// Default configuration.\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nvar defaultConfig = {\n  width: '100%',\n  height: '100%'\n\n  // Check for valid number.\n};var isNumber = function isNumber(input) {\n  return Number(input) === Number(input);\n};\n\n// Add a class to an element.\nvar addClass = 'classList' in document.documentElement ? function (element, className) {\n  element.classList.add(className);\n} : function (element, className) {\n  var oldClass = element.getAttribute('class') || '';\n  element.setAttribute('class', oldClass + ' ' + className);\n};\n\n/**\n * Creates a HyperList instance that virtually scrolls very large amounts of\n * data effortlessly.\n */\n\nvar HyperList = function () {\n  _createClass(HyperList, null, [{\n    key: 'create',\n    value: function create(element, userProvidedConfig) {\n      return new HyperList(element, userProvidedConfig);\n    }\n\n    /**\n     * Merge given css style on an element\n     * @param {DOMElement} element\n     * @param {Object} style\n     */\n\n  }, {\n    key: 'mergeStyle',\n    value: function mergeStyle(element, style) {\n      for (var i in style) {\n        if (element.style[i] !== style[i]) {\n          element.style[i] = style[i];\n        }\n      }\n    }\n  }, {\n    key: 'getMaxBrowserHeight',\n    value: function 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      var wrapper = document.createElement('div');\n      var 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      HyperList.mergeStyle(wrapper, { position: 'absolute', height: '1px', opacity: 0 });\n      HyperList.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      var 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\n  function HyperList(element, userProvidedConfig) {\n    var _this = this;\n\n    _classCallCheck(this, HyperList);\n\n    this._config = {};\n    this._lastRepaint = null;\n    this._maxElementHeight = HyperList.getMaxBrowserHeight();\n\n    this.refresh(element, userProvidedConfig);\n\n    var config = this._config;\n\n    // Create internal render loop.\n    var render = function render() {\n      var scrollTop = _this._getScrollPosition();\n      var lastRepaint = _this._lastRepaint;\n\n      _this._renderAnimationFrame = window.requestAnimationFrame(render);\n\n      if (scrollTop === lastRepaint) {\n        return;\n      }\n\n      var diff = lastRepaint ? scrollTop - lastRepaint : 0;\n      if (!lastRepaint || diff < 0 || diff > _this._averageHeight) {\n        var 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  _createClass(HyperList, [{\n    key: 'destroy',\n    value: function destroy() {\n      window.cancelAnimationFrame(this._renderAnimationFrame);\n    }\n  }, {\n    key: 'refresh',\n    value: function refresh(element, userProvidedConfig) {\n      var _scrollerStyle;\n\n      Object.assign(this._config, defaultConfig, 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      var config = this._config;\n\n      var scroller = this._scroller || config.scroller || 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        Invalid required `itemHeight` value, expected number or array\\n      '.trim());\n      } else if (isNumber(config.itemHeight)) {\n        this._itemHeights = Array(config.total).fill(config.itemHeight);\n      } else {\n        this._itemHeights = config.itemHeight;\n      }\n\n      // Width and height should be coerced to string representations. Either in\n      // `%` or `px`.\n      Object.keys(defaultConfig).filter(function (prop) {\n        return prop in config;\n      }).forEach(function (prop) {\n        var value = config[prop];\n        var isValueNumber = isNumber(value);\n\n        if (value && typeof value !== 'string' && typeof value !== 'number') {\n          var 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      var isHoriz = Boolean(config.horizontal);\n      var value = config[isHoriz ? 'width' : 'height'];\n\n      if (value) {\n        var isValueNumber = isNumber(value);\n        var isValuePercent = isValueNumber ? false : value.slice(-1) === '%';\n        // Compute the containerHeight as number\n        var numberValue = isValueNumber ? value : parseInt(value.replace(/px|%/, ''), 10);\n        var innerSize = window[isHoriz ? '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      var scrollContainer = config.scrollContainer;\n      var scrollerHeight = config.itemHeight * config.total;\n      var maxElementHeight = this._maxElementHeight;\n\n      if (scrollerHeight > maxElementHeight) {\n        console.warn(['HyperList: The maximum element height', maxElementHeight + 'px has', 'been exceeded; please reduce your item height.'].join(' '));\n      }\n\n      // Decorate the container element with styles that will match\n      // the user supplied configuration.\n      var elementStyle = {\n        width: '' + config.width,\n        height: scrollContainer ? scrollerHeight + 'px' : '' + config.height,\n        overflow: scrollContainer ? 'none' : 'auto',\n        position: 'relative'\n      };\n\n      HyperList.mergeStyle(element, elementStyle);\n\n      if (scrollContainer) {\n        HyperList.mergeStyle(config.scrollContainer, { overflow: 'auto' });\n      }\n\n      var scrollerStyle = (_scrollerStyle = {\n        opacity: '0',\n        position: 'absolute'\n      }, _defineProperty(_scrollerStyle, isHoriz ? 'height' : 'width', '1px'), _defineProperty(_scrollerStyle, isHoriz ? 'width' : 'height', scrollerHeight + 'px'), _scrollerStyle);\n\n      HyperList.mergeStyle(scroller, scrollerStyle);\n\n      // Only append the scroller element once.\n      if (!this._scroller) {\n        element.appendChild(scroller);\n      }\n\n      var 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    key: '_getRow',\n    value: function _getRow(i) {\n      var config = this._config;\n      var item = config.generate(i);\n      var 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(i);\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      var top = this._itemPositions[i] + this._scrollPaddingTop;\n\n      HyperList.mergeStyle(item, _defineProperty({\n        position: 'absolute'\n      }, config.horizontal ? 'left' : 'top', top + 'px'));\n\n      return item;\n    }\n  }, {\n    key: '_getScrollPosition',\n    value: function _getScrollPosition() {\n      var 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    key: '_renderChunk',\n    value: function _renderChunk(force) {\n      var config = this._config;\n      var element = this._element;\n      var scrollTop = this._getScrollPosition();\n      var total = config.total;\n\n      var from = config.reverse ? this._getReverseFrom(scrollTop) : 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      var 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      var fragment = config.useFragment ? document.createDocumentFragment() : []\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      ;var scroller = this._scroller;\n\n      // Keep the scroller in the list of children.\n      fragment[config.useFragment ? 'appendChild' : 'push'](scroller);\n\n      for (var i = from; i < to; i++) {\n        var 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    key: '_computePositions',\n    value: function _computePositions() {\n      var from = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;\n\n      var config = this._config;\n      var total = config.total;\n      var reverse = config.reverse;\n\n      if (from < 1 && !reverse) {\n        from = 1;\n      }\n\n      for (var i = from; i < total; i++) {\n        if (reverse) {\n          if (i === 0) {\n            this._itemPositions[0] = this._scrollHeight - this._itemHeights[0];\n          } else {\n            this._itemPositions[i] = this._itemPositions[i - 1] - this._itemHeights[i];\n          }\n        } else {\n          this._itemPositions[i] = this._itemHeights[i - 1] + this._itemPositions[i - 1];\n        }\n      }\n    }\n  }, {\n    key: '_computeScrollHeight',\n    value: function _computeScrollHeight() {\n      var _HyperList$mergeStyle2,\n          _this2 = this;\n\n      var config = this._config;\n      var isHoriz = Boolean(config.horizontal);\n      var total = config.total;\n      var scrollHeight = this._itemHeights.reduce(function (a, b) {\n        return a + b;\n      }, 0) + this._scrollPaddingBottom + this._scrollPaddingTop;\n\n      HyperList.mergeStyle(this._scroller, (_HyperList$mergeStyle2 = {\n        opacity: 0,\n        position: 'absolute',\n        top: '0px'\n      }, _defineProperty(_HyperList$mergeStyle2, isHoriz ? 'height' : 'width', '1px'), _defineProperty(_HyperList$mergeStyle2, isHoriz ? 'width' : 'height', scrollHeight + 'px'), _HyperList$mergeStyle2));\n\n      // Calculate the height median\n      var sortedItemHeights = this._itemHeights.slice(0).sort(function (a, b) {\n        return a - b;\n      });\n      var middle = Math.floor(total / 2);\n      var averageHeight = total % 2 === 0 ? (sortedItemHeights[middle] + sortedItemHeights[middle - 1]) / 2 : sortedItemHeights[middle];\n\n      var clientProp = isHoriz ? 'clientWidth' : 'clientHeight';\n      var element = config.scrollContainer ? config.scrollContainer : this._element;\n      var containerHeight = element[clientProp] ? element[clientProp] : 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(this._cachedItemsLen || 0, this._screenItemsLen * 3);\n      this._averageHeight = averageHeight;\n\n      if (config.reverse) {\n        window.requestAnimationFrame(function () {\n          if (isHoriz) {\n            _this2._element.scrollLeft = scrollHeight;\n          } else {\n            _this2._element.scrollTop = scrollHeight;\n          }\n        });\n      }\n\n      return scrollHeight;\n    }\n  }, {\n    key: '_computeScrollPadding',\n    value: function _computeScrollPadding() {\n      var config = this._config;\n      var isHoriz = Boolean(config.horizontal);\n      var isReverse = config.reverse;\n      var styles = window.getComputedStyle(this._element);\n\n      var padding = function padding(location) {\n        var cssValue = styles.getPropertyValue('padding-' + location);\n        return parseInt(cssValue, 10) || 0;\n      };\n\n      if (isHoriz && isReverse) {\n        return {\n          bottom: padding('left'),\n          top: padding('right')\n        };\n      } else if (isHoriz) {\n        return {\n          bottom: padding('right'),\n          top: padding('left')\n        };\n      } else if (isReverse) {\n        return {\n          bottom: padding('top'),\n          top: padding('bottom')\n        };\n      } else {\n        return {\n          bottom: padding('bottom'),\n          top: padding('top')\n        };\n      }\n    }\n  }, {\n    key: '_getFrom',\n    value: function _getFrom(scrollTop) {\n      var i = 0;\n\n      while (this._itemPositions[i] < scrollTop) {\n        i++;\n      }\n\n      return i;\n    }\n  }, {\n    key: '_getReverseFrom',\n    value: function _getReverseFrom(scrollTop) {\n      var i = this._config.total - 1;\n\n      while (i > 0 && this._itemPositions[i] < scrollTop + this._containerSize) {\n        i--;\n      }\n\n      return i;\n    }\n  }]);\n\n  return HyperList;\n}();\n\nexports.default = HyperList;\nmodule.exports = exports['default'];\n\n},{}]},{},[1])(1)\n});\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n  display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  Watch,\n} from '@stencil/core';\nimport Hyperlist from 'hyperlist';\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';\n\n@Component({\n  tag: 'ix-tree',\n  styleUrl: 'tree.css',\n  scoped: true,\n})\nexport class Tree {\n  @Element() host!: 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   * Context changed\n   */\n  @Event() contextChange: EventEmitter<TreeContext>;\n\n  /**\n   * Emits removed nodes\n   */\n  @Event() nodeRemoved: EventEmitter<any>;\n\n  private hyperlist: Hyperlist;\n\n  private toggleListener = new Map<HTMLElement, Function>();\n  private itemClickListener = new Map<HTMLElement, Function>();\n  private updates = new Map<string, UpdateCallback>();\n\n  private observer: MutationObserver;\n\n  private hasFirstRender = false;\n\n  private getVirtualizerOptions() {\n    const list = this.buildTreeList(this.model[this.root]);\n\n    let setToggleListener = (\n      item: TreeItemVisual<any>,\n      el: HTMLElement,\n      index: number\n    ) => {\n      if (item.hasChildren && !this.toggleListener.has(el)) {\n        const toggleCallback = (e: Event) => {\n          e.preventDefault();\n          e.stopPropagation();\n          const context = this.getContext(list[index].id);\n          context.isExpanded = !context.isExpanded;\n          this.setContext(item.id, context);\n        };\n        el.addEventListener('toggle', toggleCallback);\n        this.toggleListener.set(el, toggleCallback);\n      }\n    };\n\n    return {\n      itemHeight: 32,\n      total: list.length,\n      generate: (index: number) => {\n        const item = list[index];\n        const renderedTreeItem = this.host.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          setToggleListener(item, renderedTreeItem, index);\n\n          if (this.updates.has(item.id)) {\n            const doUpdate = this.updates.get(item.id);\n            doUpdate(item, { ...this.context });\n          }\n\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.paddingLeft = item.level + 'rem';\n        el.style.paddingRight = '1rem';\n\n        if (!this.itemClickListener.has(el)) {\n          const itemClickCallback = (e: Event) => {\n            e.preventDefault();\n            e.stopPropagation();\n            Object.values(this.context).forEach((c) => (c.isSelected = false));\n            const context = this.getContext(item.id);\n            context.isSelected = true;\n            this.setContext(item.id, context);\n          };\n          el.addEventListener('itemClick', itemClickCallback);\n          this.itemClickListener.set(el, itemClickCallback);\n        }\n\n        setToggleListener(item, el, index);\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 = [];\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.host, {\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  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    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.host, this.getVirtualizerOptions());\n    }\n  }\n\n  private initList() {\n    this.hyperlist?.destroy();\n    const config = this.getVirtualizerOptions();\n    this.hyperlist = new Hyperlist(this.host, config);\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'mixins/hover';\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n  display: flex;\n  align-items: center;\n\n  height: 32px;\n  width: 100%;\n\n  cursor: pointer;\n\n  &:not(.disabled):not(:disabled):not(.selected) {\n    &.hover,\n    &:hover {\n      background-color: var(--theme-tree-item--background--hover);\n    }\n\n    &.active,\n    &:active {\n      background-color: var(--theme-tree-item--background--active);\n    }\n  }\n\n  &.selected {\n    background-color: var(--theme-tree-item--background--selected);\n\n    &.hover,\n    &:hover {\n      background-color: var(--theme-tree-item--background--selected-hover);\n    }\n\n    &.active,\n    &:active {\n      background-color: var(--theme-tree-item--background--selected-active);\n    }\n  }\n\n  .tree-node-container {\n    display: flex;\n    align-items: center;\n    height: $x-large-space;\n    flex-grow: 1;\n    align-items: center;\n  }\n\n  .icon-toggle-container {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 2rem;\n    height: 2rem;\n\n    ix-icon {\n      transition: transform $default-time ease-in-out;\n\n      &.icon-toggle-down {\n        transform: rotate(90deg);\n      }\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport { TreeItemContext } from '../tree/tree-model';\n\n@Component({\n  tag: 'ix-tree-item',\n  styleUrl: 'tree-item.scss',\n  scoped: true,\n})\nexport class TreeItem {\n  /**\n   * Text\n   */\n  @Prop() text: string;\n\n  /**\n   * Has tree item children\n   */\n  @Prop() hasChildren: boolean;\n\n  /**\n   * Context\n   */\n  @Prop() context: TreeItemContext;\n\n  /**\n   * Expand/Collapsed toggled\n   */\n  @Event() toggle: EventEmitter<void>;\n\n  /**\n   * Clicked\n   */\n  @Event() itemClick: EventEmitter<void>;\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.context?.isSelected,\n        }}\n      >\n        <div\n          class=\"icon-toggle-container\"\n          onClick={(e) => {\n            e.preventDefault();\n            this.toggle.emit();\n          }}\n        >\n          {this.hasChildren ? (\n            <ix-icon\n              name=\"chevron-right\"\n              size=\"16\"\n              class={{\n                ['icon-toggle-down']: this.context?.isExpanded,\n              }}\n              color={`color-${\n                this.context?.isExpanded ? 'primary' : 'std-text'\n              }`}\n            />\n          ) : null}\n        </div>\n        <div\n          class=\"tree-node-container\"\n          onClick={() => {\n            this.itemClick.emit();\n          }}\n        >\n          {this.text}\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/p-5d7e1440.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as s,H as t}from"./p-8fcd6f85.js";const h=".sc-ix-icon-h{display:inline-flex;height:1.5rem;width:1.5rem;color:var(--theme-color-std-text)}.sc-ix-icon-h i.sc-ix-icon{color:inherit;transition:color 150ms}.size-12.sc-ix-icon-h{height:0.75rem;width:0.75rem}.size-16.sc-ix-icon-h{height:1rem;width:1rem}.size-32.sc-ix-icon-h{height:2rem;width:2rem}";const e=class{constructor(s){i(this,s);this.size=undefined;this.color=undefined;this.name=undefined}render(){return s(t,{style:{color:this.color?`var(--theme-${this.color})`:"inherit"},class:{["size-12"]:this.size==="12",["size-16"]:this.size==="16",["size-24"]:this.size==="24",["size-32"]:this.size==="32"}},s("i",{class:{glyph:true,[`glyph-${this.name}`]:true,"glyph-12":this.size==="12","glyph-16":this.size==="16","glyph-24":this.size==="24","glyph-32":this.size==="32"}},s("slot",null)))}};e.style=h;export{e as ix_icon};
+//# sourceMappingURL=p-5d7e1440.entry.js.map

package/dist/siemens-ix/p-5d7e1440.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["iconCss","Icon","render","h","Host","style","color","this","class","size","glyph","name"],"sources":["./src/components/icon/icon.scss?tag=ix-icon&encapsulation=scoped","./src/components/icon/icon.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\n:host {\n  display: inline-flex;\n  height: $large-space;\n  width: $large-space;\n\n  color: var(--theme-color-std-text);\n\n  i {\n    color: inherit;\n    transition: color $default-time;\n  }\n}\n\n:host(.size-12) {\n  height: $medium-space;\n  width: $medium-space;\n}\n\n:host(.size-16) {\n  height: $default-space;\n  width: $default-space;\n}\n\n:host(.size-32) {\n  height: $x-large-space;\n  width: $x-large-space;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-icon',\n  styleUrl: 'icon.scss',\n  scoped: true,\n})\nexport class Icon {\n  /**\n   * Size of the icon\n   */\n  @Prop() size: '12' | '16' | '24' | '32';\n\n  /**\n   * Color of the icon\n   */\n  @Prop() color: string;\n\n  /**\n   * Use one of our defined icon names e.g. `copy`.\n   */\n  @Prop({ reflect: true }) name: string;\n\n  render() {\n    return (\n      <Host\n        style={{\n          color: this.color ? `var(--theme-${this.color})` : 'inherit',\n        }}\n        class={{\n          ['size-12']: this.size === '12',\n          ['size-16']: this.size === '16',\n          ['size-24']: this.size === '24',\n          ['size-32']: this.size === '32',\n        }}\n      >\n        <i\n          class={{\n            glyph: true,\n            [`glyph-${this.name}`]: true,\n            'glyph-12': this.size === '12',\n            'glyph-16': this.size === '16',\n            'glyph-24': this.size === '24',\n            'glyph-32': this.size === '32',\n          }}\n        >\n          <slot></slot>\n        </i>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAU,+S,MCgBHC,EAAI,M,sFAgBfC,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACLC,MAAOC,KAAKD,MAAQ,eAAeC,KAAKD,SAAW,WAErDE,MAAO,CACL,CAAC,WAAYD,KAAKE,OAAS,KAC3B,CAAC,WAAYF,KAAKE,OAAS,KAC3B,CAAC,WAAYF,KAAKE,OAAS,KAC3B,CAAC,WAAYF,KAAKE,OAAS,OAG7BN,EAAA,KACEK,MAAO,CACLE,MAAO,KACP,CAAC,SAASH,KAAKI,QAAS,KACxB,WAAYJ,KAAKE,OAAS,KAC1B,WAAYF,KAAKE,OAAS,KAC1B,WAAYF,KAAKE,OAAS,KAC1B,WAAYF,KAAKE,OAAS,OAG5BN,EAAA,c"}

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

@@ -0,0 +1,2 @@
+import{r as e,h as n,H as r}from"./p-8fcd6f85.js";const t=":host{display:flex;justify-content:center;align-items:center;-webkit-margin-start:1.5rem;margin-inline-start:1.5rem;-webkit-margin-end:1.5rem;margin-inline-end:1.5rem;-webkit-margin-after:0.25rem;margin-block-end:0.25rem}:host slot::slotted(*){display:flex;-webkit-margin-end:0.625rem;margin-inline-end:0.625rem}";const i=class{constructor(n){e(this,n)}render(){return n(r,null,n("slot",null))}};i.style=t;export{i as ix_dropdown_quick_actions};
+//# sourceMappingURL=p-63666529.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownQuickActionsCss","DropdownQuickActions","render","h","Host"],"sources":["./src/components/dropdown-quick-actions/dropdown-quick-actions.scss?tag=ix-dropdown-quick-actions&encapsulation=shadow","./src/components/dropdown-quick-actions/dropdown-quick-actions.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\n:host {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-inline-start: $large-space;\n  margin-inline-end: $large-space;\n  margin-block-end: $tiny-space;\n\n  slot::slotted(*) {\n    display: flex;\n    margin-inline-end: 0.625rem;\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 { Component, h, Host } from '@stencil/core';\n\n/**\n * @since 1.4.0\n */\n@Component({\n  tag: 'ix-dropdown-quick-actions',\n  styleUrl: 'dropdown-quick-actions.scss',\n  shadow: true,\n})\nexport class DropdownQuickActions {\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAA0B,2T,MCkBnBC,EAAoB,M,yBAC/BC,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,a"}

package/dist/siemens-ix/p-63e1264b.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as e}from"./p-8fcd6f85.js";const o={"x-small":"text-xs",small:"text-s",caption:"text-caption","caption-single":"text-caption-single",default:"text-default","default-single":"text-default-single",large:"text-l","large-single":"text-l-single",h2:"text-h2","display-large":"text-xl","default-title":"text-default-title","default-title-single":"text-default-title-single"};const s=":host .text-xs{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}:host .text-s{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}:host .text-caption{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host .text-caption-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}:host .text-default{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}:host .text-default-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}:host .text-default-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}:host .text-default-title-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}:host .text-l{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}:host .text-l-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}:host .text-l-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}:host .text-l-title-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}:host .text-h2{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}:host .text-xl{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}";const i=class{constructor(e){t(this,e);this.variant="default"}render(){const t={[o[this.variant]]:true};return e("div",{class:t},e("slot",null))}};i.style=s;export{i as ix_typography};
+//# sourceMappingURL=p-63e1264b.entry.js.map

package/dist/siemens-ix/p-63e1264b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["VariantsMapping","small","caption","default","large","h2","typographyCss","IxTypography","render","typographyClass","this","variant","h","class"],"sources":["./src/components/typography/types.ts","./src/components/typography/typography.scss?tag=ix-typography&encapsulation=shadow","./src/components/typography/typography.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nexport type TypographyVariants =\n  | 'x-small'\n  | 'small'\n  | 'caption'\n  | 'caption-single'\n  | 'default'\n  | 'default-single'\n  | 'default-title'\n  | 'default-title-single'\n  | 'large'\n  | 'large-single'\n  | 'h2'\n  | 'display-large';\n\nexport const VariantsMapping: Record<TypographyVariants, string> = {\n  'x-small': 'text-xs',\n  small: 'text-s',\n  caption: 'text-caption',\n  'caption-single': 'text-caption-single',\n  default: 'text-default',\n  'default-single': 'text-default-single',\n  large: 'text-l',\n  'large-single': 'text-l-single',\n  h2: 'text-h2',\n  'display-large': 'text-xl',\n  'default-title': 'text-default-title',\n  'default-title-single': 'text-default-title-single',\n};\n","@import 'common-variables';\n@import 'mixins/fonts';\n\n:host {\n  .text-xs {\n    @include text-xs;\n  }\n\n  .text-s {\n    @include text-s;\n  }\n\n  .text-caption {\n    @include text-caption;\n  }\n\n  .text-caption-single {\n    @include text-caption-single;\n  }\n\n  .text-default {\n    @include text-default;\n  }\n\n  .text-default-single {\n    @include text-default-single;\n  }\n\n  .text-default-title {\n    @include text-default-title;\n  }\n\n  .text-default-title-single {\n    @include text-default-title-single;\n  }\n\n  .text-l {\n    @include text-l;\n  }\n\n  .text-l-single {\n    @include text-l-single;\n  }\n\n  .text-l-title {\n    @include text-l-title;\n  }\n\n  .text-l-title-single {\n    @include text-l-title-single;\n  }\n\n  .text-h2 {\n    @include text-h2;\n  }\n\n  .text-xl {\n    @include text-xl;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Prop } from '@stencil/core';\nimport { TypographyVariants, VariantsMapping } from './types';\n\n/**\n * @internal\n */\n@Component({\n  tag: 'ix-typography',\n  styleUrl: 'typography.scss',\n  shadow: true,\n})\nexport class IxTypography {\n  /**\n   * Font variant\n   */\n  @Prop() variant: TypographyVariants = 'default';\n\n  render() {\n    const typographyClass = {\n      [VariantsMapping[this.variant]]: true,\n    };\n    return (\n      <div class={typographyClass}>\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"],"mappings":"2CAsBO,MAAMA,EAAsD,CACjE,UAAW,UACXC,MAAO,SACPC,QAAS,eACT,iBAAkB,sBAClBC,QAAS,eACT,iBAAkB,sBAClBC,MAAO,SACP,eAAgB,gBAChBC,GAAI,UACJ,gBAAiB,UACjB,gBAAiB,qBACjB,uBAAwB,6BClC1B,MAAMC,EAAgB,k6F,MCoBTC,EAAY,M,sCAIe,S,CAEtCC,SACE,MAAMC,EAAkB,CACtB,CAACT,EAAgBU,KAAKC,UAAW,MAEnC,OACEC,EAAA,OAAKC,MAAOJ,GACVG,EAAA,a"}

package/dist/siemens-ix/p-65b6330a.entry.js

@@ -0,0 +1,2 @@
+import{r,h as e,H as d,g as a}from"./p-8fcd6f85.js";const t=".card.sc-ix-date-time-card{background-color:var(--theme-menu--background);width:100%;box-shadow:none;border:none;border-radius:unset}.card.individual.sc-ix-date-time-card{box-shadow:0 0 2px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 12px 18px 0px rgba(0, 0, 0, 0.1);border:1px solid var(--theme-menu--border-color);border-radius:4px}.card.left.sc-ix-date-time-card{border-radius:4px 0 0 4px;height:100%}.card.right.sc-ix-date-time-card{border-radius:0 4px 4px 0;height:100%}.card.sc-ix-date-time-card .header.sc-ix-date-time-card{padding:1rem}.card.sc-ix-date-time-card .separator.sc-ix-date-time-card{border:1px solid var(--theme-datepicker-separator--background);width:100%}.card.sc-ix-date-time-card .content.sc-ix-date-time-card{height:100%;padding:0px 1rem 1rem 1rem}";const i=class{constructor(e){r(this,e);this.individual=true;this.corners="rounded"}cardClasses(){return{card:true,individual:this.individual,left:this.corners==="left",right:this.corners==="right"}}render(){return e(d,null,e("div",{class:this.cardClasses()},e("div",{class:"header"},e("slot",{name:"header"})),e("div",{class:"separator"}),e("div",{class:"content"},e("slot",null))))}get hostElement(){return a(this)}};i.style=t;export{i as ix_date_time_card};
+//# sourceMappingURL=p-65b6330a.entry.js.map

package/dist/siemens-ix/p-65b6330a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dateTimeCardCss","DateTimeCard","cardClasses","card","individual","this","left","corners","right","render","h","Host","class","name"],"sources":["./src/components/date-time-card/date-time-card.scss?tag=ix-date-time-card&encapsulation=scoped","./src/components/date-time-card/date-time-card.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n\n.card {\n  background-color: var(--theme-menu--background);\n  width: 100%;\n  box-shadow: none;\n  border: none;\n  border-radius: unset;\n\n  &.individual {\n    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1),\n      0 4px 8px 0 rgba(0, 0, 0, 0.1),\n      0 12px 18px 0px rgba(0, 0, 0, 0.1);\n    border: 1px solid var(--theme-menu--border-color);\n    border-radius: 4px;\n  }\n\n  &.left {\n    border-radius: 4px 0 0 4px;\n    height: 100%;\n  }\n\n  &.right {\n    border-radius: 0 4px 4px 0;\n    height: 100%;\n  }\n\n  .header {\n    padding: $default-space;\n  }\n\n  .separator {\n    border: 1px solid var(--theme-datepicker-separator--background);\n    width: 100%;\n  }\n\n  .content {\n    height: 100%;\n    padding: 0px $default-space $default-space $default-space;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop } from '@stencil/core';\n\nexport type DateTimeCardCorners = 'rounded' | 'left' | 'right';\n\n/**\n * @internal\n */\n@Component({\n  tag: 'ix-date-time-card',\n  styleUrl: 'date-time-card.scss',\n  scoped: true,\n})\nexport class DateTimeCard {\n  @Element() hostElement: HTMLIxDateTimeCardElement;\n\n  /**\n   * set styles\n   */\n  @Prop() individual: boolean = true;\n\n  /**\n   * Set corners style\n   */\n  @Prop() corners: DateTimeCardCorners = 'rounded';\n\n  private cardClasses() {\n    return {\n      card: true,\n      individual: this.individual,\n      left: this.corners === 'left',\n      right: this.corners === 'right',\n    };\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.cardClasses()}>\n          <div class=\"header\">\n            <slot name=\"header\"></slot>\n          </div>\n\n          <div class=\"separator\"></div>\n\n          <div class=\"content\">\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oDAAA,MAAMA,EAAkB,oxB,MCqBXC,EAAY,M,yCAMO,K,aAKS,S,CAE/BC,cACN,MAAO,CACLC,KAAM,KACNC,WAAYC,KAAKD,WACjBE,KAAMD,KAAKE,UAAY,OACvBC,MAAOH,KAAKE,UAAY,Q,CAI5BE,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAOP,KAAKH,eACfQ,EAAA,OAAKE,MAAM,UACTF,EAAA,QAAMG,KAAK,YAGbH,EAAA,OAAKE,MAAM,cAEXF,EAAA,OAAKE,MAAM,WACTF,EAAA,e"}

package/dist/siemens-ix/p-6790d123.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,H as s,g as n,f as o}from"./p-8fcd6f85.js";import{m as a,h as r,i as m}from"./p-529d7530.js";import{a as h}from"./p-21aa3602.js";import{s as l}from"./p-1572aab3.js";import{t as c}from"./p-323d5529.js";import"./p-9ee41861.js";const u="ix-menu{display:flex;flex-direction:row;position:absolute;height:100%;min-height:22.75rem;z-index:var(--theme-z-index-sticky);width:auto}ix-menu .menu{display:flex;flex-direction:column;position:relative;width:4rem;height:100%;-webkit-padding-after:1rem;padding-block-end:1rem;overflow:hidden;background-color:var(--theme-nav--background);transition:width var(--animate-duration)}ix-menu .menu.expanded{box-shadow:var(--theme-navigation--box-shadow)}ix-menu .menu .burger-menu{margin:0.75rem 0 1rem 0.75rem}ix-menu .menu-overlay{display:block;position:absolute;width:calc(100vw - 4rem);height:100%;left:4rem;z-index:-1;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem);background-color:var(--theme-sidebar-overlay-blur);transition:all 300ms ease-out}ix-menu .menu-overlay-invisible{display:none}ix-menu .menu.expanded{width:16rem}ix-menu .menu-overlay.expanded{width:calc(100vw - 16rem);left:16rem}ix-menu #avatar-tab-placeholder{max-height:3rem}ix-menu .avatar{margin-bottom:2rem}ix-menu #cui-imprint .cui-imprint-product-name{margin-bottom:1rem}ix-menu #cui-imprint .cui-imprint-product-description{margin-bottom:2rem}ix-menu #cui-imprint .cui-imprint-link-container{display:flex;align-items:center}ix-menu .bottom-tab-divider{margin-top:auto}ix-menu.mode-mobile .menu:not(.expanded){width:0}ix-menu.mode-mobile .menu{padding-top:2rem}ix-menu.mode-mobile .menu .burger-menu{display:none}ix-menu.mode-mobile .menu-overlay{left:0px;width:100vw}a[href]:has(>ix-menu-item){text-decoration:none}";const d=class{constructor(i){t(this,i);this.expandChange=e(this,"expandChange",7);this.mapExpandChange=e(this,"mapExpandChange",7);this.domObserver=new MutationObserver(this.onDomChange.bind(this));this.isVisible=t=>{var e,i;return t.style.display!=="none"&&((i=(e=t.parentElement)===null||e===void 0?void 0:e.parentElement)===null||i===void 0?void 0:i.style.display)!=="none"};this.showSettings=false;this.showAbout=false;this.enableToggleTheme=false;this.enableSettings=true;this.enableMapExpand=false;this.applicationName=undefined;this.applicationDescription="";this.maxVisibleMenuItems=9;this.i18nLegal="About & legal information";this.i18nSettings="Settings";this.i18nToggleTheme="Toggle theme";this.i18nExpand=" Expand";this.i18nCollapse="Collapse";this.i18nMore="More…";this.expand=false;this.showMoreItems=false;this.visibleMenuItems=0;this.countMoreNotifications=0;this.mapExpand=true;this.activeTab=undefined;this.isMoreTabEmpty=false;this.mode="desktop"}onWindowResize(){this.visibleMenuItems=this.getMaxTabCount()}handleNodeMutation(t){if(!(t instanceof HTMLElement)){return}if(t.matches(".tab")){this.onWindowResize()}if(t.matches("ix-menu-about")&&this.menu.contains(t)){this.appendAbout()}if(t.matches("ix-menu-settings")&&this.menu.contains(t)){this.appendSettings()}}onDomChange(t){t.forEach((t=>{t.addedNodes.forEach(this.handleNodeMutation.bind(this));t.removedNodes.forEach(this.handleNodeMutation.bind(this))}))}get popoverArea(){return this.hostElement.querySelector("#popover-area")}get overlayContainer(){return this.hostElement.querySelector(".menu-overlay")}get invisibleContainer(){return this.hostElement.querySelector(".menu-overlay-invisible")}get menu(){return this.hostElement.querySelector(".menu")}get menuItems(){return Array.from(this.hostElement.querySelectorAll('ix-menu-item:not(.internal-tab):not(.home-tab):not(.bottom-tab):not([slot="bottom"])')).filter(this.isVisible)}get menuBottomItems(){return Array.from(this.hostElement.querySelectorAll("ix-menu-item.bottom-tab:not(.internal-tab):not(.home-tab)")).filter(this.isVisible)}get homeTab(){return this.hostElement.querySelector("ix-menu-item.home-tab")}get moreItemsDropdown(){return this.hostElement.querySelector(".internal-tab ix-dropdown")}get isMoreItemsDropdownEmpty(){return this.hostElement.querySelectorAll(".internal-tab ix-dropdown .appended").length===0}get moreItemsDropdownItems(){return this.hostElement.querySelectorAll(".internal-tab ix-dropdown ix-menu-item")}get activeMoreTabContainer(){return this.hostElement.querySelector(".active-more-tab")}get activeMoreTab(){return this.hostElement.querySelector(".active-more-tab ix-menu-item")}get aboutPopoverContainer(){return this.hostElement.querySelector(".about-news")}get aboutPopover(){return document.querySelector("ix-menu-about-news")}get aboutTab(){return this.hostElement.querySelector("#aboutAndLegal")}get about(){return this.hostElement.querySelector("ix-menu-about")}get settings(){return this.hostElement.querySelector("ix-menu-settings")}get isSettingsEmpty(){return Array.from(this.hostElement.querySelectorAll("ix-menu-settings-item")).length===0}get avatarItem(){return this.hostElement.querySelector("ix-menu-avatar")}get tabsContainer(){return this.hostElement.querySelector("#menu-tabs")}showTab(t){return t+1<=this.visibleMenuItems}componentDidLoad(){var t,e,i,s;(t=this.settings)===null||t===void 0?void 0:t.addEventListener("close",(()=>{this.showSettings=false;this.settings.show=this.showSettings}));(e=this.settings)===null||e===void 0?void 0:e.addEventListener("animationend",(()=>{if(!this.showSettings){this.settings.classList.add("d-none");this.overlayContainer.classList.add("d-none")}}));(i=this.about)===null||i===void 0?void 0:i.addEventListener("close",(()=>{this.showAbout=false;this.about.show=this.showAbout}));(s=this.about)===null||s===void 0?void 0:s.addEventListener("animationend",(()=>{if(!this.showAbout){this.about.classList.add("d-none");this.overlayContainer.classList.add("d-none")}}));this.overlayContainer.classList.add("d-none");this.onWindowResize();this.domObserver.observe(this.hostElement,{attributes:false,childList:true,subtree:true})}componentWillLoad(){a.register(this.hostElement);const t=r("ix-basic-navigation",this.hostElement);if(m(t)&&t.hideHeader===false){l.onChange.on((t=>this.mode=t));this.mode=l.mode}}componentWillRender(){this.appendTabs()}componentDidRender(){this.visibleMenuItems=this.getMaxTabCount();this.appendFragments()}appendFragments(){this.appendAvatar();this.appendAbout();this.appendSettings();this.appendAboutNewsPopover();this.isMoreTabEmpty=this.isMoreItemsDropdownEmpty;this.countMoreNotifications=this.getMoreNotificationsCount()}resetActiveTab(){this.activeTab=null}isMenuItemActive(t){return t.active||t.classList.contains("active")}appendTabs(){this.activeTab=null;if(this.homeTab){this.hostElement.querySelector(".tabs-top").appendChild(this.homeTab);this.homeTab.addEventListener("click",this.resetOverlay.bind(this))}this.menuItems.forEach(((t,e)=>{var i;if(this.showTab(e)){t.classList.remove("d-none")}else{t.classList.add("d-none");if(this.isMenuItemActive(t)){this.activeTab=t}}(i=this.homeTab)===null||i===void 0?void 0:i.classList.remove("d-none");t.addEventListener("click",this.resetOverlay.bind(this))}))}appendAvatar(){var t;const e=this.avatarItem;if(e){e.style.marginBottom="1rem";(t=this.hostElement.querySelector("#avatar-tab-placeholder"))===null||t===void 0?void 0:t.appendChild(e)}}getAboutPopoverVerticalPosition(){const t=12;const e=6;const i=this.aboutTab.getBoundingClientRect();const s=window.innerHeight-(i.bottom-i.height/2+t/2+e);return h(s)}appendAboutNewsPopover(){var t;if(!this.aboutPopover){return}this.aboutPopover.style.bottom=this.getAboutPopoverVerticalPosition();if(!((t=this.popoverArea)===null||t===void 0?void 0:t.contains(this.aboutPopover))){const t=()=>{var t;if((t=this.aboutPopover)===null||t===void 0?void 0:t.aboutItemLabel){this.about.activeTabLabel=this.aboutPopover.aboutItemLabel;this.toggleAbout(true)}};this.aboutPopover.addEventListener("showMore",t.bind(this));document.body.appendChild(this.aboutPopover)}}appendSettings(){if(this.settings){this.overlayContainer.appendChild(this.settings)}}appendAbout(){if(this.about){this.overlayContainer.appendChild(this.about)}}getMoreNotificationsCount(){var t;const e=(t=this.moreItemsDropdown)===null||t===void 0?void 0:t.querySelectorAll(".appended");let i=0;e===null||e===void 0?void 0:e.forEach((t=>{if(t["notifications"]){i+=t["notifications"]}}));return i}getAvailableHeight(){const t=60;const e=72;const i=56;const s=36;let n=this.hostElement.clientHeight;n-=t;if(this.avatarItem){n-=i}if(this.homeTab){n-=e}if(this.showAbout){n-=s}if(this.showSettings){n-=s}if(this.menuBottomItems.length){n-=this.menuBottomItems.length*s}if(this.enableMapExpand){n-=s}n-=2*s;n-=16;return n}getMaxTabCount(){const t=48;const e=this.getAvailableHeight();const i=Math.floor(e/t);const s=this.menuItems.length;if(s===1){return 1}if(s<this.maxVisibleMenuItems){if(i>s){return s}return Math.min(i-2,s)}if(s===this.maxVisibleMenuItems){if(i<this.maxVisibleMenuItems){return i-2}if(i===this.maxVisibleMenuItems){return this.maxVisibleMenuItems-2}return Math.min(i,this.maxVisibleMenuItems)}if(i===this.maxVisibleMenuItems){return this.maxVisibleMenuItems-2}if(i>=this.maxVisibleMenuItems){return this.maxVisibleMenuItems-1}return Math.min(i-2,this.maxVisibleMenuItems)}async toggleMapExpand(t){this.skipAllOverlayAnimations();if(t!==undefined){this.mapExpand=t}else{this.mapExpand=!this.mapExpand}}skipAllOverlayAnimations(){if(this.about){this.skipOverlayAnimationFor(this.about)}if(this.settings){this.skipOverlayAnimationFor(this.settings)}}skipOverlayAnimationFor(t){const e="animate__animated";t===null||t===void 0?void 0:t.classList.remove(e);setTimeout((()=>{t===null||t===void 0?void 0:t.classList.add(e)}),300)}async toggleMenu(t){this.skipAllOverlayAnimations();if(t!==undefined){this.expand=t}else{this.expand=!this.expand}if(this.aboutPopover){this.aboutPopover.expanded=this.expand}this.expandChange.emit(this.expand)}async toggleSettings(t){var e;if(this.showAbout){this.skipAllOverlayAnimations()}else{this.skipOverlayAnimationFor(this.about)}(e=this.about)===null||e===void 0?void 0:e.classList.add("d-none");this.resetOverlay();this.showSettings=t;this.settings.show=this.showSettings;this.settings.classList.remove("d-none");this.overlayContainer.classList.remove("d-none")}async toggleAbout(t){var e;if(this.showSettings){this.skipAllOverlayAnimations()}else{this.skipOverlayAnimationFor(this.settings)}(e=this.settings)===null||e===void 0?void 0:e.classList.add("d-none");this.resetOverlay();this.showAbout=t;this.about.show=this.showAbout;this.about.classList.remove("d-none");this.overlayContainer.classList.remove("d-none")}resetOverlay(){this.showSettings=false;this.showAbout=false;if(this.settings){this.settings.show=this.showSettings}if(this.about){this.about.show=this.showAbout}this.toggleMenu(false)}showMoreButton(){const t=this.menuItems.length;if(t===1){return false}if(t<this.maxVisibleMenuItems){return this.visibleMenuItems<t}if(t>this.maxVisibleMenuItems){return this.visibleMenuItems<this.maxVisibleMenuItems}return this.visibleMenuItems<=this.maxVisibleMenuItems-2}getCollapseText(){return this.mapExpand?this.i18nCollapse:this.i18nExpand}getCollapseIcon(){return this.mapExpand?"double-chevron-left":"double-chevron-right"}isMenuItemClicked(t){const e=t.composedPath();const i=e.filter((t=>t.id!=="ix-menu-more-tab")).filter((t=>t.tagName==="IX-MENU-ITEM"));return i.some((t=>this.tabsContainer.contains(t)))}render(){return i(s,{class:{expanded:this.expand,[`mode-${this.mode}`]:true}},i("div",{class:{menu:true,expanded:this.expand},onClick:()=>{this.resetActiveTab()}},i("ix-burger-menu",{onClick:async()=>this.toggleMenu(),expanded:this.expand,class:{"burger-menu":true}}),i("div",{id:"avatar-tab-placeholder"}),i("div",{id:"menu-tabs",style:{display:"contents"},onClick:t=>{if(this.isMenuItemClicked(t)){this.resetOverlay()}}},i("div",{class:"tabs-top"}),i("slot",null),i("div",{class:"active-more-tab"},this.activeTab?i("ix-menu-item",{class:"internal-tab",active:true,tabIcon:this.activeTab.tabIcon},this.activeTab.innerText):null),i("ix-menu-item",{id:"ix-menu-more-tab",tabIcon:"more-menu",class:{"internal-tab":true},style:{display:this.showMoreButton()?"block":"none"},title:"Show more",notifications:this.countMoreNotifications},this.i18nMore,i("ix-dropdown",{trigger:"ix-menu-more-tab",positioningStrategy:"fixed",placement:"right-start"},this.menuItems.filter(((t,e)=>!this.showTab(e)&&!this.isMenuItemActive(t)&&this.isVisible(t))).map((t=>i("ix-menu-item",{tabIcon:t.tabIcon,active:t.active,class:"internal-tab appended",onClick:()=>{this.resetOverlay();t.dispatchEvent(new CustomEvent("click"))}},t.innerText)))))),i("div",{class:"bottom-tab-divider"}),this.enableSettings&&!this.isSettingsEmpty?i("ix-menu-item",{id:"settings",class:{"internal-tab":true,"bottom-tab":true,active:this.showSettings},tabIcon:"cogwheel",onClick:async()=>this.toggleSettings(!this.showSettings)},this.i18nSettings):null,i("slot",{name:"bottom"}),i("div",{id:"popover-area"}),this.about?i("ix-menu-item",{id:"aboutAndLegal",class:{"internal-tab":true,"bottom-tab":true,active:this.showAbout},tabIcon:"info",onClick:async()=>this.toggleAbout(!this.showAbout)},this.i18nLegal):null,this.enableToggleTheme?i("ix-menu-item",{id:"toggleTheme",onClick:()=>c.toggleMode(),class:"internal-tab bottom-tab",tabIcon:"bulb"},this.i18nToggleTheme):null,this.enableMapExpand?i("ix-menu-item",{id:"menu-collapse",onClick:()=>this.mapExpandChange.emit(this.mapExpand),class:"internal-tab bottom-tab",tabIcon:`${this.getCollapseIcon()}`},this.getCollapseText()):null),i("div",{class:{"menu-overlay":true,expanded:this.expand,"d-block":this.showAbout||this.showSettings},style:{opacity:this.showAbout||this.showSettings?"1":"0"}}),i("div",{class:"menu-overlay-invisible"}))}get hostElement(){return n(this)}};d.style=u;const x=".text-xs.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-title-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}.text-l.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-title-single.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl.sc-ix-menu-about{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}a.sc-ix-menu-about{color:var(--theme-color-primary)}.sc-ix-menu-about-h{display:block;background-color:var(--theme-nav-overlay--background);padding:0.75rem 1rem 1rem 2rem;flex-grow:1;position:absolute;width:100%;height:100%}.sc-ix-menu-about-h .about-header.sc-ix-menu-about{display:flex;justify-content:space-between;flex-direction:row;align-items:center;height:2rem;margin-bottom:0.5rem}.sc-ix-menu-about-h .about-header.sc-ix-menu-about h2.sc-ix-menu-about{color:var(--theme-nav-overlay-header--color);margin-bottom:0}.sc-ix-menu-about-h .about-tabs.sc-ix-menu-about{margin-bottom:1.5rem}.sc-ix-menu-about-h ix-menu-about-item.sc-ix-menu-about{display:none}";const b=class{constructor(i){t(this,i);this.close=e(this,"close",7);this.activeTabLabel=undefined;this.label="About & legal information";this.show=false;this.labels=[]}get aboutItems(){return Array.from(this.el.querySelectorAll("ix-menu-about-item"))}setTab(t){this.activeTabLabel=t;this.aboutItems.forEach((t=>{t.style.display="none";if(t.label===this.activeTabLabel){t.style.display="block"}}))}componentWillLoad(){if(this.aboutItems.length){this.setTab(this.activeTabLabel||this.aboutItems[0].label)}}componentDidLoad(){o(this.el)}componentWillRender(){this.updateLabels()}updateLabels(){this.labels=this.aboutItems.map((t=>t.label))}watchActiveTabLabel(t){setTimeout((()=>this.setTab(t)))}getSelectedTabIndex(t){const e=this.aboutItems.find((e=>e.label===t));return this.aboutItems.indexOf(e)}getTabItems(){return this.aboutItems.map((({label:t})=>i("ix-tab-item",{class:{active:t===this.activeTabLabel},onClick:()=>this.setTab(t)},t)))}render(){return i(s,{class:{animate__animated:true,animate__fadeInLeft:this.show,animate__fadeOutLeft:!this.show}},i("div",{class:"about-header"},i("h2",{class:"text-h2"},this.label),i("ix-icon-button",{ghost:true,size:"24",icon:"close",onClick:t=>this.close.emit(t)})),i("ix-tabs",{selected:this.getSelectedTabIndex(this.activeTabLabel),class:"about-tabs"},this.getTabItems()),i("div",{class:"about-items"},i("slot",null)))}get el(){return n(this)}static get watchers(){return{activeTabLabel:["watchActiveTabLabel"]}}};b.style=x;const g=".sc-ix-menu-about-item-h{display:block}";const f=class{constructor(e){t(this,e);this.label=undefined}render(){return i(s,null,i("slot",null))}};f.style=g;const v=".sc-ix-menu-about-news-h{--margin:0.5rem;display:block;position:fixed;width:20rem;height:auto;background-color:var(--theme-color-1);border:var(--theme-weak-bdr-1);border-radius:0.25rem;padding:1rem;left:4rem;z-index:10000;transition:left var(--animate-duration);margin-left:var(--margin) !important;box-shadow:var(--theme-box-shadow-level-4)}.expanded.sc-ix-menu-about-news-h{left:calc(4rem + 12rem)}.show.sc-ix-menu-about-news-h{display:none}.sc-ix-menu-about-news-h .banner-container.sc-ix-menu-about-news{position:absolute;top:0.0625rem;left:1rem}.sc-ix-menu-about-news-h .banner-container.sc-ix-menu-about-news svg.sc-ix-menu-about-news{position:absolute;height:3.625rem;width:3rem}.sc-ix-menu-about-news-h .banner-container.sc-ix-menu-about-news svg.sc-ix-menu-about-news polygon.sc-ix-menu-about-news{fill:var(--theme-color-primary)}.sc-ix-menu-about-news-h .banner-container.sc-ix-menu-about-news ix-icon.sc-ix-menu-about-news{margin:0.5rem;position:absolute;z-index:1}.sc-ix-menu-about-news-h .cui-popover-news-header.sc-ix-menu-about-news{margin-bottom:2rem;margin-left:4rem;margin-top:-0.25rem}.sc-ix-menu-about-news-h .popover-body.sc-ix-menu-about-news{color:var(--theme-color-std-text)}.sc-ix-menu-about-news-h .cui-popover-news-footer.sc-ix-menu-about-news{display:flex;justify-content:flex-end;margin-top:1rem}.sc-ix-menu-about-news-h ix-icon-button.sc-ix-menu-about-news{top:0.5rem;right:0.5rem;position:absolute}.sc-ix-menu-about-news-h #arrow.sc-ix-menu-about-news{position:absolute;width:0.5rem;height:0.5rem;background-color:var(--theme-color-1);border-left:var(--theme-weak-bdr-1);border-bottom:var(--theme-weak-bdr-1);transform:translateX(calc(var(--margin) * -1 - 0.8rem)) rotateZ(45deg)}";const p=class{constructor(i){t(this,i);this.showMore=e(this,"showMore",7);this.closePopover=e(this,"closePopover",7);this.show=false;this.label=undefined;this.i18nShowMore="Show more";this.aboutItemLabel=undefined;this.offsetBottom=0;this.expanded=false}render(){return i(s,{class:{expanded:this.expanded,show:!this.show}},i("div",{class:"banner-container"},i("ix-icon",{color:"color-inv-contrast-text",name:"shout",size:"32"}),i("svg",{viewBox:"0 0 48 56",xmlns:"http://www.w3.org/2000/svg"},i("polygon",{points:"0 0 48 0 48 56 24 48 0 56"}))),i("div",{class:"cui-popover-news-header"},i("span",{class:"text-l-title"},this.label)),i("ix-icon-button",{size:"24",icon:"close-small",ghost:true,onClick:()=>{this.show=false;this.closePopover.emit()}}),i("slot",null),this.aboutItemLabel?i("div",{class:"cui-popover-news-footer"},i("button",{class:"btn btn-primary",onClick:t=>{this.show=false;this.showMore.emit(t)}},this.i18nShowMore)):null,i("div",{id:"arrow"}))}};p.style=v;const w=".sc-ix-menu-avatar-h{display:block;position:relative;margin-bottom:0.5rem}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar{display:flex;align-items:center;height:2.5rem;max-height:2.5rem;padding-left:0.25rem;margin-left:0.75rem;margin-right:0.75rem;transition:0.15s;border-radius:1.25rem}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar>.avatar-image.sc-ix-menu-avatar{height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar>.avatar-initials.sc-ix-menu-avatar{display:flex;align-items:center;justify-content:center;height:2rem;width:2rem;min-height:2rem;min-width:2rem;border-radius:100px;background-color:var(--theme-color-component-3)}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar #avatar-path-background.sc-ix-menu-avatar{fill:var(--theme-avatar--background)}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar #avatar-path-person.sc-ix-menu-avatar{fill:var(--theme-color-4)}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar .avatar-name.sc-ix-menu-avatar{display:flex;flex-direction:column;overflow:hidden;white-space:nowrap;margin-left:1rem;line-height:1.14}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar .avatar-name.sc-ix-menu-avatar .text-default-single.sc-ix-menu-avatar{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar:not(.disabled):not(:disabled):hover{background-color:var(--theme-avatar-btn--background--hover);color:var(--theme-avatar-btn--color--hover)}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar:not(.disabled):not(:disabled){cursor:pointer}.sc-ix-menu-avatar-h .avatar.sc-ix-menu-avatar:not(.disabled):not(:disabled):active{background-color:var(--theme-avatar-btn--background--active);color:var(--theme-avatar-btn--color--active)}";function y(t){const{initials:e}=t;if(e){return i("div",{class:"avatar-initials"},e)}return i("svg",{class:"avatar-image",xmlns:"http://www.w3.org/2000/svg",width:"32",height:"32",viewBox:"0 0 32 32"},i("g",{fill:"none","fill-rule":"evenodd"},i("path",{id:"avatar-path-background",d:"M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n          16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z"}),i("path",{id:"avatar-path-person",d:"M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n        6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n        9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n        6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z"})))}const k=class{constructor(i){t(this,i);this.logoutClick=e(this,"logoutClick",7);this.avatarElementId="ix-menu-avatar-id";this.top=undefined;this.bottom=undefined;this.image=undefined;this.initials=undefined;this.i18nLogout="Logout"}render(){return i(s,null,i("li",{class:"nav-item top-item avatar no-hover",title:this.top,id:this.avatarElementId},this.image?i("img",{src:this.image,class:"avatar-image"}):i(y,{initials:this.initials}),i("div",{class:"avatar-name"},i("span",{class:"text-default-single",title:this.top},this.top),i("span",{class:"text-default-single",title:this.bottom},this.bottom))),i("ix-dropdown",{trigger:this.avatarElementId,placement:"right-start",offset:{mainAxis:12}},i("slot",null),i("ix-menu-avatar-item",{label:this.i18nLogout,icon:"log-out",onClick:t=>{this.logoutClick.emit(t)}})))}get hostElement(){return n(this)}};k.style=w;const z=".sc-ix-menu-avatar-item-h{display:block}";const S=class{constructor(i){t(this,i);this.itemClick=e(this,"itemClick",7);this.icon=undefined;this.label=undefined}render(){return i("ix-dropdown-item",{icon:this.icon,label:this.label,onClick:t=>this.itemClick.emit(t)})}get hostElement(){return n(this)}};S.style=z;const C='.sc-ix-menu-item-h{position:relative;display:block}.sc-ix-menu-item-h .tab.sc-ix-menu-item{display:flex;position:relative;align-items:center;height:3rem;z-index:500;padding-left:1.25rem}.sc-ix-menu-item-h .tab.sc-ix-menu-item:not(.selected){cursor:pointer}.sc-ix-menu-item-h .tab.sc-ix-menu-item:not(.selected):not(.disabled):not(:disabled).hover,.sc-ix-menu-item-h .tab.sc-ix-menu-item:not(.selected):not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}.sc-ix-menu-item-h .tab.sc-ix-menu-item:not(.selected):not(.disabled):not(:disabled).active,.sc-ix-menu-item-h .tab.sc-ix-menu-item:not(.selected):not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}.sc-ix-menu-item-h i.glyph.sc-ix-menu-item{color:var(--theme-nav-item-primary-icon--color);position:relative}.sc-ix-menu-item-h .tab.sc-ix-menu-item:focus-visible{outline:none}.sc-ix-menu-item-h:focus-visible{outline:none}.sc-ix-menu-item-h .tab.sc-ix-menu-item:not(:last-child){margin-bottom:0.5rem}.sc-ix-menu-item-h .notification.sc-ix-menu-item{display:inline-flex;position:absolute;top:-0.5rem;right:-50%}.sc-ix-menu-item-h .notification.sc-ix-menu-item .pill.sc-ix-menu-item{display:inline-flex;justify-content:center;align-items:center;height:1rem;min-width:1rem;position:relative;border-radius:6.25rem;background-color:var(--theme-color-primary);border-radius:6.25rem;font-size:0.75rem;font-weight:bold;line-height:1;font-family:Siemens Sans, Arial, sans-serif;color:var(--theme-color-primary--contrast);padding:0.25rem}.sc-ix-menu-item-h .tab-text.sc-ix-menu-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-nav-item-primary--color);margin:0 1.25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none}.active.sc-ix-menu-item-h .tab.sc-ix-menu-item,.selected.sc-ix-menu-item-h .tab.sc-ix-menu-item{background-color:var(--theme-nav-item-primary--background--selected)}.active.sc-ix-menu-item-h .tab.sc-ix-menu-item::before,.selected.sc-ix-menu-item-h .tab.sc-ix-menu-item::before{content:"";background-color:var(--theme-nav-item-primary--border-color--selected);height:3rem;width:0.25rem;left:0;position:absolute}.active.sc-ix-menu-item-h .tab.sc-ix-menu-item>.glyph.sc-ix-menu-item,.selected.sc-ix-menu-item-h .tab.sc-ix-menu-item>.glyph.sc-ix-menu-item{color:var(--theme-nav-item-primary-icon--color--selected)}.disabled.sc-ix-menu-item-h{color:var(--theme-color-weak-text);pointer-events:none;cursor:default}.disabled.sc-ix-menu-item-h .tab.sc-ix-menu-item>.glyph.sc-ix-menu-item{color:var(--theme-color-weak-text)}.disabled.sc-ix-menu-item-h .tab-text.sc-ix-menu-item{color:var(--theme-color-weak-text)}.home-tab.sc-ix-menu-item-h,[slot=home].sc-ix-menu-item-h{margin-bottom:1.5rem}.bottom-tab.sc-ix-menu-item-h,[slot=bottom].sc-ix-menu-item-h{height:2.25rem}.bottom-tab.sc-ix-menu-item-h .tab.sc-ix-menu-item,[slot=bottom].sc-ix-menu-item-h .tab.sc-ix-menu-item{height:2.25rem}.bottom-tab.sc-ix-menu-item-h .tab.sc-ix-menu-item::before,[slot=bottom].sc-ix-menu-item-h .tab.sc-ix-menu-item::before{height:2.25rem}.bottom-tab.active.sc-ix-menu-item-h .tab.sc-ix-menu-item,.bottom-tab.selected.sc-ix-menu-item-h .tab.sc-ix-menu-item,[slot=bottom].active.sc-ix-menu-item-h .tab.sc-ix-menu-item,[slot=bottom].selected.sc-ix-menu-item-h .tab.sc-ix-menu-item{background-color:var(--theme-color-1)}';const _=class{constructor(e){t(this,e);this.home=false;this.bottom=false;this.tabIcon="document";this.notifications=undefined;this.active=undefined;this.disabled=undefined;this.title=undefined}get tabLabel(){return this.hostElement.querySelector(".tab-text")}componentDidRender(){const t=this.tabLabel;const e=t.innerHTML.replace("&amp;","&");if(this.title!==e){this.title=e}}render(){return i(s,{class:{disabled:this.disabled,"home-tab":this.home,"bottom-tab":this.bottom,active:this.active}},i("li",{class:"tab",title:this.title},i("i",{class:`glyph glyph-${this.tabIcon}`},i("div",{class:"notification"},this.notifications?i("div",{class:"pill"},this.notifications):null)),i("span",{class:"tab-text text-default"},i("slot",null))))}get hostElement(){return n(this)}};_.style=C;const A=".text-xs.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-title-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}.text-l.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-title-single.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl.sc-ix-menu-settings{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}a.sc-ix-menu-settings{color:var(--theme-color-primary)}.sc-ix-menu-settings-h{display:block;background-color:var(--theme-nav-overlay--background);padding:0.75rem 1rem 1rem 2rem;flex-grow:1;position:absolute;width:100%;height:100%}.sc-ix-menu-settings-h .settings-header.sc-ix-menu-settings{display:flex;justify-content:space-between;flex-direction:row;align-items:center;height:2rem;margin-bottom:0.5rem}.sc-ix-menu-settings-h .settings-header.sc-ix-menu-settings h2.sc-ix-menu-settings{color:var(--theme-nav-overlay-header--color);margin-bottom:0}.sc-ix-menu-settings-h .settings-tabs.sc-ix-menu-settings{margin-bottom:1.5rem}";const I=class{constructor(i){t(this,i);this.close=e(this,"close",7);this.activeTabLabel=undefined;this.label="Settings";this.show=false}get settingsItems(){return Array.from(this.el.querySelectorAll("ix-menu-settings-item"))}setTab(t){this.activeTabLabel=t;this.settingsItems.forEach((t=>{t.style.display="none";if(t.label===this.activeTabLabel){t.style.display="block"}}))}componentWillLoad(){if(this.settingsItems.length){this.setTab(this.activeTabLabel||this.settingsItems[0].label)}}componentDidLoad(){o(this.el)}watchActiveTabLabel(t){this.setTab(t)}getTabItems(){return this.settingsItems.map((({label:t})=>i("ix-tab-item",{class:{active:t===this.activeTabLabel},onClick:()=>this.setTab(t)},t)))}render(){return i(s,{class:{animate__animated:true,animate__fadeInLeft:this.show,animate__fadeOutLeft:!this.show}},i("div",{class:"settings-header"},i("h2",{class:"text-h2"},this.label),i("ix-icon-button",{ghost:true,size:"24",icon:"close",onClick:t=>this.close.emit(t)})),i("ix-tabs",null,this.getTabItems()),i("slot",null))}get el(){return n(this)}static get watchers(){return{activeTabLabel:["watchActiveTabLabel"]}}};I.style=A;const T=".sc-ix-menu-settings-item-h{display:block}";const M=class{constructor(e){t(this,e);this.label=undefined}render(){return i(s,null,i("slot",null))}};M.style=T;export{d as ix_menu,b as ix_menu_about,f as ix_menu_about_item,p as ix_menu_about_news,k as ix_menu_avatar,S as ix_menu_avatar_item,_ as ix_menu_item,I as ix_menu_settings,M as ix_menu_settings_item};
+//# sourceMappingURL=p-6790d123.entry.js.map

package/dist/siemens-ix/p-6790d123.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["menuCss","Menu","this","domObserver","MutationObserver","onDomChange","bind","isVisible","elm","style","display","_b","_a","parentElement","onWindowResize","visibleMenuItems","getMaxTabCount","handleNodeMutation","node","HTMLElement","matches","menu","contains","appendAbout","appendSettings","mutations","forEach","mutationRecord","addedNodes","removedNodes","popoverArea","hostElement","querySelector","overlayContainer","invisibleContainer","menuItems","Array","from","querySelectorAll","filter","menuBottomItems","homeTab","moreItemsDropdown","isMoreItemsDropdownEmpty","length","moreItemsDropdownItems","activeMoreTabContainer","activeMoreTab","aboutPopoverContainer","aboutPopover","document","aboutTab","about","settings","isSettingsEmpty","avatarItem","tabsContainer","showTab","index","componentDidLoad","addEventListener","showSettings","show","classList","add","_c","showAbout","_d","observe","attributes","childList","subtree","componentWillLoad","menuController","register","layout","hostContext","isBasicNavigationLayout","hideHeader","screenMode","onChange","on","mode","componentWillRender","appendTabs","componentDidRender","appendFragments","appendAvatar","appendAboutNewsPopover","isMoreTabEmpty","countMoreNotifications","getMoreNotificationsCount","resetActiveTab","activeTab","isMenuItemActive","item","active","appendChild","resetOverlay","remove","avatar","marginBottom","getAboutPopoverVerticalPosition","heightArrow","offsetArrow","rectAbout","getBoundingClientRect","offset","window","innerHeight","bottom","height","convertToRemString","showMore","aboutItemLabel","activeTabLabel","toggleAbout","body","moreTabs","count","tab","getAvailableHeight","heightBurgerMenu","heightHome","heightAvatar","heightBottomTab","availableHeight","clientHeight","enableMapExpand","heightTab","visibleCount","Math","floor","menuItemCount","maxVisibleMenuItems","min","async","skipAllOverlayAnimations","undefined","mapExpand","skipOverlayAnimationFor","element","animateClass","setTimeout","expand","expanded","expandChange","emit","toggleMenu","showMoreButton","getCollapseText","i18nCollapse","i18nExpand","getCollapseIcon","isMenuItemClicked","event","path","composedPath","id","tagName","some","render","h","Host","class","onClick","tabIcon","innerText","title","notifications","i18nMore","trigger","positioningStrategy","placement","map","e","dispatchEvent","CustomEvent","enableSettings","toggleSettings","i18nSettings","name","i18nLegal","enableToggleTheme","themeSwitcher","toggleMode","i18nToggleTheme","mapExpandChange","opacity","menuAboutCss","MenuAbout","aboutItems","el","setTab","label","i","forceUpdate","updateLabels","labels","watchActiveTabLabel","value","getSelectedTabIndex","selectedItem","find","indexOf","getTabItems","animate__animated","animate__fadeInLeft","animate__fadeOutLeft","ghost","size","icon","close","selected","menuAboutItemCss","MenuAboutItem","menuAboutNewsCss","MenuAboutNews","color","viewBox","xmlns","points","closePopover","i18nShowMore","menuAvatarCss","DefaultAvatar","props","initials","width","fill","d","MenuAvatar","avatarElementId","top","image","src","mainAxis","i18nLogout","logoutClick","menuAvatarItemCss","MenuAvatarItem","itemClick","menuItemCss","MenuItem","tabLabel","spanElement","newTitle","innerHTML","replace","disabled","home","menuSettingsCss","settingsItems","menuSettingsItemCss","MenuSettingsItem"],"sources":["./src/components/menu/menu.scss?tag=ix-menu","./src/components/menu/menu.tsx","./src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=scoped","./src/components/menu-about/menu-about.tsx","./src/components/menu-about-item/menu-about-item.css?tag=ix-menu-about-item&encapsulation=scoped","./src/components/menu-about-item/menu-about-item.tsx","./src/components/menu-about-news/menu-about-news.scss?tag=ix-menu-about-news&encapsulation=scoped","./src/components/menu-about-news/menu-about-news.tsx","./src/components/menu-avatar/menu-avatar.scss?tag=ix-menu-avatar&encapsulation=scoped","./src/components/menu-avatar/menu-avatar.tsx","./src/components/menu-avatar-item/menu-avatar-item.css?tag=ix-menu-avatar-item&encapsulation=scoped","./src/components/menu-avatar-item/menu-avatar-item.tsx","./src/components/menu-item/menu-item.scss?tag=ix-menu-item&encapsulation=scoped","./src/components/menu-item/menu-item.tsx","./src/components/menu-settings/menu-settings.scss?tag=ix-menu-settings&encapsulation=scoped","./src/components/menu-settings/menu-settings.tsx","./src/components/menu-settings-item/menu-settings-item.css?tag=ix-menu-settings-item&encapsulation=scoped","./src/components/menu-settings-item/menu-settings-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n\nix-menu {\n  display: flex;\n  flex-direction: row;\n  position: absolute;\n  height: 100%;\n  min-height: 22.75rem;\n  z-index: var(--theme-z-index-sticky);\n  width: auto;\n\n  .menu {\n    display: flex;\n    flex-direction: column;\n    position: relative;\n    width: 4rem;\n    height: 100%;\n    padding-block-end: 1rem;\n    overflow: hidden;\n\n    &.expanded {\n      box-shadow: var(--theme-navigation--box-shadow);\n    }\n\n    background-color: var(--theme-nav--background);\n    transition: width var(--animate-duration);\n\n    .burger-menu {\n      margin: 0.75rem 0 1rem 0.75rem;\n    }\n  }\n\n  .menu-overlay {\n    display: block;\n    position: absolute;\n    width: calc(100vw - 4rem);\n    height: 100%;\n    left: 4rem;\n    z-index: -1;\n    backdrop-filter: blur(1rem);\n    background-color: var(--theme-sidebar-overlay-blur);\n    transition: all $medium-time ease-out;\n  }\n\n  .menu-overlay-invisible {\n    display: none;\n  }\n\n  .menu.expanded {\n    width: 16rem;\n  }\n\n  .menu-overlay.expanded {\n    width: calc(100vw - 16rem);\n    left: 16rem;\n  }\n\n  #avatar-tab-placeholder {\n    max-height: 3rem;\n  }\n\n  .avatar {\n    margin-bottom: 2rem;\n  }\n\n  #cui-imprint {\n    .cui-imprint-product-name {\n      margin-bottom: $default-space;\n    }\n\n    .cui-imprint-product-description {\n      margin-bottom: $x-large-space;\n    }\n\n    .cui-imprint-link-container {\n      display: flex;\n      align-items: center;\n    }\n  }\n\n  .bottom-tab-divider {\n    margin-top: auto;\n  }\n}\n\nix-menu.mode-mobile {\n  .menu:not(.expanded) {\n    width: 0;\n  }\n\n  .menu {\n    padding-top: 2rem;\n  }\n\n  .menu .burger-menu {\n    display: none;\n  }\n\n  .menu-overlay {\n    left: 0px;\n    width: calc(100vw);\n  }\n}\n\n// Remove text-decoration if a tag is used inside ix-menu\na[href]:has(> ix-menu-item) {\n  text-decoration: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { menuController } from '../utils/menu-service/menu-service';\nimport { convertToRemString } from '../utils/rwd.util';\nimport { hostContext, isBasicNavigationLayout } from '../utils/screen/context';\nimport { Mode } from '../utils/screen/mode';\nimport { screenMode } from '../utils/screen/service';\nimport { themeSwitcher } from '../utils/theme-switcher';\n\n@Component({\n  tag: 'ix-menu',\n  styleUrl: 'menu.scss',\n  scoped: false,\n})\nexport class Menu {\n  @Element() hostElement!: HTMLIxMenuElement;\n\n  /**\n   * Is settings tab visible\n   */\n  @Prop({ mutable: true }) showSettings = false;\n\n  /**\n   * Is about tab visible\n   */\n  @Prop({ mutable: true }) showAbout = false;\n\n  /**\n   * Show toggle between light and dark variant. Only if the provided theme have implemented both!\n   */\n  @Prop() enableToggleTheme = false;\n\n  /**\n   * Is settings tab is visible\n   */\n  @Prop() enableSettings = true;\n\n  /**\n   * Internal\n   */\n  @Prop() enableMapExpand = false;\n\n  /**\n   * Should only be set if you use ix-menu standalone\n   */\n  @Prop() applicationName: string;\n\n  /**\n   * Should only be set if you use ix-menu standalone\n   */\n  @Prop() applicationDescription = '';\n\n  /**\n   * Maximum number of menu items to show in case enough vertical space is available.\n   * Extra menu items will be collapsed to 'show more' menu item.\n   */\n  @Prop() maxVisibleMenuItems = 9;\n\n  /**\n   */\n  @Prop() i18nLegal = 'About & legal information';\n\n  /**\n   */\n  @Prop() i18nSettings = 'Settings';\n\n  /**\n   */\n  @Prop() i18nToggleTheme = 'Toggle theme';\n\n  /**\n   */\n  @Prop() i18nExpand = ' Expand';\n\n  /**\n   */\n  @Prop() i18nCollapse = 'Collapse';\n\n  /**\n   */\n  @Prop() i18nMore = 'More…';\n\n  /**\n   * Expand menu\n   */\n  @Prop({ mutable: true, reflect: true }) expand = false;\n\n  /**\n   * Menu expanded\n   */\n  @Event() expandChange: EventEmitter<boolean>;\n\n  /**\n   * Map Sidebar expanded\n   */\n  @Event() mapExpandChange: EventEmitter<boolean>;\n  @State() showMoreItems = false;\n  @State() visibleMenuItems = 0;\n  @State() countMoreNotifications = 0;\n  @State() mapExpand = true;\n  @State() activeTab: HTMLIxMenuItemElement;\n  @State() isMoreTabEmpty = false;\n  @State() mode: Mode = 'desktop';\n\n  private readonly domObserver = new MutationObserver(\n    this.onDomChange.bind(this)\n  );\n\n  @Listen('resize', { target: 'window' })\n  onWindowResize() {\n    this.visibleMenuItems = this.getMaxTabCount();\n  }\n\n  private handleNodeMutation(node: Node) {\n    if (!(node instanceof HTMLElement)) {\n      return;\n    }\n\n    if (node.matches('.tab')) {\n      this.onWindowResize();\n    }\n\n    if (node.matches('ix-menu-about') && this.menu.contains(node)) {\n      this.appendAbout();\n    }\n\n    if (node.matches('ix-menu-settings') && this.menu.contains(node)) {\n      this.appendSettings();\n    }\n  }\n\n  private onDomChange(mutations: MutationRecord[]) {\n    mutations.forEach((mutationRecord) => {\n      mutationRecord.addedNodes.forEach(this.handleNodeMutation.bind(this));\n      mutationRecord.removedNodes.forEach(this.handleNodeMutation.bind(this));\n    });\n  }\n\n  // FBC IAM workaround #488\n  private readonly isVisible = (elm: HTMLElement) => {\n    return (\n      elm.style.display !== 'none' &&\n      elm.parentElement?.parentElement?.style.display !== 'none'\n    );\n  };\n\n  get popoverArea() {\n    return this.hostElement.querySelector('#popover-area');\n  }\n\n  get overlayContainer() {\n    return this.hostElement.querySelector('.menu-overlay');\n  }\n\n  get invisibleContainer() {\n    return this.hostElement.querySelector('.menu-overlay-invisible');\n  }\n\n  get menu() {\n    return this.hostElement.querySelector('.menu');\n  }\n\n  get menuItems() {\n    return Array.from(\n      this.hostElement.querySelectorAll(\n        'ix-menu-item:not(.internal-tab):not(.home-tab):not(.bottom-tab):not([slot=\"bottom\"])'\n      )\n    ).filter(this.isVisible);\n  }\n\n  get menuBottomItems() {\n    return Array.from(\n      this.hostElement.querySelectorAll(\n        'ix-menu-item.bottom-tab:not(.internal-tab):not(.home-tab)'\n      )\n    ).filter(this.isVisible);\n  }\n\n  get homeTab() {\n    return this.hostElement.querySelector('ix-menu-item.home-tab');\n  }\n\n  get moreItemsDropdown(): HTMLElement {\n    return this.hostElement.querySelector('.internal-tab ix-dropdown');\n  }\n\n  get isMoreItemsDropdownEmpty(): boolean {\n    return (\n      this.hostElement.querySelectorAll('.internal-tab ix-dropdown .appended')\n        .length === 0\n    );\n  }\n\n  get moreItemsDropdownItems() {\n    return this.hostElement.querySelectorAll(\n      '.internal-tab ix-dropdown ix-menu-item'\n    );\n  }\n\n  get activeMoreTabContainer() {\n    return this.hostElement.querySelector('.active-more-tab');\n  }\n\n  get activeMoreTab() {\n    return this.hostElement.querySelector('.active-more-tab ix-menu-item');\n  }\n\n  get aboutPopoverContainer(): HTMLElement {\n    return this.hostElement.querySelector('.about-news');\n  }\n\n  get aboutPopover(): HTMLIxMenuAboutNewsElement {\n    return document.querySelector('ix-menu-about-news');\n  }\n\n  get aboutTab(): HTMLElement {\n    return this.hostElement.querySelector('#aboutAndLegal');\n  }\n\n  get about(): HTMLIxMenuAboutElement {\n    return this.hostElement.querySelector('ix-menu-about');\n  }\n\n  get settings(): HTMLIxMenuSettingsElement {\n    return this.hostElement.querySelector('ix-menu-settings');\n  }\n\n  get isSettingsEmpty(): boolean {\n    return (\n      Array.from(this.hostElement.querySelectorAll('ix-menu-settings-item'))\n        .length === 0\n    );\n  }\n\n  get avatarItem(): HTMLIxMenuAvatarElement {\n    return this.hostElement.querySelector('ix-menu-avatar');\n  }\n\n  get tabsContainer(): HTMLDivElement {\n    return this.hostElement.querySelector('#menu-tabs');\n  }\n\n  private showTab(index: number) {\n    return index + 1 <= this.visibleMenuItems;\n  }\n\n  componentDidLoad() {\n    this.settings?.addEventListener('close', () => {\n      this.showSettings = false;\n      this.settings.show = this.showSettings;\n    });\n\n    this.settings?.addEventListener('animationend', () => {\n      if (!this.showSettings) {\n        this.settings.classList.add('d-none');\n        this.overlayContainer.classList.add('d-none');\n      }\n    });\n\n    this.about?.addEventListener('close', () => {\n      this.showAbout = false;\n      this.about.show = this.showAbout;\n    });\n\n    this.about?.addEventListener('animationend', () => {\n      if (!this.showAbout) {\n        this.about.classList.add('d-none');\n        this.overlayContainer.classList.add('d-none');\n      }\n    });\n\n    this.overlayContainer.classList.add('d-none');\n\n    this.onWindowResize();\n\n    this.domObserver.observe(this.hostElement, {\n      attributes: false,\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  componentWillLoad() {\n    menuController.register(this.hostElement);\n    const layout = hostContext('ix-basic-navigation', this.hostElement);\n    if (isBasicNavigationLayout(layout) && layout.hideHeader === false) {\n      screenMode.onChange.on((mode) => (this.mode = mode));\n      this.mode = screenMode.mode;\n    }\n  }\n\n  componentWillRender() {\n    this.appendTabs();\n  }\n\n  componentDidRender() {\n    this.visibleMenuItems = this.getMaxTabCount();\n    this.appendFragments();\n  }\n\n  private appendFragments() {\n    this.appendAvatar();\n    this.appendAbout();\n    this.appendSettings();\n    this.appendAboutNewsPopover();\n\n    // This lead to none infinite-loops and other bugs.\n    this.isMoreTabEmpty = this.isMoreItemsDropdownEmpty;\n\n    this.countMoreNotifications = this.getMoreNotificationsCount();\n  }\n\n  private resetActiveTab() {\n    this.activeTab = null;\n  }\n\n  private isMenuItemActive(item: HTMLIxMenuItemElement) {\n    return item.active || item.classList.contains('active');\n  }\n\n  private appendTabs() {\n    this.activeTab = null;\n\n    if (this.homeTab) {\n      this.hostElement.querySelector('.tabs-top').appendChild(this.homeTab);\n      this.homeTab.addEventListener('click', this.resetOverlay.bind(this));\n    }\n\n    this.menuItems.forEach((item: HTMLIxMenuItemElement, index) => {\n      if (this.showTab(index)) {\n        item.classList.remove('d-none');\n      } else {\n        item.classList.add('d-none');\n\n        if (this.isMenuItemActive(item)) {\n          this.activeTab = item;\n        }\n      }\n\n      // TODO: Find better solution to handle home tab\n      this.homeTab?.classList.remove('d-none');\n\n      item.addEventListener('click', this.resetOverlay.bind(this));\n    });\n  }\n\n  private appendAvatar() {\n    const avatar = this.avatarItem;\n    if (avatar) {\n      avatar.style.marginBottom = '1rem';\n      this.hostElement\n        .querySelector('#avatar-tab-placeholder')\n        ?.appendChild(avatar);\n    }\n  }\n\n  private getAboutPopoverVerticalPosition() {\n    const heightArrow = 12;\n    const offsetArrow = 6;\n    const rectAbout = this.aboutTab.getBoundingClientRect();\n    const offset =\n      window.innerHeight -\n      (rectAbout.bottom - rectAbout.height / 2 + heightArrow / 2 + offsetArrow);\n    return convertToRemString(offset);\n  }\n\n  private appendAboutNewsPopover() {\n    if (!this.aboutPopover) {\n      return;\n    }\n\n    this.aboutPopover.style.bottom = this.getAboutPopoverVerticalPosition();\n\n    if (!this.popoverArea?.contains(this.aboutPopover)) {\n      const showMore = () => {\n        if (this.aboutPopover?.aboutItemLabel) {\n          this.about.activeTabLabel = this.aboutPopover.aboutItemLabel;\n          this.toggleAbout(true);\n        }\n      };\n\n      this.aboutPopover.addEventListener('showMore', showMore.bind(this));\n      document.body.appendChild(this.aboutPopover);\n    }\n  }\n\n  private appendSettings() {\n    if (this.settings) {\n      this.overlayContainer.appendChild(this.settings);\n    }\n  }\n\n  private appendAbout() {\n    if (this.about) {\n      this.overlayContainer.appendChild(this.about);\n    }\n  }\n\n  private getMoreNotificationsCount(): number {\n    const moreTabs = this.moreItemsDropdown?.querySelectorAll('.appended');\n    let count = 0;\n    moreTabs?.forEach((tab) => {\n      if (tab['notifications']) {\n        count += tab['notifications'];\n      }\n    });\n\n    return count;\n  }\n\n  private getAvailableHeight() {\n    const heightBurgerMenu = 60;\n    const heightHome = 72;\n    const heightAvatar = 56;\n    const heightBottomTab = 36;\n\n    let availableHeight = this.hostElement.clientHeight;\n\n    availableHeight -= heightBurgerMenu;\n\n    if (this.avatarItem) {\n      availableHeight -= heightAvatar;\n    }\n\n    if (this.homeTab) {\n      availableHeight -= heightHome;\n    }\n\n    if (this.showAbout) {\n      availableHeight -= heightBottomTab;\n    }\n\n    if (this.showSettings) {\n      availableHeight -= heightBottomTab;\n    }\n\n    if (this.menuBottomItems.length) {\n      availableHeight -= this.menuBottomItems.length * heightBottomTab;\n    }\n\n    if (this.enableMapExpand) {\n      availableHeight -= heightBottomTab;\n    }\n\n    // Subtract height of imprint and theme toggle tabs\n    availableHeight -= 2 * heightBottomTab;\n\n    // Subtract bottom margin of bottom tabs\n    availableHeight -= 16;\n\n    return availableHeight;\n  }\n\n  private getMaxTabCount() {\n    const heightTab = 48;\n    const availableHeight = this.getAvailableHeight();\n    const visibleCount = Math.floor(availableHeight / heightTab);\n    const menuItemCount = this.menuItems.length;\n\n    if (menuItemCount === 1) {\n      return 1;\n    }\n\n    if (menuItemCount < this.maxVisibleMenuItems) {\n      if (visibleCount > menuItemCount) {\n        return menuItemCount;\n      }\n\n      return Math.min(visibleCount - 2, menuItemCount);\n    }\n\n    if (menuItemCount === this.maxVisibleMenuItems) {\n      if (visibleCount < this.maxVisibleMenuItems) {\n        return visibleCount - 2;\n      }\n\n      if (visibleCount === this.maxVisibleMenuItems) {\n        return this.maxVisibleMenuItems - 2;\n      }\n\n      return Math.min(visibleCount, this.maxVisibleMenuItems);\n    }\n\n    if (visibleCount === this.maxVisibleMenuItems) {\n      return this.maxVisibleMenuItems - 2;\n    }\n    if (visibleCount >= this.maxVisibleMenuItems) {\n      return this.maxVisibleMenuItems - 1;\n    }\n\n    return Math.min(visibleCount - 2, this.maxVisibleMenuItems);\n  }\n\n  /**\n   * Toggle map sidebar expand\n   * @param show\n   */\n  @Method()\n  async toggleMapExpand(show?: boolean) {\n    this.skipAllOverlayAnimations();\n\n    if (show !== undefined) {\n      this.mapExpand = show;\n    } else {\n      this.mapExpand = !this.mapExpand;\n    }\n  }\n\n  private skipAllOverlayAnimations() {\n    if (this.about) {\n      this.skipOverlayAnimationFor(this.about);\n    }\n    if (this.settings) {\n      this.skipOverlayAnimationFor(this.settings);\n    }\n  }\n\n  private skipOverlayAnimationFor(element: HTMLElement) {\n    const animateClass = 'animate__animated';\n\n    element?.classList.remove(animateClass);\n\n    setTimeout(() => {\n      element?.classList.add(animateClass);\n    }, 300);\n  }\n\n  /**\n   * Toggle menu\n   * @param show\n   */\n  @Method()\n  async toggleMenu(show?: boolean) {\n    this.skipAllOverlayAnimations();\n\n    if (show !== undefined) {\n      this.expand = show;\n    } else {\n      this.expand = !this.expand;\n    }\n\n    if (this.aboutPopover) {\n      this.aboutPopover.expanded = this.expand;\n    }\n\n    this.expandChange.emit(this.expand);\n  }\n\n  /**\n   * Toggle Settings tabs\n   * @param show\n   */\n  @Method()\n  async toggleSettings(show: boolean) {\n    if (this.showAbout) {\n      this.skipAllOverlayAnimations();\n    } else {\n      this.skipOverlayAnimationFor(this.about);\n    }\n\n    this.about?.classList.add('d-none');\n\n    this.resetOverlay();\n    this.showSettings = show;\n    this.settings.show = this.showSettings;\n    this.settings.classList.remove('d-none');\n    this.overlayContainer.classList.remove('d-none');\n  }\n\n  /**\n   * Toggle About tabs\n   * @param show\n   */\n  @Method()\n  async toggleAbout(show: boolean) {\n    if (this.showSettings) {\n      this.skipAllOverlayAnimations();\n    } else {\n      this.skipOverlayAnimationFor(this.settings);\n    }\n\n    this.settings?.classList.add('d-none');\n\n    this.resetOverlay();\n    this.showAbout = show;\n    this.about.show = this.showAbout;\n    this.about.classList.remove('d-none');\n    this.overlayContainer.classList.remove('d-none');\n  }\n\n  private resetOverlay() {\n    this.showSettings = false;\n    this.showAbout = false;\n\n    if (this.settings) {\n      this.settings.show = this.showSettings;\n    }\n\n    if (this.about) {\n      this.about.show = this.showAbout;\n    }\n\n    this.toggleMenu(false);\n  }\n\n  private showMoreButton() {\n    const menuItemCount = this.menuItems.length;\n\n    if (menuItemCount === 1) {\n      return false;\n    }\n\n    if (menuItemCount < this.maxVisibleMenuItems) {\n      return this.visibleMenuItems < menuItemCount;\n    }\n\n    if (menuItemCount > this.maxVisibleMenuItems) {\n      return this.visibleMenuItems < this.maxVisibleMenuItems;\n    }\n\n    return this.visibleMenuItems <= this.maxVisibleMenuItems - 2;\n  }\n\n  private getCollapseText() {\n    return this.mapExpand ? this.i18nCollapse : this.i18nExpand;\n  }\n\n  private getCollapseIcon() {\n    return this.mapExpand ? 'double-chevron-left' : 'double-chevron-right';\n  }\n\n  private isMenuItemClicked(event: MouseEvent) {\n    const path = event.composedPath();\n    const menuItems = (path as HTMLElement[])\n      .filter((element) => element.id !== 'ix-menu-more-tab')\n      .filter((element) => {\n        return element.tagName === 'IX-MENU-ITEM';\n      });\n\n    return menuItems.some((menu) => this.tabsContainer.contains(menu));\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          expanded: this.expand,\n          [`mode-${this.mode}`]: true,\n        }}\n      >\n        <div\n          class={{\n            menu: true,\n            expanded: this.expand,\n          }}\n          onClick={() => {\n            this.resetActiveTab();\n          }}\n        >\n          <ix-burger-menu\n            onClick={async () => this.toggleMenu()}\n            expanded={this.expand}\n            class={{\n              'burger-menu': true,\n            }}\n          ></ix-burger-menu>\n          <div id=\"avatar-tab-placeholder\"></div>\n          <div\n            id=\"menu-tabs\"\n            style={{\n              display: 'contents',\n            }}\n            onClick={(event) => {\n              if (this.isMenuItemClicked(event)) {\n                this.resetOverlay();\n              }\n            }}\n          >\n            <div class=\"tabs-top\"></div>\n            <slot></slot>\n            <div class=\"active-more-tab\">\n              {this.activeTab ? (\n                <ix-menu-item\n                  class=\"internal-tab\"\n                  active={true}\n                  tabIcon={this.activeTab.tabIcon}\n                >\n                  {this.activeTab.innerText}\n                </ix-menu-item>\n              ) : null}\n            </div>\n            <ix-menu-item\n              id=\"ix-menu-more-tab\"\n              tabIcon=\"more-menu\"\n              class={{\n                'internal-tab': true,\n              }}\n              style={{\n                display: this.showMoreButton() ? 'block' : 'none',\n              }}\n              title=\"Show more\"\n              notifications={this.countMoreNotifications}\n            >\n              {this.i18nMore}\n              <ix-dropdown\n                trigger={'ix-menu-more-tab'}\n                positioningStrategy={'fixed'}\n                placement={'right-start'}\n              >\n                {this.menuItems\n                  .filter(\n                    (elm: HTMLIxMenuItemElement, index) =>\n                      !this.showTab(index) &&\n                      !this.isMenuItemActive(elm) &&\n                      this.isVisible(elm)\n                  )\n                  .map((e: HTMLIxMenuItemElement) => {\n                    return (\n                      <ix-menu-item\n                        tabIcon={e.tabIcon}\n                        active={e.active}\n                        class=\"internal-tab appended\"\n                        onClick={() => {\n                          this.resetOverlay();\n                          e.dispatchEvent(new CustomEvent('click'));\n                        }}\n                      >\n                        {e.innerText}\n                      </ix-menu-item>\n                    );\n                  })}\n              </ix-dropdown>\n            </ix-menu-item>\n          </div>\n          <div class=\"bottom-tab-divider\"></div>\n          {this.enableSettings && !this.isSettingsEmpty ? (\n            <ix-menu-item\n              id=\"settings\"\n              class={{\n                'internal-tab': true,\n                'bottom-tab': true,\n                active: this.showSettings,\n              }}\n              tabIcon=\"cogwheel\"\n              onClick={async () => this.toggleSettings(!this.showSettings)}\n            >\n              {this.i18nSettings}\n            </ix-menu-item>\n          ) : null}\n          <slot name=\"bottom\"></slot>\n          <div id=\"popover-area\"></div>\n          {this.about ? (\n            <ix-menu-item\n              id=\"aboutAndLegal\"\n              class={{\n                'internal-tab': true,\n                'bottom-tab': true,\n                active: this.showAbout,\n              }}\n              tabIcon=\"info\"\n              onClick={async () => this.toggleAbout(!this.showAbout)}\n            >\n              {this.i18nLegal}\n            </ix-menu-item>\n          ) : null}\n          {this.enableToggleTheme ? (\n            <ix-menu-item\n              id=\"toggleTheme\"\n              onClick={() => themeSwitcher.toggleMode()}\n              class=\"internal-tab bottom-tab\"\n              tabIcon=\"bulb\"\n            >\n              {this.i18nToggleTheme}\n            </ix-menu-item>\n          ) : null}\n          {this.enableMapExpand ? (\n            <ix-menu-item\n              id=\"menu-collapse\"\n              onClick={() => this.mapExpandChange.emit(this.mapExpand)}\n              class=\"internal-tab bottom-tab\"\n              tabIcon={`${this.getCollapseIcon()}`}\n            >\n              {this.getCollapseText()}\n            </ix-menu-item>\n          ) : null}\n        </div>\n        <div\n          class={{\n            'menu-overlay': true,\n            expanded: this.expand,\n            'd-block': this.showAbout || this.showSettings,\n          }}\n          style={{\n            opacity: this.showAbout || this.showSettings ? '1' : '0',\n          }}\n        ></div>\n        <div class=\"menu-overlay-invisible\"></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\n@import 'common-variables';\n@import 'fonts';\n\n:host {\n  display: block;\n  background-color: var(--theme-nav-overlay--background);\n  padding: $medium-space $default-space $default-space $x-large-space;\n  flex-grow: 1;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n\n  .about-header {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: row;\n    align-items: center;\n    height: $x-large-space;\n    margin-bottom: $small-space;\n\n    h2 {\n      color: var(--theme-nav-overlay-header--color);\n      margin-bottom: 0;\n    }\n  }\n\n  .about-tabs {\n    margin-bottom: $large-space;\n  }\n\n  ix-menu-about-item {\n    display: none;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  forceUpdate,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-menu-about',\n  styleUrl: 'menu-about.scss',\n  scoped: true,\n})\nexport class MenuAbout {\n  /**\n   * Active tab\n   */\n  @Prop({ mutable: true }) activeTabLabel: string;\n\n  /**\n   * Label of first tab\n   */\n  @Prop() label = 'About & legal information';\n\n  /**\n   * Internal\n   */\n  @Prop() show = false;\n\n  @Element() el!: HTMLIxMenuAboutElement;\n\n  /**\n   * About and Legal closed\n   */\n  @Event() close: EventEmitter<MouseEvent>;\n\n  @State() labels: string[] = [];\n\n  get aboutItems(): HTMLIxMenuAboutItemElement[] {\n    return Array.from(this.el.querySelectorAll('ix-menu-about-item'));\n  }\n\n  private setTab(label: string) {\n    this.activeTabLabel = label;\n    this.aboutItems.forEach((i) => {\n      i.style.display = 'none';\n      if (i.label === this.activeTabLabel) {\n        i.style.display = 'block';\n      }\n    });\n  }\n\n  componentWillLoad() {\n    if (this.aboutItems.length) {\n      this.setTab(this.activeTabLabel || this.aboutItems[0].label);\n    }\n  }\n\n  componentDidLoad() {\n    forceUpdate(this.el);\n  }\n\n  componentWillRender() {\n    this.updateLabels();\n  }\n\n  private updateLabels() {\n    this.labels = this.aboutItems.map((i) => i.label);\n  }\n\n  @Watch('activeTabLabel')\n  watchActiveTabLabel(value: string) {\n    // Wait a DOM render cycle to get changed labels\n    setTimeout(() => this.setTab(value));\n  }\n\n  private getSelectedTabIndex(label: string) {\n    const selectedItem = this.aboutItems.find((item) => item.label === label);\n    return this.aboutItems.indexOf(selectedItem);\n  }\n\n  private getTabItems() {\n    return this.aboutItems.map(({ label }) => {\n      return (\n        <ix-tab-item\n          class={{\n            active: label === this.activeTabLabel,\n          }}\n          onClick={() => this.setTab(label)}\n        >\n          {label}\n        </ix-tab-item>\n      );\n    });\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          animate__animated: true,\n          animate__fadeInLeft: this.show,\n          animate__fadeOutLeft: !this.show,\n        }}\n      >\n        <div class=\"about-header\">\n          <h2 class=\"text-h2\">{this.label}</h2>\n          <ix-icon-button\n            ghost\n            size=\"24\"\n            icon=\"close\"\n            onClick={(e) => this.close.emit(e)}\n          ></ix-icon-button>\n        </div>\n        <ix-tabs\n          selected={this.getSelectedTabIndex(this.activeTabLabel)}\n          class=\"about-tabs\"\n        >\n          {this.getTabItems()}\n        </ix-tabs>\n        <div class=\"about-items\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n  display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-menu-about-item',\n  styleUrl: 'menu-about-item.css',\n  scoped: true,\n})\nexport class MenuAboutItem {\n  /**\n   * About Item label\n   */\n  @Prop({ reflect: true }) label: string;\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/shadows';\n\n:host {\n  --margin: 0.5rem;\n\n  $left: 4rem;\n  display: block;\n  position: fixed;\n  width: 20rem;\n  height: auto;\n  background-color: var(--theme-color-1);\n  border: var(--theme-weak-bdr-1);\n  border-radius: $default-border-radius;\n  padding: 1rem;\n  left: $left;\n  z-index: 10000;\n  transition: left var(--animate-duration);\n\n  margin-left: var(--margin) !important;\n\n  @include box-shadow(4);\n\n  &.expanded {\n    left: calc(#{$left} + 12rem);\n  }\n\n  &.show {\n    display: none;\n  }\n\n  .banner-container {\n    position: absolute;\n    top: 0.0625rem;\n    left: $default-space;\n\n    svg {\n      position: absolute;\n      height: 3.625rem;\n      width: 3rem;\n\n      polygon {\n        fill: var(--theme-color-primary);\n      }\n    }\n\n    ix-icon {\n      margin: $small-space;\n      position: absolute;\n      z-index: 1;\n    }\n  }\n\n  .cui-popover-news-header {\n    margin-bottom: 2rem;\n    margin-left: 4rem;\n    margin-top: -$tiny-space;\n  }\n\n  .popover-body {\n    color: var(--theme-color-std-text);\n  }\n\n  .cui-popover-news-footer {\n    display: flex;\n    justify-content: flex-end;\n    margin-top: 1rem;\n  }\n\n  ix-icon-button {\n    top: $small-space;\n    right: $small-space;\n    position: absolute;\n  }\n\n  #arrow {\n    position: absolute;\n    width: 0.5rem;\n    height: 0.5rem;\n    background-color: var(--theme-color-1);\n    border-left: var(--theme-weak-bdr-1);\n    border-bottom: var(--theme-weak-bdr-1);\n    transform: translateX(calc(var(--margin) * -1 - 0.8rem)) rotateZ(45deg);\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-menu-about-news',\n  styleUrl: 'menu-about-news.scss',\n  scoped: true,\n})\nexport class MenuAboutNews {\n  /**\n   * Show about news\n   */\n  @Prop({ mutable: true, reflect: true }) show = false;\n\n  /**\n   * Title of the about news\n   */\n  @Prop() label: string;\n\n  /**\n   *\n   */\n  @Prop() i18nShowMore = 'Show more';\n\n  /**\n   * Subtitle of the about news\n   */\n  @Prop() aboutItemLabel: string;\n\n  /**\n   * Bottom offset\n   */\n  @Prop() offsetBottom = 0;\n\n  /**\n   * Show More button is pressed\n   */\n  @Event() showMore: EventEmitter<MouseEvent>;\n\n  /**\n   * Popover closed\n   */\n  @Event() closePopover: EventEmitter<void>;\n\n  /**\n   * Internal\n   */\n  @Prop() expanded = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          expanded: this.expanded,\n          show: !this.show,\n        }}\n      >\n        <div class=\"banner-container\">\n          <ix-icon\n            color=\"color-inv-contrast-text\"\n            name=\"shout\"\n            size=\"32\"\n          ></ix-icon>\n          <svg viewBox=\"0 0 48 56\" xmlns=\"http://www.w3.org/2000/svg\">\n            <polygon points=\"0 0 48 0 48 56 24 48 0 56\" />\n          </svg>\n        </div>\n\n        <div class=\"cui-popover-news-header\">\n          <span class=\"text-l-title\">{this.label}</span>\n        </div>\n\n        <ix-icon-button\n          size=\"24\"\n          icon=\"close-small\"\n          ghost\n          onClick={() => {\n            this.show = false;\n            this.closePopover.emit();\n          }}\n        ></ix-icon-button>\n        <slot></slot>\n        {this.aboutItemLabel ? (\n          <div class=\"cui-popover-news-footer\">\n            <button\n              class=\"btn btn-primary\"\n              onClick={(e) => {\n                this.show = false;\n                this.showMore.emit(e);\n              }}\n            >\n              {this.i18nShowMore}\n            </button>\n          </div>\n        ) : null}\n        <div id=\"arrow\"></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\n@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/hover';\n\n:host {\n  display: block;\n  position: relative;\n  margin-bottom: 0.5rem;\n\n  .avatar {\n    display: flex;\n    align-items: center;\n    height: 2.5rem;\n    max-height: 2.5rem;\n    padding-left: 0.25rem;\n    margin-left: 0.75rem;\n    margin-right: 0.75rem;\n    transition: 0.15s;\n\n    > .avatar-image {\n      height: 2rem;\n      width: 2rem;\n      min-height: 2rem;\n      min-width: 2rem;\n      border-radius: 100px;\n    }\n\n    > .avatar-initials {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      height: 2rem;\n      width: 2rem;\n      min-height: 2rem;\n      min-width: 2rem;\n      border-radius: 100px;\n      background-color: var(--theme-color-component-3);\n    }\n\n    #avatar-path-background {\n      fill: var(--theme-avatar--background);\n    }\n\n    #avatar-path-person {\n      fill: var(--theme-color-4);\n    }\n\n    .avatar-name {\n      display: flex;\n      flex-direction: column;\n      overflow: hidden;\n      white-space: nowrap;\n      margin-left: $default-space;\n      line-height: 1.14;\n\n      .text-default-single {\n        @include ellipsis;\n      }\n    }\n\n    border-radius: 1.25rem;\n\n    @include hover {\n      background-color: var(--theme-avatar-btn--background--hover);\n      color: var(--theme-avatar-btn--color--hover);\n    }\n\n    @include active {\n      background-color: var(--theme-avatar-btn--background--active);\n      color: var(--theme-avatar-btn--color--active);\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\nfunction DefaultAvatar(props: { initials?: string }) {\n  const { initials } = props;\n\n  if (initials) {\n    return <div class={'avatar-initials'}>{initials}</div>;\n  }\n\n  return (\n    <svg\n      class={'avatar-image'}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"32\"\n      height=\"32\"\n      viewBox=\"0 0 32 32\"\n    >\n      <g fill=\"none\" fill-rule=\"evenodd\">\n        <path\n          id=\"avatar-path-background\"\n          d=\"M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163\n          16-16c0-4.243-1.686-8.313-4.686-11.314C24.314 1.686 20.244 0 16 0z\"\n        />\n        <path\n          id=\"avatar-path-person\"\n          d=\"M17.897 17.91c3.8-.018 7.358 1.875 9.485 5.046-2.417 3.999-6.734 6.434-11.382\n        6.42-4.648.014-8.965-2.421-11.382-6.42 2.127-3.171 5.685-5.064\n        9.485-5.045h3.794zM15.821 2.129c3.682 0 6.667 2.984 6.667 6.666 0 3.682-2.985\n        6.667-6.667 6.667s-6.667-2.985-6.667-6.667 2.985-6.666 6.667-6.666z\"\n        />\n      </g>\n    </svg>\n  );\n}\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-menu-avatar',\n  styleUrl: 'menu-avatar.scss',\n  scoped: true,\n})\nexport class MenuAvatar {\n  @Element() hostElement: HTMLIxMenuAvatarElement;\n\n  /**\n   * First line of text\n   */\n  @Prop() top: string;\n\n  /**\n   * Second line of text\n   */\n  @Prop() bottom: string;\n\n  /**\n   * Display a avatar image\n   *\n   * @since 1.4.0\n   */\n  @Prop() image: string;\n\n  /**\n   * Display the initials of the user. Will be overwritten by image\n   *\n   * @since 1.4.0\n   */\n  @Prop() initials: string;\n\n  /**\n   * Use for translation\n   */\n  @Prop() i18nLogout = 'Logout';\n\n  /**\n   * Logout click\n   */\n  @Event() logoutClick: EventEmitter;\n\n  private avatarElementId = 'ix-menu-avatar-id';\n\n  render() {\n    return (\n      <Host>\n        <li\n          class=\"nav-item top-item avatar no-hover\"\n          title={this.top}\n          id={this.avatarElementId}\n        >\n          {this.image ? (\n            <img src={this.image} class=\"avatar-image\"></img>\n          ) : (\n            <DefaultAvatar initials={this.initials} />\n          )}\n          <div class=\"avatar-name\">\n            <span class=\"text-default-single\" title={this.top}>\n              {this.top}\n            </span>\n            <span class=\"text-default-single\" title={this.bottom}>\n              {this.bottom}\n            </span>\n          </div>\n        </li>\n        <ix-dropdown\n          trigger={this.avatarElementId}\n          placement={'right-start'}\n          offset={{\n            mainAxis: 12,\n          }}\n        >\n          <slot></slot>\n          <ix-menu-avatar-item\n            label={this.i18nLogout}\n            icon=\"log-out\"\n            onClick={(e) => {\n              this.logoutClick.emit(e);\n            }}\n          ></ix-menu-avatar-item>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n  display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Prop,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-menu-avatar-item',\n  styleUrl: 'menu-avatar-item.css',\n  scoped: true,\n})\nexport class MenuAvatarItem {\n  /**\n   * Avatar dropdown icon\n   */\n  @Prop() icon: string;\n\n  /**\n   * Avatar dropdown label\n   */\n  @Prop() label: string;\n\n  /**\n   * Avatar dropdown item clicked\n   */\n  @Event() itemClick: EventEmitter<MouseEvent>;\n\n  @Element() hostElement: HTMLIxMenuAvatarItemElement;\n\n  render() {\n    return (\n      <ix-dropdown-item\n        icon={this.icon}\n        label={this.label}\n        onClick={(e) => this.itemClick.emit(e)}\n      ></ix-dropdown-item>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n:host {\n  position: relative;\n  display: block;\n\n  .tab {\n    display: flex;\n    position: relative;\n    align-items: center;\n    height: 3rem;\n    z-index: 500;\n    padding-left: 1.25rem;\n\n    &:not(.selected) {\n      cursor: pointer;\n\n      @include ghost-hover-pressed;\n    }\n  }\n\n  i.glyph {\n    color: var(--theme-nav-item-primary-icon--color);\n    position: relative;\n  }\n\n  .tab:focus-visible {\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: none;\n  }\n\n  .tab:not(:last-child) {\n    margin-bottom: $small-space;\n  }\n\n  .notification {\n    display: inline-flex;\n    position: absolute;\n    top: -$small-space;\n    right: -50%;\n\n    .pill {\n      display: inline-flex;\n      justify-content: center;\n      align-items: center;\n      height: 1rem;\n      min-width: 1rem;\n      position: relative;\n      border-radius: 6.25rem;\n      background-color: var(--theme-color-primary);\n      border-radius: 6.25rem;\n      font-size: 0.75rem;\n      font-weight: bold;\n      line-height: 1;\n      font-family: Siemens Sans, Arial, sans-serif;\n      color: var(--theme-color-primary--contrast);\n      padding: $tiny-space;\n    }\n  }\n\n  .tab-text {\n    @include ellipsis;\n    color: var(--theme-nav-item-primary--color);\n    margin: 0 1.25rem;\n    user-select: none;\n  }\n\n  &.active,\n  &.selected {\n    .tab {\n      background-color: var(--theme-nav-item-primary--background--selected);\n    }\n\n    .tab::before {\n      content: '';\n      background-color: var(--theme-nav-item-primary--border-color--selected);\n      height: 3rem;\n      width: 0.25rem;\n      left: 0;\n      position: absolute;\n    }\n\n    .tab > .glyph {\n      color: var(--theme-nav-item-primary-icon--color--selected);\n    }\n  }\n\n  &.disabled {\n    color: var(--theme-color-weak-text);\n    pointer-events: none;\n    cursor: default;\n\n    .tab > .glyph {\n      color: var(--theme-color-weak-text);\n    }\n\n    .tab-text {\n      color: var(--theme-color-weak-text);\n    }\n  }\n\n  &.home-tab,\n  &[slot='home'] {\n    margin-bottom: 1.5rem;\n  }\n\n  &.bottom-tab,\n  &[slot='bottom'] {\n    $bottom-height: 2.25rem;\n\n    height: $bottom-height;\n\n    .tab {\n      height: $bottom-height;\n    }\n\n    .tab::before {\n      height: $bottom-height;\n    }\n\n    &.active,\n    &.selected {\n      .tab {\n        background-color: var(--theme-color-1);\n      }\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'ix-menu-item',\n  styleUrl: 'menu-item.scss',\n  scoped: true,\n})\nexport class MenuItem {\n  /**\n   * Move the Tab to a top position.\n   */\n  @Prop() home = false;\n\n  /**\n   * Caution: this is no longer working. Please use slot=\"bottom\" instead.\n   *\n   * Place tab on bottom\n   *\n   * @deprecated Will be removed in 2.0.0. Replaced by slot based implementation\n   */\n  @Prop() bottom = false;\n\n  /**\n   * Icon name from @siemens/ix-icons\n   */\n  @Prop() tabIcon = 'document';\n\n  /**\n   * Show notification cound on tab\n   */\n  @Prop() notifications: number;\n\n  /**\n   * State to display active\n   */\n  @Prop() active: boolean;\n\n  /**\n   * Disable tab and remove event handlers\n   */\n  @Prop() disabled: boolean;\n\n  @Element() hostElement: HTMLIxMenuItemElement;\n\n  @State() title: string;\n\n  get tabLabel() {\n    return this.hostElement.querySelector('.tab-text');\n  }\n\n  componentDidRender() {\n    const spanElement = this.tabLabel;\n    const newTitle = spanElement.innerHTML.replace('&amp;', '&');\n    if (this.title !== newTitle) {\n      this.title = newTitle;\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n          'home-tab': this.home,\n          'bottom-tab': this.bottom,\n          active: this.active,\n        }}\n      >\n        <li class=\"tab\" title={this.title}>\n          <i class={`glyph glyph-${this.tabIcon}`}>\n            <div class=\"notification\">\n              {this.notifications ? (\n                <div class=\"pill\">{this.notifications}</div>\n              ) : null}\n            </div>\n          </i>\n          <span class=\"tab-text text-default\">\n            <slot></slot>\n          </span>\n        </li>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'fonts';\n\n:host {\n  display: block;\n  background-color: var(--theme-nav-overlay--background);\n  padding: $medium-space $default-space $default-space $x-large-space;\n  flex-grow: 1;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n\n  .settings-header {\n    display: flex;\n    justify-content: space-between;\n    flex-direction: row;\n    align-items: center;\n    height: $x-large-space;\n    margin-bottom: $small-space;\n\n    h2 {\n      color: var(--theme-nav-overlay-header--color);\n      margin-bottom: 0;\n    }\n  }\n\n  .settings-tabs {\n    margin-bottom: $large-space;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  forceUpdate,\n  h,\n  Host,\n  Prop,\n  Watch,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-menu-settings',\n  styleUrl: 'menu-settings.scss',\n  scoped: true,\n})\nexport class MenuAbout {\n  /**\n   * active tab\n   */\n  @Prop({ mutable: true }) activeTabLabel: string;\n\n  /**\n   * Label\n   */\n  @Prop() label = 'Settings';\n\n  /**\n   * Internal\n   */\n  @Prop() show = false;\n\n  @Element() el!: HTMLIxMenuSettingsElement;\n\n  /**\n   * Popover closed\n   */\n  @Event() close: EventEmitter<MouseEvent>;\n\n  get settingsItems(): HTMLIxMenuSettingsItemElement[] {\n    return Array.from(this.el.querySelectorAll('ix-menu-settings-item'));\n  }\n\n  private setTab(label: string) {\n    this.activeTabLabel = label;\n    this.settingsItems.forEach((i) => {\n      i.style.display = 'none';\n\n      if (i.label === this.activeTabLabel) {\n        i.style.display = 'block';\n      }\n    });\n  }\n\n  componentWillLoad() {\n    if (this.settingsItems.length) {\n      this.setTab(this.activeTabLabel || this.settingsItems[0].label);\n    }\n  }\n\n  componentDidLoad() {\n    forceUpdate(this.el);\n  }\n\n  @Watch('activeTabLabel')\n  watchActiveTabLabel(value: string) {\n    this.setTab(value);\n  }\n\n  private getTabItems() {\n    return this.settingsItems.map(({ label }) => {\n      return (\n        <ix-tab-item\n          class={{\n            active: label === this.activeTabLabel,\n          }}\n          onClick={() => this.setTab(label)}\n        >\n          {label}\n        </ix-tab-item>\n      );\n    });\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          animate__animated: true,\n          animate__fadeInLeft: this.show,\n          animate__fadeOutLeft: !this.show,\n        }}\n      >\n        <div class=\"settings-header\">\n          <h2 class=\"text-h2\">{this.label}</h2>\n          <ix-icon-button\n            ghost\n            size=\"24\"\n            icon=\"close\"\n            onClick={(e) => this.close.emit(e)}\n          ></ix-icon-button>\n        </div>\n        <ix-tabs>{this.getTabItems()}</ix-tabs>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n  display: block;\n\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'ix-menu-settings-item',\n  styleUrl: 'menu-settings-item.css',\n  scoped: true,\n})\nexport class MenuSettingsItem {\n  /**\n   * Label\n   */\n  @Prop() label: string;\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/siemens-ix/p-6bdfaf91.entry.js

@@ -0,0 +1,2 @@
+import{r as o,h as t,H as i}from"./p-8fcd6f85.js";const n=".sc-ix-dropdown-button-h{display:inline-block;position:relative;height:2rem;width:auto}.disabled.sc-ix-dropdown-button-h{pointer-events:none}.sc-ix-dropdown-button-h .hide.sc-ix-dropdown-button{display:none}.sc-ix-dropdown-button-h .dropdown-button.sc-ix-dropdown-button{display:block;position:relative;width:100%;height:100%}.sc-ix-dropdown-button-h .dropdown-button.sc-ix-dropdown-button>ix-button.sc-ix-dropdown-button{width:100%;height:100%}.sc-ix-dropdown-button-h .dropdown-button.sc-ix-dropdown-button .button-label.sc-ix-dropdown-button{margin-right:auto}.sc-ix-dropdown-button-h .triangle.sc-ix-dropdown-button{position:absolute;-webkit-margin-start:1.5625rem;margin-inline-start:1.5625rem;-webkit-margin-before:-0.4375rem;margin-block-start:-0.4375rem;border-right:0 solid transparent;border-left:4px solid transparent;border-top:0 solid transparent;border-bottom:4px solid;color:var(--theme-btn-primary--color)}.sc-ix-dropdown-button-h .triangle.primary.ghost.sc-ix-dropdown-button{color:var(--theme-btn-invisible-primary--color)}.sc-ix-dropdown-button-h .triangle.primary.outline.sc-ix-dropdown-button{color:var(--theme-btn-outline-primary--color)}.sc-ix-dropdown-button-h .triangle.primary.ghost.disabled.sc-ix-dropdown-button{color:var(--theme-btn-invisible-primary--color--disabled)}.sc-ix-dropdown-button-h .triangle.primary.outline.disabled.sc-ix-dropdown-button{color:var(--theme-btn-outline-primary--color--disabled)}.sc-ix-dropdown-button-h .triangle.primary.disabled.sc-ix-dropdown-button{color:var(--theme-btn-primary--color--disabled)}.sc-ix-dropdown-button-h .triangle.secondary.ghost.sc-ix-dropdown-button{color:var(--theme-btn-invisible-secondary--color)}.sc-ix-dropdown-button-h .triangle.secondary.outline.sc-ix-dropdown-button{color:var(--theme-btn-outline-secondary--color)}.sc-ix-dropdown-button-h .triangle.secondary.ghost.disabled.sc-ix-dropdown-button{color:var(--theme-btn-invisible-secondary--color--disabled)}.sc-ix-dropdown-button-h .triangle.secondary.outline.disabled.sc-ix-dropdown-button{color:var(--theme-btn-outline-secondary--color--disabled)}.sc-ix-dropdown-button-h .triangle.secondary.disabled.sc-ix-dropdown-button{color:var(--theme-btn-secondary--color--disabled)}.sc-ix-dropdown-button-h .dropdown.sc-ix-dropdown-button{width:auto !important;inset:auto !important;transform:unset !important}";const r=class{constructor(t){o(this,t);this.variant="Primary";this.outline=false;this.ghost=false;this.active=false;this.disabled=false;this.label=undefined;this.icon=undefined;this.dropdownAnchor=undefined}getTriangle(){return t("div",{class:{triangle:true,hide:this.label!=="",primary:this.variant==="Primary",secondary:this.variant==="Secondary",ghost:this.ghost,outline:this.outline,disabled:this.disabled}})}render(){return t(i,{class:{disabled:this.disabled}},t("div",{class:"dropdown-button",ref:o=>{this.dropdownAnchor=o}},this.label?t("ix-button",{variant:this.variant,outline:this.outline,ghost:this.ghost,disabled:this.disabled},t("ix-icon",{name:this.icon,size:"24",class:{hide:this.icon===""||this.icon===undefined}}),t("div",{class:"button-label"},this.label),t("ix-icon",{name:"chevron-down-small",size:"24"})):t("div",null,t("ix-icon-button",{icon:this.icon,variant:this.variant,outline:this.outline,ghost:this.ghost,disabled:this.disabled}),this.getTriangle())),t("ix-dropdown",{class:"dropdown",trigger:this.dropdownAnchor,placement:"bottom",positioningStrategy:"fixed",adjustDropdownWidthToReferenceWidth:true},t("slot",null)))}};r.style=n;export{r as ix_dropdown_button};
+//# sourceMappingURL=p-6bdfaf91.entry.js.map

package/dist/siemens-ix/p-6bdfaf91.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dropdownButtonCss","DropdownButton","getTriangle","h","class","triangle","hide","this","label","primary","variant","secondary","ghost","outline","disabled","render","Host","ref","dropdownAnchor","name","icon","size","undefined","trigger","placement","positioningStrategy","adjustDropdownWidthToReferenceWidth"],"sources":["./src/components/dropdown-button/dropdown-button.scss?tag=ix-dropdown-button&encapsulation=scoped","./src/components/dropdown-button/dropdown-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@import 'common-variables';\n\n:host {\n  display: inline-block;\n  position: relative;\n  height: $x-large-space;\n  width: auto;\n\n  &.disabled {\n    pointer-events: none;\n  }\n\n  .hide {\n    display: none;\n  }\n\n  .dropdown-button {\n    display: block;\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button > ix-button {\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button .button-label {\n    margin-right: auto;\n  }\n\n  .triangle {\n    position: absolute;\n    margin-inline-start: 1.5625rem;\n    margin-block-start: -0.4375rem;\n    border-right: 0 solid transparent;\n    border-left: 4px solid transparent;\n    border-top: 0 solid transparent;\n    border-bottom: 4px solid;\n    color: var(--theme-btn-primary--color);\n  }\n\n  .triangle.primary {\n    &.ghost {\n      color: var(--theme-btn-invisible-primary--color);\n    }\n\n    &.outline {\n      color: var(--theme-btn-outline-primary--color);\n    }\n\n    &.ghost.disabled {\n      color: var(--theme-btn-invisible-primary--color--disabled);\n    }\n\n    &.outline.disabled {\n      color: var(--theme-btn-outline-primary--color--disabled);\n    }\n\n    &.disabled {\n      color: var(--theme-btn-primary--color--disabled);\n    }\n  }\n\n  .triangle.secondary {\n    &.ghost {\n      color: var(--theme-btn-invisible-secondary--color);\n    }\n\n    &.outline {\n      color: var(--theme-btn-outline-secondary--color);\n    }\n\n    &.ghost.disabled {\n      color: var(--theme-btn-invisible-secondary--color--disabled);\n    }\n\n    &.outline.disabled {\n      color: var(--theme-btn-outline-secondary--color--disabled);\n    }\n\n    &.disabled {\n      color: var(--theme-btn-secondary--color--disabled);\n    }\n  }\n\n  .dropdown {\n    width: auto !important;\n    inset: auto !important;\n    transform: unset !important;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop, State } from '@stencil/core';\nimport { ButtonVariant } from '../button/button';\n\nexport type DropdownButtonVariant = ButtonVariant;\n\n/**\n * @since 1.3.0\n */\n@Component({\n  tag: 'ix-dropdown-button',\n  styleUrl: 'dropdown-button.scss',\n  scoped: true,\n})\nexport class DropdownButton {\n  /**\n   * Button variant\n   */\n  @Prop() variant: DropdownButtonVariant = 'Primary';\n\n  /**\n   * Outline button\n   */\n  @Prop() outline = false;\n\n  /**\n   * Button with no background or outline\n   */\n  @Prop() ghost = false;\n\n  /**\n   * Active button\n   */\n  @Prop() active = false;\n\n  /**\n   * Disable button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Set label\n   */\n  @Prop() label: string;\n\n  /**\n   * Button icon\n   */\n  @Prop() icon: string;\n\n  @State() dropdownAnchor!: HTMLElement;\n\n  private getTriangle() {\n    return (\n      <div\n        class={{\n          triangle: true,\n          hide: this.label !== '',\n          primary: this.variant === 'Primary',\n          secondary: this.variant === 'Secondary',\n          ghost: this.ghost,\n          outline: this.outline,\n          disabled: this.disabled,\n        }}\n      ></div>\n    );\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n        }}\n      >\n        <div\n          class=\"dropdown-button\"\n          ref={(ref) => {\n            this.dropdownAnchor = ref;\n          }}\n        >\n          {this.label ? (\n            <ix-button\n              variant={this.variant}\n              outline={this.outline}\n              ghost={this.ghost}\n              disabled={this.disabled}\n            >\n              <ix-icon\n                name={this.icon}\n                size=\"24\"\n                class={{ hide: this.icon === '' || this.icon === undefined }}\n              ></ix-icon>\n              <div class={'button-label'}>{this.label}</div>\n              <ix-icon name=\"chevron-down-small\" size=\"24\"></ix-icon>\n            </ix-button>\n          ) : (\n            <div>\n              <ix-icon-button\n                icon={this.icon}\n                variant={this.variant}\n                outline={this.outline}\n                ghost={this.ghost}\n                disabled={this.disabled}\n              ></ix-icon-button>\n              {this.getTriangle()}\n            </div>\n          )}\n        </div>\n\n        <ix-dropdown\n          class=\"dropdown\"\n          trigger={this.dropdownAnchor}\n          placement=\"bottom\"\n          positioningStrategy={'fixed'}\n          adjustDropdownWidthToReferenceWidth={true}\n        >\n          <slot></slot>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAoB,yyE,MCsBbC,EAAc,M,sCAIgB,U,aAKvB,M,WAKF,M,YAKC,M,cAKE,M,uEAcXC,cACN,OACEC,EAAA,OACEC,MAAO,CACLC,SAAU,KACVC,KAAMC,KAAKC,QAAU,GACrBC,QAASF,KAAKG,UAAY,UAC1BC,UAAWJ,KAAKG,UAAY,YAC5BE,MAAOL,KAAKK,MACZC,QAASN,KAAKM,QACdC,SAAUP,KAAKO,W,CAMvBC,SACE,OACEZ,EAACa,EAAI,CACHZ,MAAO,CACLU,SAAUP,KAAKO,WAGjBX,EAAA,OACEC,MAAM,kBACNa,IAAMA,IACJV,KAAKW,eAAiBD,CAAG,GAG1BV,KAAKC,MACJL,EAAA,aACEO,QAASH,KAAKG,QACdG,QAASN,KAAKM,QACdD,MAAOL,KAAKK,MACZE,SAAUP,KAAKO,UAEfX,EAAA,WACEgB,KAAMZ,KAAKa,KACXC,KAAK,KACLjB,MAAO,CAAEE,KAAMC,KAAKa,OAAS,IAAMb,KAAKa,OAASE,aAEnDnB,EAAA,OAAKC,MAAO,gBAAiBG,KAAKC,OAClCL,EAAA,WAASgB,KAAK,qBAAqBE,KAAK,QAG1ClB,EAAA,WACEA,EAAA,kBACEiB,KAAMb,KAAKa,KACXV,QAASH,KAAKG,QACdG,QAASN,KAAKM,QACdD,MAAOL,KAAKK,MACZE,SAAUP,KAAKO,WAEhBP,KAAKL,gBAKZC,EAAA,eACEC,MAAM,WACNmB,QAAShB,KAAKW,eACdM,UAAU,SACVC,oBAAqB,QACrBC,oCAAqC,MAErCvB,EAAA,c"}

package/dist/siemens-ix/p-6f819085.js

@@ -0,0 +1,2 @@
+class t{hasCategory(){return this.category!==undefined}constructor(t,s){this.token=t;this.category=s}}var s;(function(t){t["EQUAL"]="Equal";t["NOT_EQUAL"]="Not equal"})(s||(s={}));export{t as I,s as L};
+//# sourceMappingURL=p-6f819085.js.map

package/dist/siemens-ix/p-6f819085.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["InputState","hasCategory","this","category","undefined","constructor","token","LogicalFilterOperator"],"sources":["./src/components/category-filter/input-state.ts","./src/components/category-filter/logical-filter-operator.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nexport class InputState {\n  public token: string;\n  public category: string;\n\n  public hasCategory() {\n    return this.category !== undefined;\n  }\n\n  constructor(token: string, category: string) {\n    this.token = token;\n    this.category = category;\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\nexport enum LogicalFilterOperator {\n  EQUAL = 'Equal',\n  NOT_EQUAL = 'Not equal',\n}\n"],"mappings":"MASaA,EAIJC,cACL,OAAOC,KAAKC,WAAaC,S,CAG3BC,YAAYC,EAAeH,GACzBD,KAAKI,MAAQA,EACbJ,KAAKC,SAAWA,C,MCVRI,GAAZ,SAAYA,GACVA,EAAA,iBACAA,EAAA,wBACD,EAHD,CAAYA,MAAqB,Y"}

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

@@ -0,0 +1,2 @@
+import{r as s,h as e,F as o,H as t,g as r,c as i}from"./p-8fcd6f85.js";const l=".sc-ix-workflow-step-h .step.sc-ix-workflow-step{display:flex;flex-direction:column;align-items:center;background-color:var(--theme-workflow-step--background);border-radius:var(--theme-workflow--border-radius);width:auto;padding:1.125rem 0 0.5rem 0;height:4rem;width:12.75rem}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step{display:flex;width:100%;align-items:center;justify-content:center}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.sc-ix-workflow-step{width:100%;height:0.125rem;background-color:var(--theme-workflow-step-icon-default--color)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.first.sc-ix-workflow-step,.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{width:50%;margin:0 0 0 auto}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{margin:0 auto 0 0}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-default--color--selected)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.done.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-done--color)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.done.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-done--color--selected)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.warning.sc-ix-workflow-step{background-color:var(--theme-color-warning)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.success.sc-ix-workflow-step{background-color:var(--theme-color-success)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.error.sc-ix-workflow-step{background-color:var(--theme-color-alarm)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .iconWrapper.sc-ix-workflow-step{display:flex;align-items:center;justify-content:center;position:absolute}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .iconWrapper.sc-ix-workflow-step .absolute.sc-ix-workflow-step{position:absolute}.sc-ix-workflow-step-h .step.sc-ix-workflow-step .text.sc-ix-workflow-step{margin-top:1rem;width:auto;padding:0 0.5rem}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step{flex-direction:row;padding:0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step{width:auto;padding-left:1.125rem;height:4rem}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.sc-ix-workflow-step{width:0.125rem;height:100%}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.first.sc-ix-workflow-step,.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{height:50%;margin:auto 0 0 0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .wrapper.sc-ix-workflow-step .line.last.sc-ix-workflow-step{margin:0 0 auto 0}.sc-ix-workflow-step-h .step.vertical.sc-ix-workflow-step .text.sc-ix-workflow-step{margin-top:0;margin-left:1rem;padding:0}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:hover{background-color:var(--theme-workflow-step--background--hover)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:active{background-color:var(--theme-workflow-step--background--active)}.sc-ix-workflow-step-h .step.sc-ix-workflow-step:focus-visible{outline:1px solid var(--focus--border-color);border-radius:0}.sc-ix-workflow-step-h .step.selected.sc-ix-workflow-step{background-color:var(--theme-workflow-step--background--selected)}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step{background-color:var(--theme-workflow-step--background--disabled)}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step .line.sc-ix-workflow-step{background-color:var(--theme-workflow-step-icon-default--color--disabled) !important}.sc-ix-workflow-step-h .step.disabled.sc-ix-workflow-step .text.sc-ix-workflow-step{color:var(--theme-workflow-step--color--disabled)}";const c=class{constructor(e){s(this,e);this.vertical=false;this.disabled=false;this.status="open";this.clickable=false;this.selected=false;this.position="undefined";this.iconName="circle";this.iconColor="workflow-step-icon-default--color"}select(){if(!this.clickable)return;if(this.disabled)return;this.selected=true;this.selectedHandler()}selectedHandler(){const s=this.selected?"--selected":"";if(this.status==="open"){this.iconName=this.selected?"circle-dot":"circle";this.iconColor=`workflow-step-icon-default--color${s}`}if(this.status==="done"&&!this.disabled){this.iconColor=`workflow-step-icon-done--color${s}`}}watchPropHandler(){switch(this.status){case"open":this.iconName="circle";this.iconColor="workflow-step-icon-default--color";break;case"success":this.iconName="success";this.iconColor="color-success";break;case"done":this.iconName="success";this.iconColor="workflow-step-icon-done--color";break;case"warning":this.iconName="warning";this.iconColor="color-warning";break;case"error":this.iconName="error";this.iconColor="color-alarm";break;default:this.iconName="circle";break}if(this.disabled){this.iconColor="workflow-step-icon-success--color--disabled"}}componentDidLoad(){this.watchPropHandler();this.selectedHandler();this.customIconSlot=!!this.hostElement.querySelector('[slot="custom-icon"]')}render(){const s=!this.customIconSlot?e(o,null,e("ix-icon",{color:"color-1",name:this.iconName==="warning"?"triangle-filled":"circle-filled",class:"absolute",size:"24"}),e("ix-icon",{color:this.iconColor,name:this.iconName,class:"absolute",size:"24"})):"";return e(t,null,e("div",{tabIndex:0,onClick:()=>this.select(),class:{step:true,selected:this.selected,vertical:this.vertical,disabled:this.disabled}},e("div",{class:"wrapper"},e("div",{class:{line:true,selected:this.selected,[this.status]:true,[this.position]:true}}),e("div",{class:"iconWrapper"},s,e("slot",{name:"custom-icon"}))),e("div",{class:"text"},e("slot",null))))}get hostElement(){return r(this)}static get watchers(){return{selected:["selectedHandler"],status:["watchPropHandler"]}}};c.style=l;const w=".sc-ix-workflow-steps-h .steps.sc-ix-workflow-steps{display:flex}.sc-ix-workflow-steps-h .steps.vertical.sc-ix-workflow-steps{display:block}";const p=class{constructor(e){s(this,e);this.stepSelected=i(this,"stepSelected",7);this.vertical=false;this.linear=false;this.clickable=false;this.selectedIndex=0}getSteps(){return Array.from(this.hostElement.querySelectorAll("ix-workflow-step"))}deselectAll(){const s=this.getSteps();s.forEach((s=>{s.setAttribute("selected","false")}))}componentDidRender(){const s=this.getSteps();s.forEach(((e,o)=>{e.setAttribute("vertical",this.vertical===true?"true":"false");e.setAttribute("clickable",this.clickable===true?"true":"false");e.setAttribute("selected",this.selectedIndex===o?"true":"false");if(o===0)e.setAttribute("position","first");if(o===s.length-1)e.setAttribute("position","last")}))}componentWillRender(){const s=this.getSteps();s.forEach(((e,o)=>{e.addEventListener("click",(()=>{if(!this.clickable)return;const t=s[o-1];if(this.linear&&t&&!["done","success"].includes(t===null||t===void 0?void 0:t.status)){return e.setAttribute("selected","false")}this.deselectAll();e.setAttribute("selected","true");this.stepSelected.emit(o)}))}))}render(){return e(t,null,e("div",{class:{steps:true,vertical:this.vertical}},e("slot",null)))}get hostElement(){return r(this)}};p.style=w;export{c as ix_workflow_step,p as ix_workflow_steps};
+//# sourceMappingURL=p-7ce0c0e2.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["workflowStepCss","WorkflowStep","select","this","clickable","disabled","selected","selectedHandler","selectedStyle","status","iconName","iconColor","watchPropHandler","componentDidLoad","customIconSlot","hostElement","querySelector","render","icons","h","Fragment","color","name","class","size","Host","tabIndex","onClick","step","vertical","line","position","workflowStepsCss","WorkflowSteps","getSteps","Array","from","querySelectorAll","deselectAll","steps","forEach","element","setAttribute","componentDidRender","index","selectedIndex","length","componentWillRender","addEventListener","previousElement","linear","includes","stepSelected","emit"],"sources":["./src/components/workflow-step/workflow-step.scss?tag=ix-workflow-step&encapsulation=scoped","./src/components/workflow-step/workflow-step.tsx","./src/components/workflow-steps/workflow-steps.scss?tag=ix-workflow-steps&encapsulation=scoped","./src/components/workflow-steps/workflow-steps.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/*\n * COPYRIGHT (c) Siemens AG 2018-2022 ALL RIGHTS RESERVED.\n */\n\n@import 'common-variables';\n\n:host {\n  .step {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    background-color: var(--theme-workflow-step--background);\n    border-radius: var(--theme-workflow--border-radius);\n    width: auto;\n    padding: 1.125rem 0 $small-space 0;\n    height: 4rem;\n    width: 12.75rem;\n\n    .wrapper {\n      display: flex;\n      width: 100%;\n      align-items: center;\n      justify-content: center;\n\n      .line {\n        width: 100%;\n        height: 0.125rem;\n        background-color: var(--theme-workflow-step-icon-default--color);\n\n        &.first,\n        &.last {\n          width: 50%;\n          margin: 0 0 0 auto;\n        }\n\n        &.last {\n          margin: 0 auto 0 0;\n        }\n\n        &.selected {\n          background-color: var(\n            --theme-workflow-step-icon-default--color--selected\n          );\n        }\n\n        &.done {\n          background-color: var(--theme-workflow-step-icon-done--color);\n\n          &.selected {\n            background-color: var(\n              --theme-workflow-step-icon-done--color--selected\n            );\n          }\n        }\n\n        &.warning {\n          background-color: var(--theme-color-warning);\n        }\n\n        &.success {\n          background-color: var(--theme-color-success);\n        }\n\n        &.error {\n          background-color: var(--theme-color-alarm);\n        }\n      }\n\n      .iconWrapper {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        position: absolute;\n\n        .absolute {\n          position: absolute;\n        }\n      }\n    }\n\n    .text {\n      margin-top: $default-space;\n      width: auto;\n      padding: 0 $small-space;\n    }\n\n    &.vertical {\n      flex-direction: row;\n      padding: 0;\n\n      .wrapper {\n        width: auto;\n        padding-left: 1.125rem;\n        height: 4rem;\n\n        .line {\n          width: 0.125rem;\n          height: 100%;\n\n          &.first,\n          &.last {\n            height: 50%;\n            margin: auto 0 0 0;\n          }\n\n          &.last {\n            margin: 0 0 auto 0;\n          }\n        }\n      }\n\n      .text {\n        margin-top: 0;\n        margin-left: $default-space;\n        padding: 0;\n      }\n    }\n\n    &:hover {\n      background-color: var(--theme-workflow-step--background--hover);\n    }\n\n    &:active {\n      background-color: var(--theme-workflow-step--background--active);\n    }\n\n    &:focus-visible {\n      outline: 1px solid var(--focus--border-color);\n      border-radius: 0;\n    }\n\n    &.selected {\n      background-color: var(--theme-workflow-step--background--selected);\n    }\n\n    &.disabled {\n      background-color: var(--theme-workflow-step--background--disabled);\n\n      .line {\n        background-color: var(\n          --theme-workflow-step-icon-default--color--disabled\n        ) !important;\n      }\n\n      .text {\n        color: var(--theme-workflow-step--color--disabled);\n      }\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/*\n * COPYRIGHT (c) Siemens AG 2018-2022 ALL RIGHTS RESERVED.\n */\n\nimport {\n  Component,\n  Element,\n  Fragment,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-workflow-step',\n  styleUrl: 'workflow-step.scss',\n  scoped: true,\n})\nexport class WorkflowStep {\n  @Element() hostElement: HTMLIxWorkflowStepElement;\n\n  /**\n   * Select orientation\n   */\n  @Prop() vertical: boolean = false;\n\n  /**\n   * Set disabled\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Set status\n   */\n  @Prop() status: 'open' | 'success' | 'done' | 'warning' | 'error' = 'open';\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() clickable: boolean = false;\n\n  /**\n   * Set selected\n   */\n  @Prop({ mutable: true }) selected: boolean = false;\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() position: 'first' | 'last' | 'undefined' = 'undefined';\n\n  @State() iconName: 'circle' | 'circle-dot' | 'success' | 'warning' | 'error' =\n    'circle';\n  @State() iconColor: string = 'workflow-step-icon-default--color';\n\n  private customIconSlot: boolean;\n\n  private select() {\n    if (!this.clickable) return;\n    if (this.disabled) return;\n\n    this.selected = true;\n    this.selectedHandler();\n  }\n\n  @Watch('selected')\n  selectedHandler() {\n    const selectedStyle = this.selected ? '--selected' : '';\n\n    if (this.status === 'open') {\n      this.iconName = this.selected ? 'circle-dot' : 'circle';\n      this.iconColor = `workflow-step-icon-default--color${selectedStyle}`;\n    }\n\n    if (this.status === 'done' && !this.disabled) {\n      this.iconColor = `workflow-step-icon-done--color${selectedStyle}`;\n    }\n  }\n\n  @Watch('status')\n  watchPropHandler() {\n    switch (this.status) {\n      case 'open':\n        this.iconName = 'circle';\n        this.iconColor = 'workflow-step-icon-default--color';\n        break;\n      case 'success':\n        this.iconName = 'success';\n        this.iconColor = 'color-success';\n        break;\n      case 'done':\n        this.iconName = 'success';\n        this.iconColor = 'workflow-step-icon-done--color';\n        break;\n      case 'warning':\n        this.iconName = 'warning';\n        this.iconColor = 'color-warning';\n        break;\n      case 'error':\n        this.iconName = 'error';\n        this.iconColor = 'color-alarm';\n        break;\n\n      default:\n        this.iconName = 'circle';\n        break;\n    }\n\n    if (this.disabled) {\n      this.iconColor = 'workflow-step-icon-success--color--disabled';\n    }\n  }\n\n  componentDidLoad() {\n    this.watchPropHandler();\n    this.selectedHandler();\n\n    this.customIconSlot = !!this.hostElement.querySelector(\n      '[slot=\"custom-icon\"]'\n    );\n  }\n\n  render() {\n    const icons = !this.customIconSlot ? (\n      <Fragment>\n        <ix-icon\n          color=\"color-1\"\n          name={\n            this.iconName === 'warning' ? 'triangle-filled' : 'circle-filled'\n          }\n          class=\"absolute\"\n          size=\"24\"\n        ></ix-icon>\n        <ix-icon\n          color={this.iconColor}\n          name={this.iconName}\n          class=\"absolute\"\n          size=\"24\"\n        ></ix-icon>\n      </Fragment>\n    ) : (\n      ''\n    );\n\n    return (\n      <Host>\n        <div\n          tabIndex={0}\n          onClick={() => this.select()}\n          class={{\n            step: true,\n            selected: this.selected,\n            vertical: this.vertical,\n            disabled: this.disabled,\n          }}\n        >\n          <div class=\"wrapper\">\n            <div\n              class={{\n                line: true,\n                selected: this.selected,\n                [this.status]: true,\n                [this.position]: true,\n              }}\n            ></div>\n            <div class=\"iconWrapper\">\n              {icons}\n              <slot name=\"custom-icon\"></slot>\n            </div>\n          </div>\n          <div class=\"text\">\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/*\n * COPYRIGHT (c) Siemens AG 2018-2022 ALL RIGHTS RESERVED.\n */\n\n@import 'common-variables';\n\n:host {\n  .steps {\n    display: flex;\n\n    &.vertical {\n      display: block;\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/*\n * COPYRIGHT (c) Siemens AG 2018-2022 ALL RIGHTS RESERVED.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n} from '@stencil/core';\n\n@Component({\n  tag: 'ix-workflow-steps',\n  styleUrl: 'workflow-steps.scss',\n  scoped: true,\n})\nexport class WorkflowSteps {\n  @Element() hostElement!: HTMLIxWorkflowStepsElement;\n\n  /**\n   * Select orientation\n   */\n  @Prop() vertical: boolean = false;\n\n  /**\n   * Select linear mode\n   */\n  @Prop() linear: boolean = false;\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() clickable: boolean = false;\n\n  /**\n   * Activate navigation click\n   */\n  @Prop() selectedIndex: number = 0;\n\n  /**\n   * On step selected event\n   */\n  @Event() stepSelected: EventEmitter<number>;\n\n  private getSteps() {\n    return Array.from(this.hostElement.querySelectorAll('ix-workflow-step'));\n  }\n\n  private deselectAll() {\n    const steps = this.getSteps();\n    steps.forEach((element) => {\n      element.setAttribute('selected', 'false');\n    });\n  }\n\n  componentDidRender() {\n    const steps = this.getSteps();\n\n    steps.forEach((element, index) => {\n      element.setAttribute(\n        'vertical',\n        this.vertical === true ? 'true' : 'false'\n      );\n      element.setAttribute(\n        'clickable',\n        this.clickable === true ? 'true' : 'false'\n      );\n      element.setAttribute(\n        'selected',\n        this.selectedIndex === index ? 'true' : 'false'\n      );\n      if (index === 0) element.setAttribute('position', 'first');\n      if (index === steps.length - 1) element.setAttribute('position', 'last');\n    });\n  }\n\n  componentWillRender() {\n    const steps = this.getSteps();\n    steps.forEach((element, index) => {\n      element.addEventListener('click', () => {\n        if (!this.clickable) return;\n        const previousElement = steps[index - 1];\n        if (\n          this.linear &&\n          previousElement &&\n          !['done', 'success'].includes(previousElement?.status)\n        ) {\n          return element.setAttribute('selected', 'false');\n        }\n        this.deselectAll();\n        element.setAttribute('selected', 'true');\n        this.stepSelected.emit(index);\n      });\n      // const isEnabled = element.getAttribute('first');\n      // if(isEnabled){\n\n      // }\n      // console.log(isEnabled)\n      // const isDisabled = element.getAttribute('disabled') !== null;\n      // if (!isDisabled) element.addEventListener('click', () => '');\n      //element.addEventListener('mousedown', event => this.clicked(element, index));\n    });\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={{ steps: true, vertical: this.vertical }}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

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

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as i}from"./p-8fcd6f85.js";const o='@charset "UTF-8";ix-tab-item{position:relative;display:flex;align-items:center;justify-content:center;height:40px;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}ix-tab-item.circle{height:72px}ix-tab-item.top::after{top:0}ix-tab-item.bottom::after{bottom:0}ix-tab-item::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}ix-tab-item.stretched{flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ix-tab-item .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}ix-tab-item .text span,ix-tab-item .text span::before{pointer-events:none}ix-tab-item:hover:not(.circle){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}ix-tab-item:hover:not(.circle)::after{background-color:var(--theme-tab-indicator--background--hover)}ix-tab-item:active:not(.circle){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}ix-tab-item:active:not(.circle)::after{background-color:var(--theme-tab-indicator--background--active)}ix-tab-item:focus-visible{outline:0px solid var(--focus--border-color)}ix-tab-item:focus-visible .circle{outline:1px solid var(--focus--border-color)}ix-tab-item:focus-visible:not(.circle){outline:1px solid var(--focus--border-color)}ix-tab-item.disabled{color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}ix-tab-item.disabled::after{background-color:var(--theme-tab-indicator--background--disabled)}ix-tab-item.selected:not(.disabled){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}ix-tab-item.selected:not(.disabled)::after{background-color:var(--theme-tab-indicator--background--selected)}ix-tab-item.icon{padding:1.5rem 0.5rem}ix-tab-item.small-tab{height:32px;padding:1rem}ix-tab-item.small-tab.icon{padding:1rem 0.25rem}ix-tab-item .circle{display:flex;justify-content:center;align-items:center;height:48px;width:48px;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}ix-tab-item .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)}ix-tab-item .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}ix-tab-item .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}ix-tab-item .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}ix-tab-item .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}ix-tab-item .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}ix-tab-item .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:16px;color:var(--theme-pill-outline--color);cursor:pointer}ix-tab-item .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}ix-tab-item .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}ix-tab-item .hidden{display:none}';const r=class{constructor(t){e(this,t);this.selected=false;this.disabled=false;this.small=false;this.icon=false;this.rounded=false;this.counter=undefined;this.layout="auto";this.placement="bottom"}tabItemClasses(e){return{selected:e.selected,disabled:e.disabled,"small-tab":e.small,icon:e.small,stretched:e.layout==="stretched",bottom:e.placement==="bottom",top:e.placement==="top",circle:e.circle}}render(){return t(i,{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},t("div",{class:{circle:this.rounded,text:!this.rounded,selected:this.selected,disabled:this.disabled}},t("slot",null)),t("div",{class:{counter:true,selected:this.selected,hidden:!(this.rounded&&this.counter!==undefined),disabled:this.disabled}},this.counter))}};r.style=o;export{r as ix_tab_item};
+//# sourceMappingURL=p-7d4a7388.entry.js.map