Assistant with Coding & Image gen flow

.gitmodules

@@ -1,15 +1,9 @@
 [submodule "packages/lint"]
 	path = packages/lint
 	url = https://github.com/reflect-ui/design-lint
-[submodule "packages/design-sdk"]
-	path = packages/design-sdk
-	url = https://github.com/gridaco/design-sdk
 [submodule "packages/base-sdk"]
 	path = packages/base-sdk
 	url = https://github.com/gridaco/base-sdk
-[submodule "packages/reflect-core"]
-	path = packages/reflect-core
-	url = https://github.com/reflect-ui/reflect-core-ts
 [submodule "packages/reflect-ui-generator"]
 	path = packages/reflect-ui-generator
 	url = https://github.com/reflect-ui/reflect-ui-generator

README.md

@@ -9,7 +9,6 @@ title: Grida Assistant for Figma
 
 ![Grida assistant](./branding/assistant-cover-v2021.8.0.png)
 
-<div style="text-align:center"><a href="https://www.producthunt.com/posts/grida-assistant-figma-2-flutter-react?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-grida-assistant-figma-2-flutter-react" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=310028&theme=light" alt="Grida Assistant - Figma 2 Flutter &React - Free & Opensource Design2Code Plugin with lot more features. | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a></div>
 
 # Grdia Assistant plugin (figma to flutter & react)
 

app/lib/main/index.tsx

@@ -20,7 +20,7 @@ import { PhotoScreen } from "@app/photo-loader";
 import { MetaEditorScreen, BatchMetaEditor } from "@app/meta-editor";
 import { ExporterScreen } from "@app/export-scene-as-json";
 import { DataMapperScreen } from "@app/data-mapper";
-import { CopywriterScreen, ChatScreen } from "@app/copywriter";
+import { CopywriterScreen, ChatScreen } from "@app/assist";
 import { GlobalizationScreen } from "@app/i18n";
 import { ToolboxScreen } from "../pages/tool-box";
 import { FontReplacerScreen } from "@toolbox/font-replacer";
@@ -74,7 +74,8 @@ function Screen(props: { screen: WorkScreen }) {
     case WorkScreen.photo:
       return <PhotoScreen />;
     case WorkScreen.copy:
-      // return <CopywriterScreen />;
+      return <CopywriterScreen />;
+    case WorkScreen.assist:
       return <ChatScreen />;
     case WorkScreen.lint:
       return <LintScreen />;

app/lib/routing/layout-preference.ts

@@ -18,6 +18,7 @@ export function getWorkmodeTabLayout(workspaceMode: WorkMode): TabLayout {
       case WorkMode.design:
         return [
           WorkScreen.preview,
+          WorkScreen.assist,
           WorkScreen.icon,
           WorkScreen.photo,
           WorkScreen.copy,
@@ -71,6 +72,8 @@ export function workScreenToName(appMode: WorkScreen): string {
       return "photo";
     case WorkScreen.copy:
       return "copy";
+    case WorkScreen.assist:
+      return "assist";
     case WorkScreen.lint:
       return "lint";
     case WorkScreen.exporter:

app/lib/routing/pages.ts

@@ -58,6 +58,12 @@ const page_design_copywriter: PageConfig = {
   path: "/design/copywriter",
 };
 
+const page_design_assistant: PageConfig = {
+  id: WorkScreen.assist,
+  title: "Assist",
+  path: "/design/assistant",
+};
+
 const page_design_layout: PageConfig = {
   id: WorkScreen.layout,
   title: "Layout",
@@ -154,6 +160,7 @@ const all_pages: PageConfig[] = [
   page_design_icon,
   page_design_photo,
   page_design_copywriter,
+  page_design_assistant,
   page_code_layout,
   page_code_preview,
   page_code_component,

app/lib/routing/release-visibility-preference.ts

@@ -15,6 +15,7 @@ const SCREEN_VISIBILITY_PREFERENCE: Map<WorkScreen, ReleaseChannel> = new Map([
   [WorkScreen.layout, "beta"],
   [WorkScreen.icon, "release"],
   [WorkScreen.photo, "release"],
+  [WorkScreen.assist, "release"],
   [WorkScreen.copy, "release"],
   [WorkScreen.preview, "release"],
   [WorkScreen.live, "beta"],

app/lib/routing/work-screen.ts

@@ -9,6 +9,7 @@ export enum WorkScreen {
   component = "component",
   preview = "preview",
   layout = "layout",
+  assist = "assist",
   copy = "copy",
   icon = "icon",
   photo = "photo",

app/package.json

@@ -15,15 +15,17 @@
     "@base-sdk/functions-code-format": "^0.0.0",
     "@bridged.xyz/base-sdk": "^0.0.2-1",
     "@code-ui/docstring": "^0.0.12",
-    "@design-sdk/universal": "^0.0.0",
+    "@design-sdk/figma-checksum": "^0.0.43",
+    "@design-sdk/flags": "^0.0.43",
     "@designto/code": "0.0.1",
     "@emotion/react": "^11.4.0",
     "@emotion/styled": "^11.3.0",
     "@plugin-sdk/app": "0.0.0",
     "@plugin-sdk/core": "0.0.0",
-    "@reflect-ui/core": "0.0.2-rc.7-local",
+    "@reflect-ui/core": "0.0.10",
     "@reflect-ui/lint": "0.0.5-rc",
     "@reflect.bridged.xyz/ui-generator": "0.0.1",
+    "assert": "2.0.0",
     "classnames": "^2.3.1",
     "coli": "0.0.3",
     "copy-to-clipboard": "^3.3.1",
@@ -44,6 +46,7 @@
     "react": "^18.2.0"
   },
   "devDependencies": {
+    "@types/assert": "^1.5.6",
     "@types/lodash": "^4.14.172",
     "@types/react": "^18.0.28",
     "@types/react-router-dom": "^5.3.3",

figma-core/code-thread/selection.ts

@@ -1,6 +1,6 @@
 import { analyzeSelection, SelectionAnalysis } from "plugin-app/utils";
-import { convert } from "@design-sdk/figma";
-import type { ReflectSceneNode } from "@design-sdk/figma";
+import { convert } from "@design-sdk/figma-node-conversion";
+import type { ReflectSceneNode } from "@design-sdk/figma-node";
 import { Logger } from "logger";
 import { makeReference } from "@design-sdk/figma-node";
 import { runon } from "./runon";
@@ -126,7 +126,7 @@ export function onfigmaselectionchange() {
         const data = makeReference(rnode);
 
         // support text node (characters) =========
-        // FIXME: safely remove (migrate) this. (affected: @app/copywriter) - add a proper text support
+        // FIXME: safely remove (migrate) this. (affected: @app/assist) - add a proper text support
         if (rnode.type == "TEXT") {
           if ("data" in rnode) {
             data["characters"] = rnode.data;

figma-core/event-handlers/init.ts

@@ -1,15 +1,17 @@
-import { __register__ as __register_create_button__ } from "./create-button";
 import { __register__ as __register_create_icon__ } from "./create-icon";
 import { __register__ as __register_create_image__ } from "./apply-image";
 import { __register__ as __register_replace_text_characters__ } from "./apply-text-characters";
 import { __register__ as __register_replace_font__ } from "./replace-font";
 import { __register__ as __register_hide_all__ } from "./hide-all";
 import { __register__ as __register_randomize_selection__ } from "./randomize-selection";
 //
-__register_create_button__();
 __register_create_icon__();
 __register_create_image__();
 __register_replace_text_characters__();
 __register_replace_font__();
 __register_hide_all__();
 __register_randomize_selection__();
+
+// disabled for build size optimization. re-enable after migrating seed data on web side.
+// import { __register__ as __register_create_button__ } from "./create-button";
+// __register_create_button__();

figma-core/index.ts

@@ -20,8 +20,8 @@
 
 import { onfigmaselectionchange } from "./code-thread/selection";
 import { onfigmamessage } from "./code-thread/message-handler";
-import { MainImageRepository } from "@design-sdk/core/assets-repository";
-import { ImageRepositories } from "@design-sdk/figma/asset-repository";
+import { MainImageRepository } from "@design-sdk/asset-repository";
+import { ImageRepositories } from "@design-sdk/figma/dist/asset-repository";
 
 figma.on("selectionchange", () => {
   onfigmaselectionchange();

figma-core/reflect-render/buttons.render/index.ts

@@ -1,6 +1,6 @@
-import { Color } from "@reflect-ui/core/lib/color";
+import { Color } from "@reflect-ui/core";
 import { reflectColorToFigmaRGB } from "@design-sdk/figma-node-conversion";
-import { ButtonColorScheme } from "@reflect-ui/core/lib/theme/color-schemes";
+import { ButtonColorScheme } from "@reflect-ui/core/dist/theme/color-schemes";
 import { BUTTON_COLOR_SCHEMES_SET } from "@reflect.bridged.xyz/ui-generator/lib/seeds/color-schemes/button.color-scheme.seed";
 import { BUTTON_TEXTS_SET_EN } from "@reflect.bridged.xyz/ui-generator/lib/seeds";
 import { BUTTON_BASE_GRADIENTS_SET } from "@reflect.bridged.xyz/ui-generator/lib/seeds/gradients/button-base.gradients.seed";

figma-core/reflect-render/cgrect.render/index.ts

@@ -2,7 +2,7 @@ import {
   reflectColorToFigmaRGBA,
   reflectColorToFigmaRGB,
 } from "@design-sdk/figma-node-conversion";
-import { Color } from "@reflect-ui/core/lib/color";
+import { Color } from "@reflect-ui/core";
 
 // his should be repplaced by reflect's `CGRectManifest` when fully constructed
 interface FigmaRenderRectManifest {

figma-core/reflect-render/icons.render/index.ts

@@ -1,10 +1,6 @@
 import { reflectColorToFigmaColor } from "@design-sdk/figma-node-conversion";
-import { Color } from "@reflect-ui/core/lib/color";
-import { NamedIconConfig } from "@reflect-ui/core";
-import {
-  ICON_DEFAULT_SIZE,
-  ICON_MAX_SIZE,
-} from "@reflect-ui/core/lib/icon/icon.constants";
+import { Color } from "@reflect-ui/core";
+import { ICON_DEFAULT_SIZE, ICON_MAX_SIZE } from "@reflect-ui/core/k";
 
 export type IconPlacement = { x: number; y: number } | "center";
 

figma-core/reflect-render/text.render/index.ts

@@ -1,5 +1,5 @@
 import { reflectColorToFigmaColor } from "@design-sdk/figma-node-conversion";
-import { Color } from "@reflect-ui/core/lib/color";
+import { Color } from "@reflect-ui/core";
 
 // FIXME - this should be repplaced by reflect's `TextManifest` when fully constructed
 interface FigmaRenderTextManifest {

figma-native/package.json

@@ -15,31 +15,6 @@
     "figma-js": "^1.13.0",
     "figma-core": "0.0.0"
   },
-  "devDependencies": {
-    "@babel/core": "^7.14.3",
-    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-transform-runtime": "^7.14.3",
-    "@babel/preset-env": "^7.14.2",
-    "@babel/preset-react": "^7.13.13",
-    "@babel/preset-typescript": "^7.13.0",
-    "@babel/runtime": "^7.14.0",
-    "@types/fs-extra": "^9.0.1",
-    "@types/node": "^14.11.8",
-    "@types/pug": "^2.0.4",
-    "babel-loader": "^8.2.2",
-    "css-loader": "^3.1.0",
-    "dotenv": "^8.2.0",
-    "dotenv-webpack": "^2.0.0",
-    "html-webpack-inline-source-plugin": "0.0.10",
-    "html-webpack-plugin": "^3.2.0",
-    "style-loader": "^0.23.1",
-    "terser-webpack-plugin": "^4.2.3",
-    "ts-loader": "^6.0.4",
-    "typescript": "^4.0.5",
-    "url-loader": "^2.1.0",
-    "webpack": "^4.38.0",
-    "webpack-cli": "^3.3.6"
-  },
   "scripts": {
     "webpack:watch": "webpack --watch",
     "build": "webpack -p --mode=production",