Skip to content

refactor(list-item): improve layout system and remove implicit child composition #4930

@ruben-rebelo

Description

@ruben-rebelo

Refactor ListItem to improve Material Design 3 compliance, remove problematic children patterns, improve performance characteristics, and modernize the public API.

Problems

  • Current API relies heavily on children composition in ways that are difficult to optimize
  • Internal layout logic is tightly coupled to arbitrary child structures
  • MD3 behaviors and visuals are not fully aligned with current Material guidelines
  • Rendering performance can degrade in large lists or frequently updated screens
  • Type safety and discoverability of the API can be improved
  • The component has inconsistent behavior between platforms and edge cases

Focus Areas

  • Replace arbitrary child composition with explicit slots
  • Improve left/right accessory APIs
  • Standardize spacing and density
  • Improve multiline layout behavior
  • Improve virtualization friendliness

Proposed API Direction

Instead of:

<List.Item> <CustomContent /> </List.Item>

Prefer:

<List.Item title="Title" description="Description" left={...} right={...} />

Performance Opportunities

  • Improve rendering in FlatList usage
  • Memoize accessories
  • Reduce layout passes
  • Avoid child traversal

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions