mirror of
https://github.com/AmruthPillai/Reactive-Resume.git
synced 2026-08-24 07:12:18 +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
53 lines
1.9 KiB
TypeScript
53 lines
1.9 KiB
TypeScript
import type * as React from "react";
|
|
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@reactive-resume/ui/components/accordion";
|
|
|
|
const wrap: React.CSSProperties = { width: 420, padding: 16 };
|
|
|
|
// Open by default so the panel content is visible in the card (Base UI accordion
|
|
// is uncontrolled via defaultValue, matching item `value` props).
|
|
export const Sections = () => (
|
|
<div style={wrap}>
|
|
<Accordion defaultValue={["experience"]}>
|
|
<AccordionItem value="experience">
|
|
<AccordionTrigger>Work Experience</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p>Senior Product Designer · Framer — 2021 to Present</p>
|
|
<p>Led the redesign of the onboarding flow, lifting activation by 24% across web and mobile.</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="education">
|
|
<AccordionTrigger>Education</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p>B.Des in Interaction Design · Rhode Island School of Design</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="skills">
|
|
<AccordionTrigger>Skills</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p>Figma, prototyping, design systems, user research, and front-end handoff.</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
</Accordion>
|
|
</div>
|
|
);
|
|
|
|
export const MultipleOpen = () => (
|
|
<div style={wrap}>
|
|
<Accordion multiple defaultValue={["summary", "certifications"]}>
|
|
<AccordionItem value="summary">
|
|
<AccordionTrigger>Professional Summary</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p>Full-stack engineer with eight years shipping resilient TypeScript services and design systems.</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
<AccordionItem value="certifications">
|
|
<AccordionTrigger>Certifications</AccordionTrigger>
|
|
<AccordionContent>
|
|
<p>AWS Solutions Architect · Professional</p>
|
|
<p>Certified Kubernetes Administrator</p>
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
</Accordion>
|
|
</div>
|
|
);
|