npm package: @legendsdotfun/build
Description: LegendsBuild — 5-step startup pitch wizard component
Latest version: 0.1.5

# @legendsdotfun/build

A 5-step startup pitch wizard React component. Guides founders through structured exercises — from problem research to pitch delivery — with an optional resources panel for each step.

## Install

```bash
npm install @legendsdotfun/build
```

## Usage

```tsx
import { LegendsBuild } from "@legendsdotfun/build";
import "@legendsdotfun/build/styles";

function App() {
  return (
    <LegendsBuild
      onChange={(data) => console.log("Form changed", data)}
      onSubmit={(data) => console.log("Submitted", data)}
      onStepChange={(step) => console.log("Step", step)}
    />
  );
}
```

## Steps

| Step | Title                            | Fields                                                              |
| ---- | -------------------------------- | ------------------------------------------------------------------- |
| 1    | Problem Research                 | Target user, user journey, pain point, root cause, proof-of-pain links |
| 2    | Value Proposition, Positioning & MVP | Product name, one-liner, target users, outcome, differentiation, MVP link |
| 3    | Proof of Traction                | 3 KPIs with proof, current status, hackathon target                 |
| 4    | Growth Strategy                  | Go-to-market focus, distribution source/engine, long-term asset, defensibility |
| 5    | Pitch & Execution                | Pitch video URL, execution timeline                                 |

## Props

```ts
type LegendsBuildProps = {
  className?: string;
  initialData?: Partial<LegendsBuildData>;
  resources?: StepResources[];
  onChange?: (data: LegendsBuildData) => void;
  onSubmit?: (data: LegendsBuildData) => void;
  onStepChange?: (step: number) => void;
};
```

| Prop           | Description                                                        |
| -------------- | ------------------------------------------------------------------ |
| `className`    | Additional CSS class for the root container                        |
| `initialData`  | Pre-fill form fields (partial data is fine)                        |
| `resources`    | Custom resources per step (videos/links shown in the side panel). Falls back to built-in defaults. |
| `onChange`      | Called whenever any field changes                                   |
| `onSubmit`     | Called when the user submits on step 5                              |
| `onStepChange` | Called when the user navigates between steps                       |

## Custom Resources

Override the default resources panel by passing your own:

```tsx
import { LegendsBuild, StepResources } from "@legendsdotfun/build";

const resources: StepResources[] = [
  {
    step: 1,
    title: "Problem Research",
    resources: [
      {
        type: "video",
        url: "https://example.com/video",
        title: "How to validate a problem",
        description: "Learn to identify real pain points.",
      },
      {
        type: "link",
        url: "https://example.com/article",
        title: "Startup Ideas Guide",
        icon: "bulb",
      },
    ],
  },
  // ... steps 2-5
];

<LegendsBuild resources={resources} />
```

## Development

```bash
# Run the demo app
npm run dev

# Build the library
npm run build
```

## License

Private