feat(data-table): add size prop to action components

Add size prop configuration to action components in data table to allow consistent sizing. Update dropdown action component to accept size prop with default value.
This commit is contained in:
Khafid Prayoga
2025-09-02 16:25:32 +07:00
parent 664849e15b
commit add19f33a2
3 changed files with 14 additions and 4 deletions
+3
View File
@@ -71,6 +71,9 @@ export const funcComponent: RecStrFuncComponent = {
idx,
rec: rec as object,
component: action,
props: {
size: 'sm',
},
}
return res
},
@@ -55,7 +55,9 @@ v-for="(h, idx) in header[0]" :key="`head-${idx}`" class="border"
<component
:is="funcComponent[key]?.(row, rowIndex).component"
v-if="funcComponent[key]"
v-bind="funcComponent[key]?.(row, rowIndex)"
:rec="row"
:idx="rowIndex"
v-bind="funcComponent[key]?.(row, rowIndex).props"
/>
<!-- If funcParsed or funcHtml returns a value -->
<template v-else>
@@ -1,9 +1,14 @@
<script setup lang="ts">
import type { LinkItem, ListItemDto } from './types'
const props = defineProps<{
interface Props {
rec: ListItemDto
}>()
size?: 'default' | 'sm' | 'lg'
}
const props = withDefaults(defineProps<Props>(), {
size: 'lg',
})
const recId = inject<Ref<number>>('rec_id')!
const recAction = inject<Ref<string>>('rec_action')!
@@ -44,7 +49,7 @@ const linkItems: LinkItem[] = [
<DropdownMenu>
<DropdownMenuTrigger as-child>
<SidebarMenuButton
size="lg"
:size="size"
class="data-[state=open]:text-sidebar-accent-foreground data-[state=open]:bg-white"
>
<Icon name="i-lucide-chevrons-up-down" class="ml-auto size-4" />