Merge remote-tracking branch 'origin/main' into main

packages/demo/src/components/Shader.jsx

@@ -0,0 +1,30 @@
+import { FragmentShader } from "react-shader-fiber";
+
+import { Input, Main, Output, Uniform } from "@react-shader-fiber/stdlib";
+import ShaderProvider from "../providers/ShaderProvider.jsx";
+
+const Shader = ({ time, coords, color, children }) => {
+  return (
+    <FragmentShader>
+      <Output type={"vec4"} id={"fragColor"} ref={color} />
+
+      <Input ref={coords} type={"vec2"} id={"vCoords"} />
+
+      <Uniform ref={time} id={"u_time"} type={"float"} />
+
+      <Main>
+        <ShaderProvider
+          value={{
+            time: time,
+            color: color,
+            coords: coords,
+          }}
+        >
+          {children}
+        </ShaderProvider>
+      </Main>
+    </FragmentShader>
+  );
+};
+
+export default Shader;

packages/demo/src/providers/ShaderProvider.jsx

@@ -0,0 +1,27 @@
+import { createContext, useContext } from "react";
+
+const ShaderContext = createContext({
+  time: null,
+  coords: null,
+  color: null,
+});
+
+const useTime = () => {
+  return useContext(ShaderContext).time;
+};
+
+const useCoords = () => {
+  return useContext(ShaderContext).coords;
+};
+
+const useColor = () => {
+  return useContext(ShaderContext).color;
+};
+
+const ShaderProvider = ({ value, children }) => {
+  return (
+    <ShaderContext.Provider value={value}>{children}</ShaderContext.Provider>
+  );
+};
+
+export default ShaderProvider;

packages/react-shader-fiber/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "react-shader-fiber",
+  "name": "@react-shader/fiber",
   "private": false,
   "version": "1.1.0",
   "type": "module",
@@ -18,7 +18,7 @@
   "author": "Philip Pavo",
   "dependencies": {
     "@clotur/player": "^0.1.2",
-    "@react-shader-fiber/renderer": "^1.0.12",
+    "@react-shader-fiber/renderer": "^2.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

packages/renderer/README.md

@@ -1,3 +1,5 @@
 # React Shader Fiber Renderer
 
-Custom React Reconciler based on react-reconciler.
+Custom React Renderer based on react-reconciler.
+
+`npm i @react-shader/renderer`