react-native-effects 0.0.1 → 0.2.0

package/lib/module/components/ShaderView/index.js

@@ -0,0 +1,252 @@
+"use strict";
+
+import { PixelRatio, StyleSheet } from 'react-native';
+import { Canvas } from 'react-native-webgpu';
+import { useEffect, useRef } from 'react';
+import { createSynchronizable, scheduleOnRuntime } from 'react-native-worklets';
+import { colorToVec4 } from "../../utils/colors.js";
+import { useWGPUSetup } from "../../hooks/useWGPUSetup.js";
+import { TRIANGLE_VERTEX_SHADER } from "../../shaders/TRIANGLE_VERTEX_SHADER.js";
+import { UNIFORM_BUFFER_SIZE, UNIFORM_FLOAT_COUNT } from "../../shaders/uniforms.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+// Synchronizable layout: [c0r,c0g,c0b,c0a, c1r,c1g,c1b,c1a, speed, p0..p7, alive]
+// Total: 4 + 4 + 1 + 8 + 1 = 18 floats
+const SYNC_SIZE = 18;
+const IDX_SPEED = 8;
+const IDX_PARAMS = 9; // 9..16
+const IDX_ALIVE = 17;
+export default function ShaderView({
+  fragmentShader,
+  colors = [],
+  speed = 1.0,
+  params = [],
+  isStatic = false,
+  transparent = false,
+  paramsSynchronizable,
+  style,
+  ...viewProps
+}) {
+  const {
+    canvasRef,
+    runtime,
+    resources
+  } = useWGPUSetup();
+  const propsSync = useRef(createSynchronizable(new Float64Array(SYNC_SIZE))).current;
+
+  // Convert props to flat floats and push to synchronizable
+  useEffect(() => {
+    const data = new Float64Array(SYNC_SIZE);
+
+    // color0 (indices 0-3)
+    if (colors[0] !== undefined) {
+      const c0 = colorToVec4(colors[0]);
+      data[0] = c0.r;
+      data[1] = c0.g;
+      data[2] = c0.b;
+      data[3] = c0.a;
+    }
+
+    // color1 (indices 4-7)
+    if (colors[1] !== undefined) {
+      const c1 = colorToVec4(colors[1]);
+      data[4] = c1.r;
+      data[5] = c1.g;
+      data[6] = c1.b;
+      data[7] = c1.a;
+    }
+
+    // speed
+    data[IDX_SPEED] = speed;
+
+    // params (indices 9-16)
+    for (let i = 0; i < 8; i++) {
+      data[IDX_PARAMS + i] = params[i] ?? 0;
+    }
+
+    // alive
+    data[IDX_ALIVE] = 1;
+    propsSync.setBlocking(() => data);
+  }, [colors, speed, params, propsSync]);
+
+  // Signal cleanup on unmount
+  useEffect(() => {
+    return () => {
+      propsSync.setBlocking(prev => {
+        prev[IDX_ALIVE] = 0;
+        return prev;
+      });
+    };
+  }, [propsSync]);
+
+  // Start render loop when GPU resources are ready
+  useEffect(() => {
+    if (!resources) {
+      return;
+    }
+    const {
+      device,
+      context,
+      presentationFormat
+    } = resources;
+    const dpr = PixelRatio.get();
+
+    // Per-run cancellation token. On Fast Refresh / dep change / unmount, React
+    // runs this effect's cleanup, which flips the flag and stops *this* loop —
+    // otherwise the old worklet RAF loop keeps running forever alongside the new
+    // one, stacking a duplicate render loop on every Metro reload.
+    const cancelled = createSynchronizable(new Float64Array(1));
+    scheduleOnRuntime(runtime, () => {
+      'worklet';
+
+      // Create pipeline once
+      const pipeline = device.createRenderPipeline({
+        layout: 'auto',
+        vertex: {
+          module: device.createShaderModule({
+            code: TRIANGLE_VERTEX_SHADER
+          }),
+          entryPoint: 'main'
+        },
+        fragment: {
+          module: device.createShaderModule({
+            code: fragmentShader
+          }),
+          entryPoint: 'main',
+          targets: [{
+            format: presentationFormat
+          }]
+        },
+        primitive: {
+          topology: 'triangle-list'
+        }
+      });
+
+      // Create uniform buffer + bind group once, reuse via writeBuffer
+      const uniformBuffer = device.createBuffer({
+        size: UNIFORM_BUFFER_SIZE,
+        usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST
+      });
+      const bindGroup = device.createBindGroup({
+        layout: pipeline.getBindGroupLayout(0),
+        entries: [{
+          binding: 0,
+          resource: {
+            buffer: uniformBuffer
+          }
+        }]
+      });
+      const uniformData = new Float32Array(UNIFORM_FLOAT_COUNT);
+      let accumulatedTime = 0;
+      let lastTimestamp = 0;
+      function render(timestamp) {
+        const props = propsSync.getDirty();
+        if (props[IDX_ALIVE] === 0) {
+          return;
+        }
+
+        // This loop was superseded (Fast Refresh / unmount) — bail without
+        // scheduling another frame so it can be garbage-collected.
+        if (cancelled.getDirty()[0] === 1) {
+          return;
+        }
+
+        // Compute dt
+        const dt = lastTimestamp === 0 ? 0 : (timestamp - lastTimestamp) / 1000;
+        lastTimestamp = timestamp;
+
+        // Accumulate time with speed
+        const currentSpeed = props[IDX_SPEED];
+        accumulatedTime += dt * currentSpeed;
+
+        // Resolution
+        const canvas = context.canvas;
+        const width = canvas.width || 1;
+        const height = canvas.height || 1;
+        const aspect = width / height;
+
+        // Fill uniform data (7 × vec4 = 28 floats)
+        // resolution: vec4<f32>
+        uniformData[0] = width;
+        uniformData[1] = height;
+        uniformData[2] = aspect;
+        uniformData[3] = dpr;
+
+        // time: vec4<f32>
+        uniformData[4] = accumulatedTime;
+        uniformData[5] = dt;
+        uniformData[6] = 0;
+        uniformData[7] = 0;
+
+        // color0: vec4<f32>
+        uniformData[8] = props[0];
+        uniformData[9] = props[1];
+        uniformData[10] = props[2];
+        uniformData[11] = props[3];
+
+        // color1: vec4<f32>
+        uniformData[12] = props[4];
+        uniformData[13] = props[5];
+        uniformData[14] = props[6];
+        uniformData[15] = props[7];
+
+        // params0: vec4<f32>
+        uniformData[16] = props[IDX_PARAMS];
+        uniformData[17] = props[IDX_PARAMS + 1];
+        uniformData[18] = props[IDX_PARAMS + 2];
+        uniformData[19] = props[IDX_PARAMS + 3];
+
+        // params1: vec4<f32> — static params[4..7]
+        uniformData[20] = props[IDX_PARAMS + 4];
+        uniformData[21] = props[IDX_PARAMS + 5];
+        uniformData[22] = props[IDX_PARAMS + 6];
+        uniformData[23] = props[IDX_PARAMS + 7];
+
+        // live: vec4<f32> — off-thread input (touch/scroll/audio) from
+        // paramsSynchronizable, written into its own slot so it never collides
+        // with the static params. Stays (0,0,0,0) when no channel is attached.
+        if (paramsSynchronizable) {
+          const live = paramsSynchronizable.getDirty();
+          uniformData[24] = live[0];
+          uniformData[25] = live[1];
+          uniformData[26] = live[2];
+          uniformData[27] = live[3];
+        }
+        device.queue.writeBuffer(uniformBuffer, 0, uniformData);
+        const commandEncoder = device.createCommandEncoder();
+        const textureView = context.getCurrentTexture().createView();
+        const passEncoder = commandEncoder.beginRenderPass({
+          colorAttachments: [{
+            view: textureView,
+            clearValue: transparent ? [0, 0, 0, 0] : [0, 0, 0, 1],
+            loadOp: 'clear',
+            storeOp: 'store'
+          }]
+        });
+        passEncoder.setPipeline(pipeline);
+        passEncoder.setBindGroup(0, bindGroup);
+        passEncoder.draw(3);
+        passEncoder.end();
+        device.queue.submit([commandEncoder.finish()]);
+        context.present();
+        if (!isStatic) {
+          requestAnimationFrame(render);
+        }
+      }
+      requestAnimationFrame(render);
+    });
+    return () => {
+      cancelled.setBlocking(() => Float64Array.of(1));
+    };
+  }, [resources, runtime, propsSync, paramsSynchronizable, fragmentShader, isStatic, transparent]);
+  return /*#__PURE__*/_jsx(Canvas, {
+    ref: canvasRef,
+    style: [styles.canvas, style],
+    ...viewProps
+  });
+}
+const styles = StyleSheet.create({
+  canvas: {
+    flex: 1
+  }
+});
+//# sourceMappingURL=index.js.map

package/lib/module/components/ShaderView/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PixelRatio","StyleSheet","Canvas","useEffect","useRef","createSynchronizable","scheduleOnRuntime","colorToVec4","useWGPUSetup","TRIANGLE_VERTEX_SHADER","UNIFORM_BUFFER_SIZE","UNIFORM_FLOAT_COUNT","jsx","_jsx","SYNC_SIZE","IDX_SPEED","IDX_PARAMS","IDX_ALIVE","ShaderView","fragmentShader","colors","speed","params","isStatic","transparent","paramsSynchronizable","style","viewProps","canvasRef","runtime","resources","propsSync","Float64Array","current","data","undefined","c0","r","g","b","a","c1","i","setBlocking","prev","device","context","presentationFormat","dpr","get","cancelled","pipeline","createRenderPipeline","layout","vertex","module","createShaderModule","code","entryPoint","fragment","targets","format","primitive","topology","uniformBuffer","createBuffer","size","usage","GPUBufferUsage","UNIFORM","COPY_DST","bindGroup","createBindGroup","getBindGroupLayout","entries","binding","resource","buffer","uniformData","Float32Array","accumulatedTime","lastTimestamp","render","timestamp","props","getDirty","dt","currentSpeed","canvas","width","height","aspect","live","queue","writeBuffer","commandEncoder","createCommandEncoder","textureView","getCurrentTexture","createView","passEncoder","beginRenderPass","colorAttachments","view","clearValue","loadOp","storeOp","setPipeline","setBindGroup","draw","end","submit","finish","present","requestAnimationFrame","of","ref","styles","create","flex"],"sourceRoot":"../../../../src","sources":["components/ShaderView/index.tsx"],"mappings":";;AAAA,SAASA,UAAU,EAAEC,UAAU,QAAQ,cAAc;AACrD,SAASC,MAAM,QAAQ,qBAAqB;AAC5C,SAASC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AACzC,SAASC,oBAAoB,EAAEC,iBAAiB,QAAQ,uBAAuB;AAC/E,SAASC,WAAW,QAAQ,uBAAoB;AAChD,SAASC,YAAY,QAAQ,6BAA0B;AACvD,SAASC,sBAAsB,QAAQ,yCAAsC;AAC7E,SACEC,mBAAmB,EACnBC,mBAAmB,QACd,2BAAwB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGhC;AACA;AACA,MAAMC,SAAS,GAAG,EAAE;AACpB,MAAMC,SAAS,GAAG,CAAC;AACnB,MAAMC,UAAU,GAAG,CAAC,CAAC,CAAC;AACtB,MAAMC,SAAS,GAAG,EAAE;AAEpB,eAAe,SAASC,UAAUA,CAAC;EACjCC,cAAc;EACdC,MAAM,GAAG,EAAE;EACXC,KAAK,GAAG,GAAG;EACXC,MAAM,GAAG,EAAE;EACXC,QAAQ,GAAG,KAAK;EAChBC,WAAW,GAAG,KAAK;EACnBC,oBAAoB;EACpBC,KAAK;EACL,GAAGC;AACY,CAAC,EAAE;EAClB,MAAM;IAAEC,SAAS;IAAEC,OAAO;IAAEC;EAAU,CAAC,GAAGtB,YAAY,CAAC,CAAC;EAExD,MAAMuB,SAAS,GAAG3B,MAAM,CACtBC,oBAAoB,CAAe,IAAI2B,YAAY,CAAClB,SAAS,CAAC,CAChE,CAAC,CAACmB,OAAO;;EAET;EACA9B,SAAS,CAAC,MAAM;IACd,MAAM+B,IAAI,GAAG,IAAIF,YAAY,CAAClB,SAAS,CAAC;;IAExC;IACA,IAAIM,MAAM,CAAC,CAAC,CAAC,KAAKe,SAAS,EAAE;MAC3B,MAAMC,EAAE,GAAG7B,WAAW,CAACa,MAAM,CAAC,CAAC,CAAC,CAAC;MACjCc,IAAI,CAAC,CAAC,CAAC,GAAGE,EAAE,CAACC,CAAC;MACdH,IAAI,CAAC,CAAC,CAAC,GAAGE,EAAE,CAACE,CAAC;MACdJ,IAAI,CAAC,CAAC,CAAC,GAAGE,EAAE,CAACG,CAAC;MACdL,IAAI,CAAC,CAAC,CAAC,GAAGE,EAAE,CAACI,CAAC;IAChB;;IAEA;IACA,IAAIpB,MAAM,CAAC,CAAC,CAAC,KAAKe,SAAS,EAAE;MAC3B,MAAMM,EAAE,GAAGlC,WAAW,CAACa,MAAM,CAAC,CAAC,CAAC,CAAC;MACjCc,IAAI,CAAC,CAAC,CAAC,GAAGO,EAAE,CAACJ,CAAC;MACdH,IAAI,CAAC,CAAC,CAAC,GAAGO,EAAE,CAACH,CAAC;MACdJ,IAAI,CAAC,CAAC,CAAC,GAAGO,EAAE,CAACF,CAAC;MACdL,IAAI,CAAC,CAAC,CAAC,GAAGO,EAAE,CAACD,CAAC;IAChB;;IAEA;IACAN,IAAI,CAACnB,SAAS,CAAC,GAAGM,KAAK;;IAEvB;IACA,KAAK,IAAIqB,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAG,CAAC,EAAEA,CAAC,EAAE,EAAE;MAC1BR,IAAI,CAAClB,UAAU,GAAG0B,CAAC,CAAC,GAAGpB,MAAM,CAACoB,CAAC,CAAC,IAAI,CAAC;IACvC;;IAEA;IACAR,IAAI,CAACjB,SAAS,CAAC,GAAG,CAAC;IAEnBc,SAAS,CAACY,WAAW,CAAC,MAAMT,IAAI,CAAC;EACnC,CAAC,EAAE,CAACd,MAAM,EAAEC,KAAK,EAAEC,MAAM,EAAES,SAAS,CAAC,CAAC;;EAEtC;EACA5B,SAAS,CAAC,MAAM;IACd,OAAO,MAAM;MACX4B,SAAS,CAACY,WAAW,CAAEC,IAAI,IAAK;QAC9BA,IAAI,CAAC3B,SAAS,CAAC,GAAG,CAAC;QACnB,OAAO2B,IAAI;MACb,CAAC,CAAC;IACJ,CAAC;EACH,CAAC,EAAE,CAACb,SAAS,CAAC,CAAC;;EAEf;EACA5B,SAAS,CAAC,MAAM;IACd,IAAI,CAAC2B,SAAS,EAAE;MACd;IACF;IAEA,MAAM;MAAEe,MAAM;MAAEC,OAAO;MAAEC;IAAmB,CAAC,GAAGjB,SAAS;IACzD,MAAMkB,GAAG,GAAGhD,UAAU,CAACiD,GAAG,CAAC,CAAC;;IAE5B;IACA;IACA;IACA;IACA,MAAMC,SAAS,GAAG7C,oBAAoB,CAAe,IAAI2B,YAAY,CAAC,CAAC,CAAC,CAAC;IAEzE1B,iBAAiB,CAACuB,OAAO,EAAE,MAAM;MAC/B,SAAS;;MAET;MACA,MAAMsB,QAAQ,GAAGN,MAAM,CAACO,oBAAoB,CAAC;QAC3CC,MAAM,EAAE,MAAM;QACdC,MAAM,EAAE;UACNC,MAAM,EAAEV,MAAM,CAACW,kBAAkB,CAAC;YAAEC,IAAI,EAAEhD;UAAuB,CAAC,CAAC;UACnEiD,UAAU,EAAE;QACd,CAAC;QACDC,QAAQ,EAAE;UACRJ,MAAM,EAAEV,MAAM,CAACW,kBAAkB,CAAC;YAAEC,IAAI,EAAEtC;UAAe,CAAC,CAAC;UAC3DuC,UAAU,EAAE,MAAM;UAClBE,OAAO,EAAE,CAAC;YAAEC,MAAM,EAAEd;UAAmB,CAAC;QAC1C,CAAC;QACDe,SAAS,EAAE;UAAEC,QAAQ,EAAE;QAAgB;MACzC,CAAC,CAAC;;MAEF;MACA,MAAMC,aAAa,GAAGnB,MAAM,CAACoB,YAAY,CAAC;QACxCC,IAAI,EAAExD,mBAAmB;QACzByD,KAAK,EAAEC,cAAc,CAACC,OAAO,GAAGD,cAAc,CAACE;MACjD,CAAC,CAAC;MAEF,MAAMC,SAAS,GAAG1B,MAAM,CAAC2B,eAAe,CAAC;QACvCnB,MAAM,EAAEF,QAAQ,CAACsB,kBAAkB,CAAC,CAAC,CAAC;QACtCC,OAAO,EAAE,CAAC;UAAEC,OAAO,EAAE,CAAC;UAAEC,QAAQ,EAAE;YAAEC,MAAM,EAAEb;UAAc;QAAE,CAAC;MAC/D,CAAC,CAAC;MAEF,MAAMc,WAAW,GAAG,IAAIC,YAAY,CAACpE,mBAAmB,CAAC;MACzD,IAAIqE,eAAe,GAAG,CAAC;MACvB,IAAIC,aAAa,GAAG,CAAC;MAErB,SAASC,MAAMA,CAACC,SAAiB,EAAE;QACjC,MAAMC,KAAK,GAAGrD,SAAS,CAACsD,QAAQ,CAAC,CAAC;QAClC,IAAID,KAAK,CAACnE,SAAS,CAAC,KAAK,CAAC,EAAE;UAC1B;QACF;;QAEA;QACA;QACA,IAAIiC,SAAS,CAACmC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE;UACjC;QACF;;QAEA;QACA,MAAMC,EAAE,GAAGL,aAAa,KAAK,CAAC,GAAG,CAAC,GAAG,CAACE,SAAS,GAAGF,aAAa,IAAI,IAAI;QACvEA,aAAa,GAAGE,SAAS;;QAEzB;QACA,MAAMI,YAAY,GAAGH,KAAK,CAACrE,SAAS,CAAE;QACtCiE,eAAe,IAAIM,EAAE,GAAGC,YAAY;;QAEpC;QACA,MAAMC,MAAM,GAAG1C,OAAO,CAAC0C,MAGtB;QACD,MAAMC,KAAK,GAAGD,MAAM,CAACC,KAAK,IAAI,CAAC;QAC/B,MAAMC,MAAM,GAAGF,MAAM,CAACE,MAAM,IAAI,CAAC;QACjC,MAAMC,MAAM,GAAGF,KAAK,GAAGC,MAAM;;QAE7B;QACA;QACAZ,WAAW,CAAC,CAAC,CAAC,GAAGW,KAAK;QACtBX,WAAW,CAAC,CAAC,CAAC,GAAGY,MAAM;QACvBZ,WAAW,CAAC,CAAC,CAAC,GAAGa,MAAM;QACvBb,WAAW,CAAC,CAAC,CAAC,GAAG9B,GAAG;;QAEpB;QACA8B,WAAW,CAAC,CAAC,CAAC,GAAGE,eAAe;QAChCF,WAAW,CAAC,CAAC,CAAC,GAAGQ,EAAE;QACnBR,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC;QAClBA,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC;;QAElB;QACAA,WAAW,CAAC,CAAC,CAAC,GAAGM,KAAK,CAAC,CAAC,CAAE;QAC1BN,WAAW,CAAC,CAAC,CAAC,GAAGM,KAAK,CAAC,CAAC,CAAE;QAC1BN,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAAC,CAAC,CAAE;QAC3BN,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAAC,CAAC,CAAE;;QAE3B;QACAN,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAAC,CAAC,CAAE;QAC3BN,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAAC,CAAC,CAAE;QAC3BN,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAAC,CAAC,CAAE;QAC3BN,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAAC,CAAC,CAAE;;QAE3B;QACAN,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAACpE,UAAU,CAAE;QACpC8D,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAACpE,UAAU,GAAG,CAAC,CAAE;QACxC8D,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAACpE,UAAU,GAAG,CAAC,CAAE;QACxC8D,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAACpE,UAAU,GAAG,CAAC,CAAE;;QAExC;QACA8D,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAACpE,UAAU,GAAG,CAAC,CAAE;QACxC8D,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAACpE,UAAU,GAAG,CAAC,CAAE;QACxC8D,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAACpE,UAAU,GAAG,CAAC,CAAE;QACxC8D,WAAW,CAAC,EAAE,CAAC,GAAGM,KAAK,CAACpE,UAAU,GAAG,CAAC,CAAE;;QAExC;QACA;QACA;QACA,IAAIS,oBAAoB,EAAE;UACxB,MAAMmE,IAAI,GAAGnE,oBAAoB,CAAC4D,QAAQ,CAAC,CAAC;UAC5CP,WAAW,CAAC,EAAE,CAAC,GAAGc,IAAI,CAAC,CAAC,CAAE;UAC1Bd,WAAW,CAAC,EAAE,CAAC,GAAGc,IAAI,CAAC,CAAC,CAAE;UAC1Bd,WAAW,CAAC,EAAE,CAAC,GAAGc,IAAI,CAAC,CAAC,CAAE;UAC1Bd,WAAW,CAAC,EAAE,CAAC,GAAGc,IAAI,CAAC,CAAC,CAAE;QAC5B;QAEA/C,MAAM,CAACgD,KAAK,CAACC,WAAW,CAAC9B,aAAa,EAAE,CAAC,EAAEc,WAAW,CAAC;QAEvD,MAAMiB,cAAc,GAAGlD,MAAM,CAACmD,oBAAoB,CAAC,CAAC;QACpD,MAAMC,WAAW,GAAGnD,OAAO,CAACoD,iBAAiB,CAAC,CAAC,CAACC,UAAU,CAAC,CAAC;QAC5D,MAAMC,WAAW,GAAGL,cAAc,CAACM,eAAe,CAAC;UACjDC,gBAAgB,EAAE,CAChB;YACEC,IAAI,EAAEN,WAAW;YACjBO,UAAU,EAAEhF,WAAW,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YACrDiF,MAAM,EAAE,OAAO;YACfC,OAAO,EAAE;UACX,CAAC;QAEL,CAAC,CAAC;QAEFN,WAAW,CAACO,WAAW,CAACxD,QAAQ,CAAC;QACjCiD,WAAW,CAACQ,YAAY,CAAC,CAAC,EAAErC,SAAS,CAAC;QACtC6B,WAAW,CAACS,IAAI,CAAC,CAAC,CAAC;QACnBT,WAAW,CAACU,GAAG,CAAC,CAAC;QAEjBjE,MAAM,CAACgD,KAAK,CAACkB,MAAM,CAAC,CAAChB,cAAc,CAACiB,MAAM,CAAC,CAAC,CAAC,CAAC;QAC9ClE,OAAO,CAACmE,OAAO,CAAC,CAAC;QAEjB,IAAI,CAAC1F,QAAQ,EAAE;UACb2F,qBAAqB,CAAChC,MAAM,CAAC;QAC/B;MACF;MAEAgC,qBAAqB,CAAChC,MAAM,CAAC;IAC/B,CAAC,CAAC;IAEF,OAAO,MAAM;MACXhC,SAAS,CAACP,WAAW,CAAC,MAAMX,YAAY,CAACmF,EAAE,CAAC,CAAC,CAAC,CAAC;IACjD,CAAC;EACH,CAAC,EAAE,CACDrF,SAAS,EACTD,OAAO,EACPE,SAAS,EACTN,oBAAoB,EACpBN,cAAc,EACdI,QAAQ,EACRC,WAAW,CACZ,CAAC;EAEF,oBACEX,IAAA,CAACX,MAAM;IAACkH,GAAG,EAAExF,SAAU;IAACF,KAAK,EAAE,CAAC2F,MAAM,CAAC7B,MAAM,EAAE9D,KAAK,CAAE;IAAA,GAAKC;EAAS,CAAG,CAAC;AAE5E;AAEA,MAAM0F,MAAM,GAAGpH,UAAU,CAACqH,MAAM,CAAC;EAC/B9B,MAAM,EAAE;IACN+B,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}

package/lib/module/components/ShaderView/types.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=types.js.map

package/lib/module/components/ShaderView/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/ShaderView/types.ts"],"mappings":"","ignoreList":[]}

package/lib/module/components/ShaderViewWithPanGesture/index.js

@@ -0,0 +1,196 @@
+"use strict";
+
+import { useCallback, useRef } from 'react';
+import { StyleSheet, View } from 'react-native';
+import { Gesture, GestureDetector } from 'react-native-gesture-handler';
+import { createSynchronizable } from 'react-native-worklets';
+import ShaderView from "../ShaderView/index.js";
+import { useParamsSynchronizable } from "../../hooks/useParamsSynchronizable.js";
+
+/**
+ * A {@link ShaderView} that feeds touch input into the shader's `u.live`:
+ *
+ *   - `live.x` → pointer X, normalized 0..1 (left → right)
+ *   - `live.y` → pointer Y, normalized 0..1 (bottom → top, matching UV space)
+ *   - `live.z` → 1.0 while touching, 0.0 when released
+ *   - `live.w` → 0.0 (reserved)
+ *
+ * Dragging moves the pointer **relatively** — it pushes from where the pointer
+ * already is rather than jumping under the finger — and a fling lets it glide to
+ * a stop. The position is **remembered**: it stays wherever it ended and is
+ * never reset; only the "touched" flag (`live.z`) toggles on release. A
+ * shader can read `live.xy` as a stable resting position and use `live.z`
+ * purely for touch-driven emphasis, so the effect never snaps back.
+ *
+ * The resting value before the first touch is `[0, 0, 0, 0]` by default; pass
+ * `initialParamsSynchronizable` to seed it — e.g. `[0.5, 0.5, 0, 0]` to start a
+ * pointer at screen center.
+ *
+ * The drag runs as a **worklet on the UI thread** and writes the synchronizable
+ * directly, so pointer updates never hop to the JS thread — matching the rest of
+ * the library, which renders off the JS thread. The render runtime reads the
+ * same synchronizable each frame.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function ShaderViewWithPanGesture({
+  style,
+  initialParamsSynchronizable = [0, 0, 0, 0],
+  ...props
+}) {
+  const {
+    paramsSynchronizable
+  } = useParamsSynchronizable(initialParamsSynchronizable);
+
+  // View size, read inside the gesture worklets to normalize pointer coords.
+  const sizeRef = useRef(null);
+  if (sizeRef.current === null) {
+    sizeRef.current = createSynchronizable(Float64Array.of(1, 1));
+  }
+  const sizeSynchronizable = sizeRef.current;
+
+  // Generation of the current post-release glide; bumped to cancel an old one.
+  const momentumRef = useRef(null);
+  if (momentumRef.current === null) {
+    momentumRef.current = createSynchronizable(Float64Array.of(0));
+  }
+  const momentumSynchronizable = momentumRef.current;
+
+  // Pointer position when the current drag began — the pan moves the pointer
+  // relative to this, so a drag pushes from where it was rather than jumping.
+  const panStartRef = useRef(null);
+  if (panStartRef.current === null) {
+    panStartRef.current = createSynchronizable(Float64Array.of(0, 0));
+  }
+  const panStartSynchronizable = panStartRef.current;
+  const onLayout = useCallback(e => {
+    const {
+      width,
+      height
+    } = e.nativeEvent.layout;
+    sizeSynchronizable.setBlocking(() => Float64Array.of(width || 1, height || 1));
+  }, [sizeSynchronizable]);
+
+  // Worklet: runs on the UI thread and writes the normalized pointer straight
+  // into the synchronizable the render runtime reads, so a pointer move never
+  // touches the JS thread.
+  const writePointer = (nx, ny, active) => {
+    'worklet';
+
+    const x = Math.min(1, Math.max(0, nx));
+    const y = Math.min(1, Math.max(0, ny));
+    paramsSynchronizable.setBlocking(() => Float64Array.of(x, y, active, 0));
+  };
+  const stopMomentum = () => {
+    'worklet';
+
+    const next = (momentumSynchronizable.getDirty()[0] || 0) + 1;
+    momentumSynchronizable.setBlocking(() => Float64Array.of(next));
+  };
+
+  // Drop the touched flag in place — safety net for a gesture cancelled with no
+  // onEnd, so the flag never sticks.
+  const releaseFlag = () => {
+    'worklet';
+
+    const p = paramsSynchronizable.getDirty();
+    const x = p[0] || 0;
+    const y = p[1] || 0;
+    paramsSynchronizable.setBlocking(() => Float64Array.of(x, y, 0, 0));
+  };
+
+  // After release, drift from the last position along the fling velocity and
+  // decay to a stop — a little inertia. Runs on the UI thread via rAF, like the
+  // render loop, writing each frame into the same synchronizable.
+  const startMomentum = (velX, velY) => {
+    'worklet';
+
+    const s = sizeSynchronizable.getDirty();
+    const w = s[0] || 1;
+    const h = s[1] || 1;
+
+    // Flick speed in normalized units/sec, scaled to a subtle glide (Y flipped).
+    const SCALE = 0.12;
+    let vx = velX / w * SCALE;
+    let vy = -velY / h * SCALE;
+    const p = paramsSynchronizable.getDirty();
+    let x = p[0] || 0;
+    let y = p[1] || 0;
+
+    // Claim this glide; a newer one bumps the generation and this loop bails.
+    const gen = (momentumSynchronizable.getDirty()[0] || 0) + 1;
+    momentumSynchronizable.setBlocking(() => Float64Array.of(gen));
+    const FRICTION = 2; // 1/s — higher stops sooner
+    let last = -1;
+
+    // Plain closure (no 'worklet') so its accumulators and self-reference
+    // survive across frames; a serialized worklet would snapshot them by value.
+    const step = now => {
+      if ((momentumSynchronizable.getDirty()[0] || 0) !== gen) {
+        return;
+      }
+      const dt = last < 0 ? 0 : (now - last) / 1000;
+      last = now;
+      x = Math.min(1, Math.max(0, x + vx * dt));
+      y = Math.min(1, Math.max(0, y + vy * dt));
+      const decay = Math.exp(-FRICTION * dt);
+      vx = vx * decay;
+      vy = vy * decay;
+      paramsSynchronizable.setBlocking(() => Float64Array.of(x, y, 0, 0));
+      if (Math.abs(vx) + Math.abs(vy) > 0.0008) {
+        requestAnimationFrame(step);
+      }
+    };
+    requestAnimationFrame(step);
+  };
+
+  // Drag moves the pointer *relatively*: grab anywhere and push it from where it
+  // is, rather than snapping it under the finger. A plain tap leaves it put.
+  const pan = Gesture.Pan().onBegin(() => {
+    'worklet';
+
+    stopMomentum();
+    const p = paramsSynchronizable.getDirty();
+    const sx = p[0] || 0;
+    const sy = p[1] || 0;
+    panStartSynchronizable.setBlocking(() => Float64Array.of(sx, sy));
+    writePointer(sx, sy, 1);
+  }).onUpdate(e => {
+    'worklet';
+
+    const s = sizeSynchronizable.getDirty();
+    const w = s[0] || 1;
+    const h = s[1] || 1;
+    const start = panStartSynchronizable.getDirty();
+    // Add the drag delta; Y is flipped to match the shader's UV space.
+    writePointer((start[0] || 0) + e.translationX / w, (start[1] || 0) - e.translationY / h, 1);
+  }).onEnd(e => {
+    'worklet';
+
+    const p = paramsSynchronizable.getDirty();
+    writePointer(p[0] || 0, p[1] || 0, 0);
+    startMomentum(e.velocityX, e.velocityY);
+  }).onFinalize(() => {
+    'worklet';
+
+    releaseFlag();
+  });
+  return /*#__PURE__*/_jsx(GestureDetector, {
+    gesture: pan,
+    children: /*#__PURE__*/_jsx(View, {
+      style: [styles.fill, style],
+      onLayout: onLayout,
+      collapsable: false,
+      children: /*#__PURE__*/_jsx(ShaderView, {
+        ...props,
+        paramsSynchronizable: paramsSynchronizable,
+        style: StyleSheet.absoluteFill
+      })
+    })
+  });
+}
+const styles = StyleSheet.create({
+  fill: {
+    flex: 1
+  }
+});
+//# sourceMappingURL=index.js.map

package/lib/module/components/ShaderViewWithPanGesture/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useRef","StyleSheet","View","Gesture","GestureDetector","createSynchronizable","ShaderView","useParamsSynchronizable","jsx","_jsx","ShaderViewWithPanGesture","style","initialParamsSynchronizable","props","paramsSynchronizable","sizeRef","current","Float64Array","of","sizeSynchronizable","momentumRef","momentumSynchronizable","panStartRef","panStartSynchronizable","onLayout","e","width","height","nativeEvent","layout","setBlocking","writePointer","nx","ny","active","x","Math","min","max","y","stopMomentum","next","getDirty","releaseFlag","p","startMomentum","velX","velY","s","w","h","SCALE","vx","vy","gen","FRICTION","last","step","now","dt","decay","exp","abs","requestAnimationFrame","pan","Pan","onBegin","sx","sy","onUpdate","start","translationX","translationY","onEnd","velocityX","velocityY","onFinalize","gesture","children","styles","fill","collapsable","absoluteFill","create","flex"],"sourceRoot":"../../../../src","sources":["components/ShaderViewWithPanGesture/index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/Silk.js

@@ -0,0 +1,83 @@
+"use strict";
+
+import { useMemo } from 'react';
+import ShaderView from "./ShaderView/index.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function Silk({
+  color = '#7B7481',
+  speed = 1.0,
+  scale = 1.0,
+  rotation = 0.0,
+  noiseIntensity = 1.5,
+  ...viewProps
+}) {
+  const colors = useMemo(() => [color], [color]);
+  const params = useMemo(() => [scale, rotation, noiseIntensity], [scale, rotation, noiseIntensity]);
+  return /*#__PURE__*/_jsx(ShaderView, {
+    fragmentShader: SILK_SHADER,
+    colors: colors,
+    params: params,
+    speed: speed,
+    isStatic: false,
+    ...viewProps
+  });
+}
+const SILK_SHADER = /* wgsl */`
+struct Uniforms {
+  resolution: vec4<f32>,
+  time:       vec4<f32>,
+  color0:     vec4<f32>,
+  color1:     vec4<f32>,
+  params0:    vec4<f32>,
+  params1:    vec4<f32>,
+};
+@group(0) @binding(0) var<uniform> u: Uniforms;
+
+const e = 2.71828182845904523536;
+
+fn noise(texCoord: vec2<f32>) -> f32 {
+  let G = e;
+  let r = (G * sin(G * texCoord));
+  return fract(r.x * r.y * (1.0 + texCoord.x));
+}
+
+fn rotateUvs(uv: vec2<f32>, angle: f32) -> vec2<f32> {
+  let c = cos(angle);
+  let s = sin(angle);
+  let rot = mat2x2<f32>(c, -s, s, c);
+  return rot * uv;
+}
+
+@fragment
+fn main(@location(0) ndc: vec2<f32>) -> @location(0) vec4<f32> {
+  let time = u.time.x;
+  let scale = u.params0.x;
+  let rotation = u.params0.y;
+  let noiseIntensity = u.params0.z;
+
+  let resolution2D = u.resolution.xy;
+  let vUv = ndc * 0.5 + vec2<f32>(0.5, 0.5);
+  let fragCoord = vUv * resolution2D;
+
+  let rnd = noise(fragCoord);
+  let uv = rotateUvs(vUv * scale, rotation);
+  var tex = uv * scale;
+  let tOffset = time;
+
+  tex.y = tex.y + 0.03 * sin(8.0 * tex.x - tOffset);
+
+  let pattern = 0.6 +
+                0.4 * sin(5.0 * (tex.x + tex.y +
+                                 cos(3.0 * tex.x + 5.0 * tex.y) +
+                                 0.02 * tOffset) +
+                         sin(20.0 * (tex.x + tex.y - 0.1 * tOffset)));
+
+  var col = u.color0 * vec4<f32>(pattern, pattern, pattern, 1.0) -
+            vec4<f32>(rnd / 15.0 * noiseIntensity, rnd / 15.0 * noiseIntensity,
+                     rnd / 15.0 * noiseIntensity, 0.0);
+  col.a = u.color0.a;
+
+  return clamp(col, vec4<f32>(0.0), vec4<f32>(1.0));
+}
+`;
+//# sourceMappingURL=Silk.js.map

package/lib/module/components/Silk.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useMemo","ShaderView","jsx","_jsx","Silk","color","speed","scale","rotation","noiseIntensity","viewProps","colors","params","fragmentShader","SILK_SHADER","isStatic"],"sourceRoot":"../../../src","sources":["components/Silk.tsx"],"mappings":";;AAAA,SAASA,OAAO,QAAQ,OAAO;AAG/B,OAAOC,UAAU,MAAM,uBAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAetC,eAAe,SAASC,IAAIA,CAAC;EAC3BC,KAAK,GAAG,SAAS;EACjBC,KAAK,GAAG,GAAG;EACXC,KAAK,GAAG,GAAG;EACXC,QAAQ,GAAG,GAAG;EACdC,cAAc,GAAG,GAAG;EACpB,GAAGC;AACE,CAAC,EAAE;EACR,MAAMC,MAAM,GAAGX,OAAO,CAAC,MAAM,CAACK,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAC9C,MAAMO,MAAM,GAAGZ,OAAO,CACpB,MAAM,CAACO,KAAK,EAAEC,QAAQ,EAAEC,cAAc,CAAC,EACvC,CAACF,KAAK,EAAEC,QAAQ,EAAEC,cAAc,CAClC,CAAC;EAED,oBACEN,IAAA,CAACF,UAAU;IACTY,cAAc,EAAEC,WAAY;IAC5BH,MAAM,EAAEA,MAAO;IACfC,MAAM,EAAEA,MAAO;IACfN,KAAK,EAAEA,KAAM;IACbS,QAAQ,EAAE,KAAM;IAAA,GACZL;EAAS,CACd,CAAC;AAEN;AAEA,MAAMI,WAAW,GAAG,UAAW;AAC/B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}