add test code

libs/figma-plugin/.gitignore

@@ -0,0 +1,8 @@
+# Node
+*.log
+*.log.*
+node_modules
+
+out/
+dist/
+code.js

libs/figma-plugin/README.md

@@ -0,0 +1,40 @@
+Below are the steps to get your plugin running. You can also find instructions at:
+
+https://www.figma.com/plugin-docs/plugin-quickstart-guide/
+
+This plugin template uses Typescript and NPM, two standard tools in creating JavaScript applications.
+
+First, download Node.js which comes with NPM. This will allow you to install TypeScript and other
+libraries. You can find the download link here:
+
+https://nodejs.org/en/download/
+
+Next, install TypeScript using the command:
+
+npm install -g typescript
+
+Finally, in the directory of your plugin, get the latest type definitions for the plugin API by running:
+
+npm install --save-dev @figma/plugin-typings
+
+If you are familiar with JavaScript, TypeScript will look very familiar. In fact, valid JavaScript code
+is already valid Typescript code.
+
+TypeScript adds type annotations to variables. This allows code editors such as Visual Studio Code
+to provide information about the Figma API while you are writing code, as well as help catch bugs
+you previously didn't notice.
+
+For more information, visit https://www.typescriptlang.org/
+
+Using TypeScript requires a compiler to convert TypeScript (code.ts) into JavaScript (code.js)
+for the browser to run.
+
+We recommend writing TypeScript code using Visual Studio code:
+
+1. Download Visual Studio Code if you haven't already: https://code.visualstudio.com/.
+2. Open this directory in Visual Studio Code.
+3. Compile TypeScript to JavaScript: Run the "Terminal > Run Build Task..." menu item,
+   then select "npm: watch". You will have to do this again every time
+   you reopen Visual Studio Code.
+
+That's it! Visual Studio Code will regenerate the JavaScript file every time you save.

libs/figma-plugin/code.ts

@@ -0,0 +1,155 @@
+// https://github.com/maxmartynov/figma-plugin-copy-prototype-link
+
+figma.showUI(__html__);
+
+figma.ui.onmessage = async (message) => {
+  if (message.type === "copySelected") {
+    figma.ui.postMessage({
+      type: "selectionCopied",
+      payload: await copySelected(),
+    });
+  }
+};
+
+const copySelected = async () => {
+  let context: Context = createContext();
+
+  for (const node of figma.currentPage.selection) {
+    context = await writeNode(node, context);
+  }
+
+  console.log(context.content);
+
+  return context.content;
+};
+
+const writeNode = async (node: SceneNode, context: Context) => {
+  switch (node.type) {
+    case "TEXT":
+      return writeText(node, context);
+    case "GROUP":
+      return writeGroup(node, context);
+    case "FRAME":
+      return writeGroup(node, context);
+    case "RECTANGLE":
+      return writeRectangle(node, context);
+    case "INSTANCE":
+      return writeInstance(node, context);
+  }
+  console.log(node.type);
+
+  return context;
+};
+
+const writeText = async (node: TextNode, context: Context) => {
+  context = addBuffer(`text ${JSON.stringify(node.characters)}`, context);
+
+  context = await writeBlock(async (context) => {
+    context = await writeStyle(node, context);
+    return context;
+  }, context);
+
+  context = addBuffer(`\n`, context);
+  return context;
+};
+
+const writeBlock = async (
+  write: (context: Context) => Promise<Context>,
+  context: Context
+) => {
+  context = addBuffer(` {\n`, context);
+  context = await writeInner(write, context);
+  context = addBuffer(`}`, context);
+  return context;
+};
+
+const writeInner = async (
+  write: (context: Context) => Promise<Context>,
+  context: Context
+) => {
+  context = startBlock(context);
+  context = await write(context);
+  context = endBlock(context);
+  return context;
+};
+
+const writeRectangle = async (node: RectangleNode, context: Context) => {
+  return context;
+};
+
+const writeInstance = async (node: InstanceNode, context: Context) => {
+  context = await writeGroup(node, context);
+  return context;
+};
+const writeGroup = async (
+  node: GroupNode | FrameNode | InstanceNode,
+  context: Context
+) => {
+  context = addBuffer(`div`, context);
+
+  context = await writeBlock(async (context) => {
+    context = await writeStyle(node, context);
+
+    return writeChildren(node.children, context);
+  }, context);
+
+  context = addBuffer(`\n`, context);
+
+  return context;
+};
+
+const writeStyle = async (node: SceneNode, context: Context) => {
+  const style = await node.getCSSAsync();
+
+  context = addBuffer(`style {\n`, context);
+  context = startBlock(context);
+  for (const key in style) {
+    context = addBuffer(`${key}: ${style[key]}\n`, context);
+  }
+  context = endBlock(context);
+  context = addBuffer(`}\n`, context);
+  return context;
+};
+
+const writeChildren = async (
+  children: readonly SceneNode[],
+  context: Context
+) => {
+  for (const node of children) {
+    context = await writeNode(node, context);
+  }
+  return context;
+};
+
+type Context = {
+  indent: string;
+  content: string;
+  line: number;
+  isNewLine: boolean;
+};
+
+const createContext = (): Context => ({
+  indent: "  ",
+  content: "",
+  line: 0,
+  isNewLine: false,
+});
+
+const addBuffer = (value: string, context: Context): Context => ({
+  ...context,
+  content:
+    context.content +
+    (context.isNewLine ? context.indent.repeat(context.line) : "") +
+    value,
+  isNewLine: value.charAt(value.length - 1) === "\n",
+});
+
+const startBlock = (context: Context): Context => ({
+  ...context,
+  line: context.line + 1,
+});
+
+const endBlock = (context: Context): Context => ({
+  ...context,
+  line: context.line - 1,
+});

libs/figma-plugin/manifest.json

@@ -0,0 +1,14 @@
+{
+  "name": "Paperclip",
+  "id": "1345863815184263227",
+  "api": "1.0.0",
+  "main": "code.js",
+  "capabilities": [],
+  "ui": "./ui.html",
+  "enableProposedApi": true,
+
+  "editorType": ["figma"],
+  "networkAccess": {
+    "allowedDomains": ["none"]
+  }
+}

libs/figma-plugin/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@paperclip-ui/figma-plugin",
+  "version": "1.0.0",
+  "description": "Copy + paste plugin for Paperclip",
+  "main": "code.js",
+  "scripts": {
+    "build": "tsc",
+    "build:watch": "tsc --watch",
+    "paperclip:designer": "../../target/debug/paperclip_cli designer --open",
+    "lint": "eslint --ext .ts,.tsx --ignore-pattern node_modules .",
+    "lint:fix": "eslint --ext .ts,.tsx --ignore-pattern node_modules --fix .",
+    "watch": "npm run build -- --watch"
+  },
+  "author": "",
+  "license": "",
+  "devDependencies": {
+    "@figma/eslint-plugin-figma-plugins": "*",
+    "@figma/plugin-typings": "*",
+    "@typescript-eslint/eslint-plugin": "^6.12.0",
+    "@typescript-eslint/parser": "^6.12.0",
+    "eslint": "^8.54.0",
+    "typescript": "^5.3.2"
+  },
+  "eslintConfig": {
+    "extends": [
+      "eslint:recommended",
+      "plugin:@typescript-eslint/recommended",
+      "plugin:@figma/figma-plugins/recommended"
+    ],
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+      "project": "./tsconfig.json"
+    },
+    "root": true,
+    "rules": {
+      "@typescript-eslint/no-unused-vars": [
+        "error",
+        {
+          "argsIgnorePattern": "^_",
+          "varsIgnorePattern": "^_",
+          "caughtErrorsIgnorePattern": "^_"
+        }
+      ]
+    }
+  }
+}

libs/figma-plugin/paperclip.config.json

@@ -0,0 +1,14 @@
+{
+  "srcDir": "test",
+  "experimental": ["script", "condition", "repeat"],
+  "moduleDirs": [],
+  "globalScripts": [],
+  "openCodeEditorCommandTemplate": "code --goto \"<file>:<line>:<column>\"",
+  "compilerOptions": [
+    {
+      "emit": ["yew.rs:rs", "css", "react.js:js", "react.d.ts:d.ts"],
+      "assetOutDir": "assets",
+      "embedAssetMaxSize": -1
+    }
+  ]
+}

libs/figma-plugin/test.js

@@ -0,0 +1 @@
+export const aba = () => {};

libs/figma-plugin/test.ts

@@ -0,0 +1 @@
+export const aba = () => {};