Skip to main content

New: Sheet component in @trackunit/react-components

A new Sheet component is now available in @trackunit/react-components. It provides a bottom-sheet UI with snap points, gesture support, and container-scoped rendering — suitable for mobile and responsive layouts.

New exports​

Sheet component​

A bottom-sheet overlay with snap points and gesture-driven open/close/expand behaviour.

useSheet hook​

Manages open/close state and dismiss options for a Sheet.

useSheetSnap hook​

Controls the snap point of an open sheet: dock, fit, expand, or close.

useOverflowBorder hook​

Detects top/bottom scroll overflow in a container and applies CSS border classes — useful for indicating scrollable content inside a sheet.

Shared overlay-dismissible types​

The following types are now exported from @trackunit/react-components and shared across overlay components:

  • CloseReason
  • DismissOptions
  • OnBeforeCloseFn
  • OnCloseFn
  • OnOpenChangeFn
  • OnOpenFn
  • UseOverlayDismissibleProps
  • UseOverlayDismissibleReturn

Sheet-specific types and constants​

  • Types: SheetProps, UseSheetProps, UseSheetReturnValue, SheetDefaultSize, SheetVariant, SheetSnapActions, SheetState, SheetGeometry
  • Constants: SHEET_TRANSITION_DURATION, SHEET_TRANSITION_DURATION_MS, SHEET_TRANSITION_EASING