@neo-ui-kit/react 0.0.0-stage → 1.0.0

package/dist/components/artwork/DatabaseArt/DatabaseArt.d.ts

@@ -0,0 +1,6 @@
+import { type CommonProps } from "../../../core/base";
+export interface DatabaseArtProps extends CommonProps {
+    label?: string;
+}
+/** Neon database cylinder: light orbits run along its rings, sparks twinkle around it. */
+export declare function DatabaseArt({ label, ...p }: DatabaseArtProps): import("react").JSX.Element;

package/dist/components/artwork/DatabaseArt/styles.css

@@ -0,0 +1,58 @@
+/* Styles owned by DatabaseArt. Orbit, spark and aura animations are shared with ServerArt. */
+.ad-database-art {
+  display: block;
+  width: 100%;
+  max-width: 11rem;
+  aspect-ratio: 170 / 179;
+  height: auto;
+  position: relative;
+  overflow: visible;
+}
+/* An artwork stack (see layers.tsx): drawings laid exactly over each other. */
+:is(.ad-database-art, .ad-server-art) > .ad-art-layer {
+  position: absolute;
+  inset: 0;
+  display: block;
+  width: 100%;
+  height: 100%;
+  overflow: visible;
+  pointer-events: none;
+}
+/* The orbits are the only drawing that repaints: three thin dashes, with no filter. */
+.ad-art-orbit {
+  stroke-dasharray: 14 86;
+  stroke-linecap: round;
+  animation: ad-art-orbit 4s linear infinite;
+}
+/* The same pulses on whole layers: the compositor scales and fades them, nothing repaints.
+   Each layer scales about its own point (set inline from the drawing). */
+.ad-art-spark-layer {
+  animation: ad-art-spark 4s ease-in-out var(--ad-delay, 0s) infinite;
+  will-change: transform, opacity;
+}
+.ad-art-aura-layer {
+  animation: ad-art-aura 5s ease-in-out infinite;
+  will-change: transform, opacity;
+}
+@keyframes ad-art-orbit {
+  to {
+    stroke-dashoffset: -100;
+  }
+}
+@keyframes ad-art-spark {
+  0%,
+  100% {
+    opacity: 0.35;
+    transform: scale(0.7);
+  }
+  50% {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+@keyframes ad-art-aura {
+  50% {
+    opacity: 0.6;
+    transform: scale(1.08);
+  }
+}

package/dist/components/artwork/Landscape/Landscape.d.ts

@@ -0,0 +1,7 @@
+import { type CommonProps } from "../../../core/base";
+export interface LandscapeProps extends CommonProps {
+    /** Darken the left side so text placed over it stays readable. */
+    shade?: boolean;
+}
+/** Procedural night landscape with a planet; children are laid over it. */
+export declare function Landscape({ shade, children, ...p }: LandscapeProps): import("react").JSX.Element;

package/dist/components/artwork/Landscape/styles.css

@@ -0,0 +1,79 @@
+/* Styles owned by Landscape: the painting fades in, the horizon glow pulses and the frame drifts slowly. */
+.ad-landscape {
+  position: relative;
+  isolation: isolate;
+  overflow: hidden;
+  min-height: 7rem;
+  aspect-ratio: 1220 / 168;
+  border-radius: var(--ad-radius);
+  background: var(--ad-neutral-900);
+}
+.ad-landscape > canvas {
+  /* Painted in ruby; turned to the theme hue. */
+  filter: hue-rotate(var(--ad-hue-shift, 0deg));
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  object-position: 70% 50%;
+  opacity: 0;
+  transition: opacity 1.2s ease-out;
+  animation: ad-landscape-drift 24s ease-in-out infinite alternate;
+}
+.ad-landscape > canvas[data-ready] {
+  opacity: 0.8;
+}
+.ad-landscape[data-shade]::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  background: linear-gradient(
+    90deg,
+    rgb(from var(--ad-neutral-900) r g b / 0.94) 0%,
+    rgb(from var(--ad-neutral-900) r g b / 0.67) 32%,
+    rgb(from var(--ad-neutral-900) r g b / 0.15) 70%,
+    rgb(from var(--ad-neutral-900) r g b / 0.04)
+  );
+  pointer-events: none;
+}
+/* Breathing glow where the planet meets the ridge. */
+.ad-landscape-glow {
+  position: absolute;
+  z-index: 1;
+  left: 58%;
+  bottom: -10%;
+  width: 28%;
+  aspect-ratio: 2;
+  border-radius: 50%;
+  background: radial-gradient(closest-side, rgb(from var(--ad-primary) r g b / 0.33), transparent);
+  mix-blend-mode: screen;
+  animation: ad-landscape-glow 5s ease-in-out infinite;
+  pointer-events: none;
+}
+.ad-landscape-content {
+  position: relative;
+  z-index: 2;
+  height: 100%;
+  padding: clamp(0.75rem, 2vw, 1.5rem);
+}
+@keyframes ad-landscape-drift {
+  from {
+    transform: scale(1.02) translateX(0);
+  }
+  to {
+    transform: scale(1.08) translateX(-1.5%);
+  }
+}
+@keyframes ad-landscape-glow {
+  0%,
+  100% {
+    opacity: 0.5;
+    scale: 0.9;
+  }
+  50% {
+    opacity: 1;
+    scale: 1.1;
+  }
+}

package/dist/components/artwork/NeonWaves/NeonWaves.d.ts

@@ -0,0 +1,15 @@
+import { type CommonProps } from "../../../core/base";
+export interface NeonWavesProps extends CommonProps {
+    /** Number of strands in the bundle. */
+    strands?: number;
+    /** Scatter faint stars around the strands. */
+    stars?: boolean;
+    /** Shifts the wave shape, so neighbouring instances do not move in step. */
+    phase?: number;
+    /** "twist" braids the strands across; "ridge" lays them low on the left and lifts them into a mountain peak on the right. */
+    shape?: "twist" | "ridge";
+    /** Sparks of light that run along the strands. */
+    comets?: number;
+}
+/** A bundle of neon strands that flow and twist slowly, with faint stars around them. */
+export declare function NeonWaves({ strands, stars, phase, shape, comets, ...p }: NeonWavesProps): import("react").JSX.Element;

package/dist/components/artwork/NeonWaves/styles.css

@@ -0,0 +1,48 @@
+/* Styles owned by NeonWaves: the strands move by script; the stars twinkle on their own and the comets are moved by script. */
+.ad-neon-waves {
+  position: relative;
+  display: block;
+  width: 100%;
+  height: clamp(4.5rem, 3rem + 6vw, 7.5rem);
+  overflow: visible;
+  pointer-events: none;
+}
+/* The large wrappers stay unpromoted; only the small comet children need moving layers. */
+.ad-neon-waves-strands,
+.ad-neon-waves-comets {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  overflow: visible;
+}
+.ad-neon-waves-star {
+  position: absolute;
+  aspect-ratio: 1;
+  border-radius: 50%;
+  background: var(--ad-pink);
+  translate: -50% -50%;
+  animation: ad-neon-twinkle 4s ease-in-out infinite;
+}
+@keyframes ad-neon-twinkle {
+  50% {
+    opacity: 0.05;
+  }
+}
+/* A comet is a short bright dash with a glow. Its glow is drawn once on its own layer; the
+   script only moves and fades it, so a running comet costs no repaint and no live filter. */
+.ad-neon-waves-comet {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 0;
+  height: 1.6px;
+  border-radius: 0.8px;
+  background: var(--ad-secondary-100, #ffb9cb);
+  box-shadow:
+    0 0 0.2rem var(--ad-pink),
+    0 0 0.5rem var(--ad-primary),
+    0 0 0.7rem rgb(from var(--ad-primary) r g b / 0.5);
+  opacity: 0;
+  will-change: transform, opacity;
+}

package/dist/components/artwork/Planet/Planet.d.ts

@@ -0,0 +1,4 @@
+import { type CommonProps } from "../../../core/base";
+export type PlanetProps = CommonProps;
+/** Planet horizon banner; children are laid over the dark side. */
+export declare function Planet({ children, ...p }: PlanetProps): import("react").JSX.Element;

package/dist/components/artwork/Planet/styles.css

@@ -0,0 +1,52 @@
+/* Styles owned by Planet: the planet fades in and its rim breathes with light. */
+.ad-planet {
+  position: relative;
+  isolation: isolate;
+  overflow: hidden;
+  min-height: 6rem;
+  aspect-ratio: 515 / 114;
+  border-radius: var(--ad-radius);
+  background:
+    radial-gradient(ellipse 60% 120% at 100% 100%, rgb(from var(--ad-primary) r g b / 0.08), transparent 70%),
+    var(--ad-neutral-900);
+}
+.ad-planet > canvas {
+  /* Painted in ruby; turned to the theme hue (a static filter, applied once). */
+  filter: hue-rotate(var(--ad-hue-shift, 0deg));
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  object-position: 100% 100%;
+  opacity: 0;
+  transition: opacity 1.2s ease-out;
+}
+/* The rim breathes: a light over the planet's edge swells and settles (opacity only; the painted
+   canvas is never re-filtered and nothing is blended). */
+.ad-planet::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: 0;
+  background: radial-gradient(ellipse 70% 120% at 100% 100%, transparent 38%, rgb(from var(--ad-secondary) r g b / 0.16) 52%, transparent 66%);
+  opacity: 0;
+  animation: ad-planet-rim 6s ease-in-out infinite;
+  pointer-events: none;
+  /* A layer of its own: the painted canvas under it is never redrawn by the breath. */
+  will-change: opacity;
+}
+.ad-planet > canvas[data-ready] {
+  opacity: 1;
+}
+.ad-planet-content {
+  position: relative;
+  z-index: 1;
+  height: 100%;
+  padding: clamp(0.75rem, 2vw, 1.5rem);
+}
+@keyframes ad-planet-rim {
+  50% {
+    opacity: 1;
+  }
+}

package/dist/components/artwork/QuantumField/QuantumField.d.ts

@@ -0,0 +1,42 @@
+import { type CommonProps } from "../../../core/base";
+/** Seven deliberately different three-dimensional compositions. */
+export declare const quantumFieldModes: readonly ["orbit", "vortex", "lattice", "wave", "bloom", "helix", "terrain"];
+export type QuantumFieldMode = (typeof quantumFieldModes)[number];
+export type QuantumFieldQuality = "auto" | "low" | "high";
+export interface QuantumAudioFrame {
+    /** Seven normalized bands from bass to air, each 0–1. */
+    bands: readonly number[];
+    energy?: number;
+    beat?: number;
+}
+type AudioInput = QuantumAudioFrame | Pick<AnalyserNode, "frequencyBinCount" | "getByteFrequencyData"> | (() => QuantumAudioFrame);
+export interface QuantumFieldProps extends CommonProps {
+    /** The field is visible on first paint; no start screen or keyboard gate. */
+    mode?: QuantumFieldMode;
+    quality?: QuantumFieldQuality;
+    /** 0–1. Capped internally to keep third-party pages responsive. */
+    density?: number;
+    /** 0 pauses its drift, 1 is the normal cinematic pace. */
+    speed?: number;
+    /** Supply an AnalyserNode, seven-band frame, or a callback reading the latest frame. */
+    audio?: AudioInput;
+    /** Optional microphone/loopback stream obtained after an explicit user action. */
+    stream?: MediaStream;
+    /** Override just this instance; otherwise it follows the nearest ThemeProvider/CSS tokens. */
+    palette?: readonly [string, string];
+    interactive?: boolean;
+    paused?: boolean;
+}
+/** Caps both backing-store size and DPR; large monitors never create huge canvases. */
+export declare function quantumFieldResolution(width: number, height: number, dpr: number, quality: QuantumFieldQuality): {
+    width: number;
+    height: number;
+};
+/** Reads an analyser into a caller-owned scratch buffer, then reduces it to stable log-spaced bands. */
+export declare function quantumFieldAudio(analyser: Pick<AnalyserNode, "frequencyBinCount" | "getByteFrequencyData">, scratch: Uint8Array, frame?: {
+    bands: number[];
+    energy: number;
+}): QuantumAudioFrame;
+/** Theme-native, audio-reactive 3D field with a lightweight 2D fallback. */
+export declare function QuantumField({ mode, quality, density, speed, audio, stream, palette, interactive, paused, ...p }: QuantumFieldProps): import("react").JSX.Element;
+export {};

package/dist/components/artwork/QuantumField/QuantumFieldExperience.d.ts

@@ -0,0 +1,22 @@
+import { type HTMLAttributes } from "react";
+type Control = {
+    key: string;
+    label: string;
+    value: number | boolean | string;
+    min?: number;
+    max?: number;
+    step?: number;
+    options?: readonly string[];
+};
+export declare const quantumFieldExperienceControls: readonly {
+    id: string;
+    label: string;
+    controls: readonly Control[];
+}[];
+export type QuantumFieldExperienceProps = Omit<HTMLAttributes<HTMLDivElement>, "children"> & {
+    /** Maximum number of visible particles across both field layers. Adaptive quality may draw fewer. */
+    particleBudget?: number;
+};
+/** Full MIT-licensed renderer; the host kit owns the controls and theme. */
+export declare function QuantumFieldExperience({ className, particleBudget, ...props }: QuantumFieldExperienceProps): import("react").JSX.Element;
+export {};

package/dist/components/artwork/QuantumField/UPSTREAM-LICENSE.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Quantum Fields Contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components/artwork/QuantumField/audio.d.ts

@@ -0,0 +1,15 @@
+/** Optional transport for a QuantumField. Nothing records, plays, or requests permission until called. */
+export declare function createQuantumFieldAudio(): {
+    analyser: AnalyserNode;
+    readonly media: HTMLAudioElement | null;
+    /** Replaces the current source; playback starts only when play() is called. */
+    loadFile(file: Blob): HTMLAudioElement;
+    /** Connects an app-owned stream. The app remains responsible for its tracks. */
+    connectStream: (stream: MediaStream) => void;
+    /** Explicit user-gesture operation; only streams created here are stopped by the controller. */
+    requestMicrophone(): Promise<MediaStream>;
+    play(): Promise<void>;
+    pause(): void;
+    seek(seconds: number): void;
+    dispose(): Promise<void>;
+};

package/dist/components/artwork/QuantumField/renderer.d.ts

@@ -0,0 +1,24 @@
+import type { QuantumAudioFrame, QuantumFieldMode } from "./QuantumField";
+/** Four floats per particle: true x/y/z and a stable band/accent seed. */
+export declare function quantumFieldGeometry(mode: QuantumFieldMode, count: number): Float32Array<ArrayBuffer>;
+/** Short connected paths share the same 3D grammar as the points, but stay sparse at rest. */
+export declare function quantumFieldFilaments(mode: QuantumFieldMode, strands: number, steps: number): Float32Array<ArrayBuffer>;
+/** A tiny, deterministic proximity graph; only this small buffer changes every two seconds. */
+export declare function quantumFieldNetwork(mode: QuantumFieldMode, nodes: number, epoch: number): Float32Array<ArrayBuffer>;
+/** Exponential wheel response is independent of mouse notch size and safely bounded. */
+export declare const quantumFieldZoom: (distance: number, deltaY: number) => number;
+/** One static GPU buffer, two inexpensive point passes, no texture uploads or postprocessing. */
+export declare function createQuantumFieldRenderer(canvas: HTMLCanvasElement, mode: QuantumFieldMode, count: number): {
+    setPalette(main: string, light: string): void;
+    resize(width: number, height: number): void;
+    draw(time: number, camera: {
+        zoom: number;
+        yaw: number;
+        pitch: number;
+    }, audio?: QuantumAudioFrame, pointer?: {
+        x: number;
+        y: number;
+        active: boolean;
+    }): void;
+    dispose(): void;
+} | null;

package/dist/components/artwork/QuantumField/styles.css

@@ -0,0 +1,77 @@
+.ad-quantum-field {
+  position: relative;
+  display: block;
+  width: 100%;
+  height: clamp(12rem, 24vw, 28rem);
+  overflow: hidden;
+  isolation: isolate;
+  background: transparent;
+}
+.ad-quantum-field > canvas {
+  display: block;
+  width: 100%;
+  height: 100%;
+  pointer-events: none;
+}
+.ad-quantum-field[data-interactive="true"] {
+  cursor: grab;
+  touch-action: none;
+}
+.ad-quantum-field[data-interactive="true"]:active { cursor: grabbing; }
+.ad-quantum-field > :not(canvas) {
+  position: relative;
+  z-index: 1;
+}
+
+.ad-quantum-field-experience {
+  width: 100%;
+  overflow: hidden;
+  border-radius: var(--ad-radius-lg, 1rem);
+  background: transparent;
+}
+.ad-qf-controls {
+  display: grid;
+  gap: 0.75rem;
+  padding: 0.75rem 0;
+}
+.ad-qf-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.625rem; }
+.ad-qf-toolbar > .ad-file-picker { flex: none; }
+.ad-qf-toolbar > .ad-file-picker > small { display: none; }
+.ad-qf-toolbar > .ad-file-picker > .ad-button { max-width: 11rem; }
+.ad-qf-toolbar > .ad-file-picker .ad-button-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.ad-qf-toolbar > .ad-audio-player { flex: 1 1 13rem; min-width: min(100%, 13rem); padding: 0.35rem 0.5rem; }
+.ad-qf-toolbar .ad-player-play > .ad-icon-button { --ad-size-h: 2.25rem; width: 2.25rem; height: 2.25rem; }
+.ad-qf-actions { display: flex; align-items: center; gap: 0.25rem; }
+.ad-qf-actions > .ad-tooltip-trigger { display: inline-flex; }
+.ad-qf-controls nav { max-width: 100%; overflow-x: auto; }
+.ad-qf-controls .ad-collapse-content { display: grid; gap: 0.75rem; }
+.ad-qf-control-panel { display: grid; gap: 0.75rem; }
+.ad-qf-setting-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
+  gap: 0.75rem 1rem;
+  align-items: center;
+}
+.ad-qf-essentials { flex: 1 1 18rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
+.ad-qf-setting { display: flex; align-items: end; gap: 0.5rem; min-width: 0; }
+.ad-qf-setting > .ad-slider-field { flex: 1; min-width: 0; }
+.ad-qf-setting > output { min-width: 3ch; padding-bottom: 0.55rem; color: var(--ad-muted); font-variant-numeric: tabular-nums; text-align: end; }
+.ad-qf-fps, .ad-qf-status { color: var(--ad-muted); font-size: 0.75rem; }
+.ad-qf-status { min-height: 1em; }
+.ad-qf-viewport {
+  position: relative;
+  width: 100%;
+  height: clamp(18rem, 42vh, 27rem);
+  background: transparent;
+}
+.ad-qf-viewport > .ad-quantum-field {
+  height: 100%;
+}
+.ad-qf-viewport > iframe {
+  display: block;
+  width: 100%;
+  height: 100%;
+  border: 0;
+  background: transparent;
+  color-scheme: dark;
+}

package/dist/components/artwork/ServerArt/ServerArt.d.ts

@@ -0,0 +1,8 @@
+import { type CommonProps } from "../../../core/base";
+export interface ServerArtProps extends CommonProps {
+    /** Show an upload cloud above the rack (deployment scenes). */
+    upload?: boolean;
+    label?: string;
+}
+/** Neon server rack: LEDs blink, a light runs along its edge, a spark twinkles above. */
+export declare function ServerArt({ upload, label, ...p }: ServerArtProps): import("react").JSX.Element;

package/dist/components/artwork/ServerArt/styles.css

@@ -0,0 +1,43 @@
+/* Styles owned by ServerArt. The layer stack, spark and aura pulses come from DatabaseArt. */
+.ad-server-art {
+  display: block;
+  width: 100%;
+  max-width: 11rem;
+  aspect-ratio: 180 / 170;
+  height: auto;
+  position: relative;
+  overflow: visible;
+}
+.ad-server-led,
+.ad-server-glow {
+  stroke: var(--ad-red);
+  animation: ad-server-led 3.4s ease-in-out infinite;
+}
+/* A status dot is a layer of its own: its glow is drawn once and the layer only fades. */
+.ad-server-dot {
+  fill: var(--ad-pink);
+  filter: drop-shadow(0 0 0.2rem var(--ad-red));
+  animation: ad-server-led 3.4s ease-in-out infinite;
+  will-change: opacity;
+}
+.ad-server-orbit {
+  stroke: color-mix(in srgb, var(--ad-pink) 72%, #fff);
+  stroke-width: 1px;
+  stroke-dasharray: 7 93;
+  stroke-linecap: round;
+  animation: ad-art-orbit 6.4s linear infinite;
+}
+.ad-server-cloud {
+  animation: ad-server-cloud 3s ease-in-out infinite;
+  will-change: transform;
+}
+@keyframes ad-server-led {
+  50% {
+    opacity: 0.35;
+  }
+}
+@keyframes ad-server-cloud {
+  50% {
+    transform: translateY(-0.2rem);
+  }
+}

package/dist/components/artwork/Spectrum/Spectrum.d.ts

@@ -0,0 +1,7 @@
+import { type CommonProps } from "../../../core/base";
+export interface SpectrumProps extends CommonProps {
+    /** Segmented level columns, or smooth glowing bars in a bell shape. */
+    variant?: "segmented" | "bars";
+}
+/** A living audio spectrum used as decoration behind level and monitoring panels. */
+export declare function Spectrum({ variant, ...p }: SpectrumProps): import("react").JSX.Element;

package/dist/components/artwork/Spectrum/styles.css

@@ -0,0 +1,35 @@
+/* Styles owned by Spectrum. */
+.ad-spectrum {
+  display: block;
+  width: 100%;
+  max-width: 21rem;
+  aspect-ratio: 325 / 232;
+  height: auto;
+  pointer-events: none;
+}
+.ad-spectrum[data-variant="bars"] {
+  max-width: 12rem;
+  aspect-ratio: 163 / 140;
+}
+.ad-spectrum[data-variant="segmented"] {
+  position: relative;
+  overflow: hidden;
+}
+.ad-spectrum[data-variant="segmented"] rect {
+  fill: var(--ad-primary-600);
+}
+/* A column is a window over its rows: both slide by transform on layers of their own. */
+.ad-spectrum-column {
+  position: absolute;
+  top: 0;
+  height: 100%;
+  overflow: hidden;
+  transform: translateY(100%);
+  will-change: transform;
+}
+.ad-spectrum-column > svg {
+  display: block;
+  width: 100%;
+  height: 100%;
+  will-change: transform;
+}

package/dist/components/artwork/layers.d.ts

@@ -0,0 +1,15 @@
+import type { CSSProperties, ReactNode } from "react";
+/**
+ * One drawing of an artwork stack. A stack splits an SVG picture in its own paint order: the
+ * static parts (with their blurs) are painted once, and every part that pulses, twinkles or
+ * floats becomes a layer of its own that is only moved or faded on the compositor. Gradients
+ * and filters are declared once, in the bottom drawing; the others refer to them by id.
+ */
+export declare function ArtLayer({ viewBox, className, origin, style, children, }: {
+    viewBox: string;
+    className?: string;
+    /** The point (in drawing units) a pulsing layer scales about. */
+    origin?: [number, number];
+    style?: CSSProperties;
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/components/artwork/useArtwork.d.ts

@@ -0,0 +1,8 @@
+import { type RefObject } from "react";
+import { type Painting } from "../../core/noise";
+/**
+ * Paints a procedural picture at the resolution its canvas is actually shown at (the box
+ * it covers times the screen's pixel density), so nothing is upscaled into blocks or
+ * stair-stepped edges. Repaints sharper when the box grows; reveals the canvas when ready.
+ */
+export declare function useArtwork(ref: RefObject<HTMLCanvasElement | null>, key: string, width: number, height: number, painting: Painting): void;

package/dist/components/controls/Autocomplete/Autocomplete.d.ts

@@ -0,0 +1,2 @@
+import type { AutocompleteProps } from "../shared";
+export declare const Autocomplete: ({ options, onOptionSelect, value, defaultValue, onValueChange, label, description, error, startAdornment, endAdornment, clearable, inputRef, className, size, variant, labelPlacement, tone: _tone, material: _material, style, children: _children, ...input }: AutocompleteProps) => import("react").JSX.Element;

package/dist/components/controls/Autocomplete/styles.css

@@ -0,0 +1 @@
+/* Styles owned by Autocomplete; the option list lives in Select/styles.css. */

package/dist/components/controls/Button/Button.d.ts

@@ -0,0 +1,2 @@
+import { type ButtonProps } from "../shared";
+export declare const Button: import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/components/controls/Button/styles.css

@@ -0,0 +1 @@
+/* Styles owned by Button. */

package/dist/components/controls/Checkbox/Checkbox.d.ts

@@ -0,0 +1,2 @@
+import { type BooleanProps } from "../shared";
+export declare const Checkbox: (p: BooleanProps) => import("react").JSX.Element;