@empathyco/x-components
Version:
Empathy X Components
128 lines (125 loc) • 4.35 kB
JavaScript
import { defineComponent, computed } from 'vue';
import { AnimationProp } from '../../types/animation-prop.js';
import { isArrayEmpty } from '../../utils/array.js';
/**
* Paints a list of suggestions passed in by prop. Requires a component for a single suggestion
* in the default slot for working.
*
* @public
*/
var _sfc_main = defineComponent({
name: 'BaseSuggestions',
props: {
/**
* The list of suggestions to render.
*
* @public
*/
suggestions: {
type: Array,
required: true,
},
/**
* Animation component that will be used to animate the suggestion.
*
* @public
*/
animation: {
type: AnimationProp,
default: 'ul',
},
/**
* Number of suggestions to be rendered.
*
* @public
*/
maxItemsToRender: Number,
/**
* Boolean value to indicate if the facets should be rendered.
*
* @public
*/
showFacets: {
type: Boolean,
default: false,
},
/**
* When `showFacets` property of `BaseSuggestions` component is true, it indicates if the suggestion without
* filter should be rendered.
*
* @public
*/
showPlainSuggestion: {
type: Boolean,
default: false,
},
/** Class inherited by content element. */
suggestionItemClass: String,
},
setup(props) {
/**
* Creates a suggestion for each one of the filter inside each facet.
*
* @param suggestion - Suggestion to expand.
* @returns A list of suggestions, each one with a single filter.
*
* @internal
*/
const expandSuggestionFilters = (suggestion) => {
return (suggestion.facets?.flatMap(facet => facet.filters.map(filter => ({
...suggestion,
facets: [{ ...facet, filters: [filter] }],
}))) ?? []);
};
/**
* Creates a list of suggestions to render based on the configuration of this component.
*
* @returns - The list of suggestions to be rendered by this component.
*
* @internal
*/
const suggestionsToRender = computed(() => props.suggestions
.flatMap(suggestion => props.showFacets && suggestion.facets?.length
? props.showPlainSuggestion
? [{ ...suggestion, facets: [] }, ...expandSuggestionFilters(suggestion)]
: expandSuggestionFilters(suggestion)
: { ...suggestion, facets: [] })
.slice(0, props.maxItemsToRender));
/**
* Generates a string from the given facet.
*
* @param facet - The facet to reduce to a string.
* @returns - A string representing the facet.
* @internal
*/
const getFacetKey = (facet) => facet.filters.map(filter => filter.id).join('&');
/**
* Generates a string from the given facets.
*
* @param facets - The list of facets to reduce to a string.
* @returns - A string representing the list of facets.
* @internal
*/
const getFacetsKey = (facets) => facets.map(getFacetKey).join('&');
/**
* An array with the unique keys for each suggestion. Required by the `v-for` loop.
*
* @returns An array with the unique keys of the suggestions.
* @internal
*/
const suggestionsKeys = computed(() => suggestionsToRender.value.map(suggestion => isArrayEmpty(suggestion.facets)
? suggestion.query
: `${suggestion.query}-in-${getFacetsKey(suggestion.facets)}`));
/**
* Returns the filter contained by the suggestion.
*
* @param suggestion - Suggestion containing the filter.
* @returns The suggestion filter.
* @internal
*/
const getSuggestionFilter = (suggestion) => suggestion.facets?.[0]?.filters[0];
return { suggestionsToRender, suggestionsKeys, getSuggestionFilter };
},
});
export { _sfc_main as default };
//# sourceMappingURL=base-suggestions.vue2.js.map