Variable CollapseConst

Type Declaration

• • (props: CollapseProps): Element

  • Create a customized Material UI Collapse component.

    Parameters

    • props: CollapseProps

      All valid Material-UI Collapse props

    Returns Element

    The Collapse component

    Component

    Example

    // Basic usage
    <Collapse in={open}>
      <div>Collapsible content</div>
    </Collapse>
    
    // With timeout
    <Collapse
      in={open}
      timeout={300}
    >
      <Card>Collapsible card</Card>
    </Collapse>
    
    // With unmount on exit
    <Collapse
      in={open}
      unmountOnExit
    >
      <Typography>Content unmounts when collapsed</Typography>
    </Collapse>
    
    // With custom styling
    <Collapse
      in={open}
      className="custom-collapse"
      style={{ marginTop: 16 }}
    >
      <div>Styled collapse content</div>
    </Collapse>
    Copy

    Note

    For performance optimization in cases of frequent parent re-renders, consider wrapping this component with React.memo at the consumption level.

    See

    Collapse