blob: 5c162a031b1315327b3b1e3311585b6bf6877e62 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
|
"use client"
import * as React from "react"
import { Button } from "@/components/ui/button"
import { TableIcon, LayoutGrid } from "lucide-react"
interface DataTableCompactToggleProps {
/**
* 현재 컴팩트 모드 상태
*/
isCompact: boolean
/**
* 컴팩트 모드 토글 시 호출될 함수
*/
onToggleCompact: () => void
}
export function DataTableCompactToggle({
isCompact,
onToggleCompact
}: DataTableCompactToggleProps) {
return (
<Button
variant="ghost"
size="sm"
onClick={onToggleCompact}
title={isCompact ? "확장 보기로 전환" : "컴팩트 보기로 전환"}
className="h-8 px-2"
>
{isCompact ? <LayoutGrid size={16} /> : <TableIcon size={16} />}
<span className="ml-2 text-xs">{isCompact ? "확장 보기" : "컴팩트 보기"}</span>
</Button>
)
}
|