micugl 0.0.12 → 0.0.13

package/dist/core/managers/WebGLManager.d.ts

@@ -21,7 +21,7 @@ export declare class WebGLManager {
     updateBuffer(programId: string, attributeName: string, data: Float32Array | Uint8Array | Uint16Array): void;
     registerUniformUpdater<T extends UniformType>(programId: string, uniformName: string, type: T, updateFn: UniformUpdateFn<T>): void;
     updateUniforms(programId: string, time: number): void;
-    setSize(width: number, height: number, useDevicePixelRatio?: boolean): void;
+    setSize(width: number, height: number, dpr?: number): void;
     prepareRender(programId: string, options?: RenderOptions): void;
     fastRender(programId: string, time: number, clear?: boolean): void;
     setUniform<T extends UniformType>(programId: string, uniformName: string, value: UniformTypeMap[T], type: T): void;

package/dist/core/managers/WebGLManager.js

@@ -1 +1 @@
-"use strict";var w=Object.defineProperty;var b=(m,r,o)=>r in m?w(m,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):m[r]=o;var d=(m,r,o)=>b(m,typeof r!="symbol"?r+"":r,o);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("./FBOManager.js");class v{constructor(r,o){d(this,"gl");d(this,"fboManager");d(this,"resources",new Map);d(this,"compileCache",new Map);d(this,"uniformUpdateFns",new Map);d(this,"extensions",new Map);const t={alpha:!1,depth:!1,stencil:!1,antialias:!1,powerPreference:"low-power",preserveDrawingBuffer:!1},e=r.getContext("webgl",{...t,...o});if(!e)throw new Error("WebGL not supported");this.gl=e,this.fboManager=new E.FBOManager(e),this.getExtension("OES_texture_float"),this.getExtension("OES_texture_float_linear"),this.getExtension("OES_vertex_array_object"),this.getExtension("ANGLE_instanced_arrays")}getExtension(r){if(this.extensions.has(r))return this.extensions.get(r);const o=this.gl.getExtension(r);return this.extensions.set(r,o),o}createProgram(r,o){const{vertexShader:t,fragmentShader:e,uniforms:s,attributes:i}=o,n=this.gl,h=this.getOrCompileShader("vertex:"+t,n.VERTEX_SHADER,t),l=this.getOrCompileShader("fragment:"+e,n.FRAGMENT_SHADER,e),f=n.createProgram();if(!f)throw new Error("Failed to create WebGL program");if(n.attachShader(f,h),n.attachShader(f,l),n.linkProgram(f),!n.getProgramParameter(f,n.LINK_STATUS)){const g=n.getProgramInfoLog(f);throw n.deleteProgram(f),new Error(`Could not link shader program: ${g}`)}const c={};for(const g of s)c[g.name]=n.getUniformLocation(f,g.name);const u={};if(i)for(const g of i)u[g.name]=n.getAttribLocation(f,g.name);const a={program:f,uniforms:c,attributes:u,buffers:{}};return this.resources.set(r,a),this.uniformUpdateFns.set(r,new Map),a}getOrCompileShader(r,o,t){if(this.compileCache.has(r)){const s=this.compileCache.get(r);if(s)return s}const e=this.compileShader(o,t);return this.compileCache.set(r,e),e}compileShader(r,o){const t=this.gl,e=t.createShader(r);if(!e)throw new Error("Failed to create shader");if(t.shaderSource(e,o),t.compileShader(e),!t.getShaderParameter(e,t.COMPILE_STATUS)){const s=t.getShaderInfoLog(e);throw t.deleteShader(e),new Error(`Shader compilation failed: ${s}`)}return e}createBuffer(r,o,t){const e=this.gl,s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);const i=e.createBuffer();if(!i)throw new Error("Failed to create buffer");return e.bindBuffer(e.ARRAY_BUFFER,i),e.bufferData(e.ARRAY_BUFFER,t,e.STATIC_DRAW),s.buffers[o]={buffer:i,data:t},i}updateBuffer(r,o,t){const e=this.gl,s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);const i=s.buffers[o];if(!i)throw new Error(`Buffer for attribute ${o} not found`);e.bindBuffer(e.ARRAY_BUFFER,i.buffer),e.bufferData(e.ARRAY_BUFFER,t,e.STATIC_DRAW),i.data=t}registerUniformUpdater(r,o,t,e){const s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);const i=this.uniformUpdateFns.get(r);if(!i)throw new Error(`Program uniforms for id ${r} not found`);const n=s.uniforms[o];if(n===null)return;const h=this.gl;let l;switch(t){case"int":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform1i(n,a),a};break;case"float":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform1f(n,a),a};break;case"sampler2D":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform1i(n,a),a};break;case"vec2":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform2fv(n,a),a};break;case"vec3":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform3fv(n,a),a};break;case"vec4":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform4fv(n,a),a};break;case"mat2":l=(f,c,u)=>{const a=e(f,c,u);return h.uniformMatrix2fv(n,!1,a),a};break;case"mat3":l=(f,c,u)=>{const a=e(f,c,u);return h.uniformMatrix3fv(n,!1,a),a};break;case"mat4":l=(f,c,u)=>{const a=e(f,c,u);return h.uniformMatrix4fv(n,!1,a),a};break;default:throw new Error(`Unsupported uniform type: ${t}`)}i.set(o,l)}updateUniforms(r,o){const t=this.uniformUpdateFns.get(r);if(!t)return;const e=this.gl.canvas,s=e.width,i=e.height;t.forEach(n=>{n(o,s,i)})}setSize(r,o,t=!0){const e=this.gl.canvas,s=t&&window.devicePixelRatio||1,i=Math.floor(r*s),n=Math.floor(o*s);(e.width!==i||e.height!==n)&&(e.width=i,e.height=n,e.style.width=`${r}px`,e.style.height=`${o}px`,this.gl.viewport(0,0,i,n))}prepareRender(r,o={}){const{clear:t=!0,clearColor:e=[0,0,0,1]}=o,s=this.gl,i=this.resources.get(r);if(!i)throw new Error(`Program with id ${r} not found`);s.useProgram(i.program),t&&(s.clearColor(...e),s.clear(s.COLOR_BUFFER_BIT))}fastRender(r,o,t=!0){const e=this.gl,s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);e.useProgram(s.program),t&&e.clear(e.COLOR_BUFFER_BIT),this.updateUniforms(r,o)}setUniform(r,o,t,e){const s=this.gl,i=this.resources.get(r);if(!i)throw new Error(`Program with id ${r} not found`);const n=i.uniforms[o];if(n!==null)switch(s.useProgram(i.program),e){case"float":s.uniform1f(n,t);break;case"vec2":s.uniform2fv(n,t);break;case"vec3":s.uniform3fv(n,t);break;case"vec4":s.uniform4fv(n,t);break;case"int":s.uniform1i(n,t);break;case"mat2":s.uniformMatrix2fv(n,!1,t);break;case"mat3":s.uniformMatrix3fv(n,!1,t);break;case"mat4":s.uniformMatrix4fv(n,!1,t);break;case"sampler2D":s.uniform1i(n,t);break;default:throw new Error(`Unsupported uniform type: ${e}`)}}setAttributeOnce(r,o,t){const e=this.gl,s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);const i=s.attributes[o];if(i===-1){console.warn(`Attribute ${o} not found or is unused`);return}const n=s.buffers[o];if(!n)throw new Error(`Buffer for attribute ${o} not found`);if(e.bindBuffer(e.ARRAY_BUFFER,n.buffer),e.enableVertexAttribArray(i),e.vertexAttribPointer(i,t.size,e[t.type],t.normalized,t.stride,t.offset),t.instanced){const h=this.getExtension("ANGLE_instanced_arrays");if(h!=null&&h.vertexAttribDivisorANGLE)h.vertexAttribDivisorANGLE(i,1);else if(e.vertexAttribDivisor)e.vertexAttribDivisor(i,1);else throw new Error("Instanced rendering not supported")}}drawArrays(r,o,t){this.gl.drawArrays(r,o,t)}drawElements(r,o,t,e){this.gl.drawElements(r,o,t,e)}destroy(r){const o=this.gl,t=this.resources.get(r);t&&(Object.values(t.buffers).forEach(({buffer:e})=>{o.deleteBuffer(e)}),o.deleteProgram(t.program),this.resources.delete(r),this.uniformUpdateFns.delete(r))}destroyAll(){for(const r of Array.from(this.resources.keys()))this.destroy(r);this.compileCache.clear(),this.fboManager.destroyAll()}get context(){return this.gl}get fbo(){return this.fboManager}}exports.WebGLManager=v;
+"use strict";var w=Object.defineProperty;var b=(m,r,o)=>r in m?w(m,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):m[r]=o;var d=(m,r,o)=>b(m,typeof r!="symbol"?r+"":r,o);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("./FBOManager.js");class v{constructor(r,o){d(this,"gl");d(this,"fboManager");d(this,"resources",new Map);d(this,"compileCache",new Map);d(this,"uniformUpdateFns",new Map);d(this,"extensions",new Map);const t={alpha:!1,depth:!1,stencil:!1,antialias:!1,powerPreference:"low-power",preserveDrawingBuffer:!1},e=r.getContext("webgl",{...t,...o});if(!e)throw new Error("WebGL not supported");this.gl=e,this.fboManager=new E.FBOManager(e),this.getExtension("OES_texture_float"),this.getExtension("OES_texture_float_linear"),this.getExtension("OES_vertex_array_object"),this.getExtension("ANGLE_instanced_arrays")}getExtension(r){if(this.extensions.has(r))return this.extensions.get(r);const o=this.gl.getExtension(r);return this.extensions.set(r,o),o}createProgram(r,o){const{vertexShader:t,fragmentShader:e,uniforms:s,attributes:i}=o,n=this.gl,h=this.getOrCompileShader("vertex:"+t,n.VERTEX_SHADER,t),l=this.getOrCompileShader("fragment:"+e,n.FRAGMENT_SHADER,e),f=n.createProgram();if(!f)throw new Error("Failed to create WebGL program");if(n.attachShader(f,h),n.attachShader(f,l),n.linkProgram(f),!n.getProgramParameter(f,n.LINK_STATUS)){const g=n.getProgramInfoLog(f);throw n.deleteProgram(f),new Error(`Could not link shader program: ${g}`)}const c={};for(const g of s)c[g.name]=n.getUniformLocation(f,g.name);const u={};if(i)for(const g of i)u[g.name]=n.getAttribLocation(f,g.name);const a={program:f,uniforms:c,attributes:u,buffers:{}};return this.resources.set(r,a),this.uniformUpdateFns.set(r,new Map),a}getOrCompileShader(r,o,t){if(this.compileCache.has(r)){const s=this.compileCache.get(r);if(s)return s}const e=this.compileShader(o,t);return this.compileCache.set(r,e),e}compileShader(r,o){const t=this.gl,e=t.createShader(r);if(!e)throw new Error("Failed to create shader");if(t.shaderSource(e,o),t.compileShader(e),!t.getShaderParameter(e,t.COMPILE_STATUS)){const s=t.getShaderInfoLog(e);throw t.deleteShader(e),new Error(`Shader compilation failed: ${s}`)}return e}createBuffer(r,o,t){const e=this.gl,s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);const i=e.createBuffer();if(!i)throw new Error("Failed to create buffer");return e.bindBuffer(e.ARRAY_BUFFER,i),e.bufferData(e.ARRAY_BUFFER,t,e.STATIC_DRAW),s.buffers[o]={buffer:i,data:t},i}updateBuffer(r,o,t){const e=this.gl,s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);const i=s.buffers[o];if(!i)throw new Error(`Buffer for attribute ${o} not found`);e.bindBuffer(e.ARRAY_BUFFER,i.buffer),e.bufferData(e.ARRAY_BUFFER,t,e.STATIC_DRAW),i.data=t}registerUniformUpdater(r,o,t,e){const s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);const i=this.uniformUpdateFns.get(r);if(!i)throw new Error(`Program uniforms for id ${r} not found`);const n=s.uniforms[o];if(n===null)return;const h=this.gl;let l;switch(t){case"int":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform1i(n,a),a};break;case"float":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform1f(n,a),a};break;case"sampler2D":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform1i(n,a),a};break;case"vec2":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform2fv(n,a),a};break;case"vec3":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform3fv(n,a),a};break;case"vec4":l=(f,c,u)=>{const a=e(f,c,u);return h.uniform4fv(n,a),a};break;case"mat2":l=(f,c,u)=>{const a=e(f,c,u);return h.uniformMatrix2fv(n,!1,a),a};break;case"mat3":l=(f,c,u)=>{const a=e(f,c,u);return h.uniformMatrix3fv(n,!1,a),a};break;case"mat4":l=(f,c,u)=>{const a=e(f,c,u);return h.uniformMatrix4fv(n,!1,a),a};break;default:throw new Error(`Unsupported uniform type: ${t}`)}i.set(o,l)}updateUniforms(r,o){const t=this.uniformUpdateFns.get(r);if(!t)return;const e=this.gl.canvas,s=e.width,i=e.height;t.forEach(n=>{n(o,s,i)})}setSize(r,o,t=1){const e=this.gl.canvas,s=Math.floor(r*t),i=Math.floor(o*t);(e.width!==s||e.height!==i)&&(e.width=s,e.height=i,e.style.width=`${r}px`,e.style.height=`${o}px`,this.gl.viewport(0,0,s,i))}prepareRender(r,o={}){const{clear:t=!0,clearColor:e=[0,0,0,1]}=o,s=this.gl,i=this.resources.get(r);if(!i)throw new Error(`Program with id ${r} not found`);s.useProgram(i.program),t&&(s.clearColor(...e),s.clear(s.COLOR_BUFFER_BIT))}fastRender(r,o,t=!0){const e=this.gl,s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);e.useProgram(s.program),t&&e.clear(e.COLOR_BUFFER_BIT),this.updateUniforms(r,o)}setUniform(r,o,t,e){const s=this.gl,i=this.resources.get(r);if(!i)throw new Error(`Program with id ${r} not found`);const n=i.uniforms[o];if(n!==null)switch(s.useProgram(i.program),e){case"float":s.uniform1f(n,t);break;case"vec2":s.uniform2fv(n,t);break;case"vec3":s.uniform3fv(n,t);break;case"vec4":s.uniform4fv(n,t);break;case"int":s.uniform1i(n,t);break;case"mat2":s.uniformMatrix2fv(n,!1,t);break;case"mat3":s.uniformMatrix3fv(n,!1,t);break;case"mat4":s.uniformMatrix4fv(n,!1,t);break;case"sampler2D":s.uniform1i(n,t);break;default:throw new Error(`Unsupported uniform type: ${e}`)}}setAttributeOnce(r,o,t){const e=this.gl,s=this.resources.get(r);if(!s)throw new Error(`Program with id ${r} not found`);const i=s.attributes[o];if(i===-1){console.warn(`Attribute ${o} not found or is unused`);return}const n=s.buffers[o];if(!n)throw new Error(`Buffer for attribute ${o} not found`);if(e.bindBuffer(e.ARRAY_BUFFER,n.buffer),e.enableVertexAttribArray(i),e.vertexAttribPointer(i,t.size,e[t.type],t.normalized,t.stride,t.offset),t.instanced){const h=this.getExtension("ANGLE_instanced_arrays");if(h!=null&&h.vertexAttribDivisorANGLE)h.vertexAttribDivisorANGLE(i,1);else if(e.vertexAttribDivisor)e.vertexAttribDivisor(i,1);else throw new Error("Instanced rendering not supported")}}drawArrays(r,o,t){this.gl.drawArrays(r,o,t)}drawElements(r,o,t,e){this.gl.drawElements(r,o,t,e)}destroy(r){const o=this.gl,t=this.resources.get(r);t&&(Object.values(t.buffers).forEach(({buffer:e})=>{o.deleteBuffer(e)}),o.deleteProgram(t.program),this.resources.delete(r),this.uniformUpdateFns.delete(r))}destroyAll(){for(const r of Array.from(this.resources.keys()))this.destroy(r);this.compileCache.clear(),this.fboManager.destroyAll()}get context(){return this.gl}get fbo(){return this.fboManager}}exports.WebGLManager=v;

package/dist/core/managers/WebGLManager.mjs

@@ -1,15 +1,15 @@
 var w = Object.defineProperty;
-var b = (m, e, o) => e in m ? w(m, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : m[e] = o;
-var d = (m, e, o) => b(m, typeof e != "symbol" ? e + "" : e, o);
+var b = (d, e, o) => e in d ? w(d, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : d[e] = o;
+var m = (d, e, o) => b(d, typeof e != "symbol" ? e + "" : e, o);
 import { FBOManager as E } from "./FBOManager.mjs";
 class A {
   constructor(e, o) {
-    d(this, "gl");
-    d(this, "fboManager");
-    d(this, "resources", /* @__PURE__ */ new Map());
-    d(this, "compileCache", /* @__PURE__ */ new Map());
-    d(this, "uniformUpdateFns", /* @__PURE__ */ new Map());
-    d(this, "extensions", /* @__PURE__ */ new Map());
+    m(this, "gl");
+    m(this, "fboManager");
+    m(this, "resources", /* @__PURE__ */ new Map());
+    m(this, "compileCache", /* @__PURE__ */ new Map());
+    m(this, "uniformUpdateFns", /* @__PURE__ */ new Map());
+    m(this, "extensions", /* @__PURE__ */ new Map());
     const t = {
       alpha: !1,
       depth: !1,
@@ -169,9 +169,9 @@ class A {
       n(o, s, i);
     });
   }
-  setSize(e, o, t = !0) {
-    const r = this.gl.canvas, s = t && window.devicePixelRatio || 1, i = Math.floor(e * s), n = Math.floor(o * s);
-    (r.width !== i || r.height !== n) && (r.width = i, r.height = n, r.style.width = `${e}px`, r.style.height = `${o}px`, this.gl.viewport(0, 0, i, n));
+  setSize(e, o, t = 1) {
+    const r = this.gl.canvas, s = Math.floor(e * t), i = Math.floor(o * t);
+    (r.width !== s || r.height !== i) && (r.width = s, r.height = i, r.style.width = `${e}px`, r.style.height = `${o}px`, this.gl.viewport(0, 0, s, i));
   }
   prepareRender(e, o = {}) {
     const { clear: t = !0, clearColor: r = [0, 0, 0, 1] } = o, s = this.gl, i = this.resources.get(e);

package/dist/react/components/base/BaseShaderComponent.d.ts

@@ -5,6 +5,10 @@ export interface BaseShaderProps {
     programId: string;
     shaderConfig: ShaderProgramConfig;
     uniforms: Record<string, UniformParam>;
+    skipDefaultUniforms?: boolean;
+    width?: number;
+    height?: number;
+    pixelRatio?: number;
     className?: string;
     style?: CSSProperties;
     renderOptions?: {
@@ -12,4 +16,4 @@ export interface BaseShaderProps {
         clearColor?: [number, number, number, number];
     };
 }
-export declare const BaseShaderComponent: ({ programId, shaderConfig, uniforms, className, style, renderOptions }: BaseShaderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BaseShaderComponent: ({ programId, shaderConfig, uniforms, skipDefaultUniforms, width, height, pixelRatio, className, style, renderOptions }: BaseShaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/react/components/base/BaseShaderComponent.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime");require("react");const m=require("../../hooks/useUniformUpdaters.js"),S=require("../engine/ShaderEngine.js"),l={clear:!0,clearColor:[0,0,0,1]},p=({programId:e,shaderConfig:t,uniforms:n,className:s="",style:o,renderOptions:a=l})=>{const u={[e]:t},i=m.useUniformUpdaters(e,n),c=(f,h,r)=>{r.drawArrays(r.TRIANGLE_STRIP,0,4)};return d.jsx(S.ShaderEngine,{programConfigs:u,renderCallback:c,uniformUpdaters:i,className:s,style:o,useFastPath:!0,renderOptions:a})};exports.BaseShaderComponent=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react/jsx-runtime");require("react");const p=require("../../hooks/useUniformUpdaters.js"),h=require("../engine/ShaderEngine.js"),C={clear:!0,clearColor:[0,0,0,1]},E=({programId:e,shaderConfig:s,uniforms:t,skipDefaultUniforms:n=!1,width:o,height:a,pixelRatio:u,className:i="",style:c,renderOptions:d=C})=>{const l={[e]:s},m=p.useUniformUpdaters(e,t,{skipDefaultUniforms:n}),S=(R,U,r)=>{r.drawArrays(r.TRIANGLE_STRIP,0,4)};return f.jsx(h.ShaderEngine,{programConfigs:l,renderCallback:S,uniformUpdaters:m,width:o,height:a,pixelRatio:u,className:i,style:c,useFastPath:!0,renderOptions:d})};exports.BaseShaderComponent=E;

package/dist/react/components/base/BaseShaderComponent.mjs

@@ -1,34 +1,41 @@
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as u } from "react/jsx-runtime";
 import "react";
-import { useUniformUpdaters as p } from "../../hooks/useUniformUpdaters.mjs";
-import { ShaderEngine as u } from "../engine/ShaderEngine.mjs";
-const d = {
+import { useUniformUpdaters as d } from "../../hooks/useUniformUpdaters.mjs";
+import { ShaderEngine as C } from "../engine/ShaderEngine.mjs";
+const E = {
   clear: !0,
   clearColor: [0, 0, 0, 1]
-}, h = ({
+}, U = ({
   programId: r,
   shaderConfig: o,
   uniforms: t,
-  className: s = "",
-  style: a,
-  renderOptions: n = d
+  skipDefaultUniforms: s = !1,
+  width: a,
+  height: n,
+  pixelRatio: m,
+  className: c = "",
+  style: i,
+  renderOptions: p = E
 }) => {
-  const m = { [r]: o }, c = p(r, t);
-  return /* @__PURE__ */ i(
-    u,
+  const f = { [r]: o }, l = d(r, t, { skipDefaultUniforms: s });
+  return /* @__PURE__ */ u(
+    C,
     {
-      programConfigs: m,
-      renderCallback: (l, C, e) => {
+      programConfigs: f,
+      renderCallback: (S, _, e) => {
         e.drawArrays(e.TRIANGLE_STRIP, 0, 4);
       },
-      uniformUpdaters: c,
-      className: s,
-      style: a,
+      uniformUpdaters: l,
+      width: a,
+      height: n,
+      pixelRatio: m,
+      className: c,
+      style: i,
       useFastPath: !0,
-      renderOptions: n
+      renderOptions: p
     }
   );
 };
 export {
-  h as BaseShaderComponent
+  U as BaseShaderComponent
 };

package/dist/react/components/engine/ShaderEngine.d.ts

@@ -6,6 +6,8 @@ interface ShaderEngineProps {
     renderOptions?: RenderOptions;
     className?: string;
     style?: CSSProperties;
+    width?: number;
+    height?: number;
     uniformUpdaters?: Record<string, {
         name: string;
         type: UniformType;
@@ -13,6 +15,7 @@ interface ShaderEngineProps {
     }[]>;
     useFastPath?: boolean;
     useDevicePixelRatio?: boolean;
+    pixelRatio?: number;
 }
-export declare const ShaderEngine: ({ programConfigs, renderCallback, renderOptions, className, style, uniformUpdaters, useFastPath, useDevicePixelRatio }: ShaderEngineProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ShaderEngine: ({ programConfigs, renderCallback, renderOptions, className, style, width, height, uniformUpdaters, useFastPath, useDevicePixelRatio, pixelRatio }: ShaderEngineProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/react/components/engine/ShaderEngine.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("react/jsx-runtime"),t=require("react"),F=require("../../../core/managers/WebGLManager.js"),b={},y="",I={},h={},U=({programConfigs:E,renderCallback:T,renderOptions:o=b,className:L=y,style:S=I,uniformUpdaters:p=h,useFastPath:R=!1,useDevicePixelRatio:w=!0})=>{const f=t.useRef(null),a=t.useRef(null),l=t.useRef(null),u=t.useRef(null),g=t.useRef(0),m=t.useRef(r=>{const e=a.current,n=l.current;if(!e||!n)return;const c=r-g.current,s=e.context;if(R)e.fastRender(n,c,o.clear),s.drawArrays(s.TRIANGLE_STRIP,0,4);else{const i=e.resources.get(n);if(!i)return;e.prepareRender(n,o),A(c,i,s)}u.current=requestAnimationFrame(m.current)}),A=t.useCallback((r,e,n)=>{T(r,e,n)},[T]);t.useEffect(()=>{m.current=r=>{const e=a.current,n=l.current;if(!e||!n)return;const c=r-g.current,s=e.context;if(R)e.fastRender(n,c,o.clear),s.drawArrays(s.TRIANGLE_STRIP,0,4);else{const i=e.resources.get(n);if(!i)return;e.prepareRender(n,o),A(c,i,s)}u.current=requestAnimationFrame(m.current)}},[o,R,A]);const d=t.useCallback(()=>{if(!f.current||!a.current)return;const r=window.innerWidth,e=window.innerHeight;a.current.setSize(r,e,w)},[w]);return t.useEffect(()=>{if(!f.current)return;const r=new F.WebGLManager(f.current);a.current=r,d();const[[e,n]]=Object.entries(E);return r.createProgram(e,n),r.createBuffer(e,"a_position",new Float32Array([-1,-1,1,-1,-1,1,1,1])),r.setAttributeOnce(e,"a_position",{name:"a_position",size:2,type:"FLOAT",normalized:!1,stride:0,offset:0}),l.current=e,g.current=performance.now(),u.current=requestAnimationFrame(m.current),window.addEventListener("resize",d),()=>{window.removeEventListener("resize",d),u.current&&cancelAnimationFrame(u.current),r.destroyAll()}},[E,d]),t.useEffect(()=>{const r=a.current,e=l.current;if(!r||!e)return;const n=p[e];n&&n.forEach(c=>{r.registerUniformUpdater(e,c.name,c.type,c.updateFn)})},[p]),_.jsx("canvas",{ref:f,className:L,style:S})};exports.ShaderEngine=U;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),t=require("react"),I=require("../../../core/managers/WebGLManager.js"),v={},U="",q={},z={},N=({programConfigs:E,renderCallback:T,renderOptions:o=v,className:F=U,style:b=q,width:p,height:w,uniformUpdaters:L=z,useFastPath:R=!1,useDevicePixelRatio:S=!0,pixelRatio:_})=>{const f=t.useRef(null),a=t.useRef(null),l=t.useRef(null),u=t.useRef(null),g=t.useRef(0),d=t.useRef(n=>{const e=a.current,r=l.current;if(!e||!r)return;const c=n-g.current,s=e.context;if(R)e.fastRender(r,c,o.clear),s.drawArrays(s.TRIANGLE_STRIP,0,4);else{const i=e.resources.get(r);if(!i)return;e.prepareRender(r,o),A(c,i,s)}u.current=requestAnimationFrame(d.current)}),A=t.useCallback((n,e,r)=>{T(n,e,r)},[T]);t.useEffect(()=>{d.current=n=>{const e=a.current,r=l.current;if(!e||!r)return;const c=n-g.current,s=e.context;if(R)e.fastRender(r,c,o.clear),s.drawArrays(s.TRIANGLE_STRIP,0,4);else{const i=e.resources.get(r);if(!i)return;e.prepareRender(r,o),A(c,i,s)}u.current=requestAnimationFrame(d.current)}},[o,R,A]);const m=t.useCallback(()=>{if(!f.current||!a.current)return;const n=p??window.innerWidth,e=w??window.innerHeight,r=_??(S?window.devicePixelRatio:1);a.current.setSize(n,e,r)},[S,_,p,w]);return t.useEffect(()=>{if(!f.current)return;const n=new I.WebGLManager(f.current);a.current=n,m();const[[e,r]]=Object.entries(E);return n.createProgram(e,r),n.createBuffer(e,"a_position",new Float32Array([-1,-1,1,-1,-1,1,1,1])),n.setAttributeOnce(e,"a_position",{name:"a_position",size:2,type:"FLOAT",normalized:!1,stride:0,offset:0}),l.current=e,g.current=performance.now(),u.current=requestAnimationFrame(d.current),window.addEventListener("resize",m),()=>{window.removeEventListener("resize",m),u.current&&cancelAnimationFrame(u.current),n.destroyAll()}},[E,m]),t.useEffect(()=>{const n=a.current,e=l.current;if(!n||!e)return;const r=L[e];r&&r.forEach(c=>{n.registerUniformUpdater(e,c.name,c.type,c.updateFn)})},[L]),y.jsx("canvas",{ref:f,className:F,style:b})};exports.ShaderEngine=N;

package/dist/react/components/engine/ShaderEngine.mjs

@@ -1,82 +1,85 @@
-import { jsx as I } from "react/jsx-runtime";
-import { useRef as s, useCallback as _, useEffect as g } from "react";
-import { WebGLManager as U } from "../../../core/managers/WebGLManager.mjs";
-const h = {}, y = "", z = {}, N = {}, q = ({
+import { jsx as y } from "react/jsx-runtime";
+import { useRef as s, useCallback as I, useEffect as g } from "react";
+import { WebGLManager as z } from "../../../core/managers/WebGLManager.mjs";
+const N = {}, b = "", D = {}, P = {}, M = ({
   programConfigs: E,
   renderCallback: T,
-  renderOptions: a = h,
-  className: F = y,
-  style: S = z,
-  uniformUpdaters: w = N,
+  renderOptions: a = N,
+  className: U = b,
+  style: v = D,
+  width: w,
+  height: L,
+  uniformUpdaters: _ = P,
   useFastPath: A = !1,
-  useDevicePixelRatio: L = !0
+  useDevicePixelRatio: F = !0,
+  pixelRatio: S
 }) => {
-  const f = s(null), o = s(null), m = s(null), i = s(null), R = s(0), l = s((r) => {
-    const e = o.current, n = m.current;
-    if (!e || !n) return;
-    const t = r - R.current, c = e.context;
+  const f = s(null), o = s(null), m = s(null), i = s(null), R = s(0), d = s((n) => {
+    const e = o.current, r = m.current;
+    if (!e || !r) return;
+    const t = n - R.current, c = e.context;
     if (A)
-      e.fastRender(n, t, a.clear), c.drawArrays(c.TRIANGLE_STRIP, 0, 4);
+      e.fastRender(r, t, a.clear), c.drawArrays(c.TRIANGLE_STRIP, 0, 4);
     else {
-      const u = e.resources.get(n);
+      const u = e.resources.get(r);
       if (!u) return;
-      e.prepareRender(n, a), p(t, u, c);
+      e.prepareRender(r, a), p(t, u, c);
     }
-    i.current = requestAnimationFrame(l.current);
-  }), p = _((r, e, n) => {
-    T(r, e, n);
+    i.current = requestAnimationFrame(d.current);
+  }), p = I((n, e, r) => {
+    T(n, e, r);
   }, [T]);
   g(() => {
-    l.current = (r) => {
-      const e = o.current, n = m.current;
-      if (!e || !n) return;
-      const t = r - R.current, c = e.context;
+    d.current = (n) => {
+      const e = o.current, r = m.current;
+      if (!e || !r) return;
+      const t = n - R.current, c = e.context;
       if (A)
-        e.fastRender(n, t, a.clear), c.drawArrays(c.TRIANGLE_STRIP, 0, 4);
+        e.fastRender(r, t, a.clear), c.drawArrays(c.TRIANGLE_STRIP, 0, 4);
       else {
-        const u = e.resources.get(n);
+        const u = e.resources.get(r);
         if (!u) return;
-        e.prepareRender(n, a), p(t, u, c);
+        e.prepareRender(r, a), p(t, u, c);
       }
-      i.current = requestAnimationFrame(l.current);
+      i.current = requestAnimationFrame(d.current);
     };
   }, [a, A, p]);
-  const d = _(() => {
+  const l = I(() => {
     if (!f.current || !o.current) return;
-    const r = window.innerWidth, e = window.innerHeight;
-    o.current.setSize(r, e, L);
-  }, [L]);
+    const n = w ?? window.innerWidth, e = L ?? window.innerHeight, r = S ?? (F ? window.devicePixelRatio : 1);
+    o.current.setSize(n, e, r);
+  }, [F, S, w, L]);
   return g(() => {
     if (!f.current) return;
-    const r = new U(f.current);
-    o.current = r, d();
-    const [[e, n]] = Object.entries(E);
-    return r.createProgram(e, n), r.createBuffer(e, "a_position", new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1])), r.setAttributeOnce(e, "a_position", {
+    const n = new z(f.current);
+    o.current = n, l();
+    const [[e, r]] = Object.entries(E);
+    return n.createProgram(e, r), n.createBuffer(e, "a_position", new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1])), n.setAttributeOnce(e, "a_position", {
       name: "a_position",
       size: 2,
       type: "FLOAT",
       normalized: !1,
       stride: 0,
       offset: 0
-    }), m.current = e, R.current = performance.now(), i.current = requestAnimationFrame(l.current), window.addEventListener("resize", d), () => {
-      window.removeEventListener("resize", d), i.current && cancelAnimationFrame(i.current), r.destroyAll();
+    }), m.current = e, R.current = performance.now(), i.current = requestAnimationFrame(d.current), window.addEventListener("resize", l), () => {
+      window.removeEventListener("resize", l), i.current && cancelAnimationFrame(i.current), n.destroyAll();
     };
-  }, [E, d]), g(() => {
-    const r = o.current, e = m.current;
-    if (!r || !e) return;
-    const n = w[e];
-    n && n.forEach((t) => {
-      r.registerUniformUpdater(e, t.name, t.type, t.updateFn);
+  }, [E, l]), g(() => {
+    const n = o.current, e = m.current;
+    if (!n || !e) return;
+    const r = _[e];
+    r && r.forEach((t) => {
+      n.registerUniformUpdater(e, t.name, t.type, t.updateFn);
     });
-  }, [w]), /* @__PURE__ */ I(
+  }, [_]), /* @__PURE__ */ y(
     "canvas",
     {
       ref: f,
-      className: F,
-      style: S
+      className: U,
+      style: v
     }
   );
 };
 export {
-  q as ShaderEngine
+  M as ShaderEngine
 };

package/dist/react/hooks/useUniformUpdaters.d.ts

@@ -1,4 +1,6 @@
 import { UniformParam, UniformUpdaterDef } from '../../types';
-export declare const useUniformUpdaters: (programId: string, uniforms: Record<string, UniformParam>) => {
+export declare const useUniformUpdaters: (programId: string, uniforms: Record<string, UniformParam>, options?: {
+    skipDefaultUniforms?: boolean;
+}) => {
     [x: string]: UniformUpdaterDef<import('../../types').UniformType>[];
 };

package/dist/react/hooks/useUniformUpdaters.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),u=require("../lib/createUniformUpdater.js"),a=(t,r)=>n.useMemo(()=>{const s=u.createCommonUpdaters();return Object.entries(r).forEach(([e,o])=>{const c=e.startsWith("u_")?e:`u_${e}`;s.push(u.createUniformUpdater(c,o.type,o.value))}),{[t]:s}},[t,r]);exports.useUniformUpdaters=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),c=require("../lib/createUniformUpdater.js"),U=(u,t,e)=>n.useMemo(()=>{const a=(e==null?void 0:e.skipDefaultUniforms)??!1?[]:c.createCommonUpdaters().filter(r=>r.name==="u_time"&&!("u_time"in t)||r.name==="u_resolution"&&!("u_resolution"in t));return Object.entries(t).forEach(([r,s])=>{const i=r.startsWith("u_")?r:`u_${r}`;a.push(c.createUniformUpdater(i,s.type,s.value))}),{[u]:a}},[u,t,e==null?void 0:e.skipDefaultUniforms]);exports.useUniformUpdaters=U;

package/dist/react/hooks/useUniformUpdaters.mjs

@@ -1,12 +1,14 @@
-import { useMemo as c } from "react";
-import { createCommonUpdaters as n, createUniformUpdater as p } from "../lib/createUniformUpdater.mjs";
-const a = (e, r) => c(() => {
-  const o = n();
-  return Object.entries(r).forEach(([t, s]) => {
-    const u = t.startsWith("u_") ? t : `u_${t}`;
-    o.push(p(u, s.type, s.value));
-  }), { [e]: o };
-}, [e, r]);
+import { useMemo as f } from "react";
+import { createCommonUpdaters as c, createUniformUpdater as i } from "../lib/createUniformUpdater.mjs";
+const n = (u, t, e) => f(() => {
+  const a = (e == null ? void 0 : e.skipDefaultUniforms) ?? !1 ? [] : c().filter(
+    (r) => r.name === "u_time" && !("u_time" in t) || r.name === "u_resolution" && !("u_resolution" in t)
+  );
+  return Object.entries(t).forEach(([r, m]) => {
+    const s = r.startsWith("u_") ? r : `u_${r}`;
+    a.push(i(s, m.type, m.value));
+  }), { [u]: a };
+}, [u, t, e == null ? void 0 : e.skipDefaultUniforms]);
 export {
-  a as useUniformUpdaters
+  n as useUniformUpdaters
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "micugl",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "description": "Micu gl - Small React shader library",
   "type": "module",
   "main": "dist/index.js",