@shopify/shop-minis-react
Version:
React component library for Shopify Shop Minis with Tailwind CSS v4 support (source-only, requires TypeScript)
69 lines (68 loc) • 2.49 kB
JavaScript
import { jsx as s } from "react/jsx-runtime";
import { cva as i } from "../../shop-minis-react/node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
import { cn as o } from "../../lib/utils.js";
import { Root as d } from "../../shop-minis-react/node_modules/.pnpm/@radix-ui_react-slot@1.2.3_@types_react@19.1.6_react@19.1.0/node_modules/@radix-ui/react-slot/dist/index.js";
const p = i(
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:bg-disabled disabled:text-disabled-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none aria-invalid:border-destructive",
{
variants: {
variant: {
default: "bg-primary text-primary-foreground",
secondary: "bg-secondary text-secondary-foreground",
tertiary: "bg-tertiary text-tertiary-foreground",
destructive: "bg-destructive text-white dark:bg-destructive/60",
outline: "border bg-background dark:bg-input/30 dark:border-input",
ghost: "",
link: "text-primary underline-offset-4",
icon: "flex rounded-full items-center justify-center p-0 aspect-square"
},
size: {
default: "min-h-[32px] rounded-lg px-3 py-2 text-sm leading-[18px] has-[>svg]:px-3",
sm: "min-h-[20px] rounded-lg gap-1.5 px-3 py-1 text-xs leading-4 has-[>svg]:px-2.5",
lg: "min-h-[44px] rounded-xl px-3 py-3 text-base leading-6 has-[>svg]:px-4"
}
},
compoundVariants: [
{
variant: "icon",
size: "default",
className: "size-8 min-h-0 p-0 rounded-full gap-0 px-0 py-0 has-[>svg]:px-0"
},
{
variant: "icon",
size: "sm",
className: "size-6 min-h-0 p-0 rounded-full gap-0 px-0 py-0 has-[>svg]:px-0"
},
{
variant: "icon",
size: "lg",
className: "size-10 min-h-0 p-0 rounded-full gap-0 px-0 py-0 has-[>svg]:px-0"
}
],
defaultVariants: {
variant: "default",
size: "default"
}
}
);
function c({
className: e,
variant: t,
size: a,
asChild: n = !1,
...r
}) {
return /* @__PURE__ */ s(
n ? d : "button",
{
"data-slot": "button",
className: o(p({ variant: t, size: a, className: e })),
...r
}
);
}
export {
c as BaseButton,
p as buttonVariants
};
//# sourceMappingURL=button.js.map