@telia-ace/alliance-ui 1.0.3-next.0 → 1.0.3

package/voca/components/telia-tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"telia-tab.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.1.8/node_modules/@teliads/components/dist/components/telia-tab.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';\nimport { d as defineCustomElement$3, T as TabNavigationTypes } from './telia-tab-header2.js';\nimport { d as defineCustomElement$4 } from './telia-icon2.js';\nimport { d as defineCustomElement$2 } from './telia-vst2.js';\n\nconst teliaTabCss = \".telia-tab__header{list-style:none;margin:calc(0.4rem * var(--voca-rem-multiplier)) calc(0.2rem * var(--voca-rem-multiplier)) calc(0.4rem * var(--voca-rem-multiplier)) calc(0.2rem * var(--voca-rem-multiplier))}.telia-tab__header:last-child{margin-right:calc(0.4rem * var(--voca-rem-multiplier))}.telia-tab__header--active{background-color:#ffffff;margin-bottom:0}.telia-tab__wrapper{position:relative;}@media (any-pointer: coarse){.telia-tab__wrapper{-ms-overflow-style:none;}.telia-tab__wrapper ::-webkit-scrollbar{display:none;}}.telia-tab__wrapper--has-scroll .telia-tab__list{overflow-y:auto}.telia-tab__wrapper--is-scrolled{-webkit-mask-image:linear-gradient(to left, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)));mask-image:linear-gradient(to left, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)))}.telia-tab__wrapper--is-scrolled .telia-tab__list{-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)));mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)))}.telia-tab__wrapper--scroll_end{-webkit-mask-image:none;mask-image:none}.telia-tab__wrapper--scroll_end .telia-tab__list{-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)));mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)))}.telia-tab__wrapper--scroll_start{-webkit-mask-image:linear-gradient(to left, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)));mask-image:linear-gradient(to left, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)))}.telia-tab__list{display:inline-flex;max-width:100%;min-width:100%;overflow-y:visible;position:relative}@media (any-pointer: coarse){.telia-tab__list{overflow:hidden}}.telia-tab__list::before{content:\\\"small\\\";display:none}@media screen and (min-width: 37.5em){.telia-tab__list::before{content:\\\"medium\\\"}}@media screen and (min-width: 64em){.telia-tab__list::before{content:\\\"large\\\"}}.telia-tab__list__container{display:inline-flex;flex-grow:1;margin:0 0 0 calc(-1 * calc(0.2rem * var(--voca-rem-multiplier)));padding:0}@media (any-pointer: coarse){.telia-tab__list__container{overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;}}.telia-tab__content{background-color:#ffffff;padding:calc(1.6rem * var(--voca-rem-multiplier)) 0}.telia-tab__content--light-background{background-color:#ffffff}.telia-tab__content .telia-tab__container{padding:0 calc(1.6rem * var(--voca-rem-multiplier))}@media screen and (min-width: 37.5em){.telia-tab__content .telia-tab__container{padding:0 calc(2.4rem * var(--voca-rem-multiplier))}}@media screen and (min-width: 64em){.telia-tab__content .telia-tab__container{padding:0 calc(2.4rem * var(--voca-rem-multiplier))}}.telia-tab--default .telia-tab__container{box-sizing:border-box;display:block;margin-left:auto;margin-right:auto;max-width:calc(144rem * var(--voca-rem-multiplier));padding:0 calc(1.6rem * var(--voca-rem-multiplier));width:100%}@media screen and (min-width: 37.5em){.telia-tab--default .telia-tab__container{padding:0 calc(2.4rem * var(--voca-rem-multiplier))}}@media screen and (min-width: 64em){.telia-tab--default .telia-tab__container{padding:0 calc(4.8rem * var(--voca-rem-multiplier))}}@media screen and (min-width: 90em){.telia-tab--default .telia-tab__container{padding:0 calc(6.4rem * var(--voca-rem-multiplier))}}.telia-tab--default .telia-tab__wrapper--has-scroll{margin-left:calc(-1 * calc(1.6rem * var(--voca-rem-multiplier)));margin-right:calc(-1 * calc(1.6rem * var(--voca-rem-multiplier)));}@media screen and (min-width: 37.5em){.telia-tab--default .telia-tab__wrapper--has-scroll{margin-left:calc(-1 * calc(2.4rem * var(--voca-rem-multiplier)));margin-right:calc(-1 * calc(2.4rem * var(--voca-rem-multiplier)))}}@media screen and (min-width: 64em){.telia-tab--default .telia-tab__wrapper--has-scroll{margin-left:calc(-1 * calc(4.8rem * var(--voca-rem-multiplier)));margin-right:calc(-1 * calc(4.8rem * var(--voca-rem-multiplier)))}}.telia-tab--default .telia-tab__wrapper--has-scroll .telia-tab__header:first-child{margin-left:calc(1.6rem * var(--voca-rem-multiplier))}@media screen and (min-width: 37.5em){.telia-tab--default .telia-tab__wrapper--has-scroll .telia-tab__header:first-child{margin-left:calc(2.4rem * var(--voca-rem-multiplier))}}@media screen and (min-width: 64em){.telia-tab--default .telia-tab__wrapper--has-scroll .telia-tab__header:first-child{margin-left:calc(4.8rem * var(--voca-rem-multiplier))}}.telia-tab--light .telia-tab__list,.telia-tab--light-wide .telia-tab__list{position:static;width:100%}.telia-tab--light .telia-tab__list::after,.telia-tab--light-wide .telia-tab__list::after{background-color:#c8c8cd;bottom:calc(0.2rem * var(--voca-rem-multiplier));content:\\\"\\\";display:block;height:calc(0.2rem * var(--voca-rem-multiplier));left:0;position:absolute;right:0;width:100%}.telia-tab--light .telia-tab__header--active,.telia-tab--light-wide .telia-tab__header--active{background-color:transparent}.telia-tab--light .telia-tab__content,.telia-tab--light-wide .telia-tab__content{background-color:transparent}.telia-tab--wide .telia-tab__header,.telia-tab--light-wide .telia-tab__header{flex-basis:auto;flex-grow:1;min-width:fit-content;width:calc(17.7rem * var(--voca-rem-multiplier))}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}\";\n\nconst TeliaTab$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    this.__attachShadow();\n    this.vocaTabChange = createEvent(this, \"vocaTabChange\", 7);\n    /** State scroll used for toggeling horizontal scroll shadow */\n    this.scrollClasses = ' ';\n    /** Array of slotted children */\n    this.children = [];\n    /** sets background on content */\n    this.background = false;\n    /** variant */\n    this.variant = 'default';\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-tab';\n    this.activeIndex = 0;\n    this.wrapperClass = 'telia-tab__wrapper';\n    this.isKeyPress = true;\n    /**\n     * Because the component effectively reloads directly after\n     * first load, we need to scroll to the active tab in the componentDidUpdate\n     * hook. This can create an infinite loop unless prevented by this property\n     * that is set to true when/if user scrolls.\n     */\n    this.preventScrollLoop = false;\n    this.onIntersection = (entries) => {\n      let allTabItemsIsVisible = false;\n      let firstTabItemIsActiveInScope = false;\n      // If all entries are visible\n      if (entries.every(entry => entry.isIntersecting) &&\n        entries.length === this.tabItems.length) {\n        this.scrollClasses = ' ';\n        allTabItemsIsVisible = true;\n      }\n      entries.forEach(entry => {\n        // if entry is visible\n        if (entry.isIntersecting) {\n          let entryIndex = Number(entry.target.children[0].getAttribute('data-index'));\n          if (entryIndex === 0 &&\n            entry.target.classList.contains('telia-tab__header--active')) {\n            // 0 = first tabItem\n            firstTabItemIsActiveInScope = true;\n          }\n          if (entryIndex === 0 || entryIndex === 1) {\n            this.scrollClasses =\n              this.wrapperClass +\n                '--scroll_start' +\n                ' ' +\n                this.wrapperClass +\n                '--has-scroll';\n          }\n          else if (entryIndex === this.tabItems.length - 1) {\n            this.scrollClasses =\n              this.wrapperClass +\n                '--scroll_end' +\n                ' ' +\n                this.wrapperClass +\n                '--has-scroll';\n          }\n          else if (this.scrollClasses !=\n            this.wrapperClass +\n              '--is-scrolled' +\n              ' ' +\n              this.wrapperClass +\n              '--has-scroll') {\n            if (firstTabItemIsActiveInScope) {\n              this.calculateScroll();\n            }\n            else {\n              this.scrollClasses =\n                this.wrapperClass +\n                  '--is-scrolled' +\n                  ' ' +\n                  this.wrapperClass +\n                  '--has-scroll';\n            }\n          }\n        }\n      });\n      if (allTabItemsIsVisible) {\n        this.calculateScroll();\n      }\n    };\n  }\n  handleTabNavigation(e) {\n    const { location, key } = e.detail.value;\n    const currentIndex = this.activeIndex;\n    let nextIndex;\n    this.isKeyPress = true;\n    if (location > -1) {\n      nextIndex = location;\n      this.isKeyPress = false;\n    }\n    switch (key) {\n      case TabNavigationTypes.ArrowLeft:\n        if (currentIndex > 0) {\n          nextIndex = currentIndex - 1;\n        }\n        else {\n          nextIndex = this.children.length - 1;\n        }\n        break;\n      case TabNavigationTypes.ArrowRight:\n        if (currentIndex < this.children.length - 1) {\n          nextIndex = currentIndex + 1;\n        }\n        else {\n          nextIndex = 0;\n        }\n        break;\n      case TabNavigationTypes.Home:\n        nextIndex = 0;\n        break;\n      case TabNavigationTypes.End:\n        nextIndex = this.children.length - 1;\n        break;\n    }\n    this.activeIndex = nextIndex;\n    this.children.forEach((child, index) => {\n      child.active = index === nextIndex;\n    });\n    this.vocaTabChange.emit({ value: this.children[this.activeIndex].tabId });\n    this.createChildren();\n  }\n  handleResize() {\n    this.setBreakpointAndGridPadding();\n    this.calculateScroll();\n  }\n  componentWillLoad() {\n    this.createChildren();\n    this.findPreSelectedTab();\n  }\n  componentDidLoad() {\n    this.tabItems = this.host.shadowRoot.querySelectorAll('.telia-tab__header');\n    this.observer = new IntersectionObserver(this.onIntersection, {\n      threshold: [0.75],\n    });\n    this.tabItems.forEach(el => this.observer.observe(el));\n    this.setGridPadding();\n    this.setBreakpointAndGridPadding();\n    this.calculateScroll();\n  }\n  componentDidUpdate() {\n    if (!this.preventScrollLoop) {\n      this.scrollToTarget(this.getActiveTabListItem());\n    }\n  }\n  disconnectedCallback() {\n    // if we have an intersection observer, disconnect it\n    if (this.observer !== null) {\n      this.observer.disconnect();\n    }\n  }\n  /**\n   * Gets and sets current grid padding, used for calculation of scroll\n   * @private\n   */\n  setGridPadding() {\n    this.gridPadding = 2; // = telia-tab__list__container margin left -2, missing 2 px, Needs to be investigated why it is even needed since the last commit changes.\n  }\n  /**\n   * Get current breakpoint from style. It is important to\n   * call calculateScroll after this method is called,\n   * or it may not have desired effect.\n   * @private\n   */\n  setBreakpointAndGridPadding() {\n    if (this.tabList === undefined) {\n      return;\n    }\n    const currentBreakpoint = window\n      .getComputedStyle(this.tabList, ':before')\n      .getPropertyValue('content')\n      .replace(/\\\"/g, '');\n    if (currentBreakpoint != this.breakPoint) {\n      this.breakPoint = currentBreakpoint;\n      this.setGridPadding();\n    }\n  }\n  /**\n   * Check if there is a pre-selected tab,\n   * else set first tab as pre-selected\n   * @private\n   */\n  findPreSelectedTab() {\n    if (this.children.length === 0)\n      return;\n    /**\n     * flag to indicate that an active tab\n     * was found on render\n     */\n    let activePreSet = false;\n    this.children.forEach((child, index) => {\n      if (activePreSet) {\n        /**\n         * since flag is true\n         * all other tabs should\n         * be set to not active\n         */\n        child.active = false;\n      }\n      if (child.active) {\n        activePreSet = true;\n        this.activeIndex = index;\n      }\n    });\n    if (this.activeIndex === 0) {\n      this.children[this.activeIndex].active = true;\n    }\n  }\n  /**\n   * Will scroll tab list to keyboard focused tab header\n   * @param target\n   * @private\n   */\n  scrollToTarget(target) {\n    var _a;\n    /**\n     * scroll may not be available in\n     * test runner, so check existence\n     * before proceeding.\n     */\n    if (this.tabList.scroll == null) {\n      return;\n    }\n    const targetRect = target.getBoundingClientRect();\n    const wrapperRect = this.tabList.getBoundingClientRect();\n    const wrapperWidth = this.tabList.clientWidth;\n    const wrapperOffset = parseInt((_a = getComputedStyle(this.tabList)['border-width-left']) === null || _a === void 0 ? void 0 : _a.split('px')[0], 10);\n    let offset = wrapperRect.left + (isNaN(wrapperOffset) ? 0 : wrapperOffset);\n    let left;\n    //Handle forward navigation\n    if (targetRect.right > wrapperRect.right) {\n      left = targetRect.left + this.tabList.scrollLeft;\n      left = left + targetRect.width - wrapperWidth + wrapperWidth * 0.1;\n      left = left - offset;\n    }\n    //Handle backwards navigation\n    if (targetRect.left < wrapperRect.left) {\n      left = targetRect.left + this.tabList.scrollLeft;\n      left = left - wrapperWidth * 0.1;\n      left = left - offset;\n    }\n    if (left !== undefined) {\n      this.tabList.scroll({ left: left, behavior: 'smooth' });\n    }\n  }\n  /**\n   * Create child array\n   * @private\n   */\n  createChildren() {\n    this.children = [];\n    let slotted = this.host.querySelectorAll('telia-tab-content');\n    slotted.forEach(node => {\n      if (node.nodeName.indexOf('TELIA-TAB') > -1) {\n        this.children.push(node);\n      }\n    });\n  }\n  getActiveTabListItem() {\n    return this.tabList.querySelector('.telia-tab__header--active');\n  }\n  /**\n   * Checks if there is a scroll in tab list and sets relevant class\n   * @private\n   */\n  calculateScroll() {\n    this.scrollToTarget(this.getActiveTabListItem());\n    let headerContainer = this.host.shadowRoot.querySelector('.telia-tab__list__container');\n    let headerWrapper = this.host.shadowRoot.querySelector('.telia-tab__wrapper');\n    if (headerContainer.scrollWidth >\n      headerWrapper.offsetWidth + this.gridPadding) {\n      this.scrollClasses =\n        this.wrapperClass +\n          '--scroll_start ' +\n          this.wrapperClass +\n          '--has-scroll';\n    }\n    else if (headerContainer.scrollWidth ===\n      headerWrapper.offsetWidth + this.gridPadding) {\n      this.scrollClasses = ' ';\n    }\n  }\n  render() {\n    const tabClasses = {\n      'telia-tab': true,\n      [`telia-tab--${this.variant}`]: !!this.variant,\n    };\n    const contentClasses = {\n      'telia-tab__content': true,\n      'telia-tab__content--light-background': this.background,\n    };\n    return (h(\"div\", { class: tabClasses }, h(\"telia-vst\", { dataTrackingId: this.dataTrackingId }), h(\"div\", { class: \"telia-tab__container\" }, h(\"div\", { class: this.wrapperClass + ' ' + this.scrollClasses }, h(\"div\", { ref: el => (this.tabList = el), class: \"telia-tab__list\", role: \"tablist\" }, h(\"ul\", { class: \"telia-tab__list__container\", role: \"presentation\" }, this.children.map((child, index) => {\n      return (h(\"li\", { role: \"presentation\", class: {\n          'telia-tab__header': true,\n          'telia-tab__header--active': child.active,\n        }, onFocusin: e => {\n          this.scrollToTarget(e.target);\n        } }, h(\"telia-tab-header\", { tabId: child.tabId, icon: child.icon, name: child.name, active: child.active, \"data-testid\": child.dataTestid, \"data-index\": index, \"is-key-press\": this.isKeyPress, variant: this.variant }, child.name)));\n    }))))), h(\"div\", { class: contentClasses, role: \"presentation\" }, h(\"div\", { class: \"telia-tab__container\", role: \"presentation\" }, h(\"slot\", null)))));\n  }\n  get host() { return this; }\n  static get style() { return teliaTabCss; }\n}, [1, \"telia-tab\", {\n    \"background\": [4],\n    \"variant\": [1],\n    \"scrollClasses\": [32],\n    \"children\": [32]\n  }, [[0, \"vocaInternalTabNavigation\", \"handleTabNavigation\"], [9, \"resize\", \"handleResize\"]]]);\nfunction defineCustomElement$1() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-tab\", \"telia-icon\", \"telia-tab-header\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-tab\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaTab$1);\n      }\n      break;\n    case \"telia-icon\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$4();\n      }\n      break;\n    case \"telia-tab-header\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$3();\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$2();\n      }\n      break;\n  } });\n}\ndefineCustomElement$1();\n\nconst TeliaTab = TeliaTab$1;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TeliaTab, defineCustomElement };\n"],"names":["teliaTabCss","TeliaTab$1","proxyCustomElement","HTMLElement","createEvent","entries","allTabItemsIsVisible","firstTabItemIsActiveInScope","entry","entryIndex","e","location","key","currentIndex","nextIndex","TabNavigationTypes","child","index","el","currentBreakpoint","activePreSet","target","_a","targetRect","wrapperRect","wrapperWidth","wrapperOffset","offset","left","node","headerContainer","headerWrapper","tabClasses","contentClasses","h","defineCustomElement$1","tagName","defineCustomElement$4","defineCustomElement$3","defineCustomElement$2"],"mappings":"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"}
+{"version":3,"file":"telia-tab.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.2.0/node_modules/@teliads/components/dist/components/telia-tab.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';\nimport { d as defineCustomElement$3, T as TabNavigationTypes } from './telia-tab-header2.js';\nimport { d as defineCustomElement$4 } from './telia-icon2.js';\nimport { d as defineCustomElement$2 } from './telia-vst2.js';\n\nconst teliaTabCss = \".telia-tab__header{list-style:none;margin:calc(0.4rem * var(--voca-rem-multiplier)) calc(0.2rem * var(--voca-rem-multiplier)) calc(0.4rem * var(--voca-rem-multiplier)) calc(0.2rem * var(--voca-rem-multiplier))}.telia-tab__header:last-child{margin-right:calc(0.4rem * var(--voca-rem-multiplier))}.telia-tab__header--active{background-color:#ffffff;margin-bottom:0}.telia-tab__wrapper{position:relative;}@media (any-pointer: coarse){.telia-tab__wrapper{-ms-overflow-style:none;}.telia-tab__wrapper ::-webkit-scrollbar{display:none;}}.telia-tab__wrapper--has-scroll .telia-tab__list{overflow-y:auto}.telia-tab__wrapper--is-scrolled{-webkit-mask-image:linear-gradient(to left, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)));mask-image:linear-gradient(to left, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)))}.telia-tab__wrapper--is-scrolled .telia-tab__list{-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)));mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)))}.telia-tab__wrapper--scroll_end{-webkit-mask-image:none;mask-image:none}.telia-tab__wrapper--scroll_end .telia-tab__list{-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)));mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)))}.telia-tab__wrapper--scroll_start{-webkit-mask-image:linear-gradient(to left, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)));mask-image:linear-gradient(to left, rgba(0, 0, 0, 0) 0, black calc(5.9rem * var(--voca-rem-multiplier)))}.telia-tab__list{display:inline-flex;max-width:100%;min-width:100%;overflow-y:visible;position:relative}@media (any-pointer: coarse){.telia-tab__list{overflow:hidden}}.telia-tab__list::before{content:\\\"small\\\";display:none}@media screen and (min-width: 37.5em){.telia-tab__list::before{content:\\\"medium\\\"}}@media screen and (min-width: 64em){.telia-tab__list::before{content:\\\"large\\\"}}.telia-tab__list__container{display:inline-flex;flex-grow:1;margin:0 0 0 calc(-1 * calc(0.2rem * var(--voca-rem-multiplier)));padding:0}@media (any-pointer: coarse){.telia-tab__list__container{overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;}}.telia-tab__content{background-color:#ffffff;padding:calc(1.6rem * var(--voca-rem-multiplier)) 0}.telia-tab__content--light-background{background-color:#ffffff}.telia-tab__content .telia-tab__container{padding:0 calc(1.6rem * var(--voca-rem-multiplier))}@media screen and (min-width: 37.5em){.telia-tab__content .telia-tab__container{padding:0 calc(2.4rem * var(--voca-rem-multiplier))}}@media screen and (min-width: 64em){.telia-tab__content .telia-tab__container{padding:0 calc(2.4rem * var(--voca-rem-multiplier))}}.telia-tab--default .telia-tab__container{box-sizing:border-box;display:block;margin-left:auto;margin-right:auto;max-width:calc(144rem * var(--voca-rem-multiplier));padding:0 calc(1.6rem * var(--voca-rem-multiplier));width:100%}@media screen and (min-width: 37.5em){.telia-tab--default .telia-tab__container{padding:0 calc(2.4rem * var(--voca-rem-multiplier))}}@media screen and (min-width: 64em){.telia-tab--default .telia-tab__container{padding:0 calc(4.8rem * var(--voca-rem-multiplier))}}@media screen and (min-width: 90em){.telia-tab--default .telia-tab__container{padding:0 calc(6.4rem * var(--voca-rem-multiplier))}}.telia-tab--default .telia-tab__wrapper--has-scroll{margin-left:calc(-1 * calc(1.6rem * var(--voca-rem-multiplier)));margin-right:calc(-1 * calc(1.6rem * var(--voca-rem-multiplier)));}@media screen and (min-width: 37.5em){.telia-tab--default .telia-tab__wrapper--has-scroll{margin-left:calc(-1 * calc(2.4rem * var(--voca-rem-multiplier)));margin-right:calc(-1 * calc(2.4rem * var(--voca-rem-multiplier)))}}@media screen and (min-width: 64em){.telia-tab--default .telia-tab__wrapper--has-scroll{margin-left:calc(-1 * calc(4.8rem * var(--voca-rem-multiplier)));margin-right:calc(-1 * calc(4.8rem * var(--voca-rem-multiplier)))}}.telia-tab--default .telia-tab__wrapper--has-scroll .telia-tab__header:first-child{margin-left:calc(1.6rem * var(--voca-rem-multiplier))}@media screen and (min-width: 37.5em){.telia-tab--default .telia-tab__wrapper--has-scroll .telia-tab__header:first-child{margin-left:calc(2.4rem * var(--voca-rem-multiplier))}}@media screen and (min-width: 64em){.telia-tab--default .telia-tab__wrapper--has-scroll .telia-tab__header:first-child{margin-left:calc(4.8rem * var(--voca-rem-multiplier))}}.telia-tab--light .telia-tab__list,.telia-tab--light-wide .telia-tab__list{position:static;width:100%}.telia-tab--light .telia-tab__list::after,.telia-tab--light-wide .telia-tab__list::after{background-color:#c8c8cd;bottom:calc(0.2rem * var(--voca-rem-multiplier));content:\\\"\\\";display:block;height:calc(0.2rem * var(--voca-rem-multiplier));left:0;position:absolute;right:0;width:100%}.telia-tab--light .telia-tab__header--active,.telia-tab--light-wide .telia-tab__header--active{background-color:transparent}.telia-tab--light .telia-tab__content,.telia-tab--light-wide .telia-tab__content{background-color:transparent}.telia-tab--wide .telia-tab__header,.telia-tab--light-wide .telia-tab__header{flex-basis:auto;flex-grow:1;min-width:fit-content;width:calc(17.7rem * var(--voca-rem-multiplier))}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}\";\n\nconst TeliaTab$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    this.__attachShadow();\n    this.vocaTabChange = createEvent(this, \"vocaTabChange\", 7);\n    /** State scroll used for toggeling horizontal scroll shadow */\n    this.scrollClasses = ' ';\n    /** Array of slotted children */\n    this.children = [];\n    /** sets background on content */\n    this.background = false;\n    /** variant */\n    this.variant = 'default';\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-tab';\n    this.activeIndex = 0;\n    this.wrapperClass = 'telia-tab__wrapper';\n    this.isKeyPress = true;\n    /**\n     * Because the component effectively reloads directly after\n     * first load, we need to scroll to the active tab in the componentDidUpdate\n     * hook. This can create an infinite loop unless prevented by this property\n     * that is set to true when/if user scrolls.\n     */\n    this.preventScrollLoop = false;\n    this.onIntersection = (entries) => {\n      let allTabItemsIsVisible = false;\n      let firstTabItemIsActiveInScope = false;\n      // If all entries are visible\n      if (entries.every(entry => entry.isIntersecting) &&\n        entries.length === this.tabItems.length) {\n        this.scrollClasses = ' ';\n        allTabItemsIsVisible = true;\n      }\n      entries.forEach(entry => {\n        // if entry is visible\n        if (entry.isIntersecting) {\n          let entryIndex = Number(entry.target.children[0].getAttribute('data-index'));\n          if (entryIndex === 0 &&\n            entry.target.classList.contains('telia-tab__header--active')) {\n            // 0 = first tabItem\n            firstTabItemIsActiveInScope = true;\n          }\n          if (entryIndex === 0 || entryIndex === 1) {\n            this.scrollClasses =\n              this.wrapperClass +\n                '--scroll_start' +\n                ' ' +\n                this.wrapperClass +\n                '--has-scroll';\n          }\n          else if (entryIndex === this.tabItems.length - 1) {\n            this.scrollClasses =\n              this.wrapperClass +\n                '--scroll_end' +\n                ' ' +\n                this.wrapperClass +\n                '--has-scroll';\n          }\n          else if (this.scrollClasses !=\n            this.wrapperClass +\n              '--is-scrolled' +\n              ' ' +\n              this.wrapperClass +\n              '--has-scroll') {\n            if (firstTabItemIsActiveInScope) {\n              this.calculateScroll();\n            }\n            else {\n              this.scrollClasses =\n                this.wrapperClass +\n                  '--is-scrolled' +\n                  ' ' +\n                  this.wrapperClass +\n                  '--has-scroll';\n            }\n          }\n        }\n      });\n      if (allTabItemsIsVisible) {\n        this.calculateScroll();\n      }\n    };\n  }\n  handleTabNavigation(e) {\n    const { location, key } = e.detail.value;\n    const currentIndex = this.activeIndex;\n    let nextIndex;\n    this.isKeyPress = true;\n    if (location > -1) {\n      nextIndex = location;\n      this.isKeyPress = false;\n    }\n    switch (key) {\n      case TabNavigationTypes.ArrowLeft:\n        if (currentIndex > 0) {\n          nextIndex = currentIndex - 1;\n        }\n        else {\n          nextIndex = this.children.length - 1;\n        }\n        break;\n      case TabNavigationTypes.ArrowRight:\n        if (currentIndex < this.children.length - 1) {\n          nextIndex = currentIndex + 1;\n        }\n        else {\n          nextIndex = 0;\n        }\n        break;\n      case TabNavigationTypes.Home:\n        nextIndex = 0;\n        break;\n      case TabNavigationTypes.End:\n        nextIndex = this.children.length - 1;\n        break;\n    }\n    this.activeIndex = nextIndex;\n    this.children.forEach((child, index) => {\n      child.active = index === nextIndex;\n    });\n    this.vocaTabChange.emit({ value: this.children[this.activeIndex].tabId });\n    this.createChildren();\n  }\n  handleResize() {\n    this.setBreakpointAndGridPadding();\n    this.calculateScroll();\n  }\n  componentWillLoad() {\n    this.createChildren();\n    this.findPreSelectedTab();\n  }\n  componentDidLoad() {\n    this.tabItems = this.host.shadowRoot.querySelectorAll('.telia-tab__header');\n    this.observer = new IntersectionObserver(this.onIntersection, {\n      threshold: [0.75],\n    });\n    this.tabItems.forEach(el => this.observer.observe(el));\n    this.setGridPadding();\n    this.setBreakpointAndGridPadding();\n    this.calculateScroll();\n  }\n  componentDidUpdate() {\n    if (!this.preventScrollLoop) {\n      this.scrollToTarget(this.getActiveTabListItem());\n    }\n  }\n  disconnectedCallback() {\n    // if we have an intersection observer, disconnect it\n    if (this.observer !== null) {\n      this.observer.disconnect();\n    }\n  }\n  /**\n   * Gets and sets current grid padding, used for calculation of scroll\n   * @private\n   */\n  setGridPadding() {\n    this.gridPadding = 2; // = telia-tab__list__container margin left -2, missing 2 px, Needs to be investigated why it is even needed since the last commit changes.\n  }\n  /**\n   * Get current breakpoint from style. It is important to\n   * call calculateScroll after this method is called,\n   * or it may not have desired effect.\n   * @private\n   */\n  setBreakpointAndGridPadding() {\n    if (this.tabList === undefined) {\n      return;\n    }\n    const currentBreakpoint = window\n      .getComputedStyle(this.tabList, ':before')\n      .getPropertyValue('content')\n      .replace(/\\\"/g, '');\n    if (currentBreakpoint != this.breakPoint) {\n      this.breakPoint = currentBreakpoint;\n      this.setGridPadding();\n    }\n  }\n  /**\n   * Check if there is a pre-selected tab,\n   * else set first tab as pre-selected\n   * @private\n   */\n  findPreSelectedTab() {\n    if (this.children.length === 0)\n      return;\n    /**\n     * flag to indicate that an active tab\n     * was found on render\n     */\n    let activePreSet = false;\n    this.children.forEach((child, index) => {\n      if (activePreSet) {\n        /**\n         * since flag is true\n         * all other tabs should\n         * be set to not active\n         */\n        child.active = false;\n      }\n      if (child.active) {\n        activePreSet = true;\n        this.activeIndex = index;\n      }\n    });\n    if (this.activeIndex === 0) {\n      this.children[this.activeIndex].active = true;\n    }\n  }\n  /**\n   * Will scroll tab list to keyboard focused tab header\n   * @param target\n   * @private\n   */\n  scrollToTarget(target) {\n    var _a;\n    /**\n     * scroll may not be available in\n     * test runner, so check existence\n     * before proceeding.\n     */\n    if (this.tabList.scroll == null) {\n      return;\n    }\n    const targetRect = target.getBoundingClientRect();\n    const wrapperRect = this.tabList.getBoundingClientRect();\n    const wrapperWidth = this.tabList.clientWidth;\n    const wrapperOffset = parseInt((_a = getComputedStyle(this.tabList)['border-width-left']) === null || _a === void 0 ? void 0 : _a.split('px')[0], 10);\n    let offset = wrapperRect.left + (isNaN(wrapperOffset) ? 0 : wrapperOffset);\n    let left;\n    //Handle forward navigation\n    if (targetRect.right > wrapperRect.right) {\n      left = targetRect.left + this.tabList.scrollLeft;\n      left = left + targetRect.width - wrapperWidth + wrapperWidth * 0.1;\n      left = left - offset;\n    }\n    //Handle backwards navigation\n    if (targetRect.left < wrapperRect.left) {\n      left = targetRect.left + this.tabList.scrollLeft;\n      left = left - wrapperWidth * 0.1;\n      left = left - offset;\n    }\n    if (left !== undefined) {\n      this.tabList.scroll({ left: left, behavior: 'smooth' });\n    }\n  }\n  /**\n   * Create child array\n   * @private\n   */\n  createChildren() {\n    this.children = [];\n    let slotted = this.host.querySelectorAll('telia-tab-content');\n    slotted.forEach(node => {\n      if (node.nodeName.indexOf('TELIA-TAB') > -1) {\n        this.children.push(node);\n      }\n    });\n  }\n  getActiveTabListItem() {\n    return this.tabList.querySelector('.telia-tab__header--active');\n  }\n  /**\n   * Checks if there is a scroll in tab list and sets relevant class\n   * @private\n   */\n  calculateScroll() {\n    this.scrollToTarget(this.getActiveTabListItem());\n    let headerContainer = this.host.shadowRoot.querySelector('.telia-tab__list__container');\n    let headerWrapper = this.host.shadowRoot.querySelector('.telia-tab__wrapper');\n    if (headerContainer.scrollWidth >\n      headerWrapper.offsetWidth + this.gridPadding) {\n      this.scrollClasses =\n        this.wrapperClass +\n          '--scroll_start ' +\n          this.wrapperClass +\n          '--has-scroll';\n    }\n    else if (headerContainer.scrollWidth ===\n      headerWrapper.offsetWidth + this.gridPadding) {\n      this.scrollClasses = ' ';\n    }\n  }\n  render() {\n    const tabClasses = {\n      'telia-tab': true,\n      [`telia-tab--${this.variant}`]: !!this.variant,\n    };\n    const contentClasses = {\n      'telia-tab__content': true,\n      'telia-tab__content--light-background': this.background,\n    };\n    return (h(\"div\", { class: tabClasses }, h(\"telia-vst\", { dataTrackingId: this.dataTrackingId }), h(\"div\", { class: \"telia-tab__container\" }, h(\"div\", { class: this.wrapperClass + ' ' + this.scrollClasses }, h(\"div\", { ref: el => (this.tabList = el), class: \"telia-tab__list\", role: \"tablist\" }, h(\"ul\", { class: \"telia-tab__list__container\", role: \"presentation\" }, this.children.map((child, index) => {\n      return (h(\"li\", { role: \"presentation\", class: {\n          'telia-tab__header': true,\n          'telia-tab__header--active': child.active,\n        }, onFocusin: e => {\n          this.scrollToTarget(e.target);\n        } }, h(\"telia-tab-header\", { tabId: child.tabId, icon: child.icon, name: child.name, active: child.active, \"data-testid\": child.dataTestid, \"data-index\": index, \"is-key-press\": this.isKeyPress, variant: this.variant }, child.name)));\n    }))))), h(\"div\", { class: contentClasses, role: \"presentation\" }, h(\"div\", { class: \"telia-tab__container\", role: \"presentation\" }, h(\"slot\", null)))));\n  }\n  get host() { return this; }\n  static get style() { return teliaTabCss; }\n}, [1, \"telia-tab\", {\n    \"background\": [4],\n    \"variant\": [1],\n    \"scrollClasses\": [32],\n    \"children\": [32]\n  }, [[0, \"vocaInternalTabNavigation\", \"handleTabNavigation\"], [9, \"resize\", \"handleResize\"]]]);\nfunction defineCustomElement$1() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-tab\", \"telia-icon\", \"telia-tab-header\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-tab\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaTab$1);\n      }\n      break;\n    case \"telia-icon\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$4();\n      }\n      break;\n    case \"telia-tab-header\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$3();\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$2();\n      }\n      break;\n  } });\n}\ndefineCustomElement$1();\n\nconst TeliaTab = TeliaTab$1;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TeliaTab, defineCustomElement };\n"],"names":["teliaTabCss","TeliaTab$1","proxyCustomElement","HTMLElement","createEvent","entries","allTabItemsIsVisible","firstTabItemIsActiveInScope","entry","entryIndex","e","location","key","currentIndex","nextIndex","TabNavigationTypes","child","index","el","currentBreakpoint","activePreSet","target","_a","targetRect","wrapperRect","wrapperWidth","wrapperOffset","offset","left","node","headerContainer","headerWrapper","tabClasses","contentClasses","h","defineCustomElement$1","tagName","defineCustomElement$4","defineCustomElement$3","defineCustomElement$2"],"mappings":"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"}

package/voca/components/telia-text-input.js

@@ -1,15 +1,15 @@
 import { p as c, H as d, c as m, h as i } from "../../chunks/index-f01c7229.js";
-import { u as s } from "../../chunks/uniqueId-1a9545dc.js";
-import { s as p } from "../../chunks/stringCombiner-1924ac75.js";
-import { d as h } from "../../chunks/telia-field-assistive-text2-8c051b1c.js";
-import { d as v } from "../../chunks/telia-field-error2-fdd35dae.js";
-import { d as g } from "../../chunks/telia-field-valid2-ee26b51a.js";
-import { d as f } from "../../chunks/telia-icon2-0db17e4e.js";
-import { d as _ } from "../../chunks/telia-label2-30f60678.js";
-import { d as x } from "../../chunks/telia-vst2-5b44b983.js";
-import "../../chunks/error-filled-1c04b799.js";
-import "../../chunks/check-circle-filled-8e1e6362.js";
-import "../../chunks/getSvgContent-f8f3b2b3.js";
+import { u as s } from "../../chunks/uniqueId-eb84c172.js";
+import { s as p } from "../../chunks/stringCombiner-e800a63c.js";
+import { d as h } from "../../chunks/telia-field-assistive-text2-015aa9ee.js";
+import { d as v } from "../../chunks/telia-field-error2-803797ff.js";
+import { d as g } from "../../chunks/telia-field-valid2-708bda98.js";
+import { d as f } from "../../chunks/telia-icon2-3b2c189b.js";
+import { d as _ } from "../../chunks/telia-label2-36554635.js";
+import { d as x } from "../../chunks/telia-vst2-db6a58b9.js";
+import "../../chunks/error-filled-e7de17f8.js";
+import "../../chunks/check-circle-filled-5d4848cd.js";
+import "../../chunks/getSvgContent-c9406894.js";
 const b = {
   text: "text",
   number: "number",

package/voca/components/telia-text-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"telia-text-input.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.1.8/node_modules/@teliads/components/dist/components/telia-text-input.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';\nimport { u as uniqueId } from './uniqueId.js';\nimport { s as stringCombiner } from './stringCombiner.js';\nimport { d as defineCustomElement$7 } from './telia-field-assistive-text2.js';\nimport { d as defineCustomElement$6 } from './telia-field-error2.js';\nimport { d as defineCustomElement$5 } from './telia-field-valid2.js';\nimport { d as defineCustomElement$4 } from './telia-icon2.js';\nimport { d as defineCustomElement$3 } from './telia-label2.js';\nimport { d as defineCustomElement$2 } from './telia-vst2.js';\n\n// Create a const where all members have a readonly value\n// and literal type by using const assertion.\nconst TextFieldTypes = {\n  text: 'text',\n  number: 'number',\n  email: 'email',\n  tel: 'tel',\n  search: 'search',\n  password: 'password',\n};\n\nconst teliaTextInputCss = \".telia-text-input{display:flex;flex-direction:column}.telia-text-input__input{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90;border-radius:calc(0.2rem * var(--voca-rem-multiplier));background-color:#ffffff;color:#222222;font-family:\\\"TeliaSans\\\", Helvetica, Arial, \\\"Lucida Grande\\\", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;-webkit-appearance:none;appearance:none;box-sizing:border-box;display:block;margin:0;padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier));width:100%;height:calc(4.6rem * var(--voca-rem-multiplier));margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:2}.telia-text-input__input:required{box-shadow:none}.telia-text-input__input[type=search]{-webkit-appearance:textfield;outline-offset:calc(-0.2rem * var(--voca-rem-multiplier))}.telia-text-input__input[type=search]::-webkit-search-decoration{-webkit-appearance:none}.telia-text-input__input[type=number]~.telia-text-input__valid-icon-container,.telia-text-input__input[type=search]~.telia-text-input__valid-icon-container{margin:calc(-1 * (4.6rem * var(--voca-rem-multiplier))) calc(1.2rem * var(--voca-rem-multiplier)) 0 calc(100% - (3.2rem * var(--voca-rem-multiplier)));width:0}.telia-text-input__input:hover{border:calc(0.2rem * var(--voca-rem-multiplier)) solid #29003e;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-text-input__input:hover:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-text-input__input:focus{outline:solid calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;outline-offset:calc(0.2rem * var(--voca-rem-multiplier));padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-input__input:focus:hover{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-text-input__input:read-only{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;background-color:#e8e8ed}.telia-text-input__input:read-only:hover{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-input__input:disabled{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;background-color:#dcdce1;color:#606064;cursor:not-allowed;-webkit-text-fill-color:#606064}.telia-text-input__input:disabled:hover{padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-input__input:disabled~telia-label .telia-label{color:#606064;cursor:not-allowed}.telia-text-input__input:disabled~.telia-text-input__additional{color:#b0b0b5}.telia-text-input__input:invalid{box-shadow:none}.telia-text-input__input--icon-shown{padding:calc(1rem * var(--voca-rem-multiplier)) calc(4.5rem * var(--voca-rem-multiplier)) calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-input__input--touched:invalid{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #be0040}.telia-text-input__input--touched:invalid:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-text-input__input--touched:invalid:hover:not(:focus){border:calc(0.2rem * var(--voca-rem-multiplier)) solid #be0040;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-text-input__valid-icon-container{align-items:center;display:flex;flex-direction:row;height:calc(4.6rem * var(--voca-rem-multiplier));justify-content:flex-end;margin:calc(calc(4.6rem * var(--voca-rem-multiplier)) * -1) calc(1.2rem * var(--voca-rem-multiplier)) 0 calc(100% - calc(1.2rem * var(--voca-rem-multiplier)));order:3}.telia-text-input__additional{order:4}.telia-text-input__error{margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:5}\";\n\nconst TeliaTextInput$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    this.valueChange = createEvent(this, \"valueChange\", 7);\n    /** Type of input as a string */\n    this.type = TextFieldTypes.text;\n    /** Value of input */\n    this.value = '';\n    /** Additional description id */\n    this.additionalId = uniqueId('additional');\n    /** Input element id */\n    this.inputId = uniqueId('input');\n    /** Error description id */\n    this.errorId = uniqueId('error');\n    /** Disabled state */\n    this.disabled = false;\n    /** Readonly state */\n    this.readonly = false;\n    /** Field needs to be filled, so it can be submitted  */\n    this.required = false;\n    /** Show valid icon when value passes all validations. Use sparingly. */\n    this.showValidIcon = false;\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-text-input';\n    /**\n     * Input has been blurred at least once.\n     */\n    this.touched = false;\n    /**\n     * Input has received data at least once.\n     */\n    this.dirty = false;\n    /**\n     * Real time value of input\n     */\n    this.inputValue = '';\n    /**\n     * Error message\n     */\n    this.errorMessageState = '';\n    this.updateInputValue = () => {\n      // eslint-disable-next-line @stencil/strict-boolean-conditions\n      this.inputValue = this.inputElement ? this.inputElement.value : this.value;\n    };\n    /**\n     * Check if input value state is valid with given pattern. This is\n     * imitating native input validation.\n     */\n    this.isValuePatternValid = () => {\n      if (this.pattern) {\n        const regexp = new RegExp('^(?:' + this.pattern + ')$');\n        return regexp.test(this.inputValue);\n      }\n      return true;\n    };\n    this.isValueLessThanMinlength = () => {\n      return (this.inputValue.length > 0 && this.inputValue.length < this.minlength);\n    };\n    /**\n     * Check if validation failed due to type mismatch.\n     * Type mismatch is set to true when email, url, ... field type built-in validation triggers\n     */\n    this.isValueTypeInvalid = () => {\n      var _a;\n      return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.validity.typeMismatch;\n    };\n    /**\n     * Update error message and keep native input error message in sync.\n     */\n    this.updateErrorMessage = message => {\n      var _a;\n      (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.setCustomValidity(message);\n      this.errorMessageState = message;\n    };\n    /**\n     * Check if input value is empty, so required should be triggered.\n     */\n    this.isValueMissing = () => {\n      return this.inputValue.length === 0;\n    };\n    this.updateErrorState = () => {\n      var _a, _b;\n      const errorMessageIsSet = !!((_a = this.errorMessageState) === null || _a === void 0 ? void 0 : _a.length);\n      const requiredInUse = this.required;\n      const patternInUse = !!this.pattern;\n      const minlengthInUse = this.minlength;\n      const generalErrorInUse = !!((_b = this.errorMessage) === null || _b === void 0 ? void 0 : _b.length);\n      const emailErrorInUse = !!this.emailErrorMessage && this.type === 'email';\n      if (generalErrorInUse) {\n        this.updateErrorMessage(this.errorMessage);\n        this.touched = true;\n        // General error message overrides other errors, so exit here.\n        return;\n      }\n      if (patternInUse && !this.isValueMissing()) {\n        if (this.touched &&\n          !!this.patternErrorMessage &&\n          !this.isValuePatternValid()) {\n          this.updateErrorMessage(this.patternErrorMessage);\n        }\n      }\n      if (minlengthInUse) {\n        if (this.touched &&\n          !!this.minlengthErrorMessage &&\n          this.isValueLessThanMinlength()) {\n          this.updateErrorMessage(this.minlengthErrorMessage);\n        }\n      }\n      if (requiredInUse) {\n        /**\n         * Follow HTML5 input ways of working,\n         * email field is validated only if type is email and required is set to true\n         */\n        if (emailErrorInUse && this.isValueTypeInvalid() && this.touched) {\n          this.updateErrorMessage(this.emailErrorMessage);\n        }\n        if (this.touched &&\n          !!this.requiredErrorMessage &&\n          this.isValueMissing()) {\n          this.updateErrorMessage(this.requiredErrorMessage);\n        }\n      }\n      // Clean error message if needed\n      if (errorMessageIsSet) {\n        if (patternInUse && !this.isValuePatternValid())\n          return;\n        if (minlengthInUse && this.isValueLessThanMinlength())\n          return;\n        if (requiredInUse && this.isValueMissing())\n          return;\n        if (emailErrorInUse && this.isValueTypeInvalid())\n          return;\n        this.updateErrorMessage('');\n      }\n    };\n  }\n  /**\n   * Sets focus on input\n   */\n  async focusInput() {\n    this.inputElement.focus();\n  }\n  componentWillLoad() {\n    this.updateInputValue();\n    this.updateErrorState();\n  }\n  componentWillUpdate() {\n    this.updateErrorState();\n  }\n  componentDidRender() {\n    // This check is for Stencil unit tests. Input element is mocked,\n    // but setCustomValidity method is not. It is undefined.\n    var _a, _b, _c;\n    // eslint-disable-next-line @stencil/strict-boolean-conditions\n    if (this.inputElement && ((_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.setCustomValidity)) {\n      (_b = this.inputElement) === null || _b === void 0 ? void 0 : _b.setCustomValidity(this.errorMessageState);\n    }\n    if (this.htmlForm) {\n      (_c = this.inputElement) === null || _c === void 0 ? void 0 : _c.setAttribute('form', this.htmlForm);\n    }\n  }\n  /**\n   * Watch if value attributes changes after initial load.\n   * Needed for prefilling functionality to work with input validations.\n   * @param value value attribute\n   */\n  componentValueChanged(value) {\n    this.inputValue = value;\n    this.updateErrorState();\n  }\n  /**\n   * This method is used to determine\n   * if a 'valid icon' can be shown to the user.\n   * Given the complexity of the validation logic\n   * in this component, using this method\n   * to determine 'validity' in a general sense\n   * should be carefully considered and tested.\n   */\n  isValid() {\n    return (!this.errorMessage &&\n      !this.isValueMissing() &&\n      !this.isValueLessThanMinlength() &&\n      !this.isValueTypeInvalid() &&\n      this.isValuePatternValid());\n  }\n  render() {\n    const showError = this.touched && !!this.errorMessageState.length;\n    const showAdditional = !!this.additional;\n    const describedBy = stringCombiner({\n      [this.additionalId]: showAdditional,\n      [this.errorId]: this.errorMessageState.length,\n    });\n    const showValidIcon = this.showValidIcon && this.dirty && this.isValid();\n    return (h(\"div\", { class: \"telia-text-input\" }, h(\"input\", { class: {\n        'telia-text-input__input': true,\n        'telia-text-input__input--touched': this.touched,\n        'telia-text-input__input--icon-shown': showValidIcon,\n      }, type: this.type, id: this.inputId, \"aria-describedby\": describedBy, minlength: this.minlength, maxlength: this.maxlength, disabled: this.disabled, readonly: this.readonly, value: this.value, name: this.name, onChange: event => {\n        /** valueChange is deprecated, will be removed in the future releases. */\n        this.valueChange.emit(event);\n      }, onInput: () => {\n        this.dirty = true;\n        this.updateInputValue();\n        this.updateErrorState();\n      }, inputmode: this.inputmode, list: this.list, autocomplete: this.autocomplete, required: this.required, onBlur: () => {\n        this.touched = true;\n        this.updateErrorState();\n      }, ref: ref => (this.inputElement = ref), pattern: this.pattern, onInvalid: event => {\n        event.preventDefault();\n        this.touched = true;\n        this.updateErrorState();\n      }, form: this.htmlForm }), showValidIcon && (h(\"div\", { class: \"telia-text-input__valid-icon-container\" }, h(\"telia-field-valid\", { class: \"telia-text-input__valid-icon\" }))), h(\"telia-label\", { class: \"telia-text-input__label\", htmlFor: this.inputId }, this.required && h(\"span\", { \"aria-hidden\": \"true\" }, '* '), this.label), showAdditional && (h(\"telia-field-assistive-text\", { class: \"telia-text-input__additional\", id: this.additionalId }, this.additional)), showError && (h(\"telia-field-error\", { id: this.errorId, class: \"telia-text-input__error\" }, this.errorMessageState)), h(\"telia-vst\", { dataTrackingId: this.dataTrackingId })));\n  }\n  static get watchers() { return {\n    \"value\": [\"componentValueChanged\"]\n  }; }\n  static get style() { return teliaTextInputCss; }\n}, [0, \"telia-text-input\", {\n    \"dataTestid\": [1, \"data-testid\"],\n    \"htmlForm\": [1, \"html-form\"],\n    \"type\": [1],\n    \"label\": [1],\n    \"value\": [1],\n    \"name\": [1],\n    \"additional\": [1],\n    \"additionalId\": [1, \"additional-id\"],\n    \"inputId\": [1, \"input-id\"],\n    \"errorId\": [1, \"error-id\"],\n    \"disabled\": [4],\n    \"minlength\": [2],\n    \"maxlength\": [2],\n    \"readonly\": [4],\n    \"inputmode\": [1],\n    \"list\": [1],\n    \"autocomplete\": [1],\n    \"required\": [4],\n    \"requiredErrorMessage\": [1, \"required-error-message\"],\n    \"emailErrorMessage\": [1, \"email-error-message\"],\n    \"minlengthErrorMessage\": [1, \"minlength-error-message\"],\n    \"showValidIcon\": [4, \"show-valid-icon\"],\n    \"pattern\": [1],\n    \"patternErrorMessage\": [1, \"pattern-error-message\"],\n    \"errorMessage\": [1, \"error-message\"],\n    \"touched\": [32],\n    \"dirty\": [32],\n    \"inputValue\": [32],\n    \"errorMessageState\": [32],\n    \"focusInput\": [64]\n  }]);\nfunction defineCustomElement$1() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-text-input\", \"telia-field-assistive-text\", \"telia-field-error\", \"telia-field-valid\", \"telia-icon\", \"telia-label\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-text-input\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaTextInput$1);\n      }\n      break;\n    case \"telia-field-assistive-text\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$7();\n      }\n      break;\n    case \"telia-field-error\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$6();\n      }\n      break;\n    case \"telia-field-valid\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$5();\n      }\n      break;\n    case \"telia-icon\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$4();\n      }\n      break;\n    case \"telia-label\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$3();\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$2();\n      }\n      break;\n  } });\n}\ndefineCustomElement$1();\n\nconst TeliaTextInput = TeliaTextInput$1;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TeliaTextInput, defineCustomElement };\n"],"names":["TextFieldTypes","teliaTextInputCss","TeliaTextInput$1","proxyCustomElement","HTMLElement","createEvent","uniqueId","_a","message","_b","errorMessageIsSet","requiredInUse","patternInUse","minlengthInUse","generalErrorInUse","emailErrorInUse","_c","value","showError","showAdditional","describedBy","stringCombiner","showValidIcon","h","event","ref","defineCustomElement$1","tagName","defineCustomElement$7","defineCustomElement$6","defineCustomElement$5","defineCustomElement$4","defineCustomElement$3","defineCustomElement$2"],"mappings":"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"}
+{"version":3,"file":"telia-text-input.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.2.0/node_modules/@teliads/components/dist/components/telia-text-input.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';\nimport { u as uniqueId } from './uniqueId.js';\nimport { s as stringCombiner } from './stringCombiner.js';\nimport { d as defineCustomElement$7 } from './telia-field-assistive-text2.js';\nimport { d as defineCustomElement$6 } from './telia-field-error2.js';\nimport { d as defineCustomElement$5 } from './telia-field-valid2.js';\nimport { d as defineCustomElement$4 } from './telia-icon2.js';\nimport { d as defineCustomElement$3 } from './telia-label2.js';\nimport { d as defineCustomElement$2 } from './telia-vst2.js';\n\n// Create a const where all members have a readonly value\n// and literal type by using const assertion.\nconst TextFieldTypes = {\n  text: 'text',\n  number: 'number',\n  email: 'email',\n  tel: 'tel',\n  search: 'search',\n  password: 'password',\n};\n\nconst teliaTextInputCss = \".telia-text-input{display:flex;flex-direction:column}.telia-text-input__input{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90;border-radius:calc(0.2rem * var(--voca-rem-multiplier));background-color:#ffffff;color:#222222;font-family:\\\"TeliaSans\\\", Helvetica, Arial, \\\"Lucida Grande\\\", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;-webkit-appearance:none;appearance:none;box-sizing:border-box;display:block;margin:0;padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier));width:100%;height:calc(4.6rem * var(--voca-rem-multiplier));margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:2}.telia-text-input__input:required{box-shadow:none}.telia-text-input__input[type=search]{-webkit-appearance:textfield;outline-offset:calc(-0.2rem * var(--voca-rem-multiplier))}.telia-text-input__input[type=search]::-webkit-search-decoration{-webkit-appearance:none}.telia-text-input__input[type=number]~.telia-text-input__valid-icon-container,.telia-text-input__input[type=search]~.telia-text-input__valid-icon-container{margin:calc(-1 * (4.6rem * var(--voca-rem-multiplier))) calc(1.2rem * var(--voca-rem-multiplier)) 0 calc(100% - (3.2rem * var(--voca-rem-multiplier)));width:0}.telia-text-input__input:hover{border:calc(0.2rem * var(--voca-rem-multiplier)) solid #29003e;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-text-input__input:hover:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-text-input__input:focus{outline:solid calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;outline-offset:calc(0.2rem * var(--voca-rem-multiplier));padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-input__input:focus:hover{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-text-input__input:read-only{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;background-color:#e8e8ed}.telia-text-input__input:read-only:hover{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-input__input:disabled{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;background-color:#dcdce1;color:#606064;cursor:not-allowed;-webkit-text-fill-color:#606064}.telia-text-input__input:disabled:hover{padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-input__input:disabled~telia-label .telia-label{color:#606064;cursor:not-allowed}.telia-text-input__input:disabled~.telia-text-input__additional{color:#b0b0b5}.telia-text-input__input:invalid{box-shadow:none}.telia-text-input__input--icon-shown{padding:calc(1rem * var(--voca-rem-multiplier)) calc(4.5rem * var(--voca-rem-multiplier)) calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-input__input--touched:invalid{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #be0040}.telia-text-input__input--touched:invalid:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-text-input__input--touched:invalid:hover:not(:focus){border:calc(0.2rem * var(--voca-rem-multiplier)) solid #be0040;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-text-input__valid-icon-container{align-items:center;display:flex;flex-direction:row;height:calc(4.6rem * var(--voca-rem-multiplier));justify-content:flex-end;margin:calc(calc(4.6rem * var(--voca-rem-multiplier)) * -1) calc(1.2rem * var(--voca-rem-multiplier)) 0 calc(100% - calc(1.2rem * var(--voca-rem-multiplier)));order:3}.telia-text-input__additional{order:4}.telia-text-input__error{margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:5}\";\n\nconst TeliaTextInput$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    this.valueChange = createEvent(this, \"valueChange\", 7);\n    /** Type of input as a string */\n    this.type = TextFieldTypes.text;\n    /** Value of input */\n    this.value = '';\n    /** Additional description id */\n    this.additionalId = uniqueId('additional');\n    /** Input element id */\n    this.inputId = uniqueId('input');\n    /** Error description id */\n    this.errorId = uniqueId('error');\n    /** Disabled state */\n    this.disabled = false;\n    /** Readonly state */\n    this.readonly = false;\n    /** Field needs to be filled, so it can be submitted  */\n    this.required = false;\n    /** Show valid icon when value passes all validations. Use sparingly. */\n    this.showValidIcon = false;\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-text-input';\n    /**\n     * Input has been blurred at least once.\n     */\n    this.touched = false;\n    /**\n     * Input has received data at least once.\n     */\n    this.dirty = false;\n    /**\n     * Real time value of input\n     */\n    this.inputValue = '';\n    /**\n     * Error message\n     */\n    this.errorMessageState = '';\n    this.updateInputValue = () => {\n      // eslint-disable-next-line @stencil/strict-boolean-conditions\n      this.inputValue = this.inputElement ? this.inputElement.value : this.value;\n    };\n    /**\n     * Check if input value state is valid with given pattern. This is\n     * imitating native input validation.\n     */\n    this.isValuePatternValid = () => {\n      if (this.pattern) {\n        const regexp = new RegExp('^(?:' + this.pattern + ')$');\n        return regexp.test(this.inputValue);\n      }\n      return true;\n    };\n    this.isValueLessThanMinlength = () => {\n      return (this.inputValue.length > 0 && this.inputValue.length < this.minlength);\n    };\n    /**\n     * Check if validation failed due to type mismatch.\n     * Type mismatch is set to true when email, url, ... field type built-in validation triggers\n     */\n    this.isValueTypeInvalid = () => {\n      var _a;\n      return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.validity.typeMismatch;\n    };\n    /**\n     * Update error message and keep native input error message in sync.\n     */\n    this.updateErrorMessage = message => {\n      var _a;\n      (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.setCustomValidity(message);\n      this.errorMessageState = message;\n    };\n    /**\n     * Check if input value is empty, so required should be triggered.\n     */\n    this.isValueMissing = () => {\n      return this.inputValue.length === 0;\n    };\n    this.updateErrorState = () => {\n      var _a, _b;\n      const errorMessageIsSet = !!((_a = this.errorMessageState) === null || _a === void 0 ? void 0 : _a.length);\n      const requiredInUse = this.required;\n      const patternInUse = !!this.pattern;\n      const minlengthInUse = this.minlength;\n      const generalErrorInUse = !!((_b = this.errorMessage) === null || _b === void 0 ? void 0 : _b.length);\n      const emailErrorInUse = !!this.emailErrorMessage && this.type === 'email';\n      if (generalErrorInUse) {\n        this.updateErrorMessage(this.errorMessage);\n        this.touched = true;\n        // General error message overrides other errors, so exit here.\n        return;\n      }\n      if (patternInUse && !this.isValueMissing()) {\n        if (this.touched &&\n          !!this.patternErrorMessage &&\n          !this.isValuePatternValid()) {\n          this.updateErrorMessage(this.patternErrorMessage);\n        }\n      }\n      if (minlengthInUse) {\n        if (this.touched &&\n          !!this.minlengthErrorMessage &&\n          this.isValueLessThanMinlength()) {\n          this.updateErrorMessage(this.minlengthErrorMessage);\n        }\n      }\n      if (requiredInUse) {\n        /**\n         * Follow HTML5 input ways of working,\n         * email field is validated only if type is email and required is set to true\n         */\n        if (emailErrorInUse && this.isValueTypeInvalid() && this.touched) {\n          this.updateErrorMessage(this.emailErrorMessage);\n        }\n        if (this.touched &&\n          !!this.requiredErrorMessage &&\n          this.isValueMissing()) {\n          this.updateErrorMessage(this.requiredErrorMessage);\n        }\n      }\n      // Clean error message if needed\n      if (errorMessageIsSet) {\n        if (patternInUse && !this.isValuePatternValid())\n          return;\n        if (minlengthInUse && this.isValueLessThanMinlength())\n          return;\n        if (requiredInUse && this.isValueMissing())\n          return;\n        if (emailErrorInUse && this.isValueTypeInvalid())\n          return;\n        this.updateErrorMessage('');\n      }\n    };\n  }\n  /**\n   * Sets focus on input\n   */\n  async focusInput() {\n    this.inputElement.focus();\n  }\n  componentWillLoad() {\n    this.updateInputValue();\n    this.updateErrorState();\n  }\n  componentWillUpdate() {\n    this.updateErrorState();\n  }\n  componentDidRender() {\n    // This check is for Stencil unit tests. Input element is mocked,\n    // but setCustomValidity method is not. It is undefined.\n    var _a, _b, _c;\n    // eslint-disable-next-line @stencil/strict-boolean-conditions\n    if (this.inputElement && ((_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.setCustomValidity)) {\n      (_b = this.inputElement) === null || _b === void 0 ? void 0 : _b.setCustomValidity(this.errorMessageState);\n    }\n    if (this.htmlForm) {\n      (_c = this.inputElement) === null || _c === void 0 ? void 0 : _c.setAttribute('form', this.htmlForm);\n    }\n  }\n  /**\n   * Watch if value attributes changes after initial load.\n   * Needed for prefilling functionality to work with input validations.\n   * @param value value attribute\n   */\n  componentValueChanged(value) {\n    this.inputValue = value;\n    this.updateErrorState();\n  }\n  /**\n   * This method is used to determine\n   * if a 'valid icon' can be shown to the user.\n   * Given the complexity of the validation logic\n   * in this component, using this method\n   * to determine 'validity' in a general sense\n   * should be carefully considered and tested.\n   */\n  isValid() {\n    return (!this.errorMessage &&\n      !this.isValueMissing() &&\n      !this.isValueLessThanMinlength() &&\n      !this.isValueTypeInvalid() &&\n      this.isValuePatternValid());\n  }\n  render() {\n    const showError = this.touched && !!this.errorMessageState.length;\n    const showAdditional = !!this.additional;\n    const describedBy = stringCombiner({\n      [this.additionalId]: showAdditional,\n      [this.errorId]: this.errorMessageState.length,\n    });\n    const showValidIcon = this.showValidIcon && this.dirty && this.isValid();\n    return (h(\"div\", { class: \"telia-text-input\" }, h(\"input\", { class: {\n        'telia-text-input__input': true,\n        'telia-text-input__input--touched': this.touched,\n        'telia-text-input__input--icon-shown': showValidIcon,\n      }, type: this.type, id: this.inputId, \"aria-describedby\": describedBy, minlength: this.minlength, maxlength: this.maxlength, disabled: this.disabled, readonly: this.readonly, value: this.value, name: this.name, onChange: event => {\n        /** valueChange is deprecated, will be removed in the future releases. */\n        this.valueChange.emit(event);\n      }, onInput: () => {\n        this.dirty = true;\n        this.updateInputValue();\n        this.updateErrorState();\n      }, inputmode: this.inputmode, list: this.list, autocomplete: this.autocomplete, required: this.required, onBlur: () => {\n        this.touched = true;\n        this.updateErrorState();\n      }, ref: ref => (this.inputElement = ref), pattern: this.pattern, onInvalid: event => {\n        event.preventDefault();\n        this.touched = true;\n        this.updateErrorState();\n      }, form: this.htmlForm }), showValidIcon && (h(\"div\", { class: \"telia-text-input__valid-icon-container\" }, h(\"telia-field-valid\", { class: \"telia-text-input__valid-icon\" }))), h(\"telia-label\", { class: \"telia-text-input__label\", htmlFor: this.inputId }, this.required && h(\"span\", { \"aria-hidden\": \"true\" }, '* '), this.label), showAdditional && (h(\"telia-field-assistive-text\", { class: \"telia-text-input__additional\", id: this.additionalId }, this.additional)), showError && (h(\"telia-field-error\", { id: this.errorId, class: \"telia-text-input__error\" }, this.errorMessageState)), h(\"telia-vst\", { dataTrackingId: this.dataTrackingId })));\n  }\n  static get watchers() { return {\n    \"value\": [\"componentValueChanged\"]\n  }; }\n  static get style() { return teliaTextInputCss; }\n}, [0, \"telia-text-input\", {\n    \"dataTestid\": [1, \"data-testid\"],\n    \"htmlForm\": [1, \"html-form\"],\n    \"type\": [1],\n    \"label\": [1],\n    \"value\": [1],\n    \"name\": [1],\n    \"additional\": [1],\n    \"additionalId\": [1, \"additional-id\"],\n    \"inputId\": [1, \"input-id\"],\n    \"errorId\": [1, \"error-id\"],\n    \"disabled\": [4],\n    \"minlength\": [2],\n    \"maxlength\": [2],\n    \"readonly\": [4],\n    \"inputmode\": [1],\n    \"list\": [1],\n    \"autocomplete\": [1],\n    \"required\": [4],\n    \"requiredErrorMessage\": [1, \"required-error-message\"],\n    \"emailErrorMessage\": [1, \"email-error-message\"],\n    \"minlengthErrorMessage\": [1, \"minlength-error-message\"],\n    \"showValidIcon\": [4, \"show-valid-icon\"],\n    \"pattern\": [1],\n    \"patternErrorMessage\": [1, \"pattern-error-message\"],\n    \"errorMessage\": [1, \"error-message\"],\n    \"touched\": [32],\n    \"dirty\": [32],\n    \"inputValue\": [32],\n    \"errorMessageState\": [32],\n    \"focusInput\": [64]\n  }]);\nfunction defineCustomElement$1() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-text-input\", \"telia-field-assistive-text\", \"telia-field-error\", \"telia-field-valid\", \"telia-icon\", \"telia-label\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-text-input\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaTextInput$1);\n      }\n      break;\n    case \"telia-field-assistive-text\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$7();\n      }\n      break;\n    case \"telia-field-error\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$6();\n      }\n      break;\n    case \"telia-field-valid\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$5();\n      }\n      break;\n    case \"telia-icon\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$4();\n      }\n      break;\n    case \"telia-label\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$3();\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$2();\n      }\n      break;\n  } });\n}\ndefineCustomElement$1();\n\nconst TeliaTextInput = TeliaTextInput$1;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TeliaTextInput, defineCustomElement };\n"],"names":["TextFieldTypes","teliaTextInputCss","TeliaTextInput$1","proxyCustomElement","HTMLElement","createEvent","uniqueId","_a","message","_b","errorMessageIsSet","requiredInUse","patternInUse","minlengthInUse","generalErrorInUse","emailErrorInUse","_c","value","showError","showAdditional","describedBy","stringCombiner","showValidIcon","h","event","ref","defineCustomElement$1","tagName","defineCustomElement$7","defineCustomElement$6","defineCustomElement$5","defineCustomElement$4","defineCustomElement$3","defineCustomElement$2"],"mappings":"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"}

package/voca/components/telia-text-spacing.js

@@ -1,5 +1,5 @@
 import { p as a, H as i, h as e, a as l } from "../../chunks/index-f01c7229.js";
-import { d as n } from "../../chunks/telia-vst2-5b44b983.js";
+import { d as n } from "../../chunks/telia-vst2-db6a58b9.js";
 const r = ".telia-text-spacing .telia-p--subsection,.telia-text-spacing .telia-heading--subsection-100{margin-bottom:calc(0.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--overline-100,.telia-text-spacing .telia-p--additional-100,.telia-text-spacing .telia-heading--title-100,.telia-text-spacing .telia-heading--title-200,.telia-text-spacing .telia-heading--title-300{margin-bottom:calc(0.8rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--overline-200{margin-bottom:calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price,.telia-text-spacing .telia-p--paragraph-100,.telia-text-spacing .telia-p--paragraph-200{margin-bottom:calc(1.6rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-100,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-100,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-100{margin-top:calc(2.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-200,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-200,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-200{margin-top:calc(3.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-300,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-300,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-300{margin-top:calc(4.8rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-heading--title-400,.telia-text-spacing .telia-heading--title-500{margin-bottom:calc(2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-heading--title-600,.telia-text-spacing .telia-heading--title-700,.telia-text-spacing .telia-heading--display-100,.telia-text-spacing .telia-heading--display-200{margin-bottom:calc(2.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--preamble-100{margin-bottom:calc(3.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--preamble-200{margin-bottom:calc(4.8rem * var(--voca-rem-multiplier))}.telia-text-spacing *>:last-child,.telia-text-spacing>:last-child{margin-bottom:0}", c = /* @__PURE__ */ a(class extends i {
   constructor() {
     super(), this.__registerHost(), this.dataTrackingId = "telia-text-spacing";

package/voca/components/telia-text-spacing.js.map

@@ -1 +1 @@
-{"version":3,"file":"telia-text-spacing.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.1.8/node_modules/@teliads/components/dist/components/telia-text-spacing2.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';\nimport { d as defineCustomElement$1 } from './telia-vst2.js';\n\nconst teliaTextSpacingCss = \".telia-text-spacing .telia-p--subsection,.telia-text-spacing .telia-heading--subsection-100{margin-bottom:calc(0.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--overline-100,.telia-text-spacing .telia-p--additional-100,.telia-text-spacing .telia-heading--title-100,.telia-text-spacing .telia-heading--title-200,.telia-text-spacing .telia-heading--title-300{margin-bottom:calc(0.8rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--overline-200{margin-bottom:calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price,.telia-text-spacing .telia-p--paragraph-100,.telia-text-spacing .telia-p--paragraph-200{margin-bottom:calc(1.6rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-100,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-100,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-100{margin-top:calc(2.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-200,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-200,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-200{margin-top:calc(3.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-300,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-300,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-300{margin-top:calc(4.8rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-heading--title-400,.telia-text-spacing .telia-heading--title-500{margin-bottom:calc(2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-heading--title-600,.telia-text-spacing .telia-heading--title-700,.telia-text-spacing .telia-heading--display-100,.telia-text-spacing .telia-heading--display-200{margin-bottom:calc(2.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--preamble-100{margin-bottom:calc(3.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--preamble-200{margin-bottom:calc(4.8rem * var(--voca-rem-multiplier))}.telia-text-spacing *>:last-child,.telia-text-spacing>:last-child{margin-bottom:0}\";\n\nconst TeliaTextSpacing = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-text-spacing';\n  }\n  render() {\n    return (h(Host, { class: \"telia-text-spacing\" }, h(\"telia-vst\", { dataTrackingId: this.dataTrackingId }), h(\"slot\", null)));\n  }\n  static get style() { return teliaTextSpacingCss; }\n}, [4, \"telia-text-spacing\"]);\nfunction defineCustomElement() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-text-spacing\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-text-spacing\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaTextSpacing);\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$1();\n      }\n      break;\n  } });\n}\ndefineCustomElement();\n\nexport { TeliaTextSpacing as T, defineCustomElement as d };\n"],"names":["teliaTextSpacingCss","TeliaTextSpacing","proxyCustomElement","HTMLElement","h","Host","defineCustomElement","tagName","defineCustomElement$1"],"mappings":";;AAGA,MAAMA,IAAsB,wlEAEtBC,IAAiC,gBAAAC,EAAmB,cAAcC,EAAY;AAAA,EAClF,cAAc;AACZ,aACA,KAAK,eAAc,GAEnB,KAAK,iBAAiB;AAAA,EACvB;AAAA,EACD,SAAS;AACP,WAAQC,EAAEC,GAAM,EAAE,OAAO,qBAAoB,GAAID,EAAE,aAAa,EAAE,gBAAgB,KAAK,gBAAgB,GAAGA,EAAE,QAAQ,IAAI,CAAC;AAAA,EAC1H;AAAA,EACD,WAAW,QAAQ;AAAE,WAAOJ;AAAA,EAAsB;AACpD,GAAG,CAAC,GAAG,oBAAoB,CAAC;AAC5B,SAASM,IAAsB;AAC7B,MAAI,OAAO,iBAAmB;AAC5B;AAGF,EADmB,CAAC,sBAAsB,WAAW,EAC1C,QAAQ,CAAAC,MAAW;AAAE,YAAQA,GAAO;AAAA,MAC7C,KAAK;AACH,QAAK,eAAe,IAAIA,CAAO,KAC7B,eAAe,OAAOA,GAASN,CAAgB;AAEjD;AAAA,MACF,KAAK;AACH,QAAK,eAAe,IAAIM,CAAO,KAC7BC;AAEF;AAAA,IACH;AAAA,EAAA,CAAE;AACL;AACAF,EAAqB;"}
+{"version":3,"file":"telia-text-spacing.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.2.0/node_modules/@teliads/components/dist/components/telia-text-spacing2.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';\nimport { d as defineCustomElement$1 } from './telia-vst2.js';\n\nconst teliaTextSpacingCss = \".telia-text-spacing .telia-p--subsection,.telia-text-spacing .telia-heading--subsection-100{margin-bottom:calc(0.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--overline-100,.telia-text-spacing .telia-p--additional-100,.telia-text-spacing .telia-heading--title-100,.telia-text-spacing .telia-heading--title-200,.telia-text-spacing .telia-heading--title-300{margin-bottom:calc(0.8rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--overline-200{margin-bottom:calc(1.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price,.telia-text-spacing .telia-p--paragraph-100,.telia-text-spacing .telia-p--paragraph-200{margin-bottom:calc(1.6rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-100,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-100,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-100{margin-top:calc(2.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-200,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-200,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-200{margin-top:calc(3.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-price+.telia-heading--title-300,.telia-text-spacing .telia-p--paragraph-100+.telia-heading--title-300,.telia-text-spacing .telia-p--paragraph-200+.telia-heading--title-300{margin-top:calc(4.8rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-heading--title-400,.telia-text-spacing .telia-heading--title-500{margin-bottom:calc(2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-heading--title-600,.telia-text-spacing .telia-heading--title-700,.telia-text-spacing .telia-heading--display-100,.telia-text-spacing .telia-heading--display-200{margin-bottom:calc(2.4rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--preamble-100{margin-bottom:calc(3.2rem * var(--voca-rem-multiplier))}.telia-text-spacing .telia-p--preamble-200{margin-bottom:calc(4.8rem * var(--voca-rem-multiplier))}.telia-text-spacing *>:last-child,.telia-text-spacing>:last-child{margin-bottom:0}\";\n\nconst TeliaTextSpacing = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-text-spacing';\n  }\n  render() {\n    return (h(Host, { class: \"telia-text-spacing\" }, h(\"telia-vst\", { dataTrackingId: this.dataTrackingId }), h(\"slot\", null)));\n  }\n  static get style() { return teliaTextSpacingCss; }\n}, [4, \"telia-text-spacing\"]);\nfunction defineCustomElement() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-text-spacing\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-text-spacing\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaTextSpacing);\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$1();\n      }\n      break;\n  } });\n}\ndefineCustomElement();\n\nexport { TeliaTextSpacing as T, defineCustomElement as d };\n"],"names":["teliaTextSpacingCss","TeliaTextSpacing","proxyCustomElement","HTMLElement","h","Host","defineCustomElement","tagName","defineCustomElement$1"],"mappings":";;AAGA,MAAMA,IAAsB,wlEAEtBC,IAAiC,gBAAAC,EAAmB,cAAcC,EAAY;AAAA,EAClF,cAAc;AACZ,aACA,KAAK,eAAc,GAEnB,KAAK,iBAAiB;AAAA,EACvB;AAAA,EACD,SAAS;AACP,WAAQC,EAAEC,GAAM,EAAE,OAAO,qBAAoB,GAAID,EAAE,aAAa,EAAE,gBAAgB,KAAK,gBAAgB,GAAGA,EAAE,QAAQ,IAAI,CAAC;AAAA,EAC1H;AAAA,EACD,WAAW,QAAQ;AAAE,WAAOJ;AAAA,EAAsB;AACpD,GAAG,CAAC,GAAG,oBAAoB,CAAC;AAC5B,SAASM,IAAsB;AAC7B,MAAI,OAAO,iBAAmB;AAC5B;AAGF,EADmB,CAAC,sBAAsB,WAAW,EAC1C,QAAQ,CAAAC,MAAW;AAAE,YAAQA,GAAO;AAAA,MAC7C,KAAK;AACH,QAAK,eAAe,IAAIA,CAAO,KAC7B,eAAe,OAAOA,GAASN,CAAgB;AAEjD;AAAA,MACF,KAAK;AACH,QAAK,eAAe,IAAIM,CAAO,KAC7BC;AAEF;AAAA,IACH;AAAA,EAAA,CAAE;AACL;AACAF,EAAqB;"}

package/voca/components/telia-textarea.js

@@ -1,13 +1,13 @@
 import { p as c, H as m, h as a } from "../../chunks/index-f01c7229.js";
-import { u as l } from "../../chunks/uniqueId-1a9545dc.js";
-import { s as u } from "../../chunks/stringCombiner-1924ac75.js";
-import { d as h } from "../../chunks/telia-field-assistive-text2-8c051b1c.js";
-import { d as v } from "../../chunks/telia-field-error2-fdd35dae.js";
-import { d as p } from "../../chunks/telia-icon2-0db17e4e.js";
-import { d as f } from "../../chunks/telia-label2-30f60678.js";
-import { d as g } from "../../chunks/telia-vst2-5b44b983.js";
-import "../../chunks/error-filled-1c04b799.js";
-import "../../chunks/getSvgContent-f8f3b2b3.js";
+import { u as l } from "../../chunks/uniqueId-eb84c172.js";
+import { s as u } from "../../chunks/stringCombiner-e800a63c.js";
+import { d as h } from "../../chunks/telia-field-assistive-text2-015aa9ee.js";
+import { d as v } from "../../chunks/telia-field-error2-803797ff.js";
+import { d as p } from "../../chunks/telia-icon2-3b2c189b.js";
+import { d as f } from "../../chunks/telia-label2-36554635.js";
+import { d as g } from "../../chunks/telia-vst2-db6a58b9.js";
+import "../../chunks/error-filled-e7de17f8.js";
+import "../../chunks/getSvgContent-c9406894.js";
 const x = '.telia-textarea{display:flex;flex-direction:column}.telia-textarea__textarea{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90;border-radius:calc(0.2rem * var(--voca-rem-multiplier));background-color:#ffffff;color:#222222;font-family:"TeliaSans", Helvetica, Arial, "Lucida Grande", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;-webkit-appearance:none;appearance:none;box-sizing:border-box;display:block;margin:0;padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier));width:100%;margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:2}.telia-textarea__textarea:hover{border:calc(0.2rem * var(--voca-rem-multiplier)) solid #29003e;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-textarea__textarea:hover:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea:focus{outline:solid calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;outline-offset:calc(0.2rem * var(--voca-rem-multiplier));padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-textarea__textarea:focus:hover{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea:disabled{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;background-color:#dcdce1;color:#606064;cursor:not-allowed;-webkit-text-fill-color:#606064}.telia-textarea__textarea:disabled:hover{padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-textarea__textarea:disabled~telia-label .telia-label{color:#606064;cursor:not-allowed}.telia-textarea__textarea:disabled~.telia-textarea__additional{color:#b0b0b5}.telia-textarea__textarea:invalid{box-shadow:none}.telia-textarea__textarea--touched:invalid{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #be0040}.telia-textarea__textarea--touched:invalid:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea--touched:invalid:hover:not(:focus){border:calc(0.2rem * var(--voca-rem-multiplier)) solid #be0040;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-textarea__additional{order:4}.telia-textarea__error{margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:5}', b = /* @__PURE__ */ c(class extends m {
   constructor() {
     super(), this.__registerHost(), this.additionalId = l("additional"), this.disabled = !1, this.errorId = l("error"), this.inputId = l("textareaId"), this.required = !1, this.rows = 4, this.spellcheck = !1, this.dataTrackingId = "telia-textarea", this.inputValue = "", this.errorMessageState = "", this.updateInputValue = () => {

package/voca/components/telia-textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"telia-textarea.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.1.8/node_modules/@teliads/components/dist/components/telia-textarea.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';\nimport { u as uniqueId } from './uniqueId.js';\nimport { s as stringCombiner } from './stringCombiner.js';\nimport { d as defineCustomElement$6 } from './telia-field-assistive-text2.js';\nimport { d as defineCustomElement$5 } from './telia-field-error2.js';\nimport { d as defineCustomElement$4 } from './telia-icon2.js';\nimport { d as defineCustomElement$3 } from './telia-label2.js';\nimport { d as defineCustomElement$2 } from './telia-vst2.js';\n\nconst teliaTextareaCss = \".telia-textarea{display:flex;flex-direction:column}.telia-textarea__textarea{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90;border-radius:calc(0.2rem * var(--voca-rem-multiplier));background-color:#ffffff;color:#222222;font-family:\\\"TeliaSans\\\", Helvetica, Arial, \\\"Lucida Grande\\\", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;-webkit-appearance:none;appearance:none;box-sizing:border-box;display:block;margin:0;padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier));width:100%;margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:2}.telia-textarea__textarea:hover{border:calc(0.2rem * var(--voca-rem-multiplier)) solid #29003e;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-textarea__textarea:hover:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea:focus{outline:solid calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;outline-offset:calc(0.2rem * var(--voca-rem-multiplier));padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-textarea__textarea:focus:hover{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea:disabled{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;background-color:#dcdce1;color:#606064;cursor:not-allowed;-webkit-text-fill-color:#606064}.telia-textarea__textarea:disabled:hover{padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-textarea__textarea:disabled~telia-label .telia-label{color:#606064;cursor:not-allowed}.telia-textarea__textarea:disabled~.telia-textarea__additional{color:#b0b0b5}.telia-textarea__textarea:invalid{box-shadow:none}.telia-textarea__textarea--touched:invalid{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #be0040}.telia-textarea__textarea--touched:invalid:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea--touched:invalid:hover:not(:focus){border:calc(0.2rem * var(--voca-rem-multiplier)) solid #be0040;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-textarea__additional{order:4}.telia-textarea__error{margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:5}\";\n\nconst TeliaTextArea = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    /** Additional description id */\n    this.additionalId = uniqueId('additional');\n    /** Disabled state */\n    this.disabled = false;\n    /** Error description id */\n    this.errorId = uniqueId('error');\n    /** Textarea input element id */\n    this.inputId = uniqueId('textareaId');\n    /** Required state */\n    this.required = false;\n    /** Textarea rows */\n    this.rows = 4;\n    /** Checks if textarea will be checked for spelling errors */\n    this.spellcheck = false;\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-textarea';\n    /**\n     * Real time value of input\n     */\n    this.inputValue = '';\n    /**\n     * Error message\n     */\n    this.errorMessageState = '';\n    this.updateInputValue = () => {\n      // eslint-disable-next-line @stencil/strict-boolean-conditions\n      this.inputValue = this.textAreaElement\n        ? this.textAreaElement.value\n        : this.value;\n    };\n    /**\n     * Check if input value is empty, so required should be triggered.\n     */\n    this.isValueMissing = () => {\n      return this.inputValue.length === 0;\n    };\n    /**\n     * Check if input value is empty, so required should be triggered.\n     */\n    this.isValueLessThanMinlength = () => {\n      return this.inputValue.length < this.minlength;\n    };\n    /**\n     * Update error message and keep native input error message in sync.\n     */\n    this.updateErrorMessage = message => {\n      var _a;\n      (_a = this.textAreaElement) === null || _a === void 0 ? void 0 : _a.setCustomValidity(message);\n      this.errorMessageState = message;\n    };\n    this.updateErrorState = () => {\n      var _a, _b, _c;\n      const errorMessageIsSet = !!((_a = this.errorMessageState) === null || _a === void 0 ? void 0 : _a.length);\n      const requiredInUse = this.required;\n      const generalErrorInUse = !!((_b = this.errorMessage) === null || _b === void 0 ? void 0 : _b.length);\n      const minlengthInUse = this.minlength;\n      const minlengthErrorMessageIsSet = !!((_c = this.minlengthErrorMessage) === null || _c === void 0 ? void 0 : _c.length);\n      if (generalErrorInUse) {\n        this.updateErrorMessage(this.errorMessage);\n        this.touched = true;\n        // General error message overrides other errors, so exit here.\n        return;\n      }\n      if (requiredInUse) {\n        if (this.touched &&\n          !!this.requiredErrorMessage &&\n          this.isValueMissing()) {\n          this.updateErrorMessage(this.requiredErrorMessage);\n        }\n      }\n      if (minlengthInUse) {\n        if (this.touched &&\n          !!this.minlengthErrorMessage &&\n          this.isValueLessThanMinlength()) {\n          this.updateErrorMessage(this.minlengthErrorMessage);\n        }\n      }\n      // Clean error message if needed\n      if (errorMessageIsSet || minlengthErrorMessageIsSet) {\n        if (generalErrorInUse)\n          return;\n        if (requiredInUse && this.isValueMissing())\n          return;\n        if (minlengthInUse && this.isValueLessThanMinlength())\n          return;\n        this.updateErrorMessage('');\n      }\n    };\n    /**\n     * Input has been blurred at least once.\n     */\n    this.touched = false;\n  }\n  componentWillLoad() {\n    this.updateInputValue();\n    this.updateErrorState();\n  }\n  componentWillUpdate() {\n    this.updateErrorState();\n  }\n  componentDidRender() {\n    // This check is for Stencil unit tests. Input element is mocked,\n    // but setCustomValidity method is not. It is undefined.\n    var _a, _b, _c;\n    // eslint-disable-next-line @stencil/strict-boolean-conditions\n    if (this.textAreaElement && ((_a = this.textAreaElement) === null || _a === void 0 ? void 0 : _a.setCustomValidity)) {\n      (_b = this.textAreaElement) === null || _b === void 0 ? void 0 : _b.setCustomValidity(this.errorMessageState);\n    }\n    if (this.htmlForm) {\n      (_c = this.textAreaElement) === null || _c === void 0 ? void 0 : _c.setAttribute('form', this.htmlForm);\n    }\n  }\n  render() {\n    const showError = this.touched && !!this.errorMessageState.length;\n    const showAdditional = !!this.additional;\n    const describedBy = stringCombiner({\n      [this.additionalId]: showAdditional,\n      [this.errorId]: this.errorMessageState.length,\n    });\n    return (h(\"div\", { class: \"telia-textarea\" }, h(\"textarea\", { class: {\n        'telia-textarea__textarea': true,\n        'telia-textarea__textarea--touched': !!this.touched,\n      }, \"aria-describedby\": describedBy, disabled: this.disabled, id: this.inputId, maxlength: this.maxlength, minlength: this.minlength, name: this.name, ref: ref => (this.textAreaElement = ref), required: this.required, rows: this.rows, spellcheck: this.spellcheck, onInput: () => {\n        this.updateInputValue();\n        this.updateErrorState();\n      }, onBlur: () => {\n        this.touched = true;\n        this.updateErrorState();\n      }, onInvalid: event => {\n        event.preventDefault();\n        this.touched = true;\n        this.updateErrorState();\n      }, form: this.htmlForm }, this.value), h(\"telia-label\", { class: \"telia-textarea__label\", htmlFor: this.inputId }, this.required && h(\"span\", { \"aria-hidden\": \"true\" }, '* '), this.label), showAdditional && (h(\"telia-field-assistive-text\", { class: \"telia-textarea__additional\", id: this.additionalId }, this.additional)), showError && (h(\"telia-field-error\", { id: this.errorId, class: \"telia-textarea__error\" }, this.errorMessageState)), h(\"telia-vst\", { dataTrackingId: this.dataTrackingId })));\n  }\n  static get style() { return teliaTextareaCss; }\n}, [0, \"telia-textarea\", {\n    \"additional\": [1],\n    \"htmlForm\": [1, \"html-form\"],\n    \"additionalId\": [1, \"additional-id\"],\n    \"dataTestid\": [1, \"data-testid\"],\n    \"disabled\": [4],\n    \"errorId\": [1, \"error-id\"],\n    \"inputId\": [1, \"input-id\"],\n    \"label\": [1],\n    \"minlength\": [2],\n    \"maxlength\": [2],\n    \"name\": [1],\n    \"required\": [4],\n    \"rows\": [2],\n    \"spellcheck\": [4],\n    \"value\": [1],\n    \"errorMessage\": [1, \"error-message\"],\n    \"minlengthErrorMessage\": [1, \"minlength-error-message\"],\n    \"requiredErrorMessage\": [1, \"required-error-message\"],\n    \"inputValue\": [32],\n    \"errorMessageState\": [32],\n    \"touched\": [32]\n  }]);\nfunction defineCustomElement$1() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-textarea\", \"telia-field-assistive-text\", \"telia-field-error\", \"telia-icon\", \"telia-label\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-textarea\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaTextArea);\n      }\n      break;\n    case \"telia-field-assistive-text\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$6();\n      }\n      break;\n    case \"telia-field-error\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$5();\n      }\n      break;\n    case \"telia-icon\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$4();\n      }\n      break;\n    case \"telia-label\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$3();\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$2();\n      }\n      break;\n  } });\n}\ndefineCustomElement$1();\n\nconst TeliaTextarea = TeliaTextArea;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TeliaTextarea, defineCustomElement };\n"],"names":["teliaTextareaCss","TeliaTextArea","proxyCustomElement","HTMLElement","uniqueId","message","_a","_b","_c","errorMessageIsSet","requiredInUse","generalErrorInUse","minlengthInUse","minlengthErrorMessageIsSet","showError","showAdditional","describedBy","stringCombiner","h","ref","event","defineCustomElement$1","tagName","defineCustomElement$6","defineCustomElement$5","defineCustomElement$4","defineCustomElement$3","defineCustomElement$2"],"mappings":"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"}
+{"version":3,"file":"telia-textarea.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.2.0/node_modules/@teliads/components/dist/components/telia-textarea.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';\nimport { u as uniqueId } from './uniqueId.js';\nimport { s as stringCombiner } from './stringCombiner.js';\nimport { d as defineCustomElement$6 } from './telia-field-assistive-text2.js';\nimport { d as defineCustomElement$5 } from './telia-field-error2.js';\nimport { d as defineCustomElement$4 } from './telia-icon2.js';\nimport { d as defineCustomElement$3 } from './telia-label2.js';\nimport { d as defineCustomElement$2 } from './telia-vst2.js';\n\nconst teliaTextareaCss = \".telia-textarea{display:flex;flex-direction:column}.telia-textarea__textarea{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90;border-radius:calc(0.2rem * var(--voca-rem-multiplier));background-color:#ffffff;color:#222222;font-family:\\\"TeliaSans\\\", Helvetica, Arial, \\\"Lucida Grande\\\", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;-webkit-appearance:none;appearance:none;box-sizing:border-box;display:block;margin:0;padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier));width:100%;margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:2}.telia-textarea__textarea:hover{border:calc(0.2rem * var(--voca-rem-multiplier)) solid #29003e;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-textarea__textarea:hover:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea:focus{outline:solid calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;outline-offset:calc(0.2rem * var(--voca-rem-multiplier));padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-textarea__textarea:focus:hover{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea:disabled{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd;background-color:#dcdce1;color:#606064;cursor:not-allowed;-webkit-text-fill-color:#606064}.telia-textarea__textarea:disabled:hover{padding:calc(1rem * var(--voca-rem-multiplier)) calc(1.2rem * var(--voca-rem-multiplier))}.telia-textarea__textarea:disabled~telia-label .telia-label{color:#606064;cursor:not-allowed}.telia-textarea__textarea:disabled~.telia-textarea__additional{color:#b0b0b5}.telia-textarea__textarea:invalid{box-shadow:none}.telia-textarea__textarea--touched:invalid{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #be0040}.telia-textarea__textarea--touched:invalid:focus{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #8c8c90}.telia-textarea__textarea--touched:invalid:hover:not(:focus){border:calc(0.2rem * var(--voca-rem-multiplier)) solid #be0040;padding:calc(calc(1rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier))) calc(calc(1.2rem * var(--voca-rem-multiplier)) - calc(0.1rem * var(--voca-rem-multiplier)))}.telia-textarea__additional{order:4}.telia-textarea__error{margin:calc(0.4rem * var(--voca-rem-multiplier)) 0 0;order:5}\";\n\nconst TeliaTextArea = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    /** Additional description id */\n    this.additionalId = uniqueId('additional');\n    /** Disabled state */\n    this.disabled = false;\n    /** Error description id */\n    this.errorId = uniqueId('error');\n    /** Textarea input element id */\n    this.inputId = uniqueId('textareaId');\n    /** Required state */\n    this.required = false;\n    /** Textarea rows */\n    this.rows = 4;\n    /** Checks if textarea will be checked for spelling errors */\n    this.spellcheck = false;\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-textarea';\n    /**\n     * Real time value of input\n     */\n    this.inputValue = '';\n    /**\n     * Error message\n     */\n    this.errorMessageState = '';\n    this.updateInputValue = () => {\n      // eslint-disable-next-line @stencil/strict-boolean-conditions\n      this.inputValue = this.textAreaElement\n        ? this.textAreaElement.value\n        : this.value;\n    };\n    /**\n     * Check if input value is empty, so required should be triggered.\n     */\n    this.isValueMissing = () => {\n      return this.inputValue.length === 0;\n    };\n    /**\n     * Check if input value is empty, so required should be triggered.\n     */\n    this.isValueLessThanMinlength = () => {\n      return this.inputValue.length < this.minlength;\n    };\n    /**\n     * Update error message and keep native input error message in sync.\n     */\n    this.updateErrorMessage = message => {\n      var _a;\n      (_a = this.textAreaElement) === null || _a === void 0 ? void 0 : _a.setCustomValidity(message);\n      this.errorMessageState = message;\n    };\n    this.updateErrorState = () => {\n      var _a, _b, _c;\n      const errorMessageIsSet = !!((_a = this.errorMessageState) === null || _a === void 0 ? void 0 : _a.length);\n      const requiredInUse = this.required;\n      const generalErrorInUse = !!((_b = this.errorMessage) === null || _b === void 0 ? void 0 : _b.length);\n      const minlengthInUse = this.minlength;\n      const minlengthErrorMessageIsSet = !!((_c = this.minlengthErrorMessage) === null || _c === void 0 ? void 0 : _c.length);\n      if (generalErrorInUse) {\n        this.updateErrorMessage(this.errorMessage);\n        this.touched = true;\n        // General error message overrides other errors, so exit here.\n        return;\n      }\n      if (requiredInUse) {\n        if (this.touched &&\n          !!this.requiredErrorMessage &&\n          this.isValueMissing()) {\n          this.updateErrorMessage(this.requiredErrorMessage);\n        }\n      }\n      if (minlengthInUse) {\n        if (this.touched &&\n          !!this.minlengthErrorMessage &&\n          this.isValueLessThanMinlength()) {\n          this.updateErrorMessage(this.minlengthErrorMessage);\n        }\n      }\n      // Clean error message if needed\n      if (errorMessageIsSet || minlengthErrorMessageIsSet) {\n        if (generalErrorInUse)\n          return;\n        if (requiredInUse && this.isValueMissing())\n          return;\n        if (minlengthInUse && this.isValueLessThanMinlength())\n          return;\n        this.updateErrorMessage('');\n      }\n    };\n    /**\n     * Input has been blurred at least once.\n     */\n    this.touched = false;\n  }\n  componentWillLoad() {\n    this.updateInputValue();\n    this.updateErrorState();\n  }\n  componentWillUpdate() {\n    this.updateErrorState();\n  }\n  componentDidRender() {\n    // This check is for Stencil unit tests. Input element is mocked,\n    // but setCustomValidity method is not. It is undefined.\n    var _a, _b, _c;\n    // eslint-disable-next-line @stencil/strict-boolean-conditions\n    if (this.textAreaElement && ((_a = this.textAreaElement) === null || _a === void 0 ? void 0 : _a.setCustomValidity)) {\n      (_b = this.textAreaElement) === null || _b === void 0 ? void 0 : _b.setCustomValidity(this.errorMessageState);\n    }\n    if (this.htmlForm) {\n      (_c = this.textAreaElement) === null || _c === void 0 ? void 0 : _c.setAttribute('form', this.htmlForm);\n    }\n  }\n  render() {\n    const showError = this.touched && !!this.errorMessageState.length;\n    const showAdditional = !!this.additional;\n    const describedBy = stringCombiner({\n      [this.additionalId]: showAdditional,\n      [this.errorId]: this.errorMessageState.length,\n    });\n    return (h(\"div\", { class: \"telia-textarea\" }, h(\"textarea\", { class: {\n        'telia-textarea__textarea': true,\n        'telia-textarea__textarea--touched': !!this.touched,\n      }, \"aria-describedby\": describedBy, disabled: this.disabled, id: this.inputId, maxlength: this.maxlength, minlength: this.minlength, name: this.name, ref: ref => (this.textAreaElement = ref), required: this.required, rows: this.rows, spellcheck: this.spellcheck, onInput: () => {\n        this.updateInputValue();\n        this.updateErrorState();\n      }, onBlur: () => {\n        this.touched = true;\n        this.updateErrorState();\n      }, onInvalid: event => {\n        event.preventDefault();\n        this.touched = true;\n        this.updateErrorState();\n      }, form: this.htmlForm }, this.value), h(\"telia-label\", { class: \"telia-textarea__label\", htmlFor: this.inputId }, this.required && h(\"span\", { \"aria-hidden\": \"true\" }, '* '), this.label), showAdditional && (h(\"telia-field-assistive-text\", { class: \"telia-textarea__additional\", id: this.additionalId }, this.additional)), showError && (h(\"telia-field-error\", { id: this.errorId, class: \"telia-textarea__error\" }, this.errorMessageState)), h(\"telia-vst\", { dataTrackingId: this.dataTrackingId })));\n  }\n  static get style() { return teliaTextareaCss; }\n}, [0, \"telia-textarea\", {\n    \"additional\": [1],\n    \"htmlForm\": [1, \"html-form\"],\n    \"additionalId\": [1, \"additional-id\"],\n    \"dataTestid\": [1, \"data-testid\"],\n    \"disabled\": [4],\n    \"errorId\": [1, \"error-id\"],\n    \"inputId\": [1, \"input-id\"],\n    \"label\": [1],\n    \"minlength\": [2],\n    \"maxlength\": [2],\n    \"name\": [1],\n    \"required\": [4],\n    \"rows\": [2],\n    \"spellcheck\": [4],\n    \"value\": [1],\n    \"errorMessage\": [1, \"error-message\"],\n    \"minlengthErrorMessage\": [1, \"minlength-error-message\"],\n    \"requiredErrorMessage\": [1, \"required-error-message\"],\n    \"inputValue\": [32],\n    \"errorMessageState\": [32],\n    \"touched\": [32]\n  }]);\nfunction defineCustomElement$1() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-textarea\", \"telia-field-assistive-text\", \"telia-field-error\", \"telia-icon\", \"telia-label\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-textarea\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaTextArea);\n      }\n      break;\n    case \"telia-field-assistive-text\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$6();\n      }\n      break;\n    case \"telia-field-error\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$5();\n      }\n      break;\n    case \"telia-icon\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$4();\n      }\n      break;\n    case \"telia-label\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$3();\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$2();\n      }\n      break;\n  } });\n}\ndefineCustomElement$1();\n\nconst TeliaTextarea = TeliaTextArea;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TeliaTextarea, defineCustomElement };\n"],"names":["teliaTextareaCss","TeliaTextArea","proxyCustomElement","HTMLElement","uniqueId","message","_a","_b","_c","errorMessageIsSet","requiredInUse","generalErrorInUse","minlengthInUse","minlengthErrorMessageIsSet","showError","showAdditional","describedBy","stringCombiner","h","ref","event","defineCustomElement$1","tagName","defineCustomElement$6","defineCustomElement$5","defineCustomElement$4","defineCustomElement$3","defineCustomElement$2"],"mappings":";;;;;;;;;;AASA,MAAMA,IAAmB,qgFAEnBC,IAA8B,gBAAAC,EAAmB,cAAcC,EAAY;AAAA,EAC/E,cAAc;AACZ,aACA,KAAK,eAAc,GAEnB,KAAK,eAAeC,EAAS,YAAY,GAEzC,KAAK,WAAW,IAEhB,KAAK,UAAUA,EAAS,OAAO,GAE/B,KAAK,UAAUA,EAAS,YAAY,GAEpC,KAAK,WAAW,IAEhB,KAAK,OAAO,GAEZ,KAAK,aAAa,IAElB,KAAK,iBAAiB,kBAItB,KAAK,aAAa,IAIlB,KAAK,oBAAoB,IACzB,KAAK,mBAAmB,MAAM;AAE5B,WAAK,aAAa,KAAK,kBACnB,KAAK,gBAAgB,QACrB,KAAK;AAAA,IACf,GAII,KAAK,iBAAiB,MACb,KAAK,WAAW,WAAW,GAKpC,KAAK,2BAA2B,MACvB,KAAK,WAAW,SAAS,KAAK,WAKvC,KAAK,qBAAqB,CAAAC,MAAW;AACnC,UAAIC;AACJ,OAACA,IAAK,KAAK,qBAAqB,QAAQA,MAAO,UAAkBA,EAAG,kBAAkBD,CAAO,GAC7F,KAAK,oBAAoBA;AAAA,IAC/B,GACI,KAAK,mBAAmB,MAAM;AAC5B,UAAIC,GAAIC,GAAIC;AACZ,YAAMC,IAAoB,CAAC,EAAG,GAAAH,IAAK,KAAK,uBAAuB,QAAQA,MAAO,WAAkBA,EAAG,SAC7FI,IAAgB,KAAK,UACrBC,IAAoB,CAAC,EAAG,GAAAJ,IAAK,KAAK,kBAAkB,QAAQA,MAAO,WAAkBA,EAAG,SACxFK,IAAiB,KAAK,WACtBC,IAA6B,CAAC,EAAG,GAAAL,IAAK,KAAK,2BAA2B,QAAQA,MAAO,WAAkBA,EAAG;AAChH,UAAIG,GAAmB;AACrB,aAAK,mBAAmB,KAAK,YAAY,GACzC,KAAK,UAAU;AAEf;AAAA,MACD;AAgBD,UAfID,KACE,KAAK,WACP,CAAC,CAAC,KAAK,wBACP,KAAK,eAAc,KACnB,KAAK,mBAAmB,KAAK,oBAAoB,GAGjDE,KACE,KAAK,WACP,CAAC,CAAC,KAAK,yBACP,KAAK,yBAAwB,KAC7B,KAAK,mBAAmB,KAAK,qBAAqB,GAIlDH,KAAqBI,GAA4B;AAKnD,YAJIF,KAEAD,KAAiB,KAAK,eAAgB,KAEtCE,KAAkB,KAAK,yBAA0B;AACnD;AACF,aAAK,mBAAmB,EAAE;AAAA,MAC3B;AAAA,IACP,GAII,KAAK,UAAU;AAAA,EAChB;AAAA,EACD,oBAAoB;AAClB,SAAK,iBAAgB,GACrB,KAAK,iBAAgB;AAAA,EACtB;AAAA,EACD,sBAAsB;AACpB,SAAK,iBAAgB;AAAA,EACtB;AAAA,EACD,qBAAqB;AAGnB,QAAIN,GAAIC,GAAIC;AAEZ,IAAI,KAAK,qBAAqBF,IAAK,KAAK,qBAAqB,QAAQA,MAAO,SAAS,SAASA,EAAG,wBAC9FC,IAAK,KAAK,qBAAqB,QAAQA,MAAO,UAAkBA,EAAG,kBAAkB,KAAK,iBAAiB,IAE1G,KAAK,cACNC,IAAK,KAAK,qBAAqB,QAAQA,MAAO,UAAkBA,EAAG,aAAa,QAAQ,KAAK,QAAQ;AAAA,EAEzG;AAAA,EACD,SAAS;AACP,UAAMM,IAAY,KAAK,WAAW,CAAC,CAAC,KAAK,kBAAkB,QACrDC,IAAiB,CAAC,CAAC,KAAK,YACxBC,IAAcC,EAAe;AAAA,MACjC,CAAC,KAAK,eAAeF;AAAA,MACrB,CAAC,KAAK,UAAU,KAAK,kBAAkB;AAAA,IAC7C,CAAK;AACD,WAAQG,EAAE,OAAO,EAAE,OAAO,iBAAgB,GAAIA,EAAE,YAAY,EAAE,OAAO;AAAA,MACjE,4BAA4B;AAAA,MAC5B,qCAAqC,CAAC,CAAC,KAAK;AAAA,IACpD,GAAS,oBAAoBF,GAAa,UAAU,KAAK,UAAU,IAAI,KAAK,SAAS,WAAW,KAAK,WAAW,WAAW,KAAK,WAAW,MAAM,KAAK,MAAM,KAAK,CAAAG,MAAQ,KAAK,kBAAkBA,GAAM,UAAU,KAAK,UAAU,MAAM,KAAK,MAAM,YAAY,KAAK,YAAY,SAAS,MAAM;AACpR,WAAK,iBAAgB,GACrB,KAAK,iBAAgB;AAAA,IACtB,GAAE,QAAQ,MAAM;AACf,WAAK,UAAU,IACf,KAAK,iBAAgB;AAAA,IAC7B,GAAS,WAAW,CAAAC,MAAS;AACrB,MAAAA,EAAM,eAAc,GACpB,KAAK,UAAU,IACf,KAAK,iBAAgB;AAAA,IACtB,GAAE,MAAM,KAAK,SAAU,GAAE,KAAK,KAAK,GAAGF,EAAE,eAAe,EAAE,OAAO,yBAAyB,SAAS,KAAK,WAAW,KAAK,YAAYA,EAAE,QAAQ,EAAE,eAAe,UAAU,IAAI,GAAG,KAAK,KAAK,GAAGH,KAAmBG,EAAE,8BAA8B,EAAE,OAAO,8BAA8B,IAAI,KAAK,aAAY,GAAI,KAAK,UAAU,GAAIJ,KAAcI,EAAE,qBAAqB,EAAE,IAAI,KAAK,SAAS,OAAO,wBAAuB,GAAI,KAAK,iBAAiB,GAAIA,EAAE,aAAa,EAAE,gBAAgB,KAAK,eAAc,CAAE,CAAC;AAAA,EAClf;AAAA,EACD,WAAW,QAAQ;AAAE,WAAOlB;AAAA,EAAmB;AACjD,GAAG,CAAC,GAAG,kBAAkB;AAAA,EACrB,YAAc,CAAC,CAAC;AAAA,EAChB,UAAY,CAAC,GAAG,WAAW;AAAA,EAC3B,cAAgB,CAAC,GAAG,eAAe;AAAA,EACnC,YAAc,CAAC,GAAG,aAAa;AAAA,EAC/B,UAAY,CAAC,CAAC;AAAA,EACd,SAAW,CAAC,GAAG,UAAU;AAAA,EACzB,SAAW,CAAC,GAAG,UAAU;AAAA,EACzB,OAAS,CAAC,CAAC;AAAA,EACX,WAAa,CAAC,CAAC;AAAA,EACf,WAAa,CAAC,CAAC;AAAA,EACf,MAAQ,CAAC,CAAC;AAAA,EACV,UAAY,CAAC,CAAC;AAAA,EACd,MAAQ,CAAC,CAAC;AAAA,EACV,YAAc,CAAC,CAAC;AAAA,EAChB,OAAS,CAAC,CAAC;AAAA,EACX,cAAgB,CAAC,GAAG,eAAe;AAAA,EACnC,uBAAyB,CAAC,GAAG,yBAAyB;AAAA,EACtD,sBAAwB,CAAC,GAAG,wBAAwB;AAAA,EACpD,YAAc,CAAC,EAAE;AAAA,EACjB,mBAAqB,CAAC,EAAE;AAAA,EACxB,SAAW,CAAC,EAAE;AACf,CAAA,CAAC;AACJ,SAASqB,IAAwB;AAC/B,MAAI,OAAO,iBAAmB;AAC5B;AAGF,EADmB,CAAC,kBAAkB,8BAA8B,qBAAqB,cAAc,eAAe,WAAW,EACtH,QAAQ,CAAAC,MAAW;AAAE,YAAQA,GAAO;AAAA,MAC7C,KAAK;AACH,QAAK,eAAe,IAAIA,CAAO,KAC7B,eAAe,OAAOA,GAASrB,CAAa;AAE9C;AAAA,MACF,KAAK;AACH,QAAK,eAAe,IAAIqB,CAAO,KAC7BC;AAEF;AAAA,MACF,KAAK;AACH,QAAK,eAAe,IAAID,CAAO,KAC7BE;AAEF;AAAA,MACF,KAAK;AACH,QAAK,eAAe,IAAIF,CAAO,KAC7BG;AAEF;AAAA,MACF,KAAK;AACH,QAAK,eAAe,IAAIH,CAAO,KAC7BI;AAEF;AAAA,MACF,KAAK;AACH,QAAK,eAAe,IAAIJ,CAAO,KAC7BK;AAEF;AAAA,IACH;AAAA,EAAA,CAAE;AACL;AACAN,EAAuB;"}

package/voca/components/telia-toggle.js

@@ -1,6 +1,6 @@
 import { p as o, H as s, c as n, h as i } from "../../chunks/index-f01c7229.js";
-import { d as c } from "../../chunks/telia-visually-hidden2-1ce59952.js";
-import { d as g } from "../../chunks/telia-vst2-5b44b983.js";
+import { d as c } from "../../chunks/telia-visually-hidden2-2107d70a.js";
+import { d as g } from "../../chunks/telia-vst2-db6a58b9.js";
 const d = '.telia-toggle{align-items:center;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;outline:none;position:relative}.telia-toggle--disabled{cursor:not-allowed}.telia-toggle button{clip:rect(0 0 0 0);clip-path:circle(0%);height:0;margin:0;padding:calc(1.2rem * var(--voca-rem-multiplier)) 0;position:absolute;width:0;}.telia-toggle button[aria-pressed=true]~.telia-toggle__track .telia-toggle__thumb{transform:translateX(calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1) - calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) + calc(0.2rem * var(--voca-rem-multiplier))))}.telia-toggle button:focus~.telia-toggle__label::before{border-radius:calc(0.2rem * var(--voca-rem-multiplier));box-shadow:0 0 0 calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;bottom:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));content:"";display:block;left:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));position:absolute;right:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));top:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));height:calc(100% + calc(0.8rem * var(--voca-rem-multiplier)));width:calc(100% + calc(0.8rem * var(--voca-rem-multiplier)))}.telia-toggle button:focus:not(:focus-visible)~.telia-toggle__label ::before{box-shadow:none;outline:0}.telia-toggle button:active~.telia-toggle__track .telia-toggle__thumb--on{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle button:active~.telia-toggle__track .telia-toggle__thumb--off{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}@media (hover: hover){.telia-toggle button:not(:disabled)~.telia-toggle__track--on:hover .telia-toggle__thumb--on,.telia-toggle button:not(:disabled)~.telia-toggle__thumb--on:hover{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle button:not(:disabled)~.telia-toggle__track--off:hover .telia-toggle__thumb--off,.telia-toggle button:not(:disabled)~.telia-toggle__thumb--off:hover{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}}.telia-toggle button:active:not(:disabled)~.telia-toggle__track .telia-toggle__thumb--on{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(0.9rem * var(--voca-rem-multiplier));transform:translateX(calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1) - calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) + calc(0.4rem * var(--voca-rem-multiplier))));transition:all 200ms ease;width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle button:active:not(:disabled)~.telia-toggle__track .telia-toggle__thumb--off{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(calc(2rem * var(--voca-rem-multiplier)) / 2);transform:translateX(0);transition:all 200ms ease;width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle button:disabled~.telia-toggle__track--on:before,.telia-toggle button:disabled~.telia-toggle__track--off:before{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd}.telia-toggle button:disabled~.telia-toggle__track--on:before{background-color:#c8c8cd}.telia-toggle button:disabled~.telia-toggle__label{color:#606064}.telia-toggle button:disabled~.telia-toggle__track .telia-toggle__thumb--on{background-color:#b0b0b5;border:calc(0.1rem * var(--voca-rem-multiplier)) solid #ffffff;box-shadow:none;padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(1rem * var(--voca-rem-multiplier));}.telia-toggle button:disabled~.telia-toggle__track .telia-toggle__thumb--off{background-color:#c8c8cd;border:calc(0.1rem * var(--voca-rem-multiplier)) solid #ffffff;box-shadow:none;padding:calc(1.1rem * var(--voca-rem-multiplier));}.telia-toggle__track{z-index:1;align-items:center;border:calc(1.2rem * var(--voca-rem-multiplier)) solid transparent;box-sizing:content-box;display:flex;height:calc(2rem * var(--voca-rem-multiplier));position:relative;right:0;transition:all 200ms ease;width:calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1)}.telia-toggle__track::before{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #29003e;border-radius:calc(99.9rem * var(--voca-rem-multiplier));z-index:auto;content:" ";display:block;height:100%;position:absolute;width:100%}.telia-toggle__thumb{border-radius:calc(99.9rem * var(--voca-rem-multiplier));z-index:1;background-clip:padding-box;box-sizing:border-box;height:calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2);padding:calc(0.7rem * var(--voca-rem-multiplier)) calc(1.1rem * var(--voca-rem-multiplier));transform:translateX(-0.2rem);transition:all 200ms ease;width:calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2)}.telia-toggle__thumb--on{background-color:#29003e}.telia-toggle__thumb--on.telia-toggle__thumb--dragging{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle__thumb--off{background-color:#8c8c90;padding:calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) / 2)}.telia-toggle__thumb--off.telia-toggle__thumb--dragging{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle__thumb--dragging{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(0.9rem * var(--voca-rem-multiplier));width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle__thumb-line{background-color:#ffffff;border-radius:calc(0.2rem * var(--voca-rem-multiplier));height:100%;width:100%}.telia-toggle--label-none{display:inline-flex}.telia-toggle--label-none .telia-toggle__track{border-left:0;border-right:0}.telia-toggle--label-before .telia-toggle__track{border-right:0}.telia-toggle--label-after .telia-toggle__track{border-left:0}.telia-toggle__label{font-family:"TeliaSans", Helvetica, Arial, "Lucida Grande", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;flex:1 1 0;padding:calc(1.2rem * var(--voca-rem-multiplier)) 0}.telia-toggle__label--none{flex:none;padding:0}', h = /* @__PURE__ */ o(class extends s {
   constructor() {
     super(), this.__registerHost(), this.__attachShadow(), this.vocaChange = n(this, "vocaChange", 7), this.disabled = !1, this.labelPosition = "before", this.dataTrackingId = "telia-toggle", this.dragged = !1, this.dragging = !1, this.dragStartX = 0, this.dragX = 0, this.eventListeners = {

package/voca/components/telia-toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"telia-toggle.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.1.8/node_modules/@teliads/components/dist/components/telia-toggle.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';\nimport { d as defineCustomElement$3 } from './telia-visually-hidden2.js';\nimport { d as defineCustomElement$2 } from './telia-vst2.js';\n\nconst teliaToggleCss = \".telia-toggle{align-items:center;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;outline:none;position:relative}.telia-toggle--disabled{cursor:not-allowed}.telia-toggle button{clip:rect(0 0 0 0);clip-path:circle(0%);height:0;margin:0;padding:calc(1.2rem * var(--voca-rem-multiplier)) 0;position:absolute;width:0;}.telia-toggle button[aria-pressed=true]~.telia-toggle__track .telia-toggle__thumb{transform:translateX(calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1) - calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) + calc(0.2rem * var(--voca-rem-multiplier))))}.telia-toggle button:focus~.telia-toggle__label::before{border-radius:calc(0.2rem * var(--voca-rem-multiplier));box-shadow:0 0 0 calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;bottom:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));content:\\\"\\\";display:block;left:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));position:absolute;right:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));top:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));height:calc(100% + calc(0.8rem * var(--voca-rem-multiplier)));width:calc(100% + calc(0.8rem * var(--voca-rem-multiplier)))}.telia-toggle button:focus:not(:focus-visible)~.telia-toggle__label ::before{box-shadow:none;outline:0}.telia-toggle button:active~.telia-toggle__track .telia-toggle__thumb--on{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle button:active~.telia-toggle__track .telia-toggle__thumb--off{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}@media (hover: hover){.telia-toggle button:not(:disabled)~.telia-toggle__track--on:hover .telia-toggle__thumb--on,.telia-toggle button:not(:disabled)~.telia-toggle__thumb--on:hover{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle button:not(:disabled)~.telia-toggle__track--off:hover .telia-toggle__thumb--off,.telia-toggle button:not(:disabled)~.telia-toggle__thumb--off:hover{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}}.telia-toggle button:active:not(:disabled)~.telia-toggle__track .telia-toggle__thumb--on{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(0.9rem * var(--voca-rem-multiplier));transform:translateX(calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1) - calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) + calc(0.4rem * var(--voca-rem-multiplier))));transition:all 200ms ease;width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle button:active:not(:disabled)~.telia-toggle__track .telia-toggle__thumb--off{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(calc(2rem * var(--voca-rem-multiplier)) / 2);transform:translateX(0);transition:all 200ms ease;width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle button:disabled~.telia-toggle__track--on:before,.telia-toggle button:disabled~.telia-toggle__track--off:before{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd}.telia-toggle button:disabled~.telia-toggle__track--on:before{background-color:#c8c8cd}.telia-toggle button:disabled~.telia-toggle__label{color:#606064}.telia-toggle button:disabled~.telia-toggle__track .telia-toggle__thumb--on{background-color:#b0b0b5;border:calc(0.1rem * var(--voca-rem-multiplier)) solid #ffffff;box-shadow:none;padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(1rem * var(--voca-rem-multiplier));}.telia-toggle button:disabled~.telia-toggle__track .telia-toggle__thumb--off{background-color:#c8c8cd;border:calc(0.1rem * var(--voca-rem-multiplier)) solid #ffffff;box-shadow:none;padding:calc(1.1rem * var(--voca-rem-multiplier));}.telia-toggle__track{z-index:1;align-items:center;border:calc(1.2rem * var(--voca-rem-multiplier)) solid transparent;box-sizing:content-box;display:flex;height:calc(2rem * var(--voca-rem-multiplier));position:relative;right:0;transition:all 200ms ease;width:calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1)}.telia-toggle__track::before{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #29003e;border-radius:calc(99.9rem * var(--voca-rem-multiplier));z-index:auto;content:\\\" \\\";display:block;height:100%;position:absolute;width:100%}.telia-toggle__thumb{border-radius:calc(99.9rem * var(--voca-rem-multiplier));z-index:1;background-clip:padding-box;box-sizing:border-box;height:calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2);padding:calc(0.7rem * var(--voca-rem-multiplier)) calc(1.1rem * var(--voca-rem-multiplier));transform:translateX(-0.2rem);transition:all 200ms ease;width:calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2)}.telia-toggle__thumb--on{background-color:#29003e}.telia-toggle__thumb--on.telia-toggle__thumb--dragging{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle__thumb--off{background-color:#8c8c90;padding:calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) / 2)}.telia-toggle__thumb--off.telia-toggle__thumb--dragging{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle__thumb--dragging{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(0.9rem * var(--voca-rem-multiplier));width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle__thumb-line{background-color:#ffffff;border-radius:calc(0.2rem * var(--voca-rem-multiplier));height:100%;width:100%}.telia-toggle--label-none{display:inline-flex}.telia-toggle--label-none .telia-toggle__track{border-left:0;border-right:0}.telia-toggle--label-before .telia-toggle__track{border-right:0}.telia-toggle--label-after .telia-toggle__track{border-left:0}.telia-toggle__label{font-family:\\\"TeliaSans\\\", Helvetica, Arial, \\\"Lucida Grande\\\", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;flex:1 1 0;padding:calc(1.2rem * var(--voca-rem-multiplier)) 0}.telia-toggle__label--none{flex:none;padding:0}\";\n\nconst TeliaToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    this.__attachShadow();\n    this.vocaChange = createEvent(this, \"vocaChange\", 7);\n    /** When set, the toggle button is disabled and the change event won't be emitted */\n    this.disabled = false;\n    /** The position of the label. When set to neither after nor before, the label will be hidden but still set as aria-label for the button element */\n    this.labelPosition = 'before';\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-toggle';\n    this.dragged = false;\n    this.dragging = false;\n    this.dragStartX = 0;\n    this.dragX = 0;\n    this.eventListeners = {\n      mousemove: this.onDrag.bind(this),\n      touchmove: this.onDrag.bind(this),\n      mouseup: this.endDragEmitChange.bind(this),\n      touchend: this.endDragEmitChange.bind(this),\n    };\n    this.emitChange = event => {\n      if (this.disabled)\n        return;\n      this.internalSelected = !this.internalSelected;\n      this.vocaChange.emit({\n        originalEvent: event,\n        value: this.internalSelected,\n      });\n    };\n  }\n  setInternalSelected(newValue) {\n    this.internalSelected = newValue;\n  }\n  componentWillLoad() {\n    this.internalSelected = this.selected;\n    this.remSize = 10;\n    this.trackHeight = 2 * this.remSize;\n    this.thumbMaxDragRange = this.trackHeight * 1.1;\n    this.thumbPressedLineHeight = Math.round(0.83 * this.remSize);\n    this.thumbLineWidth = 0.2 * this.remSize;\n  }\n  addEventListeners() {\n    Object.entries(this.eventListeners).forEach(([eventName, listener]) => {\n      document.addEventListener(eventName, listener);\n    });\n  }\n  removeEventListeners() {\n    Object.entries(this.eventListeners).forEach(([eventName, listener]) => {\n      document.removeEventListener(eventName, listener);\n    });\n  }\n  initDrag(event) {\n    this.stopPrevent(event);\n    if (!this.disabled) {\n      this.addEventListeners();\n      this.dragging = true;\n      this.dragStartX = this.getClientX(event);\n      this.dragX = this.getClientX(event);\n    }\n  }\n  endDrag(event) {\n    event && this.stopPrevent(event);\n    this.removeEventListeners();\n    this.dragged = false;\n    this.dragging = false;\n    this.dragStartX = 0;\n    this.dragX = 0;\n  }\n  endDragEmitChange(event) {\n    if (!this.dragged || this.isDraggedHalfway()) {\n      this.emitChange(event);\n    }\n    this.endDrag(event);\n  }\n  onDrag(event) {\n    const draggedRange = Math.abs(Math.round(this.dragX - this.dragStartX));\n    this.dragged = draggedRange > 0;\n    this.dragX = this.getClientX(event);\n  }\n  getClientX(event) {\n    var _a, _b, _c;\n    return (_a = event.clientX) !== null && _a !== void 0 ? _a : (_c = (_b = event.touches) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.clientX;\n  }\n  toggleOnEnter(event) {\n    this.stopPrevent(event);\n    if (event.key === 'Enter' || event.key === ' ') {\n      this.emitChange(event);\n    }\n  }\n  onLabelClick(event) {\n    this.stopPrevent(event);\n    if (event.type === 'click') {\n      this.emitChange(event);\n    }\n  }\n  stopPrevent(event) {\n    event.cancelable && event.preventDefault();\n    event.stopPropagation();\n  }\n  getThumbOffset() {\n    const diff = Math.round(this.dragX - this.dragStartX);\n    const stateOffset = this.internalSelected ? this.thumbMaxDragRange : 0;\n    const offset = diff + stateOffset;\n    if (offset > this.thumbMaxDragRange) {\n      return this.thumbMaxDragRange;\n    }\n    else if (offset < 0) {\n      return 0;\n    }\n    else {\n      return offset;\n    }\n  }\n  isDraggedHalfway() {\n    return this.internalSelected\n      ? this.getThumbOffset() < this.thumbMaxDragRange / 2\n      : this.getThumbOffset() > this.thumbMaxDragRange / 2;\n  }\n  getValueByState(onValue, offValue) {\n    if (this.internalSelected) {\n      return this.isDraggedHalfway() ? offValue : onValue;\n    }\n    else {\n      return this.isDraggedHalfway() ? onValue : offValue;\n    }\n  }\n  calculateThumbPadding() {\n    const halfDragRange = this.thumbMaxDragRange / 2;\n    const halfwayDraggedPercentage = Math.abs((this.getThumbOffset() - halfDragRange) / halfDragRange);\n    const topBottomPadding = `${(this.trackHeight -\n      this.thumbPressedLineHeight * halfwayDraggedPercentage) /\n      2}px`;\n    const onPadding = `${topBottomPadding} ${(this.trackHeight - this.thumbLineWidth) / 2}px`;\n    const offPadding = `${this.trackHeight / 2}px`;\n    return this.getValueByState(onPadding, offPadding);\n  }\n  getThumbStyle() {\n    const cursor = this.dragged ? 'grabbing' : 'inherit';\n    const padding = this.calculateThumbPadding();\n    const transform = `translateX(${this.getThumbOffset()}px)`;\n    const transition = `all 200ms ease${this.dragged ? ', transform 0ms, padding 0ms' : ''}`;\n    return this.dragging ? { cursor, padding, transform, transition } : {};\n  }\n  getThumbClass() {\n    const thumbBaseClass = 'telia-toggle__thumb';\n    const stateClass = this.getValueByState(`${thumbBaseClass}--on`, `${thumbBaseClass}--off`);\n    const draggingClass = this.dragging ? ` ${thumbBaseClass}--dragging` : '';\n    return `${thumbBaseClass} ${stateClass}${draggingClass}`;\n  }\n  getTrackClass() {\n    const trackBaseClass = 'telia-toggle__track';\n    const stateClass = this.getValueByState(`${trackBaseClass}--on`, `${trackBaseClass}--off`);\n    return `${trackBaseClass} ${stateClass}`;\n  }\n  renderLabel() {\n    const labelPositionClass = this.labelPosition\n      ? ` telia-toggle__label--${this.labelPosition}`\n      : '';\n    return (this.label && (h(\"span\", { class: `telia-toggle__label${labelPositionClass}`, onMouseUp: e => this.endDrag(e), onTouchEnd: e => this.endDragEmitChange(e), onClick: e => this.onLabelClick(e) }, this.labelPosition !== 'none' && this.label)));\n  }\n  render() {\n    const componentClass = 'telia-toggle';\n    const wrapperClasses = {\n      [`${componentClass}`]: true,\n      [`${componentClass}--label-${this.labelPosition}`]: true,\n      [`${componentClass}--disabled`]: this.disabled,\n    };\n    return (h(\"div\", { class: wrapperClasses }, h(\"button\", { \"aria-pressed\": this.internalSelected ? 'true' : 'false', disabled: this.disabled, \"aria-labelledby\": this.labelledby, onKeyUp: e => this.toggleOnEnter(e) }, h(\"telia-visually-hidden\", null, this.label)), (this.labelPosition === 'before' || this.labelPosition === 'none') &&\n      this.renderLabel(), h(\"div\", { class: this.getTrackClass(), onMouseUp: e => this.endDrag(e), onTouchEnd: e => this.endDragEmitChange(e), onClick: e => this.onLabelClick(e) }, h(\"div\", { style: this.getThumbStyle(), class: this.getThumbClass(), onMouseDown: e => this.initDrag(e), onTouchStart: e => this.initDrag(e), onMouseUp: e => this.endDragEmitChange(e), onTouchEnd: e => this.endDragEmitChange(e), onClick: e => this.stopPrevent(e) }, h(\"div\", { class: \"telia-toggle__thumb-line\" })), h(\"telia-vst\", { dataTrackingId: this.dataTrackingId })), this.labelPosition === 'after' && this.renderLabel()));\n  }\n  static get watchers() { return {\n    \"selected\": [\"setInternalSelected\"]\n  }; }\n  static get style() { return teliaToggleCss; }\n}, [1, \"telia-toggle\", {\n    \"dataTestid\": [1, \"data-testid\"],\n    \"selected\": [4],\n    \"disabled\": [4],\n    \"label\": [1],\n    \"labelPosition\": [1, \"label-position\"],\n    \"labelledby\": [1],\n    \"dragged\": [32],\n    \"dragging\": [32],\n    \"dragStartX\": [32],\n    \"dragX\": [32],\n    \"internalSelected\": [32],\n    \"remSize\": [32],\n    \"trackHeight\": [32],\n    \"thumbMaxDragRange\": [32],\n    \"thumbPressedLineHeight\": [32],\n    \"thumbLineWidth\": [32],\n    \"eventListeners\": [32]\n  }]);\nfunction defineCustomElement$1() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-toggle\", \"telia-visually-hidden\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-toggle\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaToggle$1);\n      }\n      break;\n    case \"telia-visually-hidden\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$3();\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$2();\n      }\n      break;\n  } });\n}\ndefineCustomElement$1();\n\nconst TeliaToggle = TeliaToggle$1;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TeliaToggle, defineCustomElement };\n"],"names":["teliaToggleCss","TeliaToggle$1","proxyCustomElement","HTMLElement","createEvent","event","newValue","eventName","listener","draggedRange","_a","_b","_c","diff","stateOffset","offset","onValue","offValue","halfDragRange","halfwayDraggedPercentage","onPadding","offPadding","cursor","padding","transform","transition","thumbBaseClass","stateClass","draggingClass","trackBaseClass","labelPositionClass","h","e","componentClass","wrapperClasses","defineCustomElement$1","tagName","defineCustomElement$3","defineCustomElement$2"],"mappings":"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"}
+{"version":3,"file":"telia-toggle.js","sources":["../../../../node_modules/.pnpm/@teliads+components@18.2.0/node_modules/@teliads/components/dist/components/telia-toggle.js"],"sourcesContent":["import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';\nimport { d as defineCustomElement$3 } from './telia-visually-hidden2.js';\nimport { d as defineCustomElement$2 } from './telia-vst2.js';\n\nconst teliaToggleCss = \".telia-toggle{align-items:center;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;outline:none;position:relative}.telia-toggle--disabled{cursor:not-allowed}.telia-toggle button{clip:rect(0 0 0 0);clip-path:circle(0%);height:0;margin:0;padding:calc(1.2rem * var(--voca-rem-multiplier)) 0;position:absolute;width:0;}.telia-toggle button[aria-pressed=true]~.telia-toggle__track .telia-toggle__thumb{transform:translateX(calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1) - calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) + calc(0.2rem * var(--voca-rem-multiplier))))}.telia-toggle button:focus~.telia-toggle__label::before{border-radius:calc(0.2rem * var(--voca-rem-multiplier));box-shadow:0 0 0 calc(0.3rem * var(--voca-rem-multiplier)) #0099ff;bottom:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));content:\\\"\\\";display:block;left:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));position:absolute;right:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));top:calc(-1 * calc(0.4rem * var(--voca-rem-multiplier)));height:calc(100% + calc(0.8rem * var(--voca-rem-multiplier)));width:calc(100% + calc(0.8rem * var(--voca-rem-multiplier)))}.telia-toggle button:focus:not(:focus-visible)~.telia-toggle__label ::before{box-shadow:none;outline:0}.telia-toggle button:active~.telia-toggle__track .telia-toggle__thumb--on{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle button:active~.telia-toggle__track .telia-toggle__thumb--off{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}@media (hover: hover){.telia-toggle button:not(:disabled)~.telia-toggle__track--on:hover .telia-toggle__thumb--on,.telia-toggle button:not(:disabled)~.telia-toggle__thumb--on:hover{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle button:not(:disabled)~.telia-toggle__track--off:hover .telia-toggle__thumb--off,.telia-toggle button:not(:disabled)~.telia-toggle__thumb--off:hover{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}}.telia-toggle button:active:not(:disabled)~.telia-toggle__track .telia-toggle__thumb--on{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(0.9rem * var(--voca-rem-multiplier));transform:translateX(calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1) - calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) + calc(0.4rem * var(--voca-rem-multiplier))));transition:all 200ms ease;width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle button:active:not(:disabled)~.telia-toggle__track .telia-toggle__thumb--off{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(calc(2rem * var(--voca-rem-multiplier)) / 2);transform:translateX(0);transition:all 200ms ease;width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle button:disabled~.telia-toggle__track--on:before,.telia-toggle button:disabled~.telia-toggle__track--off:before{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #c8c8cd}.telia-toggle button:disabled~.telia-toggle__track--on:before{background-color:#c8c8cd}.telia-toggle button:disabled~.telia-toggle__label{color:#606064}.telia-toggle button:disabled~.telia-toggle__track .telia-toggle__thumb--on{background-color:#b0b0b5;border:calc(0.1rem * var(--voca-rem-multiplier)) solid #ffffff;box-shadow:none;padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(1rem * var(--voca-rem-multiplier));}.telia-toggle button:disabled~.telia-toggle__track .telia-toggle__thumb--off{background-color:#c8c8cd;border:calc(0.1rem * var(--voca-rem-multiplier)) solid #ffffff;box-shadow:none;padding:calc(1.1rem * var(--voca-rem-multiplier));}.telia-toggle__track{z-index:1;align-items:center;border:calc(1.2rem * var(--voca-rem-multiplier)) solid transparent;box-sizing:content-box;display:flex;height:calc(2rem * var(--voca-rem-multiplier));position:relative;right:0;transition:all 200ms ease;width:calc(calc(2rem * var(--voca-rem-multiplier)) * 2.1)}.telia-toggle__track::before{border:calc(0.1rem * var(--voca-rem-multiplier)) solid #29003e;border-radius:calc(99.9rem * var(--voca-rem-multiplier));z-index:auto;content:\\\" \\\";display:block;height:100%;position:absolute;width:100%}.telia-toggle__thumb{border-radius:calc(99.9rem * var(--voca-rem-multiplier));z-index:1;background-clip:padding-box;box-sizing:border-box;height:calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2);padding:calc(0.7rem * var(--voca-rem-multiplier)) calc(1.1rem * var(--voca-rem-multiplier));transform:translateX(-0.2rem);transition:all 200ms ease;width:calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2)}.telia-toggle__thumb--on{background-color:#29003e}.telia-toggle__thumb--on.telia-toggle__thumb--dragging{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle__thumb--off{background-color:#8c8c90;padding:calc(calc(calc(2rem * var(--voca-rem-multiplier)) * 1.2) / 2)}.telia-toggle__thumb--off.telia-toggle__thumb--dragging{background-color:#29003e;box-shadow:0 0 0 calc(0.8rem * var(--voca-rem-multiplier)) rgba(222, 153, 255, 0.75)}.telia-toggle__thumb--dragging{height:calc(2rem * var(--voca-rem-multiplier));padding:calc(0.6rem * var(--voca-rem-multiplier)) calc(0.9rem * var(--voca-rem-multiplier));width:calc(2rem * var(--voca-rem-multiplier))}.telia-toggle__thumb-line{background-color:#ffffff;border-radius:calc(0.2rem * var(--voca-rem-multiplier));height:100%;width:100%}.telia-toggle--label-none{display:inline-flex}.telia-toggle--label-none .telia-toggle__track{border-left:0;border-right:0}.telia-toggle--label-before .telia-toggle__track{border-right:0}.telia-toggle--label-after .telia-toggle__track{border-left:0}.telia-toggle__label{font-family:\\\"TeliaSans\\\", Helvetica, Arial, \\\"Lucida Grande\\\", sans-serif;font-weight:normal;font-size:calc(1.6rem * var(--voca-rem-multiplier));line-height:1.5;flex:1 1 0;padding:calc(1.2rem * var(--voca-rem-multiplier)) 0}.telia-toggle__label--none{flex:none;padding:0}\";\n\nconst TeliaToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {\n  constructor() {\n    super();\n    this.__registerHost();\n    this.__attachShadow();\n    this.vocaChange = createEvent(this, \"vocaChange\", 7);\n    /** When set, the toggle button is disabled and the change event won't be emitted */\n    this.disabled = false;\n    /** The position of the label. When set to neither after nor before, the label will be hidden but still set as aria-label for the button element */\n    this.labelPosition = 'before';\n    /** Tracking id is used to identify and count Component usage */\n    this.dataTrackingId = 'telia-toggle';\n    this.dragged = false;\n    this.dragging = false;\n    this.dragStartX = 0;\n    this.dragX = 0;\n    this.eventListeners = {\n      mousemove: this.onDrag.bind(this),\n      touchmove: this.onDrag.bind(this),\n      mouseup: this.endDragEmitChange.bind(this),\n      touchend: this.endDragEmitChange.bind(this),\n    };\n    this.emitChange = event => {\n      if (this.disabled)\n        return;\n      this.internalSelected = !this.internalSelected;\n      this.vocaChange.emit({\n        originalEvent: event,\n        value: this.internalSelected,\n      });\n    };\n  }\n  setInternalSelected(newValue) {\n    this.internalSelected = newValue;\n  }\n  componentWillLoad() {\n    this.internalSelected = this.selected;\n    this.remSize = 10;\n    this.trackHeight = 2 * this.remSize;\n    this.thumbMaxDragRange = this.trackHeight * 1.1;\n    this.thumbPressedLineHeight = Math.round(0.83 * this.remSize);\n    this.thumbLineWidth = 0.2 * this.remSize;\n  }\n  addEventListeners() {\n    Object.entries(this.eventListeners).forEach(([eventName, listener]) => {\n      document.addEventListener(eventName, listener);\n    });\n  }\n  removeEventListeners() {\n    Object.entries(this.eventListeners).forEach(([eventName, listener]) => {\n      document.removeEventListener(eventName, listener);\n    });\n  }\n  initDrag(event) {\n    this.stopPrevent(event);\n    if (!this.disabled) {\n      this.addEventListeners();\n      this.dragging = true;\n      this.dragStartX = this.getClientX(event);\n      this.dragX = this.getClientX(event);\n    }\n  }\n  endDrag(event) {\n    event && this.stopPrevent(event);\n    this.removeEventListeners();\n    this.dragged = false;\n    this.dragging = false;\n    this.dragStartX = 0;\n    this.dragX = 0;\n  }\n  endDragEmitChange(event) {\n    if (!this.dragged || this.isDraggedHalfway()) {\n      this.emitChange(event);\n    }\n    this.endDrag(event);\n  }\n  onDrag(event) {\n    const draggedRange = Math.abs(Math.round(this.dragX - this.dragStartX));\n    this.dragged = draggedRange > 0;\n    this.dragX = this.getClientX(event);\n  }\n  getClientX(event) {\n    var _a, _b, _c;\n    return (_a = event.clientX) !== null && _a !== void 0 ? _a : (_c = (_b = event.touches) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.clientX;\n  }\n  toggleOnEnter(event) {\n    this.stopPrevent(event);\n    if (event.key === 'Enter' || event.key === ' ') {\n      this.emitChange(event);\n    }\n  }\n  onLabelClick(event) {\n    this.stopPrevent(event);\n    if (event.type === 'click') {\n      this.emitChange(event);\n    }\n  }\n  stopPrevent(event) {\n    event.cancelable && event.preventDefault();\n    event.stopPropagation();\n  }\n  getThumbOffset() {\n    const diff = Math.round(this.dragX - this.dragStartX);\n    const stateOffset = this.internalSelected ? this.thumbMaxDragRange : 0;\n    const offset = diff + stateOffset;\n    if (offset > this.thumbMaxDragRange) {\n      return this.thumbMaxDragRange;\n    }\n    else if (offset < 0) {\n      return 0;\n    }\n    else {\n      return offset;\n    }\n  }\n  isDraggedHalfway() {\n    return this.internalSelected\n      ? this.getThumbOffset() < this.thumbMaxDragRange / 2\n      : this.getThumbOffset() > this.thumbMaxDragRange / 2;\n  }\n  getValueByState(onValue, offValue) {\n    if (this.internalSelected) {\n      return this.isDraggedHalfway() ? offValue : onValue;\n    }\n    else {\n      return this.isDraggedHalfway() ? onValue : offValue;\n    }\n  }\n  calculateThumbPadding() {\n    const halfDragRange = this.thumbMaxDragRange / 2;\n    const halfwayDraggedPercentage = Math.abs((this.getThumbOffset() - halfDragRange) / halfDragRange);\n    const topBottomPadding = `${(this.trackHeight -\n      this.thumbPressedLineHeight * halfwayDraggedPercentage) /\n      2}px`;\n    const onPadding = `${topBottomPadding} ${(this.trackHeight - this.thumbLineWidth) / 2}px`;\n    const offPadding = `${this.trackHeight / 2}px`;\n    return this.getValueByState(onPadding, offPadding);\n  }\n  getThumbStyle() {\n    const cursor = this.dragged ? 'grabbing' : 'inherit';\n    const padding = this.calculateThumbPadding();\n    const transform = `translateX(${this.getThumbOffset()}px)`;\n    const transition = `all 200ms ease${this.dragged ? ', transform 0ms, padding 0ms' : ''}`;\n    return this.dragging ? { cursor, padding, transform, transition } : {};\n  }\n  getThumbClass() {\n    const thumbBaseClass = 'telia-toggle__thumb';\n    const stateClass = this.getValueByState(`${thumbBaseClass}--on`, `${thumbBaseClass}--off`);\n    const draggingClass = this.dragging ? ` ${thumbBaseClass}--dragging` : '';\n    return `${thumbBaseClass} ${stateClass}${draggingClass}`;\n  }\n  getTrackClass() {\n    const trackBaseClass = 'telia-toggle__track';\n    const stateClass = this.getValueByState(`${trackBaseClass}--on`, `${trackBaseClass}--off`);\n    return `${trackBaseClass} ${stateClass}`;\n  }\n  renderLabel() {\n    const labelPositionClass = this.labelPosition\n      ? ` telia-toggle__label--${this.labelPosition}`\n      : '';\n    return (this.label && (h(\"span\", { class: `telia-toggle__label${labelPositionClass}`, onMouseUp: e => this.endDrag(e), onTouchEnd: e => this.endDragEmitChange(e), onClick: e => this.onLabelClick(e) }, this.labelPosition !== 'none' && this.label)));\n  }\n  render() {\n    const componentClass = 'telia-toggle';\n    const wrapperClasses = {\n      [`${componentClass}`]: true,\n      [`${componentClass}--label-${this.labelPosition}`]: true,\n      [`${componentClass}--disabled`]: this.disabled,\n    };\n    return (h(\"div\", { class: wrapperClasses }, h(\"button\", { \"aria-pressed\": this.internalSelected ? 'true' : 'false', disabled: this.disabled, \"aria-labelledby\": this.labelledby, onKeyUp: e => this.toggleOnEnter(e) }, h(\"telia-visually-hidden\", null, this.label)), (this.labelPosition === 'before' || this.labelPosition === 'none') &&\n      this.renderLabel(), h(\"div\", { class: this.getTrackClass(), onMouseUp: e => this.endDrag(e), onTouchEnd: e => this.endDragEmitChange(e), onClick: e => this.onLabelClick(e) }, h(\"div\", { style: this.getThumbStyle(), class: this.getThumbClass(), onMouseDown: e => this.initDrag(e), onTouchStart: e => this.initDrag(e), onMouseUp: e => this.endDragEmitChange(e), onTouchEnd: e => this.endDragEmitChange(e), onClick: e => this.stopPrevent(e) }, h(\"div\", { class: \"telia-toggle__thumb-line\" })), h(\"telia-vst\", { dataTrackingId: this.dataTrackingId })), this.labelPosition === 'after' && this.renderLabel()));\n  }\n  static get watchers() { return {\n    \"selected\": [\"setInternalSelected\"]\n  }; }\n  static get style() { return teliaToggleCss; }\n}, [1, \"telia-toggle\", {\n    \"dataTestid\": [1, \"data-testid\"],\n    \"selected\": [4],\n    \"disabled\": [4],\n    \"label\": [1],\n    \"labelPosition\": [1, \"label-position\"],\n    \"labelledby\": [1],\n    \"dragged\": [32],\n    \"dragging\": [32],\n    \"dragStartX\": [32],\n    \"dragX\": [32],\n    \"internalSelected\": [32],\n    \"remSize\": [32],\n    \"trackHeight\": [32],\n    \"thumbMaxDragRange\": [32],\n    \"thumbPressedLineHeight\": [32],\n    \"thumbLineWidth\": [32],\n    \"eventListeners\": [32]\n  }]);\nfunction defineCustomElement$1() {\n  if (typeof customElements === \"undefined\") {\n    return;\n  }\n  const components = [\"telia-toggle\", \"telia-visually-hidden\", \"telia-vst\"];\n  components.forEach(tagName => { switch (tagName) {\n    case \"telia-toggle\":\n      if (!customElements.get(tagName)) {\n        customElements.define(tagName, TeliaToggle$1);\n      }\n      break;\n    case \"telia-visually-hidden\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$3();\n      }\n      break;\n    case \"telia-vst\":\n      if (!customElements.get(tagName)) {\n        defineCustomElement$2();\n      }\n      break;\n  } });\n}\ndefineCustomElement$1();\n\nconst TeliaToggle = TeliaToggle$1;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TeliaToggle, defineCustomElement };\n"],"names":["teliaToggleCss","TeliaToggle$1","proxyCustomElement","HTMLElement","createEvent","event","newValue","eventName","listener","draggedRange","_a","_b","_c","diff","stateOffset","offset","onValue","offValue","halfDragRange","halfwayDraggedPercentage","onPadding","offPadding","cursor","padding","transform","transition","thumbBaseClass","stateClass","draggingClass","trackBaseClass","labelPositionClass","h","e","componentClass","wrapperClasses","defineCustomElement$1","tagName","defineCustomElement$3","defineCustomElement$2"],"mappings":"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"}

package/voca/components/telia-visually-hidden.js

@@ -1,4 +1,4 @@
-import "../../chunks/telia-visually-hidden2-1ce59952.js";
+import "../../chunks/telia-visually-hidden2-2107d70a.js";
 import "../../chunks/index-f01c7229.js";
-import "../../chunks/telia-vst2-5b44b983.js";
+import "../../chunks/telia-vst2-db6a58b9.js";
 //# sourceMappingURL=telia-visually-hidden.js.map

package/voca/foundations/index.js

@@ -1,5 +1,5 @@
-import { t as d, s as a, a as o, m as r, l as i, b as n, d as t, c as e, g, f as u } from "../../chunks/variables-06e4d3d9.js";
-import { b as k, d as x, c as S, f as v, g as L, l as M, m as H, a as $, s as z, t as B } from "../../chunks/variables-06e4d3d9.js";
+import { t as d, s as a, a as o, m as r, l as i, b as n, d as t, c as e, g, f as u } from "../../chunks/variables-825dd261.js";
+import { b as k, d as x, c as S, f as v, g as L, l as M, m as H, a as $, s as z, t as B } from "../../chunks/variables-825dd261.js";
 const y = () => {
   const p = "voca-foundations-style-tag";
   if (!!document.getElementById(p))