[Integration] useLazy system composable

[johnleider]

Summary

Integration improvements for useLazy with the v0 system.

Research Findings

v0 Implementation

Core Features:

• One-Way Booting: Once activated, stays booted until explicit reset
• Eager Mode: Static content renders immediately
• Transition Integration: onAfterLeave() resets on leave (unless eager)
• Three-State Logic: hasContent = isBooted || eager || active
• Reactive Options: All parameters support refs/getters

Vuetify 3 Comparison

Feature	v0	Vuetify 3
Core logic	✅ Identical	✅ Identical
Reactive eager	✅ Full support	⚠️ Props only
Return type	✅ Object with refs	✅ Same
API style	Composable-first	Props-based

Already Compatible ✅

Both implementations use the same formula:

hasContent = isBooted.value || eager || active

Vuetify 3 Usage

Used in: VWindow, VExpansionPanel, VOverlay

Pattern:

const { hasContent, onAfterLeave } = useLazy(props, isActive)

// Template
<Transition @after-leave="onAfterLeave">
  <div v-if="isOpen">
    <template v-if="hasContent">
      <!-- Heavy content -->
    </template>
  </div>
</Transition>

Integration Points

• Integration with useIntersectionObserver for viewport-based lazy loading
• Coordination with Dialog, Popover, Menu for deferred rendering
• SSR safety considerations
• Document composable vs props-based usage

Status

✅ Production-ready - Already compatible with V3

[johnleider]

Closed — production-ready, already compatible with V3 logic. Docs tracked separately.