Skip to content

Home > @unseenco/backstage-core

backstage-core package

The library providing the runtime functionality of Backstage.js.

Functions

FunctionDescription
attachBackstagePageScroll(sheet, options)Wires page-mode scroll → sequence sync using configureBackstagePageScroll() or an explicit driver (Lenis, overflow containers, etc.).
attachGsapSequenceBridge(sheet)Drives registered GSAP animations from the sheet sequence playhead.
attachSheetScrollDriver(sheet, driver)Keeps sheet.sequence.position aligned with scroll progress in page mode. Progress maps to [0, sequence.length] (length is 100 in page mode).
configureBackstagePageScroll(config)
createDefaultPageScrollDriver(scroller, axis)
createElementHorizontalScrollDriver(element)Horizontal scroll on a custom overflow element.
createElementScrollDriver(element)Vertical scroll on a custom overflow element.
createNativeDocumentHorizontalScrollDriver()Native window / documentElement horizontal scroll.
createNativeDocumentScrollDriver()Native window / documentElement vertical scroll.
createRafDriver(conf)Creates a custom raf driver. rafDrivers allow you to control when and how often computations in Backstage tick forward. (raf stands for [requestAnimationFrame](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame… See the linked page for examples and full documentation.
getActivePageScrollContext()
getBackstagePageScrollConfig()
getBackstagePageScrollContext()Active page scroll context from configureBackstagePageScroll().
getProject(id, config)Returns a project of the given id, or creates one if it doesn't already exist.
getSheetScrollDriver(sheet)
isNativeDocumentScroller(scroller)
isPageScrollTrigger(st, context)True when ST scroller and horizontal flag match the configured page scroll context.
isRemoteEditorWindow()

A window is considered the "remote editor" for a project when its URL contains the editor hash, e.g. https://myapp.com/#editor. Every other window is a listener that mirrors whatever the editor window broadcasts.

This convention is shared with @unseenco/backstage/studio's "Open remote editor window" toolbar button, which opens a popup at the current URL with this hash set.

isVerticalPageScrollTrigger(st, context)
onChange(pointer, callback, rafDriver)Calls callback every time the pointed value of pointer changes.
pageScrollProgressFromSequence(sheet)
pageScrollScrollersMatch(a, b)Same scroller target for page-mode scroll registration (reference equality or both native doc).
resolvePageScrollAxis(context)
resolvePageScrollScroller(st, defaultsScroller)
setActivePageScrollContext(context)
setCoreRafDriver(driver)Sets the rafDriver that Backstage's core uses internally to tick forward. See the linked page for examples and full documentation.
setPageScrollProgress(sheet, progress)
syncNativeDocumentScrollToSequencePosition(sheet)Scroll the native document to match the current sequence playhead (page mode UI).
syncPageScrollToSequencePosition(sheet, driver)Scroll to match the current sequence playhead using the sheet's active driver.
val(pointer)Takes a Pointer and returns the value it points to.

Interfaces

InterfaceDescription
IProjectA Backstage.js project
IRafDriverPublic API for a custom requestAnimationFrame driver that advances Backstage's core ticker.
ISequencePublic API for a sheet's animation sequence (playback, playhead, and audio).
ISheetPublic API for a Backstage.js sheet (objects, sequence, and runtime lifecycle).
ISheetObjectPublic API for a Backstage.js sheet object (animated props and Studio integration).

Namespaces

NamespaceDescription
typesProp type factories (number, rgba, compound, etc.) for sheet.object() prop definitions.

Variables

VariableDescription
defaultPageScrollContext
notifyUser-facing notification helpers (success, warning, info, error) used by Backstage.js runtimes.
PAGE_MODE_SEQUENCE_LENGTHFixed sequence length in page mode (= 100% scroll range).
PAGE_MODE_SUB_UNITS_PER_UNITSub-units per unit in page mode: 10 → 0.1% snap steps.

Type Aliases

Type AliasDescription
__UNSTABLE_Project_OnDiskState

NOTE: **INTERNAL and UNSTABLE** - This _WILL_ break between minor versions.

This type represents the object returned by studio.createContnentOfSaveFile(). It's meant for advanced users who want to interact with the state of projects. In the vast majority of cases, you __should not__ use this type. Either an API for your use-case already exists, or you should open an issue on GitHub: https://github.com/craftedbygc/backstage/issues

AttachBackstagePageScrollOptions
BackstagePageScrollConfig
IProjectConfigOptions passed to getProject() when creating or attaching to a project.
ISheetObjectOptionsOptions for ISheet.object() beyond prop definitions (visibility, showPropsOf, etc.).
ISheetOptionsA project's config object (currently the only point of configuration is the project's state)
PageScrollAxis
PageScrollContext
PageScrollScrollernull = native document scroll (window / documentElement).
ScrollDriverMaps page scroll progress (0–1) to sequence position and back.
SheetSequenceModeHow the sheet sequence maps to the sequencer UI and playback driver.
UnknownShorthandCompoundPropsGiven an object like this, we have enough info to predict the compound prop