🎉 Add addTokensLib method to the library

library/CHANGES.md

@@ -1,5 +1,10 @@
 # CHANGELOG
 
+## 1.1.0-RC1
+
+- Add experimental addTokensLib method
+
+
 ## 1.0.11
 
 - Set correct path if it is not provided on addComponent

library/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@penpot/library",
-  "version": "1.0.11",
+  "version": "1.1.0-RC1",
   "license": "MPL-2.0",
   "author": "Kaleidos INC",
   "packageManager": "yarn@4.10.3+sha512.c38cafb5c7bb273f3926d04e55e1d8c9dfa7d9c3ea1f36a4868fa028b9e5f72298f0b7f401ad5eb921749eb012eb1c3bb74bf7503df3ee43fd600d14a018266f",
   "type": "module",
   "repository": {
     "type": "git",
-    "url": "https://github.com/penpot/penpot"
+    "url": "git+https://github.com/penpot/penpot.git"
   },
   "resolutions": {
     "@zip.js/zip.js@npm:^2.7.44": "patch:@zip.js/zip.js@npm%3A2.7.60#~/.yarn/patches/@zip.js-zip.js-npm-2.7.60-b6b814410b.patch"

library/src/lib/builder.cljs

@@ -11,6 +11,7 @@
    [app.common.files.builder :as fb]
    [app.common.json :as json]
    [app.common.schema :as sm]
+   [app.common.types.tokens-lib :refer [read-multi-set-dtcg]]
    [app.common.uuid :as uuid]
    [app.util.object :as obj]))
 
@@ -263,6 +264,15 @@
                        :mtype (get fmedia :mtype)}]
             (json/->js (d/without-nils image))))))
 
+    :addTokensLib
+    (fn [data]
+      (try
+        (let [tlib (read-multi-set-dtcg data)]
+          (swap! state fb/add-tokens-lib tlib)
+          nil)
+        (catch :default cause
+          (handle-exception cause))))
+
     :genId
     (fn []
       (dm/str (uuid/next)))

library/test/_tokens-1.json

@@ -0,0 +1,62 @@
+{
+  "a": {},
+  "b": {
+    "aaa": {
+      "$value": "red",
+      "$type": "color",
+      "$description": ""
+    },
+    "bbb": {
+      "$value": "blue",
+      "$type": "color",
+      "$description": ""
+    },
+    "ccc": {
+      "eee": {
+        "$value": "green",
+        "$type": "color",
+        "$description": ""
+      }
+    },
+    "fff": {
+      "ttt": {
+        "$value": {
+          "fontFamilies": [
+            "Aboreto"
+          ],
+          "fontSizes": "12",
+          "fontWeights": "300"
+        },
+        "$type": "typography",
+        "$description": ""
+      }
+    }
+  },
+  "b/c": {},
+  "$themes": [
+    {
+      "id": "48af6582-f247-8060-8006-ff4dd1d761a8",
+      "name": "tes1",
+      "description": "",
+      "isSource": false,
+      "selectedTokenSets": {
+        "a": "enabled",
+        "b": "enabled"
+      }
+    }
+  ],
+  "$metadata": {
+    "tokenSetOrder": [
+      "a",
+      "b",
+      "b/c"
+    ],
+    "activeThemes": [
+      "/tes1"
+    ],
+    "activeSets": [
+      "a",
+      "b"
+    ]
+  }
+}

library/test/builder.test.js

@@ -1,8 +1,15 @@
 import assert from "node:assert/strict";
 import test from "node:test";
+import * as fs from "node:fs";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
 
 import * as penpot  from "#self";
 
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 test("create empty context", () => {
   const context = penpot.createBuildContext();
   assert.ok(context);
@@ -118,3 +125,48 @@ test("create context with color", () => {
   assert.equal(color.opacity, params.opacity);
   assert.equal(color.name, params.name);
 });
+
+
+test("create context with tokens lib as json", () => {
+  const context = penpot.createBuildContext();
+
+  const fileId = context.addFile({name: "file 1"});
+  const pageId = context.addPage({name: "page 1"});
+
+
+  const tokensFilePath = path.join(__dirname, "_tokens-1.json");
+  const tokens = fs.readFileSync(tokensFilePath, "utf8");
+
+  context.addTokensLib(tokens);
+
+
+  const internalState = context.getInternalState();
+  const file = internalState.files[fileId];
+
+  assert.ok(file, "file should exist");
+
+  assert.ok(file.data);
+  assert.ok(file.data.tokensLib)
+});
+
+test("create context with tokens lib as obj", () => {
+  const context = penpot.createBuildContext();
+
+  const fileId = context.addFile({name: "file 1"});
+  const pageId = context.addPage({name: "page 1"});
+
+
+  const tokensFilePath = path.join(__dirname, "_tokens-1.json");
+  const tokens = fs.readFileSync(tokensFilePath, "utf8");
+
+  context.addTokensLib(JSON.parse(tokens))
+
+
+  const internalState = context.getInternalState();
+  const file = internalState.files[fileId];
+
+  assert.ok(file, "file should exist");
+
+  assert.ok(file.data);
+  assert.ok(file.data.tokensLib)
+});