Function DisclosureRow

packages/dev/s2-docs/src/DisclosureRow.tsx:68–91

({title, children, defaultExpanded})

});

export function DisclosureRow({title, children, defaultExpanded}) {
  let state = useDisclosureState({defaultExpanded});
  let ref = useRef(null);
  let {buttonProps} = useDisclosure({}, state, ref);
  // oxlint-disable-next-line react/react-compiler
  delete buttonProps['aria-controls']; // there is no panel element in this implementation

  return (
    <TableBody>
      <TableRow>
        <td colSpan={3} className={tableCell}>
          <Button
            {...buttonProps}
            className={p => buttonStyles({...p, isExpanded: state.isExpanded})}>
            {/* @ts-ignore */}
            <Chevron styles={chevronStyles({isExpanded: state.isExpanded})} />
            {title}
          </Button>
        </td>
      </TableRow>
      {state.isExpanded && children}
    </TableBody>
  );
}