shaders 2.2.42 → 2.2.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/core/WebcamTexture-D4Uv7Plz.js +168 -0
- package/dist/core/index.d.ts +0 -2
- package/dist/core/index.d.ts.map +1 -1
- package/dist/core/index.js +8 -168
- package/dist/core/registry.d.ts +10 -0
- package/dist/core/registry.d.ts.map +1 -0
- package/dist/core/registry.js +166 -0
- package/dist/core/shaderRegistry.d.ts.map +1 -1
- package/dist/core/shaders/WebcamTexture/index.d.ts +21 -0
- package/dist/core/shaders/WebcamTexture/index.d.ts.map +1 -0
- package/dist/core/shaders/WebcamTexture/index.js +2 -0
- package/dist/core/shaders/ZoomBlur/index.js +1 -1
- package/dist/react/AngularBlur.js +144 -0
- package/dist/react/Ascii.js +144 -0
- package/dist/react/Beam.js +144 -0
- package/dist/react/Blob.js +144 -0
- package/dist/react/Blur.js +144 -0
- package/dist/react/BrightnessContrast.js +144 -0
- package/dist/react/Bulge.js +144 -0
- package/dist/react/CRTScreen.js +144 -0
- package/dist/react/ChannelBlur.js +144 -0
- package/dist/react/Checkerboard.js +144 -0
- package/dist/react/ChromaFlow.js +144 -0
- package/dist/react/ChromaticAberration.js +144 -0
- package/dist/react/Circle.js +144 -0
- package/dist/react/CursorTrail.js +144 -0
- package/dist/react/DiffuseBlur.js +144 -0
- package/dist/react/Dither.js +144 -0
- package/dist/react/DotGrid.js +144 -0
- package/dist/react/Duotone.js +144 -0
- package/dist/react/FilmGrain.js +144 -0
- package/dist/react/FloatingParticles.js +144 -0
- package/dist/react/GlassTiles.js +144 -0
- package/dist/react/Glow.js +144 -0
- package/dist/react/Godrays.js +144 -0
- package/dist/react/Grayscale.js +144 -0
- package/dist/react/Grid.js +144 -0
- package/dist/react/GridDistortion.js +144 -0
- package/dist/react/Group.js +144 -0
- package/dist/react/Halftone.js +144 -0
- package/dist/react/HueShift.js +144 -0
- package/dist/react/ImageTexture.js +144 -0
- package/dist/react/Invert.js +144 -0
- package/dist/react/LinearBlur.js +144 -0
- package/dist/react/LinearGradient.js +144 -0
- package/dist/react/Liquify.js +144 -0
- package/dist/react/Perspective.js +144 -0
- package/dist/react/Pixelate.js +144 -0
- package/dist/react/PolarCoordinates.js +144 -0
- package/dist/react/Posterize.js +144 -0
- package/dist/react/ProgressiveBlur.js +144 -0
- package/dist/react/RadialGradient.js +144 -0
- package/dist/react/RectangularCoordinates.js +144 -0
- package/dist/react/Ripples.js +144 -0
- package/dist/react/Saturation.js +144 -0
- package/dist/react/Shader.js +166 -0
- package/dist/react/Sharpness.js +144 -0
- package/dist/react/Shatter.js +144 -0
- package/dist/react/SimplexNoise.js +144 -0
- package/dist/react/SineWave.js +144 -0
- package/dist/react/SolidColor.js +144 -0
- package/dist/react/Spherize.js +144 -0
- package/dist/react/Spiral.js +144 -0
- package/dist/react/Strands.js +144 -0
- package/dist/react/Stretch.js +144 -0
- package/dist/react/Stripes.js +144 -0
- package/dist/react/Swirl.js +144 -0
- package/dist/react/TiltShift.js +144 -0
- package/dist/react/Tint.js +144 -0
- package/dist/react/Tritone.js +144 -0
- package/dist/react/Twirl.js +144 -0
- package/dist/react/Vibrance.js +144 -0
- package/dist/react/WaveDistortion.js +144 -0
- package/dist/react/WebcamTexture.js +144 -0
- package/dist/react/ZoomBlur.js +144 -0
- package/dist/react/components/WebcamTexture.d.ts +31 -0
- package/dist/react/components/WebcamTexture.d.ts.map +1 -0
- package/dist/react/index.d.ts +1 -0
- package/dist/react/index.d.ts.map +1 -1
- package/dist/react/index.js +65 -8646
- package/dist/react/utils/generatePresetCode.d.ts.map +1 -1
- package/dist/react/utils/generatePresetCode.js +392 -1
- package/dist/registry.js +91 -0
- package/dist/solid/components/AngularBlur.js +148 -0
- package/dist/solid/components/Ascii.js +148 -0
- package/dist/solid/components/Beam.js +148 -0
- package/dist/solid/components/Blob.js +148 -0
- package/dist/solid/components/Blur.js +148 -0
- package/dist/solid/components/BrightnessContrast.js +148 -0
- package/dist/solid/components/Bulge.js +148 -0
- package/dist/solid/components/CRTScreen.js +148 -0
- package/dist/solid/components/ChannelBlur.js +148 -0
- package/dist/solid/components/Checkerboard.js +148 -0
- package/dist/solid/components/ChromaFlow.js +148 -0
- package/dist/solid/components/ChromaticAberration.js +148 -0
- package/dist/solid/components/Circle.js +148 -0
- package/dist/solid/components/CursorTrail.js +148 -0
- package/dist/solid/components/DiffuseBlur.js +148 -0
- package/dist/solid/components/Dither.js +148 -0
- package/dist/solid/components/DotGrid.js +148 -0
- package/dist/solid/components/Duotone.js +148 -0
- package/dist/solid/components/FilmGrain.js +148 -0
- package/dist/solid/components/FloatingParticles.js +148 -0
- package/dist/solid/components/GlassTiles.js +148 -0
- package/dist/solid/components/Glow.js +148 -0
- package/dist/solid/components/Godrays.js +148 -0
- package/dist/solid/components/Grayscale.js +148 -0
- package/dist/solid/components/Grid.js +148 -0
- package/dist/solid/components/GridDistortion.js +148 -0
- package/dist/solid/components/Group.js +148 -0
- package/dist/solid/components/Halftone.js +148 -0
- package/dist/solid/components/HueShift.js +148 -0
- package/dist/solid/components/ImageTexture.js +148 -0
- package/dist/solid/components/Invert.js +148 -0
- package/dist/solid/components/LinearBlur.js +148 -0
- package/dist/solid/components/LinearGradient.js +148 -0
- package/dist/solid/components/Liquify.js +148 -0
- package/dist/solid/components/Perspective.js +148 -0
- package/dist/solid/components/Pixelate.js +148 -0
- package/dist/solid/components/PolarCoordinates.js +148 -0
- package/dist/solid/components/Posterize.js +148 -0
- package/dist/solid/components/ProgressiveBlur.js +148 -0
- package/dist/solid/components/RadialGradient.js +148 -0
- package/dist/solid/components/RectangularCoordinates.js +148 -0
- package/dist/solid/components/Ripples.js +148 -0
- package/dist/solid/components/Saturation.js +148 -0
- package/dist/solid/components/Sharpness.js +148 -0
- package/dist/solid/components/Shatter.js +148 -0
- package/dist/solid/components/SimplexNoise.js +148 -0
- package/dist/solid/components/SineWave.js +148 -0
- package/dist/solid/components/SolidColor.js +148 -0
- package/dist/solid/components/Spherize.js +148 -0
- package/dist/solid/components/Spiral.js +148 -0
- package/dist/solid/components/Strands.js +148 -0
- package/dist/solid/components/Stretch.js +148 -0
- package/dist/solid/components/Stripes.js +148 -0
- package/dist/solid/components/Swirl.js +148 -0
- package/dist/solid/components/TiltShift.js +148 -0
- package/dist/solid/components/Tint.js +148 -0
- package/dist/solid/components/Tritone.js +148 -0
- package/dist/solid/components/Twirl.js +148 -0
- package/dist/solid/components/Vibrance.js +148 -0
- package/dist/solid/components/WaveDistortion.js +148 -0
- package/dist/solid/components/WebcamTexture.d.ts +28 -0
- package/dist/solid/components/WebcamTexture.d.ts.map +1 -0
- package/dist/solid/components/WebcamTexture.js +148 -0
- package/dist/solid/components/ZoomBlur.js +148 -0
- package/dist/solid/engine/Shader.js +189 -0
- package/dist/solid/index.d.ts +1 -0
- package/dist/solid/index.d.ts.map +1 -1
- package/dist/solid/index.js +126 -8847
- package/dist/solid/utils/generatePresetCode.d.ts.map +1 -1
- package/dist/solid/utils/generatePresetCode.js +66 -414
- package/dist/svelte/components/WebcamTexture.svelte.d.ts +19 -0
- package/dist/svelte/generatePresetCode-CtXcoyI0.js +393 -0
- package/dist/svelte/index.d.ts +1 -0
- package/dist/svelte/index.js +115 -4
- package/dist/svelte/utils/generatePresetCode.js +1 -1
- package/dist/vue/AngularBlur.js +3 -0
- package/dist/vue/AngularBlur.vue_vue_type_script_setup_true_lang.js +125 -0
- package/dist/vue/Ascii.js +3 -0
- package/dist/vue/Ascii.vue_vue_type_script_setup_true_lang.js +127 -0
- package/dist/vue/Beam.js +3 -0
- package/dist/vue/Beam.vue_vue_type_script_setup_true_lang.js +132 -0
- package/dist/vue/Blob.js +3 -0
- package/dist/vue/Blob.vue_vue_type_script_setup_true_lang.js +137 -0
- package/dist/vue/Blur.js +3 -0
- package/dist/vue/Blur.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/BrightnessContrast.js +3 -0
- package/dist/vue/BrightnessContrast.vue_vue_type_script_setup_true_lang.js +125 -0
- package/dist/vue/Bulge.js +3 -0
- package/dist/vue/Bulge.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/CRTScreen.js +3 -0
- package/dist/vue/CRTScreen.vue_vue_type_script_setup_true_lang.js +129 -0
- package/dist/vue/ChannelBlur.js +3 -0
- package/dist/vue/ChannelBlur.vue_vue_type_script_setup_true_lang.js +126 -0
- package/dist/vue/Checkerboard.js +3 -0
- package/dist/vue/Checkerboard.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/ChromaFlow.js +3 -0
- package/dist/vue/ChromaFlow.vue_vue_type_script_setup_true_lang.js +131 -0
- package/dist/vue/ChromaticAberration.js +3 -0
- package/dist/vue/ChromaticAberration.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/Circle.js +3 -0
- package/dist/vue/Circle.vue_vue_type_script_setup_true_lang.js +127 -0
- package/dist/vue/CursorTrail.js +3 -0
- package/dist/vue/CursorTrail.vue_vue_type_script_setup_true_lang.js +129 -0
- package/dist/vue/DiffuseBlur.js +3 -0
- package/dist/vue/DiffuseBlur.vue_vue_type_script_setup_true_lang.js +125 -0
- package/dist/vue/Dither.js +3 -0
- package/dist/vue/Dither.vue_vue_type_script_setup_true_lang.js +127 -0
- package/dist/vue/DotGrid.js +3 -0
- package/dist/vue/DotGrid.vue_vue_type_script_setup_true_lang.js +127 -0
- package/dist/vue/Duotone.js +3 -0
- package/dist/vue/Duotone.vue_vue_type_script_setup_true_lang.js +127 -0
- package/dist/vue/FilmGrain.js +3 -0
- package/dist/vue/FilmGrain.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/FloatingParticles.js +3 -0
- package/dist/vue/FloatingParticles.vue_vue_type_script_setup_true_lang.js +134 -0
- package/dist/vue/GlassTiles.js +3 -0
- package/dist/vue/GlassTiles.vue_vue_type_script_setup_true_lang.js +127 -0
- package/dist/vue/Glow.js +3 -0
- package/dist/vue/Glow.vue_vue_type_script_setup_true_lang.js +126 -0
- package/dist/vue/Godrays.js +3 -0
- package/dist/vue/Godrays.vue_vue_type_script_setup_true_lang.js +130 -0
- package/dist/vue/Grayscale.js +3 -0
- package/dist/vue/Grayscale.vue_vue_type_script_setup_true_lang.js +123 -0
- package/dist/vue/Grid.js +3 -0
- package/dist/vue/Grid.vue_vue_type_script_setup_true_lang.js +126 -0
- package/dist/vue/GridDistortion.js +3 -0
- package/dist/vue/GridDistortion.vue_vue_type_script_setup_true_lang.js +129 -0
- package/dist/vue/Group.js +3 -0
- package/dist/vue/Group.vue_vue_type_script_setup_true_lang.js +123 -0
- package/dist/vue/Halftone.js +3 -0
- package/dist/vue/Halftone.vue_vue_type_script_setup_true_lang.js +126 -0
- package/dist/vue/HueShift.js +3 -0
- package/dist/vue/HueShift.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/ImageTexture.js +3 -0
- package/dist/vue/ImageTexture.vue_vue_type_script_setup_true_lang.js +125 -0
- package/dist/vue/Invert.js +3 -0
- package/dist/vue/Invert.vue_vue_type_script_setup_true_lang.js +123 -0
- package/dist/vue/LinearBlur.js +3 -0
- package/dist/vue/LinearBlur.vue_vue_type_script_setup_true_lang.js +125 -0
- package/dist/vue/LinearGradient.js +3 -0
- package/dist/vue/LinearGradient.vue_vue_type_script_setup_true_lang.js +130 -0
- package/dist/vue/Liquify.js +3 -0
- package/dist/vue/Liquify.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/Perspective.js +3 -0
- package/dist/vue/Perspective.vue_vue_type_script_setup_true_lang.js +130 -0
- package/dist/vue/Pixelate.js +3 -0
- package/dist/vue/Pixelate.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/PolarCoordinates.js +3 -0
- package/dist/vue/PolarCoordinates.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/Posterize.js +3 -0
- package/dist/vue/Posterize.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/ProgressiveBlur.js +3 -0
- package/dist/vue/ProgressiveBlur.vue_vue_type_script_setup_true_lang.js +127 -0
- package/dist/vue/RadialGradient.js +3 -0
- package/dist/vue/RadialGradient.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/RectangularCoordinates.js +3 -0
- package/dist/vue/RectangularCoordinates.vue_vue_type_script_setup_true_lang.js +127 -0
- package/dist/vue/Ripples.js +3 -0
- package/dist/vue/Ripples.vue_vue_type_script_setup_true_lang.js +131 -0
- package/dist/vue/Saturation.js +3 -0
- package/dist/vue/Saturation.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/Shader.js +3 -0
- package/dist/vue/Shader.vue_vue_type_script_setup_true_lang.js +153 -0
- package/dist/vue/Sharpness.js +3 -0
- package/dist/vue/Sharpness.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/Shatter.js +3 -0
- package/dist/vue/Shatter.vue_vue_type_script_setup_true_lang.js +132 -0
- package/dist/vue/SimplexNoise.js +3 -0
- package/dist/vue/SimplexNoise.vue_vue_type_script_setup_true_lang.js +130 -0
- package/dist/vue/SineWave.js +3 -0
- package/dist/vue/SineWave.vue_vue_type_script_setup_true_lang.js +131 -0
- package/dist/vue/SolidColor.js +3 -0
- package/dist/vue/SolidColor.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/Spherize.js +3 -0
- package/dist/vue/Spherize.vue_vue_type_script_setup_true_lang.js +130 -0
- package/dist/vue/Spiral.js +3 -0
- package/dist/vue/Spiral.vue_vue_type_script_setup_true_lang.js +132 -0
- package/dist/vue/Strands.js +3 -0
- package/dist/vue/Strands.vue_vue_type_script_setup_true_lang.js +132 -0
- package/dist/vue/Stretch.js +3 -0
- package/dist/vue/Stretch.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/Stripes.js +3 -0
- package/dist/vue/Stripes.vue_vue_type_script_setup_true_lang.js +132 -0
- package/dist/vue/Swirl.js +3 -0
- package/dist/vue/Swirl.vue_vue_type_script_setup_true_lang.js +129 -0
- package/dist/vue/TiltShift.js +3 -0
- package/dist/vue/TiltShift.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/Tint.js +3 -0
- package/dist/vue/Tint.vue_vue_type_script_setup_true_lang.js +126 -0
- package/dist/vue/Tritone.js +3 -0
- package/dist/vue/Tritone.vue_vue_type_script_setup_true_lang.js +128 -0
- package/dist/vue/Twirl.js +3 -0
- package/dist/vue/Twirl.vue_vue_type_script_setup_true_lang.js +126 -0
- package/dist/vue/Vibrance.js +3 -0
- package/dist/vue/Vibrance.vue_vue_type_script_setup_true_lang.js +124 -0
- package/dist/vue/WaveDistortion.js +3 -0
- package/dist/vue/WaveDistortion.vue_vue_type_script_setup_true_lang.js +129 -0
- package/dist/vue/WebcamTexture.js +3 -0
- package/dist/vue/WebcamTexture.vue_vue_type_script_setup_true_lang.js +125 -0
- package/dist/vue/ZoomBlur.js +3 -0
- package/dist/vue/ZoomBlur.vue_vue_type_script_setup_true_lang.js +125 -0
- package/dist/vue/components/WebcamTexture.vue.d.ts +57 -0
- package/dist/vue/components/WebcamTexture.vue.d.ts.map +1 -0
- package/dist/vue/index.d.ts +1 -0
- package/dist/vue/index.d.ts.map +1 -1
- package/dist/vue/index.js +65 -7749
- package/dist/vue/utils/generatePresetCode.d.ts.map +1 -1
- package/dist/vue/utils/generatePresetCode.js +391 -1
- package/package.json +9 -1
- package/dist/react/generatePresetCode-BrkW1bEe.js +0 -741
- package/dist/svelte/generatePresetCode-bx7z5wvC.js +0 -741
- package/dist/vue/generatePresetCode-_7ZzqQPH.js +0 -740
- /package/dist/core/{ZoomBlur-CTrw7HxX.js → ZoomBlur-CIkkDBIo.js} +0 -0
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
import { computed, defineComponent, effectScope, inject, mergeDefaults, onBeforeUnmount, provide, renderSlot, toValue, watch } from "vue";
|
|
2
|
+
import { createUniformsMap } from "../core/index.js";
|
|
3
|
+
import { componentDefinition } from "../core/shaders/Group/index.js";
|
|
4
|
+
var Group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
5
|
+
__name: "Group",
|
|
6
|
+
props: /* @__PURE__ */ mergeDefaults({
|
|
7
|
+
blendMode: {},
|
|
8
|
+
opacity: {},
|
|
9
|
+
visible: { type: Boolean },
|
|
10
|
+
id: {},
|
|
11
|
+
maskSource: {},
|
|
12
|
+
maskType: {},
|
|
13
|
+
renderOrder: {},
|
|
14
|
+
transform: {}
|
|
15
|
+
}, {
|
|
16
|
+
blendMode: "normal",
|
|
17
|
+
renderOrder: 0,
|
|
18
|
+
visible: true,
|
|
19
|
+
...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
20
|
+
acc[key] = config.default;
|
|
21
|
+
return acc;
|
|
22
|
+
}, {})
|
|
23
|
+
}),
|
|
24
|
+
setup(__props) {
|
|
25
|
+
const props = __props;
|
|
26
|
+
const instanceId = props.id || `${componentDefinition.name.toLowerCase()}_${Math.random().toString(36).substring(7)}`;
|
|
27
|
+
provide("ombreParentId", instanceId);
|
|
28
|
+
const DEFAULT_TRANSFORM = {
|
|
29
|
+
offsetX: 0,
|
|
30
|
+
offsetY: 0,
|
|
31
|
+
rotation: 0,
|
|
32
|
+
scale: 1,
|
|
33
|
+
anchorX: .5,
|
|
34
|
+
anchorY: .5,
|
|
35
|
+
edges: "transparent"
|
|
36
|
+
};
|
|
37
|
+
const effectiveTransform = computed(() => ({
|
|
38
|
+
...DEFAULT_TRANSFORM,
|
|
39
|
+
...props.transform
|
|
40
|
+
}));
|
|
41
|
+
const uniforms = createUniformsMap(componentDefinition, computed(() => {
|
|
42
|
+
let baseProps = { ...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
43
|
+
acc[key] = config.default;
|
|
44
|
+
return acc;
|
|
45
|
+
}, {}) };
|
|
46
|
+
for (const key in props) if (key !== "blendMode" && key !== "opacity" && key !== "visible" && key !== "id" && key !== "maskSource" && key !== "maskType" && key !== "renderOrder" && key !== "transform" && props[key] !== Object.entries(componentDefinition.props).reduce((acc, [key$1, config]) => {
|
|
47
|
+
acc[key$1] = config.default;
|
|
48
|
+
return acc;
|
|
49
|
+
}, {})[key]) baseProps[key] = toValue(props[key]);
|
|
50
|
+
return baseProps;
|
|
51
|
+
}).value, instanceId);
|
|
52
|
+
const parentId = inject("ombreParentId");
|
|
53
|
+
if (parentId === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
54
|
+
const parentRegister = inject("ombreNodeRegister");
|
|
55
|
+
if (parentRegister === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
56
|
+
const parentUniformUpdate = inject("ombreUniformUpdate");
|
|
57
|
+
if (parentUniformUpdate === void 0) throw new Error("Shader components require ombreUniformUpdate from parent");
|
|
58
|
+
const parentMetadataUpdate = inject("ombreMetadataUpdate");
|
|
59
|
+
if (parentMetadataUpdate === void 0) throw new Error("Shader components require ombreMetadataUpdate from parent");
|
|
60
|
+
const rendererResetSignal = inject("ombreRendererResetSignal");
|
|
61
|
+
const registerWithRenderer = () => {
|
|
62
|
+
parentRegister(instanceId, componentDefinition.fragmentNode, parentId, {
|
|
63
|
+
blendMode: props.blendMode,
|
|
64
|
+
opacity: props.opacity,
|
|
65
|
+
visible: props.visible === false ? false : true,
|
|
66
|
+
id: props.id,
|
|
67
|
+
mask: props.maskSource ? {
|
|
68
|
+
source: props.maskSource,
|
|
69
|
+
type: props.maskType || "alpha"
|
|
70
|
+
} : void 0,
|
|
71
|
+
renderOrder: props.renderOrder,
|
|
72
|
+
transform: effectiveTransform.value
|
|
73
|
+
}, uniforms, componentDefinition);
|
|
74
|
+
};
|
|
75
|
+
const setupUniformWatchers = () => {
|
|
76
|
+
const scope = effectScope();
|
|
77
|
+
scope.run(() => {
|
|
78
|
+
Object.entries(uniforms).forEach(([propName, { uniform, transform }]) => {
|
|
79
|
+
watch(() => props[propName], (newValue) => {
|
|
80
|
+
if (uniform && uniform.value !== void 0) parentUniformUpdate(instanceId, propName, newValue);
|
|
81
|
+
}, { deep: true });
|
|
82
|
+
});
|
|
83
|
+
watch(() => [
|
|
84
|
+
props.blendMode,
|
|
85
|
+
props.opacity,
|
|
86
|
+
props.visible,
|
|
87
|
+
props.id,
|
|
88
|
+
props.maskSource,
|
|
89
|
+
props.maskType,
|
|
90
|
+
props.renderOrder,
|
|
91
|
+
props.transform
|
|
92
|
+
], ([blendMode, opacity, visible]) => {
|
|
93
|
+
parentMetadataUpdate(instanceId, {
|
|
94
|
+
blendMode,
|
|
95
|
+
opacity,
|
|
96
|
+
visible: visible === false ? false : true,
|
|
97
|
+
id: props.id,
|
|
98
|
+
mask: props.maskSource ? {
|
|
99
|
+
source: props.maskSource,
|
|
100
|
+
type: props.maskType || "alpha"
|
|
101
|
+
} : void 0,
|
|
102
|
+
renderOrder: props.renderOrder,
|
|
103
|
+
transform: effectiveTransform.value
|
|
104
|
+
});
|
|
105
|
+
}, { deep: true });
|
|
106
|
+
if (rendererResetSignal) watch(() => rendererResetSignal.value, (newValue) => {
|
|
107
|
+
if (newValue > 0) registerWithRenderer();
|
|
108
|
+
}, { immediate: true });
|
|
109
|
+
});
|
|
110
|
+
onBeforeUnmount(() => {
|
|
111
|
+
scope.stop();
|
|
112
|
+
});
|
|
113
|
+
};
|
|
114
|
+
setupUniformWatchers();
|
|
115
|
+
onBeforeUnmount(() => {
|
|
116
|
+
parentRegister(instanceId, null, null, null, null, null);
|
|
117
|
+
});
|
|
118
|
+
return (_ctx, _cache) => {
|
|
119
|
+
return renderSlot(_ctx.$slots, "default");
|
|
120
|
+
};
|
|
121
|
+
}
|
|
122
|
+
});
|
|
123
|
+
export { Group_vue_vue_type_script_setup_true_lang_default as default };
|
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
import { computed, defineComponent, effectScope, inject, mergeDefaults, onBeforeUnmount, provide, renderSlot, toValue, watch } from "vue";
|
|
2
|
+
import { createUniformsMap } from "../core/index.js";
|
|
3
|
+
import { componentDefinition } from "../core/shaders/Halftone/index.js";
|
|
4
|
+
var Halftone_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
5
|
+
__name: "Halftone",
|
|
6
|
+
props: /* @__PURE__ */ mergeDefaults({
|
|
7
|
+
blendMode: {},
|
|
8
|
+
opacity: {},
|
|
9
|
+
visible: { type: Boolean },
|
|
10
|
+
id: {},
|
|
11
|
+
maskSource: {},
|
|
12
|
+
maskType: {},
|
|
13
|
+
renderOrder: {},
|
|
14
|
+
transform: {},
|
|
15
|
+
frequency: {},
|
|
16
|
+
angle: {},
|
|
17
|
+
smoothness: {}
|
|
18
|
+
}, {
|
|
19
|
+
blendMode: "normal",
|
|
20
|
+
renderOrder: 0,
|
|
21
|
+
visible: true,
|
|
22
|
+
...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
23
|
+
acc[key] = config.default;
|
|
24
|
+
return acc;
|
|
25
|
+
}, {})
|
|
26
|
+
}),
|
|
27
|
+
setup(__props) {
|
|
28
|
+
const props = __props;
|
|
29
|
+
const instanceId = props.id || `${componentDefinition.name.toLowerCase()}_${Math.random().toString(36).substring(7)}`;
|
|
30
|
+
provide("ombreParentId", instanceId);
|
|
31
|
+
const DEFAULT_TRANSFORM = {
|
|
32
|
+
offsetX: 0,
|
|
33
|
+
offsetY: 0,
|
|
34
|
+
rotation: 0,
|
|
35
|
+
scale: 1,
|
|
36
|
+
anchorX: .5,
|
|
37
|
+
anchorY: .5,
|
|
38
|
+
edges: "transparent"
|
|
39
|
+
};
|
|
40
|
+
const effectiveTransform = computed(() => ({
|
|
41
|
+
...DEFAULT_TRANSFORM,
|
|
42
|
+
...props.transform
|
|
43
|
+
}));
|
|
44
|
+
const uniforms = createUniformsMap(componentDefinition, computed(() => {
|
|
45
|
+
let baseProps = { ...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
46
|
+
acc[key] = config.default;
|
|
47
|
+
return acc;
|
|
48
|
+
}, {}) };
|
|
49
|
+
for (const key in props) if (key !== "blendMode" && key !== "opacity" && key !== "visible" && key !== "id" && key !== "maskSource" && key !== "maskType" && key !== "renderOrder" && key !== "transform" && props[key] !== Object.entries(componentDefinition.props).reduce((acc, [key$1, config]) => {
|
|
50
|
+
acc[key$1] = config.default;
|
|
51
|
+
return acc;
|
|
52
|
+
}, {})[key]) baseProps[key] = toValue(props[key]);
|
|
53
|
+
return baseProps;
|
|
54
|
+
}).value, instanceId);
|
|
55
|
+
const parentId = inject("ombreParentId");
|
|
56
|
+
if (parentId === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
57
|
+
const parentRegister = inject("ombreNodeRegister");
|
|
58
|
+
if (parentRegister === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
59
|
+
const parentUniformUpdate = inject("ombreUniformUpdate");
|
|
60
|
+
if (parentUniformUpdate === void 0) throw new Error("Shader components require ombreUniformUpdate from parent");
|
|
61
|
+
const parentMetadataUpdate = inject("ombreMetadataUpdate");
|
|
62
|
+
if (parentMetadataUpdate === void 0) throw new Error("Shader components require ombreMetadataUpdate from parent");
|
|
63
|
+
const rendererResetSignal = inject("ombreRendererResetSignal");
|
|
64
|
+
const registerWithRenderer = () => {
|
|
65
|
+
parentRegister(instanceId, componentDefinition.fragmentNode, parentId, {
|
|
66
|
+
blendMode: props.blendMode,
|
|
67
|
+
opacity: props.opacity,
|
|
68
|
+
visible: props.visible === false ? false : true,
|
|
69
|
+
id: props.id,
|
|
70
|
+
mask: props.maskSource ? {
|
|
71
|
+
source: props.maskSource,
|
|
72
|
+
type: props.maskType || "alpha"
|
|
73
|
+
} : void 0,
|
|
74
|
+
renderOrder: props.renderOrder,
|
|
75
|
+
transform: effectiveTransform.value
|
|
76
|
+
}, uniforms, componentDefinition);
|
|
77
|
+
};
|
|
78
|
+
const setupUniformWatchers = () => {
|
|
79
|
+
const scope = effectScope();
|
|
80
|
+
scope.run(() => {
|
|
81
|
+
Object.entries(uniforms).forEach(([propName, { uniform, transform }]) => {
|
|
82
|
+
watch(() => props[propName], (newValue) => {
|
|
83
|
+
if (uniform && uniform.value !== void 0) parentUniformUpdate(instanceId, propName, newValue);
|
|
84
|
+
}, { deep: true });
|
|
85
|
+
});
|
|
86
|
+
watch(() => [
|
|
87
|
+
props.blendMode,
|
|
88
|
+
props.opacity,
|
|
89
|
+
props.visible,
|
|
90
|
+
props.id,
|
|
91
|
+
props.maskSource,
|
|
92
|
+
props.maskType,
|
|
93
|
+
props.renderOrder,
|
|
94
|
+
props.transform
|
|
95
|
+
], ([blendMode, opacity, visible]) => {
|
|
96
|
+
parentMetadataUpdate(instanceId, {
|
|
97
|
+
blendMode,
|
|
98
|
+
opacity,
|
|
99
|
+
visible: visible === false ? false : true,
|
|
100
|
+
id: props.id,
|
|
101
|
+
mask: props.maskSource ? {
|
|
102
|
+
source: props.maskSource,
|
|
103
|
+
type: props.maskType || "alpha"
|
|
104
|
+
} : void 0,
|
|
105
|
+
renderOrder: props.renderOrder,
|
|
106
|
+
transform: effectiveTransform.value
|
|
107
|
+
});
|
|
108
|
+
}, { deep: true });
|
|
109
|
+
if (rendererResetSignal) watch(() => rendererResetSignal.value, (newValue) => {
|
|
110
|
+
if (newValue > 0) registerWithRenderer();
|
|
111
|
+
}, { immediate: true });
|
|
112
|
+
});
|
|
113
|
+
onBeforeUnmount(() => {
|
|
114
|
+
scope.stop();
|
|
115
|
+
});
|
|
116
|
+
};
|
|
117
|
+
setupUniformWatchers();
|
|
118
|
+
onBeforeUnmount(() => {
|
|
119
|
+
parentRegister(instanceId, null, null, null, null, null);
|
|
120
|
+
});
|
|
121
|
+
return (_ctx, _cache) => {
|
|
122
|
+
return renderSlot(_ctx.$slots, "default");
|
|
123
|
+
};
|
|
124
|
+
}
|
|
125
|
+
});
|
|
126
|
+
export { Halftone_vue_vue_type_script_setup_true_lang_default as default };
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
import { computed, defineComponent, effectScope, inject, mergeDefaults, onBeforeUnmount, provide, renderSlot, toValue, watch } from "vue";
|
|
2
|
+
import { createUniformsMap } from "../core/index.js";
|
|
3
|
+
import { componentDefinition } from "../core/shaders/HueShift/index.js";
|
|
4
|
+
var HueShift_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
5
|
+
__name: "HueShift",
|
|
6
|
+
props: /* @__PURE__ */ mergeDefaults({
|
|
7
|
+
blendMode: {},
|
|
8
|
+
opacity: {},
|
|
9
|
+
visible: { type: Boolean },
|
|
10
|
+
id: {},
|
|
11
|
+
maskSource: {},
|
|
12
|
+
maskType: {},
|
|
13
|
+
renderOrder: {},
|
|
14
|
+
transform: {},
|
|
15
|
+
shift: {}
|
|
16
|
+
}, {
|
|
17
|
+
blendMode: "normal",
|
|
18
|
+
renderOrder: 0,
|
|
19
|
+
visible: true,
|
|
20
|
+
...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
21
|
+
acc[key] = config.default;
|
|
22
|
+
return acc;
|
|
23
|
+
}, {})
|
|
24
|
+
}),
|
|
25
|
+
setup(__props) {
|
|
26
|
+
const props = __props;
|
|
27
|
+
const instanceId = props.id || `${componentDefinition.name.toLowerCase()}_${Math.random().toString(36).substring(7)}`;
|
|
28
|
+
provide("ombreParentId", instanceId);
|
|
29
|
+
const DEFAULT_TRANSFORM = {
|
|
30
|
+
offsetX: 0,
|
|
31
|
+
offsetY: 0,
|
|
32
|
+
rotation: 0,
|
|
33
|
+
scale: 1,
|
|
34
|
+
anchorX: .5,
|
|
35
|
+
anchorY: .5,
|
|
36
|
+
edges: "transparent"
|
|
37
|
+
};
|
|
38
|
+
const effectiveTransform = computed(() => ({
|
|
39
|
+
...DEFAULT_TRANSFORM,
|
|
40
|
+
...props.transform
|
|
41
|
+
}));
|
|
42
|
+
const uniforms = createUniformsMap(componentDefinition, computed(() => {
|
|
43
|
+
let baseProps = { ...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
44
|
+
acc[key] = config.default;
|
|
45
|
+
return acc;
|
|
46
|
+
}, {}) };
|
|
47
|
+
for (const key in props) if (key !== "blendMode" && key !== "opacity" && key !== "visible" && key !== "id" && key !== "maskSource" && key !== "maskType" && key !== "renderOrder" && key !== "transform" && props[key] !== Object.entries(componentDefinition.props).reduce((acc, [key$1, config]) => {
|
|
48
|
+
acc[key$1] = config.default;
|
|
49
|
+
return acc;
|
|
50
|
+
}, {})[key]) baseProps[key] = toValue(props[key]);
|
|
51
|
+
return baseProps;
|
|
52
|
+
}).value, instanceId);
|
|
53
|
+
const parentId = inject("ombreParentId");
|
|
54
|
+
if (parentId === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
55
|
+
const parentRegister = inject("ombreNodeRegister");
|
|
56
|
+
if (parentRegister === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
57
|
+
const parentUniformUpdate = inject("ombreUniformUpdate");
|
|
58
|
+
if (parentUniformUpdate === void 0) throw new Error("Shader components require ombreUniformUpdate from parent");
|
|
59
|
+
const parentMetadataUpdate = inject("ombreMetadataUpdate");
|
|
60
|
+
if (parentMetadataUpdate === void 0) throw new Error("Shader components require ombreMetadataUpdate from parent");
|
|
61
|
+
const rendererResetSignal = inject("ombreRendererResetSignal");
|
|
62
|
+
const registerWithRenderer = () => {
|
|
63
|
+
parentRegister(instanceId, componentDefinition.fragmentNode, parentId, {
|
|
64
|
+
blendMode: props.blendMode,
|
|
65
|
+
opacity: props.opacity,
|
|
66
|
+
visible: props.visible === false ? false : true,
|
|
67
|
+
id: props.id,
|
|
68
|
+
mask: props.maskSource ? {
|
|
69
|
+
source: props.maskSource,
|
|
70
|
+
type: props.maskType || "alpha"
|
|
71
|
+
} : void 0,
|
|
72
|
+
renderOrder: props.renderOrder,
|
|
73
|
+
transform: effectiveTransform.value
|
|
74
|
+
}, uniforms, componentDefinition);
|
|
75
|
+
};
|
|
76
|
+
const setupUniformWatchers = () => {
|
|
77
|
+
const scope = effectScope();
|
|
78
|
+
scope.run(() => {
|
|
79
|
+
Object.entries(uniforms).forEach(([propName, { uniform, transform }]) => {
|
|
80
|
+
watch(() => props[propName], (newValue) => {
|
|
81
|
+
if (uniform && uniform.value !== void 0) parentUniformUpdate(instanceId, propName, newValue);
|
|
82
|
+
}, { deep: true });
|
|
83
|
+
});
|
|
84
|
+
watch(() => [
|
|
85
|
+
props.blendMode,
|
|
86
|
+
props.opacity,
|
|
87
|
+
props.visible,
|
|
88
|
+
props.id,
|
|
89
|
+
props.maskSource,
|
|
90
|
+
props.maskType,
|
|
91
|
+
props.renderOrder,
|
|
92
|
+
props.transform
|
|
93
|
+
], ([blendMode, opacity, visible]) => {
|
|
94
|
+
parentMetadataUpdate(instanceId, {
|
|
95
|
+
blendMode,
|
|
96
|
+
opacity,
|
|
97
|
+
visible: visible === false ? false : true,
|
|
98
|
+
id: props.id,
|
|
99
|
+
mask: props.maskSource ? {
|
|
100
|
+
source: props.maskSource,
|
|
101
|
+
type: props.maskType || "alpha"
|
|
102
|
+
} : void 0,
|
|
103
|
+
renderOrder: props.renderOrder,
|
|
104
|
+
transform: effectiveTransform.value
|
|
105
|
+
});
|
|
106
|
+
}, { deep: true });
|
|
107
|
+
if (rendererResetSignal) watch(() => rendererResetSignal.value, (newValue) => {
|
|
108
|
+
if (newValue > 0) registerWithRenderer();
|
|
109
|
+
}, { immediate: true });
|
|
110
|
+
});
|
|
111
|
+
onBeforeUnmount(() => {
|
|
112
|
+
scope.stop();
|
|
113
|
+
});
|
|
114
|
+
};
|
|
115
|
+
setupUniformWatchers();
|
|
116
|
+
onBeforeUnmount(() => {
|
|
117
|
+
parentRegister(instanceId, null, null, null, null, null);
|
|
118
|
+
});
|
|
119
|
+
return (_ctx, _cache) => {
|
|
120
|
+
return renderSlot(_ctx.$slots, "default");
|
|
121
|
+
};
|
|
122
|
+
}
|
|
123
|
+
});
|
|
124
|
+
export { HueShift_vue_vue_type_script_setup_true_lang_default as default };
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import { computed, defineComponent, effectScope, inject, mergeDefaults, onBeforeUnmount, provide, renderSlot, toValue, watch } from "vue";
|
|
2
|
+
import { createUniformsMap } from "../core/index.js";
|
|
3
|
+
import { componentDefinition } from "../core/shaders/ImageTexture/index.js";
|
|
4
|
+
var ImageTexture_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
5
|
+
__name: "ImageTexture",
|
|
6
|
+
props: /* @__PURE__ */ mergeDefaults({
|
|
7
|
+
blendMode: {},
|
|
8
|
+
opacity: {},
|
|
9
|
+
visible: { type: Boolean },
|
|
10
|
+
id: {},
|
|
11
|
+
maskSource: {},
|
|
12
|
+
maskType: {},
|
|
13
|
+
renderOrder: {},
|
|
14
|
+
transform: {},
|
|
15
|
+
url: {},
|
|
16
|
+
objectFit: {}
|
|
17
|
+
}, {
|
|
18
|
+
blendMode: "normal",
|
|
19
|
+
renderOrder: 0,
|
|
20
|
+
visible: true,
|
|
21
|
+
...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
22
|
+
acc[key] = config.default;
|
|
23
|
+
return acc;
|
|
24
|
+
}, {})
|
|
25
|
+
}),
|
|
26
|
+
setup(__props) {
|
|
27
|
+
const props = __props;
|
|
28
|
+
const instanceId = props.id || `${componentDefinition.name.toLowerCase()}_${Math.random().toString(36).substring(7)}`;
|
|
29
|
+
provide("ombreParentId", instanceId);
|
|
30
|
+
const DEFAULT_TRANSFORM = {
|
|
31
|
+
offsetX: 0,
|
|
32
|
+
offsetY: 0,
|
|
33
|
+
rotation: 0,
|
|
34
|
+
scale: 1,
|
|
35
|
+
anchorX: .5,
|
|
36
|
+
anchorY: .5,
|
|
37
|
+
edges: "transparent"
|
|
38
|
+
};
|
|
39
|
+
const effectiveTransform = computed(() => ({
|
|
40
|
+
...DEFAULT_TRANSFORM,
|
|
41
|
+
...props.transform
|
|
42
|
+
}));
|
|
43
|
+
const uniforms = createUniformsMap(componentDefinition, computed(() => {
|
|
44
|
+
let baseProps = { ...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
45
|
+
acc[key] = config.default;
|
|
46
|
+
return acc;
|
|
47
|
+
}, {}) };
|
|
48
|
+
for (const key in props) if (key !== "blendMode" && key !== "opacity" && key !== "visible" && key !== "id" && key !== "maskSource" && key !== "maskType" && key !== "renderOrder" && key !== "transform" && props[key] !== Object.entries(componentDefinition.props).reduce((acc, [key$1, config]) => {
|
|
49
|
+
acc[key$1] = config.default;
|
|
50
|
+
return acc;
|
|
51
|
+
}, {})[key]) baseProps[key] = toValue(props[key]);
|
|
52
|
+
return baseProps;
|
|
53
|
+
}).value, instanceId);
|
|
54
|
+
const parentId = inject("ombreParentId");
|
|
55
|
+
if (parentId === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
56
|
+
const parentRegister = inject("ombreNodeRegister");
|
|
57
|
+
if (parentRegister === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
58
|
+
const parentUniformUpdate = inject("ombreUniformUpdate");
|
|
59
|
+
if (parentUniformUpdate === void 0) throw new Error("Shader components require ombreUniformUpdate from parent");
|
|
60
|
+
const parentMetadataUpdate = inject("ombreMetadataUpdate");
|
|
61
|
+
if (parentMetadataUpdate === void 0) throw new Error("Shader components require ombreMetadataUpdate from parent");
|
|
62
|
+
const rendererResetSignal = inject("ombreRendererResetSignal");
|
|
63
|
+
const registerWithRenderer = () => {
|
|
64
|
+
parentRegister(instanceId, componentDefinition.fragmentNode, parentId, {
|
|
65
|
+
blendMode: props.blendMode,
|
|
66
|
+
opacity: props.opacity,
|
|
67
|
+
visible: props.visible === false ? false : true,
|
|
68
|
+
id: props.id,
|
|
69
|
+
mask: props.maskSource ? {
|
|
70
|
+
source: props.maskSource,
|
|
71
|
+
type: props.maskType || "alpha"
|
|
72
|
+
} : void 0,
|
|
73
|
+
renderOrder: props.renderOrder,
|
|
74
|
+
transform: effectiveTransform.value
|
|
75
|
+
}, uniforms, componentDefinition);
|
|
76
|
+
};
|
|
77
|
+
const setupUniformWatchers = () => {
|
|
78
|
+
const scope = effectScope();
|
|
79
|
+
scope.run(() => {
|
|
80
|
+
Object.entries(uniforms).forEach(([propName, { uniform, transform }]) => {
|
|
81
|
+
watch(() => props[propName], (newValue) => {
|
|
82
|
+
if (uniform && uniform.value !== void 0) parentUniformUpdate(instanceId, propName, newValue);
|
|
83
|
+
}, { deep: true });
|
|
84
|
+
});
|
|
85
|
+
watch(() => [
|
|
86
|
+
props.blendMode,
|
|
87
|
+
props.opacity,
|
|
88
|
+
props.visible,
|
|
89
|
+
props.id,
|
|
90
|
+
props.maskSource,
|
|
91
|
+
props.maskType,
|
|
92
|
+
props.renderOrder,
|
|
93
|
+
props.transform
|
|
94
|
+
], ([blendMode, opacity, visible]) => {
|
|
95
|
+
parentMetadataUpdate(instanceId, {
|
|
96
|
+
blendMode,
|
|
97
|
+
opacity,
|
|
98
|
+
visible: visible === false ? false : true,
|
|
99
|
+
id: props.id,
|
|
100
|
+
mask: props.maskSource ? {
|
|
101
|
+
source: props.maskSource,
|
|
102
|
+
type: props.maskType || "alpha"
|
|
103
|
+
} : void 0,
|
|
104
|
+
renderOrder: props.renderOrder,
|
|
105
|
+
transform: effectiveTransform.value
|
|
106
|
+
});
|
|
107
|
+
}, { deep: true });
|
|
108
|
+
if (rendererResetSignal) watch(() => rendererResetSignal.value, (newValue) => {
|
|
109
|
+
if (newValue > 0) registerWithRenderer();
|
|
110
|
+
}, { immediate: true });
|
|
111
|
+
});
|
|
112
|
+
onBeforeUnmount(() => {
|
|
113
|
+
scope.stop();
|
|
114
|
+
});
|
|
115
|
+
};
|
|
116
|
+
setupUniformWatchers();
|
|
117
|
+
onBeforeUnmount(() => {
|
|
118
|
+
parentRegister(instanceId, null, null, null, null, null);
|
|
119
|
+
});
|
|
120
|
+
return (_ctx, _cache) => {
|
|
121
|
+
return renderSlot(_ctx.$slots, "default");
|
|
122
|
+
};
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
export { ImageTexture_vue_vue_type_script_setup_true_lang_default as default };
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
import { computed, defineComponent, effectScope, inject, mergeDefaults, onBeforeUnmount, provide, renderSlot, toValue, watch } from "vue";
|
|
2
|
+
import { createUniformsMap } from "../core/index.js";
|
|
3
|
+
import { componentDefinition } from "../core/shaders/Invert/index.js";
|
|
4
|
+
var Invert_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
5
|
+
__name: "Invert",
|
|
6
|
+
props: /* @__PURE__ */ mergeDefaults({
|
|
7
|
+
blendMode: {},
|
|
8
|
+
opacity: {},
|
|
9
|
+
visible: { type: Boolean },
|
|
10
|
+
id: {},
|
|
11
|
+
maskSource: {},
|
|
12
|
+
maskType: {},
|
|
13
|
+
renderOrder: {},
|
|
14
|
+
transform: {}
|
|
15
|
+
}, {
|
|
16
|
+
blendMode: "normal",
|
|
17
|
+
renderOrder: 0,
|
|
18
|
+
visible: true,
|
|
19
|
+
...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
20
|
+
acc[key] = config.default;
|
|
21
|
+
return acc;
|
|
22
|
+
}, {})
|
|
23
|
+
}),
|
|
24
|
+
setup(__props) {
|
|
25
|
+
const props = __props;
|
|
26
|
+
const instanceId = props.id || `${componentDefinition.name.toLowerCase()}_${Math.random().toString(36).substring(7)}`;
|
|
27
|
+
provide("ombreParentId", instanceId);
|
|
28
|
+
const DEFAULT_TRANSFORM = {
|
|
29
|
+
offsetX: 0,
|
|
30
|
+
offsetY: 0,
|
|
31
|
+
rotation: 0,
|
|
32
|
+
scale: 1,
|
|
33
|
+
anchorX: .5,
|
|
34
|
+
anchorY: .5,
|
|
35
|
+
edges: "transparent"
|
|
36
|
+
};
|
|
37
|
+
const effectiveTransform = computed(() => ({
|
|
38
|
+
...DEFAULT_TRANSFORM,
|
|
39
|
+
...props.transform
|
|
40
|
+
}));
|
|
41
|
+
const uniforms = createUniformsMap(componentDefinition, computed(() => {
|
|
42
|
+
let baseProps = { ...Object.entries(componentDefinition.props).reduce((acc, [key, config]) => {
|
|
43
|
+
acc[key] = config.default;
|
|
44
|
+
return acc;
|
|
45
|
+
}, {}) };
|
|
46
|
+
for (const key in props) if (key !== "blendMode" && key !== "opacity" && key !== "visible" && key !== "id" && key !== "maskSource" && key !== "maskType" && key !== "renderOrder" && key !== "transform" && props[key] !== Object.entries(componentDefinition.props).reduce((acc, [key$1, config]) => {
|
|
47
|
+
acc[key$1] = config.default;
|
|
48
|
+
return acc;
|
|
49
|
+
}, {})[key]) baseProps[key] = toValue(props[key]);
|
|
50
|
+
return baseProps;
|
|
51
|
+
}).value, instanceId);
|
|
52
|
+
const parentId = inject("ombreParentId");
|
|
53
|
+
if (parentId === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
54
|
+
const parentRegister = inject("ombreNodeRegister");
|
|
55
|
+
if (parentRegister === void 0) throw new Error("Shader components must be used inside an <Shader> component or another shader component");
|
|
56
|
+
const parentUniformUpdate = inject("ombreUniformUpdate");
|
|
57
|
+
if (parentUniformUpdate === void 0) throw new Error("Shader components require ombreUniformUpdate from parent");
|
|
58
|
+
const parentMetadataUpdate = inject("ombreMetadataUpdate");
|
|
59
|
+
if (parentMetadataUpdate === void 0) throw new Error("Shader components require ombreMetadataUpdate from parent");
|
|
60
|
+
const rendererResetSignal = inject("ombreRendererResetSignal");
|
|
61
|
+
const registerWithRenderer = () => {
|
|
62
|
+
parentRegister(instanceId, componentDefinition.fragmentNode, parentId, {
|
|
63
|
+
blendMode: props.blendMode,
|
|
64
|
+
opacity: props.opacity,
|
|
65
|
+
visible: props.visible === false ? false : true,
|
|
66
|
+
id: props.id,
|
|
67
|
+
mask: props.maskSource ? {
|
|
68
|
+
source: props.maskSource,
|
|
69
|
+
type: props.maskType || "alpha"
|
|
70
|
+
} : void 0,
|
|
71
|
+
renderOrder: props.renderOrder,
|
|
72
|
+
transform: effectiveTransform.value
|
|
73
|
+
}, uniforms, componentDefinition);
|
|
74
|
+
};
|
|
75
|
+
const setupUniformWatchers = () => {
|
|
76
|
+
const scope = effectScope();
|
|
77
|
+
scope.run(() => {
|
|
78
|
+
Object.entries(uniforms).forEach(([propName, { uniform, transform }]) => {
|
|
79
|
+
watch(() => props[propName], (newValue) => {
|
|
80
|
+
if (uniform && uniform.value !== void 0) parentUniformUpdate(instanceId, propName, newValue);
|
|
81
|
+
}, { deep: true });
|
|
82
|
+
});
|
|
83
|
+
watch(() => [
|
|
84
|
+
props.blendMode,
|
|
85
|
+
props.opacity,
|
|
86
|
+
props.visible,
|
|
87
|
+
props.id,
|
|
88
|
+
props.maskSource,
|
|
89
|
+
props.maskType,
|
|
90
|
+
props.renderOrder,
|
|
91
|
+
props.transform
|
|
92
|
+
], ([blendMode, opacity, visible]) => {
|
|
93
|
+
parentMetadataUpdate(instanceId, {
|
|
94
|
+
blendMode,
|
|
95
|
+
opacity,
|
|
96
|
+
visible: visible === false ? false : true,
|
|
97
|
+
id: props.id,
|
|
98
|
+
mask: props.maskSource ? {
|
|
99
|
+
source: props.maskSource,
|
|
100
|
+
type: props.maskType || "alpha"
|
|
101
|
+
} : void 0,
|
|
102
|
+
renderOrder: props.renderOrder,
|
|
103
|
+
transform: effectiveTransform.value
|
|
104
|
+
});
|
|
105
|
+
}, { deep: true });
|
|
106
|
+
if (rendererResetSignal) watch(() => rendererResetSignal.value, (newValue) => {
|
|
107
|
+
if (newValue > 0) registerWithRenderer();
|
|
108
|
+
}, { immediate: true });
|
|
109
|
+
});
|
|
110
|
+
onBeforeUnmount(() => {
|
|
111
|
+
scope.stop();
|
|
112
|
+
});
|
|
113
|
+
};
|
|
114
|
+
setupUniformWatchers();
|
|
115
|
+
onBeforeUnmount(() => {
|
|
116
|
+
parentRegister(instanceId, null, null, null, null, null);
|
|
117
|
+
});
|
|
118
|
+
return (_ctx, _cache) => {
|
|
119
|
+
return renderSlot(_ctx.$slots, "default");
|
|
120
|
+
};
|
|
121
|
+
}
|
|
122
|
+
});
|
|
123
|
+
export { Invert_vue_vue_type_script_setup_true_lang_default as default };
|