Composables

Use this page for daily composable usage in app code after plugin setup is already stable.

Before you start

  • Plugin setup is complete and your app is already rendering with NuvexUI.
  • You need state-driven behavior from app code, not a new component abstraction.
  • You want practical usage of useTheme, useOverlayService, and useBreakpoint without duplicating theming internals.

Overview

These composables expose runtime behavior that components already use internally, so your app can coordinate state with the same contracts.

useTheme

Read and change active theme state from app-level UI controls and flows.

useOverlayService

Open, close, and stack overlays with shared outside click, escape, focus, and scroll behavior.

useBreakpoint

Branch UI behavior from reactive viewport ranges aligned with framework breakpoints.

useTheme for app-level controls

Use this composable to connect toggles and selectors to the active theme state without creating a parallel theme store.

Keep runtime operations here. For initial theme resolution, persistence strategy, and runtime theme registration details, continue on Runtime Theme API and Custom Themes.

Read and switch the active theme

useOverlayService for transient layers

Use this composable when custom overlays need the same lock scroll, focus, escape, and z-index behavior used by framework overlays.

Open and close overlays with shared behavior

useBreakpoint for responsive branching

Use reactive viewport ranges to branch layout density, navigation mode, and conditional UI blocks from app code.

Branch layout by viewport state

Compose multiple composables

Combine these composables to drive one coherent UI state instead of spreading responsiveness, overlays, and theming across disconnected stores.

Combine theme, breakpoint, and overlay state