Skip to content

[P1] Make conditional slot layouts reactive to dynamic content #22

Description

@Banegasn

Objective

Ensure slotted icons, actions, supporting text, and navigation controls added after first render appear and lay out correctly.

Evidence

Button, chip, list-item, snackbar, and top-app-bar call light-DOM queries during render and omit slot wrappers when content is absent. Adding/removing slotted content does not itself request a Lit update, and an omitted slot cannot emit slotchange to recover.

Scope

Always render slots with CSS-driven presence where possible, or introduce a small reusable slot-presence controller. Cover add/remove/reassign and cleanup across affected packages.

Acceptance criteria

  • Optional slotted content added after connection appears immediately.
  • Removing content collapses spacing immediately.
  • Slot reassignment updates the correct region.
  • No MutationObserver or listener leak occurs after reconnects.
  • Tests cover initial absent/present and dynamic transitions for each affected component family.

Dependencies

Blocked by #5 and #6.

Autonomous execution contract

Prefer native slot/CSS behavior; introduce observation only where the platform cannot express the layout.

Metadata

Metadata

Assignees

No one assigned

    Labels

    area: componentsComponent behavior, APIs, or stylingblockedBlocked by another issue or external decisionbugSomething isn't workingpriority: p1High-impact improvement

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions