{"version":3,"names":["Toggle","this","isFirstRenderAsClone","delayedExpandedValue","changeDisplayStatus","display","expanded","isLKClonerChildChanged","state","pastState","opened","isExpanded","handleToggleButton","event","preventDefault","componentWillLoad","displayOnMobile","undefined","hideButtonOnDesktop","compact","small","componentDidLoad","setAccordionHeight","componentDidUpdate","refAccordionDiv","scrollHeight","showHideDelay","delay","value","Promise","resolve","setTimeout","render","hostClass","color","hasCounter","buttonClass","accordionClass","contentClass","h","Host","key","class","style","background","backgroundColor","type","onClick","transform","focusable","role","xmlns","viewBox","d","fill","stroke","name","ref","el","onTransitionEnd","maxHeight","hidden","contentContainerClasses","height","requestAnimationFrame"],"sources":["src/webcomponents/lk-toggle/lk-toggle.tsx"],"sourcesContent":["import { Component, State, h, Host, Prop, Method, Element, Watch } from '@stencil/core';\n\n@Component({\n  tag: \"lk-toggle\"\n})\nexport class Toggle {\n\n  @Prop() hasCounter: boolean = false;\n  @Prop() displayOnMobile: boolean; // Deprecated\n  @Prop({ mutable: true }) hideButtonOnDesktop: boolean = false;\n  @Prop({ reflect: true }) color: string = \"green\";\n  @Prop({ mutable: true }) compact: boolean = false;\n  @Prop({ reflect: true }) small: boolean = false;\n  @Prop() opened: boolean = false;\n  @Prop() background = null;\n  @Prop() contentContainerClasses = \"\";\n\n  @Prop() isLKClonerChild: boolean = false;\n  @State() expanded: boolean = false;\n\n  @Element() el: HTMLElement;\n\n  refAccordionDiv: HTMLDivElement;\n  isFirstRenderAsClone = false\n  delayedExpandedValue = false\n\n  @Method()\n  async changeDisplayStatus(display: boolean) {\n    this.expanded = display;\n    if (this.expanded) this.delayedExpandedValue = true;\n  }\n\n  @Watch('isLKClonerChild')\n  isLKClonerChildChanged(state, pastState) {\n    if (state == true && pastState == false && this.opened) {\n      this.isFirstRenderAsClone = true\n    }\n  }\n\n  @Method()\n  async isExpanded() {\n    return this.expanded;\n  }\n\n  handleToggleButton(event) {\n    event.preventDefault();\n    this.expanded = !this.expanded;\n    if (this.expanded) this.delayedExpandedValue = true;\n  }\n\n  componentWillLoad() {\n    if (this.displayOnMobile !== undefined)\n      this.hideButtonOnDesktop = this.displayOnMobile; // for legacy support\n\n    if (this.hideButtonOnDesktop)\n      this.expanded = false;\n\n    if (this.opened) {\n      this.expanded = true;\n      this.delayedExpandedValue = true;\n    }\n\n    if (this.compact == false) {\n      this.compact = this.small;\n    }\n  }\n\n  componentDidLoad() {\n    if (this.expanded) {\n      this.setAccordionHeight(\"none\");\n    } else {\n      this.setAccordionHeight(0);\n    }\n  }\n\n  componentDidUpdate() {\n    if (this.isFirstRenderAsClone) return this.isFirstRenderAsClone = false\n\n    if (this.expanded) {\n      this.setAccordionHeight(this.refAccordionDiv.scrollHeight);\n    } else {\n      this.setAccordionHeight(0);\n    }\n  }\n\n  showHideDelay(delay: number, value: boolean): Promise<boolean> {\n    return new Promise<boolean>((resolve) => {\n      setTimeout(() => {\n        resolve(value)\n      }, delay)\n    })\n  }\n\n  render() {\n    let hostClass = `toggle toggle--${this.color}\n      ${this.hideButtonOnDesktop\n        ? 'toggle--mobile toggle__no-border' : ''\n      } ${this.compact\n        ? 'toggle--compact' : ''\n      } ${this.hasCounter\n        ? 'toggle--left' : ''}`;\n\n    let buttonClass = `toggle__button toggle-counter-button ${this.hideButtonOnDesktop\n      ? 'toggle__button--mobile' : ''}`;\n\n    let accordionClass = `toggle__accordion ${this.hideButtonOnDesktop\n      ? 'toggle__accordion--mobile' : ''\n      } ${this.hasCounter\n        ? 'lk-toggle-list__border-left' : ''}`;\n\n    let contentClass = `toggle__accordion__content ${this.hideButtonOnDesktop ? 'toggle__accordion__content--mobile' : ''}`\n\n    return (\n      <Host class={hostClass}>\n\n        <button\n          style={this.background ? { backgroundColor: this.background } : null}\n          type=\"button\"\n          class={buttonClass}\n          onClick={event => { this.handleToggleButton(event); }}\n          aria-expanded={`${this.expanded}`}\n        >\n          <span\n            class=\"toggle__button__icon\"\n            aria-hidden=\"true\"\n            style={{\n              transform: this.expanded\n                ? \"rotate(-180deg)\" : \"rotate(0deg)\"\n            }}\n          >\n            <svg aria-hidden=\"true\" focusable=\"false\" role=\"presentation\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 15.299 6.3\">\n              <path d=\"M13.513.747l4.8,6.9-4.8,6.9\" transform=\"translate(15.296 -12.763) rotate(90)\" fill=\"none\" stroke=\"currentColor\"\n                stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" />\n            </svg>\n          </span>\n\n          <span class=\"toggle__button__label\">\n            <slot name=\"title\" />\n          </span>\n        </button>\n\n        <div\n          ref={el => this.refAccordionDiv = el as HTMLDivElement}\n          class={accordionClass}\n          onTransitionEnd={() => {\n            if (this.expanded) this.refAccordionDiv.style.maxHeight = \"none\";\n            else this.delayedExpandedValue = this.expanded\n          }}          \n          hidden={!this.delayedExpandedValue}\n        >\n\n          <div class={contentClass + ` ${this.contentContainerClasses}`} >\n            <slot />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n  setAccordionHeight(height) {\n    if (this.refAccordionDiv.style.maxHeight == \"none\")\n      this.refAccordionDiv.style.maxHeight = this.refAccordionDiv.scrollHeight + \"px\";\n\n    requestAnimationFrame(() => { // Ensure the browser has had a chance to apply the previous style change\n      requestAnimationFrame(() => { // safely apply next style change\n        if (typeof height === \"number\") this.refAccordionDiv.style.maxHeight = `${height}px`\n        else this.refAccordionDiv.style.maxHeight = height\n      })\n    })\n  }\n\n}\n"],"mappings":"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","ignoreList":[]}