70 lines
2.1 KiB
TypeScript
70 lines
2.1 KiB
TypeScript
import { cva } from "../lib/cva";
|
|
|
|
export const dropdownMenuContentVariants = cva(
|
|
[
|
|
"z-50 min-w-[12rem] overflow-hidden rounded-[var(--ui-panel-radius)] border border-[var(--ui-panel-border)] bg-[var(--ui-panel-bg)] p-1.5 text-[var(--color-card-foreground)] shadow-[var(--ui-panel-shadow)] outline-none",
|
|
"[border-width:var(--ui-panel-border-width)] backdrop-blur-[var(--ui-panel-backdrop-blur)]",
|
|
"data-[state=open]:motion-enter-rise data-[state=closed]:motion-exit-drop",
|
|
"data-[side=bottom]:origin-top data-[side=left]:origin-right data-[side=right]:origin-left data-[side=top]:origin-bottom"
|
|
],
|
|
{
|
|
variants: {
|
|
size: {
|
|
sm: "min-w-[11rem]",
|
|
md: "min-w-[13rem]",
|
|
lg: "min-w-[15rem]"
|
|
}
|
|
},
|
|
defaultVariants: {
|
|
size: "md"
|
|
}
|
|
}
|
|
);
|
|
|
|
export const dropdownMenuItemVariants = cva(
|
|
[
|
|
"relative flex cursor-default select-none items-center gap-2 rounded-[var(--ui-control-radius)] px-2.5 py-2 text-sm outline-none",
|
|
"text-[var(--color-foreground)] transition-colors duration-[var(--dur-fast)] ease-[var(--ease-standard)]",
|
|
"focus:bg-[var(--ui-control-bg)] focus:text-[var(--color-foreground)] data-[highlighted]:bg-[var(--ui-control-bg)] data-[highlighted]:text-[var(--color-foreground)]",
|
|
"data-[disabled]:pointer-events-none data-[disabled]:opacity-45"
|
|
],
|
|
{
|
|
variants: {
|
|
inset: {
|
|
false: "",
|
|
true: "pl-8"
|
|
},
|
|
variant: {
|
|
default: "",
|
|
destructive:
|
|
"text-[var(--color-destructive)] data-[highlighted]:bg-[color-mix(in_oklch,var(--color-destructive)_12%,var(--color-card))] data-[highlighted]:text-[var(--color-destructive)]"
|
|
}
|
|
},
|
|
defaultVariants: {
|
|
inset: false,
|
|
variant: "default"
|
|
}
|
|
}
|
|
);
|
|
|
|
export const dropdownMenuLabelVariants = cva(
|
|
[
|
|
"px-2.5 py-2 text-xs font-medium uppercase tracking-[var(--tracking-caps)] text-[var(--color-muted-foreground)]"
|
|
],
|
|
{
|
|
variants: {
|
|
inset: {
|
|
false: "",
|
|
true: "pl-8"
|
|
}
|
|
},
|
|
defaultVariants: {
|
|
inset: false
|
|
}
|
|
}
|
|
);
|
|
|
|
export const dropdownMenuSeparatorVariants = cva([
|
|
"-mx-1 my-1 h-px bg-[var(--color-border)]"
|
|
]);
|