mirror of
https://github.com/Rain-kl/OpenFlare.git
synced 2026-10-01 14:46:36 +08:00
33 lines
896 B
TypeScript
33 lines
896 B
TypeScript
import { cn } from '@/lib/utils/cn';
|
||
|
||
export function RuleChip({
|
||
label,
|
||
tone,
|
||
onRemove,
|
||
}: {
|
||
label: string;
|
||
tone: 'whitelist' | 'blacklist';
|
||
onRemove: () => void;
|
||
}) {
|
||
return (
|
||
<span
|
||
className={cn(
|
||
'inline-flex items-center gap-2 rounded-full border px-3 py-2 text-sm',
|
||
tone === 'whitelist'
|
||
? 'border-emerald-500/30 bg-emerald-500/18 text-[var(--foreground-primary)]'
|
||
: 'border-rose-500/30 bg-rose-500/18 text-[var(--foreground-primary)]',
|
||
)}
|
||
>
|
||
<span className="break-all">{label}</span>
|
||
<button
|
||
type="button"
|
||
onClick={onRemove}
|
||
className="inline-flex h-5 w-5 items-center justify-center rounded-full border border-current/20 text-xs text-[var(--foreground-primary)] transition hover:bg-black/10"
|
||
aria-label={`移除 ${label}`}
|
||
>
|
||
×
|
||
</button>
|
||
</span>
|
||
);
|
||
}
|