{"version":3,"sources":["select-list-fields.js"],"names":["mounted","hide","show","onLoad","arguments","length","undefined","document","querySelectorAll","forEach","element","data","$data","fields","updateItems","field","products","item","filteredProducts","filter","p","fieldValues","some","fv","id","dataset","fieldId","value","cannotOrderCssClass","canOrder","classList","remove","add","index","addEventListener","nextField","Array","from","_","i","every","f","product","disabled","dispatchProductChangeEvent","dispatchEvent","CustomEvent","bubbles","detail","_ref","setInitialValues","find","e","target"],"mappings":"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","file":"select-list-fields.js","sourcesContent":["import { mounted } from 'component-utils';\r\nimport { hide, show } from 'ui-utils';\r\n\r\nonLoad();\r\n\r\ndocument.addEventListener('DOMContentUpdated', e => onLoad(e.target));\r\n\r\nexport function onLoad(context = document) {\r\n    context.querySelectorAll('.select-list-fields').forEach(element => {\r\n        const data = element.$data;\r\n        const fields = element.querySelectorAll('.field');\r\n\r\n        fields.forEach((field, index) => {\r\n            field.addEventListener('field:change', () => {\r\n                // Get the matching products for the current fields.\r\n                const products = data.products.filter(p => Array.from(fields).filter((_, i) => i <= index).every(f => p.fieldValues.some(fv => fv.field.id == f.dataset.fieldId && fv.value == data.fields[f.dataset.index])));\r\n\r\n                // Get the first product (if there are any).\r\n                let product = products.length > 0 ? products[0] : null;\r\n\r\n                // If there is a next field.\r\n                if (fields.length > index + 1) {\r\n                    // Get the next field.\r\n                    const nextField = fields[index + 1];\r\n\r\n                    // Update the items.\r\n                    updateItems(nextField, products);\r\n\r\n                    // Enable the field.\r\n                    nextField.disabled = false;\r\n\r\n                    // Reset the field values.\r\n                    Array.from(fields).filter((_, i) => i > index).forEach(field => data.fields[field.dataset.index] = '');\r\n\r\n                    // Disable any unreachable fields.\r\n                    Array.from(fields).filter((_, i) => i > index + 1).forEach(field => field.disabled = true);\r\n\r\n                    // Reset the product.\r\n                    product = null;\r\n                }\r\n\r\n                // Set the product.\r\n                data.product = product;\r\n\r\n                // Trigger the \"product:update\" event (this is disabled for product stock notifications).\r\n                if (element.dataset.dispatchProductChangeEvent !== 'false')\r\n                    element.dispatchEvent(new CustomEvent('product:update', { bubbles: true, detail: product }));\r\n            });\r\n        });\r\n\r\n        if (fields.length > 0) {\r\n            mounted(element, ({ product, products }) => {\r\n                updateItems(fields[0], products);\r\n\r\n                // If a product has been set then set the field values.\r\n                if (product != null && element.dataset.setInitialValues !== 'false')\r\n                    fields.forEach(field => {\r\n                        // Set the field value. Even though we set it in the view model, it will be reset when the \"field:change\" event is triggered.\r\n                        data.fields[field.dataset.index] = product.fieldValues.find(fv => fv.field.id == field.dataset.fieldId).value;\r\n\r\n                        // Trigger the \"field:change\" event. This will enable the fields and add the cannotOrderCssClass where applicable.\r\n                        field.dispatchEvent(new CustomEvent('field:change'));\r\n                    });\r\n            });\r\n        }\r\n\r\n        function updateItems(field, products) {\r\n            field.querySelectorAll('.item').forEach(item => {\r\n                const filteredProducts = products.filter(p => p.fieldValues.some(fv => fv.field.id == field.dataset.fieldId && fv.value == item.dataset.value));\r\n\r\n                if (filteredProducts.length > 0) {\r\n                    show(item, 0);\r\n\r\n                    // If there are no products available to order for this item then add the specified class (if applicable).\r\n                    if (element.dataset.cannotOrderCssClass) {\r\n                        if (!filteredProducts.some(p => p.canOrder))\r\n                            item.classList.add(element.dataset.cannotOrderCssClass);\r\n                        else\r\n                            item.classList.remove(element.dataset.cannotOrderCssClass);\r\n                    }\r\n                } else\r\n                    hide(item, 0);\r\n            });\r\n        }\r\n    });\r\n}"]}