{"version":3,"names":["Toggle","this","isFirstRenderAsClone","changeDisplayStatus","display","expanded","isLKClonerChildChanged","state","pastState","opened","isExpanded","handleToggleButton","event","preventDefault","refAccordionDiv","removeAttribute","componentWillLoad","displayOnMobile","undefined","hideButtonOnDesktop","compact","small","componentDidLoad","setAccordionHeight","setAttribute","componentDidUpdate","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\n  @Method()\n  async changeDisplayStatus(display: boolean) {\n    this.expanded = display;\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\n    this.expanded = !this.expanded;\n    if (this.expanded == true) {\n      this.refAccordionDiv.removeAttribute(\"hidden\");\n    }\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    }\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      this.refAccordionDiv.removeAttribute(\"hidden\");\n    } else {\n      this.setAccordionHeight(0);\n      this.refAccordionDiv.setAttribute(\"hidden\", \"\");\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        <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) {\n              this.refAccordionDiv.style.maxHeight = \"none\";\n              this.refAccordionDiv.removeAttribute(\"hidden\");\n            } else {\n              this.refAccordionDiv.setAttribute(\"hidden\", \"\");\n            }\n          }}\n          hidden\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\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\") {\n          this.refAccordionDiv.style.maxHeight = `${height}px`;\n        } \n        else {\n           this.refAccordionDiv.style.maxHeight = height\n        }\n      });\n    });\n  }\n}\n"],"mappings":"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","ignoreList":[]}