export default function Example() {
  return (
    <Box
      css={{
        display: "flex",
        width: 500,
        rowGap: "$100",
        flexDirection: "column",
      }}
    >
      <Accordion.Root type={ACCORDION_TYPE.single} collapsible={true}>
        <Accordion.Item value={"item-1"}>
          <Accordion.Trigger density={ACCORDION_DENSITY.compact}>
            Here's some sample text for an accordion header item
          </Accordion.Trigger>
          <Accordion.Content>
            No! You don't even believe that! Gus has cameras everywhere, please.
            Listen to yourself! No, he has known everything, all along. Where
            were you today? In the lab? And you don't think it's possible that
            Tyrus lifted the cigarette out of your locker? Come on! Don't you
            see? You are the last piece of the puzzle. You are everything that
            he's wanted.
          </Accordion.Content>
        </Accordion.Item>
      </Accordion.Root>
    </Box>
  );
}

To enter the code editing mode, press Enter. To exit the edit mode, press Escape

You are editing the code. To exit the edit mode, press Escape