@canvas3/nuxt 0.0.5 → 0.0.7

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "canvas-nuxt-layout",
   "configKey": "canvas3Layout",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.0"

package/dist/module.mjs

@@ -1,6 +1,6 @@
 import { defineNuxtModule, createResolver, addTemplate, addLayout, addComponent, addPlugin, addImports } from '@nuxt/kit';
 
-const module = defineNuxtModule({
+const module$1 = defineNuxtModule({
   meta: {
     name: "canvas-nuxt-layout",
     configKey: "canvas3Layout"
@@ -29,4 +29,4 @@ const module = defineNuxtModule({
   }
 });
 
-export { module as default };
+export { module$1 as default };

package/dist/runtime/components/canvas3-image.vue

@@ -16,7 +16,7 @@
 import { ref, computed, watch, onMounted, nextTick, onBeforeUnmount } from "vue";
 import { Canvas3 } from "#canvas3-nuxt/utils/canvas3/canvas3";
 const props = defineProps({
-  options: { type: Object, required: true, default: () => ({
+  options: { type: Object, required: false, default: () => ({
     alt: "",
     src: "",
     loadStrategy: "lazy",
@@ -36,10 +36,10 @@ const addImageToCanvas = async () => {
   image.value.dataset.meshId = generatedMeshId;
   await Canvas3.addImageAsMesh(
     image.value,
-    props.options.shaderName,
+    props.options.shaderName ?? null,
     generatedMeshId,
-    props.options.uniforms,
-    props.options.activateMeshUniforms
+    props.options.uniforms ?? {},
+    props.options.activateMeshUniforms ?? {}
   );
   imgAddedToCanvas.value = true;
 };
@@ -47,7 +47,8 @@ watch(() => Canvas3.canvasInitiated.value, (ready) => {
   if (ready) addImageToCanvas();
 });
 watch(() => props.options.uniforms, (u) => {
-  Canvas3.meshUniformsUpdate(generatedMeshId, u);
+  if (u)
+    Canvas3.meshUniformsUpdate(generatedMeshId, u);
 }, { deep: true });
 watch(() => props.options.src, () => {
   imgAddedToCanvas.value = false;

package/dist/runtime/components/canvas3-image.vue.d.ts

@@ -1,6 +1,6 @@
 import type { Canvas3ImageBindType } from '#canvas3-nuxt/types/types';
 type __VLS_Props = {
-    options: Canvas3ImageBindType;
+    options?: Canvas3ImageBindType;
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     options: Canvas3ImageBindType;

package/dist/runtime/layouts/canvas3-layout.vue

@@ -21,13 +21,16 @@
 import { ref, watch } from "vue";
 import { Canvas3 } from "#canvas3-nuxt/utils/canvas3/canvas3";
 const emit = defineEmits(["canvas3-ready"]);
-const props = useAttrs();
-const canvasEl = ref("canvasEl");
-const scrollableContent = ref("scrollableContent");
+const props = defineProps({
+  canvas3enabled: { type: Boolean, required: true },
+  canvas3options: { type: Object, required: true }
+});
+const canvasEl = ref();
+const scrollableContent = ref();
 watch(
   () => props.canvas3enabled,
   async (newValue) => {
-    if (newValue) {
+    if (newValue && canvasEl.value && scrollableContent.value) {
       await Canvas3.init(
         canvasEl.value,
         scrollableContent.value,

package/dist/runtime/layouts/canvas3-layout.vue.d.ts

@@ -1,8 +1,13 @@
+import type { Canvas3OptionsType } from '#canvas3-nuxt/types/types';
+type __VLS_Props = {
+    canvas3enabled: boolean;
+    canvas3options: Canvas3OptionsType;
+};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<{}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/server/tsconfig.json

@@ -1,3 +1,12 @@
+
 {
-  "extends": "../../../.nuxt/tsconfig.server.json",
+  "extends": "../../../.nuxt/tsconfig.json",
+  "include": [
+    "src/runtime/types/vue-directives.d.ts"
+  ],
+  "exclude": [
+    "dist",
+    "node_modules",
+    "playground"
+  ]
 }

package/dist/runtime/types/types.d.ts

@@ -1,5 +1,5 @@
 import type { Mesh, Vector2 } from 'three';
-import type { DirectiveBinding, ObjectDirective } from 'vue';
+import type { DirectiveBinding } from 'vue';
 type Shader = {
     fragmentShader: string;
     vertexShader: string;
@@ -110,12 +110,7 @@ export type Canvas3ImageBindType = {
     src: string;
     loadStrategy?: 'lazy' | 'eager' | undefined;
     shaderName?: string;
-    uniforms?: MeshMaterialUniform;
-    activateMeshUniforms: MeshMaterialUniform;
+    uniforms?: MeshMaterialUniform | undefined;
+    activateMeshUniforms?: MeshMaterialUniform;
 };
-declare module 'vue' {
-    interface GlobalDirectives {
-        'canvas3-image': ObjectDirective<HTMLImageElement, Canvas3ImageBinding>;
-    }
-}
 export {};

package/dist/runtime/types/types.js

@@ -1 +0,0 @@
-export {};

package/dist/runtime/types/vue-directives.d.ts

@@ -1,9 +1,19 @@
-import type { ObjectDirective } from 'vue'
-import type { Canvas3ImageBinding } from '~/src/runtime/types/types'
+import type { DirectiveBinding, ObjectDirective } from 'vue'
+import type { Canvas3ImageBinding, scrollActionBindOptionType } from '~/src/runtime/types/types'
+
+// declare module '@vue/runtime-core' {
+//   export interface GlobalDirectives {
+//     vCanvas3Image: ObjectDirective<HTMLImageElement, Canvas3ImageBinding>
+//     vActionOnScroll: ObjectDirective<HTMLElement, scrollActionBindOptionType>
+//     vSetDataAttributes: ObjectDirective<HTMLElement, DirectiveBinding>
+//   }
+// }
 
 declare module 'vue' {
   export interface GlobalDirectives {
-    'canvas3-image': ObjectDirective<HTMLImageElement, Canvas3ImageBinding>
+    vCanvas3Image: ObjectDirective<HTMLImageElement, Canvas3ImageBinding>
+    vActionOnScroll: ObjectDirective<HTMLElement, scrollActionBindOptionType>
+    vSetDataAttributes: ObjectDirective<HTMLElement, DirectiveBinding>
   }
 }
 

package/dist/runtime/utils/canvas3/canvas3.js

@@ -340,7 +340,9 @@ class Canvas3Class {
   //   }
   // }
   async addImageAsMesh(imgHtmlEl, shaderName, meshId, meshUniforms, activateMeshUniforms) {
-    this.activateMeshUniformMap.set(meshId, activateMeshUniforms);
+    if (activateMeshUniforms) {
+      this.activateMeshUniformMap.set(meshId, activateMeshUniforms);
+    }
     let vertexShader = this.options.shaders.default.vertexShader;
     let fragmentShader = this.options.shaders.default.fragmentShader;
     if (shaderName && this.options.shaders[shaderName]) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canvas3/nuxt",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "publishConfig": {
     "access": "public"
   },
@@ -47,16 +47,15 @@
     "vue": "^3.5.18"
   },
   "devDependencies": {
-    "@nuxt/devtools": "^2.6.2",
+    "@nuxt/devtools": "2.6.4",
     "@nuxt/eslint-config": "^1.2.0",
     "@nuxt/module-builder": "^1.0.1",
     "@nuxt/schema": "^4.0.0",
     "@nuxt/test-utils": "^3.19.2",
     "@types/node": "latest",
     "@types/three": "^0.178.1",
-    "changelogen": "^0.6.2",
     "eslint": "^9.30.1",
-    "nuxt": "^4.0.0",
+    "nuxt": "4.1.0",
     "typescript": "~5.8.3",
     "vitest": "^3.2.4",
     "vue-tsc": "^3.0.1"