@sharedex/ui 0.0.0-stage → 0.10.0

package/dist/schema/backgrounds.js

@@ -0,0 +1,187 @@
+// The background effects' option schemas, keyed by effect id, in the order of BACKGROUND_EFFECTS, then the
+// image / video slots. Imports only the schema files, which import only types from their effects: this entry
+// carries no effect code. Each schema gets its registry metadata here (label, category, family, tier); a test
+// keeps it equal to BACKGROUND_EFFECTS / BACKGROUND_SLOTS.
+import { FILM_GRAIN_SCHEMA } from "../backgrounds/effects/texture/filmGrain.schema.js";
+import { FOGGY_GLASS_SCHEMA } from "../backgrounds/effects/texture/foggyGlass.schema.js";
+import { FROZEN_GLASS_SCHEMA } from "../backgrounds/effects/texture/frozenGlass.schema.js";
+import { HALFTONE_SCHEMA } from "../backgrounds/effects/texture/halftone.schema.js";
+import { DIGITAL_GLITCH_SCHEMA } from "../backgrounds/effects/glitch/digitalGlitch.schema.js";
+import { VHS_STATIC_SCHEMA } from "../backgrounds/effects/glitch/vhsStatic.schema.js";
+import { DITHER_WAVE_SCHEMA } from "../backgrounds/effects/glitch/ditherWave.schema.js";
+import { RETRO_SCREEN_SCHEMA } from "../backgrounds/effects/glitch/retroScreen.schema.js";
+import { RGB_SHIFT_SCHEMA } from "../backgrounds/effects/glitch/rgbShift.schema.js";
+import { MATRIX_RAIN_SCHEMA } from "../backgrounds/effects/glitch/matrixRain.schema.js";
+import { CRT_SCANLINES_SCHEMA } from "../backgrounds/effects/glitch/crtScanlines.schema.js";
+import { ASCII_ART_SCHEMA } from "../backgrounds/effects/glitch/asciiArt.schema.js";
+import { LIQUID_GLASS_SCHEMA } from "../backgrounds/effects/three/liquidGlass.schema.js";
+import { GLASS_SHAPES_SCHEMA } from "../backgrounds/effects/three/glassShapes.schema.js";
+import { CHROME_SCHEMA } from "../backgrounds/effects/three/chrome.schema.js";
+import { SPECTRAL_GHOST_SCHEMA } from "../backgrounds/effects/three/spectralGhost.schema.js";
+import { ISOMETRIC_LAYERS_SCHEMA } from "../backgrounds/effects/glass/isometricLayers.schema.js";
+import { LIQUID_SCULPTURE_SCHEMA } from "../backgrounds/effects/glass/liquidSculpture.schema.js";
+import { WOVEN_LIGHT_SCHEMA } from "../backgrounds/effects/three/wovenLight.schema.js";
+import { RAINBOW_SCHEMA } from "../backgrounds/effects/shader/rainbow.schema.js";
+import { GRADIENT_BARS_SCHEMA } from "../backgrounds/effects/shader/gradientBars.schema.js";
+import { AURORA_SCHEMA } from "../backgrounds/effects/shader/aurora.schema.js";
+import { IRIDESCENT_SCHEMA } from "../backgrounds/effects/shader/iridescent.schema.js";
+import { GOOEY_BLOBS_SCHEMA } from "../backgrounds/effects/shader/gooeyBlobs.schema.js";
+import { SHADER_RIPPLES_SCHEMA } from "../backgrounds/effects/shader/shaderRipples.schema.js";
+import { SHADER_LINES_SCHEMA } from "../backgrounds/effects/shader/shaderLines.schema.js";
+import { WAVE_DISTORTION_SCHEMA } from "../backgrounds/effects/shader/waveDistortion.schema.js";
+import { ANIMATED_GRADIENT_SCHEMA } from "../backgrounds/effects/shader/animatedGradient.schema.js";
+import { GRAIN_GRADIENT_SCHEMA } from "../backgrounds/effects/shader/grainGradient.schema.js";
+import { SMOOTH_MESH_SCHEMA } from "../backgrounds/effects/shader/smoothMesh.schema.js";
+import { PLASMA_GRID_SCHEMA } from "../backgrounds/effects/shader/plasmaGrid.schema.js";
+import { AETHER_SCHEMA } from "../backgrounds/effects/shader/aether.schema.js";
+import { CHROMATIC_SINE_SCHEMA } from "../backgrounds/effects/shader/chromaticSine.schema.js";
+import { LIQUID_SCHEMA } from "../backgrounds/effects/shader/liquid.schema.js";
+import { MESH_GRADIENT_SCHEMA } from "../backgrounds/effects/shader/meshGradient.schema.js";
+import { GOD_RAYS_SCHEMA } from "../backgrounds/effects/shader/godRays.schema.js";
+import { CAUSTICS_SCHEMA } from "../backgrounds/effects/shader/caustics.schema.js";
+import { GRADIENT_GRID_SCHEMA } from "../backgrounds/effects/grid/gradientGrid.schema.js";
+import { TRIANGLE_GRID_SCHEMA } from "../backgrounds/effects/grid/triangleGrid.schema.js";
+import { GRID_HOVER_SCHEMA } from "../backgrounds/effects/grid/gridHover.schema.js";
+import { FADING_GRID_SCHEMA } from "../backgrounds/effects/grid/fadingGrid.schema.js";
+import { MORPH_GRID_SCHEMA } from "../backgrounds/effects/grid/morphGrid.schema.js";
+import { LAYERED_GRID_CARDS_SCHEMA } from "../backgrounds/effects/grid/layeredGridCards.schema.js";
+import { MELTY_LINES_SCHEMA } from "../backgrounds/effects/grid/meltyLines.schema.js";
+import { DATA_GRID_SCHEMA } from "../backgrounds/effects/grid/dataGrid.schema.js";
+import { GRID_HERO_SCHEMA } from "../backgrounds/effects/grid/gridHero.schema.js";
+import { ANIMATED_GRID_SCHEMA } from "../backgrounds/effects/grid/animatedGrid.schema.js";
+import { QUANTUM_GRID_SCHEMA } from "../backgrounds/effects/grid/quantumGrid.schema.js";
+import { NEON_GRID_TRAIL_SCHEMA } from "../backgrounds/effects/grid/neonGridTrail.schema.js";
+import { DOT_PATTERN_SCHEMA } from "../backgrounds/effects/grid/dotPattern.schema.js";
+import { MAGNET_LINES_SCHEMA } from "../backgrounds/effects/grid/magnetLines.schema.js";
+import { CONTOUR_LINES_SCHEMA } from "../backgrounds/effects/grid/contourLines.schema.js";
+import { GEOMETRIC_VECTORS_SCHEMA } from "../backgrounds/effects/grid/geometricVectors.schema.js";
+import { WAVY_PATTERN_SCHEMA } from "../backgrounds/effects/wave/wavyPattern.schema.js";
+import { RIPPLES_SCHEMA } from "../backgrounds/effects/wave/ripples.schema.js";
+import { MOIRE_DOTS_SCHEMA } from "../backgrounds/effects/wave/moireDots.schema.js";
+import { LIQUID_WAVE_SCHEMA } from "../backgrounds/effects/wave/liquidWave.schema.js";
+import { FLOW_FIELD_SCHEMA } from "../backgrounds/effects/wave/flowField.schema.js";
+import { SVG_WAVE_SCHEMA } from "../backgrounds/effects/wave/svgWave.schema.js";
+import { SVG_COLOR_WAVE_SCHEMA } from "../backgrounds/effects/wave/svgColorWave.schema.js";
+import { MOUNTAINS_SCHEMA } from "../backgrounds/effects/wave/mountains.schema.js";
+import { DRAWING_LINES_SCHEMA } from "../backgrounds/effects/wave/drawingLines.schema.js";
+import { WIREFRAME_OCEAN_SCHEMA } from "../backgrounds/effects/wave/wireframeOcean.schema.js";
+import { PARTICLE_ORB_SCHEMA } from "../backgrounds/effects/particle/particleOrb.schema.js";
+import { PARTICLES_SCHEMA } from "../backgrounds/effects/particle/particles.schema.js";
+import { PARTICLE_HOVER_SCHEMA } from "../backgrounds/effects/particle/particleHover.schema.js";
+import { STARFIELD_SCHEMA } from "../backgrounds/effects/particle/starfield.schema.js";
+import { CONSTELLATION_SCHEMA } from "../backgrounds/effects/particle/constellation.schema.js";
+import { FALLING_PARTICLES_SCHEMA } from "../backgrounds/effects/particle/fallingParticles.schema.js";
+import { CURSOR_DOTS_SCHEMA } from "../backgrounds/effects/particle/cursorDots.schema.js";
+import { BOKEH_SCHEMA } from "../backgrounds/effects/particle/bokeh.schema.js";
+import { METEORS_SCHEMA } from "../backgrounds/effects/particle/meteors.schema.js";
+import { CURSOR_GLOW_SCHEMA } from "../backgrounds/effects/cursor/cursorGlow.schema.js";
+import { PROXIMITY_MASK_SCHEMA } from "../backgrounds/effects/cursor/proximityMask.schema.js";
+import { NEON_TUBES_SCHEMA } from "../backgrounds/effects/three/neonTubes.schema.js";
+import { FLUID_CURSOR_SCHEMA } from "../backgrounds/effects/cursor/fluidCursor.schema.js";
+import { WATER_RIPPLE_SCHEMA } from "../backgrounds/effects/cursor/waterRipple.schema.js";
+import { CINEMATIC_REVEAL_SCHEMA } from "../backgrounds/effects/scroll/cinematicReveal.schema.js";
+import { SCROLL_COLOR_SCHEMA } from "../backgrounds/effects/scroll/scrollColor.schema.js";
+import { SCROLL_MORPH_SCHEMA } from "../backgrounds/effects/scroll/scrollMorph.schema.js";
+import { SCROLL_TIMELINE_SCHEMA } from "../backgrounds/effects/scroll/scrollTimeline.schema.js";
+import { PARALLAX_SCHEMA } from "../backgrounds/effects/scroll/parallax.schema.js";
+import { VIDEO_SCRUB_SCHEMA } from "../backgrounds/effects/scroll/videoScrub.schema.js";
+import { CIRCLES_PATTERN_SCHEMA } from "../backgrounds/effects/pattern/circlesPattern.schema.js";
+import { DIAMONDS_PATTERN_SCHEMA } from "../backgrounds/effects/pattern/diamondsPattern.schema.js";
+import { SCALES_PATTERN_SCHEMA } from "../backgrounds/effects/pattern/scalesPattern.schema.js";
+import { LEATHER_PATTERN_SCHEMA } from "../backgrounds/effects/pattern/leatherPattern.schema.js";
+import { STRANGE_PATTERN_SCHEMA } from "../backgrounds/effects/pattern/strangePattern.schema.js";
+import { IMAGE_SCHEMA } from "../backgrounds/effects/media/image.schema.js";
+import { VIDEO_SCHEMA } from "../backgrounds/effects/media/video.schema.js";
+const LIST = [
+    [FILM_GRAIN_SCHEMA, { "label": "Animated film grain", "category": "texture", "family": "css", "tier": "all" }],
+    [FOGGY_GLASS_SCHEMA, { "label": "Foggy Glass Overlays", "category": "texture", "family": "css", "tier": "mid" }],
+    [FROZEN_GLASS_SCHEMA, { "label": "Stripped Frozen Glass Backgrounds", "category": "texture", "family": "css", "tier": "mid" }],
+    [HALFTONE_SCHEMA, { "label": "Halftone / dot-screen texture", "category": "texture", "family": "webgl", "tier": "mid" }],
+    [DIGITAL_GLITCH_SCHEMA, { "label": "Digital Glitch Effect Backgrounds", "category": "glitch", "family": "css", "tier": "all" }],
+    [VHS_STATIC_SCHEMA, { "label": "Pixel Distort: VHS Glitch Static Backgrounds", "category": "glitch", "family": "webgl", "tier": "mid" }],
+    [DITHER_WAVE_SCHEMA, { "label": "Wave (dithering shader)", "category": "glitch", "family": "webgl", "tier": "mid" }],
+    [RETRO_SCREEN_SCHEMA, { "label": "Retro Anime Screen", "category": "glitch", "family": "css", "tier": "all" }],
+    [RGB_SHIFT_SCHEMA, { "label": "RGB background effect", "category": "glitch", "family": "css", "tier": "all" }],
+    [MATRIX_RAIN_SCHEMA, { "label": "Matrix (digital rain)", "category": "glitch", "family": "canvas", "tier": "all" }],
+    [CRT_SCANLINES_SCHEMA, { "label": "CRT scanlines + vignette", "category": "glitch", "family": "css", "tier": "all" }],
+    [ASCII_ART_SCHEMA, { "label": "ASCII art background", "category": "glitch", "family": "canvas", "tier": "mid" }],
+    [LIQUID_GLASS_SCHEMA, { "label": "Liquid Glass 3D Shapes", "category": "glass", "family": "three", "tier": "high" }],
+    [GLASS_SHAPES_SCHEMA, { "label": "3D Glass Abstract Shapes", "category": "glass", "family": "three", "tier": "high" }],
+    [CHROME_SCHEMA, { "label": "Abstract 3D Chrome Elements", "category": "glass", "family": "three", "tier": "high" }],
+    [SPECTRAL_GHOST_SCHEMA, { "label": "Interactive Spectral 3D Ghost Effect", "category": "glass", "family": "three", "tier": "high" }],
+    [ISOMETRIC_LAYERS_SCHEMA, { "label": "Isometric Floating Layers Diagram", "category": "glass", "family": "css", "tier": "all" }],
+    [LIQUID_SCULPTURE_SCHEMA, { "label": "Liquid Sculpture Hero", "category": "glass", "family": "webgl", "tier": "high" }],
+    [WOVEN_LIGHT_SCHEMA, { "label": "Woven Light Hero", "category": "glass", "family": "three", "tier": "mid" }],
+    [RAINBOW_SCHEMA, { "label": "Pure CSS Rainbow Background", "category": "shader", "family": "css", "tier": "all" }],
+    [GRADIENT_BARS_SCHEMA, { "label": "Gradient Bars Background", "category": "shader", "family": "css", "tier": "all" }],
+    [AURORA_SCHEMA, { "label": "Aurora / northern lights", "category": "shader", "family": "css", "tier": "all" }],
+    [IRIDESCENT_SCHEMA, { "label": "Iridescent / holographic foil", "category": "shader", "family": "css", "tier": "mid" }],
+    [GOOEY_BLOBS_SCHEMA, { "label": "Gooey blobs / metaballs", "category": "shader", "family": "svg", "tier": "mid" }],
+    [SHADER_RIPPLES_SCHEMA, { "label": "Shader Animation", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [SHADER_LINES_SCHEMA, { "label": "Shader Lines", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [WAVE_DISTORTION_SCHEMA, { "label": "WebGL Shader", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [ANIMATED_GRADIENT_SCHEMA, { "label": "Animated Gradient (Componentry)", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [GRAIN_GRADIENT_SCHEMA, { "label": "Grain Gradient Hero Section", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [SMOOTH_MESH_SCHEMA, { "label": "Hero section with smooth bg Shader", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [PLASMA_GRID_SCHEMA, { "label": "Shader Background (plasma grid)", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [AETHER_SCHEMA, { "label": "AetherHero", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [CHROMATIC_SINE_SCHEMA, { "label": "Chromatic Aberration WebGL Sine Wave", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [LIQUID_SCHEMA, { "label": "Liquid Effect Background", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [MESH_GRADIENT_SCHEMA, { "label": "Mesh gradient (Stripe-style)", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [GOD_RAYS_SCHEMA, { "label": "Light beams / god rays", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [CAUSTICS_SCHEMA, { "label": "Caustics (light through water)", "category": "shader", "family": "webgl", "tier": "mid" }],
+    [GRADIENT_GRID_SCHEMA, { "label": "Procedural CSS Gradient Grid Background", "category": "grid", "family": "css", "tier": "all" }],
+    [TRIANGLE_GRID_SCHEMA, { "label": "Geometric Glowing Triangle Mask Grid", "category": "grid", "family": "css", "tier": "all" }],
+    [GRID_HOVER_SCHEMA, { "label": "Grid Lines Hover Effect", "category": "grid", "family": "css", "tier": "all" }],
+    [FADING_GRID_SCHEMA, { "label": "Fading Grid Gradient Background", "category": "grid", "family": "css", "tier": "all" }],
+    [MORPH_GRID_SCHEMA, { "label": "Dynamic CSS Shape Morphing Grid", "category": "grid", "family": "css", "tier": "all" }],
+    [LAYERED_GRID_CARDS_SCHEMA, { "label": "Textured 3D Layered Grid Cards", "category": "grid", "family": "css", "tier": "all" }],
+    [MELTY_LINES_SCHEMA, { "label": "Melty Line Goodness", "category": "grid", "family": "canvas", "tier": "all" }],
+    [DATA_GRID_SCHEMA, { "label": "DataGridHero", "category": "grid", "family": "css", "tier": "all" }],
+    [GRID_HERO_SCHEMA, { "label": "Grid Hero Animated", "category": "grid", "family": "css", "tier": "all" }],
+    [ANIMATED_GRID_SCHEMA, { "label": "Animated Grid", "category": "grid", "family": "css", "tier": "all" }],
+    [QUANTUM_GRID_SCHEMA, { "label": "Quantum Grid Hero", "category": "grid", "family": "canvas", "tier": "mid" }],
+    [NEON_GRID_TRAIL_SCHEMA, { "label": "Interactive Neon Grid Trail", "category": "grid", "family": "canvas", "tier": "all" }],
+    [DOT_PATTERN_SCHEMA, { "label": "Dot pattern / graph paper", "category": "grid", "family": "css", "tier": "all" }],
+    [MAGNET_LINES_SCHEMA, { "label": "Magnet lines", "category": "grid", "family": "css", "tier": "all" }],
+    [CONTOUR_LINES_SCHEMA, { "label": "Contour Mapping (topographic lines)", "category": "grid", "family": "svg", "tier": "all" }],
+    [GEOMETRIC_VECTORS_SCHEMA, { "label": "Abstract Background Geometric Vectors", "category": "grid", "family": "svg", "tier": "all" }],
+    [WAVY_PATTERN_SCHEMA, { "label": "Animated Wavy Pattern", "category": "wave", "family": "css", "tier": "all" }],
+    [RIPPLES_SCHEMA, { "label": "Animated Ripples Background", "category": "wave", "family": "css", "tier": "all" }],
+    [MOIRE_DOTS_SCHEMA, { "label": "Pure CSS Moiré Wave Dots", "category": "wave", "family": "css", "tier": "mid" }],
+    [LIQUID_WAVE_SCHEMA, { "label": "Pure CSS Liquid Wave Illusion", "category": "wave", "family": "css", "tier": "all" }],
+    [FLOW_FIELD_SCHEMA, { "label": "Flow field lines", "category": "wave", "family": "canvas", "tier": "mid" }],
+    [SVG_WAVE_SCHEMA, { "label": "Animated SVG Wave Background", "category": "wave", "family": "svg", "tier": "all" }],
+    [SVG_COLOR_WAVE_SCHEMA, { "label": "Animated SVG Color Wave Effect", "category": "wave", "family": "svg", "tier": "all" }],
+    [MOUNTAINS_SCHEMA, { "label": "Cool Mountain Background", "category": "wave", "family": "svg", "tier": "all" }],
+    [DRAWING_LINES_SCHEMA, { "label": "Animated SVG Background (drawing lines)", "category": "wave", "family": "svg", "tier": "all" }],
+    [WIREFRAME_OCEAN_SCHEMA, { "label": "Wireframe Ocean Vector Waves", "category": "wave", "family": "webgl", "tier": "mid" }],
+    [PARTICLE_ORB_SCHEMA, { "label": "Particle Orb CSS", "category": "particle", "family": "css", "tier": "mid" }],
+    [PARTICLES_SCHEMA, { "label": "Minimalist Canvas Animated Particle", "category": "particle", "family": "canvas", "tier": "all" }],
+    [PARTICLE_HOVER_SCHEMA, { "label": "Particle effect for hero", "category": "particle", "family": "canvas", "tier": "all" }],
+    [STARFIELD_SCHEMA, { "label": "Starfield / hyperspeed warp", "category": "particle", "family": "canvas", "tier": "mid" }],
+    [CONSTELLATION_SCHEMA, { "label": "Constellation network (particles.js style)", "category": "particle", "family": "canvas", "tier": "mid" }],
+    [FALLING_PARTICLES_SCHEMA, { "label": "Snow / rain / confetti", "category": "particle", "family": "canvas", "tier": "all" }],
+    [CURSOR_DOTS_SCHEMA, { "label": "Animated Hero (cursor dot grid)", "category": "particle", "family": "css", "tier": "all" }],
+    [BOKEH_SCHEMA, { "label": "Bokeh lights", "category": "particle", "family": "css", "tier": "all" }],
+    [METEORS_SCHEMA, { "label": "Shooting stars / meteors", "category": "particle", "family": "css", "tier": "all" }],
+    [CURSOR_GLOW_SCHEMA, { "label": "Spotlight / cursor glow", "category": "cursor", "family": "css", "tier": "all" }],
+    [PROXIMITY_MASK_SCHEMA, { "label": "Canvas Proximity Mask Effect", "category": "cursor", "family": "canvas", "tier": "all" }],
+    [NEON_TUBES_SCHEMA, { "label": "Neon 3D Tubes Cursor Trail", "category": "cursor", "family": "three", "tier": "high" }],
+    [FLUID_CURSOR_SCHEMA, { "label": "Fluid simulation / splash cursor", "category": "cursor", "family": "webgl", "tier": "high" }],
+    [WATER_RIPPLE_SCHEMA, { "label": "Water ripple on click", "category": "cursor", "family": "webgl", "tier": "mid" }],
+    [CINEMATIC_REVEAL_SCHEMA, { "label": "Cinematic Hero Section In-View Animation", "category": "scroll", "family": "css", "tier": "all" }],
+    [SCROLL_COLOR_SCHEMA, { "label": "Change background colour with GSAP ScrollTrigger", "category": "scroll", "family": "css", "tier": "all" }],
+    [SCROLL_MORPH_SCHEMA, { "label": "Scroll Morph Hero", "category": "scroll", "family": "css", "tier": "mid" }],
+    [SCROLL_TIMELINE_SCHEMA, { "label": "Native CSS scroll-driven animations", "category": "scroll", "family": "css", "tier": "all" }],
+    [PARALLAX_SCHEMA, { "label": "Parallax layers", "category": "scroll", "family": "css", "tier": "all" }],
+    [VIDEO_SCRUB_SCHEMA, { "label": "Video / image-sequence scrub on scroll", "category": "scroll", "family": "media", "tier": "mid" }],
+    [CIRCLES_PATTERN_SCHEMA, { "label": "CSS-Only Pattern: Circles", "category": "pattern", "family": "css", "tier": "all" }],
+    [DIAMONDS_PATTERN_SCHEMA, { "label": "3D Shadowed Diamonds Tessellated", "category": "pattern", "family": "css", "tier": "all" }],
+    [SCALES_PATTERN_SCHEMA, { "label": "Pure CSS Purple Scales Tessellated Pattern", "category": "pattern", "family": "css", "tier": "all" }],
+    [LEATHER_PATTERN_SCHEMA, { "label": "Pure CSS Leather Sofa Tessellated Pattern", "category": "pattern", "family": "css", "tier": "all" }],
+    [STRANGE_PATTERN_SCHEMA, { "label": "A Strange CSS Only Pattern", "category": "pattern", "family": "css", "tier": "all" }],
+    [IMAGE_SCHEMA, { "label": "Image layer (ripped paper, dust, any texture)", "category": "media", "family": "media", "tier": "all" }],
+    [VIDEO_SCHEMA, { "label": "Video background", "category": "media", "family": "media", "tier": "all" }],
+];
+export const BACKGROUND_SCHEMAS = Object.fromEntries(LIST.map(([schema, meta]) => [schema.id, { ...schema, meta }]));

package/dist/schema/buttons.d.ts

@@ -0,0 +1,3 @@
+import type { Schema } from "./types.js";
+/** Every button effect's schema, with its registry metadata, in registry order. Throws if one is missing (caught by the tests). */
+export declare const BUTTON_SCHEMAS: Readonly<Record<string, Schema>>;

package/dist/schema/buttons.js

@@ -0,0 +1,158 @@
+// The button effects' option schemas, keyed by id, in the order of BUTTON_EFFECTS. Imports only the schema files and
+// the registry, which import only types: this entry carries no effect code. Each schema gets its registry metadata here.
+import { BUTTON_EFFECTS } from "../buttons/registry.js";
+import { FILL_FADE_SCHEMA } from "../buttons/effects/fill/fillFade.schema.js";
+import { FILL_SWEEP_SCHEMA } from "../buttons/effects/fill/fillSweep.schema.js";
+import { FILL_RADIAL_SCHEMA } from "../buttons/effects/fill/fillRadial.schema.js";
+import { FILL_SHUTTER_SCHEMA } from "../buttons/effects/fill/fillShutter.schema.js";
+import { FILL_SLASH_SCHEMA } from "../buttons/effects/fill/fillSlash.schema.js";
+import { FILL_DIRECTIONAL_SCHEMA } from "../buttons/effects/fill/fillDirectional.schema.js";
+import { FILL_SPOTLIGHT_SCHEMA } from "../buttons/effects/fill/fillSpotlight.schema.js";
+import { DEPTH_TILT_SCHEMA } from "../buttons/effects/depth/depthTilt.schema.js";
+import { CURSOR_MAGNET_SCHEMA } from "../buttons/effects/cursor/cursorMagnet.schema.js";
+import { CURSOR_BLOB_SCHEMA } from "../buttons/effects/cursor/cursorBlob.schema.js";
+import { FILL_GRADIENT_SCHEMA } from "../buttons/effects/fill/fillGradient.schema.js";
+import { FILL_WAVE_SCHEMA } from "../buttons/effects/fill/fillWave.schema.js";
+import { BORDER_UNDERLINE_SCHEMA } from "../buttons/effects/border/borderUnderline.schema.js";
+import { BORDER_DRAW_SCHEMA } from "../buttons/effects/border/borderDraw.schema.js";
+import { BORDER_OUTLINE_SCHEMA } from "../buttons/effects/border/borderOutline.schema.js";
+import { BORDER_ROUND_SCHEMA } from "../buttons/effects/border/borderRound.schema.js";
+import { BORDER_CONIC_SCHEMA } from "../buttons/effects/border/borderConic.schema.js";
+import { BORDER_RUNNER_SCHEMA } from "../buttons/effects/border/borderRunner.schema.js";
+import { BORDER_SPREAD_SCHEMA } from "../buttons/effects/border/borderSpread.schema.js";
+import { BORDER_BEAM_SCHEMA } from "../buttons/effects/border/borderBeam.schema.js";
+import { BORDER_STAR_SCHEMA } from "../buttons/effects/border/borderStar.schema.js";
+import { BORDER_ANTS_SCHEMA } from "../buttons/effects/border/borderAnts.schema.js";
+import { GLOW_HOVER_SCHEMA } from "../buttons/effects/glow/glowHover.schema.js";
+import { GLOW_LIFT_SCHEMA } from "../buttons/effects/glow/glowLift.schema.js";
+import { GLOW_SHINE_SCHEMA } from "../buttons/effects/glow/glowShine.schema.js";
+import { GLOW_SHIMMER_SCHEMA } from "../buttons/effects/glow/glowShimmer.schema.js";
+import { GLOW_RAINBOW_SCHEMA } from "../buttons/effects/glow/glowRainbow.schema.js";
+import { GLOW_SHINY_SCHEMA } from "../buttons/effects/glow/glowShiny.schema.js";
+import { GLOW_GLARE_SCHEMA } from "../buttons/effects/glow/glowGlare.schema.js";
+import { GLOW_NEON_SCHEMA } from "../buttons/effects/glow/glowNeon.schema.js";
+import { GLOW_AURA_SCHEMA } from "../buttons/effects/glow/glowAura.schema.js";
+import { DEPTH_PUSHABLE_SCHEMA } from "../buttons/effects/depth/depthPushable.schema.js";
+import { PRESS_SCALE_SCHEMA } from "../buttons/effects/press/pressScale.schema.js";
+import { DEPTH_GROW_SCHEMA } from "../buttons/effects/depth/depthGrow.schema.js";
+import { DEPTH_FLOAT_SCHEMA } from "../buttons/effects/depth/depthFloat.schema.js";
+import { DEPTH_JIGGLE_SCHEMA } from "../buttons/effects/depth/depthJiggle.schema.js";
+import { DEPTH_FLIP_SCHEMA } from "../buttons/effects/depth/depthFlip.schema.js";
+import { DEPTH_CUBE_SCHEMA } from "../buttons/effects/depth/depthCube.schema.js";
+import { DEPTH_NEUMORPH_SCHEMA } from "../buttons/effects/depth/depthNeumorph.schema.js";
+import { LABEL_ROLL_SCHEMA } from "../buttons/effects/label/labelRoll.schema.js";
+import { LABEL_SWAP_SCHEMA } from "../buttons/effects/label/labelSwap.schema.js";
+import { LABEL_FALL_SCHEMA } from "../buttons/effects/label/labelFall.schema.js";
+import { LABEL_SCRAMBLE_SCHEMA } from "../buttons/effects/label/labelScramble.schema.js";
+import { LABEL_SHINY_SCHEMA } from "../buttons/effects/label/labelShiny.schema.js";
+import { ICON_NUDGE_SCHEMA } from "../buttons/effects/icon/iconNudge.schema.js";
+import { ICON_REVEAL_SCHEMA } from "../buttons/effects/icon/iconReveal.schema.js";
+import { ICON_EXPAND_SCHEMA } from "../buttons/effects/icon/iconExpand.schema.js";
+import { ICON_MORPH_SCHEMA } from "../buttons/effects/icon/iconMorph.schema.js";
+import { PRESS_RIPPLE_SCHEMA } from "../buttons/effects/press/pressRipple.schema.js";
+import { PRESS_SPARK_SCHEMA } from "../buttons/effects/press/pressSpark.schema.js";
+import { PRESS_BURST_SCHEMA } from "../buttons/effects/press/pressBurst.schema.js";
+import { PRESS_CONFETTI_SCHEMA } from "../buttons/effects/press/pressConfetti.schema.js";
+import { PRESS_SPRAY_SCHEMA } from "../buttons/effects/press/pressSpray.schema.js";
+import { PRESS_JELLY_SCHEMA } from "../buttons/effects/press/pressJelly.schema.js";
+import { STATE_SHAKE_SCHEMA } from "../buttons/effects/press/stateShake.schema.js";
+import { STATE_SPINNER_SCHEMA } from "../buttons/effects/state/stateSpinner.schema.js";
+import { STATE_SWAP_SCHEMA } from "../buttons/effects/state/stateSwap.schema.js";
+import { STATE_MORPH_SCHEMA } from "../buttons/effects/state/stateMorph.schema.js";
+import { STATE_PROGRESS_SCHEMA } from "../buttons/effects/state/stateProgress.schema.js";
+import { STATE_RING_SCHEMA } from "../buttons/effects/state/stateRing.schema.js";
+import { STATE_HOLD_SCHEMA } from "../buttons/effects/state/stateHold.schema.js";
+import { STATE_COPY_SCHEMA } from "../buttons/effects/state/stateCopy.schema.js";
+import { FILL_GOO_SCHEMA } from "../buttons/effects/fill/fillGoo.schema.js";
+import { BORDER_ELECTRIC_SCHEMA } from "../buttons/effects/border/borderElectric.schema.js";
+import { IDLE_PING_SCHEMA } from "../buttons/effects/idle/idlePing.schema.js";
+import { IDLE_BREATHE_SCHEMA } from "../buttons/effects/idle/idleBreathe.schema.js";
+import { IDLE_WIGGLE_SCHEMA } from "../buttons/effects/idle/idleWiggle.schema.js";
+import { IDLE_GRAIN_SCHEMA } from "../buttons/effects/idle/idleGrain.schema.js";
+import { GLASS_BLUR_SCHEMA } from "../buttons/effects/glass/glassBlur.schema.js";
+import { GLASS_LIQUID_SCHEMA } from "../buttons/effects/glass/glassLiquid.schema.js";
+import { GLASS_NATIVE_SCHEMA } from "../buttons/effects/glass/glassNative.schema.js";
+import { GLASS_REFRACT_SCHEMA } from "../buttons/effects/glass/glassRefract.schema.js";
+import { GLASS_DISTORT_SCHEMA } from "../buttons/effects/glass/glassDistort.schema.js";
+const BY_ID = {
+    fillFade: FILL_FADE_SCHEMA,
+    fillSweep: FILL_SWEEP_SCHEMA,
+    fillRadial: FILL_RADIAL_SCHEMA,
+    fillShutter: FILL_SHUTTER_SCHEMA,
+    fillSlash: FILL_SLASH_SCHEMA,
+    fillDirectional: FILL_DIRECTIONAL_SCHEMA,
+    fillSpotlight: FILL_SPOTLIGHT_SCHEMA,
+    depthTilt: DEPTH_TILT_SCHEMA,
+    cursorMagnet: CURSOR_MAGNET_SCHEMA,
+    cursorBlob: CURSOR_BLOB_SCHEMA,
+    fillGradient: FILL_GRADIENT_SCHEMA,
+    fillWave: FILL_WAVE_SCHEMA,
+    borderUnderline: BORDER_UNDERLINE_SCHEMA,
+    borderDraw: BORDER_DRAW_SCHEMA,
+    borderOutline: BORDER_OUTLINE_SCHEMA,
+    borderRound: BORDER_ROUND_SCHEMA,
+    borderConic: BORDER_CONIC_SCHEMA,
+    borderRunner: BORDER_RUNNER_SCHEMA,
+    borderSpread: BORDER_SPREAD_SCHEMA,
+    borderBeam: BORDER_BEAM_SCHEMA,
+    borderStar: BORDER_STAR_SCHEMA,
+    borderAnts: BORDER_ANTS_SCHEMA,
+    glowHover: GLOW_HOVER_SCHEMA,
+    glowLift: GLOW_LIFT_SCHEMA,
+    glowShine: GLOW_SHINE_SCHEMA,
+    glowShimmer: GLOW_SHIMMER_SCHEMA,
+    glowRainbow: GLOW_RAINBOW_SCHEMA,
+    glowShiny: GLOW_SHINY_SCHEMA,
+    glowGlare: GLOW_GLARE_SCHEMA,
+    glowNeon: GLOW_NEON_SCHEMA,
+    glowAura: GLOW_AURA_SCHEMA,
+    depthPushable: DEPTH_PUSHABLE_SCHEMA,
+    pressScale: PRESS_SCALE_SCHEMA,
+    depthGrow: DEPTH_GROW_SCHEMA,
+    depthFloat: DEPTH_FLOAT_SCHEMA,
+    depthJiggle: DEPTH_JIGGLE_SCHEMA,
+    depthFlip: DEPTH_FLIP_SCHEMA,
+    depthCube: DEPTH_CUBE_SCHEMA,
+    depthNeumorph: DEPTH_NEUMORPH_SCHEMA,
+    labelRoll: LABEL_ROLL_SCHEMA,
+    labelSwap: LABEL_SWAP_SCHEMA,
+    labelFall: LABEL_FALL_SCHEMA,
+    labelScramble: LABEL_SCRAMBLE_SCHEMA,
+    labelShiny: LABEL_SHINY_SCHEMA,
+    iconNudge: ICON_NUDGE_SCHEMA,
+    iconReveal: ICON_REVEAL_SCHEMA,
+    iconExpand: ICON_EXPAND_SCHEMA,
+    iconMorph: ICON_MORPH_SCHEMA,
+    pressRipple: PRESS_RIPPLE_SCHEMA,
+    pressSpark: PRESS_SPARK_SCHEMA,
+    pressBurst: PRESS_BURST_SCHEMA,
+    pressConfetti: PRESS_CONFETTI_SCHEMA,
+    pressSpray: PRESS_SPRAY_SCHEMA,
+    pressJelly: PRESS_JELLY_SCHEMA,
+    stateShake: STATE_SHAKE_SCHEMA,
+    stateSpinner: STATE_SPINNER_SCHEMA,
+    stateSwap: STATE_SWAP_SCHEMA,
+    stateMorph: STATE_MORPH_SCHEMA,
+    stateProgress: STATE_PROGRESS_SCHEMA,
+    stateRing: STATE_RING_SCHEMA,
+    stateHold: STATE_HOLD_SCHEMA,
+    stateCopy: STATE_COPY_SCHEMA,
+    fillGoo: FILL_GOO_SCHEMA,
+    borderElectric: BORDER_ELECTRIC_SCHEMA,
+    idlePing: IDLE_PING_SCHEMA,
+    idleBreathe: IDLE_BREATHE_SCHEMA,
+    idleWiggle: IDLE_WIGGLE_SCHEMA,
+    idleGrain: IDLE_GRAIN_SCHEMA,
+    glassBlur: GLASS_BLUR_SCHEMA,
+    glassLiquid: GLASS_LIQUID_SCHEMA,
+    glassNative: GLASS_NATIVE_SCHEMA,
+    glassRefract: GLASS_REFRACT_SCHEMA,
+    glassDistort: GLASS_DISTORT_SCHEMA,
+};
+/** Every button effect's schema, with its registry metadata, in registry order. Throws if one is missing (caught by the tests). */
+export const BUTTON_SCHEMAS = Object.fromEntries(BUTTON_EFFECTS.map((m) => {
+    const schema = BY_ID[m.id];
+    if (!schema)
+        throw new Error(`[@sharedex/ui] no schema for button effect "${m.id}"`);
+    return [m.id, { ...schema, meta: { label: m.label, category: m.group, family: m.tech, tier: m.tier } }];
+}));

package/dist/schema/carousel.d.ts

@@ -0,0 +1,14 @@
+import type { Schema } from "./types.js";
+/** The 16 layout presets: flat rows, stacks, then 3D shapes. `axis: "x"` in `modes` = horizontal only. */
+export declare const CAROUSEL_LAYOUT_SCHEMAS: Readonly<Record<string, Schema>>;
+/** Speed effects, added to any layout with `modify()`. */
+export declare const CAROUSEL_MODIFIER_SCHEMAS: Readonly<Record<string, Schema>>;
+/** Enter / exit presets (`presence.*`). */
+export declare const CAROUSEL_PRESENCE_SCHEMAS: Readonly<Record<string, Schema>>;
+/** Open views (`openView.*`). */
+export declare const CAROUSEL_OPEN_SCHEMAS: Readonly<Record<string, Schema>>;
+/** How a drag lands (`physics.settle`). */
+export declare const CAROUSEL_PHYSICS_SCHEMAS: Readonly<Record<string, Schema>>;
+/** `<Carousel.Root config>` as one form. */
+export declare const CAROUSEL_SCHEMAS: Readonly<Record<string, Schema>>;
+export { CAROUSEL_SECTIONS, type CarouselSection, type CarouselSettings } from "../carousel/config.schema.js";

package/dist/schema/carousel.js

@@ -0,0 +1,73 @@
+// The carousel's option schemas: its layouts, speed effects, enter / exit presets, open views, settle policies and
+// its own settings. The carousel has no metadata registry like TRANSITION_EFFECTS, so labels and categories are
+// set here. Imports only schema files, which import only types: this entry carries no carousel code.
+import { WAVE_SCHEMA } from "../carousel/layout/presets/wave.schema.js";
+import { SCALE_SCHEMA } from "../carousel/layout/presets/scale.schema.js";
+import { SPOTLIGHT_SCHEMA } from "../carousel/layout/presets/spotlight.schema.js";
+import { SUPER_FLOW_SCHEMA } from "../carousel/layout/presets/superFlow.schema.js";
+import { EXPO_SCHEMA } from "../carousel/layout/presets/expo.schema.js";
+import { MATERIAL_SCHEMA } from "../carousel/layout/presets/material.schema.js";
+import { FALL_AWAY_SCHEMA } from "../carousel/layout/presets/fallAway.schema.js";
+import { FAN_SCHEMA } from "../carousel/layout/presets/fan.schema.js";
+import { DECK_SCHEMA } from "../carousel/layout/presets/deck.schema.js";
+import { COVERFLOW_SCHEMA } from "../carousel/layout/presets/coverflow.schema.js";
+import { PANORAMA_SCHEMA } from "../carousel/layout/presets/panorama.schema.js";
+import { STAIRCASE_SCHEMA } from "../carousel/layout/presets/staircase.schema.js";
+import { BARREL_SCHEMA } from "../carousel/layout/presets/barrel.schema.js";
+import { RING_SCHEMA } from "../carousel/layout/presets/ring.schema.js";
+import { HELIX_SCHEMA } from "../carousel/layout/presets/helix.schema.js";
+import { SPHERE_SCHEMA } from "../carousel/layout/presets/sphere.schema.js";
+import { SPEED_TILT_SCHEMA, SPEED_WAVE_SCHEMA } from "../carousel/layout/modifiers/speed.schema.js";
+import { PRESENCE_CONTRACT_SCHEMA, PRESENCE_EXPAND_SCHEMA, PRESENCE_FADE_SCHEMA, PRESENCE_SCATTER_SCHEMA, PRESENCE_SLIDE_ALONG_SCHEMA, } from "../carousel/layout/presence.schema.js";
+import { OPEN_DETAIL_SCHEMA, OPEN_INLINE_SCHEMA, OPEN_PANEL_SCHEMA } from "../carousel/layout/open.schema.js";
+import { FREE_SCROLL_SCHEMA, MOMENTUM_SNAP_SCHEMA, PAGED_BY_SCHEMA, SNAP_TO_NEAREST_SCHEMA } from "../carousel/physics/policies.schema.js";
+import { CAROUSEL_SCHEMA } from "../carousel/config.schema.js";
+const keyed = (list) => Object.fromEntries(list.map(([schema, meta]) => [schema.id, { ...schema, meta }]));
+/** The 16 layout presets: flat rows, stacks, then 3D shapes. `axis: "x"` in `modes` = horizontal only. */
+export const CAROUSEL_LAYOUT_SCHEMAS = keyed([
+    [WAVE_SCHEMA, { label: "Wave", category: "row" }],
+    [SCALE_SCHEMA, { label: "Scale", category: "row" }],
+    [SPOTLIGHT_SCHEMA, { label: "Spotlight", category: "row" }],
+    [SUPER_FLOW_SCHEMA, { label: "Super flow", category: "row" }],
+    [EXPO_SCHEMA, { label: "Expo", category: "row" }],
+    [MATERIAL_SCHEMA, { label: "Material", category: "row", modes: ["x"] }],
+    [FALL_AWAY_SCHEMA, { label: "Fall away", category: "row" }],
+    [FAN_SCHEMA, { label: "Fan", category: "stack" }],
+    [DECK_SCHEMA, { label: "Deck", category: "stack" }],
+    [COVERFLOW_SCHEMA, { label: "Coverflow", category: "shape" }],
+    [PANORAMA_SCHEMA, { label: "Panorama", category: "shape", modes: ["x"] }],
+    [STAIRCASE_SCHEMA, { label: "Staircase", category: "shape" }],
+    [BARREL_SCHEMA, { label: "Barrel", category: "shape" }],
+    [RING_SCHEMA, { label: "Ring", category: "shape" }],
+    [HELIX_SCHEMA, { label: "Helix", category: "shape" }],
+    [SPHERE_SCHEMA, { label: "Sphere", category: "shape" }],
+]);
+/** Speed effects, added to any layout with `modify()`. */
+export const CAROUSEL_MODIFIER_SCHEMAS = keyed([
+    [SPEED_WAVE_SCHEMA, { label: "Wave while moving" }],
+    [SPEED_TILT_SCHEMA, { label: "Lean while moving" }],
+]);
+/** Enter / exit presets (`presence.*`). */
+export const CAROUSEL_PRESENCE_SCHEMAS = keyed([
+    [PRESENCE_FADE_SCHEMA, { label: "Fade" }],
+    [PRESENCE_CONTRACT_SCHEMA, { label: "Contract into the focus" }],
+    [PRESENCE_EXPAND_SCHEMA, { label: "Expand past the viewer" }],
+    [PRESENCE_SCATTER_SCHEMA, { label: "Scatter" }],
+    [PRESENCE_SLIDE_ALONG_SCHEMA, { label: "Slide along the track" }],
+]);
+/** Open views (`openView.*`). */
+export const CAROUSEL_OPEN_SCHEMAS = keyed([
+    [OPEN_INLINE_SCHEMA, { label: "Grow in place" }],
+    [OPEN_DETAIL_SCHEMA, { label: "Big card over a thumbnail strip" }],
+    [OPEN_PANEL_SCHEMA, { label: "Big card beside a panel" }],
+]);
+/** How a drag lands (`physics.settle`). */
+export const CAROUSEL_PHYSICS_SCHEMAS = keyed([
+    [MOMENTUM_SNAP_SCHEMA, { label: "Glide, then land on a card" }],
+    [SNAP_TO_NEAREST_SCHEMA, { label: "Spring to the nearest card" }],
+    [FREE_SCROLL_SCHEMA, { label: "Glide and stop anywhere" }],
+    [PAGED_BY_SCHEMA, { label: "Move a page of cards at a time" }],
+]);
+/** `<Carousel.Root config>` as one form. */
+export const CAROUSEL_SCHEMAS = keyed([[CAROUSEL_SCHEMA, { label: "Carousel" }]]);
+export { CAROUSEL_SECTIONS } from "../carousel/config.schema.js";

package/dist/schema/common.d.ts

@@ -0,0 +1,41 @@
+import type { BlendMode } from "../backgrounds/types.js";
+import type { ChoiceField, ColorField, ColorsField, EffectField, NumberField, SeedField } from "./types.js";
+/**
+ * A background layer's `opacity`, `blend` and `mask` (`LayerOptions`). Auto
+ * unless a piece sets its own default: left out, the layer is fully opaque,
+ * blends normally and is not masked.
+ */
+export declare function layerFields(defaults?: {
+    readonly opacity?: number;
+}): {
+    opacity: NumberField;
+    blend: ChoiceField<BlendMode>;
+    mask: ChoiceField<string>;
+};
+/** A pace multiplier: 1 = the piece's own pace. Auto (left out, the piece runs at 1). */
+export declare function speedField(max?: number): NumberField;
+/** A seed with a known default, or auto when leaving it out means something no value reproduces. */
+export declare function seedField(defaultSeed?: number): SeedField;
+/** A colour list; `fallback` is what the piece uses when the list is left out. */
+export declare function colorsField(fallback: readonly string[], min?: number, max?: number, label?: string): ColorsField;
+/** A button fill's colour, the label's colour on it, and how long it takes (`FillOptions`). */
+export declare function buttonFillFields(duration?: number): {
+    color: ColorField;
+    textColor: ColorField;
+    duration: NumberField;
+};
+/** A shader transition's `fallback`: any CSS transition, played without WebGL or on a weaker device. */
+export declare function shaderFallbackField(note?: string): EffectField;
+/** An entrance's timing (`EnterTiming` without `from`). `stagger` is auto unless the effect fixes its own: left out, it follows what moves. */
+export declare function textEnterFields(defaults: {
+    readonly duration: number;
+    readonly stagger?: number;
+}): {
+    duration: NumberField;
+    stagger: NumberField;
+    delay: NumberField;
+};
+/** What an entrance moves (`EnterOptions.by`). */
+export declare function textByField(by: "chars" | "words" | "lines"): ChoiceField<"chars" | "words" | "lines">;
+/** Which piece of an entrance goes first (`EnterTiming.from`). */
+export declare function textFromField(): ChoiceField<"start" | "end" | "centre" | "edges">;

package/dist/schema/common.js

@@ -0,0 +1,109 @@
+const BLEND_MODES = [
+    "normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn",
+    "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity",
+];
+/**
+ * A background layer's `opacity`, `blend` and `mask` (`LayerOptions`). Auto
+ * unless a piece sets its own default: left out, the layer is fully opaque,
+ * blends normally and is not masked.
+ */
+export function layerFields(defaults = {}) {
+    const opacity = {
+        kind: "number",
+        label: "Opacity",
+        min: 0,
+        max: 1,
+        step: 0.01,
+        ...(defaults.opacity !== undefined ? { default: defaults.opacity } : { autoValue: 1, autoNote: "1 (fully opaque)" }),
+    };
+    const blend = {
+        kind: "choice",
+        label: "Blend",
+        values: BLEND_MODES,
+        advanced: true,
+        autoValue: "normal",
+        autoNote: "normal",
+    };
+    const mask = {
+        kind: "choice",
+        label: "Mask",
+        values: ["radial", "fade-top", "fade-bottom", "fade-edges"],
+        labels: { radial: "Radial", "fade-top": "Fade at the top", "fade-bottom": "Fade at the bottom", "fade-edges": "Fade at the edges" },
+        advanced: true,
+        autoNote: "none",
+    };
+    return { opacity, blend, mask };
+}
+/** A pace multiplier: 1 = the piece's own pace. Auto (left out, the piece runs at 1). */
+export function speedField(max = 4) {
+    return { kind: "number", label: "Speed", min: 0, max, step: 0.05, autoValue: 1, autoNote: "1 (its own pace)" };
+}
+/** A seed with a known default, or auto when leaving it out means something no value reproduces. */
+export function seedField(defaultSeed) {
+    return {
+        kind: "seed",
+        label: "Seed",
+        advanced: true,
+        help: "Change it for a different arrangement of the same effect.",
+        ...(defaultSeed !== undefined ? { default: defaultSeed } : { autoNote: "the effect's own" }),
+    };
+}
+/** A colour list; `fallback` is what the piece uses when the list is left out. */
+export function colorsField(fallback, min = 1, max = 6, label = "Colours") {
+    return { kind: "colors", label, min, max, default: fallback };
+}
+/** A button fill's colour, the label's colour on it, and how long it takes (`FillOptions`). */
+export function buttonFillFields(duration = 0.35) {
+    const color = { kind: "color", label: "Fill colour", default: "var(--color-sx-accent)" };
+    const textColor = { kind: "color", label: "Label colour", help: "The label's colour while filled.", default: "var(--color-sx-ink)" };
+    const time = { kind: "number", label: "Duration", min: 0.1, max: 1.5, step: 0.05, unit: "s", default: duration };
+    return { color, textColor, duration: time };
+}
+/** A shader transition's `fallback`: any CSS transition, played without WebGL or on a weaker device. */
+export function shaderFallbackField(note = "a fade") {
+    return {
+        kind: "effect",
+        label: "Fallback",
+        family: "transition",
+        kinds: ["css"],
+        autoNote: note,
+        help: "Plays instead without WebGL or on a weaker device.",
+        advanced: true,
+    };
+}
+/** An entrance's timing (`EnterTiming` without `from`). `stagger` is auto unless the effect fixes its own: left out, it follows what moves. */
+export function textEnterFields(defaults) {
+    const duration = { kind: "number", label: "Duration", min: 0.1, max: 3, step: 0.05, unit: "s", default: defaults.duration };
+    const stagger = {
+        kind: "number",
+        label: "Between pieces",
+        min: 0,
+        max: 0.5,
+        step: 0.005,
+        unit: "s",
+        ...(defaults.stagger !== undefined ? { default: defaults.stagger } : { autoValue: 0.07, autoNote: "0.03 s for letters, 0.07 s for words, 0.12 s for lines" }),
+    };
+    const delay = { kind: "number", label: "Delay", min: 0, max: 3, step: 0.05, unit: "s", default: 0 };
+    return { duration, stagger, delay };
+}
+/** What an entrance moves (`EnterOptions.by`). */
+export function textByField(by) {
+    return {
+        kind: "choice",
+        label: "Moves",
+        values: ["chars", "words", "lines"],
+        labels: { chars: "Letters", words: "Words", lines: "Lines" },
+        help: "Letters only in short text; Arabic and other joined scripts move by the word.",
+        default: by,
+    };
+}
+/** Which piece of an entrance goes first (`EnterTiming.from`). */
+export function textFromField() {
+    return {
+        kind: "choice",
+        label: "First",
+        values: ["start", "end", "centre", "edges"],
+        labels: { start: "Reading start", end: "Reading end", centre: "Middle out", edges: "Edges in" },
+        default: "start",
+    };
+}