FIG-001/ LAYOUTGROUP
scoped layoutId.
Two sibling tab strips share layoutId="underline". Each strip lives in its own <LayoutGroup id> so the underline animation stays scoped — clicking a tab in one strip never pulls the underline from the other.
- Same
layoutId="underline"appears in both tab strips. Without scoping, the underline would jump between strips becausemotionlooks uplayoutIdon a single global registry. - Wrapping each strip in
<LayoutGroup id="strip-a">/id="strip-b"prefixes the registry key —strip-a::underlinevsstrip-b::underline— so the two animations never see each other. - Click tabs across both strips: the underline always slides within its own strip. Try
removing the
<LayoutGroup>wrappers locally and the underline will jump across the page on every click.
category · layoutgroup
sheet · sheet 01 / 01
⟳ to re-run