asciify-engine 4.29.0 → 4.30.0

package/dist/kit.d.cts

@@ -1,4 +1,4 @@
-import { G as GlyphField, r as GlyphFieldOptions } from './glyph-field-C2fQIlnq.cjs';
+import { G as GlyphField, r as GlyphFieldOptions, m as FieldMark } from './glyph-field-DKWHAMml.cjs';
 import { C as CHARACTER_SETS } from './characters-BgECi5Lf.cjs';
 import './hover-guide-DdFnAnfU.cjs';
 
@@ -154,8 +154,18 @@ interface DecodeOptions extends KitOptions {
     text?: string;
     /** Total length in ms: the first 30% is drift alone, then the words resolve left to right. Default 800. */
     duration?: number;
-    /** `visible` decodes when the element scrolls into view; `manual` waits for `replay()`. Default `visible`. */
-    trigger?: 'visible' | 'manual';
+    /**
+     * `visible` decodes when the element scrolls into view; `manual` waits for `replay()`; `scroll` ties the decode to scroll
+     * position, resolving as the element rises into view and undoing as it leaves (and idling while the page is still). Default `visible`.
+     */
+    trigger?: 'visible' | 'manual' | 'scroll';
+    /**
+     * Flip through other alphabets before landing: `true` for the built-in set (kana, Hangul, accented Latin, Cyrillic, Greek, then
+     * digits and signs) or your own list, one string of letters per alphabet. Each flip fills every unresolved letter from one
+     * alphabet, drawn in the element's font at the letter's own place; letters lock left to right over the last 60% of the run.
+     * The default `duration` becomes 1400.
+     */
+    scramble?: boolean | string[];
     /** Decode again when the pointer enters. Default true. */
     replayOnHover?: boolean;
     /** `glyphs` keeps the headline in characters; `text` hands back to the crisp HTML text at the end. Default `glyphs`. */
@@ -165,6 +175,8 @@ interface DecodeHandle extends KitHandle<DecodeOptions> {
     /** Plays the decode again from the drift. */
     replay(): void;
 }
+/** The built-in alphabets `scramble: true` flips through. */
+declare const SCRAMBLE_SCRIPTS: string[];
 /** A headline that condenses out of a drifting field of characters, left to right through a flickering band. */
 declare function decode(element: HTMLElement, options?: DecodeOptions): DecodeHandle;
 
@@ -402,6 +414,13 @@ interface WordmarkOptions extends KitOptions {
     artHeight?: number;
     /** The canvas's accessible name when the word is not the element's own text. Default the word. */
     label?: string;
+    /**
+     * The word gathers out of scattered pieces: `visible` once as it scrolls into view (over `duration`), `scroll` with scroll
+     * position, scattering again as it leaves. Off under reduced motion. Default off.
+     */
+    assemble?: 'visible' | 'scroll' | false;
+    /** Ms the `visible` assembly takes. Default 1400. */
+    duration?: number;
 }
 interface WordmarkHandle extends KitHandle<WordmarkOptions> {
     /** Sets the word again, as large as fits. */
@@ -665,9 +684,13 @@ interface PageDissolveHandle extends KitHandle<PageDissolveOptions> {
 /** A page or panel transition: one wave of characters from where the user clicked carries the old view out and the next one in. */
 declare function pageDissolve(container: HTMLElement, options?: PageDissolveOptions): PageDissolveHandle;
 
-type CursorTrailStyle = 'trail' | 'wake' | 'water' | 'sparkle';
+type CursorTrailStyle = 'trail' | 'wake' | 'water' | 'sparkle' | 'spray';
 interface CursorTrailOptions extends KitOptions {
-    /** `trail` the ink trail of a kit field's `hover: 'trail'` (the wordmark's), `wake` a softer, wider band along the path, `water` rings that spread from it, `sparkle` glints scattered along it. Default `trail`. */
+    /**
+     * `trail` the ink trail of a kit field's `hover: 'trail'` (the wordmark's), `wake` a softer, wider band along the path, `water`
+     * rings that spread from it, `sparkle` glints scattered along it, `spray` patches of diagonal hatching sprayed round the path
+     * (a drag draws a hatched selection box). Default `trail`.
+     */
     style?: CursorTrailStyle;
     /** Characters from empty to dense; the head of the trail takes the last one. Default ` .:-=+*#%@`. */
     charset?: string;
@@ -689,6 +712,11 @@ interface CursorTrailOptions extends KitOptions {
     zIndex?: number;
     /** More elements to stay quiet over, as a selector, on top of inputs, dialogs and `[data-ascii-cursor-skip]`. */
     skip?: string;
+    /**
+     * Small monospaced coordinate tags (`412, 168`) beside the newest marks and at a drag box's corners, in the ink with
+     * `--ascii-readout-text` (default white) on it. Decoration, hidden from assistive technology. Default false.
+     */
+    readout?: boolean;
 }
 interface CursorTrailHandle extends KitHandle<CursorTrailOptions> {
     /** True while something is fading on screen. */
@@ -703,6 +731,143 @@ interface CursorTrailHandle extends KitHandle<CursorTrailOptions> {
  */
 declare function cursorTrail(options?: CursorTrailOptions): CursorTrailHandle;
 
+interface GlobePoint {
+    lat: number;
+    lon: number;
+}
+interface GlobeOptions extends KitOptions {
+    /** Degrees a second the globe turns; negative turns it the other way, 0 holds it. Default 6. */
+    speed?: number;
+    /** Longitude facing the viewer at the start, in degrees. Default -30 (the Americas and the Atlantic). */
+    lon?: number;
+    /** Tilt toward the viewer in degrees; positive shows more of the north. Default 18. */
+    tilt?: number;
+    /** Where land is, as a tone from 0 to 1 (or a boolean) for a latitude and longitude in degrees. Default the built-in world map. */
+    land?: (lat: number, lon: number) => number | boolean;
+    /** Latitude and longitude lines every this many degrees; 0 for none. Default 15. */
+    graticule?: number;
+    /** Places marked with a bright dot and a ring that keeps spreading from it. */
+    points?: GlobePoint[];
+    /** How strongly the far side's land shows through the near side's ocean, 0 to 1. Default 0.22. */
+    backside?: number;
+    /** The globe's diameter as a share of the element's shorter side. Default 0.92. */
+    size?: number;
+    /** Drag to turn it, with a little momentum. Default true. */
+    drag?: boolean;
+    /** Read to assistive technology. Without one the globe is decoration. */
+    label?: string;
+}
+interface GlobeHandle extends KitHandle<GlobeOptions> {
+    /** Turns the globe until `lon` (and `lat`, when given, through the tilt) faces the viewer. */
+    rotateTo(lon: number, lat?: number): void;
+    /** The longitude facing the viewer now. */
+    readonly lon: number;
+}
+/**
+ * A globe of dots: land, a faint ocean, latitude and longitude lines and the far side's land showing through, turning slowly.
+ * Drag turns it; `points` mark places with a spreading ring. It holds still under reduced motion, and a globe with `speed: 0`
+ * and no points draws once and idles.
+ */
+declare function globe(element: HTMLElement, options?: GlobeOptions): GlobeHandle;
+
+/** A frame to morph through: an image URL or element, a canvas, a video, or a function that draws white-on-black each frame. */
+type MorphSource = string | HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ((pen: CanvasRenderingContext2D, w: number, h: number, now: number) => void);
+interface MorphFieldOptions extends KitOptions {
+    /** The frames, in order. A function source animates every frame (a turning scene); the others are stills or video. */
+    sources: MorphSource[];
+    /** Ms each frame holds before the next morphs in. Default 3200. */
+    hold?: number;
+    /** Ms a morph takes. Default 1000. */
+    transition?: number;
+    /** Cycle through the frames on its own. Default true; off under reduced motion. */
+    autoplay?: boolean;
+    /** `cover` fills the element, cropping; `contain` fits inside it. Default `cover`. */
+    fit?: 'cover' | 'contain';
+    /** `under` sits below the element's content (a hero), `over` above it. Default `under`. */
+    layer?: 'under' | 'over';
+    /** Called as each morph starts, with the frame it is heading to: keep a caption or a counter ("2/5") in step. */
+    onChange?: (index: number) => void;
+    /** Read to assistive technology. Without one the field is decoration. */
+    label?: string;
+}
+interface MorphFieldHandle extends KitHandle<MorphFieldOptions> {
+    /** Morphs to the next frame. */
+    next(): void;
+    /** Morphs to frame `index`. */
+    go(index: number): void;
+    /** The frame showing, or being morphed to. */
+    readonly index: number;
+}
+/**
+ * Frames that morph into one another as the field's marks: by default diagonal engraved lines whose weight follows the tone, so
+ * one picture's stripes thin away as the next one's thicken. Holds each frame, then cross-fades; idles between morphs unless a
+ * frame is a video or a drawing function.
+ */
+declare function morphField(element: HTMLElement, options: MorphFieldOptions): MorphFieldHandle;
+
+interface DitherLight {
+    /** Centre as a share of the element's width and height; may lie outside 0..1 to light from past an edge. */
+    x: number;
+    y: number;
+    /** Radius as a share of the element's longer side. Default 0.6. */
+    radius?: number;
+    /** Peak tone, 0 to 1. Default 1. */
+    strength?: number;
+}
+interface DitherGradientOptions extends KitOptions {
+    /** The lights the gradient is made of. Default one broad light rising from just below the bottom edge. */
+    lights?: DitherLight[];
+    /** Tone of the ground between the lights, 0 to 1. Default 0.05. */
+    base?: number;
+    /** How much the lights drift and breathe, 0 (still: draws once, then idles) to 1. Default 0.35. */
+    motion?: number;
+    /** How far the first light leans toward the pointer, as a share of the element; 0 for none. Default 0.06. */
+    follow?: number;
+    /** `under` sits below the element's content (a hero's ground); `over` above it. Default `under`. */
+    layer?: 'under' | 'over';
+}
+interface DitherGradientHandle extends KitHandle<DitherGradientOptions> {
+    /** Replaces the lights; the next frame draws them. */
+    setLights(lights: DitherLight[]): void;
+}
+/**
+ * A gradient of soft lights drawn as a two-tone dither: the field's ink on the element's own background. The lights drift and
+ * breathe gently and the first leans toward the pointer. With `motion: 0` and the pointer away it draws once and idles; reduced
+ * motion draws one still frame.
+ */
+declare function ditherGradient(element: HTMLElement, options?: DitherGradientOptions): DitherGradientHandle;
+
+interface DitherImageOptions extends KitOptions {
+    /** The image: a URL or an `<img>`. Default the first `<img>` inside, hidden while the field draws it. */
+    src?: string | HTMLImageElement;
+    /**
+     * The brand's two tones: `[ground, ink]`, each a CSS colour or token. The ground fills the element under the marks; leave it
+     * `'transparent'` to keep the element's own background. Default `['transparent', '--ascii-ink-strong']`.
+     */
+    tones?: [string, string];
+    /** The mark the image is drawn in: `dither` (Bayer dots), `pixel`, `mosaic`, `dot`, `engraving`, `stipple`, … Default `dither`. */
+    mark?: FieldMark;
+    /** Cell size in CSS px. Default 5. */
+    cellSize?: number;
+    /** `visible` develops the image in from blank when it scrolls into view, `scroll` ties that to scroll position, `none` shows it at once. Default `visible`. */
+    reveal?: 'none' | 'visible' | 'scroll';
+    /** Length of the `visible` reveal in ms. Default 1100. */
+    duration?: number;
+    /** Cover crop focus, 0 to 1 on each axis. Default the centre. */
+    focus?: {
+        x: number;
+        y: number;
+    };
+    /** The canvas's accessible name. Default the image's `alt`. */
+    label?: string;
+}
+interface DitherImageHandle extends KitHandle<DitherImageOptions> {
+    /** Plays the reveal again from blank. */
+    replay(): void;
+}
+/** An image drawn in a brand's two tones as dither, pixels, dots or engraving, developing in as it scrolls into view. */
+declare function ditherImage(element: HTMLElement, options?: DitherImageOptions): DitherImageHandle;
+
 interface SwipeDeckOptions extends KitOptions {
     /** The cards, in order. Each card's first `img` is drawn in characters. Default `[data-card]`. */
     cards?: string;
@@ -1425,4 +1590,4 @@ declare function subscribeGlobalLook(listener: (look: GlobalLook | null) => void
 declare function setFieldBudget(n: number): void;
 declare const getFieldBudget: () => number;
 
-export { type AccordionHandle, type AccordionImage, type AccordionOptions, type ArtPanelHandle, type ArtPanelOptions, type AsciiVideoHandle, type AsciiVideoOptions, BEAM_PALETTES, type BackgroundCharset, type BackgroundContext, type BackgroundCursor, type BackgroundHandle, type BackgroundMark, type BackgroundOptions, type BackgroundPreset, type BackgroundRun, type BackgroundSettings, type BeamHandle, type BeamMode, type BeamOptions, type BeamPalette, type BlockChartHandle, type BlockChartOptions, type Box, type ButtonLoadingHandle, type ButtonLoadingOptions, type ButtonState, type CodeInputHandle, type CodeInputOptions, type CodeState, type CommandPaletteHandle, type CommandPaletteOptions, type CompareHandle, type CompareOptions, type CursorTrailHandle, type CursorTrailOptions, type CursorTrailStyle, type DecodeHandle, type DecodeOptions, type DisintegrateOptions, type DropState, type DroppedImage, type DropzoneHandle, type DropzoneOptions, type FieldBackgroundHandle, type FieldBackgroundOptions, type FieldPreset, type GenerateState, type GlobalLook, type ImageGenerateHandle, type ImageGenerateOptions, type ImageStream, type ImageUpdate, KIT_STYLES, type KitHandle, type KitOptions, type KitStyle, type LikeBurstHandle, type LikeBurstOptions, type LikeMark, type OdometerHandle, type OdometerOptions, type OrbState, PILL_TONES, type PageDissolveHandle, type PageDissolveOptions, type PaintFrame, type PillHandle, type PillOptions, type PillTone, type PricingGlowHandle, type PricingGlowOptions, type PullRefreshHandle, type PullRefreshOptions, type PullState, type SkeletonBlock, type SkeletonHandle, type SkeletonOptions, type SlideToConfirmHandle, type SlideToConfirmOptions, type StatusOrbHandle, type StatusOrbOptions, type StreamState, type StreamTextHandle, type StreamTextOptions, type Surface, type SurfaceConfig, type SwipeDeckHandle, type SwipeDeckOptions, type TabsHandle, type TabsOptions, type TemplateDraw, type TemplateFrame, type ThinkingHandle, type ThinkingOptions, type ThinkingState, type Toast, type ToastStackHandle, type ToastStackOptions, VOICE_PALETTES, type VoiceOrbHandle, type VoiceOrbOptions, type VoicePalette, type VoiceState, type WordmarkHandle, type WordmarkOptions, accordion, artPanel, asciiVideo, aurora, background, backgroundCharset, beam, beamPalette, blockChart, buttonLoading, cascade, caustics, circuit, codeInput, commandPalette, compare, constellation, contour, cursorTrail, decode, disintegrate, dna, drift, dropzone, dune, etch, facet, fieldBackground, fire, fluid, getFieldBudget, getGlobalLook, grid, halftone, halo, imageGenerate, interference, likeBurst, mesh, moire, morph, mountCanvas, mountSurface, noise, odometer, pageDissolve, pill, pricingGlow, pullRefresh, pulse, rain, resolveColor, ripple, setFieldBudget, setGlobalLook, silk, skeleton, slideToConfirm, stars, statusOrb, streamText, subscribeGlobalLook, swell, swipeDeck, tabs, terrain, thinking, toastStack, veil, voiceOrb, voidWell, wave, weave, wordField, wordmark };
+export { type AccordionHandle, type AccordionImage, type AccordionOptions, type ArtPanelHandle, type ArtPanelOptions, type AsciiVideoHandle, type AsciiVideoOptions, BEAM_PALETTES, type BackgroundCharset, type BackgroundContext, type BackgroundCursor, type BackgroundHandle, type BackgroundMark, type BackgroundOptions, type BackgroundPreset, type BackgroundRun, type BackgroundSettings, type BeamHandle, type BeamMode, type BeamOptions, type BeamPalette, type BlockChartHandle, type BlockChartOptions, type Box, type ButtonLoadingHandle, type ButtonLoadingOptions, type ButtonState, type CodeInputHandle, type CodeInputOptions, type CodeState, type CommandPaletteHandle, type CommandPaletteOptions, type CompareHandle, type CompareOptions, type CursorTrailHandle, type CursorTrailOptions, type CursorTrailStyle, type DecodeHandle, type DecodeOptions, type DisintegrateOptions, type DitherGradientHandle, type DitherGradientOptions, type DitherImageHandle, type DitherImageOptions, type DitherLight, type DropState, type DroppedImage, type DropzoneHandle, type DropzoneOptions, type FieldBackgroundHandle, type FieldBackgroundOptions, type FieldPreset, type GenerateState, type GlobalLook, type GlobeHandle, type GlobeOptions, type GlobePoint, type ImageGenerateHandle, type ImageGenerateOptions, type ImageStream, type ImageUpdate, KIT_STYLES, type KitHandle, type KitOptions, type KitStyle, type LikeBurstHandle, type LikeBurstOptions, type LikeMark, type MorphFieldHandle, type MorphFieldOptions, type MorphSource, type OdometerHandle, type OdometerOptions, type OrbState, PILL_TONES, type PageDissolveHandle, type PageDissolveOptions, type PaintFrame, type PillHandle, type PillOptions, type PillTone, type PricingGlowHandle, type PricingGlowOptions, type PullRefreshHandle, type PullRefreshOptions, type PullState, SCRAMBLE_SCRIPTS, type SkeletonBlock, type SkeletonHandle, type SkeletonOptions, type SlideToConfirmHandle, type SlideToConfirmOptions, type StatusOrbHandle, type StatusOrbOptions, type StreamState, type StreamTextHandle, type StreamTextOptions, type Surface, type SurfaceConfig, type SwipeDeckHandle, type SwipeDeckOptions, type TabsHandle, type TabsOptions, type TemplateDraw, type TemplateFrame, type ThinkingHandle, type ThinkingOptions, type ThinkingState, type Toast, type ToastStackHandle, type ToastStackOptions, VOICE_PALETTES, type VoiceOrbHandle, type VoiceOrbOptions, type VoicePalette, type VoiceState, type WordmarkHandle, type WordmarkOptions, accordion, artPanel, asciiVideo, aurora, background, backgroundCharset, beam, beamPalette, blockChart, buttonLoading, cascade, caustics, circuit, codeInput, commandPalette, compare, constellation, contour, cursorTrail, decode, disintegrate, ditherGradient, ditherImage, dna, drift, dropzone, dune, etch, facet, fieldBackground, fire, fluid, getFieldBudget, getGlobalLook, globe, grid, halftone, halo, imageGenerate, interference, likeBurst, mesh, moire, morph, morphField, mountCanvas, mountSurface, noise, odometer, pageDissolve, pill, pricingGlow, pullRefresh, pulse, rain, resolveColor, ripple, setFieldBudget, setGlobalLook, silk, skeleton, slideToConfirm, stars, statusOrb, streamText, subscribeGlobalLook, swell, swipeDeck, tabs, terrain, thinking, toastStack, veil, voiceOrb, voidWell, wave, weave, wordField, wordmark };

package/dist/kit.d.ts

@@ -1,4 +1,4 @@
-import { G as GlyphField, r as GlyphFieldOptions } from './glyph-field-DRC-7uVf.js';
+import { G as GlyphField, r as GlyphFieldOptions, m as FieldMark } from './glyph-field-BCwGhohg.js';
 import { C as CHARACTER_SETS } from './characters-BgECi5Lf.js';
 import './hover-guide-DdFnAnfU.js';
 
@@ -154,8 +154,18 @@ interface DecodeOptions extends KitOptions {
     text?: string;
     /** Total length in ms: the first 30% is drift alone, then the words resolve left to right. Default 800. */
     duration?: number;
-    /** `visible` decodes when the element scrolls into view; `manual` waits for `replay()`. Default `visible`. */
-    trigger?: 'visible' | 'manual';
+    /**
+     * `visible` decodes when the element scrolls into view; `manual` waits for `replay()`; `scroll` ties the decode to scroll
+     * position, resolving as the element rises into view and undoing as it leaves (and idling while the page is still). Default `visible`.
+     */
+    trigger?: 'visible' | 'manual' | 'scroll';
+    /**
+     * Flip through other alphabets before landing: `true` for the built-in set (kana, Hangul, accented Latin, Cyrillic, Greek, then
+     * digits and signs) or your own list, one string of letters per alphabet. Each flip fills every unresolved letter from one
+     * alphabet, drawn in the element's font at the letter's own place; letters lock left to right over the last 60% of the run.
+     * The default `duration` becomes 1400.
+     */
+    scramble?: boolean | string[];
     /** Decode again when the pointer enters. Default true. */
     replayOnHover?: boolean;
     /** `glyphs` keeps the headline in characters; `text` hands back to the crisp HTML text at the end. Default `glyphs`. */
@@ -165,6 +175,8 @@ interface DecodeHandle extends KitHandle<DecodeOptions> {
     /** Plays the decode again from the drift. */
     replay(): void;
 }
+/** The built-in alphabets `scramble: true` flips through. */
+declare const SCRAMBLE_SCRIPTS: string[];
 /** A headline that condenses out of a drifting field of characters, left to right through a flickering band. */
 declare function decode(element: HTMLElement, options?: DecodeOptions): DecodeHandle;
 
@@ -402,6 +414,13 @@ interface WordmarkOptions extends KitOptions {
     artHeight?: number;
     /** The canvas's accessible name when the word is not the element's own text. Default the word. */
     label?: string;
+    /**
+     * The word gathers out of scattered pieces: `visible` once as it scrolls into view (over `duration`), `scroll` with scroll
+     * position, scattering again as it leaves. Off under reduced motion. Default off.
+     */
+    assemble?: 'visible' | 'scroll' | false;
+    /** Ms the `visible` assembly takes. Default 1400. */
+    duration?: number;
 }
 interface WordmarkHandle extends KitHandle<WordmarkOptions> {
     /** Sets the word again, as large as fits. */
@@ -665,9 +684,13 @@ interface PageDissolveHandle extends KitHandle<PageDissolveOptions> {
 /** A page or panel transition: one wave of characters from where the user clicked carries the old view out and the next one in. */
 declare function pageDissolve(container: HTMLElement, options?: PageDissolveOptions): PageDissolveHandle;
 
-type CursorTrailStyle = 'trail' | 'wake' | 'water' | 'sparkle';
+type CursorTrailStyle = 'trail' | 'wake' | 'water' | 'sparkle' | 'spray';
 interface CursorTrailOptions extends KitOptions {
-    /** `trail` the ink trail of a kit field's `hover: 'trail'` (the wordmark's), `wake` a softer, wider band along the path, `water` rings that spread from it, `sparkle` glints scattered along it. Default `trail`. */
+    /**
+     * `trail` the ink trail of a kit field's `hover: 'trail'` (the wordmark's), `wake` a softer, wider band along the path, `water`
+     * rings that spread from it, `sparkle` glints scattered along it, `spray` patches of diagonal hatching sprayed round the path
+     * (a drag draws a hatched selection box). Default `trail`.
+     */
     style?: CursorTrailStyle;
     /** Characters from empty to dense; the head of the trail takes the last one. Default ` .:-=+*#%@`. */
     charset?: string;
@@ -689,6 +712,11 @@ interface CursorTrailOptions extends KitOptions {
     zIndex?: number;
     /** More elements to stay quiet over, as a selector, on top of inputs, dialogs and `[data-ascii-cursor-skip]`. */
     skip?: string;
+    /**
+     * Small monospaced coordinate tags (`412, 168`) beside the newest marks and at a drag box's corners, in the ink with
+     * `--ascii-readout-text` (default white) on it. Decoration, hidden from assistive technology. Default false.
+     */
+    readout?: boolean;
 }
 interface CursorTrailHandle extends KitHandle<CursorTrailOptions> {
     /** True while something is fading on screen. */
@@ -703,6 +731,143 @@ interface CursorTrailHandle extends KitHandle<CursorTrailOptions> {
  */
 declare function cursorTrail(options?: CursorTrailOptions): CursorTrailHandle;
 
+interface GlobePoint {
+    lat: number;
+    lon: number;
+}
+interface GlobeOptions extends KitOptions {
+    /** Degrees a second the globe turns; negative turns it the other way, 0 holds it. Default 6. */
+    speed?: number;
+    /** Longitude facing the viewer at the start, in degrees. Default -30 (the Americas and the Atlantic). */
+    lon?: number;
+    /** Tilt toward the viewer in degrees; positive shows more of the north. Default 18. */
+    tilt?: number;
+    /** Where land is, as a tone from 0 to 1 (or a boolean) for a latitude and longitude in degrees. Default the built-in world map. */
+    land?: (lat: number, lon: number) => number | boolean;
+    /** Latitude and longitude lines every this many degrees; 0 for none. Default 15. */
+    graticule?: number;
+    /** Places marked with a bright dot and a ring that keeps spreading from it. */
+    points?: GlobePoint[];
+    /** How strongly the far side's land shows through the near side's ocean, 0 to 1. Default 0.22. */
+    backside?: number;
+    /** The globe's diameter as a share of the element's shorter side. Default 0.92. */
+    size?: number;
+    /** Drag to turn it, with a little momentum. Default true. */
+    drag?: boolean;
+    /** Read to assistive technology. Without one the globe is decoration. */
+    label?: string;
+}
+interface GlobeHandle extends KitHandle<GlobeOptions> {
+    /** Turns the globe until `lon` (and `lat`, when given, through the tilt) faces the viewer. */
+    rotateTo(lon: number, lat?: number): void;
+    /** The longitude facing the viewer now. */
+    readonly lon: number;
+}
+/**
+ * A globe of dots: land, a faint ocean, latitude and longitude lines and the far side's land showing through, turning slowly.
+ * Drag turns it; `points` mark places with a spreading ring. It holds still under reduced motion, and a globe with `speed: 0`
+ * and no points draws once and idles.
+ */
+declare function globe(element: HTMLElement, options?: GlobeOptions): GlobeHandle;
+
+/** A frame to morph through: an image URL or element, a canvas, a video, or a function that draws white-on-black each frame. */
+type MorphSource = string | HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ((pen: CanvasRenderingContext2D, w: number, h: number, now: number) => void);
+interface MorphFieldOptions extends KitOptions {
+    /** The frames, in order. A function source animates every frame (a turning scene); the others are stills or video. */
+    sources: MorphSource[];
+    /** Ms each frame holds before the next morphs in. Default 3200. */
+    hold?: number;
+    /** Ms a morph takes. Default 1000. */
+    transition?: number;
+    /** Cycle through the frames on its own. Default true; off under reduced motion. */
+    autoplay?: boolean;
+    /** `cover` fills the element, cropping; `contain` fits inside it. Default `cover`. */
+    fit?: 'cover' | 'contain';
+    /** `under` sits below the element's content (a hero), `over` above it. Default `under`. */
+    layer?: 'under' | 'over';
+    /** Called as each morph starts, with the frame it is heading to: keep a caption or a counter ("2/5") in step. */
+    onChange?: (index: number) => void;
+    /** Read to assistive technology. Without one the field is decoration. */
+    label?: string;
+}
+interface MorphFieldHandle extends KitHandle<MorphFieldOptions> {
+    /** Morphs to the next frame. */
+    next(): void;
+    /** Morphs to frame `index`. */
+    go(index: number): void;
+    /** The frame showing, or being morphed to. */
+    readonly index: number;
+}
+/**
+ * Frames that morph into one another as the field's marks: by default diagonal engraved lines whose weight follows the tone, so
+ * one picture's stripes thin away as the next one's thicken. Holds each frame, then cross-fades; idles between morphs unless a
+ * frame is a video or a drawing function.
+ */
+declare function morphField(element: HTMLElement, options: MorphFieldOptions): MorphFieldHandle;
+
+interface DitherLight {
+    /** Centre as a share of the element's width and height; may lie outside 0..1 to light from past an edge. */
+    x: number;
+    y: number;
+    /** Radius as a share of the element's longer side. Default 0.6. */
+    radius?: number;
+    /** Peak tone, 0 to 1. Default 1. */
+    strength?: number;
+}
+interface DitherGradientOptions extends KitOptions {
+    /** The lights the gradient is made of. Default one broad light rising from just below the bottom edge. */
+    lights?: DitherLight[];
+    /** Tone of the ground between the lights, 0 to 1. Default 0.05. */
+    base?: number;
+    /** How much the lights drift and breathe, 0 (still: draws once, then idles) to 1. Default 0.35. */
+    motion?: number;
+    /** How far the first light leans toward the pointer, as a share of the element; 0 for none. Default 0.06. */
+    follow?: number;
+    /** `under` sits below the element's content (a hero's ground); `over` above it. Default `under`. */
+    layer?: 'under' | 'over';
+}
+interface DitherGradientHandle extends KitHandle<DitherGradientOptions> {
+    /** Replaces the lights; the next frame draws them. */
+    setLights(lights: DitherLight[]): void;
+}
+/**
+ * A gradient of soft lights drawn as a two-tone dither: the field's ink on the element's own background. The lights drift and
+ * breathe gently and the first leans toward the pointer. With `motion: 0` and the pointer away it draws once and idles; reduced
+ * motion draws one still frame.
+ */
+declare function ditherGradient(element: HTMLElement, options?: DitherGradientOptions): DitherGradientHandle;
+
+interface DitherImageOptions extends KitOptions {
+    /** The image: a URL or an `<img>`. Default the first `<img>` inside, hidden while the field draws it. */
+    src?: string | HTMLImageElement;
+    /**
+     * The brand's two tones: `[ground, ink]`, each a CSS colour or token. The ground fills the element under the marks; leave it
+     * `'transparent'` to keep the element's own background. Default `['transparent', '--ascii-ink-strong']`.
+     */
+    tones?: [string, string];
+    /** The mark the image is drawn in: `dither` (Bayer dots), `pixel`, `mosaic`, `dot`, `engraving`, `stipple`, … Default `dither`. */
+    mark?: FieldMark;
+    /** Cell size in CSS px. Default 5. */
+    cellSize?: number;
+    /** `visible` develops the image in from blank when it scrolls into view, `scroll` ties that to scroll position, `none` shows it at once. Default `visible`. */
+    reveal?: 'none' | 'visible' | 'scroll';
+    /** Length of the `visible` reveal in ms. Default 1100. */
+    duration?: number;
+    /** Cover crop focus, 0 to 1 on each axis. Default the centre. */
+    focus?: {
+        x: number;
+        y: number;
+    };
+    /** The canvas's accessible name. Default the image's `alt`. */
+    label?: string;
+}
+interface DitherImageHandle extends KitHandle<DitherImageOptions> {
+    /** Plays the reveal again from blank. */
+    replay(): void;
+}
+/** An image drawn in a brand's two tones as dither, pixels, dots or engraving, developing in as it scrolls into view. */
+declare function ditherImage(element: HTMLElement, options?: DitherImageOptions): DitherImageHandle;
+
 interface SwipeDeckOptions extends KitOptions {
     /** The cards, in order. Each card's first `img` is drawn in characters. Default `[data-card]`. */
     cards?: string;
@@ -1425,4 +1590,4 @@ declare function subscribeGlobalLook(listener: (look: GlobalLook | null) => void
 declare function setFieldBudget(n: number): void;
 declare const getFieldBudget: () => number;
 
-export { type AccordionHandle, type AccordionImage, type AccordionOptions, type ArtPanelHandle, type ArtPanelOptions, type AsciiVideoHandle, type AsciiVideoOptions, BEAM_PALETTES, type BackgroundCharset, type BackgroundContext, type BackgroundCursor, type BackgroundHandle, type BackgroundMark, type BackgroundOptions, type BackgroundPreset, type BackgroundRun, type BackgroundSettings, type BeamHandle, type BeamMode, type BeamOptions, type BeamPalette, type BlockChartHandle, type BlockChartOptions, type Box, type ButtonLoadingHandle, type ButtonLoadingOptions, type ButtonState, type CodeInputHandle, type CodeInputOptions, type CodeState, type CommandPaletteHandle, type CommandPaletteOptions, type CompareHandle, type CompareOptions, type CursorTrailHandle, type CursorTrailOptions, type CursorTrailStyle, type DecodeHandle, type DecodeOptions, type DisintegrateOptions, type DropState, type DroppedImage, type DropzoneHandle, type DropzoneOptions, type FieldBackgroundHandle, type FieldBackgroundOptions, type FieldPreset, type GenerateState, type GlobalLook, type ImageGenerateHandle, type ImageGenerateOptions, type ImageStream, type ImageUpdate, KIT_STYLES, type KitHandle, type KitOptions, type KitStyle, type LikeBurstHandle, type LikeBurstOptions, type LikeMark, type OdometerHandle, type OdometerOptions, type OrbState, PILL_TONES, type PageDissolveHandle, type PageDissolveOptions, type PaintFrame, type PillHandle, type PillOptions, type PillTone, type PricingGlowHandle, type PricingGlowOptions, type PullRefreshHandle, type PullRefreshOptions, type PullState, type SkeletonBlock, type SkeletonHandle, type SkeletonOptions, type SlideToConfirmHandle, type SlideToConfirmOptions, type StatusOrbHandle, type StatusOrbOptions, type StreamState, type StreamTextHandle, type StreamTextOptions, type Surface, type SurfaceConfig, type SwipeDeckHandle, type SwipeDeckOptions, type TabsHandle, type TabsOptions, type TemplateDraw, type TemplateFrame, type ThinkingHandle, type ThinkingOptions, type ThinkingState, type Toast, type ToastStackHandle, type ToastStackOptions, VOICE_PALETTES, type VoiceOrbHandle, type VoiceOrbOptions, type VoicePalette, type VoiceState, type WordmarkHandle, type WordmarkOptions, accordion, artPanel, asciiVideo, aurora, background, backgroundCharset, beam, beamPalette, blockChart, buttonLoading, cascade, caustics, circuit, codeInput, commandPalette, compare, constellation, contour, cursorTrail, decode, disintegrate, dna, drift, dropzone, dune, etch, facet, fieldBackground, fire, fluid, getFieldBudget, getGlobalLook, grid, halftone, halo, imageGenerate, interference, likeBurst, mesh, moire, morph, mountCanvas, mountSurface, noise, odometer, pageDissolve, pill, pricingGlow, pullRefresh, pulse, rain, resolveColor, ripple, setFieldBudget, setGlobalLook, silk, skeleton, slideToConfirm, stars, statusOrb, streamText, subscribeGlobalLook, swell, swipeDeck, tabs, terrain, thinking, toastStack, veil, voiceOrb, voidWell, wave, weave, wordField, wordmark };
+export { type AccordionHandle, type AccordionImage, type AccordionOptions, type ArtPanelHandle, type ArtPanelOptions, type AsciiVideoHandle, type AsciiVideoOptions, BEAM_PALETTES, type BackgroundCharset, type BackgroundContext, type BackgroundCursor, type BackgroundHandle, type BackgroundMark, type BackgroundOptions, type BackgroundPreset, type BackgroundRun, type BackgroundSettings, type BeamHandle, type BeamMode, type BeamOptions, type BeamPalette, type BlockChartHandle, type BlockChartOptions, type Box, type ButtonLoadingHandle, type ButtonLoadingOptions, type ButtonState, type CodeInputHandle, type CodeInputOptions, type CodeState, type CommandPaletteHandle, type CommandPaletteOptions, type CompareHandle, type CompareOptions, type CursorTrailHandle, type CursorTrailOptions, type CursorTrailStyle, type DecodeHandle, type DecodeOptions, type DisintegrateOptions, type DitherGradientHandle, type DitherGradientOptions, type DitherImageHandle, type DitherImageOptions, type DitherLight, type DropState, type DroppedImage, type DropzoneHandle, type DropzoneOptions, type FieldBackgroundHandle, type FieldBackgroundOptions, type FieldPreset, type GenerateState, type GlobalLook, type GlobeHandle, type GlobeOptions, type GlobePoint, type ImageGenerateHandle, type ImageGenerateOptions, type ImageStream, type ImageUpdate, KIT_STYLES, type KitHandle, type KitOptions, type KitStyle, type LikeBurstHandle, type LikeBurstOptions, type LikeMark, type MorphFieldHandle, type MorphFieldOptions, type MorphSource, type OdometerHandle, type OdometerOptions, type OrbState, PILL_TONES, type PageDissolveHandle, type PageDissolveOptions, type PaintFrame, type PillHandle, type PillOptions, type PillTone, type PricingGlowHandle, type PricingGlowOptions, type PullRefreshHandle, type PullRefreshOptions, type PullState, SCRAMBLE_SCRIPTS, type SkeletonBlock, type SkeletonHandle, type SkeletonOptions, type SlideToConfirmHandle, type SlideToConfirmOptions, type StatusOrbHandle, type StatusOrbOptions, type StreamState, type StreamTextHandle, type StreamTextOptions, type Surface, type SurfaceConfig, type SwipeDeckHandle, type SwipeDeckOptions, type TabsHandle, type TabsOptions, type TemplateDraw, type TemplateFrame, type ThinkingHandle, type ThinkingOptions, type ThinkingState, type Toast, type ToastStackHandle, type ToastStackOptions, VOICE_PALETTES, type VoiceOrbHandle, type VoiceOrbOptions, type VoicePalette, type VoiceState, type WordmarkHandle, type WordmarkOptions, accordion, artPanel, asciiVideo, aurora, background, backgroundCharset, beam, beamPalette, blockChart, buttonLoading, cascade, caustics, circuit, codeInput, commandPalette, compare, constellation, contour, cursorTrail, decode, disintegrate, ditherGradient, ditherImage, dna, drift, dropzone, dune, etch, facet, fieldBackground, fire, fluid, getFieldBudget, getGlobalLook, globe, grid, halftone, halo, imageGenerate, interference, likeBurst, mesh, moire, morph, morphField, mountCanvas, mountSurface, noise, odometer, pageDissolve, pill, pricingGlow, pullRefresh, pulse, rain, resolveColor, ripple, setFieldBudget, setGlobalLook, silk, skeleton, slideToConfirm, stars, statusOrb, streamText, subscribeGlobalLook, swell, swipeDeck, tabs, terrain, thinking, toastStack, veil, voiceOrb, voidWell, wave, weave, wordField, wordmark };

package/dist/kit.js

@@ -1 +1 @@
-export{voidWell}from"./kit/chunk-7M2FFUZ3.js";export{wave}from"./kit/chunk-2GAV4OAK.js";export{weave}from"./kit/chunk-W4U5CK6L.js";export{morph}from"./kit/chunk-GKR3ROYR.js";export{noise}from"./kit/chunk-M5VVLYI2.js";export{pulse}from"./kit/chunk-KEE55QSD.js";export{rain}from"./kit/chunk-BFBG3VHI.js";export{silk}from"./kit/chunk-3LJ5C3U3.js";export{stars}from"./kit/chunk-ORSI57T2.js";export{terrain}from"./kit/chunk-QSTDYL35.js";export{veil}from"./kit/chunk-CGSWUO67.js";export{circuit}from"./kit/chunk-E3FPFANJ.js";export{dna}from"./kit/chunk-AIGAJMNN.js";export{dune}from"./kit/chunk-ZCXNGJGB.js";export{etch}from"./kit/chunk-CG6SGQMY.js";export{facet}from"./kit/chunk-6WU247CB.js";export{fire}from"./kit/chunk-UVLKCAKH.js";export{grid}from"./kit/chunk-WI2AF2KE.js";export{moire}from"./kit/chunk-B3TY6UXJ.js";import"./kit/chunk-XPXMCXYI.js";import"./kit/chunk-ZCHGV2CV.js";export{mountCanvas}from"./kit/chunk-3OD5BMF5.js";export{ripple}from"./kit/chunk-Z3KD6CLE.js";export{halo}from"./kit/chunk-6G5MPND3.js";export{interference}from"./kit/chunk-EKYEA7Z4.js";export{mesh}from"./kit/chunk-776H2BJ7.js";export{cascade}from"./kit/chunk-TRDA73HN.js";export{constellation}from"./kit/chunk-3MHEDZLZ.js";export{aurora}from"./kit/chunk-FHN3PPSI.js";export{halftone}from"./kit/chunk-DMRPBFLW.js";export{pullRefresh}from"./kit/chunk-4U72YE65.js";export{background,backgroundCharset}from"./kit/chunk-NW4U2YRE.js";export{swell}from"./kit/chunk-KY5KCIZE.js";export{drift}from"./kit/chunk-GBNV3GXG.js";export{wordField}from"./kit/chunk-RXOPJJC4.js";export{fluid}from"./kit/chunk-UOYBFLGJ.js";export{caustics}from"./kit/chunk-F6F2C3RH.js";export{contour}from"./kit/chunk-FPCCX4FM.js";import"./kit/chunk-3VEMKDBW.js";export{codeInput}from"./kit/chunk-KFXMLIVF.js";export{toastStack}from"./kit/chunk-OZFSNW5N.js";export{thinking}from"./kit/chunk-ZWZZMU5P.js";export{streamText}from"./kit/chunk-4NV5APSJ.js";export{compare}from"./kit/chunk-YSN7EHSH.js";export{accordion}from"./kit/chunk-G4ZSMTFN.js";export{dropzone}from"./kit/chunk-HYVTFKWX.js";export{disintegrate}from"./kit/chunk-3YSK7V26.js";export{VOICE_PALETTES,voiceOrb}from"./kit/chunk-KXI3T72F.js";export{commandPalette}from"./kit/chunk-PGFBIU7R.js";import"./kit/chunk-PB5E3D4E.js";export{likeBurst}from"./kit/chunk-NF4WVWAC.js";export{blockChart}from"./kit/chunk-VBWG7HQA.js";export{pageDissolve}from"./kit/chunk-LVCGC3SO.js";import"./kit/chunk-Z2FRNFMB.js";export{cursorTrail}from"./kit/chunk-EEV6Y7NH.js";export{swipeDeck}from"./kit/chunk-FWODCYYJ.js";export{slideToConfirm}from"./kit/chunk-K6JX64AS.js";export{tabs}from"./kit/chunk-KLRF3S7O.js";export{imageGenerate}from"./kit/chunk-KDROJANO.js";export{fieldBackground}from"./kit/chunk-ILXVBO7M.js";export{wordmark}from"./kit/chunk-I5R2347P.js";export{asciiVideo}from"./kit/chunk-2LBQ7QJT.js";export{artPanel}from"./kit/chunk-XUCYFWC3.js";export{pricingGlow}from"./kit/chunk-42KMN727.js";import"./kit/chunk-7DXSG526.js";export{BEAM_PALETTES,beam,beamPalette}from"./kit/chunk-SDSW7422.js";export{decode}from"./kit/chunk-VV2KP7ZW.js";export{odometer}from"./kit/chunk-2FH6GGV6.js";export{buttonLoading}from"./kit/chunk-QVICL57J.js";export{statusOrb}from"./kit/chunk-KCEYRIU4.js";export{skeleton}from"./kit/chunk-H5KHXZWR.js";export{PILL_TONES,pill}from"./kit/chunk-WDS7VM2E.js";export{mountSurface,resolveColor}from"./kit/chunk-GF72XM4C.js";export{KIT_STYLES,getFieldBudget,getGlobalLook,setFieldBudget,setGlobalLook,subscribeGlobalLook}from"./kit/chunk-FEAFQY7O.js";//# sourceMappingURL=kit.js.map
+export{silk}from"./kit/chunk-XZO4VH2Z.js";export{stars}from"./kit/chunk-XXHIFJ5Z.js";export{terrain}from"./kit/chunk-UWX7VIXT.js";export{veil}from"./kit/chunk-R3ALZFUQ.js";export{voidWell}from"./kit/chunk-4G5LJNMB.js";export{wave}from"./kit/chunk-F4IO3HWD.js";export{weave}from"./kit/chunk-P5MVACML.js";export{facet}from"./kit/chunk-UXDJSGED.js";export{fire}from"./kit/chunk-NS6HYTQZ.js";export{grid}from"./kit/chunk-OOVUQEXT.js";export{moire}from"./kit/chunk-XDX6WLED.js";export{morph}from"./kit/chunk-5Q634WWI.js";export{noise}from"./kit/chunk-V6KL3IA7.js";export{pulse}from"./kit/chunk-GJANKSX6.js";export{rain}from"./kit/chunk-7TXDNPL3.js";export{cascade}from"./kit/chunk-G3FVDS2A.js";export{constellation}from"./kit/chunk-6NDTKY3V.js";export{aurora}from"./kit/chunk-G7GQSPMC.js";export{halftone}from"./kit/chunk-3H3DJI3M.js";export{circuit}from"./kit/chunk-ZNZAO7JA.js";export{dna}from"./kit/chunk-X7AUCVMH.js";export{dune}from"./kit/chunk-NQ4PFWOG.js";export{etch}from"./kit/chunk-ZGCKUXYP.js";import"./kit/chunk-XPXMCXYI.js";import"./kit/chunk-ZCHGV2CV.js";export{mountCanvas}from"./kit/chunk-AAV5QNHU.js";export{wordField}from"./kit/chunk-EH4S6T7U.js";export{fluid}from"./kit/chunk-UT6MJP5B.js";export{caustics}from"./kit/chunk-2UOPVMN3.js";export{contour}from"./kit/chunk-MYAZOXMF.js";export{ripple}from"./kit/chunk-UXJRBOSR.js";export{halo}from"./kit/chunk-Y2SDQ6EC.js";export{interference}from"./kit/chunk-M5JJSIWI.js";export{mesh}from"./kit/chunk-VENDLTH4.js";export{compare}from"./kit/chunk-NP7UG7DS.js";export{accordion}from"./kit/chunk-4NR7QENR.js";export{dropzone}from"./kit/chunk-TJHSBZBF.js";export{disintegrate}from"./kit/chunk-N7J4UAWY.js";export{pullRefresh}from"./kit/chunk-CZL5WMU6.js";export{background,backgroundCharset}from"./kit/chunk-X6GAMLEH.js";export{swell}from"./kit/chunk-64NSPD2R.js";export{drift}from"./kit/chunk-7QH33RJJ.js";import"./kit/chunk-LTRVMY3D.js";export{morphField}from"./kit/chunk-AU33Y2SZ.js";export{ditherGradient}from"./kit/chunk-BV6AOHFU.js";export{ditherImage}from"./kit/chunk-GI5BNKBL.js";export{swipeDeck}from"./kit/chunk-UHLNVM63.js";export{codeInput}from"./kit/chunk-E427W6P5.js";export{toastStack}from"./kit/chunk-WPWCFCEZ.js";export{thinking}from"./kit/chunk-VQ4KIRBW.js";export{streamText}from"./kit/chunk-2NACMWVV.js";export{VOICE_PALETTES,voiceOrb}from"./kit/chunk-JF3WEYIE.js";export{commandPalette}from"./kit/chunk-PZKQUZQK.js";import"./kit/chunk-DKRZSP5K.js";export{slideToConfirm}from"./kit/chunk-FU4WW3PU.js";export{likeBurst}from"./kit/chunk-MWUPCAET.js";export{blockChart}from"./kit/chunk-NSKX2OFA.js";export{pageDissolve}from"./kit/chunk-CMGMCRAD.js";import"./kit/chunk-HENGH3DE.js";export{cursorTrail}from"./kit/chunk-BQ53B2HP.js";export{globe}from"./kit/chunk-SBAUVRBY.js";export{tabs}from"./kit/chunk-V42Q4L2G.js";export{imageGenerate}from"./kit/chunk-BJJUDT26.js";export{fieldBackground}from"./kit/chunk-MT23DCGU.js";export{wordmark}from"./kit/chunk-SQNULNT3.js";export{asciiVideo}from"./kit/chunk-BO4CPM26.js";export{artPanel}from"./kit/chunk-ZTCSVEHT.js";export{pricingGlow}from"./kit/chunk-XVA7UGUQ.js";import"./kit/chunk-RGV7VRYC.js";export{BEAM_PALETTES,beam,beamPalette}from"./kit/chunk-WSWIOD2C.js";export{SCRAMBLE_SCRIPTS,decode}from"./kit/chunk-IFZDWKIX.js";export{odometer}from"./kit/chunk-6G2ZVIBS.js";export{buttonLoading}from"./kit/chunk-CH64MY3U.js";export{statusOrb}from"./kit/chunk-BGPEFFKK.js";export{skeleton}from"./kit/chunk-WRBLIULG.js";export{PILL_TONES,pill}from"./kit/chunk-J7Y2KBXK.js";export{mountSurface,resolveColor}from"./kit/chunk-I377LEZA.js";export{KIT_STYLES,getFieldBudget,getGlobalLook,setFieldBudget,setGlobalLook,subscribeGlobalLook}from"./kit/chunk-FEAFQY7O.js";//# sourceMappingURL=kit.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asciify-engine",
-  "version": "4.29.0",
+  "version": "4.30.0",
   "description": "Framework-agnostic ASCII art engine. Convert images, videos, and GIFs into ASCII art rendered on canvas, or run full-bleed GPU character fields with a fluid cursor wake.",
   "type": "module",
   "main": "./dist/index.cjs",

package/skills/asciify-engine/SKILL.md

@@ -2,13 +2,13 @@
 name: asciify-engine
 description: Apply Asciify the way asciify.org does - ASCII components and backgrounds that belong in a real interface, inked from the theme, clear around text, inside the page's radii and motion. Use for UI components in characters (loading, status, toasts, tabs, AI states, charts, transitions, pages), animated ASCII backgrounds, and also photo, video and GIF conversion, GPU character fields, artwork looks for wallpapers, posters and prints, art styles and export, hover and motion, layered typography and rendering performance.
 metadata:
-  tested-engine: "4.29.0"
+  tested-engine: "4.30.0"
   updated: "2026-10-17"
 ---
 
 # Asciify Engine
 
-Use the published `asciify-engine` npm package. Tested against **4.29.0**. Check the application's installed version and its public types before using newer options; a local checkout can contain unpublished changes.
+Use the published `asciify-engine` npm package. Tested against **4.30.0**. Check the application's installed version and its public types before using newer options; a local checkout can contain unpublished changes.
 
 - Agent entry: https://asciify.org/skill (redirects to this Markdown document).
 - Components: https://asciify.org/components · Looks: https://asciify.org/looks · Backgrounds: https://asciify.org/backgrounds
@@ -35,7 +35,7 @@ Most requests are a feeling ("make the loading state feel alive", "a calm backgr
 
 | The user wants | Use |
 | --- | --- |
-| A UI component in characters: button loading, status, toasts, tabs, pills, odometer, chart, AI thinking and streaming, transitions, sign-in, pricing, 404 | `asciify-engine/kit` ([applying-asciify.md](references/applying-asciify.md), [components.md](references/components.md), [kit.md](references/kit.md)) |
+| A UI component in characters: button loading, status, toasts, tabs, pills, odometer, chart, AI thinking and streaming, transitions, sign-in, pricing, 404; event-site pieces (scrambling headers and headlines, morphing hatched heroes, dithered glows, a dotted globe, two-tone photos, assembling wordmarks, a spray cursor) | `asciify-engine/kit` ([applying-asciify.md](references/applying-asciify.md), [components.md](references/components.md), [kit.md](references/kit.md)) |
 | A background behind a hero, pricing, docs or a section, light or dark | Kit `fieldBackground(el, { preset: 'hero', clear })` (asciify.org's hero) or `background(el, { preset, clear })` with one of the 12 curated presets below |
 | Their word or brand in characters | Kit `wordmark`, or `background()` with `wordField` |
 | Their video in characters on the page | Kit `asciiVideo` |
@@ -49,7 +49,7 @@ Most requests are a feeling ("make the loading state feel alive", "a calm backgr
 
 ## The kit in one paragraph
 
-Each kit function mounts an `aria-hidden` field over or inside your element, follows its size and border radius, inks it from your theme in light and dark, pauses off screen, honours reduced motion, falls back without WebGL2 to an inert handle that leaves your HTML working, and cleans up on `destroy()`. components.md has 31 components as short snippets with the prompt a person gives, in categories Components, AI, Text, Transitions, Media, Pages and Backgrounds. In React, create the handle in an effect and return its `destroy`.
+Each kit function mounts an `aria-hidden` field over or inside your element, follows its size and border radius, inks it from your theme in light and dark, pauses off screen, honours reduced motion, falls back without WebGL2 to an inert handle that leaves your HTML working, and cleans up on `destroy()`. components.md has 37 components as short snippets with the prompt a person gives, in categories Components, AI, Text, Transitions, Media, Pages and Backgrounds. In React, create the handle in an effect and return its `destroy`.
 
 ```ts
 import { beam } from 'asciify-engine/kit';

package/skills/asciify-engine/references/applying-asciify.md

@@ -16,8 +16,9 @@ Pick by what the field does for the person, not by how it looks.
 | Move between states or views | `tabs`, `pageDissolve`, `commandPalette`, `toastStack`, `disintegrate` |
 | Answer a gesture | `likeBurst`, `swipeDeck`, `compare`, `accordion`, `dropzone` |
 | Follow the pointer across the page | `cursorTrail` (one per page, off on touch and under reduced motion) |
-| Carry a brand moment or media | `decode`, `wordmark`, `asciiVideo`, `artPanel`, `pricingGlow`, `fieldBackground` `notFound` |
-| Set the page's one ground | `fieldBackground` `hero`, or `background()` with a preset (section 9) |
+| Carry a brand moment or media | `decode` (and its `scramble`), `wordmark` (and its `assemble`), `morphField`, `ditherImage`, `asciiVideo`, `artPanel`, `pricingGlow`, `fieldBackground` `notFound` |
+| Show where: places, reach, a network | `globe` with `points` |
+| Set the page's one ground | `fieldBackground` `hero`, `ditherGradient`, or `background()` with a preset (section 9) |
 
 Do not use characters:
 
@@ -219,6 +220,21 @@ const bg = background(hero, { preset: drift, clear: heroCopy, poster: '/stills/d
 signUpButton.addEventListener('click', () => bg.field?.pulse({ element: signUpButton, strength: 1.2 })); // GPU presets expose the field
 ```
 
+## 9b. Event and launch pages
+
+A conference, launch or campaign page can carry more character than a product page, but the same rules hold: one key visual a section, real HTML for every headline and link, and motion that answers the visitor.
+
+| Section | Piece | Keep it |
+| --- | --- | --- |
+| Header | `decode(link, { scramble: true, trigger: 'manual', settle: 'text' })` on each nav link | Links rest as plain HTML and only scramble on hover; `cellSize` about 3 so letters stay crisp. |
+| Hero | `morphField` of your own frames (`mark: 'engraving'` lines, white ink on the brand ground) and `decode(h1, { scramble: true, settle: 'text' })` | One morph per hero; a counter or caption through `onChange`; a poster per theme. |
+| Ambient pointer | `cursorTrail({ style: 'spray', readout: true, zIndex: -1 })` | A background hover: behind cards, off on touch and under reduced motion. |
+| Proof sections | `globe` for venues or reach, `ditherImage` for photos in the brand's two tones, `background(el, { preset: wordField, look: { glyphOrder: 'text', … } })` for repeated words | `globe` and `wordField` are section grounds; keep copy off their middle or `clear` it. |
+| Call to action | `ditherGradient` on the brand-coloured panel | Light from an edge, the button over the quiet part. |
+| Footer | `wordmark(mark, { assemble: 'scroll', look: { hover: 'none' } })` | The page trail draws over it; nothing else moves in the footer. |
+
+Brand colour as the ground: give the section the brand background and draw in white or a light tint of it (`ink: '#fff'` or a token); on a white section draw in the brand token. Check contrast of the HTML over the busiest frame of the morph.
+
 ## 10. Checklist before you finish
 
 - [ ] Every field has a job from section 1; hiding it loses feedback, or it is the page's one ground.