@voilajsx/uikit
Version:
Cross-platform React components with beautiful themes and OKLCH color sciences - Now with mobile (Capacitor) support
51 lines (50 loc) • 2 kB
JavaScript
import { jsx as o } from "react/jsx-runtime";
import { S as s } from "./index-DQH6odE9.js";
import { c as a } from "./index-Bke1qZdk.js";
import { c as d } from "./utils-CwJPJKOE.js";
const c = a(
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
{
variants: {
variant: {
default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
link: "text-primary underline-offset-4 hover:underline"
},
size: {
default: "h-10 px-5 py-2 has-[>svg]:px-4",
sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
lg: "h-12 rounded-md px-8 has-[>svg]:px-6",
icon: "size-9"
}
},
defaultVariants: {
variant: "default",
size: "default"
}
}
);
function b({
className: e,
variant: r,
size: t,
asChild: i = !1,
...n
}) {
return /* @__PURE__ */ o(
i ? s : "button",
{
"data-slot": "button",
className: d(c({ variant: r, size: t, className: e })),
...n
}
);
}
export {
b as Button,
c as buttonVariants
};
//# sourceMappingURL=button.js.map