{
  "version": 3,
  "sources": ["/cdn/shop/t/3/assets/show-more.js?poc=d0ug"],
  "sourcesContent": ["import { Component } from '@theme/component';\nimport { isMobileBreakpoint } from '@theme/utilities';\n\n/**\n * @typedef {Object} ShowMoreRefs\n * @property {HTMLElement} showMoreButton - The button to toggle visibility of the items\n * @property {HTMLElement[]} showMoreItems - The hidden items to show and hide\n * @property {HTMLElement} showMoreContent - The content container to measure and animate\n */\n\n/**\n * A custom element that manages the showing and hiding excess content items\n *\n * @extends {Component<ShowMoreRefs>}\n */\n\nclass ShowMoreComponent extends Component {\n  requiredRefs = ['showMoreButton', 'showMoreItems', 'showMoreContent'];\n\n  /**\n   * @type {boolean}\n   */\n  #expanded = false;\n\n  /**\n   * @type {boolean}\n   */\n  #disableOnDesktop = false;\n\n  /**\n   * @type {number}\n   */\n  #collapsedHeight = 0;\n\n  /**\n   * @type {'mobile:hidden' | 'hidden'}\n   */\n  #disabledClass = 'hidden';\n\n  /**\n   * @type {'MOBILE' | 'DESKTOP'}\n   */\n  get #currentBreakpoint() {\n    return isMobileBreakpoint() ? 'MOBILE' : 'DESKTOP';\n  }\n\n  /**\n   * @type {Animation | undefined}\n   */\n  #animation;\n\n  /**\n   * @constant {number}\n   */\n  #animationSpeed = 300;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.#updateBreakpointState();\n  }\n\n  /**\n   * Updates the current breakpoint and apprpropriate disabled class\n   */\n  #updateBreakpointState = () => {\n    this.#disableOnDesktop = this.dataset.disableOnDesktop === 'true';\n    this.#disabledClass = this.#disableOnDesktop ? 'mobile:hidden' : 'hidden';\n  };\n\n  /**\n   * Handles expanding the content\n   * @returns {{startHeight: number, endHeight: number}}\n   */\n  #expand = () => {\n    const { showMoreItems, showMoreContent } = this.refs;\n\n    this.#collapsedHeight = showMoreContent.offsetHeight;\n    const startHeight = this.#collapsedHeight;\n\n    showMoreItems?.forEach((item) => item.classList.remove(this.#disabledClass));\n\n    return {\n      startHeight,\n      endHeight: showMoreContent.scrollHeight,\n    };\n  };\n\n  /**\n   * Handles collapsing the content\n   * @returns {{startHeight: number, endHeight: number}}\n   */\n  #collapse = () => {\n    const { showMoreContent } = this.refs;\n    const startHeight = showMoreContent.offsetHeight;\n    const endHeight = this.#collapsedHeight;\n\n    return { startHeight, endHeight };\n  };\n\n  /**\n   * Initializes a height transition\n   * @param {number} startHeight\n   * @param {number} endHeight\n   */\n  #animateHeight = (startHeight, endHeight) => {\n    const { showMoreContent } = this.refs;\n\n    showMoreContent.style.overflow = 'hidden';\n    this.#animation?.cancel();\n\n    this.#animation = showMoreContent.animate(\n      {\n        height: [`${startHeight}px`, `${endHeight}px`],\n      },\n      {\n        duration: this.#animationSpeed,\n        easing: 'ease-in-out',\n      }\n    );\n\n    this.#animation.onfinish = () => this.#onAnimationFinish();\n  };\n\n  /**\n   * Handles the animation finish event.\n   */\n  #onAnimationFinish() {\n    const { showMoreContent, showMoreItems } = this.refs;\n\n    if (this.#expanded) {\n      showMoreItems.forEach((item) => item.classList.add(this.#disabledClass));\n    }\n\n    showMoreContent.style.removeProperty('height');\n    showMoreContent.style.overflow = '';\n    this.#expanded = !this.#expanded;\n  }\n\n  /**\n   * Toggles the expansion state of the content.\n   *\n   * @param {Event} event - The click event\n   */\n  toggle = (event) => {\n    event.preventDefault();\n\n    this.#updateBreakpointState();\n\n    if (this.#currentBreakpoint === 'DESKTOP' && this.#disableOnDesktop) return;\n\n    const { startHeight, endHeight } = !this.#expanded ? this.#expand() : this.#collapse();\n\n    this.dataset.expanded = this.#expanded ? 'false' : 'true';\n    this.refs.showMoreButton.setAttribute('aria-expanded', this.dataset.expanded);\n\n    this.#animateHeight(startHeight, endHeight);\n  };\n}\n\nif (!customElements.get('show-more-component')) {\n  customElements.define('show-more-component', ShowMoreComponent);\n}\n"],
  "mappings": "AAAA,OAAS,cAAiB,mBAC1B,OAAS,uBAA0B,mBAenC,MAAM,0BAA0B,SAAU,CACxC,aAAe,CAAC,iBAAkB,gBAAiB,iBAAiB,EAKpE,UAAY,GAKZ,kBAAoB,GAKpB,iBAAmB,EAKnB,eAAiB,SAKjB,GAAI,oBAAqB,CACvB,OAAO,mBAAmB,EAAI,SAAW,SAC3C,CAKA,WAKA,gBAAkB,IAElB,mBAAoB,CAClB,MAAM,kBAAkB,EACxB,KAAK,uBAAuB,CAC9B,CAKA,uBAAyB,IAAM,CAC7B,KAAK,kBAAoB,KAAK,QAAQ,mBAAqB,OAC3D,KAAK,eAAiB,KAAK,kBAAoB,gBAAkB,QACnE,EAMA,QAAU,IAAM,CACd,KAAM,CAAE,cAAe,eAAgB,EAAI,KAAK,KAEhD,KAAK,iBAAmB,gBAAgB,aACxC,MAAM,YAAc,KAAK,iBAEzB,sBAAe,QAAS,MAAS,KAAK,UAAU,OAAO,KAAK,cAAc,CAAC,EAEpE,CACL,YACA,UAAW,gBAAgB,YAC7B,CACF,EAMA,UAAY,IAAM,CAChB,KAAM,CAAE,eAAgB,EAAI,KAAK,KAC3B,YAAc,gBAAgB,aAC9B,UAAY,KAAK,iBAEvB,MAAO,CAAE,YAAa,SAAU,CAClC,EAOA,eAAiB,CAAC,YAAa,YAAc,CAC3C,KAAM,CAAE,eAAgB,EAAI,KAAK,KAEjC,gBAAgB,MAAM,SAAW,SACjC,KAAK,YAAY,OAAO,EAExB,KAAK,WAAa,gBAAgB,QAChC,CACE,OAAQ,CAAC,GAAG,WAAW,KAAM,GAAG,SAAS,IAAI,CAC/C,EACA,CACE,SAAU,KAAK,gBACf,OAAQ,aACV,CACF,EAEA,KAAK,WAAW,SAAW,IAAM,KAAK,mBAAmB,CAC3D,EAKA,oBAAqB,CACnB,KAAM,CAAE,gBAAiB,aAAc,EAAI,KAAK,KAE5C,KAAK,WACP,cAAc,QAAS,MAAS,KAAK,UAAU,IAAI,KAAK,cAAc,CAAC,EAGzE,gBAAgB,MAAM,eAAe,QAAQ,EAC7C,gBAAgB,MAAM,SAAW,GACjC,KAAK,UAAY,CAAC,KAAK,SACzB,CAOA,OAAU,OAAU,CAKlB,GAJA,MAAM,eAAe,EAErB,KAAK,uBAAuB,EAExB,KAAK,qBAAuB,WAAa,KAAK,kBAAmB,OAErE,KAAM,CAAE,YAAa,SAAU,EAAK,KAAK,UAA6B,KAAK,UAAU,EAAhC,KAAK,QAAQ,EAElE,KAAK,QAAQ,SAAW,KAAK,UAAY,QAAU,OACnD,KAAK,KAAK,eAAe,aAAa,gBAAiB,KAAK,QAAQ,QAAQ,EAE5E,KAAK,eAAe,YAAa,SAAS,CAC5C,CACF,CAEK,eAAe,IAAI,qBAAqB,GAC3C,eAAe,OAAO,sBAAuB,iBAAiB",
  "names": []
}
