Spike/launch fixes

README.md

@@ -58,9 +58,9 @@ Bricks is composed of a number of components. Below is a description of each com
 - `core`: engine that converts Figma nodes into coding files.
 
 ## License
-Distributed under the Apache 2.0 License. See `LICENSE` for more information.
+Distributed under the Apache 2.0 License and Bricks Enterprise License. See `LICENSE` for more information.
 
 ## Get in Touch
 Email: spike@bricks-tech.com
 
-<a href="https://join.slack.com/t/brickscommunity/shared_invite/zt-1pb2hy3h2-9rDYWMZdHKxHblzUG0CpTQ"><img src="https://img.shields.io/badge/slack-bricks-blue?logo=slack&labelColor=2EB67D" alt="Join Bricks on Slack"></a>
+<a href="https://discord.gg/NM6aeBeqCD"><img src="https://img.shields.io/badge/discord-bricks-blue?logo=discord&labelColor=2EB67D" alt="Join Bricks on Discord"></a>

core/ee/code/prop.ts

@@ -142,6 +142,14 @@ export const getTextVariableProp = (nodeId: string): string => {
     for (const propBinding of propBindings) {
       for (const location of propBinding.locations) {
         if (location.type === "text") {
+          if (propBinding.dataType === DataType.boolean) {
+            if (isEmpty(propBinding.conditionalValue)) {
+              continue;
+            }
+
+            return `{${propBinding.prop} ? "${propBinding.defaultValue}" : "${propBinding.conditionalValue}"}`;
+          }
+
           return `{${propBinding.prop}}`;
         }
       }

core/ee/cv/component-recognition.ts

@@ -2,7 +2,7 @@ import { Node, NodeType } from "../../src/bricks/node";
 import { ExportFormat } from "../../src/design/adapter/node";
 import { traverseNodes } from "../../src/utils";
 import { AiApplication, aiApplicationRegistryGlobalInstance } from "../ui/ai-application-registry";
-import { predictImage, predictText } from "../web/request";
+import { predictImage } from "../web/request";
 
 export const annotateNodeForHtmlTag = async (startingNode: Node) => {
   try {
@@ -32,17 +32,10 @@ export const annotateNodeForHtmlTag = async (startingNode: Node) => {
       return node?.getType() !== NodeType.VECTOR_GROUP;
     });
 
-    // console.log("idImageMap", idImageMap);
-    // console.log("idTextMap", idTextMap);
-
-    const [predictImagesResult, predictTextsResult] = await Promise.allSettled([
+    const [predictImagesResult] = await Promise.allSettled([
       predictImage(idImageMap),
-      predictText(idTextMap),
     ]);
 
-    const textPredictions =
-      predictTextsResult.status === "fulfilled" ? predictTextsResult.value : {};
-
     const imagePredictions =
       predictImagesResult.status === "fulfilled"
         ? predictImagesResult.value
@@ -52,23 +45,16 @@ export const annotateNodeForHtmlTag = async (startingNode: Node) => {
       console.error("Error with image prediction", predictImagesResult.reason);
     }
 
-    if (predictTextsResult.status === "rejected") {
-      console.error("Error with image prediction", predictTextsResult.reason);
-    }
-
-    // console.log("imagePredictions", imagePredictions);
-    // console.log("textPredictions", textPredictions);
-
     await traverseNodes(startingNode, async (node) => {
       if (node.node) {
         const originalId = node.node.getOriginalId();
         const predictedHtmlTag =
-          imagePredictions[originalId] || textPredictions[originalId];
+          imagePredictions[originalId];
 
         if (predictedHtmlTag) {
           aiApplicationRegistryGlobalInstance.addApplication(AiApplication.componentIdentification);
           node.addAnnotations("htmlTag", predictedHtmlTag);
-          return predictedHtmlTag !== "a" && predictedHtmlTag !== "button";
+          return predictedHtmlTag !== "button";
         }
       }
 

core/ee/loop/component.ts

@@ -3,10 +3,11 @@ import { isEmpty } from "../../src/utils";
 import { CssFramework } from "../../src/code/code";
 import { getTwcssClass } from "../../src/code/generator/tailwindcss/css-to-twcss";
 import { optionRegistryGlobalInstance } from "../../src/code/option-registry/option-registry";
-import { areAllNodesSimilar, vectorGroupAnnotation } from "./loop";
+import { areAllNodesSimilar } from "./loop";
 import { nameRegistryGlobalInstance } from "../../src/code/name-registry/name-registry";
 import { IdToPropBindingMap, propRegistryGlobalInstance } from "./prop-registry";
 import uuid from "react-native-uuid";
+import { shouldUseAsBackgroundImage } from "../../src/bricks/util";
 
 type PropLocation = {
   type: string;
@@ -393,39 +394,32 @@ export const gatherPropsFromSimilarNodes = (nodes: Node[], instanceIds: string[]
     return [false, {}];
   }
 
-  const cssProps: ComponentProperties = optionRegistryGlobalInstance.getOption().cssFramework === CssFramework.tailwindcss ? gatherTwcssPropsFromNodes(nodes, instanceIds) : gatherCssPropsFromNodes(nodes, instanceIds);
+  const [result, similarNodes] = areAllNodesSimilar(nodes);
+  if (!result) {
+    return [false, {}];
+  }
+
+  const cssProps: ComponentProperties = optionRegistryGlobalInstance.getOption().cssFramework === CssFramework.tailwindcss ? gatherTwcssPropsFromNodes(similarNodes, instanceIds) : gatherCssPropsFromNodes(similarNodes, instanceIds);
   let componentProps: ComponentProperties = {
-    ...gatherPropsFromImageNodes(nodes, instanceIds),
-    ...gatherPropsFromVectorNodes(nodes, instanceIds),
-    ...gatherTextPropsFromNodes(nodes, instanceIds),
+    ...gatherPropsFromImageNodes(similarNodes, instanceIds),
+    ...gatherPropsFromVectorNodes(similarNodes, instanceIds),
+    ...gatherTextPropsFromNodes(similarNodes, instanceIds),
     ...cssProps,
   };
 
-
-  let allVectorGroups: boolean = true;
-  for (const node of nodes) {
-    if (!node.hasAnnotation(vectorGroupAnnotation)) {
-      allVectorGroups = false;
-    }
-  }
-
-  if (allVectorGroups) {
+  let children: Node[] = similarNodes[0].getChildren();
+  if (isEmpty(children)) {
     return [true, componentProps];
   }
 
-  if (!areAllNodesSimilar(nodes)) {
-    return [false, {}];
-  }
-
-  let children: Node[] = nodes[0].getChildren();
   for (let i = 0; i < children.length; i++) {
-    let similarNodes: Node[] = [];
-    for (const targetNode of nodes) {
+    let similarChildrenNodes: Node[] = [];
+    for (const targetNode of similarNodes) {
       const targetChildren: Node[] = targetNode.getChildren();
-      similarNodes.push(targetChildren[i]);
+      similarChildrenNodes.push(targetChildren[i]);
     }
 
-    const [result, targetProps] = gatherPropsFromSimilarNodes(similarNodes, instanceIds);
+    const [result, targetProps] = gatherPropsFromSimilarNodes(similarChildrenNodes, instanceIds);
     if (!result) {
       return [result, {}];
     }
@@ -447,7 +441,7 @@ export const gatherPropsFromVectorNodes = (nodes: Node[], instanceIds: string[])
   }
 
   for (const node of nodes) {
-    if (!node.hasAnnotation(vectorGroupAnnotation)) {
+    if (node.getType() !== NodeType.VECTOR || shouldUseAsBackgroundImage(node)) {
       return properties;
     }
   }
@@ -503,7 +497,7 @@ export const gatherPropsFromImageNodes = (nodes: Node[], instanceIds: string[]):
   }
 
   for (const node of nodes) {
-    if (node.getType() !== NodeType.IMAGE) {
+    if (node.getType() !== NodeType.IMAGE || shouldUseAsBackgroundImage(node)) {
       return properties;
     }
   }
@@ -606,7 +600,8 @@ export const gatherCssPropsFromNodes = (potentiallyRepeatedNode: Node[], instanc
     return properties;
   }
 
-  const sampleNodeType: NodeType = potentiallyRepeatedNode[0].getType();
+  const sampleNode: Node = potentiallyRepeatedNode[0];
+  const sampleNodeType: NodeType = sampleNode.getType();
 
   let existingCssKeys: Set<string> = new Set<string>();
   for (const node of potentiallyRepeatedNode) {
@@ -676,7 +671,7 @@ export const gatherCssPropsFromNodes = (potentiallyRepeatedNode: Node[], instanc
 
   Object.entries(properties).forEach(([id, { cssKey, bindings }]) => {
     let firstBinding: PropValueBinding = bindings[0];
-    if (sampleNodeType === NodeType.IMAGE || sampleNodeType === NodeType.VECTOR_GROUP || sampleNodeType === NodeType.VECTOR) {
+    if (!shouldUseAsBackgroundImage(sampleNode) && (sampleNodeType === NodeType.IMAGE || sampleNodeType === NodeType.VECTOR_GROUP || sampleNodeType === NodeType.VECTOR)) {
       if (cssKey !== "width" && cssKey !== "height") {
         delete properties[id];
         return;
@@ -702,7 +697,8 @@ export const gatherTwcssPropsFromNodes = (potentiallyRepeatedNode: Node[], insta
     return properties;
   }
 
-  const sampleNodeType: NodeType = potentiallyRepeatedNode[0].getType();
+  const sampleNode: Node = potentiallyRepeatedNode[0];
+  const sampleNodeType: NodeType = sampleNode.getType();
 
   let existingCssKeys: Set<string> = new Set<string>();
   for (const node of potentiallyRepeatedNode) {
@@ -778,7 +774,7 @@ export const gatherTwcssPropsFromNodes = (potentiallyRepeatedNode: Node[], insta
   }
 
   Object.entries(properties).forEach(([id, { cssKey, bindings }]) => {
-    if (sampleNodeType === NodeType.IMAGE || sampleNodeType === NodeType.VECTOR_GROUP || sampleNodeType === NodeType.VECTOR) {
+    if (!shouldUseAsBackgroundImage(sampleNode) && (sampleNodeType === NodeType.IMAGE || sampleNodeType === NodeType.VECTOR_GROUP || sampleNodeType === NodeType.VECTOR)) {
       if (cssKey !== "width" && cssKey !== "height") {
         delete properties[id];
         return;