test(fixtures): add vite-kitchen fixture repo
Minimal Vite + React + TS + Tailwind app with a typed-props Button component (the future react-docgen-typescript scan target), landed at fixtures/ outside the pnpm workspace and turbo graph. Its dependencies exist on paper only — the runner installs them after cloning (story 04); no lockfile, never pnpm-installed here. Ignore surfaces follow the docs/product/reference precedent: fallow, root ESLint, prettier, and the coverage:diff ALLOWED_GLOBS all skip fixtures/**. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_016j8z4VHjedXDTjEDNg7qHK
This commit is contained in:
45
fixtures/vite-kitchen/src/components/Button.tsx
Normal file
45
fixtures/vite-kitchen/src/components/Button.tsx
Normal file
@@ -0,0 +1,45 @@
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
export interface ButtonProps {
|
||||
/** Visual emphasis of the button. */
|
||||
variant?: "primary" | "secondary" | "ghost";
|
||||
/** Control scale — padding and font size. */
|
||||
size?: "sm" | "md" | "lg";
|
||||
/** Disables interaction and dims the control. */
|
||||
disabled?: boolean;
|
||||
/** Button label content. */
|
||||
children: ReactNode;
|
||||
}
|
||||
|
||||
const variantClasses: Record<NonNullable<ButtonProps["variant"]>, string> = {
|
||||
primary: "bg-blue-600 text-white hover:bg-blue-700",
|
||||
secondary: "bg-slate-200 text-slate-900 hover:bg-slate-300",
|
||||
ghost: "bg-transparent text-blue-600 hover:bg-blue-50",
|
||||
};
|
||||
|
||||
const sizeClasses: Record<NonNullable<ButtonProps["size"]>, string> = {
|
||||
sm: "px-2.5 py-1.5 text-sm",
|
||||
md: "px-4 py-2 text-base",
|
||||
lg: "px-6 py-3 text-lg",
|
||||
};
|
||||
|
||||
/**
|
||||
* The kitchen's one interactive component. Its name and typed props are the
|
||||
* target of the registry scan (react-docgen-typescript) in later stories.
|
||||
*/
|
||||
export function Button({
|
||||
variant = "primary",
|
||||
size = "md",
|
||||
disabled = false,
|
||||
children,
|
||||
}: ButtonProps) {
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
className={`rounded-md font-medium transition-colors disabled:cursor-not-allowed disabled:opacity-50 ${variantClasses[variant]} ${sizeClasses[size]}`}
|
||||
disabled={disabled}
|
||||
>
|
||||
{children}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user