mirror of
https://github.com/nextui-org/nextui.git
synced 2025-12-08 19:26:11 +00:00
* docs(components): accordion controlled example shows errors * docs(components): accordion controlled example shows errors * docs(components): accordion controlled example shows errors
65 lines
2.0 KiB
TypeScript
65 lines
2.0 KiB
TypeScript
const App = `import {Accordion, AccordionItem} from "@nextui-org/react";
|
|
|
|
export default function App() {
|
|
const [selectedKeys, setSelectedKeys] = React.useState(new Set(["1"]));
|
|
|
|
const defaultContent =
|
|
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.";
|
|
|
|
return (
|
|
<Accordion
|
|
selectedKeys={selectedKeys}
|
|
onSelectionChange={setSelectedKeys}
|
|
>
|
|
<AccordionItem key="1" aria-label="Accordion 1" title="Accordion 1">
|
|
{defaultContent}
|
|
</AccordionItem>
|
|
<AccordionItem key="2" aria-label="Accordion 2" title="Accordion 2">
|
|
{defaultContent}
|
|
</AccordionItem>
|
|
<AccordionItem key="3" aria-label="Accordion 3" title="Accordion 3">
|
|
{defaultContent}
|
|
</AccordionItem>
|
|
</Accordion>
|
|
);
|
|
}`;
|
|
|
|
const AppTs = `import type {Selection} from "@nextui-org/react";
|
|
|
|
import {Accordion, AccordionItem} from "@nextui-org/react";
|
|
|
|
export default function App() {
|
|
const [selectedKeys, setSelectedKeys] = React.useState<Selection>(new Set(["1"]));
|
|
const defaultContent =
|
|
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.";
|
|
return (
|
|
<Accordion
|
|
selectedKeys={selectedKeys}
|
|
onSelectionChange={setSelectedKeys}
|
|
>
|
|
<AccordionItem key="1" aria-label="Accordion 1" title="Accordion 1">
|
|
{defaultContent}
|
|
</AccordionItem>
|
|
<AccordionItem key="2" aria-label="Accordion 2" title="Accordion 2">
|
|
{defaultContent}
|
|
</AccordionItem>
|
|
<AccordionItem key="3" aria-label="Accordion 3" title="Accordion 3">
|
|
{defaultContent}
|
|
</AccordionItem>
|
|
</Accordion>
|
|
);
|
|
}`;
|
|
|
|
const react = {
|
|
"/App.jsx": App,
|
|
};
|
|
|
|
const reactTs = {
|
|
"/App.tsx": AppTs,
|
|
};
|
|
|
|
export default {
|
|
...react,
|
|
...reactTs,
|
|
};
|