Maofeng
b3a7a2a8f5
Add composable wrappers for 37 Base UI component families. Expose primitive and convenience APIs with shared styling utilities. Add the registry manifest, installer CLI, generation and export checks. Include a smoke example covering primitive and shadcn-style imports.
27 lines
1.4 KiB
TypeScript
27 lines
1.4 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
import { Button as BaseButton } from "@base-ui/react/button"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
export type ButtonProps = React.ComponentPropsWithoutRef<typeof BaseButton> & {
|
|
className?: string
|
|
}
|
|
|
|
const BaseButtonElement = BaseButton as React.ElementType
|
|
|
|
export const Button = React.forwardRef<HTMLElement, ButtonProps>(
|
|
({ className, ...props }, ref) => (
|
|
<BaseButtonElement
|
|
ref={ref}
|
|
className={cn(
|
|
"flex h-8 items-center justify-center gap-2 rounded-none border border-neutral-950 bg-white px-3 text-sm leading-none whitespace-nowrap font-normal text-neutral-950 select-none [&:not([data-disabled]):hover]:bg-neutral-100 [&:not([data-disabled]):active]:bg-neutral-200 focus-visible:outline-2 focus-visible:outline-solid focus-visible:-outline-offset-1 focus-visible:outline-neutral-950 dark:focus-visible:outline-white data-disabled:cursor-default data-disabled:border-neutral-500 data-disabled:text-neutral-500 disabled:cursor-default disabled:border-neutral-500 disabled:text-neutral-500 dark:border-white dark:bg-neutral-950 dark:text-white dark:[&:not([data-disabled]):hover]:bg-neutral-800 dark:[&:not([data-disabled]):active]:bg-neutral-700 dark:data-disabled:border-neutral-400 dark:data-disabled:text-neutral-400",
|
|
className,
|
|
)}
|
|
{...props}
|
|
/>
|
|
),
|
|
)
|
|
|
|
Button.displayName = "Button"
|