@gitlab/ui
Version:
GitLab UI Components
105 lines (92 loc) • 2.67 kB
JavaScript
import Vue from 'vue';
import { intersperse, insert } from '../../../utils/data_utils';
import { isVnodeEmpty } from '../../../utils/is_slot_empty';
import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
const filterEmptyNodesVue2 = vNodes => vNodes.filter(vNode => typeof vNode.tag === 'string' || vNode.text.trim() !== '');
const {
Fragment
} = Vue;
const filterEmptyNodesVue3 = vNode => {
return vNode.reduce((acc, node) => {
if (Fragment && node.type === Fragment && Array.isArray(node.children)) {
acc.push(...node.children);
} else {
acc.push(node);
}
return acc;
}, []).filter(node => !isVnodeEmpty(node));
};
const filterEmptyNodes = Vue.version.startsWith('3') ? filterEmptyNodesVue3 : filterEmptyNodesVue2;
// handles the addition of the lastSeparator in these two cases:
// item1, item2, item3 => item1, item2, and item3
// item1, item2 => item1 and item2
const addLastSeparator = (lastSeparator, items) => {
if (!lastSeparator) {
return items;
}
if (items.length > 3) {
return insert(-1, lastSeparator, items);
}
// Replace the second-to-last item with lastSeparator
const result = [...items];
result[result.length - 2] = lastSeparator;
return result;
};
var script = {
name: 'GlIntersperse',
functional: true,
props: {
separator: {
type: String,
default: ', ',
required: false
},
lastSeparator: {
type: String,
default: '',
required: false
}
},
render(createElement, context) {
const {
props: {
separator,
lastSeparator
},
slots,
data
} = context;
const slotContent = slots().default || [];
const filtered = filterEmptyNodes(slotContent);
const separated = intersperse(separator, filtered);
const withLastSeparator = addLastSeparator(lastSeparator, separated);
return createElement('span', data, withLastSeparator);
}
};
/* script */
const __vue_script__ = script;
/* template */
/* style */
const __vue_inject_styles__ = undefined;
/* scoped */
const __vue_scope_id__ = undefined;
/* module identifier */
const __vue_module_identifier__ = undefined;
/* functional template */
const __vue_is_functional_template__ = undefined;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__ = /*#__PURE__*/__vue_normalize__(
{},
__vue_inject_styles__,
__vue_script__,
__vue_scope_id__,
__vue_is_functional_template__,
__vue_module_identifier__,
false,
undefined,
undefined,
undefined
);
export { __vue_component__ as default };