39 lines
878 B
TypeScript
39 lines
878 B
TypeScript
"use client"
|
|
|
|
import { XIcon } from "lucide-react"
|
|
import { Badge } from "@/components/reui/badge"
|
|
import { Button } from "@/components/ui/button"
|
|
|
|
export interface SliceChip {
|
|
key: string
|
|
label: string
|
|
}
|
|
|
|
export function SliceChips({
|
|
chips,
|
|
onRemove,
|
|
}: {
|
|
chips: SliceChip[]
|
|
onRemove: (key: string) => void
|
|
}) {
|
|
if (!chips.length) return null
|
|
return (
|
|
<div className="flex flex-wrap items-center gap-1.5 border-b px-5 py-2">
|
|
{chips.map((chip) => (
|
|
<Badge key={chip.key} variant="outline" size="sm" className="gap-1 pr-0.5">
|
|
{chip.label}
|
|
<Button
|
|
type="button"
|
|
variant="ghost"
|
|
size="icon-xs"
|
|
aria-label={`Снять ${chip.label}`}
|
|
onClick={() => onRemove(chip.key)}
|
|
>
|
|
<XIcon />
|
|
</Button>
|
|
</Badge>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|