Ingest style tokens from Figma file

[GLips]

It would be nice to be able to ingest variables from Figma and create or update tokens—CSS variables, Tailwind configs, etc—in code. Will require a new endpoint.

[Li-vien]

I am trying to restore the figma design more perfectly and extract the design specifications.

1. Compress simplifiedResponse and extract common layout and style as variables.
2. Extract vector elements that are not easy to implement in code and convert them into image nodes.
   Still learning....

{
  "name": "UI",
  "nodes": [
    {
      "id": "0:91",
      "name": "Create Video",
      "type": "TEXT",
      "textStyle": "style_P40VP0",
      "fills": "fill_HCLAPB",
      "text": "Create Video",
      "size": {
        "width": 88,
        "height": 18
      }
    }
  ],
  "globalVars": {
    "fill_HCLAPB": [
      {
        "rgba": "rgba(255, 255, 255, 1)"
      }
    ],
    "style_P40VP0": {
      "fontFamily": "Merriweather",
      "fontWeight": 700,
      "fontSize": 20,
      "lineHeight": "25.139999389648438px",
      "textAlignHorizontal": "LEFT",
      "textAlignVertical": "TOP"
    },
    "childrenToParents": {
      "vector_ACAEHB": [
        "0:96"
      ],
      "vector_BB8S9B": [
        "0:103"
      ],
      "vector_6FR6P5": [
        "I0:108;2552:17336",
        "I0:108;2552:19136",
        "I0:108;2552:19676",
        "I0:108;2552:20144",
        "I0:108;2552:20561",
        "I0:108;2552:21026",
        "I0:108;2552:21482",
        "I0:109;2552:17336",
        "I0:109;2552:17961",
        "I0:109;2552:19136",
        "I0:109;2552:19676",
        "I0:109;2552:20144",
        "I0:109;2552:20561",
        "I0:109;2552:21026",
        "I0:109;2552:21482",
        "I0:110;2552:17336",
        "I0:110;2552:17961",
        "I0:110;2552:19136",
        "I0:110;2552:19676",
        "I0:110;2552:20144",
        "I0:110;2552:20561",
        "I0:110;2552:21026",
        "I0:110;2552:21482",
        "I0:111;2552:17336",
        "I0:111;2552:17961",
        "I0:111;2552:19136",
        "I0:111;2552:19676",
        "I0:111;2552:20144",
        "I0:111;2552:20561",
        "I0:111;2552:21026",
        "I0:111;2552:21482"
      ]
    }
  }
}

[GLips]

Neat @Li-vien—I see some of the changes you're working on in your fork. Looks promising, as long as AI agents are able to keep track of references to more global CSS values rather than in-line with the various layout elements.

[GLips]

@Li-vien are you working on code that can be merged back into the main repo? I'd welcome contributions!

Otherwise I'll probably tackle this in the next week or so.

[Li-vien]

There are a lot of customized modifications in my branch, wait for me to sort it out...