shaders 3.0.453 → 3.1.455

package/dist/core/Heart-0eDZ50ZK.js

@@ -1,297 +0,0 @@
-import { G as mixColorsVariants, W as mixColorsLinear, b as vec4, ln as f32, m as call, nt as src_default, rn as vec2f } from "./edges-B7Yet3LV.js";
-import { g as shapeLocalCoords, h as sdf_exports, n as ShapeMask, u as heartSdf, v as strokeMaskFromSdf } from "./sdf-B8rPE1PG.js";
-import { a as transformColor, c as transformPosition, l as transformStrokePosition, o as transformColorSpace, t as colorSpaceOptions } from "./transformations-C7gn_5rF.js";
-const heartShape = src_default.fn([
-	vec2f,
-	f32,
-	f32,
-	f32,
-	f32,
-	f32,
-	vec2f,
-	f32
-], ShapeMask)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((center, radius, rotation, softness, strokeThickness, strokePosition, uv, aspect) => {
-	"use gpu";
-	const local = shapeLocalCoords(center, rotation, uv, aspect);
-	return strokeMaskFromSdf(heartSdf(local.x, local.y, radius), softness, strokeThickness, strokePosition);
-}), {
-	v: 1,
-	name: void 0,
-	ast: {
-		"params": [
-			{
-				"type": "i",
-				"name": "center"
-			},
-			{
-				"type": "i",
-				"name": "radius"
-			},
-			{
-				"type": "i",
-				"name": "rotation"
-			},
-			{
-				"type": "i",
-				"name": "softness"
-			},
-			{
-				"type": "i",
-				"name": "strokeThickness"
-			},
-			{
-				"type": "i",
-				"name": "strokePosition"
-			},
-			{
-				"type": "i",
-				"name": "uv"
-			},
-			{
-				"type": "i",
-				"name": "aspect"
-			}
-		],
-		"body": [0, [
-			[
-				13,
-				"local",
-				[
-					6,
-					[
-						7,
-						"sdf",
-						"shapeLocalCoords"
-					],
-					[
-						"center",
-						"rotation",
-						"uv",
-						"aspect"
-					]
-				]
-			],
-			[
-				13,
-				"dist",
-				[
-					6,
-					[
-						7,
-						"sdf",
-						"heartSdf"
-					],
-					[
-						[
-							7,
-							"local",
-							"x"
-						],
-						[
-							7,
-							"local",
-							"y"
-						],
-						"radius"
-					]
-				]
-			],
-			[10, [
-				6,
-				[
-					7,
-					"sdf",
-					"strokeMaskFromSdf"
-				],
-				[
-					"dist",
-					"softness",
-					"strokeThickness",
-					"strokePosition"
-				]
-			]]
-		]],
-		"externalNames": ["sdf"]
-	},
-	externals: () => ({ sdf: sdf_exports })
-}) && $.f)({}));
-const componentDefinition = {
-	name: "Heart",
-	boundingBoxDeclaration: { propBindings: {
-		x: {
-			prop: "center",
-			as: "position-x"
-		},
-		y: {
-			prop: "center",
-			as: "position-y"
-		},
-		width: {
-			prop: "radius",
-			as: "half-canvas-height"
-		},
-		height: {
-			prop: "radius",
-			as: "half-canvas-height"
-		},
-		rotation: {
-			prop: "rotation",
-			as: "degrees"
-		}
-	} },
-	category: "Shapes",
-	description: "Heart shape with adjustable size",
-	acceptsUVContext: true,
-	props: {
-		origin: {
-			default: "center",
-			description: "Reference edge the center position is measured from (center default). Lets you pin the shape relative to a corner or the canvas centre.",
-			ui: {
-				type: "origin",
-				label: "Origin",
-				group: "Position"
-			}
-		},
-		color: {
-			default: "#ffffff",
-			transform: transformColor,
-			description: "Fill color of the heart",
-			ui: {
-				type: "color",
-				label: "Color",
-				group: "Colors"
-			}
-		},
-		center: {
-			default: {
-				x: .5,
-				y: .5
-			},
-			transform: transformPosition,
-			description: "Center position of the heart",
-			ui: {
-				type: "position",
-				label: "Center",
-				group: "Position",
-				units: ["%", "px"]
-			}
-		},
-		radius: {
-			default: .32,
-			description: "Size of the heart (fit radius)",
-			ui: {
-				type: "range",
-				min: 0,
-				max: 1,
-				step: .01,
-				label: "Size",
-				group: "Shape"
-			}
-		},
-		rotation: {
-			default: 0,
-			description: "Rotation in degrees",
-			ui: {
-				type: "range",
-				min: 0,
-				max: 360,
-				step: 1,
-				label: "Rotation",
-				group: "Shape"
-			}
-		},
-		softness: {
-			default: 0,
-			description: "Edge softness for antialiasing",
-			ui: {
-				type: "range",
-				min: 0,
-				max: .1,
-				step: .001,
-				label: "Softness",
-				group: "Effect"
-			}
-		},
-		strokeThickness: {
-			default: 0,
-			description: "Stroke thickness. Zero means no stroke.",
-			ui: {
-				type: "range",
-				min: 0,
-				max: .2,
-				step: .005,
-				label: "Stroke Thickness",
-				group: "Stroke"
-			}
-		},
-		strokeColor: {
-			default: "#000000",
-			transform: transformColor,
-			description: "Color of the stroke outline",
-			ui: {
-				type: "color",
-				label: "Stroke Color",
-				group: "Colors"
-			}
-		},
-		strokePosition: {
-			default: "center",
-			transform: transformStrokePosition,
-			description: "Position of the stroke relative to the shape edge",
-			ui: {
-				type: "select",
-				options: [
-					{
-						label: "Outside",
-						value: "outside"
-					},
-					{
-						label: "Center",
-						value: "center"
-					},
-					{
-						label: "Inside",
-						value: "inside"
-					}
-				],
-				label: "Stroke Position",
-				group: "Stroke"
-			}
-		},
-		colorSpace: {
-			default: "linear",
-			transform: transformColorSpace,
-			compileTime: true,
-			description: "Color space for blending fill and stroke colors",
-			ui: {
-				type: "select",
-				options: colorSpaceOptions,
-				label: "Color Blending",
-				group: "Colors"
-			}
-		}
-	},
-	fragment: (params) => {
-		const { uniforms, ctx, propValues } = params;
-		const uv = params.uvContext ?? ctx.uv;
-		const colorSpaceMode = propValues.colorSpace ?? 0;
-		const mask = call(heartShape, "heartShape", [
-			uniforms.center,
-			uniforms.radius,
-			uniforms.rotation,
-			uniforms.softness,
-			uniforms.strokeThickness,
-			uniforms.strokePosition,
-			uv,
-			ctx.aspect
-		]);
-		const blended = call(mixColorsVariants[colorSpaceMode] ?? mixColorsLinear, "mixColors", [
-			uniforms.color,
-			uniforms.strokeColor,
-			mask.member("strokeBlend")
-		]);
-		return vec4(blended.member("rgb"), blended.member("a").mul(mask.member("overallMask")));
-	}
-};
-var Heart_default = componentDefinition;
-export { componentDefinition as n, heartShape as r, Heart_default as t };

package/dist/core/ImageTexture-B5oPuXeI.js

@@ -1,183 +0,0 @@
-import { m as call } from "./edges-B7Yet3LV.js";
-import { a as scaleFill, i as scaleCover, n as sampleUV, r as scaleContain, s as scaleScaleDown, t as alphaCutLinear } from "./media-Y-WxQcQD.js";
-import { r as registerNaturalSize } from "./naturalSize-BPCi_I-Z.js";
-var OBJECT_FIT_MODES = {
-	cover: 0,
-	contain: 1,
-	fill: 2,
-	"scale-down": 3,
-	none: 2
-};
-var SVG_RASTER_SIZE = 2048;
-function isSvgUrl(url) {
-	return /\.svg($|\?|#)/i.test(url);
-}
-function rasterizeSvg(url) {
-	return new Promise((resolve, reject) => {
-		const img = new Image();
-		img.crossOrigin = "anonymous";
-		img.onload = () => {
-			const naturalW = img.naturalWidth || SVG_RASTER_SIZE;
-			const naturalH = img.naturalHeight || SVG_RASTER_SIZE;
-			const aspect = naturalW / naturalH;
-			const canvasW = aspect >= 1 ? SVG_RASTER_SIZE : Math.round(SVG_RASTER_SIZE * aspect);
-			const canvasH = aspect >= 1 ? Math.round(SVG_RASTER_SIZE / aspect) : SVG_RASTER_SIZE;
-			const canvas = document.createElement("canvas");
-			canvas.width = canvasW;
-			canvas.height = canvasH;
-			const ctx = canvas.getContext("2d");
-			if (!ctx) {
-				reject(/* @__PURE__ */ new Error("Could not get 2D context"));
-				return;
-			}
-			ctx.drawImage(img, 0, 0, canvasW, canvasH);
-			resolve({
-				source: canvas,
-				width: canvasW,
-				height: canvasH,
-				naturalWidth: naturalW,
-				naturalHeight: naturalH
-			});
-		};
-		img.onerror = reject;
-		img.src = url;
-	});
-}
-const componentDefinition = {
-	name: "ImageTexture",
-	boundingBoxDeclaration: {
-		aspectRatio: null,
-		supportsResizeFit: true
-	},
-	category: "Textures",
-	description: "Display an image with customizable object-fit modes",
-	acceptsUVContext: true,
-	props: {
-		url: {
-			default: "https://shaders.com/sample.jpg",
-			description: "Upload an image or provide a URL",
-			ui: {
-				type: "image-upload",
-				label: "Image",
-				group: "Media"
-			}
-		},
-		objectFit: {
-			default: "fill",
-			description: "How the image should be sized within the viewport",
-			transform: (value) => {
-				return {
-					"cover": 0,
-					"contain": 1,
-					"fill": 2,
-					"scale-down": 3,
-					"none": 2
-				}[value] ?? 2;
-			},
-			compileTime: true,
-			ui: {
-				type: "select",
-				options: [
-					{
-						label: "Cover",
-						value: "cover"
-					},
-					{
-						label: "Contain",
-						value: "contain"
-					},
-					{
-						label: "Fill",
-						value: "fill"
-					},
-					{
-						label: "Scale Down",
-						value: "scale-down"
-					}
-				],
-				label: "Object Fit",
-				group: "Sizing"
-			}
-		}
-	},
-	fragment: ({ ctx, propValues, uvContext, effectiveViewportSize, getCpuValue, onBeforeRender, onCleanup, createMediaTexture, registerMediaTexture }) => {
-		let current = createMediaTexture({
-			width: 1,
-			height: 1,
-			label: "ImageTexture:placeholder"
-		});
-		let currentUrl = "";
-		let isLoading = false;
-		let isDisposed = false;
-		const applyImage = (source, width, height) => {
-			if (isDisposed) return;
-			const next = createMediaTexture({
-				width: Math.max(1, width),
-				height: Math.max(1, height),
-				label: "ImageTexture"
-			});
-			next.write(source);
-			const previous = current;
-			current = next;
-			previous.destroy();
-		};
-		const loadImage = async (url) => {
-			if (!url || url.trim() === "" || isLoading || isDisposed) return;
-			isLoading = true;
-			try {
-				if (isSvgUrl(url)) {
-					const { source, width, height, naturalWidth, naturalHeight } = await rasterizeSvg(url);
-					if (isDisposed) return;
-					currentUrl = url;
-					registerNaturalSize(url, naturalWidth, naturalHeight);
-					applyImage(source, width, height);
-				} else {
-					const response = await fetch(url, { mode: "cors" });
-					if (!response.ok) throw new Error(`HTTP ${response.status}`);
-					const blob = await response.blob();
-					const bitmap = await createImageBitmap(blob);
-					if (isDisposed) {
-						bitmap.close();
-						return;
-					}
-					currentUrl = url;
-					registerNaturalSize(url, bitmap.width, bitmap.height);
-					applyImage(bitmap, bitmap.width, bitmap.height);
-					bitmap.close();
-				}
-			} catch (error) {
-				const isRelative = !url.startsWith("http://") && !url.startsWith("https://") && !url.startsWith("data:");
-				console.error(`[ImageTexture] Failed to load image\n  Requested URL: ${url}\n  Path type: ${isRelative ? "relative" : "absolute"}\n  Error:`, error);
-			} finally {
-				isLoading = false;
-			}
-		};
-		setTimeout(() => {
-			const initialUrl = getCpuValue("url") ?? "";
-			if (initialUrl && initialUrl.trim() !== "") loadImage(initialUrl);
-		}, 0);
-		onBeforeRender(() => {
-			const newUrl = getCpuValue("url") ?? "";
-			if (newUrl !== currentUrl && !isLoading) loadImage(newUrl);
-		});
-		onCleanup(() => {
-			isDisposed = true;
-			current.destroy();
-		});
-		const image = registerMediaTexture(() => current.texture);
-		const baseUV = uvContext ?? ctx.uv;
-		const vp = effectiveViewportSize ?? ctx.viewportSize;
-		const dims = image.dimensions();
-		const rawFit = propValues.objectFit;
-		const mode = typeof rawFit === "number" ? rawFit : OBJECT_FIT_MODES[rawFit] ?? 2;
-		let uvScale;
-		if (mode === 1) uvScale = call(scaleContain, "scaleContain", [dims, vp]);
-		else if (mode === 2) uvScale = call(scaleFill, "scaleFill", []);
-		else if (mode === 3) uvScale = call(scaleScaleDown, "scaleScaleDown", [dims, vp]);
-		else uvScale = call(scaleCover, "scaleCover", [dims, vp]);
-		const finalUV = call(sampleUV, "mediaSampleUV", [baseUV, uvScale]);
-		return call(alphaCutLinear, "mediaAlphaCut", [image.sample(finalUV), finalUV]);
-	}
-};
-var ImageTexture_default = componentDefinition;
-export { componentDefinition as n, ImageTexture_default as t };