Feat : add tokens, handle mutex effects

services/loadCards.ts

@@ -9,28 +9,33 @@ export async function compileCards(app: App<any>) {
     eager: true,
   });
 
-  //   const components = await Promise.all(
-  //     Object.entries(svgs).map(async ([k, v]) => {
-  //       const regex = /([\d]+)(?=\.svg)/gm;
-  //       const url = (v as any).default as string;
-  //       let template = await (await fetch(url)).text();
-  //       let arrayTemplate = template.split("\n");
-  //       arrayTemplate.splice(0, 1);
-  //       template = arrayTemplate.join("\n");
+  // const components = await Promise.all(
+  //   Object.entries(svgs).map(async ([k, v]) => {
+  //     const regex = /([\d]+)(?=\.svg)/gm;
+  //     const url = (v as any).default as string;
+  //     let template = await (await fetch(url)).text();
+  //     let arrayTemplate = template.split("\n");
+  //     arrayTemplate.splice(0, 1);
+  //     template = arrayTemplate.join("\n");
 
-  //       return [
-  //         k.match(regex)![0],
-  //         defineComponent({
-  //           props: ["currentTurn", "card"],
-  //           setup(_props) {
-  //             const count = ref(0);
-  //             return { count };
+  //     return [
+  //       k.match(regex)![0],
+  //       defineComponent({
+  //         props: ["used_effects_indexes", "card"],
+  //         setup(_props) {
+  //           const count = ref(0);
+  //           return { count };
+  //         },
+  //         methods: {
+  //           effectClick(effect: number) {
+  //             this.$emit("effectClick", effect);
   //           },
-  //           template: template,
-  //         }),
-  //       ];
-  //     })
-  //   );
+  //         },
+  //         template: template,
+  //       }),
+  //     ];
+  //   })
+  // );
 
   const components = await Promise.all(
     Object.entries(svgs).map(async ([k, v]) => {
@@ -45,10 +50,16 @@ export async function compileCards(app: App<any>) {
         Number(k.match(regex)![0]).toString(),
         markRaw(
           defineAsyncComponent({
-            loader: async () => ({
-              props: ["used_effects_indexes", "card"],
-              template: template,
-            }),
+            loader: async () =>
+              defineComponent({
+                props: ["used_effects_indexes", "card"],
+                methods: {
+                  effectClick(effect: number) {
+                    this.$emit("effectClick", effect);
+                  },
+                },
+                template: template,
+              }),
           })
         ),
       ];