@next2d/webgpu 3.0.4 → 3.1.0

package/src/Shader/wgsl/fragment/BasicFragment.js

@@ -1,3 +1,10 @@
+/**
+ * @description 頂点カラーをそのまま出力する基本フラグメントシェーダー
+ *              Basic fragment shader that outputs vertex color directly
+ *
+ * @type {string}
+ * @constant
+ */
 export const BasicFragment = /* wgsl */ `
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,
@@ -10,6 +17,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return input.color;
 }
 `;
+/**
+ * @description テクスチャサンプリングと頂点カラーを乗算するフラグメントシェーダー
+ *              Fragment shader that multiplies texture sampling with vertex color
+ *
+ * @type {string}
+ * @constant
+ */
 export const TextureFragment = /* wgsl */ `
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,

package/src/Shader/wgsl/fragment/BitmapFragment.d.ts

@@ -1 +1,8 @@
+/**
+ * @description ビットマップ塗りフラグメントシェーダー（ベジェクリッピング・リピート対応）
+ *              Bitmap fill fragment shader with bezier clipping and repeat support
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const BitmapFillFragment = "\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) bezier: vec2<f32>,\n    @location(1) color: vec4<f32>,\n    @location(2) worldPos: vec2<f32>,\n}\n\nstruct BitmapUniforms {\n    bitmapMatrix: mat3x3<f32>,\n    textureWidth: f32,\n    textureHeight: f32,\n    repeat: f32,\n    _pad: f32,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: BitmapUniforms;\n@group(0) @binding(1) var bitmapSampler: sampler;\n@group(0) @binding(2) var bitmapTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let u = input.bezier.x;\n    let v = input.bezier.y;\n    if (abs(u - 0.5) > 0.001 || abs(v - 0.5) > 0.001) {\n        let d = u * u - v;\n        if (d > 0.0) {\n            discard;\n        }\n    }\n    let transformedPos = uniforms.bitmapMatrix * vec3<f32>(input.worldPos, 1.0);\n    var uv = vec2<f32>(\n        transformedPos.x / uniforms.textureWidth,\n        transformedPos.y / uniforms.textureHeight\n    );\n    if (uniforms.repeat > 0.5) {\n        uv = fract(uv);\n    }\n    let bitmapColor = textureSampleLevel(bitmapTexture, bitmapSampler, uv, 0);\n    let alpha = bitmapColor.a * input.color.a;\n    return vec4<f32>(bitmapColor.rgb * input.color.a, alpha);\n}\n";

package/src/Shader/wgsl/fragment/BitmapFragment.js

@@ -1,3 +1,10 @@
+/**
+ * @description ビットマップ塗りフラグメントシェーダー（ベジェクリッピング・リピート対応）
+ *              Bitmap fill fragment shader with bezier clipping and repeat support
+ *
+ * @type {string}
+ * @constant
+ */
 export const BitmapFillFragment = /* wgsl */ `
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,

package/src/Shader/wgsl/fragment/EffectFragment.d.ts

@@ -1,6 +1,48 @@
+/**
+ * @description グローフィルター用フラグメントシェーダー（内側・外側・ノックアウト対応）
+ *              Glow filter fragment shader with inner, outer, and knockout support
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const GlowFilterFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\noverride IS_INNER: u32 = 0u;\noverride IS_KNOCKOUT: u32 = 0u;\n\nstruct GlowUniforms {\n    color: vec4<f32>,\n    baseScale: vec2<f32>,\n    baseOffset: vec2<f32>,\n    blurScale: vec2<f32>,\n    blurOffset: vec2<f32>,\n    strength: f32,\n    _padding1: f32,\n    _padding2: f32,\n    _padding3: f32,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: GlowUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var blurTexture: texture_2d<f32>;\n@group(0) @binding(3) var baseTexture: texture_2d<f32>;\n\nfn isInside(uv: vec2<f32>) -> f32 {\n    let s = step(vec2<f32>(0.0), uv) * step(uv, vec2<f32>(1.0));\n    return s.x * s.y;\n}\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let baseUV = input.texCoord * uniforms.baseScale - uniforms.baseOffset;\n    let baseColor = textureSampleLevel(baseTexture, textureSampler, baseUV, 0) * isInside(baseUV);\n\n    let blurUV = input.texCoord * uniforms.blurScale - uniforms.blurOffset;\n    let blurColor = textureSampleLevel(blurTexture, textureSampler, blurUV, 0) * isInside(blurUV);\n\n    var rawAlpha = blurColor.a;\n    if (IS_INNER == 1u) {\n        rawAlpha = 1.0 - rawAlpha;\n    }\n    let glowAlpha = clamp(rawAlpha * uniforms.strength, 0.0, 1.0);\n    let glowColor = vec4<f32>(uniforms.color.rgb * glowAlpha, uniforms.color.a * glowAlpha);\n    if (IS_INNER == 1u) {\n        let innerGlow = glowColor * baseColor.a;\n        if (IS_KNOCKOUT == 1u) {\n            return innerGlow;\n        } else {\n            return innerGlow + baseColor * (1.0 - glowColor.a);\n        }\n    } else {\n        if (IS_KNOCKOUT == 1u) {\n            return glowColor * (1.0 - baseColor.a);\n        } else {\n            return baseColor + glowColor * (1.0 - baseColor.a);\n        }\n    }\n}\n";
+/**
+ * @description ドロップシャドウフィルター用フラグメントシェーダー（内側・外側・ノックアウト・非表示対応）
+ *              Drop shadow filter fragment shader with inner, outer, knockout, and hide-object support
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const DropShadowFilterFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\noverride IS_INNER: u32 = 0u;\noverride IS_KNOCKOUT: u32 = 0u;\noverride IS_HIDE_OBJECT: u32 = 0u;\n\nstruct DropShadowUniforms {\n    color: vec4<f32>,\n    baseScale: vec2<f32>,\n    baseOffset: vec2<f32>,\n    blurScale: vec2<f32>,\n    blurOffset: vec2<f32>,\n    strength: f32,\n    _padding1: f32,\n    _padding2: f32,\n    _padding3: f32,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: DropShadowUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var blurTexture: texture_2d<f32>;\n@group(0) @binding(3) var baseTexture: texture_2d<f32>;\n\nfn isInside(uv: vec2<f32>) -> f32 {\n    let s = step(vec2<f32>(0.0), uv) * step(uv, vec2<f32>(1.0));\n    return s.x * s.y;\n}\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let baseUV = input.texCoord * uniforms.baseScale - uniforms.baseOffset;\n    let baseColor = textureSampleLevel(baseTexture, textureSampler, baseUV, 0) * isInside(baseUV);\n\n    let blurUV = input.texCoord * uniforms.blurScale - uniforms.blurOffset;\n    let blur = textureSampleLevel(blurTexture, textureSampler, blurUV, 0) * isInside(blurUV);\n\n    var rawAlpha = blur.a;\n    if (IS_INNER == 1u) {\n        rawAlpha = 1.0 - rawAlpha;\n    }\n    let shadowAlpha = clamp(rawAlpha * uniforms.strength, 0.0, 1.0);\n    let shadowColor = vec4<f32>(uniforms.color.rgb * shadowAlpha, uniforms.color.a * shadowAlpha);\n\n    if (IS_INNER == 1u) {\n        let innerShadow = shadowColor * baseColor.a;\n        if (IS_KNOCKOUT == 1u) {\n            return innerShadow;\n        } else {\n            return innerShadow + baseColor * (1.0 - shadowColor.a);\n        }\n    } else {\n        if (IS_HIDE_OBJECT == 1u) {\n            return shadowColor;\n        } else if (IS_KNOCKOUT == 1u) {\n            return shadowColor * (1.0 - baseColor.a);\n        } else {\n            return shadowColor * (1.0 - baseColor.a) + baseColor;\n        }\n    }\n}\n";
+/**
+ * @description グラデーショングローフィルター用フラグメントシェーダー（LUTベース）
+ *              Gradient glow filter fragment shader using LUT
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const GradientGlowFilterFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\noverride GLOW_TYPE: u32 = 0u;\noverride IS_KNOCKOUT: u32 = 0u;\n\nstruct GradientGlowUniforms {\n    strength: f32,\n    _padding1: f32,\n    _padding2: f32,\n    _padding3: f32,\n    baseScale: vec2<f32>,\n    baseOffset: vec2<f32>,\n    blurScale: vec2<f32>,\n    blurOffset: vec2<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: GradientGlowUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var blurTexture: texture_2d<f32>;\n@group(0) @binding(3) var baseTexture: texture_2d<f32>;\n@group(0) @binding(4) var gradientLUT: texture_2d<f32>;\n\nfn isInside(uv: vec2<f32>) -> f32 {\n    let s = step(vec2<f32>(0.0), uv) * step(uv, vec2<f32>(1.0));\n    return s.x * s.y;\n}\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let baseUV = input.texCoord * uniforms.baseScale - uniforms.baseOffset;\n    let base = textureSampleLevel(baseTexture, textureSampler, baseUV, 0) * isInside(baseUV);\n\n    let blurUV = input.texCoord * uniforms.blurScale - uniforms.blurOffset;\n    var blur = textureSampleLevel(blurTexture, textureSampler, blurUV, 0) * isInside(blurUV);\n\n    blur.a = clamp(blur.a * uniforms.strength, 0.0, 1.0);\n    let glowColor = textureSampleLevel(gradientLUT, textureSampler, vec2<f32>(blur.a, 0.5), 0);\n    var result: vec4<f32>;\n    if (GLOW_TYPE == 0u) {\n        if (IS_KNOCKOUT == 1u) {\n            result = glowColor;\n        } else {\n            result = base - base * glowColor.a + glowColor;\n        }\n    } else if (GLOW_TYPE == 1u) {\n        if (IS_KNOCKOUT == 1u) {\n            result = glowColor * base.a;\n        } else {\n            result = glowColor * base.a + base * (1.0 - glowColor.a);\n        }\n    } else {\n        if (IS_KNOCKOUT == 1u) {\n            result = glowColor - glowColor * base.a;\n        } else {\n            result = base + glowColor - glowColor * base.a;\n        }\n    }\n    return result;\n}\n";
+/**
+ * @description グラデーションベベルフィルター用フラグメントシェーダー（LUTベース）
+ *              Gradient bevel filter fragment shader using LUT
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const GradientBevelFilterFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\noverride BEVEL_TYPE: u32 = 0u;\noverride IS_KNOCKOUT: u32 = 0u;\n\nstruct GradientBevelUniforms {\n    strength: f32,\n    _padding1: f32,\n    _padding2: f32,\n    _padding3: f32,\n    baseScale: vec2<f32>,\n    baseOffset: vec2<f32>,\n    blurScale: vec2<f32>,\n    blurOffset: vec2<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: GradientBevelUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var blurTexture: texture_2d<f32>;\n@group(0) @binding(3) var baseTexture: texture_2d<f32>;\n@group(0) @binding(4) var gradientLUT: texture_2d<f32>;\n\nfn isInside(uv: vec2<f32>) -> f32 {\n    let s = step(vec2<f32>(0.0), uv) * step(uv, vec2<f32>(1.0));\n    return s.x * s.y;\n}\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let baseUV = input.texCoord * uniforms.baseScale - uniforms.baseOffset;\n    let base = textureSampleLevel(baseTexture, textureSampler, baseUV, 0) * isInside(baseUV);\n\n    let blurUV = input.texCoord * uniforms.blurScale - uniforms.blurOffset;\n    let blur1 = textureSampleLevel(blurTexture, textureSampler, blurUV, 0) * isInside(blurUV);\n\n    let mirrorUV = (1.0 - input.texCoord) * uniforms.blurScale - uniforms.blurOffset;\n    let blur2 = textureSampleLevel(blurTexture, textureSampler, mirrorUV, 0) * isInside(mirrorUV);\n\n    var highlightAlpha = blur1.a - blur2.a;\n    var shadowAlpha = blur2.a - blur1.a;\n    highlightAlpha = clamp(highlightAlpha * uniforms.strength, 0.0, 1.0);\n    shadowAlpha = clamp(shadowAlpha * uniforms.strength, 0.0, 1.0);\n\n    let lutCoord = 0.5019607843137255 - 0.5019607843137255 * shadowAlpha + 0.4980392156862745 * highlightAlpha;\n    let bevelColor = textureSampleLevel(gradientLUT, textureSampler, vec2<f32>(lutCoord, 0.5), 0);\n\n    var result: vec4<f32>;\n    if (BEVEL_TYPE == 0u) {\n        if (IS_KNOCKOUT == 1u) {\n            result = bevelColor;\n        } else {\n            result = base - base * bevelColor.a + bevelColor;\n        }\n    } else if (BEVEL_TYPE == 1u) {\n        if (IS_KNOCKOUT == 1u) {\n            result = bevelColor * base.a;\n        } else {\n            result = bevelColor * base.a + base * (1.0 - bevelColor.a);\n        }\n    } else {\n        if (IS_KNOCKOUT == 1u) {\n            result = bevelColor - bevelColor * base.a;\n        } else {\n            result = base + bevelColor - bevelColor * base.a;\n        }\n    }\n\n    return result;\n}\n";
+/**
+ * @description ベベルフィルター用フラグメントシェーダー（ハイライト・シャドウカラー指定）
+ *              Bevel filter fragment shader with highlight and shadow color specification
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const BevelFilterFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\noverride BEVEL_TYPE: u32 = 0u;\noverride IS_KNOCKOUT: u32 = 0u;\n\nstruct BevelUniforms {\n    highlightColor: vec4<f32>,\n    shadowColor: vec4<f32>,\n    strength: f32,\n    _padding1: f32,\n    _padding2: f32,\n    _padding3: f32,\n    baseScale: vec2<f32>,\n    baseOffset: vec2<f32>,\n    blurScale: vec2<f32>,\n    blurOffset: vec2<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: BevelUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var blurTexture: texture_2d<f32>;\n@group(0) @binding(3) var baseTexture: texture_2d<f32>;\n\nfn isInside(uv: vec2<f32>) -> f32 {\n    let s = step(vec2<f32>(0.0), uv) * step(uv, vec2<f32>(1.0));\n    return s.x * s.y;\n}\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let baseUV = input.texCoord * uniforms.baseScale - uniforms.baseOffset;\n    let base = textureSampleLevel(baseTexture, textureSampler, baseUV, 0) * isInside(baseUV);\n\n    let blurUV = input.texCoord * uniforms.blurScale - uniforms.blurOffset;\n    let blur1 = textureSampleLevel(blurTexture, textureSampler, blurUV, 0) * isInside(blurUV);\n\n    let mirrorUV = (1.0 - input.texCoord) * uniforms.blurScale - uniforms.blurOffset;\n    let blur2 = textureSampleLevel(blurTexture, textureSampler, mirrorUV, 0) * isInside(mirrorUV);\n\n    var highlightAlpha = blur1.a - blur2.a;\n    var shadowAlpha = blur2.a - blur1.a;\n    highlightAlpha = clamp(highlightAlpha * uniforms.strength, 0.0, 1.0);\n    shadowAlpha = clamp(shadowAlpha * uniforms.strength, 0.0, 1.0);\n\n    let bevelColor = uniforms.highlightColor * highlightAlpha + uniforms.shadowColor * shadowAlpha;\n    var result: vec4<f32>;\n    if (BEVEL_TYPE == 0u) {\n        if (IS_KNOCKOUT == 1u) {\n            result = bevelColor;\n        } else {\n            result = base - base * bevelColor.a + bevelColor;\n        }\n    } else if (BEVEL_TYPE == 1u) {\n        if (IS_KNOCKOUT == 1u) {\n            result = bevelColor * base.a;\n        } else {\n            result = bevelColor * base.a + base * (1.0 - bevelColor.a);\n        }\n    } else {\n        if (IS_KNOCKOUT == 1u) {\n            result = bevelColor - bevelColor * base.a;\n        } else {\n            result = base + bevelColor - bevelColor * base.a;\n        }\n    }\n\n    return result;\n}\n";
+/**
+ * @description ベベルフィルターのベース処理用フラグメントシェーダー（オフセット差分計算）
+ *              Bevel filter base fragment shader for offset difference calculation
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const BevelBaseFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\nstruct BevelBaseUniforms {\n    offset: vec2<f32>,\n    _padding: vec2<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: BevelBaseUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var sourceTexture: texture_2d<f32>;\n\nfn isInside(uv: vec2<f32>) -> f32 {\n    let s = step(vec2<f32>(0.0), uv) * step(uv, vec2<f32>(1.0));\n    return s.x * s.y;\n}\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let original = textureSampleLevel(sourceTexture, textureSampler, input.texCoord, 0);\n    let shiftedUV = input.texCoord - uniforms.offset;\n    let shifted = textureSampleLevel(sourceTexture, textureSampler, shiftedUV, 0) * isInside(shiftedUV);\n    return original * (1.0 - shifted.a);\n}\n";

package/src/Shader/wgsl/fragment/EffectFragment.js

@@ -1,4 +1,11 @@
 import { WgslIsInside, WgslVertexOutput } from "../common/SharedWgsl";
+/**
+ * @description グローフィルター用フラグメントシェーダー（内側・外側・ノックアウト対応）
+ *              Glow filter fragment shader with inner, outer, and knockout support
+ *
+ * @type {string}
+ * @constant
+ */
 export const GlowFilterFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -53,6 +60,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     }
 }
 `;
+/**
+ * @description ドロップシャドウフィルター用フラグメントシェーダー（内側・外側・ノックアウト・非表示対応）
+ *              Drop shadow filter fragment shader with inner, outer, knockout, and hide-object support
+ *
+ * @type {string}
+ * @constant
+ */
 export const DropShadowFilterFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -111,6 +125,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     }
 }
 `;
+/**
+ * @description グラデーショングローフィルター用フラグメントシェーダー（LUTベース）
+ *              Gradient glow filter fragment shader using LUT
+ *
+ * @type {string}
+ * @constant
+ */
 export const GradientGlowFilterFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -168,6 +189,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return result;
 }
 `;
+/**
+ * @description グラデーションベベルフィルター用フラグメントシェーダー（LUTベース）
+ *              Gradient bevel filter fragment shader using LUT
+ *
+ * @type {string}
+ * @constant
+ */
 export const GradientBevelFilterFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -235,6 +263,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return result;
 }
 `;
+/**
+ * @description ベベルフィルター用フラグメントシェーダー（ハイライト・シャドウカラー指定）
+ *              Bevel filter fragment shader with highlight and shadow color specification
+ *
+ * @type {string}
+ * @constant
+ */
 export const BevelFilterFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -301,6 +336,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return result;
 }
 `;
+/**
+ * @description ベベルフィルターのベース処理用フラグメントシェーダー（オフセット差分計算）
+ *              Bevel filter base fragment shader for offset difference calculation
+ *
+ * @type {string}
+ * @constant
+ */
 export const BevelBaseFragment = /* wgsl */ `
 ${WgslVertexOutput}
 

package/src/Shader/wgsl/fragment/FillFragment.d.ts

@@ -1 +1,8 @@
+/**
+ * @description ベジェ曲線ベースのアンチエイリアス付き塗りフラグメントシェーダー
+ *              Bezier curve-based fill fragment shader with anti-aliasing
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const FillFragment = "\nstruct FragmentInput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) bezier: vec2<f32>,\n    @location(1) color: vec4<f32>,\n}\n\n@fragment\nfn main(input: FragmentInput) -> @location(0) vec4<f32> {\n    let f_val = input.bezier.x * input.bezier.x - input.bezier.y;\n    let dx = dpdx(f_val);\n    let dy = dpdy(f_val);\n\n    if (input.bezier.x == 0.5 && input.bezier.y == 0.5) {\n        return vec4<f32>(input.color.rgb * input.color.a, input.color.a);\n    }\n\n    let dist = f_val * inverseSqrt(dx * dx + dy * dy);\n    let coverage = smoothstep(0.5, -0.5, dist);\n\n    if (coverage <= 0.001) {\n        discard;\n    }\n\n    let finalAlpha = input.color.a * min(coverage, 1.0);\n    return vec4<f32>(input.color.rgb * finalAlpha, finalAlpha);\n}\n";

package/src/Shader/wgsl/fragment/FillFragment.js

@@ -1,3 +1,10 @@
+/**
+ * @description ベジェ曲線ベースのアンチエイリアス付き塗りフラグメントシェーダー
+ *              Bezier curve-based fill fragment shader with anti-aliasing
+ *
+ * @type {string}
+ * @constant
+ */
 export const FillFragment = /* wgsl */ `
 struct FragmentInput {
     @builtin(position) position: vec4<f32>,

package/src/Shader/wgsl/fragment/FilterFragment.d.ts

@@ -1,10 +1,80 @@
+/**
+ * @description テクスチャコピー用フラグメントシェーダー（スケール・オフセット付き）
+ *              Texture copy fragment shader with scale and offset
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const TextureCopyFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\nstruct CopyUniforms {\n    scale: vec2<f32>,\n    offset: vec2<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: CopyUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var inputTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let uv = input.texCoord * uniforms.scale + uniforms.offset;\n    return textureSampleLevel(inputTexture, textureSampler, uv, 0);\n}\n";
+/**
+ * @description ブラー用テクスチャコピーフラグメントシェーダー（境界クランプ付き）
+ *              Blur texture copy fragment shader with boundary clamping
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const BlurTextureCopyFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\nstruct CopyUniforms {\n    scale: vec2<f32>,\n    offset: vec2<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: CopyUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var inputTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let uv = (input.texCoord - uniforms.offset) * uniforms.scale;\n    let clampedUv = clamp(uv, vec2<f32>(0.0), vec2<f32>(1.0));\n    let color = textureSampleLevel(inputTexture, textureSampler, clampedUv, 0);\n    let inBounds = uv.x >= 0.0 && uv.x <= 1.0 && uv.y >= 0.0 && uv.y <= 1.0;\n    return select(vec4<f32>(0.0, 0.0, 0.0, 0.0), color, inBounds);\n}\n";
+/**
+ * @description フィルター出力用フラグメントシェーダー（境界チェック付きコピー）
+ *              Filter output fragment shader with boundary-checked copy
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const FilterOutputFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\nstruct CopyUniforms {\n    scale: vec2<f32>,\n    offset: vec2<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: CopyUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var inputTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let uv = input.texCoord * uniforms.scale + uniforms.offset;\n    let clampedUv = clamp(uv, vec2<f32>(0.0), vec2<f32>(1.0));\n    let color = textureSampleLevel(inputTexture, textureSampler, clampedUv, 0);\n    let inBounds = uv.x >= 0.0 && uv.x <= 1.0 && uv.y >= 0.0 && uv.y <= 1.0;\n    return select(vec4<f32>(0.0, 0.0, 0.0, 0.0), color, inBounds);\n}\n";
+/**
+ * @description カラー変換フラグメントシェーダー（乗算・加算カラー適用）
+ *              Color transform fragment shader with multiply and add color application
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const ColorTransformFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\nstruct ColorTransformUniforms {\n    mul: vec4<f32>,\n    add: vec4<f32>,\n}\n\n@group(0) @binding(0) var<uniform> ct: ColorTransformUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var inputTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    var color = textureSampleLevel(inputTexture, textureSampler, input.texCoord, 0);\n\n    color = vec4<f32>(color.rgb / max(vec3<f32>(0.0001), vec3<f32>(color.a)), color.a);\n    color = clamp(color * ct.mul + ct.add, vec4<f32>(0.0), vec4<f32>(1.0));\n    color = vec4<f32>(color.rgb * color.a, color.a);\n\n    return color;\n}\n";
+/**
+ * @description Y軸反転付きカラー変換フラグメントシェーダー
+ *              Y-flip color transform fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const YFlipColorTransformFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\nstruct YFlipCTUniforms {\n    scale: vec2<f32>,\n    offset: vec2<f32>,\n    mul: vec4<f32>,\n    add: vec4<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: YFlipCTUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var inputTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let uv = input.texCoord * uniforms.scale + uniforms.offset;\n    var color = textureSampleLevel(inputTexture, textureSampler, uv, 0);\n\n    color = vec4<f32>(color.rgb / max(vec3<f32>(0.0001), vec3<f32>(color.a)), color.a);\n    color = clamp(color * uniforms.mul + uniforms.add, vec4<f32>(0.0), vec4<f32>(1.0));\n    color = vec4<f32>(color.rgb * color.a, color.a);\n\n    return color;\n}\n";
+/**
+ * @description カラーマトリクスフィルター用フラグメントシェーダー
+ *              Color matrix filter fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const ColorMatrixFilterFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\nstruct ColorMatrixUniforms {\n    matrix: mat4x4<f32>,\n    offset: vec4<f32>,\n}\n\n@group(0) @binding(0) var<uniform> uniforms: ColorMatrixUniforms;\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var inputTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    var color = textureSampleLevel(inputTexture, textureSampler, input.texCoord, 0);\n\n    color = vec4<f32>(color.rgb / max(vec3<f32>(0.0001), vec3<f32>(color.a)), color.a);\n    var result = uniforms.matrix * color + uniforms.offset;\n    result = clamp(result, vec4<f32>(0.0), vec4<f32>(1.0));\n    result = vec4<f32>(result.rgb * result.a, result.a);\n\n    return result;\n}\n";
+/**
+ * @description ノードクリア用フラグメントシェーダー（透明色出力）
+ *              Node clear fragment shader that outputs transparent color
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const NodeClearFragment = "\n@fragment\nfn main() -> @location(0) vec4<f32> {\n    return vec4<f32>(0.0, 0.0, 0.0, 0.0);\n}\n";
+/**
+ * @description 位置指定テクスチャサンプリング用フラグメントシェーダー
+ *              Positioned texture sampling fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const PositionedTextureFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var inputTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    return textureSampleLevel(inputTexture, textureSampler, input.texCoord, 0);\n}\n";
+/**
+ * @description ビットマップ同期用フラグメントシェーダー（テクスチャ直接サンプリング）
+ *              Bitmap sync fragment shader with direct texture sampling
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const BitmapSyncFragment = "\n\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n}\n\n@group(0) @binding(1) var textureSampler: sampler;\n@group(0) @binding(2) var inputTexture: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    return textureSampleLevel(inputTexture, textureSampler, input.texCoord, 0);\n}\n";
+/**
+ * @description 汎用ブレンドフラグメントシェーダー（Normal/Multiply/Screen/Add）
+ *              Generic blend fragment shader supporting Normal, Multiply, Screen, and Add modes
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const BlendGenericFragment = "\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n    @location(1) color: vec4<f32>,\n}\n\nstruct BlendUniforms {\n    blendMode: f32,\n}\n\n@group(0) @binding(1) var<uniform> blend: BlendUniforms;\n@group(0) @binding(2) var srcSampler: sampler;\n@group(0) @binding(3) var srcTexture: texture_2d<f32>;\n@group(0) @binding(4) var dstSampler: sampler;\n@group(0) @binding(5) var dstTexture: texture_2d<f32>;\n\nfn blendNormal(src: vec4<f32>, dst: vec4<f32>) -> vec4<f32> {\n    return src;\n}\n\nfn blendMultiply(src: vec4<f32>, dst: vec4<f32>) -> vec4<f32> {\n    return src * dst;\n}\n\nfn blendScreen(src: vec4<f32>, dst: vec4<f32>) -> vec4<f32> {\n    return src + dst - src * dst;\n}\n\nfn blendAdd(src: vec4<f32>, dst: vec4<f32>) -> vec4<f32> {\n    return min(src + dst, vec4<f32>(1.0));\n}\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let src = textureSampleLevel(srcTexture, srcSampler, input.texCoord, 0);\n    let dst = textureSampleLevel(dstTexture, dstSampler, input.texCoord, 0);\n    var result: vec4<f32>;\n    if (blend.blendMode < 0.5) {\n        result = blendNormal(src, dst);\n    } else if (blend.blendMode < 1.5) {\n        result = blendMultiply(src, dst);\n    } else if (blend.blendMode < 2.5) {\n        result = blendScreen(src, dst);\n    } else {\n        result = blendAdd(src, dst);\n    }\n    return result * input.color;\n}\n";

package/src/Shader/wgsl/fragment/FilterFragment.js

@@ -1,4 +1,11 @@
 import { WgslVertexOutput } from "../common/SharedWgsl";
+/**
+ * @description テクスチャコピー用フラグメントシェーダー（スケール・オフセット付き）
+ *              Texture copy fragment shader with scale and offset
+ *
+ * @type {string}
+ * @constant
+ */
 export const TextureCopyFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -17,6 +24,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return textureSampleLevel(inputTexture, textureSampler, uv, 0);
 }
 `;
+/**
+ * @description ブラー用テクスチャコピーフラグメントシェーダー（境界クランプ付き）
+ *              Blur texture copy fragment shader with boundary clamping
+ *
+ * @type {string}
+ * @constant
+ */
 export const BlurTextureCopyFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -38,6 +52,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return select(vec4<f32>(0.0, 0.0, 0.0, 0.0), color, inBounds);
 }
 `;
+/**
+ * @description フィルター出力用フラグメントシェーダー（境界チェック付きコピー）
+ *              Filter output fragment shader with boundary-checked copy
+ *
+ * @type {string}
+ * @constant
+ */
 export const FilterOutputFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -59,6 +80,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return select(vec4<f32>(0.0, 0.0, 0.0, 0.0), color, inBounds);
 }
 `;
+/**
+ * @description カラー変換フラグメントシェーダー（乗算・加算カラー適用）
+ *              Color transform fragment shader with multiply and add color application
+ *
+ * @type {string}
+ * @constant
+ */
 export const ColorTransformFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -82,6 +110,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return color;
 }
 `;
+/**
+ * @description Y軸反転付きカラー変換フラグメントシェーダー
+ *              Y-flip color transform fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export const YFlipColorTransformFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -108,6 +143,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return color;
 }
 `;
+/**
+ * @description カラーマトリクスフィルター用フラグメントシェーダー
+ *              Color matrix filter fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export const ColorMatrixFilterFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -132,12 +174,26 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return result;
 }
 `;
+/**
+ * @description ノードクリア用フラグメントシェーダー（透明色出力）
+ *              Node clear fragment shader that outputs transparent color
+ *
+ * @type {string}
+ * @constant
+ */
 export const NodeClearFragment = /* wgsl */ `
 @fragment
 fn main() -> @location(0) vec4<f32> {
     return vec4<f32>(0.0, 0.0, 0.0, 0.0);
 }
 `;
+/**
+ * @description 位置指定テクスチャサンプリング用フラグメントシェーダー
+ *              Positioned texture sampling fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export const PositionedTextureFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -149,6 +205,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return textureSampleLevel(inputTexture, textureSampler, input.texCoord, 0);
 }
 `;
+/**
+ * @description ビットマップ同期用フラグメントシェーダー（テクスチャ直接サンプリング）
+ *              Bitmap sync fragment shader with direct texture sampling
+ *
+ * @type {string}
+ * @constant
+ */
 export const BitmapSyncFragment = /* wgsl */ `
 ${WgslVertexOutput}
 
@@ -160,6 +223,13 @@ fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     return textureSampleLevel(inputTexture, textureSampler, input.texCoord, 0);
 }
 `;
+/**
+ * @description 汎用ブレンドフラグメントシェーダー（Normal/Multiply/Screen/Add）
+ *              Generic blend fragment shader supporting Normal, Multiply, Screen, and Add modes
+ *
+ * @type {string}
+ * @constant
+ */
 export const BlendGenericFragment = /* wgsl */ `
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,

package/src/Shader/wgsl/fragment/GradientFragment.d.ts

@@ -1,3 +1,24 @@
+/**
+ * @description グラデーション塗りフラグメントシェーダー（頂点カラー乗算付き）
+ *              Gradient fill fragment shader with vertex color multiplication
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const GradientFillFragment = "\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) v_uv: vec2<f32>,\n    @location(1) bezier: vec2<f32>,\n    @location(2) color: vec4<f32>,\n}\n\nstruct GradientUniforms {\n    inverseMatrix: mat3x3<f32>,\n    gradientType: f32,\n    focal: f32,\n    spread: f32,\n    radius: f32,\n    linearPoints: vec4<f32>,\n}\n\n@group(0) @binding(0) var<uniform> gradient: GradientUniforms;\n@group(0) @binding(1) var gradientSampler: sampler;\n@group(0) @binding(2) var gradientTexture: texture_2d<f32>;\n\noverride GRADIENT_TYPE: u32 = 0u;\noverride SPREAD_MODE: u32 = 2u;\n\nfn applySpread(t: f32) -> f32 {\n    if (SPREAD_MODE == 0u) {\n        return 1.0 - abs(fract(t * 0.5) * 2.0 - 1.0);\n    } else if (SPREAD_MODE == 1u) {\n        return fract(t);\n    } else {\n        return clamp(t, 0.0, 1.0);\n    }\n}\n\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let p = input.v_uv;\n\n    var t: f32;\n    if (GRADIENT_TYPE == 0u) {\n        let a = gradient.linearPoints.xy;\n        let b = gradient.linearPoints.zw;\n        let ab = b - a;\n        let ap = p - a;\n        let dotAB = dot(ab, ab);\n        if (dotAB < 0.0001) {\n            t = 0.0;\n        } else {\n            t = dot(ab, ap) / dotAB;\n        }\n    } else {\n        let r = gradient.radius;\n        let coord = p / r;\n        let focalRatio = gradient.focal;\n\n        if (abs(focalRatio) < 0.001) {\n            t = length(coord);\n        } else {\n            let focal = vec2<f32>(focalRatio, 0.0);\n            let diff = coord - focal;\n            let lenDiff = length(diff);\n\n            if (lenDiff < 0.0001) {\n                t = 0.0;\n            } else {\n                let dir = diff / lenDiff;\n\n                // Solve quadratic equation for unit circle intersection (a=1 since dir is normalized)\n                let b_coef = 2.0 * dot(dir, focal);\n                let c_coef = dot(focal, focal) - 1.0;\n                let discriminant = b_coef * b_coef - 4.0 * c_coef;\n                let x = (-b_coef + sqrt(max(discriminant, 0.0))) * 0.5;\n                t = lenDiff / abs(x);\n            }\n        }\n    }\n    t = applySpread(t);\n    let gradientColor = textureSampleLevel(gradientTexture, gradientSampler, vec2<f32>(t, 0.5), 0);\n\n    let result = gradientColor * input.color;\n    return vec4<f32>(result.rgb * result.a, result.a);\n}\n";
+/**
+ * @description ステンシル用グラデーション塗りフラグメントシェーダー
+ *              Gradient fill fragment shader for stencil rendering
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const GradientFillStencilFragment = "\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) v_uv: vec2<f32>,\n    @location(1) bezier: vec2<f32>,\n    @location(2) color: vec4<f32>,\n}\n\nstruct GradientUniforms {\n    inverseMatrix: mat3x3<f32>,\n    gradientType: f32,\n    focal: f32,\n    spread: f32,\n    radius: f32,\n    linearPoints: vec4<f32>,\n}\n\n@group(0) @binding(0) var<uniform> gradient: GradientUniforms;\n@group(0) @binding(1) var gradientSampler: sampler;\n@group(0) @binding(2) var gradientTexture: texture_2d<f32>;\n\noverride GRADIENT_TYPE: u32 = 0u;\noverride SPREAD_MODE: u32 = 2u;\n\nfn applySpread(t: f32) -> f32 {\n    if (SPREAD_MODE == 0u) {\n        return 1.0 - abs(fract(t * 0.5) * 2.0 - 1.0);\n    } else if (SPREAD_MODE == 1u) {\n        return fract(t);\n    } else {\n        return clamp(t, 0.0, 1.0);\n    }\n}\n\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let p = input.v_uv;\n\n    var t: f32;\n    if (GRADIENT_TYPE == 0u) {\n        let a = gradient.linearPoints.xy;\n        let b = gradient.linearPoints.zw;\n        let ab = b - a;\n        let ap = p - a;\n        let dotAB = dot(ab, ab);\n        if (dotAB < 0.0001) {\n            t = 0.0;\n        } else {\n            t = dot(ab, ap) / dotAB;\n        }\n    } else {\n        let r = gradient.radius;\n        let coord = p / r;\n        let focalRatio = gradient.focal;\n\n        if (abs(focalRatio) < 0.001) {\n            t = length(coord);\n        } else {\n            let focal = vec2<f32>(focalRatio, 0.0);\n            let diff = coord - focal;\n            let lenDiff = length(diff);\n\n            if (lenDiff < 0.0001) {\n                t = 0.0;\n            } else {\n                let dir = diff / lenDiff;\n\n                // Solve quadratic equation for unit circle intersection (a=1 since dir is normalized)\n                let b_coef = 2.0 * dot(dir, focal);\n                let c_coef = dot(focal, focal) - 1.0;\n                let discriminant = b_coef * b_coef - 4.0 * c_coef;\n                let x = (-b_coef + sqrt(max(discriminant, 0.0))) * 0.5;\n                t = lenDiff / abs(x);\n            }\n        }\n    }\n    t = applySpread(t);\n    let gradientColor = textureSampleLevel(gradientTexture, gradientSampler, vec2<f32>(t, 0.5), 0);\n\n    return vec4<f32>(gradientColor.rgb * gradientColor.a, gradientColor.a);\n}\n";
+/**
+ * @description テクスチャ座標ベースのグラデーションフラグメントシェーダー
+ *              Texture coordinate-based gradient fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const GradientFragment = "\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n    @location(1) color: vec4<f32>,\n}\n\nstruct GradientUniforms {\n    inverseMatrix: mat3x3<f32>,\n    gradientType: f32,\n    focal: f32,\n    spread: f32,\n    radius: f32,\n    linearPoints: vec4<f32>,\n}\n\n@group(0) @binding(0) var<uniform> gradient: GradientUniforms;\n@group(0) @binding(1) var gradientSampler: sampler;\n@group(0) @binding(2) var gradientTexture: texture_2d<f32>;\n\noverride GRADIENT_TYPE: u32 = 0u;\noverride SPREAD_MODE: u32 = 2u;\n\nfn applySpread(t: f32) -> f32 {\n    if (SPREAD_MODE == 0u) {\n        return 1.0 - abs(fract(t * 0.5) * 2.0 - 1.0);\n    } else if (SPREAD_MODE == 1u) {\n        return fract(t);\n    } else {\n        return clamp(t, 0.0, 1.0);\n    }\n}\n\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    let p = input.texCoord;\n\n    var t: f32;\n    if (GRADIENT_TYPE == 0u) {\n        let a = gradient.linearPoints.xy;\n        let b = gradient.linearPoints.zw;\n        let ab = b - a;\n        let ap = p - a;\n        let dotAB = dot(ab, ab);\n        if (dotAB < 0.0001) {\n            t = 0.0;\n        } else {\n            t = dot(ab, ap) / dotAB;\n        }\n    } else {\n        let r = gradient.radius;\n        let coord = p / r;\n        let focalRatio = gradient.focal;\n\n        if (abs(focalRatio) < 0.001) {\n            t = length(coord);\n        } else {\n            let focal = vec2<f32>(focalRatio, 0.0);\n            let diff = coord - focal;\n            let lenDiff = length(diff);\n\n            if (lenDiff < 0.0001) {\n                t = 0.0;\n            } else {\n                let dir = diff / lenDiff;\n\n                // Solve quadratic equation for unit circle intersection (a=1 since dir is normalized)\n                let b_coef = 2.0 * dot(dir, focal);\n                let c_coef = dot(focal, focal) - 1.0;\n                let discriminant = b_coef * b_coef - 4.0 * c_coef;\n                let x = (-b_coef + sqrt(max(discriminant, 0.0))) * 0.5;\n                t = lenDiff / abs(x);\n            }\n        }\n    }\n    t = applySpread(t);\n    let gradientColor = textureSampleLevel(gradientTexture, gradientSampler, vec2<f32>(t, 0.5), 0);\n\n    let result = gradientColor * input.color;\n    return vec4<f32>(result.rgb * result.a, result.a);\n}\n";

package/src/Shader/wgsl/fragment/GradientFragment.js

@@ -1,4 +1,11 @@
-const GradientUniformsAndSpread = `
+/**
+ * @description グラデーションのUniform定義とスプレッドモード処理のWGSLコード
+ *              WGSL code for gradient uniform definitions and spread mode handling
+ *
+ * @type {string}
+ * @constant
+ */
+const $GradientUniformsAndSpread = `
 struct GradientUniforms {
     inverseMatrix: mat3x3<f32>,
     gradientType: f32,
@@ -25,7 +32,14 @@ fn applySpread(t: f32) -> f32 {
     }
 }
 `;
-const GradientCalculation = `
+/**
+ * @description 線形・放射グラデーションのt値計算WGSLコード
+ *              WGSL code for calculating t value in linear and radial gradients
+ *
+ * @type {string}
+ * @constant
+ */
+const $GradientCalculation = `
     var t: f32;
     if (GRADIENT_TYPE == 0u) {
         let a = gradient.linearPoints.xy;
@@ -67,6 +81,13 @@ const GradientCalculation = `
     t = applySpread(t);
     let gradientColor = textureSampleLevel(gradientTexture, gradientSampler, vec2<f32>(t, 0.5), 0);
 `;
+/**
+ * @description グラデーション塗りフラグメントシェーダー（頂点カラー乗算付き）
+ *              Gradient fill fragment shader with vertex color multiplication
+ *
+ * @type {string}
+ * @constant
+ */
 export const GradientFillFragment = /* wgsl */ `
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,
@@ -74,16 +95,23 @@ struct VertexOutput {
     @location(1) bezier: vec2<f32>,
     @location(2) color: vec4<f32>,
 }
-${GradientUniformsAndSpread}
+${$GradientUniformsAndSpread}
 
 @fragment
 fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     let p = input.v_uv;
-${GradientCalculation}
+${$GradientCalculation}
     let result = gradientColor * input.color;
     return vec4<f32>(result.rgb * result.a, result.a);
 }
 `;
+/**
+ * @description ステンシル用グラデーション塗りフラグメントシェーダー
+ *              Gradient fill fragment shader for stencil rendering
+ *
+ * @type {string}
+ * @constant
+ */
 export const GradientFillStencilFragment = /* wgsl */ `
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,
@@ -91,27 +119,34 @@ struct VertexOutput {
     @location(1) bezier: vec2<f32>,
     @location(2) color: vec4<f32>,
 }
-${GradientUniformsAndSpread}
+${$GradientUniformsAndSpread}
 
 @fragment
 fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     let p = input.v_uv;
-${GradientCalculation}
+${$GradientCalculation}
     return vec4<f32>(gradientColor.rgb * gradientColor.a, gradientColor.a);
 }
 `;
+/**
+ * @description テクスチャ座標ベースのグラデーションフラグメントシェーダー
+ *              Texture coordinate-based gradient fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export const GradientFragment = /* wgsl */ `
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,
     @location(0) texCoord: vec2<f32>,
     @location(1) color: vec4<f32>,
 }
-${GradientUniformsAndSpread}
+${$GradientUniformsAndSpread}
 
 @fragment
 fn main(input: VertexOutput) -> @location(0) vec4<f32> {
     let p = input.texCoord;
-${GradientCalculation}
+${$GradientCalculation}
     let result = gradientColor * input.color;
     return vec4<f32>(result.rgb * result.a, result.a);
 }

package/src/Shader/wgsl/fragment/InstancedFragment.d.ts

@@ -1 +1,8 @@
+/**
+ * @description インスタンス描画用フラグメントシェーダー（カラー変換付き）
+ *              Instanced rendering fragment shader with color transform
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const InstancedFragment = "\nstruct VertexOutput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) texCoord: vec2<f32>,\n    @location(1) mulColor: vec4<f32>,\n    @location(2) addColor: vec4<f32>,\n}\n\n@group(0) @binding(0) var textureSampler: sampler;\n@group(0) @binding(1) var textureData: texture_2d<f32>;\n\n@fragment\nfn main(input: VertexOutput) -> @location(0) vec4<f32> {\n    var src = textureSample(textureData, textureSampler, input.texCoord);\n    src = vec4<f32>(src.rgb / max(0.0001, src.a), src.a);\n    src = clamp(src * input.mulColor + input.addColor, vec4<f32>(0.0), vec4<f32>(1.0));\n    src = vec4<f32>(src.rgb * src.a, src.a);\n    return src;\n}\n";

package/src/Shader/wgsl/fragment/InstancedFragment.js

@@ -1,3 +1,10 @@
+/**
+ * @description インスタンス描画用フラグメントシェーダー（カラー変換付き）
+ *              Instanced rendering fragment shader with color transform
+ *
+ * @type {string}
+ * @constant
+ */
 export const InstancedFragment = /* wgsl */ `
 struct VertexOutput {
     @builtin(position) position: vec4<f32>,

package/src/Shader/wgsl/fragment/MaskFragment.d.ts

@@ -1 +1,8 @@
+/**
+ * @description ベジェ曲線ベースのマスク用フラグメントシェーダー
+ *              Bezier curve-based mask fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const MaskFragment = "\nstruct FragmentInput {\n    @location(0) bezier: vec2<f32>,\n}\n\n@fragment\nfn main(input: FragmentInput) -> @location(0) vec4<f32> {\n    let px = dpdx(input.bezier);\n    let py = dpdy(input.bezier);\n    let f = (2.0 * input.bezier.x) * vec2<f32>(px.x, py.x) - vec2<f32>(px.y, py.y);\n    let alpha = 0.5 - (input.bezier.x * input.bezier.x - input.bezier.y) / length(f);\n    if (alpha <= 0.0) {\n        discard;\n    }\n    return vec4<f32>(min(alpha, 1.0));\n}\n";

package/src/Shader/wgsl/fragment/MaskFragment.js

@@ -1,3 +1,10 @@
+/**
+ * @description ベジェ曲線ベースのマスク用フラグメントシェーダー
+ *              Bezier curve-based mask fragment shader
+ *
+ * @type {string}
+ * @constant
+ */
 export const MaskFragment = /* wgsl */ `
 struct FragmentInput {
     @location(0) bezier: vec2<f32>,

package/src/Shader/wgsl/fragment/StencilFragment.d.ts

@@ -1,2 +1,16 @@
+/**
+ * @description ステンシル書き込み用フラグメントシェーダー（ベジェ曲線アンチエイリアス）
+ *              Stencil write fragment shader with bezier curve anti-aliasing
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const StencilWriteFragment = "\nstruct FragmentInput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) bezier: vec2<f32>,\n}\n\n@fragment\nfn main(input: FragmentInput) -> @location(0) vec4<f32> {\n    let f_val = input.bezier.x * input.bezier.x - input.bezier.y;\n    let dx = dpdx(f_val);\n    let dy = dpdy(f_val);\n    let dist = f_val * inverseSqrt(dx * dx + dy * dy);\n    let alpha = smoothstep(0.5, -0.5, dist);\n\n    if (alpha <= 0.001) {\n        discard;\n    }\n\n    return vec4<f32>(0.0, 0.0, 0.0, min(alpha, 1.0));\n}\n";
+/**
+ * @description ステンシル塗り用フラグメントシェーダー（プリマルチプライドアルファ出力）
+ *              Stencil fill fragment shader with premultiplied alpha output
+ *
+ * @type {string}
+ * @constant
+ */
 export declare const StencilFillFragment = "\nstruct FragmentInput {\n    @builtin(position) position: vec4<f32>,\n    @location(0) color: vec4<f32>,\n}\n\n@fragment\nfn main(input: FragmentInput) -> @location(0) vec4<f32> {\n    let a = input.color.a;\n    return vec4<f32>(input.color.r * a, input.color.g * a, input.color.b * a, a);\n}\n";