@empathyco/x-components
Version:
Empathy X Components
70 lines (67 loc) • 1.99 kB
JavaScript
import { defineComponent, ref } from 'vue';
import { useXBus } from '../../../composables/use-x-bus.js';
import { searchXModule } from '../x-module.js';
/**.
* A banner result is just an item that has been inserted into the search results to advertise
* something. Usually it is the first item in the grid or it can be placed in the middle of them
* and fill the whole row where appears.
* The banner may be clickable or non-clickable depending on whether it has an associated URL
* or not. It contains an image and, optionally, a title. In case the image does not
* load due to an error the banner will not be rendered.
*
* Additionally, this component exposes the following props to modify the classes of the
* elements: `titleClass`.
*
* @public
*/
var _sfc_main = defineComponent({
name: 'Banner',
xModule: searchXModule.name,
props: {
/**
* The banner data.
*
* @public
*/
banner: {
type: Object,
required: true,
},
titleClass: String,
},
setup(props) {
const xBus = useXBus();
/**
* Flag to handle banner image errors.
*
* @public
*/
const imageFailed = ref(false);
/**
* Emits the banner click event.
*
* @internal
*/
const emitClickEvent = () => {
xBus.emit('UserClickedABanner', props.banner);
};
/**
* Returns the events supported by the anchor.
*
* @returns Events supported by the anchor.
*
* @internal
*/
const anchorEvents = () => ({
click: () => emitClickEvent(),
auxclick: () => emitClickEvent(),
contextmenu: () => emitClickEvent(),
});
return {
imageFailed,
anchorEvents,
};
},
});
export { _sfc_main as default };
//# sourceMappingURL=banner.vue2.js.map