diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-11-08 09:06:24 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-11-08 09:06:24 +0300 |
commit | 1ef4b65f55f4fc6524a47050b4f6d686beb81d3a (patch) | |
tree | 3efc2710e564b86e5e2420d65457f656454006bb /app/assets/javascripts/vue_shared/components/slot_switch.vue | |
parent | 18a102a5b95198b6bc8db2589de6353997a33543 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/slot_switch.vue')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/slot_switch.vue | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/app/assets/javascripts/vue_shared/components/slot_switch.vue b/app/assets/javascripts/vue_shared/components/slot_switch.vue new file mode 100644 index 00000000000..67726f01744 --- /dev/null +++ b/app/assets/javascripts/vue_shared/components/slot_switch.vue @@ -0,0 +1,35 @@ +<script> +/** + * Allows to toggle slots based on an array of slot names. + */ +export default { + name: 'SlotSwitch', + + props: { + activeSlotNames: { + type: Array, + required: true, + }, + + tagName: { + type: String, + required: false, + default: 'div', + }, + }, + + computed: { + allSlotNames() { + return Object.keys(this.$slots); + }, + }, +}; +</script> + +<template> + <component :is="tagName"> + <template v-for="slotName in allSlotNames"> + <slot v-if="activeSlotNames.includes(slotName)" :name="slotName"></slot> + </template> + </component> +</template> |