mirror of
https://github.com/AmruthPillai/Reactive-Resume.git
synced 2026-07-24 00:43:29 +10:00
Amruth Pillai
6e7fc68068
- Add `import type * as React from "react"` to the 26 previews that reference `React.CSSProperties` under the automatic JSX runtime (React isn't a global type namespace there, so the annotation was unresolved standalone). - Accordion preview: use `multiple` instead of `openMultiple` — @base-ui/react 1.6 renamed the prop, so the multi-open cell wasn't actually multi-open. Skipped CodeRabbit's BrandIcon dark-mode note: the preview renders in the default light card (the dark <img> is hidden there); per-theme sources would need component support it doesn't expose. Claude-Session: https://claude.ai/code/session_01R8Aq8F1nTuvJwfut7g3DVE
28 lines
1.0 KiB
TypeScript
28 lines
1.0 KiB
TypeScript
import type * as React from "react";
|
|
import { FormControl, FormDescription, FormItem, FormLabel, FormMessage } from "@reactive-resume/ui/components/form";
|
|
import { Input } from "@reactive-resume/ui/components/input";
|
|
|
|
// FormItem carries its own field context (id + error state) — FormLabel /
|
|
// FormControl / FormDescription / FormMessage compose under it standalone.
|
|
const wrap: React.CSSProperties = { display: "flex", flexDirection: "column", gap: 16, padding: 16, width: 340 };
|
|
|
|
export const Default = () => (
|
|
<div style={wrap}>
|
|
<FormItem>
|
|
<FormLabel>Headline</FormLabel>
|
|
<FormControl render={<Input placeholder="Senior Software Engineer" />} />
|
|
<FormDescription>Shown under your name at the top of the resume.</FormDescription>
|
|
</FormItem>
|
|
</div>
|
|
);
|
|
|
|
export const WithError = () => (
|
|
<div style={wrap}>
|
|
<FormItem hasError>
|
|
<FormLabel>Email</FormLabel>
|
|
<FormControl render={<Input defaultValue="jane@" />} />
|
|
<FormMessage errors={["Enter a valid email address."]} />
|
|
</FormItem>
|
|
</div>
|
|
);
|