@gitlab/ui
Version:
GitLab UI Components
90 lines (84 loc) • 2.27 kB
JavaScript
import { extend } from '../../vue';
import { NAME_DROPDOWN_ITEM } from '../../constants/components';
import { EVENT_NAME_CLICK } from '../../constants/events';
import { PROP_TYPE_ARRAY_OBJECT_STRING, PROP_TYPE_STRING } from '../../constants/props';
import { requestAF } from '../../utils/dom';
import { omit, sortKeys } from '../../utils/object';
import { makePropsConfigurable, makeProp, pluckProps } from '../../utils/props';
import { attrsMixin } from '../../mixins/attrs';
import { normalizeSlotMixin } from '../../mixins/normalize-slot';
import { props as props$1, BLink } from '../link/link';
// --- Props ---
const linkProps = omit(props$1, ['event', 'routerTag']);
const props = makePropsConfigurable(sortKeys({
...linkProps,
linkClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),
variant: makeProp(PROP_TYPE_STRING)
}), NAME_DROPDOWN_ITEM);
// --- Main component ---
// @vue/component
const BDropdownItem = /*#__PURE__*/extend({
name: NAME_DROPDOWN_ITEM,
mixins: [attrsMixin, normalizeSlotMixin],
inject: {
getBvDropdown: {
default: () => () => null
}
},
inheritAttrs: false,
props,
computed: {
bvDropdown() {
return this.getBvDropdown();
},
computedAttrs() {
return {
...this.bvAttrs,
role: 'menuitem'
};
}
},
methods: {
closeDropdown() {
// Close on next animation frame to allow <b-link> time to process
requestAF(() => {
if (this.bvDropdown) {
this.bvDropdown.hide(true);
}
});
},
onClick(event) {
this.$emit(EVENT_NAME_CLICK, event);
this.closeDropdown();
}
},
render(h) {
const {
linkClass,
variant,
active,
disabled,
onClick,
bvAttrs
} = this;
return h('li', {
class: bvAttrs.class,
style: bvAttrs.style,
attrs: {
role: 'presentation'
}
}, [h(BLink, {
staticClass: 'dropdown-item',
class: [linkClass, {
[`text-${variant}`]: variant && !(active || disabled)
}],
props: pluckProps(linkProps, this.$props),
attrs: this.computedAttrs,
on: {
click: onClick
},
ref: 'item'
}, this.normalizeSlot())]);
}
});
export { BDropdownItem, props };