{"version":3,"file":"pdp-spa-control-section.min.js","mappings":"ocAuBAA,iBAAiB,iCAhBjB,SAAuCC,GACrC,MAAMC,EAAM,IAAIC,IAAIC,SAASC,MAE7B,GAAIH,EAAII,aAAaC,IAAI,aAAeN,EAAMO,OAAOC,oBAAoBC,WAAY,CAInF,GAAIT,EAAMO,OAAOG,mBAAqBV,EAAMO,OAAOI,KAAOX,EAAMO,OAAOG,kBACrE,OAGFT,EAAII,aAAaO,IAAI,UAAWZ,EAAMO,OAAOC,oBAAoBC,YACjEI,QAAQC,aAAa,UAAMC,EAAWd,EAAIG,KAC5C,CACF,KCpBA,IAAAY,EAAA,GAGA,SAAAC,EAAAC,GAEA,IAAAC,EAAAH,EAAAE,GACA,QAAAH,IAAAI,EACA,OAAAA,EAAAC,QAGA,IAAAC,EAAAL,EAAAE,GAAA,CAGAE,QAAA,IAOA,OAHAE,EAAAJ,GAAAG,EAAAA,EAAAD,QAAAH,GAGAI,EAAAD,OACA,6ECaArB,iBAAiB,iCAjCjB,SAAuCC,GACrC,IAAKA,EAAMO,OAAOG,kBAChB,OAGF,MAAMa,EAASC,SAASC,iBACtB,iDAAiDzB,EAAMO,OAAOI,YAEhE,IAAK,MAAMe,KAASH,EAGlBG,EAAMC,OAASC,SAASF,EAAMG,QAAQC,UAAW,MAAQ9B,EAAMO,OAAOC,oBAIxE,MAAMuB,EAAYP,SAASQ,cACzB,kEAA0ChC,EAAMO,OAAOG,uBACzD,IAAKqB,EACH,OAIF,MAAME,EAAcT,SAASQ,cAC3B,uCAEIE,ECsBD,SAAgBC,EAAwBC,EAAsBC,GAKnE,IAAK,MAAMC,KAAUD,EAAS,CAC5B,MAAME,EAAeJ,EAAOH,cAC1B,4BAA4BI,MAAiBE,EAAOE,WAClDD,IACFA,EAAaV,QAAQY,SAAWH,EAAOI,gBAE3C,CAIA,MAAMC,EAAmB,GACnBC,EAAgBT,EAAOV,iBAAiB,iBAC9C,IAAK,MAAMc,KAAgBK,EAIzBD,EAFiBf,SAASW,EAAaV,QAAQgB,SAAU,IAChC,GACTN,EAAaV,QAAQY,SAGvC,MAAMK,EAAQH,EAAOI,KAAK,OAC1B,OAAOZ,EAAOH,cAA8B,+BAA+Bc,MAC7E,CDhD0BE,CAAoBjB,EAAW/B,EAAMO,OAAOuC,MAClE9C,EAAMO,OAAO0C,eACXf,IACFH,EAAUF,QAAQqB,kBAAoBhB,EAAgBL,QAAQlB,GAC9DsB,EAAYJ,QAAQsB,OAASC,KAAKC,MAAM5C,WAE5C","sources":["webpack://lange/./sections/pdp-spa-control/history-control.ts","webpack://lange/webpack/bootstrap","webpack://lange/./sections/pdp-spa-control/selected-variant-control.ts","webpack://lange/./lib/bundle-variant.ts"],"sourcesContent":["/**\n * Updates the variant query parameter on the product detail page in response to users selecting\n * different variant options.\n *\n * This listener does not touch the DOM so it can handle events before DOMContentLoaded, so there is\n * no need to wait to register it until after DOMContentLoaded.\n */\nfunction onProductVariantOptionChanged(event: WindowEventMap['product-variant-option-changed']) {\n  const url = new URL(location.href);\n\n  if (url.searchParams.get('variant') !== event.detail.selected_variant_id.toString()) {\n    // We must check if the event is emitted from a bundle product detail page by confirming if the\n    // bundle_product_id property is defined. If so, we confirm the variant change event was emitted\n    // for the primary tool in the bundle before updating the query parameter.\n    if (event.detail.bundle_product_id && event.detail.id !== event.detail.bundle_product_id) {\n      return;\n    }\n\n    url.searchParams.set('variant', event.detail.selected_variant_id.toString());\n    history.replaceState(null, undefined, url.href);\n  }\n}\n\naddEventListener('product-variant-option-changed', onProductVariantOptionChanged);\n","// The module cache\nlet __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tlet cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tlet module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","import { select as selectBundleVariant } from '../../lib/bundle-variant.js';\n\nfunction onProductVariantOptionChanged(event: WindowEventMap['product-variant-option-changed']) {\n  if (!event.detail.bundle_product_id) {\n    return;\n  }\n\n  const thumbs = document.querySelectorAll<HTMLElement>(\n    `.bundle-items .bundle-images[data-product-id=\"${event.detail.id}\"] img`);\n\n  for (const thumb of thumbs) {\n    // Only the thumb for the newly selected variant stays on screen. Every other one gets hidden,\n    // including the one that was showing a moment ago.\n    thumb.hidden = parseInt(thumb.dataset.variantId, 10) !== event.detail.selected_variant_id;\n  }\n\n  type ProductElement = HTMLElementTagNameMap['product-element'];\n  const productEl = document.querySelector<ProductElement>('#product-detail-section ' +\n    `add-to-cart > product-element[data-id=\"${event.detail.bundle_product_id}\"]`);\n  if (!productEl) {\n    return;\n  }\n\n  type AddToCartElement = HTMLElementTagNameMap['add-to-cart'];\n  const addToCartEl = document.querySelector<AddToCartElement>(\n    '#product-detail-section add-to-cart');\n\n  const selectedVariant = selectBundleVariant(productEl, event.detail.title,\n    event.detail.option_groups);\n  if (selectedVariant) {\n    productEl.dataset.selectedVariantId = selectedVariant.dataset.id;\n    addToCartEl.dataset.update = Date.now().toString();\n  }\n}\n\naddEventListener('product-variant-option-changed', onProductVariantOptionChanged);\n","type ProductElement = HTMLElementTagNameMap['product-element'];\ntype BundleOption = HTMLElementTagNameMap['bundle-option'];\ntype VariantElement = HTMLElementTagNameMap['variant-element'];\n\n/**\n * One of the inner product's option groups, cut down to the two fields we read. The option groups\n * the product variant option changed event carries already fit this shape, so a listener can pass\n * them straight in.\n */\ninterface SelectOption {\n  /**\n   * The name of the option\n   *\n   * @example \"Size\"\n   * @example \"Color\"\n   */\n  name: string;\n\n  /**\n   * The value the shopper chose for the option\n   *\n   * @example \"Black\"\n   */\n  selected_option: string;\n}\n\n/**\n * Records the chosen options of one product inside a bundle and returns the bundle variant that all\n * of the bundle's current choices add up to, or nothing when the bundle has no variant for that\n * combination.\n *\n * A bundle made with the Shopify Bundles app is its own product, and each of its variants stands\n * for one combination of the options of the products inside it. The page shows a picker for each\n * product inside the bundle rather than one for the bundle, so when a shopper changes one of those\n * pickers we call this to work out which bundle variant the pickers now add up to.\n *\n * Choices carry over from one call to the next, so the result matches the pickers on screen even\n * after a change that landed on a combination with no bundle variant. Recording the same choice\n * twice changes nothing, so every script reacting to the same picker change can call this and they\n * all get the same answer, whichever runs first.\n *\n * An option of the inner product that the bundle has no bundle option for is left out. Some bundles\n * leave an inner product's option out on purpose, such as the Switch It Up bundles, which come in a\n * bundle per color and so carry no color option.\n *\n * @param bundle The bundle's product element\n * @param productTitle The title of the inner product whose picker changed\n * @param options The inner product's option groups with their chosen values\n */\nexport function select(bundle: ProductElement, productTitle: string, options: SelectOption[]) {\n  // We keep the current choice on the bundle option elements rather than starting from the bundle's\n  // selected variant, so a change that lands on a combination with no bundle variant still counts\n  // when the next change builds on it. Each bundle option element is named by the inner product's\n  // title and the option's name.\n  for (const option of options) {\n    const bundleOption = bundle.querySelector<BundleOption>(\n      `bundle-option[data-name=\"${productTitle} (${option.name})\"]`);\n    if (bundleOption) {\n      bundleOption.dataset.selected = option.selected_option;\n    }\n  }\n\n  // The bundle variant titles join one value per bundle option, in the order of each bundle\n  // option's position, like \"Black / Oval 75mm\"\n  const values: string[] = [];\n  const bundleOptions = bundle.querySelectorAll('bundle-option');\n  for (const bundleOption of bundleOptions) {\n    // Positions count from 1, and the array counts from 0\n    const position = parseInt(bundleOption.dataset.position, 10);\n    const index = position - 1;\n    values[index] = bundleOption.dataset.selected;\n  }\n\n  const title = values.join(' / ');\n  return bundle.querySelector<VariantElement>(`variant-element[data-title=\"${title}\"]`);\n}\n"],"names":["addEventListener","event","url","URL","location","href","searchParams","get","detail","selected_variant_id","toString","bundle_product_id","id","set","history","replaceState","undefined","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","exports","module","__webpack_modules__","thumbs","document","querySelectorAll","thumb","hidden","parseInt","dataset","variantId","productEl","querySelector","addToCartEl","selectedVariant","bundle","productTitle","options","option","bundleOption","name","selected","selected_option","values","bundleOptions","position","title","join","bundle_variant_select","option_groups","selectedVariantId","update","Date","now"],"sourceRoot":""}