{"version":3,"file":"contentSearchFieldWrapper-BjKOb5Uj.js","sources":["../../../../Coloplast.UI/src/shared/components/contentLibrary/contentSearchField.vue","../../../../Coloplast.UI/src/shared/components/contentLibrary/contentLibraryWrappers/contentSearchFieldWrapper.vue"],"sourcesContent":["<template>\r\n\t<div class=\"c-content-search__wrapper\">\r\n\t\t<DsIconButton\r\n\t\t\t:class=\"isOnHero ? 'c-content-search__button': 'c-content-search__icon'\"\r\n\t\t\t@click=\"search\"\r\n\t\t\t@keydown.enter=\"search\"\r\n\t\t\ticon-name=\"search\"\r\n\t\t\tvariant=\"ghost-neutral\"\r\n\t\t\tdata-testid=\"search-button\"/>\r\n\t\t<input\r\n\t\t\tid=\"content-search-field\"\r\n\t\t\tv-model=\"searchPhrase\"\r\n\t\t\ttype=\"search\"\r\n\t\t\trole=\"search\"\r\n\t\t\tclass=\"c-content-search__field\"\r\n\t\t\t:placeholder=\"placeholder\"\r\n\t\t\tautocomplete=\"off\"\r\n\t\t\t@keydown.enter=\"search\"\r\n\t\t/>\r\n\t</div>\r\n</template>\r\n\r\n<script>\r\nimport { globalSearchEvents } from '../../settings/constants';\r\nimport { mapGetters, mapMutations } from 'vuex';\r\nimport { DsIconButton } from '@coloplast/design-system';\r\n\r\nexport default {\r\n    name: 'content-search-field',\r\n    props: ['placeholder', 'isOnHero'],\r\n    emits: [globalSearchEvents.SEARCH],\r\n    computed: {\r\n        ...mapGetters({\r\n            getContentSearchPhrase: 'getContentSearchPhrase',\r\n        }),\r\n        searchPhrase: {\r\n            get() {\r\n                return this.getContentSearchPhrase;\r\n            },\r\n            set(value) {\r\n                //if reset\r\n                if (!value.length && this.searchPhrase.length > 0) {\r\n                    this.$emit(globalSearchEvents.SEARCH);\r\n                }\r\n                this.setContentSearchPhrase(value);\r\n            },\r\n        },\r\n    },\r\n    methods: {\r\n        ...mapMutations(['setContentSearchPhrase']),\r\n        search() {\r\n            this.$emit(globalSearchEvents.SEARCH);\r\n        },\r\n    },\r\n    components: { DsIconButton }\r\n};\r\n</script>\r\n","<script setup>\r\nimport { ref } from \"vue\";\r\nimport ContentSearchField from 'shared/components/contentLibrary/contentSearchField.vue';\r\nimport { DsButton } from \"@coloplast/design-system\";\r\nimport useContentLibrary from 'shared/components/contentLibrary/composables/useContentLibrary';\r\n\r\nconst contentLibrary = ref(useContentLibrary());\r\n</script>\r\n\r\n<template>\r\n\t<div class=\"c-content-library__topcontainer\">\r\n\t\t<content-search-field\r\n\t\t\t:placeholder=\"contentLibrary.searchBarPlaceholder\"\r\n\t\t\t@search=\"contentLibrary.search\"\r\n\t\t\t:is-on-hero=\"contentLibrary.displaySearchOnHero\"\r\n\t\t/>\r\n\t\t<DsButton\r\n\t\t\tv-if=\"contentLibrary.contentFiltersAreVisible\"\r\n\t\t\tclass=\"c-content-library__topcontainer-button\"\r\n\t\t\t:class=\"{ 'c-content-filters__button--event-calendar': contentLibrary.isEventCalendar }\"\r\n\t\t\t@click=\"contentLibrary.setSidebarFilters('main')\"\r\n\t\t\t@keydown.enter.prevent=\"contentLibrary.setSidebarFilters('main')\"\r\n\t\t\t:variant=\"true ? 'functional' : 'ghost-neutral'\"\r\n\t\t\ticon-start=\"filter\"\r\n\t\t\tsize=\"sm\"\r\n\t\t\tdata-testid=\"content-library-filter-button\"\r\n\t\t\t>\r\n\t\t\t{{ contentLibrary.filtersLabel }}\r\n\t\t</DsButton>\r\n\t\t<DsButton\r\n\t\t\tv-if=\"contentLibrary.monthFiltersAreVisible\"\r\n\t\t\tclass=\"c-content-library__topcontainer-button\"\r\n\t\t\t:class=\"{ 'c-content-filters__button--event-calendar': contentLibrary.isEventCalendar }\"\r\n\t\t\t@click=\"contentLibrary.setSidebarFilters('month')\"\r\n\t\t\t@keydown.enter.prevent=\"contentLibrary.setSidebarFilters('month')\"\r\n\t\t\t:variant=\"true ? 'functional' : 'ghost-neutral'\"\r\n\t\t\ticon-start=\"calendar\"\r\n\t\t\tsize=\"sm\"\r\n\t\t\t>\r\n\t\t\t{{ contentLibrary.monthFiltersLabel }}\r\n\t\t</DsButton>\r\n\t</div>\r\n</template>\r\n\r\n<style lang=\"scss\">\r\n.c-content-library__topcontainer-button {\r\n    margin: 12px 12px 0 0;\r\n\r\n\t@media (min-width: 768px) {\r\n\t\tmargin: 0 0 0 12px;\r\n\t}\r\n}\r\n</style>\r\n"],"names":["_sfc_main","globalSearchEvents","mapGetters","value","mapMutations","DsIconButton","_hoisted_1","_openBlock","_createElementBlock","_createVNode","_component_DsIconButton","$props","$options","_createElementVNode","$event","args","contentLibrary","ref","useContentLibrary"],"mappings":"qZA2BA,MAAKA,EAAU,CACX,KAAM,uBACN,MAAO,CAAC,cAAe,UAAU,EACjC,MAAO,CAACC,EAAmB,MAAM,EACjC,SAAU,CACN,GAAGC,EAAW,CACV,uBAAwB,wBAC5B,CAAC,EACD,aAAc,CACV,KAAM,CACF,OAAO,KAAK,sBACf,EACD,IAAIC,EAAO,CAEH,CAACA,EAAM,QAAU,KAAK,aAAa,OAAS,GAC5C,KAAK,MAAMF,EAAmB,MAAM,EAExC,KAAK,uBAAuBE,CAAK,CACpC,CACJ,CACJ,EACD,QAAS,CACL,GAAGC,EAAa,CAAC,wBAAwB,CAAC,EAC1C,QAAS,CACL,KAAK,MAAMH,EAAmB,MAAM,CACvC,CACJ,EACD,WAAY,CAAEI,aAAAA,CAAa,CAC/B,EAtDMC,EAAA,CAAA,MAAM,2BAA2B,sEAAtC,OAAAC,EAAA,EAAAC,EAkBM,MAlBNF,EAkBM,CAjBLG,EAM8BC,EAAA,CAL5B,QAAOC,EAAQ,SAAA,2BAAA,wBAAA,EACf,QAAOC,EAAM,OACb,YAAeA,EAAM,OAAA,CAAA,OAAA,CAAA,EACtB,YAAU,SACV,QAAQ,gBACR,cAAY,2DACbC,EASE,QAAA,CARD,GAAG,4DACMD,EAAY,aAAAE,GACrB,KAAK,SACL,KAAK,SACL,MAAM,0BACL,YAAaH,EAAW,YACzB,aAAa,MACZ,gCAAeC,EAAM,QAAAA,EAAA,OAAA,GAAAG,CAAA,EAAA,CAAA,OAAA,CAAA,mBANbH,EAAY,YAAA,6HCLxB,MAAMI,EAAiBC,EAAIC,EAAiB,CAAE"}