https://savilerowco.com/cdn/shop/t/377/assets/component-ProductCus…?v=174322542266881520591790073405

1// !!!! - DO NOT MODIFY - !!!!
2// THIS FILE IS DEPLOYED AUTOMATICALLY BY MATTv2.
3//
4//  Deployment info:
5//    Updated at:     2024-10-24T12:27:11+00:00
6//    Cause:          Manual deployment.
7//    Deployment ID:  184610
8//    Project:        557
9//    Environment:    5377 - master
10//    MD5:            76a1fbf4ec9c55b403b97b08490aa817
11//    Signature:      eyJpdiI6IjBjdGtZRW9weGgwb0RCc1wvbUtlTGNRPT0iLCJ2YWx1ZSI6IlFuZlRQMzVRWUU3U2JOTFNpTUROSlpXN2JwNVdoZ2ZNQ3lqRjVGczBFbkJVVUhWUGVQOVk1UmFSNmNRYVhBQzNNelk3ZmpYb1dFeGVpcmRsSTloRDlhU2tcL3N5TlMxRExnNTZ5ZXhhbm55SkJ6ZEFqWU9JcTJcL1VnTElWSXk2eE1yYU1wOWtzRnJcL2QxNXd3QzBteE5lZjNSTzdxd1pkWWtrZll5WXZMTE1SdkRvTmlhdVZHOVVcL0JXNVVZZjdZNTl6UGZqXC94T1JUNGZqTGhORDRJZk53MUNoaUpmdzAzM0VwUitSQ1hkNXVKVFwvaEFJRnZwNW1BeDJidHZQNkpLV1hFOVhQdGF4WTZ1K1JsaUo1anc1bEZmV2dhZmExVEsxUGRtYVFIak9XVEZTdFVOWmxBVTllTk4wZjN4VjNhMnFQYmVERTcxRG90UlRhUW1oYWNJMzBmUG5wY2dIOXV0WDRkNjFadm1ydUVQc0dRUTdOOGJWUFlDODV1dVVaK1dSdkh6S3lBNitcL3lITytsUjNPWnA1ZmFJY0VEcFMydzN0OUd2N1Q0bGU0MEJacGVjTXFMSlwvMVhBZk5QN2lmVG1IYiIsIm1hYyI6IjJkNjE0MWNjNDc1YTMxZWEwMDEzMjRlYjc5NTgyMTA4NTkwYThlYTRiMWIxNzY5YTMwODQ2Y2MxZDZlYTViYzAifQ==
12var m=Object.defineProperty;var c=(d,t)=>m(d,"name",{value:t,configurable:!0});import"./component-ProductForm.min.js";import"./component-ProductCustomiser.min.js";import"./component-ProductBundleItem.min.js";import{ThemeComponent as u}from"./theme.min.js";import"./component-QuantitySelector.min.js";import"./vendor.min.js";import"./component-ProductOptionPicker.min.js";import"./component-ProductButtonOption.min.js";import"./component-ProductDropdownOption.min.js";import"./component-FakeDropdown.min.js";import"./component-ProductStickyBar.min.js";import"./component-DrawerContainer.min.js";import"./component-DrawerHeader.min.js";import"./component-SiteHeader.min.js";import"./component-IconCount.min.js";import"./component-PredictiveSearch.min.js";import"./component-SearchField.min.js";import"./component-IconCircle.min.js";import"./component-BodyOverlay.min.js";import"./component-ProductCustomiserSection.min.js";import"./component-AccordionHeader.min.js";import"./component-AccordionBody.min.js";import"./component-ProductCustomiserSelected.min.js";class i extends u{constructor(){super(...arguments),this.productForm=null,this.productBundleItem=null,this.productSource=null}init(){this.productForm=document.querySelector(".product-form"),this.productBundleItem=this.closest(".product-bundle-item"),this.isBundleItem?this.productSource=this.productBundleItem:this.productSource=this.productForm}updateOptions(){var t,s,r,o,e,n,a;this.isBundleItem&&((t=this.productBundleItem)==null||t.updateQuantitySelectorVisibility()),this.innerHTML="",(s=this.productSource)==null||s.addonProducts.forEach(p=>{const l=this.formatLineProperties(p.line_properties);this.innerHTML+=`
13                <div class="product-customiser-selected__option flex justify-content-between mb-12">
14                    ${p.addon_title} Selection: ${l}
15                    <div class="flex align-items-center">
16                        <button type="button" class='product-customiser-selected__button mr-12' data-ref="editItem" data-variant-id="${p.variant_id}">
17                            <svg class="icon" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
18                                <g clip-path="url(#clip0_1983_118005)">
19                                <path fill-rule="evenodd" clip-rule="evenodd" d="M14.375 2.86621L17.1339 5.62509L14.5048 8.25414C14.5047 8.25427 14.505 8.25401 14.5048 8.25414C14.5047 8.25427 14.5042 8.2548 14.504 8.25493L5.88388 16.8751H3.125L3.125 14.1162L11.7452 5.49597C11.7451 5.49607 11.7453 5.49586 11.7452 5.49597C11.7453 5.49586 11.7458 5.49544 11.7459 5.49534L14.375 2.86621ZM12.1875 6.82148L4.375 14.634L4.375 15.6251H5.36612L13.1786 7.81259L12.1875 6.82148ZM14.0625 6.92871L13.0714 5.93759L14.375 4.63398L15.3661 5.62509L14.0625 6.92871Z" fill="black"/>
20                                </g>
21                                <defs>
22                                <clipPath id="clip0_1983_118005">
23                                <rect width="15" height="15" fill="white" transform="translate(2.5 2.5)"/>
24                                </clipPath>
25                                </defs>
26                            </svg>                        
27                        </button>
28                        <button type="button" class='product-customiser-selected__button' data-ref="removeItem" data-variant-id="${p.variant_id}">

29                            <svg class="icon" viewBox="0 0 21 20" fill="none" role="presentation" xmlns="http://www.w3.org/2000/svg">
30                                <path d="M9.66675 7.50016V15.0002H8.00008V7.50016H9.66675Z" fill="currentColor"/>
31                                <path d="M13.0001 7.50016V15.0002H11.3334V7.50016H13.0001Z" fill="currentColor"/>
32                                <path fill-rule="evenodd" clip-rule="evenodd" d="M6.56611 0.833496H14.434L15.2674 3.3335H18.8334V5.00016H17.1667V19.1668H3.83341V5.00016H2.16675V3.3335H5.73278L6.56611 0.833496ZM7.4896 3.3335H13.5106L13.2328 2.50016H7.76738L7.4896 3.3335ZM5.50008 5.00016V17.5002H15.5001V5.00016H5.50008Z" fill="currentColor"/>
33                            </svg>
34                        </button>
35                    </div>
36                </div>
37            `}),this.setEditAndRemoveItemRefs(),this.setEventListeners(),(r=this.productSource)!=null&&r.addonProducts.length?(e=(o=this.productForm)==null?void 0:o.dynamicCheckout)==null||e.classList.add("visually-hidden"):(a=(n=this.productForm)==null?void 0:n.dynamicCheckout)==null||a.classList.remove("visually-hidden")}formatLineProperties(t){return Object.values(t).join(", ")}setEditAndRemoveItemRefs(){const t=this.querySelectorAll('[data-ref="editItem"]');this.editItem=Array.from(t);const s=this.querySelectorAll('[data-ref="removeItem"]');this.removeItem=Array.from(s)}setEventListeners(){this.editItem.forEach(t=>{t.addEventListener("click",this.handleEditItemClick.bind(this))}),this.removeItem.forEach(t=>{t.addEventListener("click",this.handleRemoveItemClick.bind(this))})}handleEditItemClick(t){t.preventDefault();const r=t.currentTarget.getAttribute("data-variant-id");if(r){const o=this.parentElement;if(o){const e=o.querySelector(`product-customiser[variant-id="${r}"]`);e&&e.drawerContainer&&e.drawerContainer.open()}}}handleRemoveItemClick(t){t.preventDefault();const r=t.currentTarget.getAttribute("data-variant-id");if(r&&this.productSource){const o=this.productSource.addonProducts.findIndex(e=>e.variant_id===Number(r));if(o!==-1){this.productSource.addonProducts.splice(o,1);const e=this.parentElement;if(e){const n=e.querySelector(`product-customiser[variant-id="${r}"]`);n==null||n.reset(),this.updateOptions()}}}}}c(i,"ProductCustomiserSelected");const h={Boolean};i.prototype.$name="ProductCustomiserSelected";i.prototype.$info=JSON.parse('{"name":"ProductCustomiserSelected","meta":{"isLegacy":false,"selector":"product-customiser-selected"},"props":[{"attr":"is-bundle-item","reflectAttr":false,"propertyKey":"isBundleItem","propertyType":"Boolean","propertyTypeName":"Boolean","propertyTsTypeName":"boolean"}],"refs":[{"selector":"[data-ref=\\"editItem\\"]","required":false,"propertyKey":"editItem","propertyType":"Array","propertyTypeName":"Array","propertyTsTypeName":"HTMLButtonElement[]"},{"selector":"[data-ref=\\"removeItem\\"]","required":false,"propertyKey":"removeItem","propertyType":"Array","propertyTypeName":"Array","propertyTsTypeName":"HTMLButtonElement[]"}]}');i.prototype.$info.component=i;for(const d of i.prototype.$info.props)d.propertyType=h[d.propertyType];window.componentService.registerComponent("Product/Customiser/ProductCustomiserSelected.ts",{ProductCustomiserSelected:i},void 0);
38
39;(() => {
40    const style = document.createElement('style');
41    style.innerHTML = "/* component-ProductCustomiserSelected.css */\n.product-customiser-selected{display:block}.product-customiser-selected__option{padding-right:.3125rem}.product-customiser-selected__option:last-of-type{margin-bottom:var(--spacing-24)}\n";
42    document.body.appendChild(style);
43})();