Merge pull request #30 from bridgedxyz/feature/atom-detection

atom detection - icon button detection implemented

figma/src/builds/index.ts

@@ -0,0 +1,21 @@
+import { ImageRepository } from "../assets-repository"
+
+export abstract class BuildProcess {
+    readonly id: string
+    readonly processes: Array<BuildProcess> = []
+    imageAssetRepository: ImageRepository
+
+    constructor() {
+        this.id = Date.now().toString()
+    }
+
+
+    registerProcess(process: BuildProcess) {
+        this.processes.push(process)
+    }
+
+}
+
+export class FlutterBuilder extends BuildProcess {
+
+}

figma/src/flutter/interpreter/action.interpret.ts

@@ -1,7 +1,15 @@
 // interpret https://www.figma.com/plugin-docs/api/Action/
+export function isRouteAction(reaction: Reaction) {
+    const validTrigger = reaction.trigger.type === "ON_CLICK" ||
+        reaction.trigger.type === "ON_PRESS"
 
+    // no need to check for valid action. all action is representable with route
+    return validTrigger
+}
 
-export function interpretAction(action: Action, trigger: Trigger) {
+export function interpretAction(reaction: Reaction) {
+    const trigger = reaction.trigger
+    const action = reaction.action
 
     switch (trigger.type) {
         case "ON_CLICK":

figma/src/flutter/make/button.make.ts

@@ -4,9 +4,10 @@ import { makeColor } from "./color.make";
 import { Snippet } from "@bridged.xyz/flutter-builder/lib/builder/buildable-tree";
 import { makeBorderRadius } from "./border-radius.make";
 import { makeBorderSide } from "./border-side.make";
+import { makeDynamicIcon, makeIcon } from "./icon.make";
 
 export function makeButton(manifest: DetectedButtonManifest) {
-    const child = new Text(manifest.text?.characters)
+    const text = new Text(manifest.text?.characters)
     const color: Color = makeColor(manifest.base.fills)
     const textColor: Color = makeColor(manifest.text?.fills)
     const minWidth = manifest.base.width
@@ -15,16 +16,32 @@ export function makeButton(manifest: DetectedButtonManifest) {
         borderRadius: makeBorderRadius(manifest.base),
         side: makeBorderSide(manifest.base)
     })
+    const onPressed = Snippet.fromStatic('(){ print("Button clicked!"); }') as any
+
+
+    if (manifest.icon) {
+        const icon = makeDynamicIcon(manifest.icon)
+        return FlatButton.icon({
+            onPressed: onPressed,
+            label: text,
+            icon: icon,
+            color: color,
+            textColor: textColor,
+            minWidth: minWidth,
+            height: height,
+            shape: shape,
+        })
+    }
 
     return new FlatButton(
         {
-            onPressed: Snippet.fromStatic('(){ print("Button clicked!"); }') as any,
-            child: child,
+            onPressed: onPressed,
+            child: text,
             color: color,
             textColor: textColor,
             minWidth: minWidth,
             height: height,
-            shape: shape
+            shape: shape,
         }
     );
 }

figma/src/flutter/make/image.make.ts

@@ -18,5 +18,5 @@ export function makeIllustImage(node: ReflectSceneNode): Image {
         width: node.width,
         height: node.height,
         fit: BoxFit.cover as Snippet
-    })
+    }).addComment(`image content of ${node.toString()}`)
 }

figma/src/flutter/make/routes.make.ts

@@ -0,0 +1,51 @@
+import { detectIfScreen } from "@reflect.bridged.xyz/detection/lib/screen.detection";
+import { isRouteAction } from "../interpreter/action.interpret";
+
+export function makeRoutes(): Array<string> {
+    const routes = Array<string>()
+    const allScreenReactions = fetchAllActionsGlobal({
+        onlyScreen: true
+    })
+
+    for (const id of Object.keys(allScreenReactions)) {
+        const singleScreenReactions: Reaction[] = allScreenReactions[id]
+        const validReactions = singleScreenReactions.filter((r) => isRouteAction(r))
+        for (const reaction of validReactions) {
+            if (reaction.action.type == "NODE") {
+                routes.push(reaction.action.destinationId)
+            }
+        }
+    }
+    return routes
+}
+
+
+function fetchAllActionsGlobal(options?: {
+    onlyScreen: boolean
+}): Map<string, Array<Reaction>> {
+
+    const filter = options?.onlyScreen ? (n: SceneNode): boolean => {
+        // as any type casting might cause an error afterwards.
+        return detectIfScreen(n as any).result
+    } : () => true
+
+    let reactions = new Map<string, Array<Reaction>>();
+    figma.root.children.forEach(page => {
+        page.children.forEach(node => {
+            if (filter(node))
+                reactions = new Map([...reactions, ...fetchAllActionsUnderNode(node)])
+        })
+    });
+    return reactions
+}
+
+function fetchAllActionsUnderNode(node: SceneNode): Map<string, Array<Reaction>> {
+    let reactions = new Map<string, Array<Reaction>>();
+    if ('reactions' in node) {
+        reactions[node.id] = node.reactions
+    }
+    if ('children' in node) {
+        reactions = new Map<string, Array<Reaction>>([...reactions, ...fetchAllActionsUnderNode(node)])
+    }
+    return reactions;
+}

yarn.lock

@@ -2900,6 +2900,11 @@ cocoascript-class@^0.1.2:
   resolved "https://registry.yarnpkg.com/cocoascript-class/-/cocoascript-class-0.1.2.tgz#dab25f20389946d9986c1812b88ac3783eec42d3"
   integrity sha1-2rJfIDiZRtmYbBgSuIrDeD7sQtM=
 
+[email protected]:
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/coli/-/coli-0.0.1.tgz#039d81bb8a45fc53ac51a640e4e8e9f3db6d3acf"
+  integrity sha512-0H1UGi0qix1aRTbAT/jP/ZtqrErb0gIWzSR5UXCnbBwL6YXkzXhiJ9M/gFhKLqjBuedCPk/wk1ev0ws5HPPYNg==
+
 collect-v8-coverage@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/collect-v8-coverage/-/collect-v8-coverage-1.0.1.tgz#cc2c8e94fc18bbdffe64d6534570c8a673b27f59"