@nice2dev/ui-3d 1.3.14 → 1.3.16

package/dist/esm/material/materialNodeDefinitions.js

@@ -1,1481 +1,1438 @@
-/* ════════════════════════════════════════════════════════════════════════════
-   Material Node Definitions — Built-in Shader Nodes
-   
-   Comprehensive library of 60+ shader nodes:
-   - Input nodes (constants, parameters, textures)
-   - Output nodes (PBR, unlit, custom)
-   - Math operations
-   - Vector operations
-   - Color manipulation
-   - Texture sampling
-   - Procedural generation
-   - Utility functions
-   - Logic/branching
-   ════════════════════════════════════════════════════════════════════════════ */
-/* ═══════════════════════════════════════════════════════════════════════════
-   INPUT NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const inputNodes = [
-    {
-        type: 'constant_float',
-        category: 'input',
-        name: 'Float',
-        description: 'Constant float value',
-        icon: 'number',
-        inputs: [],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'float' }],
-        properties: [
-            { id: 'value', name: 'Value', type: 'float', default: 0, min: -100, max: 100, step: 0.01 },
-        ],
-        shaderFunction: 'float {{nodeId}}_value = {{value}};',
-    },
-    {
-        type: 'constant_vec2',
-        category: 'input',
-        name: 'Vector 2',
-        description: 'Constant 2D vector',
-        icon: 'vector2',
-        inputs: [],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'vec2' }],
-        properties: [
-            { id: 'x', name: 'X', type: 'float', default: 0 },
-            { id: 'y', name: 'Y', type: 'float', default: 0 },
-        ],
-        shaderFunction: 'vec2 {{nodeId}}_value = vec2({{x}}, {{y}});',
-    },
-    {
-        type: 'constant_vec3',
-        category: 'input',
-        name: 'Vector 3',
-        description: 'Constant 3D vector',
-        icon: 'vector3',
-        inputs: [],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'vec3' }],
-        properties: [
-            { id: 'x', name: 'X', type: 'float', default: 0 },
-            { id: 'y', name: 'Y', type: 'float', default: 0 },
-            { id: 'z', name: 'Z', type: 'float', default: 0 },
-        ],
-        shaderFunction: 'vec3 {{nodeId}}_value = vec3({{x}}, {{y}}, {{z}});',
-    },
-    {
-        type: 'constant_vec4',
-        category: 'input',
-        name: 'Vector 4',
-        description: 'Constant 4D vector',
-        icon: 'vector4',
-        inputs: [],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'vec4' }],
-        properties: [
-            { id: 'x', name: 'X', type: 'float', default: 0 },
-            { id: 'y', name: 'Y', type: 'float', default: 0 },
-            { id: 'z', name: 'Z', type: 'float', default: 0 },
-            { id: 'w', name: 'W', type: 'float', default: 1 },
-        ],
-        shaderFunction: 'vec4 {{nodeId}}_value = vec4({{x}}, {{y}}, {{z}}, {{w}});',
-    },
-    {
-        type: 'constant_color',
-        category: 'input',
-        name: 'Color',
-        description: 'Constant color value',
-        icon: 'palette',
-        inputs: [],
-        outputs: [
-            { id: 'rgb', name: 'RGB', direction: 'output', dataType: 'vec3' },
-            { id: 'rgba', name: 'RGBA', direction: 'output', dataType: 'vec4' },
-            { id: 'r', name: 'R', direction: 'output', dataType: 'float' },
-            { id: 'g', name: 'G', direction: 'output', dataType: 'float' },
-            { id: 'b', name: 'B', direction: 'output', dataType: 'float' },
-            { id: 'a', name: 'A', direction: 'output', dataType: 'float' },
-        ],
-        properties: [{ id: 'color', name: 'Color', type: 'color', default: 'var(--nice-bg, #fff)' }],
-        previewable: true,
-    },
-    {
-        type: 'texture_2d',
-        category: 'input',
-        name: 'Texture 2D',
-        description: '2D texture input',
-        icon: 'image',
-        inputs: [],
-        outputs: [{ id: 'texture', name: 'Texture', direction: 'output', dataType: 'texture2d' }],
-        properties: [{ id: 'texture', name: 'Texture', type: 'texture', default: null }],
-    },
-    {
-        type: 'texture_cube',
-        category: 'input',
-        name: 'Cubemap',
-        description: 'Cubemap texture input',
-        icon: 'cube',
-        inputs: [],
-        outputs: [{ id: 'texture', name: 'Texture', direction: 'output', dataType: 'textureCube' }],
-        properties: [{ id: 'texture', name: 'Texture', type: 'texture', default: null }],
-    },
-    {
-        type: 'param_float',
-        category: 'input',
-        name: 'Float Parameter',
-        description: 'Exposed float parameter',
-        icon: 'slider',
-        inputs: [],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'float' }],
-        properties: [
-            { id: 'name', name: 'Name', type: 'string', default: 'myFloat' },
-            { id: 'default', name: 'Default', type: 'float', default: 0 },
-            { id: 'min', name: 'Min', type: 'float', default: 0 },
-            { id: 'max', name: 'Max', type: 'float', default: 1 },
-        ],
-        shaderFunction: 'uniform float {{name}};',
-    },
-    {
-        type: 'param_color',
-        category: 'input',
-        name: 'Color Parameter',
-        description: 'Exposed color parameter',
-        icon: 'palette',
-        inputs: [],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'vec4' }],
-        properties: [
-            { id: 'name', name: 'Name', type: 'string', default: 'myColor' },
-            { id: 'default', name: 'Default', type: 'color', default: 'var(--nice-bg, #fff)' },
-        ],
-        shaderFunction: 'uniform vec4 {{name}};',
-    },
-    {
-        type: 'uv',
-        category: 'input',
-        name: 'UV Coordinates',
-        description: 'Mesh UV coordinates',
-        icon: 'grid',
-        inputs: [],
-        outputs: [
-            { id: 'uv', name: 'UV', direction: 'output', dataType: 'vec2' },
-            { id: 'u', name: 'U', direction: 'output', dataType: 'float' },
-            { id: 'v', name: 'V', direction: 'output', dataType: 'float' },
-        ],
-        properties: [{ id: 'channel', name: 'Channel', type: 'int', default: 0, min: 0, max: 3 }],
-        shaderFunction: 'vec2 {{nodeId}}_uv = vUv{{channel}};',
-    },
-    {
-        type: 'position',
-        category: 'input',
-        name: 'Position',
-        description: 'Vertex position',
-        icon: 'crosshair',
-        inputs: [],
-        outputs: [
-            { id: 'world', name: 'World', direction: 'output', dataType: 'vec3' },
-            { id: 'object', name: 'Object', direction: 'output', dataType: 'vec3' },
-            { id: 'view', name: 'View', direction: 'output', dataType: 'vec3' },
-        ],
-    },
-    {
-        type: 'normal',
-        category: 'input',
-        name: 'Normal',
-        description: 'Surface normal',
-        icon: 'arrow-up',
-        inputs: [],
-        outputs: [
-            { id: 'world', name: 'World', direction: 'output', dataType: 'vec3' },
-            { id: 'object', name: 'Object', direction: 'output', dataType: 'vec3' },
-            { id: 'view', name: 'View', direction: 'output', dataType: 'vec3' },
-            { id: 'tangent', name: 'Tangent', direction: 'output', dataType: 'vec3' },
-            { id: 'bitangent', name: 'Bitangent', direction: 'output', dataType: 'vec3' },
-        ],
-    },
-    {
-        type: 'view_direction',
-        category: 'input',
-        name: 'View Direction',
-        description: 'Camera view direction',
-        icon: 'eye',
-        inputs: [],
-        outputs: [{ id: 'direction', name: 'Direction', direction: 'output', dataType: 'vec3' }],
-    },
-    {
-        type: 'time',
-        category: 'input',
-        name: 'Time',
-        description: 'Shader time values',
-        icon: 'clock',
-        inputs: [],
-        outputs: [
-            { id: 'time', name: 'Time', direction: 'output', dataType: 'float' },
-            { id: 'sin', name: 'Sin Time', direction: 'output', dataType: 'float' },
-            { id: 'cos', name: 'Cos Time', direction: 'output', dataType: 'float' },
-            { id: 'delta', name: 'Delta', direction: 'output', dataType: 'float' },
-        ],
-        shaderFunction: 'float {{nodeId}}_time = uTime;',
-    },
-    {
-        type: 'screen_position',
-        category: 'input',
-        name: 'Screen Position',
-        description: 'Screen-space position',
-        icon: 'monitor',
-        inputs: [],
-        outputs: [
-            { id: 'position', name: 'Position', direction: 'output', dataType: 'vec4' },
-            { id: 'normalized', name: 'Normalized', direction: 'output', dataType: 'vec2' },
-        ],
-    },
+  {
+    type: "constant_float",
+    category: "input",
+    name: "Float",
+    description: "Constant float value",
+    icon: "number",
+    inputs: [],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "float" }],
+    properties: [
+      { id: "value", name: "Value", type: "float", default: 0, min: -100, max: 100, step: 0.01 }
+    ],
+    shaderFunction: "float {{nodeId}}_value = {{value}};"
+  },
+  {
+    type: "constant_vec2",
+    category: "input",
+    name: "Vector 2",
+    description: "Constant 2D vector",
+    icon: "vector2",
+    inputs: [],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "vec2" }],
+    properties: [
+      { id: "x", name: "X", type: "float", default: 0 },
+      { id: "y", name: "Y", type: "float", default: 0 }
+    ],
+    shaderFunction: "vec2 {{nodeId}}_value = vec2({{x}}, {{y}});"
+  },
+  {
+    type: "constant_vec3",
+    category: "input",
+    name: "Vector 3",
+    description: "Constant 3D vector",
+    icon: "vector3",
+    inputs: [],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "vec3" }],
+    properties: [
+      { id: "x", name: "X", type: "float", default: 0 },
+      { id: "y", name: "Y", type: "float", default: 0 },
+      { id: "z", name: "Z", type: "float", default: 0 }
+    ],
+    shaderFunction: "vec3 {{nodeId}}_value = vec3({{x}}, {{y}}, {{z}});"
+  },
+  {
+    type: "constant_vec4",
+    category: "input",
+    name: "Vector 4",
+    description: "Constant 4D vector",
+    icon: "vector4",
+    inputs: [],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "vec4" }],
+    properties: [
+      { id: "x", name: "X", type: "float", default: 0 },
+      { id: "y", name: "Y", type: "float", default: 0 },
+      { id: "z", name: "Z", type: "float", default: 0 },
+      { id: "w", name: "W", type: "float", default: 1 }
+    ],
+    shaderFunction: "vec4 {{nodeId}}_value = vec4({{x}}, {{y}}, {{z}}, {{w}});"
+  },
+  {
+    type: "constant_color",
+    category: "input",
+    name: "Color",
+    description: "Constant color value",
+    icon: "palette",
+    inputs: [],
+    outputs: [
+      { id: "rgb", name: "RGB", direction: "output", dataType: "vec3" },
+      { id: "rgba", name: "RGBA", direction: "output", dataType: "vec4" },
+      { id: "r", name: "R", direction: "output", dataType: "float" },
+      { id: "g", name: "G", direction: "output", dataType: "float" },
+      { id: "b", name: "B", direction: "output", dataType: "float" },
+      { id: "a", name: "A", direction: "output", dataType: "float" }
+    ],
+    properties: [{ id: "color", name: "Color", type: "color", default: "var(--nice-bg, #fff)" }],
+    previewable: true
+  },
+  {
+    type: "texture_2d",
+    category: "input",
+    name: "Texture 2D",
+    description: "2D texture input",
+    icon: "image",
+    inputs: [],
+    outputs: [{ id: "texture", name: "Texture", direction: "output", dataType: "texture2d" }],
+    properties: [{ id: "texture", name: "Texture", type: "texture", default: null }]
+  },
+  {
+    type: "texture_cube",
+    category: "input",
+    name: "Cubemap",
+    description: "Cubemap texture input",
+    icon: "cube",
+    inputs: [],
+    outputs: [{ id: "texture", name: "Texture", direction: "output", dataType: "textureCube" }],
+    properties: [{ id: "texture", name: "Texture", type: "texture", default: null }]
+  },
+  {
+    type: "param_float",
+    category: "input",
+    name: "Float Parameter",
+    description: "Exposed float parameter",
+    icon: "slider",
+    inputs: [],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "float" }],
+    properties: [
+      { id: "name", name: "Name", type: "string", default: "myFloat" },
+      { id: "default", name: "Default", type: "float", default: 0 },
+      { id: "min", name: "Min", type: "float", default: 0 },
+      { id: "max", name: "Max", type: "float", default: 1 }
+    ],
+    shaderFunction: "uniform float {{name}};"
+  },
+  {
+    type: "param_color",
+    category: "input",
+    name: "Color Parameter",
+    description: "Exposed color parameter",
+    icon: "palette",
+    inputs: [],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "vec4" }],
+    properties: [
+      { id: "name", name: "Name", type: "string", default: "myColor" },
+      { id: "default", name: "Default", type: "color", default: "var(--nice-bg, #fff)" }
+    ],
+    shaderFunction: "uniform vec4 {{name}};"
+  },
+  {
+    type: "uv",
+    category: "input",
+    name: "UV Coordinates",
+    description: "Mesh UV coordinates",
+    icon: "grid",
+    inputs: [],
+    outputs: [
+      { id: "uv", name: "UV", direction: "output", dataType: "vec2" },
+      { id: "u", name: "U", direction: "output", dataType: "float" },
+      { id: "v", name: "V", direction: "output", dataType: "float" }
+    ],
+    properties: [{ id: "channel", name: "Channel", type: "int", default: 0, min: 0, max: 3 }],
+    shaderFunction: "vec2 {{nodeId}}_uv = vUv{{channel}};"
+  },
+  {
+    type: "position",
+    category: "input",
+    name: "Position",
+    description: "Vertex position",
+    icon: "crosshair",
+    inputs: [],
+    outputs: [
+      { id: "world", name: "World", direction: "output", dataType: "vec3" },
+      { id: "object", name: "Object", direction: "output", dataType: "vec3" },
+      { id: "view", name: "View", direction: "output", dataType: "vec3" }
+    ]
+  },
+  {
+    type: "normal",
+    category: "input",
+    name: "Normal",
+    description: "Surface normal",
+    icon: "arrow-up",
+    inputs: [],
+    outputs: [
+      { id: "world", name: "World", direction: "output", dataType: "vec3" },
+      { id: "object", name: "Object", direction: "output", dataType: "vec3" },
+      { id: "view", name: "View", direction: "output", dataType: "vec3" },
+      { id: "tangent", name: "Tangent", direction: "output", dataType: "vec3" },
+      { id: "bitangent", name: "Bitangent", direction: "output", dataType: "vec3" }
+    ]
+  },
+  {
+    type: "view_direction",
+    category: "input",
+    name: "View Direction",
+    description: "Camera view direction",
+    icon: "eye",
+    inputs: [],
+    outputs: [{ id: "direction", name: "Direction", direction: "output", dataType: "vec3" }]
+  },
+  {
+    type: "time",
+    category: "input",
+    name: "Time",
+    description: "Shader time values",
+    icon: "clock",
+    inputs: [],
+    outputs: [
+      { id: "time", name: "Time", direction: "output", dataType: "float" },
+      { id: "sin", name: "Sin Time", direction: "output", dataType: "float" },
+      { id: "cos", name: "Cos Time", direction: "output", dataType: "float" },
+      { id: "delta", name: "Delta", direction: "output", dataType: "float" }
+    ],
+    shaderFunction: "float {{nodeId}}_time = uTime;"
+  },
+  {
+    type: "screen_position",
+    category: "input",
+    name: "Screen Position",
+    description: "Screen-space position",
+    icon: "monitor",
+    inputs: [],
+    outputs: [
+      { id: "position", name: "Position", direction: "output", dataType: "vec4" },
+      { id: "normalized", name: "Normalized", direction: "output", dataType: "vec2" }
+    ]
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   OUTPUT NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const outputNodes = [
-    {
-        type: 'output_pbr',
-        category: 'output',
-        name: 'PBR Output',
-        description: 'Physically-based rendering output',
-        icon: 'sphere',
-        color: 'var(--nice-danger, #f44336)',
-        inputs: [
-            {
-                id: 'albedo',
-                name: 'Albedo',
-                direction: 'input',
-                dataType: 'vec3',
-                defaultValue: [1, 1, 1],
-            },
-            {
-                id: 'metallic',
-                name: 'Metallic',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0,
-                min: 0,
-                max: 1,
-            },
-            {
-                id: 'roughness',
-                name: 'Roughness',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0.5,
-                min: 0,
-                max: 1,
-            },
-            { id: 'normal', name: 'Normal', direction: 'input', dataType: 'vec3' },
-            {
-                id: 'ao',
-                name: 'AO',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 1,
-                min: 0,
-                max: 1,
-            },
-            {
-                id: 'emissive',
-                name: 'Emissive',
-                direction: 'input',
-                dataType: 'vec3',
-                defaultValue: [0, 0, 0],
-            },
-            {
-                id: 'alpha',
-                name: 'Alpha',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 1,
-                min: 0,
-                max: 1,
-            },
-        ],
-        outputs: [],
-        previewable: true,
-    },
-    {
-        type: 'output_unlit',
-        category: 'output',
-        name: 'Unlit Output',
-        description: 'Unlit material output',
-        icon: 'sun',
-        color: 'var(--nice-danger, #f44336)',
-        inputs: [
-            { id: 'color', name: 'Color', direction: 'input', dataType: 'vec3', defaultValue: [1, 1, 1] },
-            { id: 'alpha', name: 'Alpha', direction: 'input', dataType: 'float', defaultValue: 1 },
-        ],
-        outputs: [],
-        previewable: true,
-    },
-    {
-        type: 'output_custom',
-        category: 'output',
-        name: 'Custom Output',
-        description: 'Custom shader output',
-        icon: 'code',
-        color: 'var(--nice-danger, #f44336)',
-        inputs: [{ id: 'fragColor', name: 'Frag Color', direction: 'input', dataType: 'vec4' }],
-        outputs: [],
-        properties: [
-            { id: 'vertexCode', name: 'Vertex Code', type: 'string', default: '' },
-            { id: 'fragmentCode', name: 'Fragment Code', type: 'string', default: '' },
-        ],
-    },
+  {
+    type: "output_pbr",
+    category: "output",
+    name: "PBR Output",
+    description: "Physically-based rendering output",
+    icon: "sphere",
+    color: "var(--nice-danger, #f44336)",
+    inputs: [
+      {
+        id: "albedo",
+        name: "Albedo",
+        direction: "input",
+        dataType: "vec3",
+        defaultValue: [1, 1, 1]
+      },
+      {
+        id: "metallic",
+        name: "Metallic",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0,
+        min: 0,
+        max: 1
+      },
+      {
+        id: "roughness",
+        name: "Roughness",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0.5,
+        min: 0,
+        max: 1
+      },
+      { id: "normal", name: "Normal", direction: "input", dataType: "vec3" },
+      {
+        id: "ao",
+        name: "AO",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 1,
+        min: 0,
+        max: 1
+      },
+      {
+        id: "emissive",
+        name: "Emissive",
+        direction: "input",
+        dataType: "vec3",
+        defaultValue: [0, 0, 0]
+      },
+      {
+        id: "alpha",
+        name: "Alpha",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 1,
+        min: 0,
+        max: 1
+      }
+    ],
+    outputs: [],
+    previewable: true
+  },
+  {
+    type: "output_unlit",
+    category: "output",
+    name: "Unlit Output",
+    description: "Unlit material output",
+    icon: "sun",
+    color: "var(--nice-danger, #f44336)",
+    inputs: [
+      { id: "color", name: "Color", direction: "input", dataType: "vec3", defaultValue: [1, 1, 1] },
+      { id: "alpha", name: "Alpha", direction: "input", dataType: "float", defaultValue: 1 }
+    ],
+    outputs: [],
+    previewable: true
+  },
+  {
+    type: "output_custom",
+    category: "output",
+    name: "Custom Output",
+    description: "Custom shader output",
+    icon: "code",
+    color: "var(--nice-danger, #f44336)",
+    inputs: [{ id: "fragColor", name: "Frag Color", direction: "input", dataType: "vec4" }],
+    outputs: [],
+    properties: [
+      { id: "vertexCode", name: "Vertex Code", type: "string", default: "" },
+      { id: "fragmentCode", name: "Fragment Code", type: "string", default: "" }
+    ]
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   MATH NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const mathNodes = [
-    {
-        type: 'add',
-        category: 'math',
-        name: 'Add',
-        description: 'Add two values',
-        icon: 'plus',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'any', defaultValue: 0 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'any', defaultValue: 0 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeA}} {{nodeId}}_result = {{a}} + {{b}};',
-    },
-    {
-        type: 'subtract',
-        category: 'math',
-        name: 'Subtract',
-        description: 'Subtract two values',
-        icon: 'minus',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'any', defaultValue: 0 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'any', defaultValue: 0 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeA}} {{nodeId}}_result = {{a}} - {{b}};',
-    },
-    {
-        type: 'multiply',
-        category: 'math',
-        name: 'Multiply',
-        description: 'Multiply two values',
-        icon: 'x',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'any', defaultValue: 1 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'any', defaultValue: 1 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeA}} {{nodeId}}_result = {{a}} * {{b}};',
-    },
-    {
-        type: 'divide',
-        category: 'math',
-        name: 'Divide',
-        description: 'Divide two values',
-        icon: 'divide',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'any', defaultValue: 1 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'any', defaultValue: 1 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeA}} {{nodeId}}_result = {{a}} / max({{b}}, 0.0001);',
-    },
-    {
-        type: 'power',
-        category: 'math',
-        name: 'Power',
-        description: 'Raise to power',
-        icon: 'superscript',
-        inputs: [
-            { id: 'base', name: 'Base', direction: 'input', dataType: 'any', defaultValue: 2 },
-            { id: 'exp', name: 'Exponent', direction: 'input', dataType: 'float', defaultValue: 2 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeBase}} {{nodeId}}_result = pow({{base}}, {{exp}});',
-    },
-    {
-        type: 'sqrt',
-        category: 'math',
-        name: 'Square Root',
-        description: 'Square root of value',
-        icon: 'radical',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 1 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = sqrt({{value}});',
-    },
-    {
-        type: 'abs',
-        category: 'math',
-        name: 'Absolute',
-        description: 'Absolute value',
-        icon: 'bar-chart',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = abs({{value}});',
-    },
-    {
-        type: 'negate',
-        category: 'math',
-        name: 'Negate',
-        description: 'Negate value',
-        icon: 'minus-circle',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = -{{value}};',
-    },
-    {
-        type: 'sin',
-        category: 'math',
-        name: 'Sine',
-        description: 'Sine function',
-        icon: 'activity',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = sin({{value}});',
-    },
-    {
-        type: 'cos',
-        category: 'math',
-        name: 'Cosine',
-        description: 'Cosine function',
-        icon: 'activity',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = cos({{value}});',
-    },
-    {
-        type: 'tan',
-        category: 'math',
-        name: 'Tangent',
-        description: 'Tangent function',
-        icon: 'activity',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = tan({{value}});',
-    },
-    {
-        type: 'floor',
-        category: 'math',
-        name: 'Floor',
-        description: 'Floor value',
-        icon: 'corner-down-left',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = floor({{value}});',
-    },
-    {
-        type: 'ceil',
-        category: 'math',
-        name: 'Ceiling',
-        description: 'Ceiling value',
-        icon: 'corner-up-right',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = ceil({{value}});',
-    },
-    {
-        type: 'round',
-        category: 'math',
-        name: 'Round',
-        description: 'Round value',
-        icon: 'circle',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = round({{value}});',
-    },
-    {
-        type: 'fract',
-        category: 'math',
-        name: 'Fraction',
-        description: 'Fractional part',
-        icon: 'percent',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = fract({{value}});',
-    },
-    {
-        type: 'mod',
-        category: 'math',
-        name: 'Modulo',
-        description: 'Modulo operation',
-        icon: 'percent',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'any', defaultValue: 0 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'any', defaultValue: 1 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeA}} {{nodeId}}_result = mod({{a}}, {{b}});',
-    },
-    {
-        type: 'min',
-        category: 'math',
-        name: 'Minimum',
-        description: 'Minimum of two values',
-        icon: 'chevron-down',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'any', defaultValue: 0 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'any', defaultValue: 1 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeA}} {{nodeId}}_result = min({{a}}, {{b}});',
-    },
-    {
-        type: 'max',
-        category: 'math',
-        name: 'Maximum',
-        description: 'Maximum of two values',
-        icon: 'chevron-up',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'any', defaultValue: 0 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'any', defaultValue: 1 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeA}} {{nodeId}}_result = max({{a}}, {{b}});',
-    },
-    {
-        type: 'exp',
-        category: 'math',
-        name: 'Exponential',
-        description: 'e^x',
-        icon: 'trending-up',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = exp({{value}});',
-    },
-    {
-        type: 'log',
-        category: 'math',
-        name: 'Logarithm',
-        description: 'Natural logarithm',
-        icon: 'trending-down',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 1 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = log(max({{value}}, 0.0001));',
-    },
+  {
+    type: "add",
+    category: "math",
+    name: "Add",
+    description: "Add two values",
+    icon: "plus",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "any", defaultValue: 0 },
+      { id: "b", name: "B", direction: "input", dataType: "any", defaultValue: 0 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeA}} {{nodeId}}_result = {{a}} + {{b}};"
+  },
+  {
+    type: "subtract",
+    category: "math",
+    name: "Subtract",
+    description: "Subtract two values",
+    icon: "minus",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "any", defaultValue: 0 },
+      { id: "b", name: "B", direction: "input", dataType: "any", defaultValue: 0 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeA}} {{nodeId}}_result = {{a}} - {{b}};"
+  },
+  {
+    type: "multiply",
+    category: "math",
+    name: "Multiply",
+    description: "Multiply two values",
+    icon: "x",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "any", defaultValue: 1 },
+      { id: "b", name: "B", direction: "input", dataType: "any", defaultValue: 1 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeA}} {{nodeId}}_result = {{a}} * {{b}};"
+  },
+  {
+    type: "divide",
+    category: "math",
+    name: "Divide",
+    description: "Divide two values",
+    icon: "divide",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "any", defaultValue: 1 },
+      { id: "b", name: "B", direction: "input", dataType: "any", defaultValue: 1 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeA}} {{nodeId}}_result = {{a}} / max({{b}}, 0.0001);"
+  },
+  {
+    type: "power",
+    category: "math",
+    name: "Power",
+    description: "Raise to power",
+    icon: "superscript",
+    inputs: [
+      { id: "base", name: "Base", direction: "input", dataType: "any", defaultValue: 2 },
+      { id: "exp", name: "Exponent", direction: "input", dataType: "float", defaultValue: 2 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeBase}} {{nodeId}}_result = pow({{base}}, {{exp}});"
+  },
+  {
+    type: "sqrt",
+    category: "math",
+    name: "Square Root",
+    description: "Square root of value",
+    icon: "radical",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 1 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = sqrt({{value}});"
+  },
+  {
+    type: "abs",
+    category: "math",
+    name: "Absolute",
+    description: "Absolute value",
+    icon: "bar-chart",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = abs({{value}});"
+  },
+  {
+    type: "negate",
+    category: "math",
+    name: "Negate",
+    description: "Negate value",
+    icon: "minus-circle",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = -{{value}};"
+  },
+  {
+    type: "sin",
+    category: "math",
+    name: "Sine",
+    description: "Sine function",
+    icon: "activity",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = sin({{value}});"
+  },
+  {
+    type: "cos",
+    category: "math",
+    name: "Cosine",
+    description: "Cosine function",
+    icon: "activity",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = cos({{value}});"
+  },
+  {
+    type: "tan",
+    category: "math",
+    name: "Tangent",
+    description: "Tangent function",
+    icon: "activity",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = tan({{value}});"
+  },
+  {
+    type: "floor",
+    category: "math",
+    name: "Floor",
+    description: "Floor value",
+    icon: "corner-down-left",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = floor({{value}});"
+  },
+  {
+    type: "ceil",
+    category: "math",
+    name: "Ceiling",
+    description: "Ceiling value",
+    icon: "corner-up-right",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = ceil({{value}});"
+  },
+  {
+    type: "round",
+    category: "math",
+    name: "Round",
+    description: "Round value",
+    icon: "circle",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = round({{value}});"
+  },
+  {
+    type: "fract",
+    category: "math",
+    name: "Fraction",
+    description: "Fractional part",
+    icon: "percent",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = fract({{value}});"
+  },
+  {
+    type: "mod",
+    category: "math",
+    name: "Modulo",
+    description: "Modulo operation",
+    icon: "percent",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "any", defaultValue: 0 },
+      { id: "b", name: "B", direction: "input", dataType: "any", defaultValue: 1 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeA}} {{nodeId}}_result = mod({{a}}, {{b}});"
+  },
+  {
+    type: "min",
+    category: "math",
+    name: "Minimum",
+    description: "Minimum of two values",
+    icon: "chevron-down",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "any", defaultValue: 0 },
+      { id: "b", name: "B", direction: "input", dataType: "any", defaultValue: 1 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeA}} {{nodeId}}_result = min({{a}}, {{b}});"
+  },
+  {
+    type: "max",
+    category: "math",
+    name: "Maximum",
+    description: "Maximum of two values",
+    icon: "chevron-up",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "any", defaultValue: 0 },
+      { id: "b", name: "B", direction: "input", dataType: "any", defaultValue: 1 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeA}} {{nodeId}}_result = max({{a}}, {{b}});"
+  },
+  {
+    type: "exp",
+    category: "math",
+    name: "Exponential",
+    description: "e^x",
+    icon: "trending-up",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = exp({{value}});"
+  },
+  {
+    type: "log",
+    category: "math",
+    name: "Logarithm",
+    description: "Natural logarithm",
+    icon: "trending-down",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 1 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = log(max({{value}}, 0.0001));"
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   VECTOR NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const vectorNodes = [
-    {
-        type: 'split_vec2',
-        category: 'vector',
-        name: 'Split Vec2',
-        description: 'Split vector into components',
-        icon: 'git-branch',
-        inputs: [{ id: 'vector', name: 'Vector', direction: 'input', dataType: 'vec2' }],
-        outputs: [
-            { id: 'x', name: 'X', direction: 'output', dataType: 'float' },
-            { id: 'y', name: 'Y', direction: 'output', dataType: 'float' },
-        ],
-    },
-    {
-        type: 'split_vec3',
-        category: 'vector',
-        name: 'Split Vec3',
-        description: 'Split vector into components',
-        icon: 'git-branch',
-        inputs: [{ id: 'vector', name: 'Vector', direction: 'input', dataType: 'vec3' }],
-        outputs: [
-            { id: 'x', name: 'X', direction: 'output', dataType: 'float' },
-            { id: 'y', name: 'Y', direction: 'output', dataType: 'float' },
-            { id: 'z', name: 'Z', direction: 'output', dataType: 'float' },
-        ],
-    },
-    {
-        type: 'split_vec4',
-        category: 'vector',
-        name: 'Split Vec4',
-        description: 'Split vector into components',
-        icon: 'git-branch',
-        inputs: [{ id: 'vector', name: 'Vector', direction: 'input', dataType: 'vec4' }],
-        outputs: [
-            { id: 'x', name: 'X', direction: 'output', dataType: 'float' },
-            { id: 'y', name: 'Y', direction: 'output', dataType: 'float' },
-            { id: 'z', name: 'Z', direction: 'output', dataType: 'float' },
-            { id: 'w', name: 'W', direction: 'output', dataType: 'float' },
-        ],
-    },
-    {
-        type: 'combine_vec2',
-        category: 'vector',
-        name: 'Combine Vec2',
-        description: 'Combine components into vector',
-        icon: 'git-merge',
-        inputs: [
-            { id: 'x', name: 'X', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'y', name: 'Y', direction: 'input', dataType: 'float', defaultValue: 0 },
-        ],
-        outputs: [{ id: 'vector', name: 'Vector', direction: 'output', dataType: 'vec2' }],
-        shaderFunction: 'vec2 {{nodeId}}_vector = vec2({{x}}, {{y}});',
-    },
-    {
-        type: 'combine_vec3',
-        category: 'vector',
-        name: 'Combine Vec3',
-        description: 'Combine components into vector',
-        icon: 'git-merge',
-        inputs: [
-            { id: 'x', name: 'X', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'y', name: 'Y', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'z', name: 'Z', direction: 'input', dataType: 'float', defaultValue: 0 },
-        ],
-        outputs: [{ id: 'vector', name: 'Vector', direction: 'output', dataType: 'vec3' }],
-        shaderFunction: 'vec3 {{nodeId}}_vector = vec3({{x}}, {{y}}, {{z}});',
-    },
-    {
-        type: 'combine_vec4',
-        category: 'vector',
-        name: 'Combine Vec4',
-        description: 'Combine components into vector',
-        icon: 'git-merge',
-        inputs: [
-            { id: 'x', name: 'X', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'y', name: 'Y', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'z', name: 'Z', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'w', name: 'W', direction: 'input', dataType: 'float', defaultValue: 1 },
-        ],
-        outputs: [{ id: 'vector', name: 'Vector', direction: 'output', dataType: 'vec4' }],
-        shaderFunction: 'vec4 {{nodeId}}_vector = vec4({{x}}, {{y}}, {{z}}, {{w}});',
-    },
-    {
-        type: 'normalize',
-        category: 'vector',
-        name: 'Normalize',
-        description: 'Normalize vector to unit length',
-        icon: 'maximize-2',
-        inputs: [{ id: 'vector', name: 'Vector', direction: 'input', dataType: 'vec3' }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        shaderFunction: 'vec3 {{nodeId}}_result = normalize({{vector}});',
-    },
-    {
-        type: 'length',
-        category: 'vector',
-        name: 'Length',
-        description: 'Vector length/magnitude',
-        icon: 'move',
-        inputs: [{ id: 'vector', name: 'Vector', direction: 'input', dataType: 'vec3' }],
-        outputs: [{ id: 'length', name: 'Length', direction: 'output', dataType: 'float' }],
-        shaderFunction: 'float {{nodeId}}_length = length({{vector}});',
-    },
-    {
-        type: 'distance',
-        category: 'vector',
-        name: 'Distance',
-        description: 'Distance between two points',
-        icon: 'maximize',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'vec3' },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'vec3' },
-        ],
-        outputs: [{ id: 'distance', name: 'Distance', direction: 'output', dataType: 'float' }],
-        shaderFunction: 'float {{nodeId}}_distance = distance({{a}}, {{b}});',
-    },
-    {
-        type: 'dot',
-        category: 'vector',
-        name: 'Dot Product',
-        description: 'Dot product of two vectors',
-        icon: 'target',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'vec3' },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'vec3' },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'float' }],
-        shaderFunction: 'float {{nodeId}}_result = dot({{a}}, {{b}});',
-    },
-    {
-        type: 'cross',
-        category: 'vector',
-        name: 'Cross Product',
-        description: 'Cross product of two vectors',
-        icon: 'x',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'vec3' },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'vec3' },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        shaderFunction: 'vec3 {{nodeId}}_result = cross({{a}}, {{b}});',
-    },
-    {
-        type: 'reflect',
-        category: 'vector',
-        name: 'Reflect',
-        description: 'Reflect vector off surface',
-        icon: 'corner-up-left',
-        inputs: [
-            { id: 'incident', name: 'Incident', direction: 'input', dataType: 'vec3' },
-            { id: 'normal', name: 'Normal', direction: 'input', dataType: 'vec3' },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        shaderFunction: 'vec3 {{nodeId}}_result = reflect({{incident}}, {{normal}});',
-    },
-    {
-        type: 'refract',
-        category: 'vector',
-        name: 'Refract',
-        description: 'Refract vector through surface',
-        icon: 'corner-down-right',
-        inputs: [
-            { id: 'incident', name: 'Incident', direction: 'input', dataType: 'vec3' },
-            { id: 'normal', name: 'Normal', direction: 'input', dataType: 'vec3' },
-            { id: 'ior', name: 'IOR', direction: 'input', dataType: 'float', defaultValue: 1.5 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        shaderFunction: 'vec3 {{nodeId}}_result = refract({{incident}}, {{normal}}, {{ior}});',
-    },
-    {
-        type: 'transform',
-        category: 'vector',
-        name: 'Transform',
-        description: 'Transform vector by matrix',
-        icon: 'rotate-cw',
-        inputs: [
-            { id: 'vector', name: 'Vector', direction: 'input', dataType: 'vec3' },
-            { id: 'matrix', name: 'Matrix', direction: 'input', dataType: 'matrix4' },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-    },
+  {
+    type: "split_vec2",
+    category: "vector",
+    name: "Split Vec2",
+    description: "Split vector into components",
+    icon: "git-branch",
+    inputs: [{ id: "vector", name: "Vector", direction: "input", dataType: "vec2" }],
+    outputs: [
+      { id: "x", name: "X", direction: "output", dataType: "float" },
+      { id: "y", name: "Y", direction: "output", dataType: "float" }
+    ]
+  },
+  {
+    type: "split_vec3",
+    category: "vector",
+    name: "Split Vec3",
+    description: "Split vector into components",
+    icon: "git-branch",
+    inputs: [{ id: "vector", name: "Vector", direction: "input", dataType: "vec3" }],
+    outputs: [
+      { id: "x", name: "X", direction: "output", dataType: "float" },
+      { id: "y", name: "Y", direction: "output", dataType: "float" },
+      { id: "z", name: "Z", direction: "output", dataType: "float" }
+    ]
+  },
+  {
+    type: "split_vec4",
+    category: "vector",
+    name: "Split Vec4",
+    description: "Split vector into components",
+    icon: "git-branch",
+    inputs: [{ id: "vector", name: "Vector", direction: "input", dataType: "vec4" }],
+    outputs: [
+      { id: "x", name: "X", direction: "output", dataType: "float" },
+      { id: "y", name: "Y", direction: "output", dataType: "float" },
+      { id: "z", name: "Z", direction: "output", dataType: "float" },
+      { id: "w", name: "W", direction: "output", dataType: "float" }
+    ]
+  },
+  {
+    type: "combine_vec2",
+    category: "vector",
+    name: "Combine Vec2",
+    description: "Combine components into vector",
+    icon: "git-merge",
+    inputs: [
+      { id: "x", name: "X", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "y", name: "Y", direction: "input", dataType: "float", defaultValue: 0 }
+    ],
+    outputs: [{ id: "vector", name: "Vector", direction: "output", dataType: "vec2" }],
+    shaderFunction: "vec2 {{nodeId}}_vector = vec2({{x}}, {{y}});"
+  },
+  {
+    type: "combine_vec3",
+    category: "vector",
+    name: "Combine Vec3",
+    description: "Combine components into vector",
+    icon: "git-merge",
+    inputs: [
+      { id: "x", name: "X", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "y", name: "Y", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "z", name: "Z", direction: "input", dataType: "float", defaultValue: 0 }
+    ],
+    outputs: [{ id: "vector", name: "Vector", direction: "output", dataType: "vec3" }],
+    shaderFunction: "vec3 {{nodeId}}_vector = vec3({{x}}, {{y}}, {{z}});"
+  },
+  {
+    type: "combine_vec4",
+    category: "vector",
+    name: "Combine Vec4",
+    description: "Combine components into vector",
+    icon: "git-merge",
+    inputs: [
+      { id: "x", name: "X", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "y", name: "Y", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "z", name: "Z", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "w", name: "W", direction: "input", dataType: "float", defaultValue: 1 }
+    ],
+    outputs: [{ id: "vector", name: "Vector", direction: "output", dataType: "vec4" }],
+    shaderFunction: "vec4 {{nodeId}}_vector = vec4({{x}}, {{y}}, {{z}}, {{w}});"
+  },
+  {
+    type: "normalize",
+    category: "vector",
+    name: "Normalize",
+    description: "Normalize vector to unit length",
+    icon: "maximize-2",
+    inputs: [{ id: "vector", name: "Vector", direction: "input", dataType: "vec3" }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    shaderFunction: "vec3 {{nodeId}}_result = normalize({{vector}});"
+  },
+  {
+    type: "length",
+    category: "vector",
+    name: "Length",
+    description: "Vector length/magnitude",
+    icon: "move",
+    inputs: [{ id: "vector", name: "Vector", direction: "input", dataType: "vec3" }],
+    outputs: [{ id: "length", name: "Length", direction: "output", dataType: "float" }],
+    shaderFunction: "float {{nodeId}}_length = length({{vector}});"
+  },
+  {
+    type: "distance",
+    category: "vector",
+    name: "Distance",
+    description: "Distance between two points",
+    icon: "maximize",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "vec3" },
+      { id: "b", name: "B", direction: "input", dataType: "vec3" }
+    ],
+    outputs: [{ id: "distance", name: "Distance", direction: "output", dataType: "float" }],
+    shaderFunction: "float {{nodeId}}_distance = distance({{a}}, {{b}});"
+  },
+  {
+    type: "dot",
+    category: "vector",
+    name: "Dot Product",
+    description: "Dot product of two vectors",
+    icon: "target",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "vec3" },
+      { id: "b", name: "B", direction: "input", dataType: "vec3" }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "float" }],
+    shaderFunction: "float {{nodeId}}_result = dot({{a}}, {{b}});"
+  },
+  {
+    type: "cross",
+    category: "vector",
+    name: "Cross Product",
+    description: "Cross product of two vectors",
+    icon: "x",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "vec3" },
+      { id: "b", name: "B", direction: "input", dataType: "vec3" }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    shaderFunction: "vec3 {{nodeId}}_result = cross({{a}}, {{b}});"
+  },
+  {
+    type: "reflect",
+    category: "vector",
+    name: "Reflect",
+    description: "Reflect vector off surface",
+    icon: "corner-up-left",
+    inputs: [
+      { id: "incident", name: "Incident", direction: "input", dataType: "vec3" },
+      { id: "normal", name: "Normal", direction: "input", dataType: "vec3" }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    shaderFunction: "vec3 {{nodeId}}_result = reflect({{incident}}, {{normal}});"
+  },
+  {
+    type: "refract",
+    category: "vector",
+    name: "Refract",
+    description: "Refract vector through surface",
+    icon: "corner-down-right",
+    inputs: [
+      { id: "incident", name: "Incident", direction: "input", dataType: "vec3" },
+      { id: "normal", name: "Normal", direction: "input", dataType: "vec3" },
+      { id: "ior", name: "IOR", direction: "input", dataType: "float", defaultValue: 1.5 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    shaderFunction: "vec3 {{nodeId}}_result = refract({{incident}}, {{normal}}, {{ior}});"
+  },
+  {
+    type: "transform",
+    category: "vector",
+    name: "Transform",
+    description: "Transform vector by matrix",
+    icon: "rotate-cw",
+    inputs: [
+      { id: "vector", name: "Vector", direction: "input", dataType: "vec3" },
+      { id: "matrix", name: "Matrix", direction: "input", dataType: "matrix4" }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }]
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   COLOR NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const colorNodes = [
-    {
-        type: 'hsv_to_rgb',
-        category: 'color',
-        name: 'HSV to RGB',
-        description: 'Convert HSV to RGB',
-        icon: 'droplet',
-        inputs: [
-            {
-                id: 'h',
-                name: 'H',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0,
-                min: 0,
-                max: 1,
-            },
-            {
-                id: 's',
-                name: 'S',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 1,
-                min: 0,
-                max: 1,
-            },
-            {
-                id: 'v',
-                name: 'V',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 1,
-                min: 0,
-                max: 1,
-            },
-        ],
-        outputs: [{ id: 'rgb', name: 'RGB', direction: 'output', dataType: 'vec3' }],
-        previewable: true,
-    },
-    {
-        type: 'rgb_to_hsv',
-        category: 'color',
-        name: 'RGB to HSV',
-        description: 'Convert RGB to HSV',
-        icon: 'droplet',
-        inputs: [{ id: 'rgb', name: 'RGB', direction: 'input', dataType: 'vec3' }],
-        outputs: [
-            { id: 'h', name: 'H', direction: 'output', dataType: 'float' },
-            { id: 's', name: 'S', direction: 'output', dataType: 'float' },
-            { id: 'v', name: 'V', direction: 'output', dataType: 'float' },
-        ],
-    },
-    {
-        type: 'blend',
-        category: 'color',
-        name: 'Blend',
-        description: 'Blend two colors',
-        icon: 'layers',
-        inputs: [
-            { id: 'base', name: 'Base', direction: 'input', dataType: 'vec3' },
-            { id: 'blend', name: 'Blend', direction: 'input', dataType: 'vec3' },
-            {
-                id: 'factor',
-                name: 'Factor',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0.5,
-                min: 0,
-                max: 1,
-            },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        properties: [
-            {
-                id: 'mode',
-                name: 'Mode',
-                type: 'enum',
-                default: 'normal',
-                options: [
-                    { label: 'Normal', value: 'normal' },
-                    { label: 'Multiply', value: 'multiply' },
-                    { label: 'Screen', value: 'screen' },
-                    { label: 'Overlay', value: 'overlay' },
-                    { label: 'Add', value: 'add' },
-                    { label: 'Subtract', value: 'subtract' },
-                    { label: 'Difference', value: 'difference' },
-                ],
-            },
-        ],
-        previewable: true,
-    },
-    {
-        type: 'brightness_contrast',
-        category: 'color',
-        name: 'Brightness/Contrast',
-        description: 'Adjust brightness and contrast',
-        icon: 'sun',
-        inputs: [
-            { id: 'color', name: 'Color', direction: 'input', dataType: 'vec3' },
-            {
-                id: 'brightness',
-                name: 'Brightness',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0,
-                min: -1,
-                max: 1,
-            },
-            {
-                id: 'contrast',
-                name: 'Contrast',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 1,
-                min: 0,
-                max: 2,
-            },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        previewable: true,
-    },
-    {
-        type: 'hue_saturation',
-        category: 'color',
-        name: 'Hue/Saturation',
-        description: 'Adjust hue, saturation, value',
-        icon: 'sliders',
-        inputs: [
-            { id: 'color', name: 'Color', direction: 'input', dataType: 'vec3' },
-            {
-                id: 'hue',
-                name: 'Hue',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0,
-                min: -1,
-                max: 1,
-            },
-            {
-                id: 'saturation',
-                name: 'Saturation',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 1,
-                min: 0,
-                max: 2,
-            },
-            {
-                id: 'value',
-                name: 'Value',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 1,
-                min: 0,
-                max: 2,
-            },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        previewable: true,
-    },
-    {
-        type: 'invert',
-        category: 'color',
-        name: 'Invert',
-        description: 'Invert color',
-        icon: 'refresh-cw',
-        inputs: [{ id: 'color', name: 'Color', direction: 'input', dataType: 'vec3' }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        shaderFunction: 'vec3 {{nodeId}}_result = vec3(1.0) - {{color}};',
-        previewable: true,
-    },
-    {
-        type: 'gamma',
-        category: 'color',
-        name: 'Gamma',
-        description: 'Apply gamma correction',
-        icon: 'zap',
-        inputs: [
-            { id: 'color', name: 'Color', direction: 'input', dataType: 'vec3' },
-            { id: 'gamma', name: 'Gamma', direction: 'input', dataType: 'float', defaultValue: 2.2 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'vec3' }],
-        shaderFunction: 'vec3 {{nodeId}}_result = pow({{color}}, vec3(1.0 / {{gamma}}));',
-        previewable: true,
-    },
-    {
-        type: 'grayscale',
-        category: 'color',
-        name: 'Grayscale',
-        description: 'Convert to grayscale',
-        icon: 'circle',
-        inputs: [{ id: 'color', name: 'Color', direction: 'input', dataType: 'vec3' }],
-        outputs: [
-            { id: 'gray', name: 'Gray', direction: 'output', dataType: 'float' },
-            { id: 'rgb', name: 'RGB', direction: 'output', dataType: 'vec3' },
-        ],
-        shaderFunction: 'float {{nodeId}}_gray = dot({{color}}, vec3(0.299, 0.587, 0.114));',
-        previewable: true,
-    },
+  {
+    type: "hsv_to_rgb",
+    category: "color",
+    name: "HSV to RGB",
+    description: "Convert HSV to RGB",
+    icon: "droplet",
+    inputs: [
+      {
+        id: "h",
+        name: "H",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0,
+        min: 0,
+        max: 1
+      },
+      {
+        id: "s",
+        name: "S",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 1,
+        min: 0,
+        max: 1
+      },
+      {
+        id: "v",
+        name: "V",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 1,
+        min: 0,
+        max: 1
+      }
+    ],
+    outputs: [{ id: "rgb", name: "RGB", direction: "output", dataType: "vec3" }],
+    previewable: true
+  },
+  {
+    type: "rgb_to_hsv",
+    category: "color",
+    name: "RGB to HSV",
+    description: "Convert RGB to HSV",
+    icon: "droplet",
+    inputs: [{ id: "rgb", name: "RGB", direction: "input", dataType: "vec3" }],
+    outputs: [
+      { id: "h", name: "H", direction: "output", dataType: "float" },
+      { id: "s", name: "S", direction: "output", dataType: "float" },
+      { id: "v", name: "V", direction: "output", dataType: "float" }
+    ]
+  },
+  {
+    type: "blend",
+    category: "color",
+    name: "Blend",
+    description: "Blend two colors",
+    icon: "layers",
+    inputs: [
+      { id: "base", name: "Base", direction: "input", dataType: "vec3" },
+      { id: "blend", name: "Blend", direction: "input", dataType: "vec3" },
+      {
+        id: "factor",
+        name: "Factor",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0.5,
+        min: 0,
+        max: 1
+      }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    properties: [
+      {
+        id: "mode",
+        name: "Mode",
+        type: "enum",
+        default: "normal",
+        options: [
+          { label: "Normal", value: "normal" },
+          { label: "Multiply", value: "multiply" },
+          { label: "Screen", value: "screen" },
+          { label: "Overlay", value: "overlay" },
+          { label: "Add", value: "add" },
+          { label: "Subtract", value: "subtract" },
+          { label: "Difference", value: "difference" }
+        ]
+      }
+    ],
+    previewable: true
+  },
+  {
+    type: "brightness_contrast",
+    category: "color",
+    name: "Brightness/Contrast",
+    description: "Adjust brightness and contrast",
+    icon: "sun",
+    inputs: [
+      { id: "color", name: "Color", direction: "input", dataType: "vec3" },
+      {
+        id: "brightness",
+        name: "Brightness",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0,
+        min: -1,
+        max: 1
+      },
+      {
+        id: "contrast",
+        name: "Contrast",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 1,
+        min: 0,
+        max: 2
+      }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    previewable: true
+  },
+  {
+    type: "hue_saturation",
+    category: "color",
+    name: "Hue/Saturation",
+    description: "Adjust hue, saturation, value",
+    icon: "sliders",
+    inputs: [
+      { id: "color", name: "Color", direction: "input", dataType: "vec3" },
+      {
+        id: "hue",
+        name: "Hue",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0,
+        min: -1,
+        max: 1
+      },
+      {
+        id: "saturation",
+        name: "Saturation",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 1,
+        min: 0,
+        max: 2
+      },
+      {
+        id: "value",
+        name: "Value",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 1,
+        min: 0,
+        max: 2
+      }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    previewable: true
+  },
+  {
+    type: "invert",
+    category: "color",
+    name: "Invert",
+    description: "Invert color",
+    icon: "refresh-cw",
+    inputs: [{ id: "color", name: "Color", direction: "input", dataType: "vec3" }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    shaderFunction: "vec3 {{nodeId}}_result = vec3(1.0) - {{color}};",
+    previewable: true
+  },
+  {
+    type: "gamma",
+    category: "color",
+    name: "Gamma",
+    description: "Apply gamma correction",
+    icon: "zap",
+    inputs: [
+      { id: "color", name: "Color", direction: "input", dataType: "vec3" },
+      { id: "gamma", name: "Gamma", direction: "input", dataType: "float", defaultValue: 2.2 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "vec3" }],
+    shaderFunction: "vec3 {{nodeId}}_result = pow({{color}}, vec3(1.0 / {{gamma}}));",
+    previewable: true
+  },
+  {
+    type: "grayscale",
+    category: "color",
+    name: "Grayscale",
+    description: "Convert to grayscale",
+    icon: "circle",
+    inputs: [{ id: "color", name: "Color", direction: "input", dataType: "vec3" }],
+    outputs: [
+      { id: "gray", name: "Gray", direction: "output", dataType: "float" },
+      { id: "rgb", name: "RGB", direction: "output", dataType: "vec3" }
+    ],
+    shaderFunction: "float {{nodeId}}_gray = dot({{color}}, vec3(0.299, 0.587, 0.114));",
+    previewable: true
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   TEXTURE NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const textureNodes = [
-    {
-        type: 'sample_texture',
-        category: 'texture',
-        name: 'Sample Texture',
-        description: 'Sample 2D texture',
-        icon: 'image',
-        inputs: [
-            { id: 'texture', name: 'Texture', direction: 'input', dataType: 'texture2d' },
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-        ],
-        outputs: [
-            { id: 'rgba', name: 'RGBA', direction: 'output', dataType: 'vec4' },
-            { id: 'rgb', name: 'RGB', direction: 'output', dataType: 'vec3' },
-            { id: 'r', name: 'R', direction: 'output', dataType: 'float' },
-            { id: 'g', name: 'G', direction: 'output', dataType: 'float' },
-            { id: 'b', name: 'B', direction: 'output', dataType: 'float' },
-            { id: 'a', name: 'A', direction: 'output', dataType: 'float' },
-        ],
-        shaderFunction: 'vec4 {{nodeId}}_rgba = texture2D({{texture}}, {{uv}});',
-        previewable: true,
-    },
-    {
-        type: 'sample_cubemap',
-        category: 'texture',
-        name: 'Sample Cubemap',
-        description: 'Sample cubemap texture',
-        icon: 'box',
-        inputs: [
-            { id: 'texture', name: 'Texture', direction: 'input', dataType: 'textureCube' },
-            { id: 'direction', name: 'Direction', direction: 'input', dataType: 'vec3' },
-        ],
-        outputs: [
-            { id: 'rgba', name: 'RGBA', direction: 'output', dataType: 'vec4' },
-            { id: 'rgb', name: 'RGB', direction: 'output', dataType: 'vec3' },
-        ],
-        shaderFunction: 'vec4 {{nodeId}}_rgba = textureCube({{texture}}, {{direction}});',
-        previewable: true,
-    },
-    {
-        type: 'normal_map',
-        category: 'texture',
-        name: 'Normal Map',
-        description: 'Unpack normal map',
-        icon: 'arrow-up-right',
-        inputs: [
-            { id: 'texture', name: 'Texture', direction: 'input', dataType: 'texture2d' },
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            {
-                id: 'strength',
-                name: 'Strength',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 1,
-                min: 0,
-                max: 2,
-            },
-        ],
-        outputs: [{ id: 'normal', name: 'Normal', direction: 'output', dataType: 'vec3' }],
-        previewable: true,
-    },
-    {
-        type: 'uv_tiling',
-        category: 'texture',
-        name: 'UV Tiling/Offset',
-        description: 'Tile and offset UVs',
-        icon: 'grid',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            { id: 'tiling', name: 'Tiling', direction: 'input', dataType: 'vec2', defaultValue: [1, 1] },
-            { id: 'offset', name: 'Offset', direction: 'input', dataType: 'vec2', defaultValue: [0, 0] },
-        ],
-        outputs: [{ id: 'uv', name: 'UV', direction: 'output', dataType: 'vec2' }],
-        shaderFunction: 'vec2 {{nodeId}}_uv = {{uv}} * {{tiling}} + {{offset}};',
-    },
-    {
-        type: 'uv_rotate',
-        category: 'texture',
-        name: 'UV Rotate',
-        description: 'Rotate UVs',
-        icon: 'rotate-cw',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            { id: 'angle', name: 'Angle', direction: 'input', dataType: 'float', defaultValue: 0 },
-            {
-                id: 'center',
-                name: 'Center',
-                direction: 'input',
-                dataType: 'vec2',
-                defaultValue: [0.5, 0.5],
-            },
-        ],
-        outputs: [{ id: 'uv', name: 'UV', direction: 'output', dataType: 'vec2' }],
-    },
-    {
-        type: 'parallax',
-        category: 'texture',
-        name: 'Parallax',
-        description: 'Parallax mapping',
-        icon: 'layers',
-        inputs: [
-            { id: 'heightMap', name: 'Height Map', direction: 'input', dataType: 'texture2d' },
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            { id: 'viewDir', name: 'View Dir', direction: 'input', dataType: 'vec3' },
-            { id: 'scale', name: 'Scale', direction: 'input', dataType: 'float', defaultValue: 0.1 },
-        ],
-        outputs: [{ id: 'uv', name: 'UV', direction: 'output', dataType: 'vec2' }],
-    },
-    {
-        type: 'triplanar',
-        category: 'texture',
-        name: 'Triplanar',
-        description: 'Triplanar texture projection',
-        icon: 'box',
-        inputs: [
-            { id: 'texture', name: 'Texture', direction: 'input', dataType: 'texture2d' },
-            { id: 'position', name: 'Position', direction: 'input', dataType: 'vec3' },
-            { id: 'normal', name: 'Normal', direction: 'input', dataType: 'vec3' },
-            { id: 'scale', name: 'Scale', direction: 'input', dataType: 'float', defaultValue: 1 },
-            { id: 'blend', name: 'Blend', direction: 'input', dataType: 'float', defaultValue: 0.5 },
-        ],
-        outputs: [{ id: 'color', name: 'Color', direction: 'output', dataType: 'vec4' }],
-        previewable: true,
-    },
+  {
+    type: "sample_texture",
+    category: "texture",
+    name: "Sample Texture",
+    description: "Sample 2D texture",
+    icon: "image",
+    inputs: [
+      { id: "texture", name: "Texture", direction: "input", dataType: "texture2d" },
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" }
+    ],
+    outputs: [
+      { id: "rgba", name: "RGBA", direction: "output", dataType: "vec4" },
+      { id: "rgb", name: "RGB", direction: "output", dataType: "vec3" },
+      { id: "r", name: "R", direction: "output", dataType: "float" },
+      { id: "g", name: "G", direction: "output", dataType: "float" },
+      { id: "b", name: "B", direction: "output", dataType: "float" },
+      { id: "a", name: "A", direction: "output", dataType: "float" }
+    ],
+    shaderFunction: "vec4 {{nodeId}}_rgba = texture2D({{texture}}, {{uv}});",
+    previewable: true
+  },
+  {
+    type: "sample_cubemap",
+    category: "texture",
+    name: "Sample Cubemap",
+    description: "Sample cubemap texture",
+    icon: "box",
+    inputs: [
+      { id: "texture", name: "Texture", direction: "input", dataType: "textureCube" },
+      { id: "direction", name: "Direction", direction: "input", dataType: "vec3" }
+    ],
+    outputs: [
+      { id: "rgba", name: "RGBA", direction: "output", dataType: "vec4" },
+      { id: "rgb", name: "RGB", direction: "output", dataType: "vec3" }
+    ],
+    shaderFunction: "vec4 {{nodeId}}_rgba = textureCube({{texture}}, {{direction}});",
+    previewable: true
+  },
+  {
+    type: "normal_map",
+    category: "texture",
+    name: "Normal Map",
+    description: "Unpack normal map",
+    icon: "arrow-up-right",
+    inputs: [
+      { id: "texture", name: "Texture", direction: "input", dataType: "texture2d" },
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      {
+        id: "strength",
+        name: "Strength",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 1,
+        min: 0,
+        max: 2
+      }
+    ],
+    outputs: [{ id: "normal", name: "Normal", direction: "output", dataType: "vec3" }],
+    previewable: true
+  },
+  {
+    type: "uv_tiling",
+    category: "texture",
+    name: "UV Tiling/Offset",
+    description: "Tile and offset UVs",
+    icon: "grid",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      { id: "tiling", name: "Tiling", direction: "input", dataType: "vec2", defaultValue: [1, 1] },
+      { id: "offset", name: "Offset", direction: "input", dataType: "vec2", defaultValue: [0, 0] }
+    ],
+    outputs: [{ id: "uv", name: "UV", direction: "output", dataType: "vec2" }],
+    shaderFunction: "vec2 {{nodeId}}_uv = {{uv}} * {{tiling}} + {{offset}};"
+  },
+  {
+    type: "uv_rotate",
+    category: "texture",
+    name: "UV Rotate",
+    description: "Rotate UVs",
+    icon: "rotate-cw",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      { id: "angle", name: "Angle", direction: "input", dataType: "float", defaultValue: 0 },
+      {
+        id: "center",
+        name: "Center",
+        direction: "input",
+        dataType: "vec2",
+        defaultValue: [0.5, 0.5]
+      }
+    ],
+    outputs: [{ id: "uv", name: "UV", direction: "output", dataType: "vec2" }]
+  },
+  {
+    type: "parallax",
+    category: "texture",
+    name: "Parallax",
+    description: "Parallax mapping",
+    icon: "layers",
+    inputs: [
+      { id: "heightMap", name: "Height Map", direction: "input", dataType: "texture2d" },
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      { id: "viewDir", name: "View Dir", direction: "input", dataType: "vec3" },
+      { id: "scale", name: "Scale", direction: "input", dataType: "float", defaultValue: 0.1 }
+    ],
+    outputs: [{ id: "uv", name: "UV", direction: "output", dataType: "vec2" }]
+  },
+  {
+    type: "triplanar",
+    category: "texture",
+    name: "Triplanar",
+    description: "Triplanar texture projection",
+    icon: "box",
+    inputs: [
+      { id: "texture", name: "Texture", direction: "input", dataType: "texture2d" },
+      { id: "position", name: "Position", direction: "input", dataType: "vec3" },
+      { id: "normal", name: "Normal", direction: "input", dataType: "vec3" },
+      { id: "scale", name: "Scale", direction: "input", dataType: "float", defaultValue: 1 },
+      { id: "blend", name: "Blend", direction: "input", dataType: "float", defaultValue: 0.5 }
+    ],
+    outputs: [{ id: "color", name: "Color", direction: "output", dataType: "vec4" }],
+    previewable: true
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   PROCEDURAL NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const proceduralNodes = [
-    {
-        type: 'noise_perlin',
-        category: 'procedural',
-        name: 'Perlin Noise',
-        description: 'Perlin noise generator',
-        icon: 'hash',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            { id: 'scale', name: 'Scale', direction: 'input', dataType: 'float', defaultValue: 10 },
-            { id: 'octaves', name: 'Octaves', direction: 'input', dataType: 'int', defaultValue: 4 },
-        ],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'float' }],
-        previewable: true,
-    },
-    {
-        type: 'noise_simplex',
-        category: 'procedural',
-        name: 'Simplex Noise',
-        description: 'Simplex noise generator',
-        icon: 'hash',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            { id: 'scale', name: 'Scale', direction: 'input', dataType: 'float', defaultValue: 10 },
-        ],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'float' }],
-        previewable: true,
-    },
-    {
-        type: 'noise_voronoi',
-        category: 'procedural',
-        name: 'Voronoi',
-        description: 'Voronoi/Worley noise',
-        icon: 'hexagon',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            { id: 'scale', name: 'Scale', direction: 'input', dataType: 'float', defaultValue: 10 },
-            { id: 'jitter', name: 'Jitter', direction: 'input', dataType: 'float', defaultValue: 1 },
-        ],
-        outputs: [
-            { id: 'distance', name: 'Distance', direction: 'output', dataType: 'float' },
-            { id: 'cellId', name: 'Cell ID', direction: 'output', dataType: 'float' },
-        ],
-        previewable: true,
-    },
-    {
-        type: 'noise_fbm',
-        category: 'procedural',
-        name: 'FBM Noise',
-        description: 'Fractional Brownian Motion',
-        icon: 'cloud',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            { id: 'scale', name: 'Scale', direction: 'input', dataType: 'float', defaultValue: 5 },
-            { id: 'octaves', name: 'Octaves', direction: 'input', dataType: 'int', defaultValue: 6 },
-            {
-                id: 'lacunarity',
-                name: 'Lacunarity',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 2,
-            },
-            { id: 'gain', name: 'Gain', direction: 'input', dataType: 'float', defaultValue: 0.5 },
-        ],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'float' }],
-        previewable: true,
-    },
-    {
-        type: 'gradient_linear',
-        category: 'procedural',
-        name: 'Linear Gradient',
-        description: 'Linear gradient',
-        icon: 'arrow-right',
-        inputs: [{ id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' }],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'float' }],
-        properties: [
-            {
-                id: 'direction',
-                name: 'Direction',
-                type: 'enum',
-                default: 'horizontal',
-                options: [
-                    { label: 'Horizontal', value: 'horizontal' },
-                    { label: 'Vertical', value: 'vertical' },
-                    { label: 'Diagonal', value: 'diagonal' },
-                ],
-            },
-        ],
-        previewable: true,
-    },
-    {
-        type: 'gradient_radial',
-        category: 'procedural',
-        name: 'Radial Gradient',
-        description: 'Radial gradient',
-        icon: 'circle',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            {
-                id: 'center',
-                name: 'Center',
-                direction: 'input',
-                dataType: 'vec2',
-                defaultValue: [0.5, 0.5],
-            },
-            { id: 'radius', name: 'Radius', direction: 'input', dataType: 'float', defaultValue: 0.5 },
-        ],
-        outputs: [{ id: 'value', name: 'Value', direction: 'output', dataType: 'float' }],
-        previewable: true,
-    },
-    {
-        type: 'checker',
-        category: 'procedural',
-        name: 'Checker',
-        description: 'Checkerboard pattern',
-        icon: 'grid',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            { id: 'scale', name: 'Scale', direction: 'input', dataType: 'float', defaultValue: 8 },
-            {
-                id: 'colorA',
-                name: 'Color A',
-                direction: 'input',
-                dataType: 'vec3',
-                defaultValue: [0, 0, 0],
-            },
-            {
-                id: 'colorB',
-                name: 'Color B',
-                direction: 'input',
-                dataType: 'vec3',
-                defaultValue: [1, 1, 1],
-            },
-        ],
-        outputs: [
-            { id: 'color', name: 'Color', direction: 'output', dataType: 'vec3' },
-            { id: 'value', name: 'Value', direction: 'output', dataType: 'float' },
-        ],
-        previewable: true,
-    },
-    {
-        type: 'brick',
-        category: 'procedural',
-        name: 'Brick',
-        description: 'Brick pattern',
-        icon: 'layout',
-        inputs: [
-            { id: 'uv', name: 'UV', direction: 'input', dataType: 'vec2' },
-            {
-                id: 'brickWidth',
-                name: 'Brick Width',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0.5,
-            },
-            {
-                id: 'brickHeight',
-                name: 'Brick Height',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0.25,
-            },
-            {
-                id: 'mortarSize',
-                name: 'Mortar Size',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0.02,
-            },
-        ],
-        outputs: [
-            { id: 'mask', name: 'Mask', direction: 'output', dataType: 'float' },
-            { id: 'brickId', name: 'Brick ID', direction: 'output', dataType: 'vec2' },
-        ],
-        previewable: true,
-    },
+  {
+    type: "noise_perlin",
+    category: "procedural",
+    name: "Perlin Noise",
+    description: "Perlin noise generator",
+    icon: "hash",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      { id: "scale", name: "Scale", direction: "input", dataType: "float", defaultValue: 10 },
+      { id: "octaves", name: "Octaves", direction: "input", dataType: "int", defaultValue: 4 }
+    ],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "float" }],
+    previewable: true
+  },
+  {
+    type: "noise_simplex",
+    category: "procedural",
+    name: "Simplex Noise",
+    description: "Simplex noise generator",
+    icon: "hash",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      { id: "scale", name: "Scale", direction: "input", dataType: "float", defaultValue: 10 }
+    ],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "float" }],
+    previewable: true
+  },
+  {
+    type: "noise_voronoi",
+    category: "procedural",
+    name: "Voronoi",
+    description: "Voronoi/Worley noise",
+    icon: "hexagon",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      { id: "scale", name: "Scale", direction: "input", dataType: "float", defaultValue: 10 },
+      { id: "jitter", name: "Jitter", direction: "input", dataType: "float", defaultValue: 1 }
+    ],
+    outputs: [
+      { id: "distance", name: "Distance", direction: "output", dataType: "float" },
+      { id: "cellId", name: "Cell ID", direction: "output", dataType: "float" }
+    ],
+    previewable: true
+  },
+  {
+    type: "noise_fbm",
+    category: "procedural",
+    name: "FBM Noise",
+    description: "Fractional Brownian Motion",
+    icon: "cloud",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      { id: "scale", name: "Scale", direction: "input", dataType: "float", defaultValue: 5 },
+      { id: "octaves", name: "Octaves", direction: "input", dataType: "int", defaultValue: 6 },
+      {
+        id: "lacunarity",
+        name: "Lacunarity",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 2
+      },
+      { id: "gain", name: "Gain", direction: "input", dataType: "float", defaultValue: 0.5 }
+    ],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "float" }],
+    previewable: true
+  },
+  {
+    type: "gradient_linear",
+    category: "procedural",
+    name: "Linear Gradient",
+    description: "Linear gradient",
+    icon: "arrow-right",
+    inputs: [{ id: "uv", name: "UV", direction: "input", dataType: "vec2" }],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "float" }],
+    properties: [
+      {
+        id: "direction",
+        name: "Direction",
+        type: "enum",
+        default: "horizontal",
+        options: [
+          { label: "Horizontal", value: "horizontal" },
+          { label: "Vertical", value: "vertical" },
+          { label: "Diagonal", value: "diagonal" }
+        ]
+      }
+    ],
+    previewable: true
+  },
+  {
+    type: "gradient_radial",
+    category: "procedural",
+    name: "Radial Gradient",
+    description: "Radial gradient",
+    icon: "circle",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      {
+        id: "center",
+        name: "Center",
+        direction: "input",
+        dataType: "vec2",
+        defaultValue: [0.5, 0.5]
+      },
+      { id: "radius", name: "Radius", direction: "input", dataType: "float", defaultValue: 0.5 }
+    ],
+    outputs: [{ id: "value", name: "Value", direction: "output", dataType: "float" }],
+    previewable: true
+  },
+  {
+    type: "checker",
+    category: "procedural",
+    name: "Checker",
+    description: "Checkerboard pattern",
+    icon: "grid",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      { id: "scale", name: "Scale", direction: "input", dataType: "float", defaultValue: 8 },
+      {
+        id: "colorA",
+        name: "Color A",
+        direction: "input",
+        dataType: "vec3",
+        defaultValue: [0, 0, 0]
+      },
+      {
+        id: "colorB",
+        name: "Color B",
+        direction: "input",
+        dataType: "vec3",
+        defaultValue: [1, 1, 1]
+      }
+    ],
+    outputs: [
+      { id: "color", name: "Color", direction: "output", dataType: "vec3" },
+      { id: "value", name: "Value", direction: "output", dataType: "float" }
+    ],
+    previewable: true
+  },
+  {
+    type: "brick",
+    category: "procedural",
+    name: "Brick",
+    description: "Brick pattern",
+    icon: "layout",
+    inputs: [
+      { id: "uv", name: "UV", direction: "input", dataType: "vec2" },
+      {
+        id: "brickWidth",
+        name: "Brick Width",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0.5
+      },
+      {
+        id: "brickHeight",
+        name: "Brick Height",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0.25
+      },
+      {
+        id: "mortarSize",
+        name: "Mortar Size",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0.02
+      }
+    ],
+    outputs: [
+      { id: "mask", name: "Mask", direction: "output", dataType: "float" },
+      { id: "brickId", name: "Brick ID", direction: "output", dataType: "vec2" }
+    ],
+    previewable: true
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   UTILITY NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const utilityNodes = [
-    {
-        type: 'lerp',
-        category: 'utility',
-        name: 'Lerp',
-        description: 'Linear interpolation',
-        icon: 'sliders',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'any', defaultValue: 0 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'any', defaultValue: 1 },
-            {
-                id: 't',
-                name: 'T',
-                direction: 'input',
-                dataType: 'float',
-                defaultValue: 0.5,
-                min: 0,
-                max: 1,
-            },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeA}} {{nodeId}}_result = mix({{a}}, {{b}}, {{t}});',
-    },
-    {
-        type: 'clamp',
-        category: 'utility',
-        name: 'Clamp',
-        description: 'Clamp value to range',
-        icon: 'minus-square',
-        inputs: [
-            { id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 },
-            { id: 'min', name: 'Min', direction: 'input', dataType: 'any', defaultValue: 0 },
-            { id: 'max', name: 'Max', direction: 'input', dataType: 'any', defaultValue: 1 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = clamp({{value}}, {{min}}, {{max}});',
-    },
-    {
-        type: 'saturate',
-        category: 'utility',
-        name: 'Saturate',
-        description: 'Clamp to 0-1',
-        icon: 'minimize-2',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = clamp({{value}}, 0.0, 1.0);',
-    },
-    {
-        type: 'remap',
-        category: 'utility',
-        name: 'Remap',
-        description: 'Remap value from one range to another',
-        icon: 'repeat',
-        inputs: [
-            { id: 'value', name: 'Value', direction: 'input', dataType: 'float', defaultValue: 0.5 },
-            { id: 'inMin', name: 'In Min', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'inMax', name: 'In Max', direction: 'input', dataType: 'float', defaultValue: 1 },
-            { id: 'outMin', name: 'Out Min', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'outMax', name: 'Out Max', direction: 'input', dataType: 'float', defaultValue: 1 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'float' }],
-    },
-    {
-        type: 'smoothstep',
-        category: 'utility',
-        name: 'Smoothstep',
-        description: 'Smooth Hermite interpolation',
-        icon: 'activity',
-        inputs: [
-            { id: 'edge0', name: 'Edge 0', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'edge1', name: 'Edge 1', direction: 'input', dataType: 'float', defaultValue: 1 },
-            { id: 'x', name: 'X', direction: 'input', dataType: 'float', defaultValue: 0.5 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'float' }],
-        shaderFunction: 'float {{nodeId}}_result = smoothstep({{edge0}}, {{edge1}}, {{x}});',
-    },
-    {
-        type: 'step',
-        category: 'utility',
-        name: 'Step',
-        description: 'Step function (threshold)',
-        icon: 'corner-down-right',
-        inputs: [
-            { id: 'edge', name: 'Edge', direction: 'input', dataType: 'any', defaultValue: 0.5 },
-            { id: 'x', name: 'X', direction: 'input', dataType: 'any', defaultValue: 0 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeEdge}} {{nodeId}}_result = step({{edge}}, {{x}});',
-    },
-    {
-        type: 'one_minus',
-        category: 'utility',
-        name: 'One Minus',
-        description: '1 - x',
-        icon: 'minus',
-        inputs: [{ id: 'value', name: 'Value', direction: 'input', dataType: 'any', defaultValue: 0 }],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-        shaderFunction: '{{typeValue}} {{nodeId}}_result = 1.0 - {{value}};',
-    },
-    {
-        type: 'fresnel',
-        category: 'utility',
-        name: 'Fresnel',
-        description: 'Fresnel effect',
-        icon: 'circle',
-        inputs: [
-            { id: 'normal', name: 'Normal', direction: 'input', dataType: 'vec3' },
-            { id: 'viewDir', name: 'View Dir', direction: 'input', dataType: 'vec3' },
-            { id: 'power', name: 'Power', direction: 'input', dataType: 'float', defaultValue: 5 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'float' }],
-        previewable: true,
-    },
+  {
+    type: "lerp",
+    category: "utility",
+    name: "Lerp",
+    description: "Linear interpolation",
+    icon: "sliders",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "any", defaultValue: 0 },
+      { id: "b", name: "B", direction: "input", dataType: "any", defaultValue: 1 },
+      {
+        id: "t",
+        name: "T",
+        direction: "input",
+        dataType: "float",
+        defaultValue: 0.5,
+        min: 0,
+        max: 1
+      }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeA}} {{nodeId}}_result = mix({{a}}, {{b}}, {{t}});"
+  },
+  {
+    type: "clamp",
+    category: "utility",
+    name: "Clamp",
+    description: "Clamp value to range",
+    icon: "minus-square",
+    inputs: [
+      { id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 },
+      { id: "min", name: "Min", direction: "input", dataType: "any", defaultValue: 0 },
+      { id: "max", name: "Max", direction: "input", dataType: "any", defaultValue: 1 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = clamp({{value}}, {{min}}, {{max}});"
+  },
+  {
+    type: "saturate",
+    category: "utility",
+    name: "Saturate",
+    description: "Clamp to 0-1",
+    icon: "minimize-2",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = clamp({{value}}, 0.0, 1.0);"
+  },
+  {
+    type: "remap",
+    category: "utility",
+    name: "Remap",
+    description: "Remap value from one range to another",
+    icon: "repeat",
+    inputs: [
+      { id: "value", name: "Value", direction: "input", dataType: "float", defaultValue: 0.5 },
+      { id: "inMin", name: "In Min", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "inMax", name: "In Max", direction: "input", dataType: "float", defaultValue: 1 },
+      { id: "outMin", name: "Out Min", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "outMax", name: "Out Max", direction: "input", dataType: "float", defaultValue: 1 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "float" }]
+  },
+  {
+    type: "smoothstep",
+    category: "utility",
+    name: "Smoothstep",
+    description: "Smooth Hermite interpolation",
+    icon: "activity",
+    inputs: [
+      { id: "edge0", name: "Edge 0", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "edge1", name: "Edge 1", direction: "input", dataType: "float", defaultValue: 1 },
+      { id: "x", name: "X", direction: "input", dataType: "float", defaultValue: 0.5 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "float" }],
+    shaderFunction: "float {{nodeId}}_result = smoothstep({{edge0}}, {{edge1}}, {{x}});"
+  },
+  {
+    type: "step",
+    category: "utility",
+    name: "Step",
+    description: "Step function (threshold)",
+    icon: "corner-down-right",
+    inputs: [
+      { id: "edge", name: "Edge", direction: "input", dataType: "any", defaultValue: 0.5 },
+      { id: "x", name: "X", direction: "input", dataType: "any", defaultValue: 0 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeEdge}} {{nodeId}}_result = step({{edge}}, {{x}});"
+  },
+  {
+    type: "one_minus",
+    category: "utility",
+    name: "One Minus",
+    description: "1 - x",
+    icon: "minus",
+    inputs: [{ id: "value", name: "Value", direction: "input", dataType: "any", defaultValue: 0 }],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }],
+    shaderFunction: "{{typeValue}} {{nodeId}}_result = 1.0 - {{value}};"
+  },
+  {
+    type: "fresnel",
+    category: "utility",
+    name: "Fresnel",
+    description: "Fresnel effect",
+    icon: "circle",
+    inputs: [
+      { id: "normal", name: "Normal", direction: "input", dataType: "vec3" },
+      { id: "viewDir", name: "View Dir", direction: "input", dataType: "vec3" },
+      { id: "power", name: "Power", direction: "input", dataType: "float", defaultValue: 5 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "float" }],
+    previewable: true
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   LOGIC NODES
-   ═══════════════════════════════════════════════════════════════════════════ */
 const logicNodes = [
-    {
-        type: 'branch',
-        category: 'logic',
-        name: 'Branch',
-        description: 'Conditional branch (if/else)',
-        icon: 'git-branch',
-        inputs: [
-            {
-                id: 'condition',
-                name: 'Condition',
-                direction: 'input',
-                dataType: 'bool',
-                defaultValue: false,
-            },
-            { id: 'true', name: 'True', direction: 'input', dataType: 'any' },
-            { id: 'false', name: 'False', direction: 'input', dataType: 'any' },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'any' }],
-    },
-    {
-        type: 'compare',
-        category: 'logic',
-        name: 'Compare',
-        description: 'Compare two values',
-        icon: 'git-pull-request',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'float', defaultValue: 0 },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'float', defaultValue: 0 },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'bool' }],
-        properties: [
-            {
-                id: 'operator',
-                name: 'Operator',
-                type: 'enum',
-                default: 'equal',
-                options: [
-                    { label: 'Equal', value: 'equal' },
-                    { label: 'Not Equal', value: 'notEqual' },
-                    { label: 'Greater', value: 'greater' },
-                    { label: 'Less', value: 'less' },
-                    { label: 'Greater Equal', value: 'greaterEqual' },
-                    { label: 'Less Equal', value: 'lessEqual' },
-                ],
-            },
-        ],
-    },
-    {
-        type: 'and',
-        category: 'logic',
-        name: 'And',
-        description: 'Logical AND',
-        icon: 'check-square',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'bool', defaultValue: false },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'bool', defaultValue: false },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'bool' }],
-    },
-    {
-        type: 'or',
-        category: 'logic',
-        name: 'Or',
-        description: 'Logical OR',
-        icon: 'check-square',
-        inputs: [
-            { id: 'a', name: 'A', direction: 'input', dataType: 'bool', defaultValue: false },
-            { id: 'b', name: 'B', direction: 'input', dataType: 'bool', defaultValue: false },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'bool' }],
-    },
-    {
-        type: 'not',
-        category: 'logic',
-        name: 'Not',
-        description: 'Logical NOT',
-        icon: 'x-square',
-        inputs: [
-            { id: 'value', name: 'Value', direction: 'input', dataType: 'bool', defaultValue: false },
-        ],
-        outputs: [{ id: 'result', name: 'Result', direction: 'output', dataType: 'bool' }],
-    },
+  {
+    type: "branch",
+    category: "logic",
+    name: "Branch",
+    description: "Conditional branch (if/else)",
+    icon: "git-branch",
+    inputs: [
+      {
+        id: "condition",
+        name: "Condition",
+        direction: "input",
+        dataType: "bool",
+        defaultValue: false
+      },
+      { id: "true", name: "True", direction: "input", dataType: "any" },
+      { id: "false", name: "False", direction: "input", dataType: "any" }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "any" }]
+  },
+  {
+    type: "compare",
+    category: "logic",
+    name: "Compare",
+    description: "Compare two values",
+    icon: "git-pull-request",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "float", defaultValue: 0 },
+      { id: "b", name: "B", direction: "input", dataType: "float", defaultValue: 0 }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "bool" }],
+    properties: [
+      {
+        id: "operator",
+        name: "Operator",
+        type: "enum",
+        default: "equal",
+        options: [
+          { label: "Equal", value: "equal" },
+          { label: "Not Equal", value: "notEqual" },
+          { label: "Greater", value: "greater" },
+          { label: "Less", value: "less" },
+          { label: "Greater Equal", value: "greaterEqual" },
+          { label: "Less Equal", value: "lessEqual" }
+        ]
+      }
+    ]
+  },
+  {
+    type: "and",
+    category: "logic",
+    name: "And",
+    description: "Logical AND",
+    icon: "check-square",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "bool", defaultValue: false },
+      { id: "b", name: "B", direction: "input", dataType: "bool", defaultValue: false }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "bool" }]
+  },
+  {
+    type: "or",
+    category: "logic",
+    name: "Or",
+    description: "Logical OR",
+    icon: "check-square",
+    inputs: [
+      { id: "a", name: "A", direction: "input", dataType: "bool", defaultValue: false },
+      { id: "b", name: "B", direction: "input", dataType: "bool", defaultValue: false }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "bool" }]
+  },
+  {
+    type: "not",
+    category: "logic",
+    name: "Not",
+    description: "Logical NOT",
+    icon: "x-square",
+    inputs: [
+      { id: "value", name: "Value", direction: "input", dataType: "bool", defaultValue: false }
+    ],
+    outputs: [{ id: "result", name: "Result", direction: "output", dataType: "bool" }]
+  }
 ];
-/* ═══════════════════════════════════════════════════════════════════════════
-   EXPORTS
-   ═══════════════════════════════════════════════════════════════════════════ */
-/** All built-in node definitions */
-const MATERIAL_NODE_DEFINITIONS = 
-/* @__PURE__ */ (function () {
-    return [
-        ...inputNodes,
-        ...outputNodes,
-        ...mathNodes,
-        ...vectorNodes,
-        ...colorNodes,
-        ...textureNodes,
-        ...proceduralNodes,
-        ...utilityNodes,
-        ...logicNodes,
-    ];
+const MATERIAL_NODE_DEFINITIONS = /* @__PURE__ */ (function() {
+  return [
+    ...inputNodes,
+    ...outputNodes,
+    ...mathNodes,
+    ...vectorNodes,
+    ...colorNodes,
+    ...textureNodes,
+    ...proceduralNodes,
+    ...utilityNodes,
+    ...logicNodes
+  ];
 })();
-/** Node definitions map by type */
-const MATERIAL_NODE_MAP = new Map(MATERIAL_NODE_DEFINITIONS.map((def) => [def.type, def]));
-/** Get nodes by category */
+const MATERIAL_NODE_MAP = new Map(
+  MATERIAL_NODE_DEFINITIONS.map((def) => [def.type, def])
+);
 function getNodesByCategory(category) {
-    return MATERIAL_NODE_DEFINITIONS.filter((def) => def.category === category);
+  return MATERIAL_NODE_DEFINITIONS.filter((def) => def.category === category);
 }
-/** Search nodes by name/description */
 function searchNodes(query) {
-    const lowerQuery = query.toLowerCase();
-    return MATERIAL_NODE_DEFINITIONS.filter((def) => def.name.toLowerCase().includes(lowerQuery) ||
-        def.description.toLowerCase().includes(lowerQuery) ||
-        def.type.toLowerCase().includes(lowerQuery));
+  const lowerQuery = query.toLowerCase();
+  return MATERIAL_NODE_DEFINITIONS.filter(
+    (def) => def.name.toLowerCase().includes(lowerQuery) || def.description.toLowerCase().includes(lowerQuery) || def.type.toLowerCase().includes(lowerQuery)
+  );
 }
-
-export { MATERIAL_NODE_DEFINITIONS, MATERIAL_NODE_MAP, getNodesByCategory, searchNodes };
+export {
+  MATERIAL_NODE_DEFINITIONS,
+  MATERIAL_NODE_MAP,
+  getNodesByCategory,
+  searchNodes
+};