Skip to content

feat(createNested): add active state management#137

Open
johnleider wants to merge 1 commit intomasterfrom
feat/nested-active
Open

feat(createNested): add active state management#137
johnleider wants to merge 1 commit intomasterfrom
feat/nested-active

Conversation

@johnleider
Copy link
Member

Summary

Adds active/highlighted state management to createNested, independent of selected (checked) and opened (expanded) states. This enables tree views, navigation drawers, and nested lists to track which item is currently "active" (e.g., the file open in an editor sidebar).

Three Independent States

State Controls Example
Selected (checked) v-model / checkbox Files checked for bulk delete
Opened (expanded) v-model:opened / toggle Folder showing children
Active (highlighted) v-model:active / activator Current file in sidebar

API Additions

Options

  • active: 'single' | 'multiple' — controls how many items can be active (default: 'single')

Context (tree-level)

  • activeIds — reactive Set<ID> of active item IDs
  • activeItems — computed Set of active item instances
  • activeIndexes — computed Set<number> of active item indexes (mirrors selectedIndexes)
  • activate(ids) — activate one or more items
  • deactivate(ids) — deactivate one or more items
  • activated(id) — check if an item is active
  • deactivateAll() — clear all active state

Ticket (per-item)

  • isActive — reactive ref
  • activate() — activate this item
  • deactivate() — deactivate this item

Registration

  • active: true — set initial active state on register

Behavior

  • Single mode: activating an item deactivates all others
  • Multiple mode: no limit on concurrent active items
  • Cleanup on unregister, clear, and cascade delete
  • Zero impact on existing selected/opened state

Checklist

  • TypeScript types updated
  • Implementation complete
  • All 2745 existing tests pass
  • Typecheck clean
  • Lint clean
  • Knip/Sherif clean

- Add activeIds, activeItems, activeIndexes reactive state
- Add activate/deactivate/activated/deactivateAll methods
- Add isActive/activate/deactivate to ticket interface
- Add NestedActiveMode type ('single' | 'multiple')
- Add active option to NestedOptions/NestedContextOptions
- Support initial active state via registration
- Clean up activeIds on unregister/clear
- Single mode: activating clears other active items
@pkg-pr-new
Copy link

pkg-pr-new bot commented Feb 13, 2026

Open in StackBlitz

commit: 8680e1d

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant