30 lines
816 B
Vue
30 lines
816 B
Vue
<script setup>
|
|
import { twMerge } from "tailwind-merge";
|
|
import { defineProps } from "vue";
|
|
|
|
const props = defineProps({
|
|
open: Boolean,
|
|
items: Array,
|
|
title: String,
|
|
onClick: Function,
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div :class="twMerge('dropdown', open ? 'dropdown-open' : 'dropdown-close')">
|
|
<slot name="dropdownButton"></slot>
|
|
|
|
<ul
|
|
tabindex="0"
|
|
class="dropdown-content flex flex-col items-center justify-between px-3 text-base translate-y-2 z-50 py-3 shadow rounded min-w-max bg-[#4c625e] border text-center"
|
|
>
|
|
<li v-for="(item, index) in items" :key="item.key" class="w-full py-0">
|
|
<slot name="dropdownItem" v-bind="{ record: item, index }"></slot>
|
|
</li>
|
|
<slot name="dropdownAction"></slot>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped></style>
|