micugl 0.0.9 → 0.0.12

package/dist/types.d.ts

@@ -1,204 +1,164 @@
-export declare interface AttributeConfig {
-    name: string;
-    size: number;
-    type: AttributeType;
-    normalized: boolean;
-    stride: number;
-    offset: number;
-    instanced?: boolean;
-}
-
-export declare type AttributeType = 'FLOAT' | 'BYTE' | 'SHORT' | 'UNSIGNED_BYTE' | 'UNSIGNED_SHORT';
-
-export declare interface BufferData {
-    buffer: WebGLBuffer;
-    data: Float32Array | Uint8Array | Uint16Array | Int8Array | Int16Array;
-}
-
-export declare type Float32Array16 = TypedFloat32Array<16>;
-
-export declare type Float32Array2 = TypedFloat32Array<2>;
-
-export declare type Float32Array3 = TypedFloat32Array<3>;
-
-export declare type Float32Array4 = TypedFloat32Array<4>;
-
-export declare type Float32Array9 = TypedFloat32Array<9>;
-
-export declare interface FramebufferOptions {
-    width: number;
-    height: number;
-    textureCount?: number;
-    textureOptions?: Partial<TextureOptions>;
-}
-
-export declare interface FramebufferResources {
-    framebuffer: WebGLFramebuffer;
-    textures: WebGLTexture[];
-    currentTextureIndex: number;
-    width: number;
-    height: number;
-}
-
-export declare type Mat2 = [
-number,
-number,
-number,
-number
-];
-
-export declare type Mat3 = [
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number
-];
-
-export declare type Mat4 = [
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number,
-number
-];
-
-export declare interface PingPongState {
-    readIndex: number;
-    writeIndex: number;
-    swap: () => void;
-}
-
-export declare interface RenderOptions {
-    clear?: boolean;
-    clearColor?: Vec4;
-}
-
-export declare interface RenderPass {
-    programId: string;
-    inputTextures: TextureBinding[];
-    outputFramebuffer?: string | null;
-    uniforms?: Record<string, {
-        type: UniformType;
-        value: RenderPassUniformValue;
-    }>;
-    renderOptions?: RenderOptions;
-}
-
-export declare type RenderPassUniformUpdateFn = (time: number, width: number, height: number) => UniformTypeMap[UniformType];
-
-export declare type RenderPassUniformValue = UniformTypeMap[UniformType] | RenderPassUniformUpdateFn;
-
-export declare type ShaderAttributeLocations = Record<string, number>;
-
-export declare interface ShaderProgramConfig {
-    vertexShader: string;
-    fragmentShader: string;
-    uniforms: UniformConfig[];
-    attributes?: AttributeConfig[];
-}
-
-export declare type ShaderRenderCallback = (time: number, resources: ShaderResources, gl: WebGLRenderingContext) => void;
-
-export declare interface ShaderResources {
-    program: WebGLProgram;
-    uniforms: ShaderUniformLocations;
-    attributes: ShaderAttributeLocations;
-    buffers: Record<string, BufferData>;
-}
-
-export declare type ShaderUniformLocations = Record<string, WebGLUniformLocation | null>;
-
-export declare interface TextureBinding {
-    id: string;
-    textureUnit: number;
-    bindingType: 'read' | 'write' | 'readwrite';
-}
-
-export declare interface TextureOptions {
-    width: number;
-    height: number;
-    internalFormat?: number;
-    format?: number;
-    type?: number;
-    minFilter?: number;
-    magFilter?: number;
-    wrapS?: number;
-    wrapT?: number;
-    generateMipmap?: boolean;
-}
-
-export declare type TypedFloat32Array<N extends number> = Float32Array & {
-    length: N;
-};
-
-export declare interface UniformConfig {
-    name: string;
-    type: UniformType;
-}
-
-export declare interface UniformParam<T extends UniformType = UniformType> {
-    value: UniformValue<T>;
-    type: T;
-}
-
-export declare type UniformParamMap = {
-    [K in UniformType]: UniformParam<K>;
-};
-
-export declare type UniformType = 'float' | 'vec2' | 'vec3' | 'vec4' | 'mat2' | 'mat3' | 'mat4' | 'int' | 'sampler2D';
-
-export declare interface UniformTypeMap {
-    'float': number;
-    'int': number;
-    'sampler2D': number;
-    'vec2': Float32Array2;
-    'vec3': Float32Array3;
-    'vec4': Float32Array4;
-    'mat2': Float32Array4;
-    'mat3': Float32Array9;
-    'mat4': Float32Array16;
-}
-
-export declare type UniformUpdateFn<T extends UniformType> = (time?: number, width?: number, height?: number) => UniformTypeMap[T];
-
-export declare interface UniformUpdaterDef<T extends UniformType> {
-    name: string;
-    type: T;
-    updateFn: UniformUpdateFn<T>;
-}
-
-export declare type UniformValue<T extends UniformType> = UniformTypeMap[T] | UniformUpdateFn<T>;
-
-export declare type Vec2 = [number, number];
-
-export declare type Vec3 = [number, number, number];
-
-export declare type Vec4 = [number, number, number, number];
-
-export declare type WebGLExtensionName = Extract<keyof WebGLExtensionTypes, string>;
-
-export declare interface WebGLExtensionTypes {
-    'OES_texture_float': OES_texture_float;
-    'OES_texture_float_linear': OES_texture_float_linear;
-    'OES_vertex_array_object': OES_vertex_array_object;
-    'ANGLE_instanced_arrays': ANGLE_instanced_arrays;
-    [key: string]: unknown;
-}
-
-export { }
+export interface BufferData {
+    buffer: WebGLBuffer;
+    data: Float32Array | Uint8Array | Uint16Array | Int8Array | Int16Array;
+}
+export type UniformType = 'float' | 'vec2' | 'vec3' | 'vec4' | 'mat2' | 'mat3' | 'mat4' | 'int' | 'sampler2D';
+export type AttributeType = 'FLOAT' | 'BYTE' | 'SHORT' | 'UNSIGNED_BYTE' | 'UNSIGNED_SHORT';
+export interface RenderOptions {
+    clear?: boolean;
+    clearColor?: Vec4;
+}
+export type ShaderUniformLocations = Record<string, WebGLUniformLocation | null>;
+export type ShaderAttributeLocations = Record<string, number>;
+export interface UniformConfig {
+    name: string;
+    type: UniformType;
+}
+export interface AttributeConfig {
+    name: string;
+    size: number;
+    type: AttributeType;
+    normalized: boolean;
+    stride: number;
+    offset: number;
+    instanced?: boolean;
+}
+export interface ShaderResources {
+    program: WebGLProgram;
+    uniforms: ShaderUniformLocations;
+    attributes: ShaderAttributeLocations;
+    buffers: Record<string, BufferData>;
+}
+export interface ShaderProgramConfig {
+    vertexShader: string;
+    fragmentShader: string;
+    uniforms: UniformConfig[];
+    attributes?: AttributeConfig[];
+}
+export type ShaderRenderCallback = (time: number, resources: ShaderResources, gl: WebGLRenderingContext) => void;
+export interface WebGLExtensionTypes {
+    'OES_texture_float': OES_texture_float;
+    'OES_texture_float_linear': OES_texture_float_linear;
+    'OES_vertex_array_object': OES_vertex_array_object;
+    'ANGLE_instanced_arrays': ANGLE_instanced_arrays;
+    [key: string]: unknown;
+}
+export type WebGLExtensionName = Extract<keyof WebGLExtensionTypes, string>;
+export interface TextureOptions {
+    width: number;
+    height: number;
+    internalFormat?: number;
+    format?: number;
+    type?: number;
+    minFilter?: number;
+    magFilter?: number;
+    wrapS?: number;
+    wrapT?: number;
+    generateMipmap?: boolean;
+}
+export interface FramebufferResources {
+    framebuffer: WebGLFramebuffer;
+    textures: WebGLTexture[];
+    currentTextureIndex: number;
+    width: number;
+    height: number;
+}
+export interface FramebufferOptions {
+    width: number;
+    height: number;
+    textureCount?: number;
+    textureOptions?: Partial<TextureOptions>;
+}
+export interface TextureBinding {
+    id: string;
+    textureUnit: number;
+    bindingType: 'read' | 'write' | 'readwrite';
+}
+export type RenderPassUniformUpdateFn = (time: number, width: number, height: number) => UniformTypeMap[UniformType];
+export type RenderPassUniformValue = UniformTypeMap[UniformType] | RenderPassUniformUpdateFn;
+export interface RenderPass {
+    programId: string;
+    inputTextures: TextureBinding[];
+    outputFramebuffer?: string | null;
+    uniforms?: Record<string, {
+        type: UniformType;
+        value: RenderPassUniformValue;
+    }>;
+    renderOptions?: RenderOptions;
+}
+export interface PingPongState {
+    readIndex: number;
+    writeIndex: number;
+    swap: () => void;
+}
+export interface UniformTypeMap {
+    'float': number;
+    'int': number;
+    'sampler2D': number;
+    'vec2': Float32Array2;
+    'vec3': Float32Array3;
+    'vec4': Float32Array4;
+    'mat2': Float32Array4;
+    'mat3': Float32Array9;
+    'mat4': Float32Array16;
+}
+export type UniformUpdateFn<T extends UniformType> = (time?: number, width?: number, height?: number) => UniformTypeMap[T];
+export type UniformValue<T extends UniformType> = UniformTypeMap[T] | UniformUpdateFn<T>;
+export interface UniformUpdaterDef<T extends UniformType = UniformType> {
+    name: string;
+    type: T;
+    updateFn: UniformUpdateFn<T>;
+}
+export interface UniformParam<T extends UniformType = UniformType> {
+    value: UniformValue<T>;
+    type: T;
+}
+export type UniformParamMap = {
+    [K in UniformType]: UniformParam<K>;
+};
+export type Vec2 = [number, number];
+export type Vec3 = [number, number, number];
+export type Vec4 = [number, number, number, number];
+export type Mat2 = [
+    number,
+    number,
+    number,
+    number
+];
+export type Mat3 = [
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number
+];
+export type Mat4 = [
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number,
+    number
+];
+export type TypedFloat32Array<N extends number> = Float32Array & {
+    length: N;
+};
+export type Float32Array2 = TypedFloat32Array<2>;
+export type Float32Array3 = TypedFloat32Array<3>;
+export type Float32Array4 = TypedFloat32Array<4>;
+export type Float32Array9 = TypedFloat32Array<9>;
+export type Float32Array16 = TypedFloat32Array<16>;

package/package.json

@@ -1,66 +1,26 @@
 {
   "name": "micugl",
-  "version": "0.0.9",
+  "version": "0.0.12",
   "description": "Micu gl - Small React shader library",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
-  "typesVersions": {
-    "*": {
-      "*": [
-        "dist/*"
-      ],
-      "types": [
-        "dist/types.d.ts"
-      ]
-    }
-  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.mjs",
       "require": "./dist/index.js"
     },
-    "./types": {
-      "types": "./dist/types.d.ts",
-      "import": "./dist/types.mjs",
-      "require": "./dist/types.js"
-    },
     "./core": {
       "types": "./dist/core/index.d.ts",
-      "import": "./dist/core/index.mjs",
-      "require": "./dist/core/index.js"
+      "import": "./dist/core.mjs",
+      "require": "./dist/core.js"
     },
     "./react": {
       "types": "./dist/react/index.d.ts",
-      "import": "./dist/react/index.mjs",
-      "require": "./dist/react/index.js"
-    },
-    "./examples": {
-      "types": "./dist/examples/index.d.ts",
-      "import": "./dist/examples/index.mjs",
-      "require": "./dist/examples/index.js"
-    },
-    "./examples/Marble/MarbleScene": {
-      "types": "./dist/examples/Marble/MarbleScene.d.ts",
-      "import": "./dist/examples/Marble/MarbleScene.mjs",
-      "require": "./dist/examples/Marble/MarbleScene.js"
-    },
-    "./examples/Marble/marbleShaders": {
-      "types": "./dist/examples/Marble/marbleShaders.d.ts",
-      "import": "./dist/examples/Marble/marbleShaders.mjs",
-      "require": "./dist/examples/Marble/marbleShaders.js"
-    },
-    "./examples/SimpleRipple/SimpleRippleScene": {
-      "types": "./dist/examples/SimpleRipple/SimpleRippleScene.d.ts",
-      "import": "./dist/examples/SimpleRipple/SimpleRippleScene.mjs",
-      "require": "./dist/examples/SimpleRipple/SimpleRippleScene.js"
-    },
-    "./examples/SimpleRipple/rippleShaders": {
-      "types": "./dist/examples/SimpleRipple/rippleShaders.d.ts",
-      "import": "./dist/examples/SimpleRipple/rippleShaders.mjs",
-      "require": "./dist/examples/SimpleRipple/rippleShaders.js"
+      "import": "./dist/react.mjs",
+      "require": "./dist/react.js"
     }
   },
   "files": [
@@ -73,7 +33,7 @@
     "typecheck": "tsc --noEmit"
   },
   "peerDependencies": {
-    "react": "^18.0.0 || ^19.0.0",
+    "react": "^18.0.0 || ^19.0.0 || ^19.1.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   },
   "devDependencies": {
@@ -81,6 +41,7 @@
     "@types/node": "^22.14.0",
     "@types/react": "^18.0.0 || ^19.0.0",
     "@types/react-dom": "^18.0.0 || ^19.0.0",
+    "ajv": "^8",
     "eslint": "^9.25.0",
     "eslint-plugin-react-dom": "^1.48.4",
     "eslint-plugin-react-hooks": "^5.2.0",

package/dist/MarbleScene.d.ts

@@ -1,27 +0,0 @@
-import { CSSProperties } from 'react';
-import { JSX } from 'react/jsx-runtime';
-
-declare const Marble: ({ marbleScale, tileScale, turbulence, swirl, veinFrequency, veinWidth, colorStart, colorEnd, veinColor, colorStartDark, colorEndDark, veinColorDark, className, style }: MarbleProps) => JSX.Element;
-export { Marble }
-export default Marble;
-
-export declare interface MarbleProps {
-    marbleScale?: number;
-    tileScale?: number;
-    turbulence?: number;
-    swirl?: number;
-    colorStart?: Vec3;
-    colorEnd?: Vec3;
-    veinColor?: Vec3;
-    colorStartDark?: Vec3;
-    colorEndDark?: Vec3;
-    veinColorDark?: Vec3;
-    veinFrequency?: number;
-    veinWidth?: number;
-    className?: string;
-    style?: CSSProperties;
-}
-
-declare type Vec3 = [number, number, number];
-
-export { }

package/dist/RippleScene.d.ts

@@ -1,20 +0,0 @@
-import { CSSProperties } from 'react';
-import { JSX } from 'react/jsx-runtime';
-
-declare const Ripple: ({ damping, mouseForce, color1, color2, iterations, className, style }: RippleProps) => JSX.Element;
-export { Ripple }
-export default Ripple;
-
-export declare interface RippleProps {
-    damping?: number;
-    mouseForce?: number;
-    color1?: Vec3;
-    color2?: Vec3;
-    iterations?: number;
-    className?: string;
-    style?: CSSProperties;
-}
-
-declare type Vec3 = [number, number, number];
-
-export { }

package/dist/examples/Marble/MarbleScene.d.ts

@@ -1,20 +0,0 @@
-import { CSSProperties } from 'react';
-type Vec3 = [number, number, number];
-export interface MarbleProps {
-    marbleScale?: number;
-    tileScale?: number;
-    turbulence?: number;
-    swirl?: number;
-    colorStart?: Vec3;
-    colorEnd?: Vec3;
-    veinColor?: Vec3;
-    colorStartDark?: Vec3;
-    colorEndDark?: Vec3;
-    veinColorDark?: Vec3;
-    veinFrequency?: number;
-    veinWidth?: number;
-    className?: string;
-    style?: CSSProperties;
-}
-export declare const Marble: ({ marbleScale, tileScale, turbulence, swirl, veinFrequency, veinWidth, colorStart, colorEnd, veinColor, colorStartDark, colorEndDark, veinColorDark, className, style }: MarbleProps) => import("react/jsx-runtime").JSX.Element;
-export default Marble;

package/dist/examples/Marble/MarbleScene.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("react/jsx-runtime"),C=require("../../src/core/lib/createShaderConfig.js"),r=require("../../src/core/lib/vectorUtils.js"),O=require("../../src/react/components/base/BaseShaderComponent.js"),y=require("../../src/react/hooks/useDarkMode.js"),t=require("./marbleShaders.js"),R=[.8,.8,.9],g=[.3,.3,.6],q=[.1,.1,.3],D=[.2,.2,.3],M=[.1,.1,.2],E=[.05,.05,.1],a=({marbleScale:o=3,tileScale:l=1,turbulence:u=.5,swirl:n=6,veinFrequency:c=6,veinWidth:s=2,colorStart:i=R,colorEnd:v=g,veinColor:d=q,colorStartDark:_=D,colorEndDark:f=M,veinColorDark:S=E,className:m="",style:p})=>{const e=y.useDarkMode(),b=C.createShaderConfig({vertexShader:t.marbleVertexShader,fragmentShader:t.marbleFragmentShader,uniformNames:{u_marbleScale:"float",u_tileScale:"float",u_turbulence:"float",u_swirl:"float",u_colorStart:"vec3",u_colorEnd:"vec3",u_veinColor:"vec3",u_veinFrequency:"float",u_veinWidth:"float"}});return h.jsx(O.BaseShaderComponent,{programId:"marble-shader",shaderConfig:b,className:m,style:p,uniforms:{marbleScale:{value:o,type:"float"},tileScale:{value:l,type:"float"},turbulence:{value:u,type:"float"},swirl:{value:n,type:"float"},veinFrequency:{value:c,type:"float"},veinWidth:{value:s,type:"float"},colorStart:{type:"vec3",value:r.vec3(e?_:i)},colorEnd:{type:"vec3",value:r.vec3(e?f:v)},veinColor:{type:"vec3",value:r.vec3(e?S:d)}}})};exports.Marble=a;exports.default=a;

package/dist/examples/Marble/MarbleScene.mjs

@@ -1,71 +0,0 @@
-import { jsx as S } from "react/jsx-runtime";
-import { createShaderConfig as O } from "../../src/core/lib/createShaderConfig.mjs";
-import { vec3 as o } from "../../src/core/lib/vectorUtils.mjs";
-import { BaseShaderComponent as y } from "../../src/react/components/base/BaseShaderComponent.mjs";
-import { useDarkMode as C } from "../../src/react/hooks/useDarkMode.mjs";
-import { marbleVertexShader as R, marbleFragmentShader as h } from "./marbleShaders.mjs";
-const b = [0.8, 0.8, 0.9], D = [0.3, 0.3, 0.6], E = [0.1, 0.1, 0.3], L = [0.2, 0.2, 0.3], g = [0.1, 0.1, 0.2], A = [0.05, 0.05, 0.1], M = ({
-  marbleScale: t = 3,
-  tileScale: r = 1,
-  turbulence: a = 0.5,
-  swirl: l = 6,
-  veinFrequency: n = 6,
-  veinWidth: c = 2,
-  colorStart: u = b,
-  colorEnd: f = D,
-  veinColor: m = E,
-  colorStartDark: i = L,
-  colorEndDark: v = g,
-  veinColorDark: s = A,
-  className: p = "",
-  style: _
-}) => {
-  const e = C(), d = O({
-    vertexShader: R,
-    fragmentShader: h,
-    uniformNames: {
-      u_marbleScale: "float",
-      u_tileScale: "float",
-      u_turbulence: "float",
-      u_swirl: "float",
-      u_colorStart: "vec3",
-      u_colorEnd: "vec3",
-      u_veinColor: "vec3",
-      u_veinFrequency: "float",
-      u_veinWidth: "float"
-    }
-  });
-  return /* @__PURE__ */ S(
-    y,
-    {
-      programId: "marble-shader",
-      shaderConfig: d,
-      className: p,
-      style: _,
-      uniforms: {
-        marbleScale: { value: t, type: "float" },
-        tileScale: { value: r, type: "float" },
-        turbulence: { value: a, type: "float" },
-        swirl: { value: l, type: "float" },
-        veinFrequency: { value: n, type: "float" },
-        veinWidth: { value: c, type: "float" },
-        colorStart: {
-          type: "vec3",
-          value: o(e ? i : u)
-        },
-        colorEnd: {
-          type: "vec3",
-          value: o(e ? v : f)
-        },
-        veinColor: {
-          type: "vec3",
-          value: o(e ? s : m)
-        }
-      }
-    }
-  );
-};
-export {
-  M as Marble,
-  M as default
-};

package/dist/examples/Marble/marbleShaders.d.ts

@@ -1,2 +0,0 @@
-export declare const marbleVertexShader = "\n  attribute vec2 a_position;\n  varying vec2 v_texCoord;\n\n  void main() {\n    gl_Position = vec4(a_position, 0.0, 1.0);\n    v_texCoord = a_position * 0.5 + 0.5;\n  }\n";
-export declare const marbleFragmentShader = "\nprecision highp float;\n  \nuniform vec2 u_resolution;\nuniform float u_time;\nuniform float u_marbleScale;\nuniform float u_turbulence;\nuniform float u_swirl;\nuniform vec3 u_colorStart;\nuniform vec3 u_colorEnd;\nuniform vec3 u_veinColor;\nuniform float u_veinFrequency;\nuniform float u_veinWidth;\nuniform float u_tileScale;\n  \nvarying vec2 v_texCoord;\n  \nfloat hash(float n) {\n  return fract(sin(n) * 43758.5453123);\n}\n  \nfloat hash(vec2 p) {\n  return fract(sin(dot(p, vec2(12.9898, 78.233))) * 43758.5453123);\n}\n  \nfloat noise(vec2 x) {\n  vec2 i = floor(x);\n  vec2 f = fract(x);\n  \n  float a = hash(i);\n  float b = hash(i + vec2(1.0, 0.0));\n  float c = hash(i + vec2(0.0, 1.0));\n  float d = hash(i + vec2(1.0, 1.0));\n  \n  vec2 u = f * f * (3.0 - 2.0 * f);\n  \n  return clamp(mix(mix(a, b, u.x), mix(c, d, u.x), u.y), 0.0, 1.0);\n}\n  \nfloat fbm(vec2 p, int octaves) {\n  float value = 0.0;\n  float amplitude = 0.5;\n  float frequency = 1.0;\n  float maxValue = 0.0;\n  \n  for (int i = 0; i < 10; i++) {\n    if (i >= octaves) break;\n    value += amplitude * noise(p * frequency);\n    maxValue += amplitude;\n    frequency *= 2.0;\n    amplitude *= 0.5;\n  }\n  \n  return value / maxValue;\n}\n  \nvec2 swirl(vec2 p, float strength) {\n  float theta = fbm(p, 3) * strength;\n  float c = cos(theta);\n  float s = sin(theta);\n  return vec2(\n    p.x * c - p.y * s,\n    p.x * s + p.y * c\n  );\n}\n\nvec2 applyTilePixelation(vec2 uv, float tileScale) {\n  vec2 cell = floor(uv * tileScale);\n  float cellHash = (1.3 * fbm(u_time * 0.00002 * vec2(pow(pow(cell.x * cell.y, 2.0), 0.5), 2.0) + cell, 1) + 0.8 * hash(cell)) * 0.5;\n  float hashValue = cellHash * 3.0;\n  float pixelSize = 1.0;\n\n  if (hashValue < 1.0) pixelSize = 32.0;\n    else if (hashValue < 1.3) pixelSize = 16.0;\n    else if (hashValue < 1.8) pixelSize = 64.0;\n    else if (hashValue < 1.85) pixelSize = 16.0;\n    else if (hashValue < 2.2) pixelSize = 64.0;\n    else if (hashValue < 2.3) pixelSize = 16.0;\n    else if (hashValue < 2.6) pixelSize = 32.0;\n    else pixelSize = 128.0;\n\n  return floor(uv * pixelSize) / pixelSize;\n}\n  \nvoid main() {\n  vec2 uv = v_texCoord * 2.0 - 1.0;\n  uv = uv * u_resolution / min(u_resolution.x, u_resolution.y);\n  \n  vec2 pixelatedUv = applyTilePixelation(uv, u_tileScale);\n  \n  float time = u_time * 0.25;\n  \n  vec2 swirlUv = swirl(pixelatedUv + vec2(time * 0.0005, time * 0.00083), max(0.0, min(10.0, u_swirl)));\n  \n  float baseNoise = fbm(swirlUv * max(0.1, u_marbleScale) + vec2(time * 0.1, time * 0.13), 5);\n  \n  float turbulenceAmount = max(0.0, min(1.0, u_turbulence));\n  float turbulence = turbulenceAmount * fbm(swirlUv * max(0.1, u_marbleScale) * 2.0 + vec2(time * -0.15), 2);\n  baseNoise = clamp(baseNoise + turbulence, 0.0, 1.0);\n  \n  float veinFreq = max(0.1, u_veinFrequency);\n  float veinW = max(0.1, min(5.0, u_veinWidth));\n  float veins = abs(sin(baseNoise * veinFreq * 3.14159));\n  veins = pow(veins, veinW);\n  veins = clamp(veins, 0.0, 1.0);\n  \n  vec3 baseColor = mix(u_colorStart, u_colorEnd, baseNoise);\n  \n  vec3 marbleColor = mix(baseColor, u_veinColor, veins);\n  \n  float highlight = pow(fbm(swirlUv * max(0.1, u_marbleScale) * 4.0, 2), 3.0) * 0.2;\n \n  marbleColor = floor(marbleColor * 32.0) / 32.0;\n  marbleColor = mix(marbleColor, u_veinColor, veins * 0.5);\n  marbleColor = marbleColor + 0.0425;\n  marbleColor = clamp(marbleColor, 0.0, 1.0);\n\n  marbleColor = mix(marbleColor, u_veinColor, 0.7);\n  gl_FragColor = vec4(marbleColor, 1.0);\n}\n";