glre 0.18.0 → 0.20.0

package/README.md

@@ -0,0 +1,250 @@
+# 🌇 glre
+
+<strong>
+<samp>
+
+<p align="center">
+
+[![ npm version ](https://img.shields.io/npm/v/glre?style=flat&colorA=000&colorB=000)](https://www.npmjs.com/package/glre)
+[![ downloads ](https://img.shields.io/npm/dm/glre.svg?style=flat&colorA=000&colorB=000)](https://www.npmtrends.com/glre)
+[![ license MIT ](https://img.shields.io/npm/l/glre?style=flat&colorA=000&colorB=000)](https://github.com/tseijp/glre)
+[![ docs available ](https://img.shields.io/badge/docs-available-000.svg?style=flat&colorA=000)](https://glre.tsei.jp/>)
+[![ bundle size ](https://img.shields.io/bundlephobia/minzip/glre?style=flat&colorA=000&colorB=000)](https://bundlephobia.com/package/glre@latest)
+
+glre is a simple glsl Reactive Engine on the web and native via TypeScript, React, Solid and more.
+
+</p>
+<p align="center" valign="top">
+  <a href="https://codesandbox.io/s/glre-test1-skyl9p">
+    <img alt="test1" width="256" src="https://user-images.githubusercontent.com/40712342/212297558-15a1e721-55d6-4b6f-aab4-9f5d7cede2cb.gif"></img>
+  </a>
+  <a href="https://codesandbox.io/s/glre-test2-c1syho">
+    <img alt="test2" width="256" src="https://user-images.githubusercontent.com/40712342/212297576-e12cef1b-b0e0-40cb-ac0f-7fb387ae6da8.gif"></img>
+  </a>
+  <a href="https://codesandbox.io/s/glre-test3-ntlk3l">
+    <img alt="test3" width="256" src="https://user-images.githubusercontent.com/40712342/212297587-0227d536-5cef-447a-be3e-4c93dad002a2.gif"></img>
+  </a>
+  <a href="https://codesandbox.io/s/glre-raymarch-test-q8pyxv" target="_blank" rel="noopener">
+    <img alt="raymarch1" width="256" src="https://user-images.githubusercontent.com/40712342/215024903-90f25934-1018-4f2a-81e6-f16e5c64c378.gif"></img>
+  </a>
+  <a href="https://codesandbox.io/s/glre-raymarch-test2-fcds29" target="_blank" rel="noopener">
+    <img alt="raymarch2" width="256" src="https://user-images.githubusercontent.com/40712342/215024942-27766b2b-7b85-4725-bb3d-865bf137ea29.gif"></img>
+  </a>
+  <a href="https://codesandbox.io/s/glre-raymarch-test3-nx6ggi" target="_blank" rel="noopener">
+    <img alt="raymarch3" width="256" src="https://user-images.githubusercontent.com/40712342/215025052-c2fa46e5-5e0e-4de8-baee-869ca6135a61.gif"></img>
+  </a>
+  <a href="https://codesandbox.io/s/glre-raymarch-test4-cy1wpp" target="_blank" rel="noopener">
+    <img alt="raymarch4" width="256" src="https://user-images.githubusercontent.com/40712342/215025289-132b4213-aabc-48f2-bbe3-05764a8dae42.gif"></img>
+  </a>
+  <a href="https://codesandbox.io/s/glre-raymarch-test5-19v0g7" target="_blank" rel="noopener">
+    <img alt="raymarch5" width="256" src="https://user-images.githubusercontent.com/40712342/215025456-8ab75328-ca7a-41f6-b5fe-98dd58410b38.gif"></img>
+  </a>
+  <a href="https://codesandbox.io/s/glre-raymarch-test6-jew0it" target="_blank" rel="noopener">
+    <img alt="raymarch6" width="256" src="https://user-images.githubusercontent.com/40712342/215025517-343fdfbf-af54-497c-a759-267acc450366.gif"></img>
+  </a>
+</p>
+
+## Installation
+
+```ruby
+npm install glre
+```
+
+<table>
+<td width="1000px" valign="top">
+
+## Documentation
+
+###### [Docs][docs] : glre Introduction
+
+###### [API][api] : glre API and feature
+
+###### [Guide][guide] : Creating a scene
+
+[docs]: https://glre.tsei.jp/docs
+[api]: https://glre.tsei.jp/api
+[guide]: https://glre.tsei.jp/guide
+
+</td>
+<td width="1000px" valign="top">
+
+## Ecosystem
+
+###### ⛪️ [reev][reev]: reactive event state manager
+
+###### 🔮 [refr][refr]: request animation frame
+
+[reev]: https://github.com/tseijp/reev
+[refr]: https://github.com/tseijp/refr
+
+</td>
+<td width="1000px" valign="top">
+
+## Staying informed
+
+###### [github discussions][github] welcome✨
+
+###### [@tseijp][twitter] twitter
+
+###### [tsei.jp][articles] articles
+
+[github]: https://github.com/tseijp/glre/discussions
+[twitter]: https://twitter.com/tseijp
+[articles]: https://tsei.jp/articles
+
+</td>
+</table>
+
+## PRs
+
+###### welcome✨
+
+## What does it look like?
+
+<table>
+  <tr>
+    <td width="7500px" align="center" valign="center">
+      glre simplifies glsl programming via TypeScript, React, Solid and more (<a href="https://codesandbox.io/s/glre-basic-demo-ppzo3d">live demo</a>).
+    </td>
+    <td width="2500px" valign="top">
+      <a href="https://codesandbox.io/s/glre-basic-demo-ppzo3d">
+        <img alt="4" src="https://i.imgur.com/Lb3h9fs.jpg"></img>
+      </a>
+    </td>
+  </tr>
+</table>
+
+```ts
+import { createRoot } from 'react-dom/client'
+import { useGL, useFrame } from 'glre/react'
+
+const fragment = `
+precision highp float;
+uniform vec2 iResolution;
+void main() {
+  gl_FragColor = vec4(fract(gl_FragCoord.xy / iResolution), 0, 1);
+}
+`
+
+const App = () => {
+        const gl = useGL({ fragment })
+        useFrame(() => {
+                gl.clear()
+                gl.viewport()
+                gl.drawArrays()
+        })
+        return <canvas ref={gl.ref} />
+}
+
+createRoot(document.getElementById('root')).render(<App />)
+```
+
+<details>
+<summary>
+
+react-native supported ([codesandbox demo](https://codesandbox.io/p/sandbox/glre-react-native-test-k2vfvk))
+
+</summary>
+
+```ts
+import { GLView } from 'expo-gl'
+import { useGL, useFrame } from 'glre/native'
+import { registerRootComponent } from 'expo'
+
+const fragment = `
+precision highp float;
+uniform vec2 iResolution;
+void main() {
+  gl_FragColor = vec4(fract(gl_FragCoord.xy / iResolution), 0, 1);
+}
+`
+
+const App = () => {
+        const self = useGL({ fragment })
+        useFrame(() => {
+                self.clear()
+                self.viewport()
+                self.drawArrays()
+                self.gl.flush()
+                self.gl.endFrameEXP()
+        })
+        return <GLView style={{ flex: 1 }} onContextCreate={self.ref} />
+}
+
+registerRootComponent(App)
+```
+
+</details>
+<details>
+<summary>
+
+solid js supported ([codesandbox demo](https://codesandbox.io/p/sandbox/glre-solid-test-qgzhxh))
+
+</summary>
+
+```ts
+import { render } from 'solid-js/web'
+import { onGL, onFrame } from 'glre/solid'
+
+const fragment = `
+precision highp float;
+uniform vec2 iResolution;
+void main() {
+  gl_FragColor = vec4(fract(gl_FragCoord.xy / iResolution), 0, 1);
+}
+`
+
+const App = () => {
+        const gl = onGL({ fragment })
+        onFrame(() => {
+                gl.clear()
+                gl.viewport()
+                gl.drawArrays()
+        })
+        return <canvas ref={gl.ref} />
+}
+
+render(() => <App />, document.getElementById('root'))
+```
+
+</details>
+<details>
+<summary>
+
+pure js supported ([codesandbox demo](https://codesandbox.io/s/glre-basic-demo3-3bhr3y))
+
+</summary>
+
+```html
+<canvas id="id" style="top: 0; left: 0; position: fixed" />
+<script type="module">
+        import self from 'https://cdn.skypack.dev/glre@latest'
+        const fragment = `
+          precision highp float;
+          uniform vec2 iResolution;
+          void main() {
+            gl_FragColor = vec4(fract(gl_FragCoord.xy / iResolution), 0, 1);
+          }
+        `
+        function setup() {
+                const el = document.getElementById('id')
+                const gl = el.getContext('webgl2')
+                self({ el, gl, fragment })
+                self.init()
+                self.resize()
+                draw()
+        }
+        function draw() {
+                requestAnimationFrame(draw)
+                self.render()
+                self.clear()
+                self.viewport()
+                self.drawArrays()
+        }
+        document.addEventListener('DOMContentLoaded', setup)
+</script>
+```
+
+</details>
+</samp>
+</strong>

package/dist/index.d.ts

@@ -1,9 +1,320 @@
-import { G as GL } from './types-20446758.js';
-import 'refr/types';
-import 'reev/types';
+import * as refr from 'refr';
+import { P as PrecisionMode, U as Uniform, A as Attribute, G as GLClearMode, a as GLDrawMode } from './types-2792569d.js';
 
-declare const createGL: (props?: Partial<GL>) => GL;
-declare const gl: GL;
-declare const createTF: (props?: Partial<GL>, self?: GL) => GL;
+declare const createGL: (props?: EventState<{
+    id: string;
+    width: number;
+    height: number;
+    size: [number, number];
+    mouse: [number, number];
+    count: number;
+    vs: string;
+    fs: string;
+    vert: string;
+    frag: string;
+    vertex: string;
+    fragment: string;
+    varying: string;
+    int: PrecisionMode;
+    float: PrecisionMode;
+    sampler2D: PrecisionMode;
+    samplerCube: PrecisionMode;
+    lastActiveUnit: number;
+    gl: any;
+    pg: any;
+    el: any;
+    frame: refr.Queue;
+    target: any;
+    stride: Nested<number>;
+    location: Nested<any>;
+    activeUnit: Nested<number>;
+    default: any;
+    ref?: any;
+    init(varying?: string[]): void;
+    mount(): void;
+    clean(): void;
+    render(): void;
+    mousemove(e: Event): void;
+    resize(e?: Event, width?: number, height?: number): void;
+    load(e?: Event, image?: HTMLImageElement): void;
+    uniform(key: string, value: Uniform): EventState<any>;
+    uniform(target: {
+        [key: string]: Uniform;
+    }): EventState<any>;
+    texture(key: string, value: string): EventState<any>;
+    texture(target: {
+        [key: string]: string;
+    }): EventState<any>;
+    attribute(key: string, value: Attribute, iboValue?: Attribute): EventState<any>;
+    attribute(target: {
+        [key: string]: Attribute;
+    }): EventState<any>;
+    clear(key?: GLClearMode): void;
+    viewport(size?: [number, number]): void;
+    drawArrays(key?: GLDrawMode): void;
+    drawElements(key?: GLDrawMode): void;
+}>) => EventState<{
+    id: string;
+    width: number;
+    height: number;
+    size: [number, number];
+    mouse: [number, number];
+    count: number;
+    vs: string;
+    fs: string;
+    vert: string;
+    frag: string;
+    vertex: string;
+    fragment: string;
+    varying: string;
+    int: PrecisionMode;
+    float: PrecisionMode;
+    sampler2D: PrecisionMode;
+    samplerCube: PrecisionMode;
+    lastActiveUnit: number;
+    gl: any;
+    pg: any;
+    el: any;
+    frame: refr.Queue;
+    target: any;
+    stride: Nested<number>;
+    location: Nested<any>;
+    activeUnit: Nested<number>;
+    default: any;
+    ref?: any;
+    init(varying?: string[]): void;
+    mount(): void;
+    clean(): void;
+    render(): void;
+    mousemove(e: Event): void;
+    resize(e?: Event, width?: number, height?: number): void;
+    load(e?: Event, image?: HTMLImageElement): void;
+    uniform(key: string, value: Uniform): EventState<any>;
+    uniform(target: {
+        [key: string]: Uniform;
+    }): EventState<any>;
+    texture(key: string, value: string): EventState<any>;
+    texture(target: {
+        [key: string]: string;
+    }): EventState<any>;
+    attribute(key: string, value: Attribute, iboValue?: Attribute): EventState<any>;
+    attribute(target: {
+        [key: string]: Attribute;
+    }): EventState<any>;
+    clear(key?: GLClearMode): void;
+    viewport(size?: [number, number]): void;
+    drawArrays(key?: GLDrawMode): void;
+    drawElements(key?: GLDrawMode): void;
+}>;
+declare const gl: EventState<{
+    id: string;
+    width: number;
+    height: number;
+    size: [number, number];
+    mouse: [number, number];
+    count: number;
+    vs: string;
+    fs: string;
+    vert: string;
+    frag: string;
+    vertex: string;
+    fragment: string;
+    varying: string;
+    int: PrecisionMode;
+    float: PrecisionMode;
+    sampler2D: PrecisionMode;
+    samplerCube: PrecisionMode;
+    lastActiveUnit: number;
+    gl: any;
+    pg: any;
+    el: any;
+    frame: refr.Queue;
+    target: any;
+    stride: Nested<number>;
+    location: Nested<any>;
+    activeUnit: Nested<number>;
+    default: any;
+    ref?: any;
+    init(varying?: string[]): void;
+    mount(): void;
+    clean(): void;
+    render(): void;
+    mousemove(e: Event): void;
+    resize(e?: Event, width?: number, height?: number): void;
+    load(e?: Event, image?: HTMLImageElement): void;
+    uniform(key: string, value: Uniform): EventState<any>;
+    uniform(target: {
+        [key: string]: Uniform;
+    }): EventState<any>;
+    texture(key: string, value: string): EventState<any>;
+    texture(target: {
+        [key: string]: string;
+    }): EventState<any>;
+    attribute(key: string, value: Attribute, iboValue?: Attribute): EventState<any>;
+    attribute(target: {
+        [key: string]: Attribute;
+    }): EventState<any>;
+    clear(key?: GLClearMode): void;
+    viewport(size?: [number, number]): void;
+    drawArrays(key?: GLDrawMode): void;
+    drawElements(key?: GLDrawMode): void;
+}>;
+declare const createTF: (props?: EventState<{
+    id: string;
+    width: number;
+    height: number;
+    size: [number, number];
+    mouse: [number, number];
+    count: number;
+    vs: string;
+    fs: string;
+    vert: string;
+    frag: string;
+    vertex: string;
+    fragment: string;
+    varying: string;
+    int: PrecisionMode;
+    float: PrecisionMode;
+    sampler2D: PrecisionMode;
+    samplerCube: PrecisionMode;
+    lastActiveUnit: number;
+    gl: any;
+    pg: any;
+    el: any;
+    frame: refr.Queue;
+    target: any;
+    stride: Nested<number>;
+    location: Nested<any>;
+    activeUnit: Nested<number>;
+    default: any;
+    ref?: any;
+    init(varying?: string[]): void;
+    mount(): void;
+    clean(): void;
+    render(): void;
+    mousemove(e: Event): void;
+    resize(e?: Event, width?: number, height?: number): void;
+    load(e?: Event, image?: HTMLImageElement): void;
+    uniform(key: string, value: Uniform): EventState<any>;
+    uniform(target: {
+        [key: string]: Uniform;
+    }): EventState<any>;
+    texture(key: string, value: string): EventState<any>;
+    texture(target: {
+        [key: string]: string;
+    }): EventState<any>;
+    attribute(key: string, value: Attribute, iboValue?: Attribute): EventState<any>;
+    attribute(target: {
+        [key: string]: Attribute;
+    }): EventState<any>;
+    clear(key?: GLClearMode): void;
+    viewport(size?: [number, number]): void;
+    drawArrays(key?: GLDrawMode): void;
+    drawElements(key?: GLDrawMode): void;
+}>, self?: EventState<{
+    id: string;
+    width: number;
+    height: number;
+    size: [number, number];
+    mouse: [number, number];
+    count: number;
+    vs: string;
+    fs: string;
+    vert: string;
+    frag: string;
+    vertex: string;
+    fragment: string;
+    varying: string;
+    int: PrecisionMode;
+    float: PrecisionMode;
+    sampler2D: PrecisionMode;
+    samplerCube: PrecisionMode;
+    lastActiveUnit: number;
+    gl: any;
+    pg: any;
+    el: any;
+    frame: refr.Queue;
+    target: any;
+    stride: Nested<number>;
+    location: Nested<any>;
+    activeUnit: Nested<number>;
+    default: any;
+    ref?: any;
+    init(varying?: string[]): void;
+    mount(): void;
+    clean(): void;
+    render(): void;
+    mousemove(e: Event): void;
+    resize(e?: Event, width?: number, height?: number): void;
+    load(e?: Event, image?: HTMLImageElement): void;
+    uniform(key: string, value: Uniform): EventState<any>;
+    uniform(target: {
+        [key: string]: Uniform;
+    }): EventState<any>;
+    texture(key: string, value: string): EventState<any>;
+    texture(target: {
+        [key: string]: string;
+    }): EventState<any>;
+    attribute(key: string, value: Attribute, iboValue?: Attribute): EventState<any>;
+    attribute(target: {
+        [key: string]: Attribute;
+    }): EventState<any>;
+    clear(key?: GLClearMode): void;
+    viewport(size?: [number, number]): void;
+    drawArrays(key?: GLDrawMode): void;
+    drawElements(key?: GLDrawMode): void;
+}>) => EventState<{
+    id: string;
+    width: number;
+    height: number;
+    size: [number, number];
+    mouse: [number, number];
+    count: number;
+    vs: string;
+    fs: string;
+    vert: string;
+    frag: string;
+    vertex: string;
+    fragment: string;
+    varying: string;
+    int: PrecisionMode;
+    float: PrecisionMode;
+    sampler2D: PrecisionMode;
+    samplerCube: PrecisionMode;
+    lastActiveUnit: number;
+    gl: any;
+    pg: any;
+    el: any;
+    frame: refr.Queue;
+    target: any;
+    stride: Nested<number>;
+    location: Nested<any>;
+    activeUnit: Nested<number>;
+    default: any;
+    ref?: any;
+    init(varying?: string[]): void;
+    mount(): void;
+    clean(): void;
+    render(): void;
+    mousemove(e: Event): void;
+    resize(e?: Event, width?: number, height?: number): void;
+    load(e?: Event, image?: HTMLImageElement): void;
+    uniform(key: string, value: Uniform): EventState<any>;
+    uniform(target: {
+        [key: string]: Uniform;
+    }): EventState<any>;
+    texture(key: string, value: string): EventState<any>;
+    texture(target: {
+        [key: string]: string;
+    }): EventState<any>;
+    attribute(key: string, value: Attribute, iboValue?: Attribute): EventState<any>;
+    attribute(target: {
+        [key: string]: Attribute;
+    }): EventState<any>;
+    clear(key?: GLClearMode): void;
+    viewport(size?: [number, number]): void;
+    drawArrays(key?: GLDrawMode): void;
+    drawElements(key?: GLDrawMode): void;
+}>;
 
 export { createGL, createTF, gl as default, gl };

package/dist/index.js

@@ -1,4 +1,4 @@
-var A=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var O=Object.prototype.hasOwnProperty;var C=(e,t)=>{for(var n in t)A(e,n,{get:t[n],enumerable:!0})},z=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of w(t))!O.call(e,a)&&a!==n&&A(e,a,{get:()=>t[a],enumerable:!(o=G(t,a))||o.enumerable});return e};var H=e=>z(A({},"__esModule",{value:!0}),e);var q={};C(q,{createGL:()=>b,createTF:()=>k,default:()=>$,gl:()=>U});module.exports=H(q);var s=require("reev"),_=require("refr");var x=(e,t=!1)=>{let n=typeof e=="number"?0:e?.length;return n?t?(n=Math.sqrt(n)<<0,`uniformMatrix${n}fv`):`uniform${n}fv`:"uniform1f"},P=(e,t,n)=>{n&&(e=Math.max(...n)+1);let o=t.length/e;return o!==o<<0&&console.warn(`Vertex Stride Error: count ${e} is mismatch`),o<<0},F=(e,t,n)=>{let o=e.createShader(n);if(e.shaderSource(o,t),e.compileShader(o),e.getShaderParameter(o,e.COMPILE_STATUS))return o;throw`Could not compile glsl
+var A=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var O=Object.prototype.hasOwnProperty;var C=(e,t)=>{for(var n in t)A(e,n,{get:t[n],enumerable:!0})},z=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of w(t))!O.call(e,a)&&a!==n&&A(e,a,{get:()=>t[a],enumerable:!(o=G(t,a))||o.enumerable});return e};var H=e=>z(A({},"__esModule",{value:!0}),e);var q={};C(q,{createGL:()=>b,createTF:()=>k,default:()=>$,gl:()=>U});module.exports=H(q);var s=require("reev"),_=require("refr");var x=(e,t=!1)=>{let n=typeof e=="number"?0:e?.length;return n?t?(n=Math.sqrt(n)<<0,`uniformMatrix${n}fv`):`uniform${n}fv`:"uniform1f"},P=(e,t,n)=>{n&&(e=Math.max(...n)+1);let o=t.length/e;return o!==o<<0&&console.warn(`Vertex Stride Error: count ${e} is mismatch`),o<<0},d=(e,t,n)=>{let o=e.createShader(n);if(e.shaderSource(o,t),e.compileShader(o),e.getShaderParameter(o,e.COMPILE_STATUS))return o;throw`Could not compile glsl
 
 `+e.getShaderInfoLog(o)},D=(e,t,n)=>{let o=e.createProgram();return e.attachShader(o,t),e.attachShader(o,n),e.linkProgram(o),e.getProgramParameter(o,e.LINK_STATUS)?(e.useProgram(o),o):(console.log(e.getProgramInfoLog(o)),null)},p=(e,t,n,o)=>{let a=e.createProgram();return e.attachShader(a,t),e.attachShader(a,n),e.transformFeedbackVaryings(a,o,e.SEPARATE_ATTRIBS),e.linkProgram(a),e.getProgramParameter(a,e.LINK_STATUS)?(e.useProgram(a),a):(console.warn(e.getProgramInfoLog(a)),null)},L=(e,t)=>{if(!t)return;let n=e.createBuffer();return e.bindBuffer(e.ARRAY_BUFFER,n),e.bufferData(e.ARRAY_BUFFER,new Float32Array(t),e.STATIC_DRAW),e.bindBuffer(e.ARRAY_BUFFER,null),n},y=(e,t)=>{if(!t)return;let n=e.createBuffer();return e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,n),e.bufferData(e.ELEMENT_ARRAY_BUFFER,new Int16Array(t),e.STATIC_DRAW),e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,null),n},B=(e,t,n,o,a)=>{e.bindBuffer(e.ARRAY_BUFFER,o),e.enableVertexAttribArray(n),e.vertexAttribPointer(n,t,e.FLOAT,!1,0,0),a&&e.bindBuffer(e.ELEMENT_ARRAY_BUFFER,a)};var X=(e,t)=>{let n=e.createTexture();return e.bindTexture(e.TEXTURE_2D,n),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,e.RGBA,e.UNSIGNED_BYTE,t),e.generateMipmap(e.TEXTURE_2D),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.bindTexture(e.TEXTURE_2D,null),n},S=(e,t,n,o)=>{e.uniform1i(t,n),e.activeTexture(e["TEXTURE"+n]),e.bindTexture(e.TEXTURE_2D,o)};var Y=[-1,-1,1,-1,-1,1,-1,1,1,-1,1,1],W=`
   attribute vec4 a_position;
@@ -11,5 +11,5 @@ var A=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var w=Object.g
   void main() {
     gl_FragColor = vec4(fract(gl_FragCoord.xy / iResolution), 0, 1);
   }
-`,m=performance.now(),d=0,v=0,b=e=>{let r=(0,s.event)({vertex:W,fragment:V,size:[0,0],mouse:[0,0],count:6,counter:0,init:()=>{r(e);let E=r.gl,i=r.vs||r.vert||r.vertex,u=r.fs||r.frag||r.fragment,T=F(E,i,E.VERTEX_SHADER),c=F(E,u,E.FRAGMENT_SHADER);r.count===6&&r.attribute({a_position:Y}),(0,_.frame)(()=>void r.render()||1),r.pg=r.varying?p(E,T,c,r.varying):D(E,T,c),r.lastActiveUnit=0,r.activeUnit=(0,s.nested)(()=>r.lastActiveUnit++),r.location=(0,s.nested)((f,R=!1)=>R?E?.getAttribLocation(r.pg,f):E?.getUniformLocation(r.pg,f))},render:()=>{r.gl.useProgram(r.pg),r.frame.flush(),d=m,m=performance.now()/1e3,v=m-d,r.uniform({iTime:m,iPrevTime:d,iDeltaTime:v})},resize:(E,i=r.width||window.innerWidth,u=r.height||window.innerHeight)=>{r.size[0]=r.el.width=i,r.size[1]=r.el.height=u,r.uniform("iResolution",r.size)},mousemove:(E,i=E.clientX,u=E.clientY)=>{let[T,c]=r.size,{top:f,left:R}=r.el.getBoundingClientRect();r.mouse[0]=(i-f-T/2)/(T/2),r.mouse[1]=-(u-R-c/2)/(c/2),r.uniform("iMouse",r.mouse)},load:(E,i)=>{r.frame(()=>{let u=r.location(i.alt),T=r.activeUnit(i.alt),c=X(r.gl,i);r.frame(()=>(S(r.gl,u,T,c),!0))})},clear:(E="COLOR_BUFFER_BIT")=>{r.gl.clear(r.gl[E])},viewport:(E=r.size)=>{r.gl.viewport(0,0,...E)},drawArrays:(E="TRIANGLES")=>{r.gl.drawArrays(r.gl[E],0,r.count)},drawElements:(E="TRIANGLES",i="UNSIGNED_SHORT")=>{E=r.gl[E],i=r.gl[i],r.gl.drawElements(E,r.count,i,0)}}),I=(E,i,u="anonymous")=>{if(typeof window>"u")return;let T=new Image,c=f=>r.load(f,T);T.addEventListener("load",c,!1),Object.assign(T,{src:i,alt:E,crossOrigin:u})},M=(E,i=0,u=!1)=>{let T=x(i,u);r.frame(()=>{let c=r.location(E);u?r.gl[T](c,!1,i):r.gl[T](c,i)})},N=(E,i,u)=>{r.frame(()=>{let T=r.location(E,!0),c=L(r.gl,i),f=y(r.gl,u),R=r.count,h=P(R,i,u);B(r.gl,h,T,c,f)})};return r.frame=(0,_.queue)(),r.texture=(0,s.durable)(I),r.uniform=(0,s.durable)(M),r.attribute=(0,s.durable)(N),r},U=b(),k=(e,t=U)=>{let n=()=>{a(e),a.el=t.el,a.gl=t.gl,a.frame=t.frame,a.init(),t({resize:a.resize,mousemove:a.mousemove})},o=()=>{a(e),t({resize:a.resize,mousemove:a.mousemove})},a=b();return a({mount:n,clean:o}),a},$=U;0&&(module.exports={createGL,createTF,gl});
+`,R=performance.now(),F=0,v=0,b=e=>{let r=(0,s.event)({vertex:W,fragment:V,size:[0,0],mouse:[0,0],count:6,counter:0,init:()=>{r(e);let E=r.gl,i=r.vs||r.vert||r.vertex,u=r.fs||r.frag||r.fragment,T=d(E,i,E.VERTEX_SHADER),c=d(E,u,E.FRAGMENT_SHADER);r.count===6&&r.attribute({a_position:Y}),(0,_.frame)(()=>void r.render()||1),r.pg=r.varying?p(E,T,c,r.varying):D(E,T,c),r.lastActiveUnit=0,r.activeUnit=(0,s.nested)(()=>r.lastActiveUnit++),r.location=(0,s.nested)((f,m=!1)=>m?E?.getAttribLocation(r.pg,f):E?.getUniformLocation(r.pg,f))},render:()=>{r.gl.useProgram(r.pg),r.frame.flush(),F=R,R=performance.now()/1e3,v=R-F,r.uniform({iTime:R,iPrevTime:F,iDeltaTime:v})},resize:(E,i=r.width||window.innerWidth,u=r.height||window.innerHeight)=>{r.size[0]=r.el.width=i,r.size[1]=r.el.height=u,r.uniform("iResolution",r.size)},mousemove:(E,i=E.clientX,u=E.clientY)=>{let[T,c]=r.size,{top:f,left:m}=r.el.getBoundingClientRect();r.mouse[0]=(i-f-T/2)/(T/2),r.mouse[1]=-(u-m-c/2)/(c/2),r.uniform("iMouse",r.mouse)},load:(E,i)=>{r.frame(()=>{let u=r.location(i.alt),T=r.activeUnit(i.alt),c=X(r.gl,i);r.frame(()=>(S(r.gl,u,T,c),!0))})},clear:(E="COLOR_BUFFER_BIT")=>{r.frame(()=>void r.gl.clear(r.gl[E]))},viewport:(E=r.size)=>{r.frame(()=>void r.gl.viewport(0,0,...E))},drawArrays:(E="TRIANGLES")=>{r.frame(()=>{r.gl.drawArrays(r.gl[E],0,r.count)})},drawElements:(E="TRIANGLES",i="UNSIGNED_SHORT")=>{r.frame(()=>{E=r.gl[E],i=r.gl[i],r.gl.drawElements(E,r.count,i,0)})}}),I=(E,i,u="anonymous")=>{if(typeof window>"u")return;let T=new Image,c=f=>r.load(f,T);T.addEventListener("load",c,!1),Object.assign(T,{src:i,alt:E,crossOrigin:u})},M=(E,i=0,u=!1)=>{let T=x(i,u);r.frame(()=>{let c=r.location(E);u?r.gl[T](c,!1,i):r.gl[T](c,i)})},N=(E,i,u)=>{r.frame(()=>{let T=r.location(E,!0),c=L(r.gl,i),f=y(r.gl,u),m=r.count,h=P(m,i,u);B(r.gl,h,T,c,f)})};return r.frame=(0,_.queue)(),r.texture=(0,s.durable)(I),r.uniform=(0,s.durable)(M),r.attribute=(0,s.durable)(N),r},U=b(),k=(e,t=U)=>{let n=()=>{a(e),a.el=t.el,a.gl=t.gl,a.frame=t.frame,a.init(),t({resize:a.resize,mousemove:a.mousemove})},o=()=>{a(e),t({resize:a.resize,mousemove:a.mousemove})},a=b();return a({mount:n,clean:o}),a},$=U;0&&(module.exports={createGL,createTF,gl});
 //# sourceMappingURL=index.js.map