{"version":3,"file":"ProductConfigurator.4a42d39ccd07ac8aba1d.js","mappings":"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","sources":["webpack://secprint-frontend/./src/js/vuejs/stores/_product-store.js","webpack://secprint-frontend/./src/js/vuejs/components/commerce/ProductConfigurator.vue?e324","webpack://secprint-frontend/./src/js/vuejs/components/commerce/AddToBasketModal.vue?d32f","webpack://secprint-frontend/./src/js/vuejs/components/commerce/AddToBasketModal.vue","webpack://secprint-frontend/./src/js/vuejs/components/commerce/AddToBasketModalButton.vue?8f07","webpack://secprint-frontend/./src/js/vuejs/components/commerce/AddToBasketModalButton.vue","webpack://secprint-frontend/./src/js/vuejs/components/commerce/ProductConfigurator.vue","webpack://secprint-frontend/./src/js/vuejs/components/commerce/ProductConfiguratorField.vue","webpack://secprint-frontend/./src/js/vuejs/components/commerce/ProductConfiguratorField.vue?2071","webpack://secprint-frontend/./src/js/vuejs/components/commerce/ProductConfigurator.vue?6ae8","webpack://secprint-frontend/./src/js/vuejs/components/commerce/ProductConfigurator.vue?4a48"],"sourcesContent":["import { defineStore } from 'pinia';\r\n\r\nexport const useProductStore = defineStore({\r\n  id: 'product',\r\n  state: () => ({\r\n    isLoading: false,\r\n    currentProduct: null,\r\n    currentProductData: null,\r\n    groupedExtras: null,\r\n    quantity: 0,\r\n    variants: null,\r\n    selectedAttributes: [],\r\n    selectedExtras: [],\r\n    extras: [],\r\n    basketSummary: {\r\n      subtotal: \"\",\r\n      basketCount: 0,\r\n      tax: \"\",\r\n      total: \"\"\r\n    },\r\n    basketUrl : '/basket/'\r\n  }),\r\n  getters: {\r\n    getCurrrentProduct(state) {\r\n      return state.currentProduct;\r\n    },\r\n    getBasketCount(state) {\r\n      return state.basketSummary.basketCount;\r\n    },\r\n    getBasketSummary(state) {\r\n      return state.basketSummary;\r\n    },\r\n  },\r\n  actions: {\r\n    async fetchBasketCount() {\r\n      try {\r\n        const response = await fetch(process.env.API_URL + '/basket/BasketCount', {\r\n            method: 'GET'\r\n        });\r\n        if (!response.ok) {\r\n            throw new Error('Network response was not ok');\r\n        }\r\n        const data = await response.json();\r\n        this.basketSummary.basketCount = data;\r\n      } \r\n      catch (error) {\r\n          console.error('There was a problem fetching the data:', error);\r\n      }\r\n    },\r\n    updateIsLoading(isLoading) {\r\n      this.isLoading = isLoading;\r\n    },\r\n    updateCurrentProduct(product) {\r\n      this.currentProduct = product;\r\n    },\r\n    updateCurrentProductData(productData) {\r\n      this.currentProductData = productData;\r\n    },\r\n    updateExtras(extras) {\r\n      this.extras = extras;\r\n    },\r\n    updateBasketUrl(url) {\r\n      this.basketUrl = url;\r\n    },\r\n    updateGroupedExtras(groupedExtras) {\r\n      this.groupedExtras = groupedExtras;\r\n    },\r\n    updateQuantity(quantity) {\r\n      this.quantity = quantity;\r\n    },\r\n    updateVariants(variants) {\r\n      this.variants = variants;\r\n    },\r\n    updateSelectedAttributes(attributeAliases) {\r\n      this.selectedAttributes = [ ...attributeAliases ];\r\n    },\r\n    updateSelectedExtras(extraAliases) {\r\n      this.selectedExtras = [ ...extraAliases ];\r\n    },\r\n    updateSelectedAttributeAtIndex(index, value) {\r\n      this.selectedAttributes.splice(index, 1, value);\r\n    },\r\n    updateSelectedExtraAtIndex(index, value) {\r\n      this.selectedExtras.splice(index, 1, value);\r\n    },\r\n  },\r\n});","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../../node_modules/css-loader/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `\n.slide-fade-enter-active {\r\n  transition: all .5s ease;\n}\n.slide-fade-leave-active {\r\n  transition: all .25s cubic-bezier(1.0, 0.5, 0.8, 1.0);\n}\n.slide-fade-enter,\r\n.slide-fade-leave-to {\r\n  transform: translateX(.2rem);\r\n  opacity: 0;\n}\r\n`, \"\",{\"version\":3,\"sources\":[\"webpack://./src/js/vuejs/components/commerce/ProductConfigurator.vue\"],\"names\":[],\"mappings\":\";AAwXA;EACE,wBAAwB;AAC1B;AAEA;EACE,qDAAqD;AACvD;AAEA;;EAEE,4BAA4B;EAC5B,UAAU;AACZ\",\"sourcesContent\":[\"<template>\\r\\n    <div v-if=\\\"currentProduct\\\" class=\\\"product-configurator\\\">\\r\\n        <div class=\\\"product-configurator__options\\\">\\r\\n            <ProductConfiguratorField  \\r\\n                v-for=\\\"(group,index) of attributeGroups\\\"\\r\\n                @change=\\\"setOption($event,index)\\\"\\r\\n                :key=\\\"group.alias\\\"\\r\\n                :more-info=\\\"group.info\\\"\\r\\n                :model=\\\"selectedAttributes[index]\\\"\\r\\n                :name=\\\"group.name\\\"\\r\\n                :attributes=\\\"group.attributes\\\"\\r\\n                :hide-disabled=\\\"index === 0\\\"\\r\\n            />\\r\\n            <ProductConfiguratorField\\r\\n                v-for=\\\"(group, index) of groupedExtras\\\"\\r\\n                @change=\\\"setExtras($event, index)\\\"\\r\\n                :key=\\\"group.alias\\\"\\r\\n                :more-info=\\\"group.info\\\"\\r\\n                :model=\\\"selectedExtras[index]\\\"\\r\\n                :name=\\\"group.name\\\"\\r\\n                :attributes=\\\"group.extras\\\"\\r\\n                :hide-disabled=\\\"index === 0\\\"\\r\\n            />\\r\\n        </div>\\r\\n        <div class=\\\"product-configurator__controls\\\">\\r\\n            <div class=\\\"row justify-content-between align-items-end gap-x-2\\\">\\r\\n                <div class=\\\"col-auto\\\">\\r\\n                    <div class=\\\"product-configurator__summary\\\">\\r\\n                        <transition name=\\\"slide-fade\\\" mode=\\\"out-in\\\">\\r\\n                            <p v-if=\\\"currentPrice\\\" :key=\\\"currentPrice\\\" class=\\\"product-configurator__price\\\">\\r\\n                                {{ formattedCurrency(currentPrice) }}\\r\\n                            </p>\\r\\n                        </transition>\\r\\n                        <span class=\\\"product-configurator__price-tagline\\\">Excluding VAT and Delivery</span>\\r\\n                        <span class=\\\"product-configurator__price-tagline\\\">Free collection available</span>\\r\\n                    </div>\\r\\n                    <div class=\\\"form-field form-field--quantity quantity-field mt-2\\\" v-if=\\\"!hideQuantity\\\">\\r\\n                        <span :class=\\\"['quantity-field__down', {'disabled': (minQuantity || 1) === quantity }]\\\" @click=\\\"quantityDown\\\">-</span>\\r\\n                        <input class=\\\"quantity-field__input\\\" \\r\\n                            v-model=\\\"quantity\\\" \\r\\n                            type=\\\"number\\\"\\r\\n                            value=\\\"1\\\" \\r\\n                            :min=\\\"minQuantity || 1\\\" \\r\\n                            :max=\\\"maxQuantity > 0 ? maxQuantity : undefined\\\"\\r\\n                            @keyup=\\\"resetQuantity()\\\" \\r\\n                            @focusout=\\\"resetQuantity()\\\" \\r\\n                        />\\r\\n                        <span :class=\\\"['quantity-field__up', {'disabled': (maxQuantity > 0 && maxQuantity === quantity)}]\\\" @click=\\\"quantityUp\\\">+</span>\\r\\n                        <p v-if=\\\"quantityText\\\" class=\\\"text-small ml-1 mt-auto\\\">\\r\\n                            ({{ quantityText }})\\r\\n                        </p>\\r\\n                    </div>\\r\\n                </div>\\r\\n                <div class=\\\"col-auto\\\">\\r\\n                    <AddToBasketModalButton :price=\\\"currentPrice\\\" @click=\\\"submitSelection\\\" :disabled=\\\"!canAddToBasket\\\">\\r\\n                        <template #productRecommendations>\\r\\n                            <slot name=\\\"products\\\"></slot>\\r\\n                        </template>\\r\\n                    </AddToBasketModalButton>\\r\\n                </div>\\r\\n            </div>\\r\\n        </div>              \\r\\n    </div>\\r\\n</template>\\r\\n<script>\\r\\nconst GetHttp = () => import(/* webpackChunkName: 'http' */ '../../../_http.js').then(v => v.default);\\r\\nimport { ref, onMounted, computed } from 'vue';\\r\\nimport isEqual from 'lodash/isEqual';\\r\\nimport { useProductStore } from '../../stores/_product-store.js';\\r\\nimport { storeToRefs } from \\\"pinia\\\";\\r\\nimport ProductConfiguratorField from './ProductConfiguratorField.vue'\\r\\nimport AddToBasketModalButton from './AddToBasketModalButton.vue'\\r\\n\\r\\nexport default { \\r\\n    emits: [\\\"change\\\"],\\r\\n    components: {\\r\\n        ProductConfiguratorField,\\r\\n        AddToBasketModalButton\\r\\n    },\\r\\n    props: {\\r\\n        productData: {\\r\\n            type: Object,\\r\\n            required: true\\r\\n        }\\r\\n    },\\r\\n    setup(props) {\\r\\n        const store = useProductStore();\\r\\n        // const extraCosts = ref(0);\\r\\n        const http = ref(null);\\r\\n        const attributeGroups = ref(null);\\r\\n        const hideQuantity = ref(false);\\r\\n        const hidePriceDifference = ref(false);\\r\\n        const minQuantity = ref(0);\\r\\n        const maxQuantity = ref(null);\\r\\n        const basketData = ref({});\\r\\n        const { isLoading, currentProduct, currentProductData, groupedExtras, quantity, variants, selectedAttributes, selectedExtras, extras, basketUrl, basketSummary } = storeToRefs(store);\\r\\n        const basketModalOpen = ref(false);\\r\\n\\r\\n        const pushViewItemEvent = () => {\\r\\n            window.dataLayer = window.dataLayer || [];\\r\\n            dataLayer.push({ ecommerce: null });\\r\\n            dataLayer.push({\\r\\n                'event': 'custom_view_item',\\r\\n                'datalayer_event_name': 'view_item',\\r\\n                'ecommerce': {\\r\\n                    'value': currentPrice.value,\\r\\n                    'currency': 'GBP',\\r\\n                    'items': [\\r\\n                        {\\r\\n                            'item_id': currentProduct.value.sku,\\r\\n                            'item_name': currentProduct.value.name,\\r\\n                            'quantity': quantity.value\\r\\n                        }\\r\\n                    ]\\r\\n                }\\r\\n            });\\r\\n        };\\r\\n\\r\\n        const pushAddBasketEvent = () => {\\r\\n            window.dataLayer = window.dataLayer || [];\\r\\n            dataLayer.push({ ecommerce: null });\\r\\n            dataLayer.push({\\r\\n                'event': 'custom_add_to_cart',\\r\\n                'datalayer_event_name': 'add_to_cart',\\r\\n                'ecommerce': {\\r\\n                    'value': currentPrice.value,\\r\\n                    'currency': 'GBP',\\r\\n                    'items': [\\r\\n                        {\\r\\n                            'item_id': currentProduct.value.sku,\\r\\n                            'item_name': currentProduct.value.name,\\r\\n                            'quantity': quantity.value\\r\\n                        }\\r\\n                    ]\\r\\n                }\\r\\n            });\\r\\n        };\\r\\n\\r\\n        onMounted(async () => {\\r\\n            store.updateCurrentProductData(props.productData);\\r\\n\\r\\n            if (!currentProductData) return;\\r\\n\\r\\n            store.updateVariants(currentProductData.value.variants);\\r\\n            store.updateCurrentProduct(currentProductData.value);\\r\\n            store.updateGroupedExtras(currentProductData.value.extrasGroups);\\r\\n            attributeGroups.value = currentProductData.value.attributeGroups;\\r\\n            hidePriceDifference.value = currentProductData.value.hidePriceDifference;\\r\\n            hideQuantity.value = currentProductData.value.hideQuantity;\\r\\n            minQuantity.value = currentProductData.value.minQuantity;\\r\\n            maxQuantity.value = currentProductData.value.maxQuantity;\\r\\n\\r\\n            http.value = await GetHttp();\\r\\n\\r\\n            if (variants && Array.isArray(variants.value) && variants.value.length > 0) {\\r\\n                let initialVariant = variants.value[0];\\r\\n\\r\\n                if (initialVariant) {\\r\\n                    store.updateCurrentProduct(initialVariant);\\r\\n                    store.updateSelectedAttributes(initialVariant.attributeAliases);\\r\\n                }\\r\\n            }\\r\\n\\r\\n            resetQuantity();\\r\\n\\r\\n            preSelectExtras();\\r\\n        });\\r\\n\\r\\n        const preSelectExtras = () => {\\r\\n            if (groupedExtras.value) {\\r\\n                let initialExtraAliases = [];\\r\\n\\r\\n                for(let group of groupedExtras.value) {\\r\\n                    initialExtraAliases.push(group.extras[0].alias);\\r\\n                }\\r\\n\\r\\n                store.updateSelectedExtras(initialExtraAliases);\\r\\n            }\\r\\n        };\\r\\n\\r\\n        const extraCosts = computed(() => {\\r\\n            let costs = 0;\\r\\n\\r\\n            if(groupedExtras.value && selectedExtras.value) {\\r\\n                for (const group of groupedExtras.value) {\\r\\n                    const groupExtras = group.extras.filter(extra => selectedExtras.value.includes(extra.alias));\\r\\n\\r\\n                    costs += groupExtras.reduce((acc, extra) => acc + (extra.syncedPrice || extra.price), 0);\\r\\n                }\\r\\n            }\\r\\n\\r\\n            return costs;\\r\\n        });\\r\\n\\r\\n        const resetQuantity = () => {\\r\\n            if (quantity.value <= minQuantity.value || 0) quantity.value = minQuantity.value || 1;\\r\\n\\r\\n            if(maxQuantity.value) {\\r\\n                if (maxQuantity.value > 0 && quantity.value > maxQuantity.value) {\\r\\n                    store.updateQuantity(maxQuantity.value);\\r\\n                }\\r\\n            }\\r\\n            \\r\\n            pushViewItemEvent();\\r\\n        };\\r\\n\\r\\n        //Computed\\r\\n        const currentPrice = computed(() => {\\r\\n            return (currentProduct.value.price * quantity.value) + extraCosts.value;\\r\\n        });\\r\\n\\r\\n        const canAddToBasket = computed(() => {\\r\\n            return currentProduct.value && quantity.value > 0;\\r\\n        });\\r\\n\\r\\n        const quantityText = computed(() => {\\r\\n            let textArr = [];\\r\\n\\r\\n            if (minQuantity.value) {\\r\\n                textArr.push(`Min: ${minQuantity.value}`);\\r\\n            }\\r\\n\\r\\n            if (maxQuantity.value) {\\r\\n                textArr.push(`Max: ${maxQuantity.value}`);\\r\\n            }\\r\\n\\r\\n            return textArr.join(', ');\\r\\n        });\\r\\n\\r\\n        const formattedCurrency = computed(() => {\\r\\n            return (number) => {\\r\\n                const locale = 'en-GB';\\r\\n                const currency = 'GBP';\\r\\n                return new Intl.NumberFormat(locale, { style: 'currency', currency: currency }).format(number);\\r\\n            };\\r\\n        });\\r\\n\\r\\n        //Methods\\r\\n        const quantityUp = () => {\\r\\n            store.updateQuantity(parseInt(quantity.value) + 1);\\r\\n            resetQuantity();\\r\\n        };\\r\\n\\r\\n        const quantityDown = () => {\\r\\n            store.updateQuantity(parseInt(quantity.value) - 1);\\r\\n            resetQuantity();\\r\\n        };\\r\\n\\r\\n        const setVariant = (closestVariant) => {\\r\\n            let foundVariant = variants.value.find(v => isEqual(v.attributeAliases, selectedAttributes.value));\\r\\n\\r\\n            if (foundVariant) {\\r\\n                store.updateCurrentProduct(foundVariant);\\r\\n                resetQuantity();\\r\\n            } else if (closestVariant) {\\r\\n                store.updateCurrentProduct(closestVariant);\\r\\n                resetQuantity();\\r\\n            }\\r\\n        };\\r\\n\\r\\n        const setOption = (value, index) => {\\r\\n            if (index === 0) {\\r\\n                // get a match on the first attribute \\r\\n                // get first variant from matching first attribute\\r\\n                let closestVariant = variants.value.find(product => product.attributeAliases[0] === value);\\r\\n\\r\\n                if (closestVariant) {\\r\\n                    store.updateSelectedAttributes(closestVariant.attributeAliases);\\r\\n                    setVariant(closestVariant);\\r\\n                } else {\\r\\n                    store.updateSelectedAttributeAtIndex(index, value);\\r\\n                    setVariant();\\r\\n                }\\r\\n            } else {\\r\\n                store.updateSelectedAttributeAtIndex(index, value);\\r\\n                setVariant();\\r\\n            }\\r\\n        };\\r\\n\\r\\n        const submitSelection = () => {\\r\\n            if (!canAddToBasket.value) return;\\r\\n            addToBasket();\\r\\n        };\\r\\n\\r\\n        const setExtras = (value, index) => {\\r\\n            store.updateSelectedExtraAtIndex(index, value);\\r\\n        };\\r\\n\\r\\n        const addToBasket = async () => {\\r\\n            store.updateIsLoading(true);\\r\\n\\r\\n            if(groupedExtras.value && selectedExtras.value) {\\r\\n                let quantity = 1;\\r\\n                const processedExtras = [];\\r\\n\\r\\n                if (hideQuantity.value && currentProductData.value.quantityAlias) {\\r\\n                    let quantityGroup = currentProductData.value.attributeGroups.find(x => {\\r\\n                        return isEqual(x.alias, currentProductData.value.quantityAlias);\\r\\n                    });\\r\\n\\r\\n                    if (quantityGroup) {\\r\\n                        let selectedAttribute = quantityGroup.attributes.find(x => {\\r\\n                        return currentProduct.value.attributeAliases.includes(x.alias);\\r\\n                        });\\r\\n\\r\\n                        quantity = Number(selectedAttribute.name);\\r\\n                    }\\r\\n                }\\r\\n\\r\\n                for (const group of groupedExtras.value) {\\r\\n                    const groupExtras = group.extras.filter(extra => selectedExtras.value.includes(extra.alias));\\r\\n\\r\\n                    groupExtras.forEach(extra => {\\r\\n                        console.log(extra);\\r\\n                        processedExtras.push({\\r\\n                            productId: extra.sku,\\r\\n                            quantity: extra.multiplies ? quantity : 1,\\r\\n                            name: extra.name\\r\\n                        });\\r\\n                    });\\r\\n\\r\\n                    store.updateExtras(processedExtras);\\r\\n                }\\r\\n            }\\r\\n\\r\\n            basketData.value = {\\r\\n                productId: currentProductData.value.sku,\\r\\n                variantId: currentProduct.value.sku,\\r\\n                quantity: quantity.value,\\r\\n                extras: extras.value,\\r\\n            };\\r\\n\\r\\n            try {\\r\\n                const { data } = await http.value.post('/basket/addtobasket', basketData.value);\\r\\n                if (data.message) {\\r\\n                    console.error(data.message);\\r\\n                } else {\\r\\n                    store.basketSummary = data.basketSummary;\\r\\n                    pushAddBasketEvent();\\r\\n                }\\r\\n            } catch (error) {\\r\\n                console.error(\\\"An error occurred during the HTTP request:\\\", error);\\r\\n            }\\r\\n\\r\\n            store.updateIsLoading(false);      \\r\\n        };\\r\\n\\r\\n        return {\\r\\n            selectedExtras,\\r\\n            currentProduct,\\r\\n            selectedAttributes,\\r\\n            quantity,\\r\\n            groupedExtras,\\r\\n            currentPrice,\\r\\n            canAddToBasket,\\r\\n            quantityText,\\r\\n            hideQuantity,\\r\\n            hidePriceDifference,\\r\\n            attributeGroups,\\r\\n            formattedCurrency,\\r\\n            isLoading,\\r\\n            minQuantity,\\r\\n            maxQuantity,\\r\\n            quantityUp,\\r\\n            quantityDown,\\r\\n            setOption,\\r\\n            setExtras,\\r\\n            submitSelection,\\r\\n            basketModalOpen,\\r\\n            basketUrl\\r\\n        };\\r\\n    }\\r\\n}\\r\\n</script>\\r\\n\\r\\n<style>\\r\\n.slide-fade-enter-active {\\r\\n  transition: all .5s ease;\\r\\n}\\r\\n\\r\\n.slide-fade-leave-active {\\r\\n  transition: all .25s cubic-bezier(1.0, 0.5, 0.8, 1.0);\\r\\n}\\r\\n\\r\\n.slide-fade-enter,\\r\\n.slide-fade-leave-to {\\r\\n  transform: translateX(.2rem);\\r\\n  opacity: 0;\\r\\n}\\r\\n</style>\"],\"sourceRoot\":\"\"}]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___;\n","import script from \"./AddToBasketModal.vue?vue&type=script&setup=true&lang=js\"\nexport * from \"./AddToBasketModal.vue?vue&type=script&setup=true&lang=js\"\n\nconst __exports__ = script;\n\nexport default __exports__","<template>\r\n    <div class=\"modal-container\">\r\n        <div class=\"modal-inner\">\r\n            <div class=\"modal-dialog modal-dialog--basket\" role=\"dialog\" aria-modal=\"true\">\r\n                <button class=\"modal-close\" @click=\"$emit('close')\">\r\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"42\" viewBox=\"0 -960 960 960\" width=\"42\">\r\n                        <path d=\"M256-213.847 213.847-256l224-224-224-224L256-746.153l224 224 224-224L746.153-704l-224 224 224 224L704-213.847l-224-224-224 224Z\"/>\r\n                    </svg>\r\n                </button>\r\n                <div class=\"modal-dialog__content\">\r\n                    <div class=\"basket-modal\">\r\n                        <div class=\"basket-modal__header\">\r\n                            <p class=\"basket-modal__title title title--3 weight-medium\">Added to basket!</p>\r\n                        </div>\r\n                        <div class=\"basket-modal__added-product\">\r\n                            <div v-if=\"currentProduct\" class=\"basket-item\">\r\n                                <div class=\"basket-item__product-image\">\r\n                                    <img v-if=\"image\" :src=\"image.url\" :width=\"image.width\" :height=\"image.height\" :alt=\"image.altText\">\r\n                                </div>\r\n                                <div class=\"basket-item__product-info\">\r\n                                    <div class=\"basket-item__product-description\">\r\n                                        <p class=\"weight-medium mb-1\">\r\n                                            {{ currentProduct.name }}\r\n                                        </p>\r\n                                        <p v-if=\"matchingAttributes\" class=\"basket-item__attributes\">\r\n                                            <span v-for=\"(attribute, index) of matchingAttributes\" :key=\"`category-${attribute.alias}`\">\r\n                                                {{attribute.name}}<span v-if=\"index < matchingAttributes.length - 1\">, </span>\r\n                                            </span>\r\n                                        </p>\r\n                                        <p v-if=\"extras\" class=\"basket-item__extras\">\r\n                                            <span v-for=\"(extra, index) of extras\" :key=\"`category-${extra.alias}`\">\r\n                                                {{ extra.name }}<span v-if=\"index < extras.length - 1\">, </span>\r\n                                            </span>\r\n                                        </p>\r\n                                    </div>\r\n                                    <div class=\"basket-item__product-totals\">\r\n                                        <div class=\"basket-item__quantity\">\r\n                                            <p>{{ quantity }}</p>\r\n                                        </div>\r\n                                        <div class=\"basket-item__product-controls\">\r\n                                            <p class=\"basket-item__price\">\r\n                                                <span class=\"visually-hidden\">Price:</span>\r\n                                                {{ formattedCurrency(price) }}\r\n                                            </p>\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                            </div> \r\n                        </div>\r\n                        <div class=\"basket-modal__order-summary\">\r\n                            <div class=\"basket-summary\">\r\n                                <div class=\"basket-summary__item\">\r\n                                    <p class=\"text-small weight-medium\">Your Basket</p> <p class=\"text-small weight-medium\">{{ basketCount }} items</p>\r\n                                </div>\r\n                                <div class=\"basket-summary__item\">\r\n                                    <p class=\"text-small\">Subtotal:</p> <p class=\"title title--6\">{{ basketSummary.subtotal }}</p>\r\n                                </div>\r\n                                <div class=\"basket-summary__item\">\r\n                                    <p class=\"text-small\">VAT:</p> <p class=\"title title--6\">{{ basketSummary.tax }}</p>\r\n                                </div>\r\n                                <hr class=\"hr\">\r\n                                <div class=\"basket-summary__item\">\r\n                                    <p>Total:</p>\r\n                                    <p class=\"title title--4 weight-medium\">{{ basketSummary.total }}</p>\r\n                                </div>\r\n                                <div class=\"basket-summary__button button-list button-list--space-between\">\r\n                                    <button @click=\"$emit('close')\" class=\"button button--green-alt\">\r\n                                        <span>Continue Shopping</span>\r\n                                    </button>\r\n                                    \r\n                                    <a :href=\"basketUrl\" class=\"button button--green button--has-icon\">\r\n                                        <span>View Basket</span>\r\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 -960 960 960\" width=\"24\"><path d=\"m560-240-56-58 142-142H160v-80h486L504-662l56-58 240 240-240 240Z\"></path></svg>\r\n                                    </a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                    <div class=\"basket-modal__product-recommendations\">\r\n                        <slot></slot>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</template>\r\n\r\n<script setup>\r\n    import { computed } from 'vue';\r\n    import { useProductStore } from '../../stores/_product-store.js';\r\n    import { storeToRefs } from \"pinia\";\r\n\r\n    const store = useProductStore();\r\n\r\n    const { currentProduct, currentProductData, quantity, extras, basketUrl, basketSummary } = storeToRefs(store);\r\n\r\n    const attributeGroups = currentProductData.value.attributeGroups;\r\n\r\n    const attributeAliases = currentProduct.value.attributeAliases;\r\n\r\n    const image = currentProductData.value.basketImage;\r\n\r\n    const formattedCurrency = computed(() => {\r\n        return (number) => {\r\n            const locale = 'en-GB';\r\n            const currency = 'GBP';\r\n            return new Intl.NumberFormat(locale, { style: 'currency', currency: currency }).format(number);\r\n        };\r\n    });\r\n\r\n    const basketCount = computed(() => {\r\n        return store.getBasketCount;\r\n    });\r\n\r\n    const props = defineProps({\r\n        price: Number\r\n    });\r\n\r\n    function findMatchingAttributes(data, aliases) {\r\n        const matchingAttributes = [];\r\n\r\n        data.forEach(category => {\r\n            category.attributes.forEach(attribute => {\r\n                if (aliases.includes(attribute.alias)) {\r\n                    matchingAttributes.push(attribute);\r\n                }\r\n            });\r\n        });\r\n\r\n        return matchingAttributes;\r\n    }\r\n\r\n    // Find matching attributes\r\n    const matchingAttributes = findMatchingAttributes(attributeGroups, attributeAliases);\r\n\r\n</script>","import script from \"./AddToBasketModalButton.vue?vue&type=script&setup=true&lang=js\"\nexport * from \"./AddToBasketModalButton.vue?vue&type=script&setup=true&lang=js\"\n\nconst __exports__ = script;\n\nexport default __exports__","<template>\r\n  <button type=\"button\" @click=\"openModal\" class=\"button button--green button--full-width\">\r\n      <Teleport to=\"#modals\">\r\n          <Transition name=\"modal-fade\" appear>\r\n              <BasketModal v-if=\"show\" @close=\"hideModal\" :price=\"price\">\r\n                <slot name=\"productRecommendations\"></slot>\r\n              </BasketModal>\r\n          </Transition>\r\n      </Teleport>\r\n      Add To Basket\r\n  </button>\r\n</template>\r\n\r\n<script setup>\r\nimport { ref, watchEffect } from 'vue';\r\nimport BasketModal from '../commerce/AddToBasketModal.vue';\r\n\r\nconst show = ref(false);\r\n\r\nconst props = defineProps({\r\n  price: Number\r\n});\r\n\r\nwatchEffect(() => {\r\n  document.body.classList.toggle('noscroll', show.value);\r\n});\r\n\r\nconst hideModal = () => {\r\n  show.value = false;\r\n};\r\n\r\nconst openModal = () => {\r\n  show.value = true;\r\n};\r\n\r\n</script>\r\n","<template>\r\n    <div v-if=\"currentProduct\" class=\"product-configurator\">\r\n        <div class=\"product-configurator__options\">\r\n            <ProductConfiguratorField  \r\n                v-for=\"(group,index) of attributeGroups\"\r\n                @change=\"setOption($event,index)\"\r\n                :key=\"group.alias\"\r\n                :more-info=\"group.info\"\r\n                :model=\"selectedAttributes[index]\"\r\n                :name=\"group.name\"\r\n                :attributes=\"group.attributes\"\r\n                :hide-disabled=\"index === 0\"\r\n            />\r\n            <ProductConfiguratorField\r\n                v-for=\"(group, index) of groupedExtras\"\r\n                @change=\"setExtras($event, index)\"\r\n                :key=\"group.alias\"\r\n                :more-info=\"group.info\"\r\n                :model=\"selectedExtras[index]\"\r\n                :name=\"group.name\"\r\n                :attributes=\"group.extras\"\r\n                :hide-disabled=\"index === 0\"\r\n            />\r\n        </div>\r\n        <div class=\"product-configurator__controls\">\r\n            <div class=\"row justify-content-between align-items-end gap-x-2\">\r\n                <div class=\"col-auto\">\r\n                    <div class=\"product-configurator__summary\">\r\n                        <transition name=\"slide-fade\" mode=\"out-in\">\r\n                            <p v-if=\"currentPrice\" :key=\"currentPrice\" class=\"product-configurator__price\">\r\n                                {{ formattedCurrency(currentPrice) }}\r\n                            </p>\r\n                        </transition>\r\n                        <span class=\"product-configurator__price-tagline\">Excluding VAT and Delivery</span>\r\n                        <span class=\"product-configurator__price-tagline\">Free collection available</span>\r\n                    </div>\r\n                    <div class=\"form-field form-field--quantity quantity-field mt-2\" v-if=\"!hideQuantity\">\r\n                        <span :class=\"['quantity-field__down', {'disabled': (minQuantity || 1) === quantity }]\" @click=\"quantityDown\">-</span>\r\n                        <input class=\"quantity-field__input\" \r\n                            v-model=\"quantity\" \r\n                            type=\"number\"\r\n                            value=\"1\" \r\n                            :min=\"minQuantity || 1\" \r\n                            :max=\"maxQuantity > 0 ? maxQuantity : undefined\"\r\n                            @keyup=\"resetQuantity()\" \r\n                            @focusout=\"resetQuantity()\" \r\n                        />\r\n                        <span :class=\"['quantity-field__up', {'disabled': (maxQuantity > 0 && maxQuantity === quantity)}]\" @click=\"quantityUp\">+</span>\r\n                        <p v-if=\"quantityText\" class=\"text-small ml-1 mt-auto\">\r\n                            ({{ quantityText }})\r\n                        </p>\r\n                    </div>\r\n                </div>\r\n                <div class=\"col-auto\">\r\n                    <AddToBasketModalButton :price=\"currentPrice\" @click=\"submitSelection\" :disabled=\"!canAddToBasket\">\r\n                        <template #productRecommendations>\r\n                            <slot name=\"products\"></slot>\r\n                        </template>\r\n                    </AddToBasketModalButton>\r\n                </div>\r\n            </div>\r\n        </div>              \r\n    </div>\r\n</template>\r\n<script>\r\nconst GetHttp = () => import(/* webpackChunkName: 'http' */ '../../../_http.js').then(v => v.default);\r\nimport { ref, onMounted, computed } from 'vue';\r\nimport isEqual from 'lodash/isEqual';\r\nimport { useProductStore } from '../../stores/_product-store.js';\r\nimport { storeToRefs } from \"pinia\";\r\nimport ProductConfiguratorField from './ProductConfiguratorField.vue'\r\nimport AddToBasketModalButton from './AddToBasketModalButton.vue'\r\n\r\nexport default { \r\n    emits: [\"change\"],\r\n    components: {\r\n        ProductConfiguratorField,\r\n        AddToBasketModalButton\r\n    },\r\n    props: {\r\n        productData: {\r\n            type: Object,\r\n            required: true\r\n        }\r\n    },\r\n    setup(props) {\r\n        const store = useProductStore();\r\n        // const extraCosts = ref(0);\r\n        const http = ref(null);\r\n        const attributeGroups = ref(null);\r\n        const hideQuantity = ref(false);\r\n        const hidePriceDifference = ref(false);\r\n        const minQuantity = ref(0);\r\n        const maxQuantity = ref(null);\r\n        const basketData = ref({});\r\n        const { isLoading, currentProduct, currentProductData, groupedExtras, quantity, variants, selectedAttributes, selectedExtras, extras, basketUrl, basketSummary } = storeToRefs(store);\r\n        const basketModalOpen = ref(false);\r\n\r\n        const pushViewItemEvent = () => {\r\n            window.dataLayer = window.dataLayer || [];\r\n            dataLayer.push({ ecommerce: null });\r\n            dataLayer.push({\r\n                'event': 'custom_view_item',\r\n                'datalayer_event_name': 'view_item',\r\n                'ecommerce': {\r\n                    'value': currentPrice.value,\r\n                    'currency': 'GBP',\r\n                    'items': [\r\n                        {\r\n                            'item_id': currentProduct.value.sku,\r\n                            'item_name': currentProduct.value.name,\r\n                            'quantity': quantity.value\r\n                        }\r\n                    ]\r\n                }\r\n            });\r\n        };\r\n\r\n        const pushAddBasketEvent = () => {\r\n            window.dataLayer = window.dataLayer || [];\r\n            dataLayer.push({ ecommerce: null });\r\n            dataLayer.push({\r\n                'event': 'custom_add_to_cart',\r\n                'datalayer_event_name': 'add_to_cart',\r\n                'ecommerce': {\r\n                    'value': currentPrice.value,\r\n                    'currency': 'GBP',\r\n                    'items': [\r\n                        {\r\n                            'item_id': currentProduct.value.sku,\r\n                            'item_name': currentProduct.value.name,\r\n                            'quantity': quantity.value\r\n                        }\r\n                    ]\r\n                }\r\n            });\r\n        };\r\n\r\n        onMounted(async () => {\r\n            store.updateCurrentProductData(props.productData);\r\n\r\n            if (!currentProductData) return;\r\n\r\n            store.updateVariants(currentProductData.value.variants);\r\n            store.updateCurrentProduct(currentProductData.value);\r\n            store.updateGroupedExtras(currentProductData.value.extrasGroups);\r\n            attributeGroups.value = currentProductData.value.attributeGroups;\r\n            hidePriceDifference.value = currentProductData.value.hidePriceDifference;\r\n            hideQuantity.value = currentProductData.value.hideQuantity;\r\n            minQuantity.value = currentProductData.value.minQuantity;\r\n            maxQuantity.value = currentProductData.value.maxQuantity;\r\n\r\n            http.value = await GetHttp();\r\n\r\n            if (variants && Array.isArray(variants.value) && variants.value.length > 0) {\r\n                let initialVariant = variants.value[0];\r\n\r\n                if (initialVariant) {\r\n                    store.updateCurrentProduct(initialVariant);\r\n                    store.updateSelectedAttributes(initialVariant.attributeAliases);\r\n                }\r\n            }\r\n\r\n            resetQuantity();\r\n\r\n            preSelectExtras();\r\n        });\r\n\r\n        const preSelectExtras = () => {\r\n            if (groupedExtras.value) {\r\n                let initialExtraAliases = [];\r\n\r\n                for(let group of groupedExtras.value) {\r\n                    initialExtraAliases.push(group.extras[0].alias);\r\n                }\r\n\r\n                store.updateSelectedExtras(initialExtraAliases);\r\n            }\r\n        };\r\n\r\n        const extraCosts = computed(() => {\r\n            let costs = 0;\r\n\r\n            if(groupedExtras.value && selectedExtras.value) {\r\n                for (const group of groupedExtras.value) {\r\n                    const groupExtras = group.extras.filter(extra => selectedExtras.value.includes(extra.alias));\r\n\r\n                    costs += groupExtras.reduce((acc, extra) => acc + (extra.syncedPrice || extra.price), 0);\r\n                }\r\n            }\r\n\r\n            return costs;\r\n        });\r\n\r\n        const resetQuantity = () => {\r\n            if (quantity.value <= minQuantity.value || 0) quantity.value = minQuantity.value || 1;\r\n\r\n            if(maxQuantity.value) {\r\n                if (maxQuantity.value > 0 && quantity.value > maxQuantity.value) {\r\n                    store.updateQuantity(maxQuantity.value);\r\n                }\r\n            }\r\n            \r\n            pushViewItemEvent();\r\n        };\r\n\r\n        //Computed\r\n        const currentPrice = computed(() => {\r\n            return (currentProduct.value.price * quantity.value) + extraCosts.value;\r\n        });\r\n\r\n        const canAddToBasket = computed(() => {\r\n            return currentProduct.value && quantity.value > 0;\r\n        });\r\n\r\n        const quantityText = computed(() => {\r\n            let textArr = [];\r\n\r\n            if (minQuantity.value) {\r\n                textArr.push(`Min: ${minQuantity.value}`);\r\n            }\r\n\r\n            if (maxQuantity.value) {\r\n                textArr.push(`Max: ${maxQuantity.value}`);\r\n            }\r\n\r\n            return textArr.join(', ');\r\n        });\r\n\r\n        const formattedCurrency = computed(() => {\r\n            return (number) => {\r\n                const locale = 'en-GB';\r\n                const currency = 'GBP';\r\n                return new Intl.NumberFormat(locale, { style: 'currency', currency: currency }).format(number);\r\n            };\r\n        });\r\n\r\n        //Methods\r\n        const quantityUp = () => {\r\n            store.updateQuantity(parseInt(quantity.value) + 1);\r\n            resetQuantity();\r\n        };\r\n\r\n        const quantityDown = () => {\r\n            store.updateQuantity(parseInt(quantity.value) - 1);\r\n            resetQuantity();\r\n        };\r\n\r\n        const setVariant = (closestVariant) => {\r\n            let foundVariant = variants.value.find(v => isEqual(v.attributeAliases, selectedAttributes.value));\r\n\r\n            if (foundVariant) {\r\n                store.updateCurrentProduct(foundVariant);\r\n                resetQuantity();\r\n            } else if (closestVariant) {\r\n                store.updateCurrentProduct(closestVariant);\r\n                resetQuantity();\r\n            }\r\n        };\r\n\r\n        const setOption = (value, index) => {\r\n            if (index === 0) {\r\n                // get a match on the first attribute \r\n                // get first variant from matching first attribute\r\n                let closestVariant = variants.value.find(product => product.attributeAliases[0] === value);\r\n\r\n                if (closestVariant) {\r\n                    store.updateSelectedAttributes(closestVariant.attributeAliases);\r\n                    setVariant(closestVariant);\r\n                } else {\r\n                    store.updateSelectedAttributeAtIndex(index, value);\r\n                    setVariant();\r\n                }\r\n            } else {\r\n                store.updateSelectedAttributeAtIndex(index, value);\r\n                setVariant();\r\n            }\r\n        };\r\n\r\n        const submitSelection = () => {\r\n            if (!canAddToBasket.value) return;\r\n            addToBasket();\r\n        };\r\n\r\n        const setExtras = (value, index) => {\r\n            store.updateSelectedExtraAtIndex(index, value);\r\n        };\r\n\r\n        const addToBasket = async () => {\r\n            store.updateIsLoading(true);\r\n\r\n            if(groupedExtras.value && selectedExtras.value) {\r\n                let quantity = 1;\r\n                const processedExtras = [];\r\n\r\n                if (hideQuantity.value && currentProductData.value.quantityAlias) {\r\n                    let quantityGroup = currentProductData.value.attributeGroups.find(x => {\r\n                        return isEqual(x.alias, currentProductData.value.quantityAlias);\r\n                    });\r\n\r\n                    if (quantityGroup) {\r\n                        let selectedAttribute = quantityGroup.attributes.find(x => {\r\n                        return currentProduct.value.attributeAliases.includes(x.alias);\r\n                        });\r\n\r\n                        quantity = Number(selectedAttribute.name);\r\n                    }\r\n                }\r\n\r\n                for (const group of groupedExtras.value) {\r\n                    const groupExtras = group.extras.filter(extra => selectedExtras.value.includes(extra.alias));\r\n\r\n                    groupExtras.forEach(extra => {\r\n                        console.log(extra);\r\n                        processedExtras.push({\r\n                            productId: extra.sku,\r\n                            quantity: extra.multiplies ? quantity : 1,\r\n                            name: extra.name\r\n                        });\r\n                    });\r\n\r\n                    store.updateExtras(processedExtras);\r\n                }\r\n            }\r\n\r\n            basketData.value = {\r\n                productId: currentProductData.value.sku,\r\n                variantId: currentProduct.value.sku,\r\n                quantity: quantity.value,\r\n                extras: extras.value,\r\n            };\r\n\r\n            try {\r\n                const { data } = await http.value.post('/basket/addtobasket', basketData.value);\r\n                if (data.message) {\r\n                    console.error(data.message);\r\n                } else {\r\n                    store.basketSummary = data.basketSummary;\r\n                    pushAddBasketEvent();\r\n                }\r\n            } catch (error) {\r\n                console.error(\"An error occurred during the HTTP request:\", error);\r\n            }\r\n\r\n            store.updateIsLoading(false);      \r\n        };\r\n\r\n        return {\r\n            selectedExtras,\r\n            currentProduct,\r\n            selectedAttributes,\r\n            quantity,\r\n            groupedExtras,\r\n            currentPrice,\r\n            canAddToBasket,\r\n            quantityText,\r\n            hideQuantity,\r\n            hidePriceDifference,\r\n            attributeGroups,\r\n            formattedCurrency,\r\n            isLoading,\r\n            minQuantity,\r\n            maxQuantity,\r\n            quantityUp,\r\n            quantityDown,\r\n            setOption,\r\n            setExtras,\r\n            submitSelection,\r\n            basketModalOpen,\r\n            basketUrl\r\n        };\r\n    }\r\n}\r\n</script>\r\n\r\n<style>\r\n.slide-fade-enter-active {\r\n  transition: all .5s ease;\r\n}\r\n\r\n.slide-fade-leave-active {\r\n  transition: all .25s cubic-bezier(1.0, 0.5, 0.8, 1.0);\r\n}\r\n\r\n.slide-fade-enter,\r\n.slide-fade-leave-to {\r\n  transform: translateX(.2rem);\r\n  opacity: 0;\r\n}\r\n</style>","<template>\r\n    <div :class=\"['product-configurator__option', 'form-field', {'order-last': isQuantityGroup}]\">\r\n        <div class=\"product-configurator__option-header\">\r\n            <label class=\"form-field__label title title--3\">\r\n                {{ name }}\r\n            </label>\r\n            <DynamicModalButton v-if=\"moreInfo?.description\" class=\"product-more-info\" aria-label=\"Click for more info\">\r\n                <template #button>\r\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"22\" viewBox=\"0 -960 960 960\" width=\"22\">\r\n                        <title>More Info</title>\r\n                        <path d=\"M450.001-290.001h59.998V-520h-59.998v229.999ZM480-588.461q13.731 0 23.019-9.288 9.288-9.288 9.288-23.019 0-13.73-9.288-23.019-9.288-9.288-23.019-9.288-13.731 0-23.019 9.288-9.288 9.289-9.288 23.019 0 13.731 9.288 23.019 9.288 9.288 23.019 9.288Zm.067 488.46q-78.836 0-148.204-29.92-69.369-29.92-120.682-81.21-51.314-51.291-81.247-120.629-29.933-69.337-29.933-148.173t29.92-148.204q29.92-69.369 81.21-120.682 51.291-51.314 120.629-81.247 69.337-29.933 148.173-29.933t148.204 29.92q69.369 29.92 120.682 81.21 51.314 51.291 81.247 120.629 29.933 69.337 29.933 148.173t-29.92 148.204q-29.92 69.369-81.21 120.682-51.291 51.314-120.629 81.247-69.337 29.933-148.173 29.933ZM480-160q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z\"/>\r\n                    </svg>\r\n                </template>\r\n                <template #modal>\r\n                    <div v-html=\"moreInfo?.description\" class=\"richtext\"></div>\r\n                </template>\r\n            </DynamicModalButton>\r\n        </div>\r\n        <component \r\n            :is=\"fieldType\"\r\n            :model=\"model\"\r\n            @change=\"handleFieldChange($event, index)\"\r\n            :attributes=\"processedAttributes\"\r\n            :hide-disabled=\"hideDisabled\"\r\n        />\r\n    </div>\r\n</template>\r\n<script>\r\nimport isEqual from 'lodash/isEqual';\r\nimport { defineAsyncComponent, computed } from 'vue'; \r\nimport { useProductStore } from '../../stores/_product-store';\r\nimport { storeToRefs } from 'pinia';\r\nimport { ref } from 'vue';\r\n\r\nexport default {\r\n    emits: [\"change\"],\r\n    props: {\r\n        model: {\r\n            required: true\r\n        },\r\n        name: {\r\n            type: String,\r\n            required: true,\r\n            default: 'Field Label'\r\n        },\r\n        moreInfo: {\r\n            type: Object,\r\n            default: () => {}\r\n        },\r\n        attributes: {\r\n            type: Array,\r\n            required: true,\r\n            default: () => []\r\n        },\r\n        hideDisabled: {\r\n            type: Boolean,\r\n            default: false\r\n        }\r\n    },\r\n    components: {\r\n        Select: defineAsyncComponent(() => import(/* webpackChunkName: 'prod-select' */ './fields/SelectField.vue')),\r\n        // CheckboxList: defineAsyncComponent(() => import(/* webpackChunkName: 'prod-check-list' */ './fields/CheckboxListField.vue')),\r\n        Quantity: defineAsyncComponent(() => import(/* webpackChunkName: 'prod-quantity-list-field' */ './fields/QuantityListField.vue')),\r\n        RadioList: defineAsyncComponent(() => import(/* webpackChunkName: 'prod-radio' */ './fields/RadioListField.vue')),\r\n        ImageRadioList: defineAsyncComponent(() => import(/* webpackChunkName: 'prod-image-choice' */ './fields/ImageChoiceListField.vue')),\r\n        Artwork: defineAsyncComponent(() => import(/* webpackChunkName: 'prod-artwork-field' */ './fields/ArtworkField.vue')),\r\n    },\r\n    setup(props, { emit }) {\r\n        const store = useProductStore();\r\n        const { name, moreInfo, attributes, hideDisabled } = props;\r\n        const { currentProduct, currentProductData, quantity, variants, selectedAttributes} = storeToRefs(store);\r\n        const hideQuantity = currentProductData.value.hideQuantity;\r\n        const quantityAlias = currentProductData.value.quantityAlias;\r\n        const attributeGroups = currentProductData.value.attributeGroups;\r\n        const fieldType = props.moreInfo?.fieldType ? props.moreInfo.fieldType : 'radio-list';\r\n        const currentModel = ref(props.model);\r\n\r\n        const updateField = () => {\r\n            emit('change', currentModel.value);\r\n        };\r\n\r\n        const handleFieldChange = (newValue) => {\r\n            currentModel.value = newValue;\r\n            updateField();\r\n        };\r\n\r\n        const isQuantityGroup = computed(() => {\r\n            return fieldType === \"quantity\";\r\n        });\r\n\r\n        const processedAttributes = computed(() => {\r\n            let proAttributes = [];\r\n\r\n            attributes.forEach(option => {\r\n\r\n                if (option.groupKey != null) {\r\n\r\n                    let newAttributes = [...selectedAttributes.value];\r\n                    newAttributes[option.groupKey] = option.alias;\r\n\r\n                    let foundVariant = variants.value.find(v => {\r\n                        return isEqual(v.attributeAliases, newAttributes);\r\n                    });\r\n\r\n                    if (foundVariant) {\r\n                        let price = foundVariant.price - currentProduct.value.price;\r\n                        option.price = price || 0;\r\n                        option.isDisabled = false;\r\n                    } else {\r\n                        option.isDisabled = true;\r\n                        option.price = 0;\r\n                    }\r\n                }\r\n\r\n                if (option.multiplies && quantity.value > 0) {\r\n\r\n                    if (hideQuantity && quantityAlias) {\r\n                        //Find the selected quantity attribute and retrieve value\r\n\r\n                        let quantityGroup = attributeGroups.find(x => {\r\n                            return isEqual(x.alias, quantityAlias);\r\n                        });\r\n\r\n                        if (quantityGroup) {\r\n\r\n                            let selectedAttribute = quantityGroup.attributes.find(x => {\r\n                                return currentProduct.value.attributeAliases.includes(x.alias);\r\n                            });\r\n\r\n                            let attributeQuantity = Number(selectedAttribute.name);\r\n\r\n                            let price = option.price * attributeQuantity;\r\n\r\n                            if (option.minimumPrice > 0 && price < option.minimumPrice) {\r\n                                option.syncedPrice = option.minimumPrice;\r\n                            } else {\r\n                                option.syncedPrice = price;\r\n                            }\r\n\r\n                            option.labelSuffix = attributeQuantity > 1 ? ` x${attributeQuantity}` : null;\r\n                        } else {\r\n                            //idk\r\n                        }\r\n                    } else {\r\n                        option.syncedPrice = option.price * quantity.value;\r\n                        option.labelSuffix = quantity.value > 1 ? ` x${quantity.value} ` : null;\r\n                    }\r\n\r\n                }\r\n\r\n                proAttributes.push(option);\r\n            });\r\n\r\n            return proAttributes;\r\n        });\r\n\r\n        const processedName = computed(() => {\r\n            return name.replace(/{productName}/g, currentProductData.value.name);\r\n        });\r\n\r\n        return {\r\n            name: processedName,\r\n            moreInfo,\r\n            hideDisabled,\r\n            processedAttributes,\r\n            currentModel,\r\n            updateField,\r\n            fieldType,\r\n            handleFieldChange,\r\n            isQuantityGroup\r\n        };\r\n    }\r\n}\r\n</script>","import { render } from \"./ProductConfiguratorField.vue?vue&type=template&id=4a44aa35\"\nimport script from \"./ProductConfiguratorField.vue?vue&type=script&lang=js\"\nexport * from \"./ProductConfiguratorField.vue?vue&type=script&lang=js\"\n\nimport exportComponent from \"../../../../../node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","import { render } from \"./ProductConfigurator.vue?vue&type=template&id=25234dbc\"\nimport script from \"./ProductConfigurator.vue?vue&type=script&lang=js\"\nexport * from \"./ProductConfigurator.vue?vue&type=script&lang=js\"\n\nimport \"./ProductConfigurator.vue?vue&type=style&index=0&id=25234dbc&lang=css\"\n\nimport exportComponent from \"../../../../../node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","// style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!../../../../../node_modules/css-loader/dist/cjs.js!../../../../../node_modules/vue-loader/dist/stylePostLoader.js!../../../../../node_modules/vue-loader/dist/index.js??ruleSet[1].rules[15].use[0]!./ProductConfigurator.vue?vue&type=style&index=0&id=25234dbc&lang=css\");\nif(content.__esModule) content = content.default;\nif(typeof content === 'string') content = [[module.id, content, '']];\nif(content.locals) module.exports = content.locals;\n// add the styles to the DOM\nvar add = require(\"!../../../../../node_modules/vue-style-loader/lib/addStylesClient.js\").default\nvar update = add(\"982a7200\", content, true, {});"],"names":["useProductStore","defineStore","id","state","isLoading","currentProduct","currentProductData","groupedExtras","quantity","variants","selectedAttributes","selectedExtras","extras","basketSummary","subtotal","basketCount","tax","total","basketUrl","getters","getCurrrentProduct","getBasketCount","getBasketSummary","actions","fetchBasketCount","response","fetch","process","method","ok","Error","data","json","this","error","console","updateIsLoading","updateCurrentProduct","product","updateCurrentProductData","productData","updateExtras","updateBasketUrl","url","updateGroupedExtras","updateQuantity","updateVariants","updateSelectedAttributes","attributeAliases","updateSelectedExtras","extraAliases","updateSelectedAttributeAtIndex","index","value","splice","updateSelectedExtraAtIndex","___CSS_LOADER_EXPORT___","push","module","store","storeToRefs","attributeGroups","image","basketImage","formattedCurrency","computed","number","Intl","NumberFormat","style","currency","format","matchingAttributes","aliases","forEach","category","attributes","attribute","includes","alias","findMatchingAttributes","show","ref","watchEffect","document","body","classList","toggle","hideModal","openModal","key","class","_createElementVNode","xmlns","height","viewBox","width","d","emits","props","model","required","name","type","String","default","moreInfo","Object","Array","hideDisabled","Boolean","components","Select","defineAsyncComponent","Quantity","RadioList","ImageRadioList","Artwork","setup","_ref","emit","hideQuantity","quantityAlias","fieldType","currentModel","updateField","isQuantityGroup","processedAttributes","proAttributes","option","groupKey","newAttributes","foundVariant","find","v","isEqual","price","isDisabled","multiplies","quantityGroup","x","selectedAttribute","attributeQuantity","Number","minimumPrice","syncedPrice","labelSuffix","replace","handleFieldChange","newValue","_createElementBlock","_normalizeClass","$setup","_hoisted_1","_hoisted_2","_toDisplayString","description","_createBlock","_component_DynamicModalButton","button","_withCtx","_hoisted_3","modal","innerHTML","_hoisted_4","_","_createCommentVNode","_resolveDynamicComponent","$props","onChange","_cache","$event","_ctx","ProductConfiguratorField","AddToBasketModalButton","http","hidePriceDifference","minQuantity","maxQuantity","basketData","basketModalOpen","onMounted","async","extrasGroups","then","isArray","length","initialVariant","resetQuantity","preSelectExtras","initialExtraAliases","group","extraCosts","costs","filter","extra","reduce","acc","window","dataLayer","ecommerce","currentPrice","sku","canAddToBasket","quantityText","textArr","join","setVariant","closestVariant","addToBasket","processedExtras","log","productId","variantId","post","message","quantityUp","parseInt","quantityDown","setOption","setExtras","submitSelection","_Fragment","_renderList","_component_ProductConfiguratorField","info","_hoisted_5","_hoisted_6","_createVNode","_Transition","mode","_hoisted_7","_hoisted_8","_hoisted_9","onClick","arguments","min","max","undefined","onKeyup","onFocusout","_hoisted_10","_hoisted_11","_hoisted_12","_component_AddToBasketModalButton","disabled","productRecommendations","_renderSlot","$slots","content","__esModule","locals","exports","add"],"sourceRoot":""}