Add align option

This commit is contained in:
Christian Cueni 2022-08-04 11:38:19 +02:00
parent 15adae1b30
commit 5ed546412f
2 changed files with 5 additions and 2 deletions

View File

@ -8,7 +8,8 @@ const props = defineProps<{
buttonText: string,
listItems: [
[object]
]
],
align: 'left' | 'right'
}>()
const emit = defineEmits<{
@ -36,7 +37,8 @@ const emit = defineEmits<{
leave-to-class="transform scale-95 opacity-0"
>
<MenuItems
class="absolute left-0 mt-2 px-6 w-56 origin-top-right divide-y divide-gray-500 bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none"
class="absolute mt-2 px-6 w-56 origin-top-right divide-y divide-gray-500 bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none"
:class="[align === 'left' ? 'left-0' : 'right-0']"
>
<div class="" v-for="section in listItems" :key="section">
<div class="px-1 py-1" v-for="item in section" :key="item">

View File

@ -338,6 +338,7 @@ function log(data: any) {
:button-classes="['btn-primary']"
:list-items="dropdownData"
:button-text="'Click me'"
:align="'left'"
@select="log"
/>
</div>