@unseenco/theatre-core 0.4.2 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -782,6 +782,40 @@ type TransientPropPath = string | readonly (string | number)[];
782
782
  /** Same path format as {@link TransientPropPath}. */
783
783
  type StaticPropPath = TransientPropPath;
784
784
 
785
+ /** How the sheet sequence maps to the sequencer UI and playback driver. */
786
+ type SheetSequenceMode = 'time' | 'page';
787
+ /** Fixed sequence length in page mode (= 100% scroll range). */
788
+ declare const PAGE_MODE_SEQUENCE_LENGTH = 100;
789
+ /** Sub-units per unit in page mode: 10 → 0.1% snap steps. */
790
+ declare const PAGE_MODE_SUB_UNITS_PER_UNIT = 10;
791
+
792
+ /** Maps page scroll progress (0–1) to sequence position and back. */
793
+ type ScrollDriver = {
794
+ getProgress(): number;
795
+ setProgress(progress: number): void;
796
+ subscribe(onChange: (progress: number) => void): () => void;
797
+ };
798
+ declare function getSheetScrollDriver(sheet: ISheet): ScrollDriver | undefined;
799
+ /** Native `window` / `documentElement` vertical scroll. */
800
+ declare function createNativeDocumentScrollDriver(): ScrollDriver;
801
+ /** Native `window` / `documentElement` horizontal scroll. */
802
+ declare function createNativeDocumentHorizontalScrollDriver(): ScrollDriver;
803
+ /** Vertical scroll on a custom overflow element. */
804
+ declare function createElementScrollDriver(element: HTMLElement): ScrollDriver;
805
+ /** Horizontal scroll on a custom overflow element. */
806
+ declare function createElementHorizontalScrollDriver(element: HTMLElement): ScrollDriver;
807
+ /**
808
+ * Keeps `sheet.sequence.position` aligned with scroll progress in page mode.
809
+ * Progress maps to `[0, sequence.length]` (length is 100 in page mode).
810
+ */
811
+ declare function attachSheetScrollDriver(sheet: ISheet, driver?: ScrollDriver): () => void;
812
+ declare function pageScrollProgressFromSequence(sheet: ISheet): number;
813
+ declare function setPageScrollProgress(sheet: ISheet, progress: number): void;
814
+ /** Scroll to match the current sequence playhead using the sheet's active driver. */
815
+ declare function syncPageScrollToSequencePosition(sheet: ISheet, driver?: ScrollDriver): void;
816
+ /** Scroll the native document to match the current sequence playhead (page mode UI). */
817
+ declare function syncNativeDocumentScrollToSequencePosition(sheet: ISheet): void;
818
+
785
819
  /** Public API for a custom requestAnimationFrame driver that advances Theatre's core ticker. */
786
820
  interface IRafDriver {
787
821
  /**
@@ -950,7 +984,7 @@ interface ISheetObject<Props extends UnknownShorthandCompoundProps = UnknownShor
950
984
  * Calls `fn` every time the value of the props change.
951
985
  *
952
986
  * @param fn - The callback is called every time the value of the props change, plus once at the beginning.
953
- * @param rafDriver - (optional) The `rafDriver` to use. Learn how to use `rafDriver`s [from the docs](https://www.theatrejs.com/docs/latest/manual/advanced#rafdrivers).
987
+ * @param rafDriver - (optional) The `rafDriver` to use. Learn how to use `rafDriver`s [from the docs](https://unseen-theatre.netlify.app/docs/guide/manual/advanced#rafdrivers).
954
988
  * @returns an Unsubscribe function
955
989
  *
956
990
  * @example
@@ -1130,7 +1164,7 @@ interface ISequence {
1130
1164
  /**
1131
1165
  * Optionally provide a rafDriver to use for the playback. It'll default to
1132
1166
  * the core driver if not provided, which is a `requestAnimationFrame()` driver.
1133
- * Learn how to use `rafDriver`s [from the docs](https://www.theatrejs.com/docs/latest/manual/advanced#rafdrivers).
1167
+ * Learn how to use `rafDriver`s [from the docs](https://unseen-theatre.netlify.app/docs/guide/manual/advanced#rafdrivers).
1134
1168
  */
1135
1169
  rafDriver?: IRafDriver;
1136
1170
  }): Promise<boolean>;
@@ -1200,13 +1234,30 @@ interface ISequence {
1200
1234
  trackId: SequenceTrackId;
1201
1235
  clip: GsapClipTrack;
1202
1236
  }>;
1237
+ /**
1238
+ * Runtime ScrollTrigger registrations for page-mode visualization (read-only in Studio).
1239
+ *
1240
+ * @experimental
1241
+ */
1242
+ __experimental_getGsapScrollTriggers(): Array<{
1243
+ objectKey: string;
1244
+ scrollTriggerId: string;
1245
+ label: string;
1246
+ layout: {
1247
+ start: number;
1248
+ duration: number;
1249
+ };
1250
+ kind: 'tween' | 'timeline';
1251
+ animationSpanSeconds: number;
1252
+ timelineChildren: GsapTimelineChildClip[];
1253
+ }>;
1203
1254
  /**
1204
1255
  * Attaches an audio source to the sequence. Playing the sequence automatically
1205
1256
  * plays the audio source and their times are kept in sync.
1206
1257
  *
1207
1258
  * @returns A promise that resolves once the audio source is loaded and decoded
1208
1259
  *
1209
- * Learn more [here](https://www.theatrejs.com/docs/latest/manual/audio).
1260
+ * Learn more [here](https://unseen-theatre.netlify.app/docs/guide/manual/audio).
1210
1261
  *
1211
1262
  * @example
1212
1263
  * Usage:
@@ -1346,7 +1397,7 @@ interface ISheet {
1346
1397
  /**
1347
1398
  * Creates a child object for the sheet
1348
1399
  *
1349
- * **Docs: https://www.theatrejs.com/docs/latest/manual/objects**
1400
+ * **Docs: https://unseen-theatre.netlify.app/docs/guide/manual/objects**
1350
1401
  *
1351
1402
  * @param key - Each object is identified by a key, which is a non-empty string
1352
1403
  * @param props - The props of the object. See examples
@@ -1517,6 +1568,21 @@ interface ISheet {
1517
1568
  * Returns the currently active sequence variant name.
1518
1569
  */
1519
1570
  getActiveSequenceVariant(): SequenceVariantId;
1571
+ /**
1572
+ * Whether the sequence uses wall-clock time (default) or page-scroll percent units.
1573
+ * Page mode is runtime-only and not persisted in project state.
1574
+ */
1575
+ getSequenceMode(): 'time' | 'page';
1576
+ /**
1577
+ * Switches sequence units: `time` (seconds) or `page` (0–100 = scroll percent).
1578
+ * In page mode, length is fixed at 100 and snap grid uses 0.1% steps.
1579
+ */
1580
+ setSequenceMode(mode: 'time' | 'page'): void;
1581
+ /**
1582
+ * Overrides the scroll driver used in page mode (e.g. Lenis). Pass `undefined` to
1583
+ * restore native document scroll. Re-attaches the scroll → playhead listener.
1584
+ */
1585
+ setPageScrollDriver(driver: ScrollDriver | undefined): void;
1520
1586
  }
1521
1587
 
1522
1588
  /**
@@ -1527,11 +1593,28 @@ type ISheetOptions = {
1527
1593
  * Whether the sheet appears in the Studio outline panel. Defaults to `true`.
1528
1594
  */
1529
1595
  visible?: boolean;
1596
+ /**
1597
+ * How the sheet sequence maps to the sequencer UI and playback driver.
1598
+ * In **`page`** mode the sequence length is fixed at **100** (percent scroll) with **0.1%** snap steps;
1599
+ * native document scroll keeps the playhead in sync.
1600
+ *
1601
+ * @defaultValue `'time'`
1602
+ */
1603
+ sequenceMode?: SheetSequenceMode;
1604
+ /**
1605
+ * When `true`, enables the GSAP sequence bridge for this sheet (required for `@unseenco/theatre-gsap`).
1606
+ */
1607
+ gsap?: boolean;
1608
+ /**
1609
+ * Custom scroll driver for **`page`** mode (Lenis, overflow element, etc.).
1610
+ * When omitted in page mode, native document scroll is used.
1611
+ */
1612
+ scrollDriver?: ScrollDriver;
1530
1613
  };
1531
1614
  /** Options passed to {@link getProject} when creating or attaching to a project. */
1532
1615
  type IProjectConfig = {
1533
1616
  /**
1534
- * The state of the project, as [exported](https://www.theatrejs.com/docs/latest/manual/projects#state) by the studio.
1617
+ * The state of the project, as [exported](https://unseen-theatre.netlify.app/docs/guide/manual/projects#state) by the studio.
1535
1618
  */
1536
1619
  state?: $IntentionalAny;
1537
1620
  assets?: {
@@ -1571,11 +1654,11 @@ interface IProject {
1571
1654
  /**
1572
1655
  * Creates a Sheet under the project
1573
1656
  * @param sheetId - Sheets are identified by their `sheetId`, which must be a string longer than 3 characters
1574
- * @param instanceIdOrOpts - Optionally provide an `instanceId` if you want to create multiple instances of the same Sheet, or pass `{ visible: false }` to hide the sheet from the Studio outline panel
1575
- * @param opts - Optionally provide `{ visible: false }` to hide the sheet from the Studio outline panel
1657
+ * @param instanceIdOrOpts - Optionally provide an `instanceId`, or pass sheet options (e.g. `{ sequenceMode: 'page', gsap: true }`)
1658
+ * @param opts - Sheet options such as `{ visible: false }`, `sequenceMode`, or `gsap`
1576
1659
  * @returns The newly created Sheet
1577
1660
  *
1578
- * **Docs: https://www.theatrejs.com/docs/latest/manual/sheets**
1661
+ * **Docs: https://unseen-theatre.netlify.app/docs/guide/manual/sheets**
1579
1662
  */
1580
1663
  sheet(sheetId: string, instanceIdOrOpts?: string | ISheetOptions): ISheet;
1581
1664
  /**
@@ -1583,7 +1666,7 @@ interface IProject {
1583
1666
  *
1584
1667
  * @param sheetId - Sheets are identified by their `sheetId`, which must be a string longer than 3 characters
1585
1668
  * @param instanceId - Instance id when creating multiple instances of the same sheet
1586
- * @param opts - Optionally provide `{ visible: false }` to hide the sheet from the Studio outline panel
1669
+ * @param opts - Sheet options such as `{ visible: false }`, `sequenceMode`, or `gsap`
1587
1670
  * @returns The newly created Sheet
1588
1671
  */
1589
1672
  sheet(sheetId: string, instanceId: string, opts?: ISheetOptions): ISheet;
@@ -1705,13 +1788,64 @@ declare function setCoreRafDriver(driver: IRafDriver): void;
1705
1788
  */
1706
1789
  declare function isRemoteEditorWindow(): boolean;
1707
1790
 
1791
+ /**
1792
+ * Drives registered GSAP animations from the sheet sequence playhead.
1793
+ *
1794
+ * @returns Disposer — call to detach the bridge.
1795
+ */
1796
+ declare function attachGsapSequenceBridge(sheet: ISheet): () => void;
1797
+
1798
+ /** `null` = native document scroll (window / documentElement). */
1799
+ type PageScrollScroller = Window | Element | null;
1800
+ type PageScrollAxis = 'vertical' | 'horizontal';
1801
+ type PageScrollContext = {
1802
+ scroller: PageScrollScroller;
1803
+ /** Scroll axis for page mode and ScrollTrigger registration (default vertical). */
1804
+ axis?: PageScrollAxis;
1805
+ };
1806
+ declare const defaultPageScrollContext: PageScrollContext;
1807
+ declare function setActivePageScrollContext(context: PageScrollContext): void;
1808
+ declare function getActivePageScrollContext(): PageScrollContext;
1809
+ declare function resolvePageScrollAxis(context?: PageScrollContext): PageScrollAxis;
1810
+ declare function resolvePageScrollScroller(st: unknown, defaultsScroller?: PageScrollScroller): PageScrollScroller;
1811
+ declare function isNativeDocumentScroller(scroller: PageScrollScroller): boolean;
1812
+ /** Same scroller target for page-mode scroll registration (reference equality or both native doc). */
1813
+ declare function pageScrollScrollersMatch(a: PageScrollScroller, b: PageScrollScroller): boolean;
1814
+ /**
1815
+ * True when ST scroller and horizontal flag match the configured page scroll context.
1816
+ */
1817
+ declare function isPageScrollTrigger(st: unknown, context?: PageScrollContext): boolean;
1818
+ declare function isVerticalPageScrollTrigger(st: unknown, context?: PageScrollContext): boolean;
1819
+
1820
+ type TheatrePageScrollConfig = {
1821
+ /** Default scroller for page-mode layout helpers; `null` = native document. */
1822
+ scroller?: PageScrollScroller;
1823
+ /** Scroll axis (default vertical). */
1824
+ axis?: PageScrollAxis;
1825
+ };
1826
+ declare function configureTheatrePageScroll(config: TheatrePageScrollConfig): {
1827
+ reset: () => void;
1828
+ };
1829
+ declare function getTheatrePageScrollConfig(): TheatrePageScrollConfig;
1830
+ /** Active page scroll context from {@link configureTheatrePageScroll}. */
1831
+ declare function getTheatrePageScrollContext(): PageScrollContext;
1832
+ declare function createDefaultPageScrollDriver(scroller?: PageScrollScroller, axis?: PageScrollAxis): ScrollDriver;
1833
+ type AttachTheatrePageScrollOptions = {
1834
+ driver?: ScrollDriver;
1835
+ };
1836
+ /**
1837
+ * Wires page-mode scroll → sequence sync using {@link configureTheatrePageScroll}
1838
+ * or an explicit driver (Lenis, overflow containers, etc.).
1839
+ */
1840
+ declare function attachTheatrePageScroll(sheet: ISheet, options?: AttachTheatrePageScrollOptions): () => void;
1841
+
1708
1842
  /**
1709
1843
  * Returns a project of the given id, or creates one if it doesn't already exist.
1710
1844
  *
1711
1845
  * @remarks
1712
1846
  * If \@unseenco/theatre-studio is also loaded, then the state of the project will be managed by the studio.
1713
1847
  *
1714
- * [Learn more about exporting](https://www.theatrejs.com/docs/latest/manual/projects#state)
1848
+ * [Learn more about exporting](https://unseen-theatre.netlify.app/docs/guide/manual/projects#state)
1715
1849
  *
1716
1850
  * @example
1717
1851
  * Usage:
@@ -1736,7 +1870,7 @@ declare function getProject(id: string, config?: IProjectConfig): IProject;
1736
1870
  *
1737
1871
  * @param pointer - A Pointer (like `object.props.x`)
1738
1872
  * @param callback - The callback is called every time the value of pointer changes
1739
- * @param rafDriver - (optional) The `rafDriver` to use. Learn how to use `rafDriver`s [from the docs](https://www.theatrejs.com/docs/latest/manual/advanced#rafdrivers).
1873
+ * @param rafDriver - (optional) The `rafDriver` to use. Learn how to use `rafDriver`s [from the docs](https://unseen-theatre.netlify.app/docs/guide/manual/advanced#rafdrivers).
1740
1874
  * @returns An unsubscribe function
1741
1875
  *
1742
1876
  * @example
@@ -1790,4 +1924,4 @@ declare function val<T>(pointer: PointerType<T>): T;
1790
1924
  */
1791
1925
  type __UNSTABLE_Project_OnDiskState = OnDiskState;
1792
1926
 
1793
- export { IProject, IProjectConfig, IRafDriver, ISequence, ISheet, ISheetObject, ISheetObjectOptions, ISheetOptions, UnknownShorthandCompoundProps, __UNSTABLE_Project_OnDiskState, createRafDriver, getProject, isRemoteEditorWindow, notify, onChange, setCoreRafDriver, index_d as types, val };
1927
+ export { AttachTheatrePageScrollOptions, IProject, IProjectConfig, IRafDriver, ISequence, ISheet, ISheetObject, ISheetObjectOptions, ISheetOptions, PAGE_MODE_SEQUENCE_LENGTH, PAGE_MODE_SUB_UNITS_PER_UNIT, PageScrollAxis, PageScrollContext, PageScrollScroller, ScrollDriver, SheetSequenceMode, TheatrePageScrollConfig, UnknownShorthandCompoundProps, __UNSTABLE_Project_OnDiskState, attachGsapSequenceBridge, attachSheetScrollDriver, attachTheatrePageScroll, configureTheatrePageScroll, createDefaultPageScrollDriver, createElementHorizontalScrollDriver, createElementScrollDriver, createNativeDocumentHorizontalScrollDriver, createNativeDocumentScrollDriver, createRafDriver, defaultPageScrollContext, getActivePageScrollContext, getProject, getSheetScrollDriver, getTheatrePageScrollConfig, getTheatrePageScrollContext, isNativeDocumentScroller, isPageScrollTrigger, isRemoteEditorWindow, isVerticalPageScrollTrigger, notify, onChange, pageScrollProgressFromSequence, pageScrollScrollersMatch, resolvePageScrollAxis, resolvePageScrollScroller, setActivePageScrollContext, setCoreRafDriver, setPageScrollProgress, syncNativeDocumentScrollToSequencePosition, syncPageScrollToSequencePosition, index_d as types, val };