Skip to Content
UtilitiesOverview

Utilities

This page documents utility exports from src/lib/utils.ts and src/utilities/index.ts.

Core helper

cn

Class name merge helper based on clsx + tailwind-merge.

import { cn } from "@tesseract-nexus/tesserix-ui"

DOM and accessibility

  • Portal
  • VisuallyHidden
  • FocusTrap
  • ErrorBoundary

Theming

  • ThemeProvider
  • useTheme

Responsive helpers

  • useBreakpoint
  • useMediaQuery
  • Show
  • Hide

Animation helpers

  • FadeIn
  • SlideIn
  • ScaleIn
  • useAnimatedValue

Loading system

  • LoadingProvider
  • useLoading
  • LoadingSpinner
  • LoadingDots
  • LoadingOverlay
  • LoadingSkeleton

Example

import {
  ThemeProvider,
  ErrorBoundary,
  LoadingProvider,
  LoadingOverlay,
  FadeIn,
} from "@tesseract-nexus/tesserix-ui"

Implementation guidance

  • Wrap app roots with ThemeProvider and LoadingProvider when global behavior is needed.
  • Use ErrorBoundary at route/layout boundaries for localized fallback recovery.
  • Use Portal for overlays that must escape clipping/stacking contexts.
  • Prefer VisuallyHidden for screen-reader-only labels instead of display: none.

Utility reference pages

useAsynccn