dgz-ui
Version:
Custom ui library using React.js, Shadcn/ui, TailwindCSS, Typescript
51 lines (50 loc) • 2.04 kB
JavaScript
import { jsx as m } from "react/jsx-runtime";
import { S as n } from "./index-DvGm4EwH.es.js";
import { c as d } from "./index-xA4mlFw5.es.js";
import { forwardRef as c } from "react";
import { c as e } from "./utils-CnvKSirc.es.js";
const v = d(
e(
"inline-flex border border-border-alpha-strong items-center justify-center gap-2 whitespace-nowrap font-medium",
"[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
"transition-colors disabled:pointer-events-none disabled:opacity-50 cursor-pointer",
"focus:ring-2 focus:ring-offset-2 focus:ring-offset-bg focus:ring-item-primary-focus"
),
{
variants: {
variant: {
default: "bg-item-primary hover:bg-item-primary-hover active:bg-item-primary-active !text-white",
destructive: "bg-item-destructive hover:bg-item-destructive-hover active:bg-item-destructive-active focus:ring-2 focus:ring-item-destructive-focus !text-white",
secondary: "bg-item-secondary hover:bg-item-secondary-hover active:bg-item-secondary-active",
tertiary: "bg-item-tertiary hover:bg-item-tertiary-hover active:bg-item-tertiary-active border-0",
ghost: "bg-item-ghost hover:bg-item-ghost-hover active:bg-item-ghost-active border-0"
},
size: {
lg: "h-12 px-4 text-body-sm-medium [&>svg]:size-5 rounded-5",
default: "h-10 px-3 text-body-sm-medium [&>svg]:size-5 rounded-4",
sm: "h-8 px-2.5 text-body-xs-medium [&>svg]:size-4 rounded-3",
xs: "h-7 px-2 text-body-xs-medium [&>svg]:size-4 rounded-2",
icon: "h-10 w-10 text-body-xs-medium [&>svg]:size-4 rounded-3"
}
},
defaultVariants: {
variant: "default",
size: "default"
}
}
), g = c(
({ className: t, variant: i, size: r, asChild: o = !1, ...s }, a) => /* @__PURE__ */ m(
o ? n : "button",
{
className: e(v({ variant: i, size: r, className: t })),
ref: a,
...s
}
)
);
g.displayName = "Button";
export {
g as B,
v as b
};
//# sourceMappingURL=button-DTRIYqDb.es.js.map