narraleaf-react 0.42.2 → 0.42.4

package/dist/game/nlcore/elements/transition/transitions/image/mask.d.ts

@@ -74,10 +74,24 @@ export type FanPatternOptions = {
 export type BlindsPatternOptions = {
     /** Slat orientation, or any CSS gradient angle in degrees. @default "horizontal" */
     orientation?: BlindsOrientation | number;
-    /** Number of slats. @default 8 */
+    /** Number of slats, rounded to a whole one. @default 8 */
     slats?: number;
     /** Width of each slat's soft edge, in percent of the frame. @default 0 (hard slats) */
     feather?: number;
+    /**
+     * How far apart the slats start, as a share of the run: `0` moves every slat
+     * together, `1` runs them strictly one after the next along the axis, and the
+     * values between overlap them. Whatever the spread, the last slat still
+     * finishes at `t = 1`, so the run is not lengthened - the earlier slats simply
+     * finish sooner. A negative value runs the delay back the other way along the
+     * axis (the last slat leads).
+     *
+     * A staggered blind costs one gradient layer per slat, where the unstaggered
+     * one is a single tiled gradient whatever `slats` says - so a high slat count
+     * is much the more expensive mask here.
+     * @default 0
+     */
+    stagger?: number;
 };
 export type DotsPatternOptions = {
     /** Number of tile rows. @default 6 */
@@ -135,8 +149,8 @@ export declare class Mask {
     static fan(options?: FanPatternOptions): MaskPattern;
     /**
      * Venetian slats widening until they cover the frame. Hard-edged by
-     * default; raise `feather` for soft slats, or pass an angle for slanted
-     * ones.
+     * default; raise `feather` for soft slats, pass an angle for slanted ones,
+     * or `stagger` them so they open in turn along the axis instead of together.
      */
     static blinds(options?: BlindsPatternOptions): MaskPattern;
     /**

package/dist/game/nlcore/elements/transition/transitions/image/transitionMaskUtils.d.ts

@@ -11,7 +11,18 @@ export type BlindsOrientation = "horizontal" | "vertical";
 export declare function clamp01(value: number): number;
 /** The `mask-image` triplet, mirrored to the `-webkit-` prefix for WebKit. */
 export declare function maskStyle(image: string, size?: string, repeat?: string): CSSProps;
-/** Full-bleed positioning for a synthetic colour overlay layer. */
+/**
+ * Full-bleed positioning for a synthetic colour overlay layer.
+ *
+ * The box reaches {@link OVERLAY_BLEED} past the frame on every side. The stage scales by a
+ * non-integer factor, so the images this covers are laid out at fractional sizes and the browser
+ * draws their outermost row of pixels with partial coverage; a colour box that matches the frame
+ * exactly stops at the whole pixel inside that row and leaves it showing, as a hairline of the
+ * picture along the top or the bottom edge. For a fade *through* a colour - which is meant to
+ * reach a frame of solid colour and hand the images over behind it - that hairline is the one
+ * thing the frame must not have. The layer is synthetic and has no content to distort, so
+ * growing it costs nothing.
+ */
 export declare function overlayBase(color: string): CSSProps;
 /** CSS gradient direction keyword for a wipe travelling toward `direction`. */
 export declare function wipeGradientDir(direction: TransformDefinitions.WipeDirection): string;