{"version":3,"file":"prod-image-choice.042d9609190a3b5296ff.js","mappings":"0KAESA,MAAM,oBAAoBC,KAAK,c,EAFxC,2D,EAAA,c,GAAAC,IAAA,EAeoBF,MAAM,iEAAiEG,IAAI,GAAGC,IAAI,I,GACzFJ,MAAM,yB,GACHA,MAAM,uB,GAjBtBE,IAAA,EAkB2DF,MAAM,0B,GAazDK,EAAAA,EAAAA,IAEM,OAFDL,MAAM,sBAAsB,cAAY,Q,EAC3CK,EAAAA,EAAAA,IAAmK,OAA9JL,MAAM,qBAAqBM,MAAM,6BAA6BC,QAAQ,kB,EAAiBF,EAAAA,EAAAA,IAAiE,QAA3DG,EAAE,8DAAuD,GASrK,SACEC,MAAO,CAAC,UACRC,MAAO,CACLC,MAAO,CACLC,UAAU,GAEZC,WAAY,CACVC,KAAMC,MACNH,UAAU,GAEZI,aAAc,CACZF,KAAMG,QACNC,SAAS,IAGbC,KAAAA,CAAMT,EAAKU,GAAU,IAAR,KAACC,GAAKD,EAEjB,MAAME,GAAeC,EAAAA,EAAAA,IAAIb,EAAMC,OACzBK,GAAeO,EAAAA,EAAAA,IAAIb,EAAMM,cACzBH,GAAaU,EAAAA,EAAAA,IAAIb,EAAMG,YASvBW,EAAeA,KACnBH,EAAK,SAAUC,EAAaG,MAAM,EAOpC,OAJAC,EAAAA,EAAAA,KAAM,IAAMhB,EAAMC,QAAQgB,IACxBL,EAAaG,MAAQE,CAAQ,IAGxB,CACLC,aAhBoBC,IACjBA,EAAOC,aAAed,EAAaS,QAEtCH,EAAaG,MAAQI,EAAOE,MAC5BP,IAAc,EAadF,eACAN,eACAH,aAEJ,GC9EF,MAEA,GAFiC,E,QAAA,GAAgB,EAAQ,CAAC,CAAC,S,wCDJzDmB,EAAAA,EAAAA,IAmCW,kBAlCT3B,EAAAA,EAAAA,IAiCM,MAjCN4B,EAiCM,gBAhCJD,EAAAA,EAAAA,IA+BME,EAAAA,GAAA,MAlCZC,EAAAA,EAAAA,IAIkCC,EAAAvB,YAJlC,CAIgBgB,EAAQQ,M,WADlBL,EAAAA,EAAAA,IA+BM,OA7BH9B,IAAK2B,EAAOE,MACZ/B,OANTsC,EAAAA,EAAAA,IAAA,gEAMkFT,EAAOC,aAAeM,EAAApB,cAAe,CAAH,yBAA8Ba,EAAOE,QAAUK,EAAAd,gBAC3JrB,KAAK,QACJ,eAAc4B,EAAOE,QAAUK,EAAAd,aAAe,OAAS,QACvDG,MAAOI,EAAOE,MACd,aAAYF,EAAOU,KACnBC,SAAUH,EACVI,QAAKC,GAAEN,EAAAR,aAAaC,I,CAEVA,EAAOc,MAAQd,EAAOc,KAAKC,MAAQf,EAAOc,KAAKC,KAAKC,MAAG,WAAlEb,EAAAA,EAAAA,IAAwM,OAdhN9B,IAAA,EAc4EF,MAAM,iEAAkEG,IAAK0B,EAAOc,KAAKC,KAAKC,IAAMzC,IAAKyB,EAAOc,KAAKC,KAAKE,S,OAdtMC,MAAA,WAeQf,EAAAA,EAAAA,IAAkG,MAAlGgB,KACA3C,EAAAA,EAAAA,IAcM,MAdN4C,EAcM,EAbJ5C,EAAAA,EAAAA,IAAiH,OAAjH6C,GAAiHC,EAAAA,EAAAA,IAA5EtB,EAAOc,MAAQd,EAAOc,KAAKS,MAAQvB,EAAOc,KAAKS,MAAQvB,EAAOU,MAAI,GAC3FV,EAAOc,MAAQd,EAAOc,KAAKU,WAAQ,WAA/CrB,EAAAA,EAAAA,IAAiH,OAAjHsB,GAAiHH,EAAAA,EAAAA,IAA9BtB,EAAOc,KAAKU,UAAQ,KAlBjHE,EAAAA,EAAAA,IAAA,YAmBUA,EAAAA,EAAAA,IAAA,szCAYFC,GAEM,GAjCdC,M","sources":["webpack://secprint-frontend/./src/js/vuejs/components/commerce/fields/ImageChoiceListField.vue","webpack://secprint-frontend/./src/js/vuejs/components/commerce/fields/ImageChoiceListField.vue?f62b"],"sourcesContent":["<template>\r\n  <fieldset>\r\n    <div class=\"choice-image-list\" role=\"radiogroup\">\r\n      <div\r\n        v-for=\"(option, index) in attributes\"\r\n        :key=\"option.alias\"\r\n        :class=\"['choice-image choice-image--centred', {'choice-image--disabled': option.isDisabled && !hideDisabled}, {'choice-image--selected': option.alias === currentModel}]\"\r\n        role=\"radio\"\r\n        :aria-checked=\"option.alias === currentModel ? 'true' : 'false'\"\r\n        :value=\"option.alias\"\r\n        :aria-label=\"option.name\"\r\n        :tabindex=\"index\"\r\n        @click=\"selectOption(option)\"\r\n      >\r\n        <img v-if=\"option.info && option.info.icon && option.info.icon.url\" class=\"choice-image__image image-aspect-ratio image-aspect-ratio--1-1\" :src=\"option.info.icon.url\" :alt=\"option.info.icon.altText\"/>\r\n        <img v-else class=\"choice-image__image image-aspect-ratio image-aspect-ratio--1-1\" src=\"\" alt=\"\"/>\r\n        <div class=\"choice-image__content\">\r\n          <span class=\"choice-image__title\">{{ option.info && option.info.title ? option.info.title : option.name }}</span>\r\n          <span v-if=\"option.info && option.info.subtitle\" class=\"choice-image__subtitle\">{{ option.info.subtitle }}</span>\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        <div class=\"choice-image__input\" aria-hidden=\"true\">\r\n          <svg class=\"choice-image__icon\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 -960 960 960\"><path d=\"M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z\"/></svg>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </fieldset>\r\n</template>\r\n<script>\r\nimport { ref, watch  } 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    attributes: {\r\n      type: Array,\r\n      required: true\r\n    },\r\n    hideDisabled: {\r\n      type: Boolean,\r\n      default: false,\r\n    }\r\n  },\r\n  setup(props, {emit}) {\r\n    // const optionValue = ref(props.model || (props.attributes.length > 0 ? props.attributes[0].alias : null));\r\n    const currentModel = ref(props.model);\r\n    const hideDisabled = ref(props.hideDisabled);\r\n    const attributes = ref(props.attributes);\r\n\r\n    const selectOption = (option) => {\r\n      if(option.isDisabled && !hideDisabled.value )return;\r\n\r\n      currentModel.value = option.alias;\r\n      handleChange();\r\n    };\r\n\r\n    const handleChange = () => {\r\n      emit('change', currentModel.value);\r\n    };\r\n\r\n    watch(() => props.model, (newValue) => {\r\n      currentModel.value = newValue;\r\n    });\r\n\r\n    return {\r\n      selectOption,\r\n      currentModel,\r\n      hideDisabled,\r\n      attributes\r\n    }\r\n  },\r\n};\r\n</script>","import { render } from \"./ImageChoiceListField.vue?vue&type=template&id=ac86cc38\"\nimport script from \"./ImageChoiceListField.vue?vue&type=script&lang=js\"\nexport * from \"./ImageChoiceListField.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__"],"names":["class","role","key","src","alt","_createElementVNode","xmlns","viewBox","d","emits","props","model","required","attributes","type","Array","hideDisabled","Boolean","default","setup","_ref","emit","currentModel","ref","handleChange","value","watch","newValue","selectOption","option","isDisabled","alias","_createElementBlock","_hoisted_1","_Fragment","_renderList","$setup","index","_normalizeClass","name","tabindex","onClick","$event","info","icon","url","altText","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_toDisplayString","title","subtitle","_hoisted_7","_createCommentVNode","_hoisted_8","_hoisted_2"],"sourceRoot":""}