Hooks Overview

Asset Studio exposes all editor functionality through React hooks. Every hook must be called from a component inside <StudioProvider>.

Available Hooks

Hook	Description
useStudio	Core editor state — items, selection, add/update/delete operations, history
usePlayer	Timeline playback — play, pause, seek, duration
useDraw	Drawing tools — activate freehand or shape drawing mode
useExport	Export canvas to image or video
useZoom	Zoom level and pan position
useView	Grid visibility and snap-to-grid settings
useSession	Session validation status
useCrop	Crop mode for the selected image item

Quick Reference

import {
  useStudio,
  usePlayer,
  useDraw,
  useExport,
  useZoom,
  useView,
  useSession,
  useCrop,
} from "@asset-studio/core";

Hook Hierarchy

The hooks are organized around separate concerns:

StudioProvider
├── useStudio      — items, selection, document
├── usePlayer      — timeline & playback
├── useDraw        — drawing tools
├── useExport      — export
├── useZoom        — zoom & pan
├── useView        — grid & snap
├── useSession     — license & session
└── useCrop        — crop mode

All hooks are independent — you can use just the ones you need.