@liquid-glass-forge/webgl 0.0.0-stage → 0.1.0-rc.1

package/dist/dom.d.ts

@@ -0,0 +1,169 @@
+import type { SourceRect } from '@liquid-glass-forge/core';
+import type { GlassRenderer, RenderRequest, FrameOutput, CpuRendererOptions } from '@liquid-glass-forge/dom';
+import { WebGLAtlas, type WebGLAtlasOptions } from './atlas.js';
+import { type WebGLEffects } from './effects.js';
+export interface OpticalRendererOptions {
+    readonly backend?: 'webgl' | 'cpu' | 'auto';
+    readonly fallback?: 'none' | 'cpu' | 'material';
+    readonly atlas?: WebGLAtlasOptions;
+    readonly cpu?: CpuRendererOptions;
+    readonly effects?: WebGLEffects;
+    readonly surface?: Readonly<{
+        radius?: number;
+        bevel?: number;
+        strength?: number;
+    }> | ((request: RenderRequest) => Readonly<{
+        radius?: number;
+        bevel?: number;
+        strength?: number;
+    }>);
+    readonly sourceRect?: SourceRect | ((request: RenderRequest) => SourceRect);
+    readonly quality?: Readonly<{
+        maxWidth?: number;
+        maxHeight?: number;
+        maxPixels?: number;
+    }>;
+}
+/** Optional DOM integration. Core pixel-frame callers and forced CPU retain their
+ * old contract. Native scene batches present to prepared stable targets before
+ * yielding; standalone canvas frames retain owned backing until release(). */
+export declare class OpticalRenderer implements GlassRenderer {
+    #private;
+    constructor(options?: OpticalRendererOptions);
+    get atlas(): WebGLAtlas | undefined;
+    get diagnostics(): Readonly<{
+        requestedBackend: "auto" | "cpu" | "webgl";
+        effectiveBackend: "cpu" | "material" | "webgl";
+        fallbackReason: string | undefined;
+        disposed: boolean;
+        initialized: boolean;
+        gpu: Readonly<{
+            backend: 'webgl';
+            contextType: "webgl2";
+            state: "disposed" | "lost" | "new" | "ready" | "unavailable";
+            failure: string | undefined;
+            restores: number;
+            handleGeneration: number;
+            width: number;
+            height: number;
+            sourceWidth: number;
+            sourceHeight: number;
+            renderCount: number;
+            batchCount: number;
+            uploadCount: number;
+            targetBytes: number;
+            requestedAttributes: Readonly<{
+                alpha: true;
+                premultipliedAlpha: true;
+                preserveDrawingBuffer: false;
+                antialias: false;
+                depth: false;
+                stencil: false;
+            }>;
+            attributes: WebGLContextAttributes | null | undefined;
+            pool: Readonly<{
+                contexts: number;
+                leased: number;
+                idle: number;
+                cap: 4;
+            }>;
+            resources: Readonly<{
+                contexts: 0 | 1;
+                textures: number;
+                framebuffers: number;
+                programs: number;
+                shaders: number;
+                buffers: 0;
+                vertexArrays: 0;
+            }>;
+            ownedImageBytes: number;
+            lastBatch: Readonly<{
+                dirty: number;
+                gpuSnapshots: number;
+                uploadMs: number;
+                drawMs: number;
+                snapshotMs: number;
+                copyMs: number;
+                batchMs: number;
+                completedAt: readonly number[];
+            }>;
+            sourceDecoding: "calibrated-srgb-texture" | "explicit-shader";
+            decodeProbeMaxByteError: number | undefined;
+            colorConvention: "straight sRGB upload; manual linear-premultiplied sampling/blur; calibrated premultiplied sRGB byte presentation";
+            storageProfile: "nearest" | "upward";
+        }> | undefined;
+        cpu: Readonly<{
+            backend: 'cpu';
+            execution: "main" | "worker";
+            disposed: boolean;
+            initialized: boolean;
+            requested: Readonly<{
+                width: number;
+                height: number;
+            }> | undefined;
+            effective: Readonly<{
+                width: number;
+                height: number;
+            }> | undefined;
+            requestedWidth: number | undefined;
+            requestedHeight: number | undefined;
+            effectiveWidth: number | undefined;
+            effectiveHeight: number | undefined;
+            qualityReduced: boolean;
+            reasons: readonly string[];
+            quality: Required<{
+                readonly maxPixels?: number;
+                readonly maxWidth?: number;
+                readonly maxHeight?: number;
+                readonly maxUpdatesPerSecond?: number;
+                readonly maxSourcePixels?: number;
+            }>;
+            timings: (import("@liquid-glass-forge/cpu").CpuTimings & {
+                readonly captureMs: number;
+                readonly rateWaitMs: number;
+                readonly presentationWaitMs: number;
+            }) | undefined;
+            surface: Readonly<Required<import("@liquid-glass-forge/dom").CpuSurfaceOptions>> | undefined;
+            executor: Readonly<{
+                execution: "main" | "worker";
+                inFlight: 0 | 1;
+                pending: 0 | 1;
+                mainCachedBytes: number;
+                workerCachedBytes: number;
+                sharedKernelBytes: number;
+                fixedKernelReservationBytes: number;
+                pooledBytes: number;
+                inputPooledBytes: number;
+                inputPooledBuffers: number;
+                leasedBytes: number;
+                reservedBytes: number;
+                lostBytes: number;
+                completedBatches: number;
+                discardedBatches: number;
+                disposed: boolean;
+                fallbackReason?: string;
+            }> | undefined;
+        }> | undefined;
+        quality: {
+            maxWidth: number;
+            maxHeight: number;
+            maxPixels: number;
+        };
+        size: Readonly<{
+            requestedWidth: number;
+            requestedHeight: number;
+            width: number;
+            height: number;
+        }> | undefined;
+        leasedBytes: number;
+        leasedCanvases: number;
+        pooledCanvases: number;
+    }>;
+    initialize(signal: AbortSignal): () => void;
+    render(request: RenderRequest, signal: AbortSignal): FrameOutput | Promise<FrameOutput>;
+    renderBatch(requests: readonly RenderRequest[], signal: AbortSignal): readonly FrameOutput[] | Promise<readonly FrameOutput[]>;
+    releaseSurface(id: string): void;
+    dispose(): void;
+}
+export declare const createWebGLRenderer: (options?: Omit<OpticalRendererOptions, 'backend' | 'fallback'>) => OpticalRenderer;
+export declare const createOpticalRenderer: (options: OpticalRendererOptions) => OpticalRenderer;

package/dist/dom.js

@@ -0,0 +1,226 @@
+import { MAX_PIXELS } from '@liquid-glass-forge/core';
+import { createCpuRenderer } from '@liquid-glass-forge/dom';
+import { WebGLAtlas, WebGLError } from './atlas.js';
+import { effects } from './effects.js';
+function dataObject(value, keys, name) {
+    if (!value || typeof value !== 'object' || Array.isArray(value) || 'then' in value || Reflect.ownKeys(value).some(k => typeof k !== 'string' || !keys.includes(k)))
+        throw new WebGLError('INVALID_OPTIONS', 'Invalid ' + name);
+}
+function surfaceData(value) {
+    dataObject(value, ['radius', 'bevel', 'strength'], 'surface');
+    for (const [k, v] of Object.entries(value))
+        if (v !== undefined && (typeof v !== 'number' || !Number.isFinite(v) || v < (k === 'bevel' ? Number.MIN_VALUE : 0) || v > 1_000_000))
+            throw new WebGLError('INVALID_OPTIONS', 'Invalid surface ' + k);
+    return Object.freeze({ ...value });
+}
+function rectData(value) {
+    dataObject(value, ['x', 'y', 'width', 'height'], 'sourceRect');
+    for (const k of ['x', 'y', 'width', 'height']) {
+        const v = value[k];
+        if (typeof v !== 'number' || !Number.isFinite(v) || v < (k === 'x' || k === 'y' ? 0 : Number.MIN_VALUE) || v > MAX_PIXELS)
+            throw new WebGLError('INVALID_OPTIONS', 'Invalid sourceRect ' + k);
+    }
+    return Object.freeze({ ...value });
+}
+/** Optional DOM integration. Core pixel-frame callers and forced CPU retain their
+ * old contract. Native scene batches present to prepared stable targets before
+ * yielding; standalone canvas frames retain owned backing until release(). */
+export class OpticalRenderer {
+    #options;
+    #backend;
+    #fallback;
+    #quality;
+    #atlas;
+    #cpu;
+    #cleanup;
+    #signal;
+    #disposed = false;
+    #generation = 0;
+    #revision = 0;
+    #effective = 'material';
+    #reason;
+    #lastGPU;
+    #tiles = new Map();
+    #leased = new Set();
+    #pool = [];
+    #leasedBytes = 0;
+    #mode;
+    #size;
+    constructor(options = {}) {
+        if (!options || typeof options !== 'object' || Array.isArray(options) || Reflect.ownKeys(options).some(k => typeof k !== 'string' || !['backend', 'fallback', 'atlas', 'cpu', 'effects', 'surface', 'sourceRect', 'quality'].includes(k)))
+            throw new WebGLError('INVALID_OPTIONS', 'Invalid optical renderer options');
+        const backend = options.backend === undefined ? 'webgl' : options.backend, fallback = options.fallback === undefined ? 'none' : options.fallback;
+        if (!['webgl', 'cpu', 'auto'].includes(backend) || !['none', 'cpu', 'material'].includes(fallback) || (backend === 'auto' && options.fallback === undefined) || (backend !== 'auto' && fallback !== 'none'))
+            throw new WebGLError('INVALID_OPTIONS', 'Auto policy requires explicit fallback; forced backends never downgrade');
+        effects(options.effects);
+        new WebGLAtlas(options.atlas);
+        const quality = options.quality === undefined ? {} : options.quality;
+        dataObject(quality, ['maxWidth', 'maxHeight', 'maxPixels'], 'quality');
+        const q = { maxWidth: quality.maxWidth === undefined ? 2048 : quality.maxWidth, maxHeight: quality.maxHeight === undefined ? 2048 : quality.maxHeight, maxPixels: quality.maxPixels === undefined ? MAX_PIXELS : quality.maxPixels };
+        if (!Object.values(q).every(v => Number.isSafeInteger(v) && v >= 1 && v <= MAX_PIXELS))
+            throw new WebGLError('INVALID_OPTIONS', 'Invalid quality limits');
+        // Use the existing data-only CPU validator, including exact fallback settings.
+        if (options.cpu !== undefined) {
+            const validator = createCpuRenderer(options.cpu);
+            validator.dispose();
+        }
+        const cpu = options.cpu === undefined ? undefined : Object.freeze({ ...options.cpu, ...(options.cpu.effects ? { effects: Object.freeze({ ...options.cpu.effects, ...(options.cpu.effects.tint ? { tint: Object.freeze([...options.cpu.effects.tint]) } : {}), ...(options.cpu.effects.light ? { light: Object.freeze([...options.cpu.effects.light]) } : {}) }) } : {}), ...(options.cpu.executor ? { executor: Object.freeze({ ...options.cpu.executor }) } : {}), ...(options.cpu.quality ? { quality: Object.freeze({ ...options.cpu.quality }) } : {}), ...(options.cpu.surface && typeof options.cpu.surface !== 'function' ? { surface: surfaceData(options.cpu.surface) } : {}), ...(options.cpu.sourceRect && typeof options.cpu.sourceRect !== 'function' ? { sourceRect: rectData(options.cpu.sourceRect) } : {}) });
+        this.#options = { ...options, ...(cpu ? { cpu } : {}), ...(options.atlas ? { atlas: Object.freeze({ ...options.atlas }) } : {}), ...(options.surface === undefined ? {} : { surface: typeof options.surface === 'function' ? options.surface : surfaceData(options.surface) }), ...(options.sourceRect === undefined ? {} : { sourceRect: typeof options.sourceRect === 'function' ? options.sourceRect : rectData(options.sourceRect) }), ...(options.effects ? { effects: Object.freeze({ ...options.effects, ...(options.effects.tint ? { tint: Object.freeze([...options.effects.tint]) } : {}), ...(options.effects.light ? { light: Object.freeze([...options.effects.light]) } : {}) }) } : {}) };
+        this.#quality = Object.freeze(q);
+        this.#backend = backend;
+        this.#fallback = fallback;
+    }
+    get atlas() { return this.#atlas; }
+    get diagnostics() { return Object.freeze({ requestedBackend: this.#backend, effectiveBackend: this.#effective, fallbackReason: this.#reason, disposed: this.#disposed, initialized: !!this.#cleanup, gpu: this.#atlas?.diagnostics ?? this.#lastGPU, cpu: this.#cpu?.diagnostics, quality: this.#quality, size: this.#size, leasedBytes: this.#leasedBytes, leasedCanvases: this.#leased.size, pooledCanvases: this.#pool.length }); }
+    #makeCPU() { return createCpuRenderer({ ...this.#options.cpu, ...(this.#options.surface ? { surface: this.#options.surface } : {}), ...(this.#options.effects ? { effects: this.#options.effects } : {}), ...(this.#options.sourceRect ? { sourceRect: this.#options.sourceRect } : {}) }); }
+    initialize(signal) {
+        if (this.#disposed)
+            throw new WebGLError('DISPOSED', 'Renderer disposed');
+        if (signal.aborted)
+            throw new WebGLError('ABORTED', 'Initialization aborted');
+        this.#cleanup?.();
+        const generation = ++this.#generation;
+        this.#signal = signal;
+        this.#mode = undefined;
+        this.#reason = undefined;
+        let cpuCleanup, done = false;
+        const fallback = (cause) => { this.#reason = cause instanceof WebGLError ? cause.code : 'WEBGL_FAILED'; if (this.#atlas) {
+            this.#atlas.dispose();
+            this.#lastGPU = this.#atlas.diagnostics;
+            this.#atlas = undefined;
+        } if (this.#fallback === 'none')
+            throw cause; if (this.#fallback === 'cpu') {
+            this.#cpu = this.#makeCPU();
+            cpuCleanup = this.#cpu.initialize(signal);
+            this.#effective = 'cpu';
+        }
+        else
+            this.#effective = 'material'; };
+        try {
+            if (this.#backend === 'cpu') {
+                this.#cpu = this.#makeCPU();
+                cpuCleanup = this.#cpu.initialize(signal);
+                this.#effective = 'cpu';
+            }
+            else {
+                this.#atlas = new WebGLAtlas(this.#options.atlas);
+                try {
+                    this.#atlas.initialize();
+                    this.#effective = 'webgl';
+                }
+                catch (cause) {
+                    fallback(cause);
+                }
+            }
+        }
+        catch (cause) {
+            this.#atlas?.dispose();
+            this.#atlas = undefined;
+            this.#cpu?.dispose();
+            this.#cpu = undefined;
+            this.#signal = undefined;
+            throw cause;
+        }
+        const cleanup = () => { if (done)
+            return; done = true; signal.removeEventListener('abort', cleanup); if (generation !== this.#generation)
+            return; this.#generation++; cpuCleanup?.(); this.#cpu?.dispose(); this.#cpu = undefined; if (this.#atlas) {
+            this.#atlas.dispose();
+            this.#lastGPU = this.#atlas.diagnostics;
+            this.#atlas = undefined;
+        } this.#tiles.clear(); for (const c of this.#pool)
+            c.width = c.height = 0; this.#pool = []; this.#signal = undefined; this.#cleanup = undefined; };
+        this.#cleanup = cleanup;
+        signal.addEventListener('abort', cleanup, { once: true });
+        if (signal.aborted)
+            cleanup();
+        return cleanup;
+    }
+    #current(signal) { if (this.#disposed)
+        throw new WebGLError('DISPOSED', 'Renderer disposed'); if (!this.#cleanup)
+        throw new WebGLError('NOT_INITIALIZED', 'Initialize renderer'); if (signal.aborted || this.#signal?.aborted)
+        throw new WebGLError('ABORTED', 'Render aborted'); }
+    #bounded(request) { if (!Number.isSafeInteger(request.width) || !Number.isSafeInteger(request.height) || request.width < 1 || request.height < 1 || request.width * request.height > MAX_PIXELS)
+        throw new WebGLError('SIZE_UNSUPPORTED', 'Invalid requested size'); const q = this.#quality, s = Math.min(1, q.maxWidth / request.width, q.maxHeight / request.height, Math.sqrt(q.maxPixels / request.width / request.height)); let w = Math.max(1, Math.floor(request.width * s)), h = Math.max(1, Math.floor(request.height * s)); if (w * h > q.maxPixels) {
+        if (w >= h)
+            w = Math.max(1, Math.floor(q.maxPixels / h));
+        else
+            h = Math.max(1, Math.floor(q.maxPixels / w));
+    } this.#size = Object.freeze({ requestedWidth: request.width, requestedHeight: request.height, width: w, height: h }); return { width: w, height: h }; }
+    #canvas(width, height) { const bytes = width * height * 4; if (this.#leasedBytes + bytes > 16 * 1024 ** 2 || this.#leased.size >= 16)
+        throw new WebGLError('LEASE_LIMIT', 'Outstanding canvas frames exceed bounds'); const c = this.#pool.pop() ?? document.createElement('canvas'); c.width = width; c.height = height; this.#leased.add(c); this.#leasedBytes += bytes; const generation = this.#generation; let released = false; return { canvas: c, release: () => { if (released)
+            return; released = true; this.#leased.delete(c); this.#leasedBytes -= bytes; if (!this.#disposed && generation === this.#generation && this.#pool.length < 2)
+            this.#pool.push(c);
+        else
+            c.width = c.height = 0; } }; }
+    render(request, signal) { const result = this.renderBatch([request], signal); return result instanceof Promise ? result.then(values => values[0]) : result[0]; }
+    renderBatch(requests, signal) {
+        this.#current(signal);
+        if (!Array.isArray(requests) || !requests.length || requests.length > 16 || requests.reduce((n, r) => n + r.width * r.height, 0) > MAX_PIXELS)
+            throw new WebGLError('BATCH_LIMIT', 'Core scene frame bounds apply');
+        if (this.#effective === 'cpu')
+            return this.#cpuBatch(requests, signal);
+        if (this.#effective === 'material')
+            return requests.map(r => { const size = this.#bounded(r); return { ...size, data: new Uint8ClampedArray(size.width * size.height * 4) }; });
+        const first = requests[0], source = first.snapshot.source, tiles = new Map(this.#tiles), leases = [];
+        try {
+            const frames = requests.map((r, i) => {
+                if (r.snapshot.source !== source || r.snapshot.generation !== first.snapshot.generation)
+                    throw new WebGLError('INVALID_BATCH', 'A batch shares one source snapshot');
+                const mode = r.prepareTarget ? 'scene' : 'manual';
+                if (this.#mode && this.#mode !== mode)
+                    throw new WebGLError('INVALID_OPTIONS', 'One renderer belongs to one scene or standalone owner');
+                this.#mode = mode;
+                if (mode === 'manual' && i === 0)
+                    tiles.clear();
+                const size = this.#bounded(r), id = r.id ?? 'manual_' + i;
+                const surfaceOptions = surfaceData(typeof this.#options.surface === 'function' ? this.#options.surface(r) : (this.#options.surface ?? {}));
+                const rect = this.#options.sourceRect === undefined ? undefined : rectData(typeof this.#options.sourceRect === 'function' ? this.#options.sourceRect(r) : this.#options.sourceRect);
+                const surface = { id, ...size, ...surfaceOptions, ...(rect ? { sourceRect: rect } : {}) };
+                const lease = r.prepareTarget ? undefined : this.#canvas(size.width, size.height);
+                if (lease)
+                    leases.push(lease);
+                const target = r.prepareTarget ? r.prepareTarget(size.width, size.height) : lease.canvas;
+                tiles.set(id, { surface, target });
+                return r.prepareTarget ? { ...size, presentedTarget: target } : { ...size, canvas: target, release: lease.release };
+            });
+            this.#current(signal);
+            this.#atlas.update(source, [...tiles.values()], { generation: first.snapshot.generation, revision: ++this.#revision, dirtyIds: requests.map((r, i) => r.id ?? 'manual_' + i), ...(this.#options.effects ? { effects: this.#options.effects } : {}), signal });
+            this.#tiles = tiles;
+            return frames;
+        }
+        catch (cause) {
+            leases.forEach(l => l.release());
+            if (this.#backend !== 'auto' || this.#fallback === 'none' || signal.aborted || !(cause instanceof WebGLError) || ['INVALID_OPTIONS', 'INVALID_BATCH', 'INVALID_TARGET', 'BATCH_LIMIT', 'LEASE_LIMIT', 'STALE'].includes(cause.code))
+                throw cause;
+            this.#reason = cause instanceof WebGLError ? cause.code : 'WEBGL_FAILED';
+            if (this.#atlas) {
+                this.#atlas.dispose();
+                this.#lastGPU = this.#atlas.diagnostics;
+                this.#atlas = undefined;
+            }
+            this.#tiles.clear();
+            if (this.#fallback === 'cpu') {
+                this.#cpu = this.#makeCPU();
+                this.#cpu.initialize(this.#signal);
+                this.#effective = 'cpu';
+                return this.#cpuBatch(requests, signal);
+            }
+            this.#effective = 'material';
+            return this.renderBatch(requests, signal);
+        }
+    }
+    async #cpuBatch(requests, signal) { const frames = []; try {
+        for (const r of requests)
+            frames.push(await this.#cpu.render(r, signal));
+        return frames;
+    }
+    catch (cause) {
+        frames.forEach(f => f.release?.());
+        throw cause;
+    } }
+    releaseSurface(id) { this.#tiles.delete(id); }
+    dispose() { if (this.#disposed)
+        return; this.#disposed = true; this.#cleanup?.(); }
+}
+export const createWebGLRenderer = (options = {}) => new OpticalRenderer({ ...options, backend: 'webgl' });
+export const createOpticalRenderer = (options) => new OpticalRenderer(options);

package/dist/effects.d.ts

@@ -0,0 +1,17 @@
+export interface WebGLEffects {
+    readonly model: 'rounded-material-v1';
+    readonly blurRadius?: number;
+    readonly dispersion?: number;
+    readonly tint?: readonly [number, number, number, number];
+    readonly rim?: number;
+    readonly specular?: number;
+    readonly light?: readonly [number, number];
+}
+export declare function effects(input?: WebGLEffects): Readonly<{
+    blur: number;
+    dispersion: number;
+    rim: number;
+    specular: number;
+    tint: readonly [number, number, number, number];
+    light: readonly [number, number];
+}>;

package/dist/effects.js

@@ -0,0 +1,17 @@
+import { decodeSrgb, ContractError } from '@liquid-glass-forge/core';
+export function effects(input) {
+    if (input !== undefined && (!input || typeof input !== 'object' || Array.isArray(input) ||
+        Reflect.ownKeys(input).some(k => typeof k !== 'string' || !['model', 'blurRadius', 'dispersion', 'tint', 'rim', 'specular', 'light'].includes(k)) || input.model !== 'rounded-material-v1'))
+        throw new ContractError('Invalid WebGL material');
+    const blur = input?.blurRadius === undefined ? 0 : input.blurRadius, dispersion = input?.dispersion === undefined ? 0 : input.dispersion, rim = input?.rim === undefined ? 0 : input.rim, specular = input?.specular === undefined ? 0 : input.specular;
+    if (!Number.isInteger(blur) || blur < 0 || blur > 16 || ![dispersion, rim, specular].every(v => typeof v === 'number' && Number.isFinite(v) && v >= 0 && v <= 1))
+        throw new ContractError('Invalid WebGL effect range');
+    const tint = input?.tint === undefined ? [0, 0, 0, 0] : input.tint, light = input?.light === undefined ? [-Math.SQRT1_2, -Math.SQRT1_2] : input.light;
+    if (!Array.isArray(tint) || tint.length !== 4 || !tint.every(v => Number.isFinite(v) && v >= 0 && v <= 1) || !Array.isArray(light) || light.length !== 2 || !light.every(Number.isFinite))
+        throw new ContractError('Invalid tint or light');
+    const scale = Math.max(Math.abs(light[0]), Math.abs(light[1]));
+    if (!scale)
+        throw new ContractError('Light must be nonzero');
+    const x = light[0] / scale, y = light[1] / scale, length = Math.hypot(x, y);
+    return Object.freeze({ blur, dispersion, rim, specular, tint: [decodeSrgb(tint[0]), decodeSrgb(tint[1]), decodeSrgb(tint[2]), tint[3]], light: [x / length, y / length] });
+}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from './atlas.js';
+export type { WebGLEffects } from './effects.js';

package/dist/index.js

@@ -0,0 +1 @@
+export * from './atlas.js';

package/dist/shaders.d.ts

@@ -0,0 +1,4 @@
+export declare const VERTEX = "#version 300 es\nvoid main(){vec2 p=vec2(float((gl_VertexID<<1)&2),float(gl_VertexID&2));gl_Position=vec4(p*2.0-1.0,0,1);}";
+export declare const OPTICS = "#version 300 es\nprecision highp float;\nprecision highp int;\nuniform highp sampler2D uSource;\nuniform highp sampler2D uEncoding;\nuniform vec2 uSize,uOrigin,uLight;\nuniform vec4 uRect,uTint;\nuniform float uRadius,uBevel,uStrength,uDispersion,uRim,uSpecular;\nuniform bool uPrepared,uQuantizeUp,uSourceLinear,uCalibration;\nout vec4 result;\nfloat encodeByte(float v){int i=min(int(v*4096.0),4095);vec3 e=texelFetch(uEncoding,ivec2(i&63,i>>6),0).rgb;return e.r+(v>=e.b?1.0:(v<e.g?-1.0:0.0));}\nfloat decodeByte(float v){return v<=.04045?v/12.92:pow((v+.055)/1.055,2.4);}\nvec4 texel(ivec2 p){vec4 c=texelFetch(uSource,p,0);return uPrepared?c:(uSourceLinear?vec4(c.rgb*c.a,c.a):vec4(vec3(decodeByte(c.r),decodeByte(c.g),decodeByte(c.b))*c.a,c.a));}\nvec4 sampleAt(vec2 p){ivec2 s=textureSize(uSource,0);p=clamp(p,vec2(0.0),vec2(float(s.x-1),float(s.y-1)));ivec2 lo=ivec2(floor(p)),hi=min(lo+1,s-1);vec2 t=fract(p);\nif(t.x==0.0&&t.y==0.0)return texel(lo);\nreturn (texel(lo)*(1.0-t.x)+texel(ivec2(hi.x,lo.y))*t.x)*(1.0-t.y)+(texel(ivec2(lo.x,hi.y))*(1.0-t.x)+texel(hi)*t.x)*t.y;}\nvoid main(){\nif(uCalibration){vec4 c=texelFetch(uSource,ivec2(int(gl_FragCoord.x),0),0);float n=floor(c.r*65535.0+.5);result=vec4(floor(n/256.0)/255.0,mod(n,256.0)/255.0,0,1);return;}\nvec2 local=gl_FragCoord.xy-uOrigin,center=vec2(local.x,uSize.y-local.y),p=center-uSize*.5;\nvec2 q=abs(p)-(uSize*.5-uRadius),a=max(q,0.0);float len=length(a),d=len+min(max(q.x,q.y),0.0)-uRadius;\nfloat mask=clamp(.5-d,0.0,1.0);if(mask==0.0){result=vec4(0.0);return;}\nfloat w=clamp(1.0+d/uBevel,0.0,1.0);w*=w;\nvec2 n=w>0.0?(len>0.0?a/len*sign(p):(q.x>q.y?vec2(sign(p.x),0.0):vec2(0.0,sign(p.y)))):vec2(0.0);\nvec2 scale=uRect.zw/uSize,base=uRect.xy+center*scale-.5,delta=n*uStrength*w*scale;\n// An exact source texel with all optional passes disabled is byte identity.\n// Avoid decode/interpolate/encode work only where bilinear weights are exactly zero.\nif(!uPrepared&&!uSourceLinear&&uDispersion==0.0&&uTint.a==0.0&&uRim==0.0&&uSpecular==0.0){\n  vec2 at=clamp(base+delta,vec2(0.0),vec2(float(textureSize(uSource,0).x-1),float(textureSize(uSource,0).y-1)));\n  if(all(equal(fract(at),vec2(0.0)))){vec4 raw=texelFetch(uSource,ivec2(at),0);float alpha=floor(raw.a*mask*255.0+.5);ivec3 bytes=ivec3(floor(raw.rgb*255.0+.5));ivec3 premult=(bytes*int(alpha)+(uQuantizeUp?254:127))/255;result=alpha==0.0?vec4(0.0):vec4(vec3(premult)/255.0,alpha/255.0);return;}\n}\nvec4 c=sampleAt(base+delta);float alpha=floor(c.a*mask*255.0+.5);\nif(alpha==0.0){result=vec4(0.0);return;}\nvec3 rgb=c.a>0.0?c.rgb/c.a:vec3(0.0);\nif(uDispersion>0.0){vec4 r=sampleAt(base+delta*(1.0+uDispersion)),b=sampleAt(base+delta*(1.0-uDispersion));rgb.r=r.a>0.0?r.r/r.a:0.0;rgb.b=b.a>0.0?b.b/b.a:0.0;}\nif(uTint.a>0.0)rgb=mix(rgb,uTint.rgb,uTint.a);\nif(w>0.0&&(uRim>0.0||uSpecular>0.0)){float l=max(dot(n,uLight),0.0);l*=l;l*=l;l*=l;float h=clamp(w*(uRim+uSpecular*l),0.0,1.0);rgb=clamp(rgb+(1.0-rgb)*h,0.0,1.0);}\nivec3 bytes=ivec3(encodeByte(rgb.r),encodeByte(rgb.g),encodeByte(rgb.b));\nivec3 premult=(bytes*int(alpha)+(uQuantizeUp?254:127))/255;\nresult=vec4(vec3(premult)/255.0,alpha/255.0);\n}";
+export declare const BLUR = "#version 300 es\nprecision highp float;\nprecision highp int;\nuniform highp sampler2D uSource;\nuniform highp sampler2D uEncoding;\nuniform ivec2 uAxis;\nuniform int uRadius;\nuniform bool uPrepared,uSourceLinear;\nout vec4 result;\nfloat decodeByte(float v){return v<=.04045?v/12.92:pow((v+.055)/1.055,2.4);}\nvoid main(){ivec2 p=ivec2(gl_FragCoord.xy),size=textureSize(uSource,0);vec4 sum=vec4(0.0);\nfor(int k=-16;k<=16;k++){if(abs(k)<=uRadius){vec4 c=texelFetch(uSource,clamp(p+uAxis*k,ivec2(0),size-1),0);sum+=uPrepared?c:(uSourceLinear?vec4(c.rgb*c.a,c.a):vec4(vec3(decodeByte(c.r),decodeByte(c.g),decodeByte(c.b))*c.a,c.a));}}\nresult=sum/float(2*uRadius+1);\n}";
+export declare function encodingTextureData(): Float32Array;

package/dist/shaders.js

@@ -0,0 +1,69 @@
+export const VERTEX = `#version 300 es
+void main(){vec2 p=vec2(float((gl_VertexID<<1)&2),float(gl_VertexID&2));gl_Position=vec4(p*2.0-1.0,0,1);}`;
+// Same versioned equations as CONTRACTS.md and PHASE-5.md. The scalar oracle
+// remains independent; production never obtains pixels from a GPU framebuffer.
+// Explicit float constructors avoid ANGLE/D3D11 generating an ambiguous HLSL
+// vec2_ctor_int overload for mixed integer and floating-point arguments.
+export const OPTICS = `#version 300 es
+precision highp float;
+precision highp int;
+uniform highp sampler2D uSource;
+uniform highp sampler2D uEncoding;
+uniform vec2 uSize,uOrigin,uLight;
+uniform vec4 uRect,uTint;
+uniform float uRadius,uBevel,uStrength,uDispersion,uRim,uSpecular;
+uniform bool uPrepared,uQuantizeUp,uSourceLinear,uCalibration;
+out vec4 result;
+float encodeByte(float v){int i=min(int(v*4096.0),4095);vec3 e=texelFetch(uEncoding,ivec2(i&63,i>>6),0).rgb;return e.r+(v>=e.b?1.0:(v<e.g?-1.0:0.0));}
+float decodeByte(float v){return v<=.04045?v/12.92:pow((v+.055)/1.055,2.4);}
+vec4 texel(ivec2 p){vec4 c=texelFetch(uSource,p,0);return uPrepared?c:(uSourceLinear?vec4(c.rgb*c.a,c.a):vec4(vec3(decodeByte(c.r),decodeByte(c.g),decodeByte(c.b))*c.a,c.a));}
+vec4 sampleAt(vec2 p){ivec2 s=textureSize(uSource,0);p=clamp(p,vec2(0.0),vec2(float(s.x-1),float(s.y-1)));ivec2 lo=ivec2(floor(p)),hi=min(lo+1,s-1);vec2 t=fract(p);
+if(t.x==0.0&&t.y==0.0)return texel(lo);
+return (texel(lo)*(1.0-t.x)+texel(ivec2(hi.x,lo.y))*t.x)*(1.0-t.y)+(texel(ivec2(lo.x,hi.y))*(1.0-t.x)+texel(hi)*t.x)*t.y;}
+void main(){
+if(uCalibration){vec4 c=texelFetch(uSource,ivec2(int(gl_FragCoord.x),0),0);float n=floor(c.r*65535.0+.5);result=vec4(floor(n/256.0)/255.0,mod(n,256.0)/255.0,0,1);return;}
+vec2 local=gl_FragCoord.xy-uOrigin,center=vec2(local.x,uSize.y-local.y),p=center-uSize*.5;
+vec2 q=abs(p)-(uSize*.5-uRadius),a=max(q,0.0);float len=length(a),d=len+min(max(q.x,q.y),0.0)-uRadius;
+float mask=clamp(.5-d,0.0,1.0);if(mask==0.0){result=vec4(0.0);return;}
+float w=clamp(1.0+d/uBevel,0.0,1.0);w*=w;
+vec2 n=w>0.0?(len>0.0?a/len*sign(p):(q.x>q.y?vec2(sign(p.x),0.0):vec2(0.0,sign(p.y)))):vec2(0.0);
+vec2 scale=uRect.zw/uSize,base=uRect.xy+center*scale-.5,delta=n*uStrength*w*scale;
+// An exact source texel with all optional passes disabled is byte identity.
+// Avoid decode/interpolate/encode work only where bilinear weights are exactly zero.
+if(!uPrepared&&!uSourceLinear&&uDispersion==0.0&&uTint.a==0.0&&uRim==0.0&&uSpecular==0.0){
+  vec2 at=clamp(base+delta,vec2(0.0),vec2(float(textureSize(uSource,0).x-1),float(textureSize(uSource,0).y-1)));
+  if(all(equal(fract(at),vec2(0.0)))){vec4 raw=texelFetch(uSource,ivec2(at),0);float alpha=floor(raw.a*mask*255.0+.5);ivec3 bytes=ivec3(floor(raw.rgb*255.0+.5));ivec3 premult=(bytes*int(alpha)+(uQuantizeUp?254:127))/255;result=alpha==0.0?vec4(0.0):vec4(vec3(premult)/255.0,alpha/255.0);return;}
+}
+vec4 c=sampleAt(base+delta);float alpha=floor(c.a*mask*255.0+.5);
+if(alpha==0.0){result=vec4(0.0);return;}
+vec3 rgb=c.a>0.0?c.rgb/c.a:vec3(0.0);
+if(uDispersion>0.0){vec4 r=sampleAt(base+delta*(1.0+uDispersion)),b=sampleAt(base+delta*(1.0-uDispersion));rgb.r=r.a>0.0?r.r/r.a:0.0;rgb.b=b.a>0.0?b.b/b.a:0.0;}
+if(uTint.a>0.0)rgb=mix(rgb,uTint.rgb,uTint.a);
+if(w>0.0&&(uRim>0.0||uSpecular>0.0)){float l=max(dot(n,uLight),0.0);l*=l;l*=l;l*=l;float h=clamp(w*(uRim+uSpecular*l),0.0,1.0);rgb=clamp(rgb+(1.0-rgb)*h,0.0,1.0);}
+ivec3 bytes=ivec3(encodeByte(rgb.r),encodeByte(rgb.g),encodeByte(rgb.b));
+ivec3 premult=(bytes*int(alpha)+(uQuantizeUp?254:127))/255;
+result=vec4(vec3(premult)/255.0,alpha/255.0);
+}`;
+export const BLUR = `#version 300 es
+precision highp float;
+precision highp int;
+uniform highp sampler2D uSource;
+uniform highp sampler2D uEncoding;
+uniform ivec2 uAxis;
+uniform int uRadius;
+uniform bool uPrepared,uSourceLinear;
+out vec4 result;
+float decodeByte(float v){return v<=.04045?v/12.92:pow((v+.055)/1.055,2.4);}
+void main(){ivec2 p=ivec2(gl_FragCoord.xy),size=textureSize(uSource,0);vec4 sum=vec4(0.0);
+for(int k=-16;k<=16;k++){if(abs(k)<=uRadius){vec4 c=texelFetch(uSource,clamp(p+uAxis*k,ivec2(0),size-1),0);sum+=uPrepared?c:(uSourceLinear?vec4(c.rgb*c.a,c.a):vec4(vec3(decodeByte(c.r),decodeByte(c.g),decodeByte(c.b))*c.a,c.a));}}
+result=sum/float(2*uRadius+1);
+}`;
+export function encodingTextureData() {
+    const data = new Float32Array(64 * 64 * 4);
+    const decode = (v) => v <= .04045 ? v / 12.92 : ((v + .055) / 1.055) ** 2.4;
+    for (let i = 0; i < 4096; i++) {
+        const v = (i + .5) / 4096, byte = Math.round((v <= .0031308 ? 12.92 * v : 1.055 * v ** (1 / 2.4) - .055) * 255);
+        data.set([byte, byte ? decode((byte - .5) / 255) : -1, byte < 255 ? decode((byte + .5) / 255) : 2, 0], i * 4);
+    }
+    return data;
+}

package/package.json

@@ -1,6 +1,43 @@
 {
   "name": "@liquid-glass-forge/webgl",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.1.0-rc.1",
+  "private": false,
+  "description": "Experimental shared-atlas WebGL2 optics and optional vanilla integration",
+  "type": "module",
+  "sideEffects": false,
+  "license": "MIT",
+  "engines": {
+    "node": ">=20.19.0"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./dom": {
+      "types": "./dist/dom.d.ts",
+      "import": "./dist/dom.js",
+      "default": "./dist/dom.js"
+    }
+  },
+  "files": [
+    "dist",
+    "LICENSE",
+    "NOTICE",
+    "README.md"
+  ],
+  "dependencies": {
+    "@liquid-glass-forge/core": "0.1.0-rc.1",
+    "@liquid-glass-forge/cpu": "0.1.0-rc.1",
+    "@liquid-glass-forge/dom": "0.1.0-rc.1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/namipsg/liquid-glass-forge.git",
+    "directory": "packages/webgl"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}