@greensight/gts 1.0.0-alpha.4 → 1.0.0-alpha.5

package/README.md

@@ -1,4 +1,4 @@
-# @greensight/gts
+# Greensight Token System
 
 Generate design tokens from Figma.
 

package/index.d.ts

@@ -1,3 +1,5 @@
 export { generate } from './commands/generate';
 export { init } from './commands/init';
+export type { IGtsConfig } from './classes/Config';
+export * from './modules/colors';
 //# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,YAAY,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AACnD,cAAc,kBAAkB,CAAC"}

package/index.js

@@ -1,87 +1,87 @@
-var k = Object.defineProperty;
-var x = (n, e, t) => e in n ? k(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
-var l = (n, e, t) => x(n, typeof e != "symbol" ? e + "" : e, t);
-import { tsImport as F } from "ts-import";
-import { existsSync as h } from "node:fs";
-import { readFile as u, mkdir as O, writeFile as b, rm as j } from "node:fs/promises";
-import { resolve as w } from "node:path";
-const a = class a {
+var U = Object.defineProperty;
+var z = (o, e, r) => e in o ? U(o, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : o[e] = r;
+var b = (o, e, r) => z(o, typeof e != "symbol" ? e + "" : e, r);
+import { tsImport as H } from "ts-import";
+import { existsSync as N } from "node:fs";
+import { readFile as k, mkdir as K, writeFile as Q, rm as Z } from "node:fs/promises";
+import { resolve as R } from "node:path";
+const d = class d {
   static resolveReadPath(e) {
     if (!e || !e.trim())
       throw new Error("File path must be a non-empty string");
-    return w(a.baseDir, e);
+    return R(d.baseDir, e);
   }
-  static resolveWritePath(e, t) {
-    const r = w(a.baseDir, t ?? "");
+  static resolveWritePath(e, r) {
+    const t = R(d.baseDir, r ?? "");
     return {
-      targetDir: r,
-      targetPath: w(r, e)
+      targetDir: t,
+      targetPath: R(t, e)
     };
   }
-  static handleReadError(e, t) {
-    throw e.code === "ENOENT" ? new Error(`File not found: ${t}`) : new Error(
-      `Failed to read file "${t}": ${e.message ?? String(e)}`
+  static handleReadError(e, r) {
+    throw e.code === "ENOENT" ? new Error(`File not found: ${r}`) : new Error(
+      `Failed to read file "${r}": ${e.message ?? String(e)}`
     );
   }
-  static async read(e, t = "utf8") {
-    const r = a.resolveReadPath(e);
+  static async read(e, r = "utf8") {
+    const t = d.resolveReadPath(e);
     try {
-      return await u(r, { encoding: t });
+      return await k(t, { encoding: r });
     } catch (s) {
-      a.handleReadError(s, r);
+      d.handleReadError(s, t);
     }
   }
   static async readBuffer(e) {
-    const t = a.resolveReadPath(e);
+    const r = d.resolveReadPath(e);
     try {
-      return await u(t);
-    } catch (r) {
-      a.handleReadError(r, t);
+      return await k(r);
+    } catch (t) {
+      d.handleReadError(t, r);
     }
   }
   static async readJson(e) {
-    const t = a.resolveReadPath(e);
+    const r = d.resolveReadPath(e);
     try {
-      const r = await u(t, { encoding: "utf8" });
+      const t = await k(r, { encoding: "utf8" });
       try {
-        return JSON.parse(r);
+        return JSON.parse(t);
       } catch (s) {
-        throw new Error(`Failed to parse JSON from "${t}": ${s.message}`);
+        throw new Error(`Failed to parse JSON from "${r}": ${s.message}`);
       }
-    } catch (r) {
-      a.handleReadError(r, t);
+    } catch (t) {
+      d.handleReadError(t, r);
     }
   }
-  static async write(e, t = "", r = {}) {
-    const { directory: s, overwrite: o = !0 } = r, { targetDir: i, targetPath: c } = a.resolveWritePath(e, s);
-    if (!o && h(c))
-      throw new Error(`File ${c} already exists`);
-    return await O(i, { recursive: !0 }), await b(c, t, { encoding: "utf8" }), c;
+  static async write(e, r = "", t = {}) {
+    const { directory: s, overwrite: n = !0 } = t, { targetDir: a, targetPath: l } = d.resolveWritePath(e, s);
+    if (!n && N(l))
+      throw new Error(`File ${l} already exists`);
+    return await K(a, { recursive: !0 }), await Q(l, r, { encoding: "utf8" }), l;
   }
-  static async writeWithExtension(e, t, r = "", s) {
-    const o = t.startsWith(".") ? t : `.${t}`, i = `${e}${o}`;
-    return a.write(i, r, s);
+  static async writeWithExtension(e, r, t = "", s) {
+    const n = r.startsWith(".") ? r : `.${r}`, a = `${e}${n}`;
+    return d.write(a, t, s);
   }
   static exists(e) {
-    const t = a.resolveReadPath(e);
-    return h(t);
+    const r = d.resolveReadPath(e);
+    return N(r);
   }
-  static async delete(e, t) {
-    const { targetPath: r } = a.resolveWritePath(e, t);
-    h(r) && await j(r, { force: !0 });
+  static async delete(e, r) {
+    const { targetPath: t } = d.resolveWritePath(e, r);
+    N(t) && await Z(t, { force: !0 });
   }
 };
-l(a, "baseDir", process.cwd());
-let f = a;
-const d = class d {
+b(d, "baseDir", process.cwd());
+let m = d;
+const p = class p {
   static async create() {
-    if (f.exists(d.configFileName))
+    if (m.exists(p.configFileName))
       throw new Error("The file already exists");
-    await f.write(d.configFileName, "", { overwrite: !1 });
+    await m.write(p.configFileName, "", { overwrite: !1 });
   }
   async load() {
     try {
-      const e = await F.compile(d.configFileName);
+      const e = await H.compile(p.configFileName);
       if (!e) throw new Error();
       return e.default;
     } catch (e) {
@@ -89,59 +89,59 @@ const d = class d {
     }
   }
 };
-l(d, "configFileName", "gts.config.ts");
-let m = d;
-const I = (n) => {
+b(p, "configFileName", "gts.config.ts");
+let F = p;
+const _ = (o) => {
   const e = new URLSearchParams();
-  return Object.keys(n).forEach((t) => {
-    Array.isArray(n[t]) ? n[t].forEach((r) => e.append(`${t}[]`, r)) : e.append(t, n[t]);
+  return Object.keys(o).forEach((r) => {
+    Array.isArray(o[r]) ? o[r].forEach((t) => e.append(`${r}[]`, t)) : e.append(r, o[r]);
   }), e;
-}, q = (n, e = 50) => {
-  const t = [];
-  for (let r = 0; r < n.length; r += e)
-    t.push(n.slice(r, r + e));
-  return t;
+}, ee = (o, e = 50) => {
+  const r = [];
+  for (let t = 0; t < o.length; t += e)
+    r.push(o.slice(t, t + e));
+  return r;
 };
-class g {
-  constructor(e, t) {
-    l(this, "figmaToken");
-    l(this, "fileId");
-    l(this, "onTimeMeasureHandler");
-    this.figmaToken = e, this.fileId = t;
+class T {
+  constructor(e, r) {
+    b(this, "figmaToken");
+    b(this, "fileId");
+    b(this, "onTimeMeasureHandler");
+    this.figmaToken = e, this.fileId = r;
   }
   setOnTimeMeasureHandler(e) {
     this.onTimeMeasureHandler = e;
   }
   static async returnJSON(e) {
-    const t = await e.json();
+    const r = await e.json();
     if (!e.ok) {
-      let r = "Request failed";
-      throw new Error(r);
+      let t = "Request failed";
+      throw new Error(t);
     }
-    return t;
+    return r;
   }
-  async performControlledRequest(e, { params: t = {}, timeout: r = 3e4, abortController: s = new AbortController() } = {}) {
-    var y;
-    const o = Object.entries(t).reduce((E, [N, P]) => typeof P < "u" ? { ...E, [N]: P } : E, {}), i = `https://api.figma.com/v1${e}${o && Object.keys(o).length ? `?${I(o)}` : ""}`;
-    console.log("endpoinWithParams=", i);
-    const c = setTimeout(() => s.abort(), r), p = {
+  async performControlledRequest(e, { params: r = {}, timeout: t = 3e4, abortController: s = new AbortController() } = {}) {
+    var u;
+    const n = Object.entries(r).reduce((c, [y, w]) => typeof w < "u" ? { ...c, [y]: w } : c, {}), a = `https://api.figma.com/v1${e}${n && Object.keys(n).length ? `?${_(n)}` : ""}`;
+    console.log("endpoinWithParams=", a);
+    const l = setTimeout(() => s.abort(), t), i = {
       "Content-Type": "application/json",
       ...this.figmaToken && { "X-Figma-Token": this.figmaToken }
-    }, $ = {
+    }, g = {
       method: "GET",
-      headers: p,
+      headers: i,
       signal: s.signal
-    }, T = performance.now(), R = await fetch(`${i}`, $);
-    clearTimeout(c);
-    const v = performance.now() - T;
-    return (y = this.onTimeMeasureHandler) == null || y.call(this, i, p, v), R;
+    }, h = performance.now(), f = await fetch(`${a}`, g);
+    clearTimeout(l);
+    const $ = performance.now() - h;
+    return (u = this.onTimeMeasureHandler) == null || u.call(this, a, i, $), f;
   }
-  async request(e, t) {
+  async request(e, r) {
     var s;
-    const r = await this.performControlledRequest(e, {
-      ...t
+    const t = await this.performControlledRequest(e, {
+      ...r
     });
-    return (s = r.headers.get("content-type")) != null && s.includes("application/json") ? g.returnJSON(r) : r;
+    return (s = t.headers.get("content-type")) != null && s.includes("application/json") ? T.returnJSON(t) : t;
   }
   async getComponents() {
     return this.request(`/files/${this.fileId}/components`);
@@ -150,20 +150,20 @@ class g {
     return this.request(`/files/${this.fileId}/styles`);
   }
   async getNodes(e) {
-    const t = q(e).map(
-      (o) => this.request(`/files/${this.fileId}/nodes`, { params: { ids: o.join(",") } })
-    ), r = await Promise.all(t);
+    const r = ee(e).map(
+      (n) => this.request(`/files/${this.fileId}/nodes`, { params: { ids: n.join(",") } })
+    ), t = await Promise.all(r);
     return {
-      ...r[0],
-      nodes: r.reduce((o, i) => ({ ...o, ...i.nodes }), {})
+      ...t[0],
+      nodes: t.reduce((n, a) => ({ ...n, ...a.nodes }), {})
     };
   }
 }
-const J = async () => {
-  const e = await new m().load();
+const be = async () => {
+  const e = await new F().load();
   if (!e)
     throw new Error("Заполнить ошибку через нейронку");
-  const { figmaToken: t, fileId: r, modules: s } = e, o = new g(t, r);
+  const { figmaToken: r, fileId: t, modules: s } = e, n = new T(r, t);
   await Promise.all(
     // [
     //     colorsFromStyles({
@@ -175,12 +175,280 @@ const J = async () => {
     //         output: { jsonDir: './fromVariables', stylesDir: './fromVariables' },
     //     }),
     // ]
-    s.map((i) => i.executor({ figmaApiClient: o }))
+    s.map((a) => a.executor({ figmaApiClient: n }))
   );
-}, A = async () => {
-  await m.create(), console.log("\x1B[32m%s\x1B[0m", "✔️ Configuration file created gts.config.ts");
-};
+}, pe = async () => {
+  await F.create(), console.log("\x1B[32m%s\x1B[0m", "✔️ Configuration file created gts.config.ts");
+}, re = ({ r: o, g: e, b: r }) => {
+  const t = (s) => `0${s.toString(16)}`.slice(-2);
+  return `#${t(o)}${t(e)}${t(r)}`;
+}, S = ({ opacity: o, r: e, g: r, b: t }) => {
+  const s = [e, r, t].map((n) => Math.round(n * 255));
+  return o < 1 ? `rgba(${s[0]}, ${s[1]}, ${s[2]}, ${o})` : re({ r: s[0], g: s[1], b: s[2] });
+}, W = (o, e = 0) => {
+  const r = Math.atan2(
+    o[1].y - o[0].y,
+    o[1].x - o[0].x
+  );
+  return Math.round(r * 180 / Math.PI) + e;
+}, C = (o) => o.reduce((e, r) => {
+  const t = Number((r.position * 100).toFixed(1));
+  return [
+    ...e,
+    `${S({
+      opacity: r.color.a,
+      r: r.color.r,
+      g: r.color.g,
+      b: r.color.b
+    })}${t > 0 && t < 100 ? ` ${t}%` : ""}`
+  ];
+}, []).join(", "), V = (o) => {
+  const e = o[0].x, r = o[0].y, t = (e * 100).toFixed(2), s = (r * 100).toFixed(2);
+  return { centerX: t, centerY: s };
+}, oe = (o) => {
+  const { gradientHandlePositions: e, gradientStops: r } = o, t = W(e, 90), s = C(r);
+  return `linear-gradient(${t}deg, ${s})`;
+}, te = (o) => {
+  const e = o[0].x, r = o[0].y, t = o[1].x, s = o[1].y, n = o[2].x, a = o[2].y, l = (Math.sqrt((n - e) ** 2 + (a - r) ** 2) * 100).toFixed(2), i = (Math.sqrt((t - e) ** 2 + (s - r) ** 2) * 100).toFixed(2);
+  return { radiusX: l, radiusY: i };
+}, se = (o) => {
+  const { gradientHandlePositions: e, gradientStops: r } = o, { centerX: t, centerY: s } = V(e), { radiusX: n, radiusY: a } = te(e), l = C(r);
+  return `radial-gradient(${n}% ${a}% at ${t}% ${s}%, ${l})`;
+}, ne = (o) => {
+  const { gradientHandlePositions: e, gradientStops: r } = o, t = W(e, 30), { centerX: s, centerY: n } = V(e), a = C(r);
+  return `conic-gradient(from ${t}deg at ${s}% ${n}%, ${a})`;
+}, ae = (o) => {
+  const e = o.type;
+  return e === "SOLID" ? S({
+    opacity: o.color.a,
+    r: o.color.r,
+    g: o.color.g,
+    b: o.color.b
+  }) : e === "GRADIENT_LINEAR" ? oe(o) : e === "GRADIENT_RADIAL" ? se(o) : e === "GRADIENT_ANGULAR" ? ne(o) : "";
+}, J = (o, e) => {
+  if (!e.length) return "";
+  const r = e.map((t) => `    ${t}`).join(`
+`);
+  return `${o} {
+${r}
+}`;
+}, ce = (o) => `.${o.replace(/\s+/g, "-").toLowerCase()}`, le = (o) => o.replaceAll(/ /g, "").split("/").at(-1), ie = (o) => `--${o}`, ge = (o) => o.reduce(
+  (e, r) => {
+    const t = ie(r.name);
+    return typeof r.value == "object" ? Object.entries(r.value).forEach(([s, n]) => {
+      e[s] || (e[s] = []), e[s].push(`${t}: ${n};`);
+    }) : e.root.push(`${t}: ${r.value};`), e;
+  },
+  { root: [] }
+), de = (o) => {
+  const e = J(":root", o.root), r = Object.entries(o).reduce((t, [s, n]) => {
+    if (s === "root" || !n.length) return t;
+    const a = J(ce(s), n);
+    return a && t.push(a), t;
+  }, []).join(`
+
+`);
+  return [e, r].filter(Boolean).join(`
+
+`);
+}, ue = (o) => {
+  const e = o.reduce((r, t) => ({ ...r, [t.name]: t.value }), {});
+  return JSON.stringify(e);
+}, fe = async (o, e, r, t, s, n) => {
+  await Promise.all([m.delete(s, r), m.delete(n, t)]);
+  const a = m.write(s, o, { directory: r }), l = m.write(n, e, { directory: t });
+  await Promise.all([a, l]);
+}, B = async ({
+  colorTokens: o,
+  jsonDir: e,
+  stylesDir: r,
+  jsonFileName: t,
+  cssFileName: s
+}) => {
+  const n = ge(o), a = de(n), l = ue(o);
+  await fe(l, a, e, r, t, s);
+}, ve = ({
+  input: o,
+  output: { jsonDir: e, stylesDir: r, jsonFileName: t = "colors.json", cssFileName: s = "colors.css" }
+}) => ({
+  name: "styles/colors",
+  executor: async ({ figmaApiClient: n }) => {
+    try {
+      console.log("[styles/colors] Fetching styles from Figma...");
+      const l = (await n.getStyles()).meta.styles, i = (o == null ? void 0 : o.variablePaths) || [], g = l.filter((c) => c.style_type === "FILL");
+      if (console.log(`[styles/colors] Found ${g.length} color styles`), g.length === 0) {
+        console.warn("[styles/colors] No color styles found in Figma file");
+        return;
+      }
+      console.log(`[styles/colors] Fetching ${g.length} color nodes from Figma...`);
+      const h = await n.getNodes(g.map((c) => c.node_id)), f = Object.entries(h.nodes);
+      let $ = [];
+      if (i.length > 1) {
+        console.log(`[styles/colors] Reading ${i.length} variable files...`);
+        try {
+          $ = await Promise.all(
+            i.map(async (c) => {
+              try {
+                return await m.readJson(c);
+              } catch (y) {
+                throw console.error(`[styles/colors] Failed to read variable file: ${c}`, y), y;
+              }
+            })
+          );
+        } catch (c) {
+          throw console.error("[styles/colors] Error reading variable files:", c), new Error(`Failed to read variable files: ${c.message}`);
+        }
+      }
+      console.log(`[styles/colors] Processing ${f.length} color nodes...`);
+      const u = f.reduce((c, [, y]) => {
+        var w, j, O;
+        try {
+          const { document: v } = y, P = le(v.name);
+          if (v.type !== "RECTANGLE") return c;
+          const x = (w = v.fills) == null ? void 0 : w[0];
+          if (!x) return c;
+          if (x.type === "SOLID" && $.length > 1) {
+            const M = (O = (j = x.boundVariables) == null ? void 0 : j.color) == null ? void 0 : O.id;
+            if (M) {
+              const A = $.reduce((G, D) => {
+                var q;
+                const L = (q = Object.entries(D).find(
+                  ([, E]) => E.$extensions["com.figma.variableId"] === M
+                )) == null ? void 0 : q[1];
+                if (L) {
+                  const { components: E, alpha: X } = L.$value, Y = S({
+                    opacity: X,
+                    r: E[0],
+                    g: E[1],
+                    b: E[2]
+                  });
+                  return { ...G, [D.$extensions["com.figma.modeName"]]: Y };
+                }
+                return G;
+              }, {});
+              if (Object.keys(A).length > 1)
+                return [
+                  ...c,
+                  {
+                    name: P,
+                    value: A
+                  }
+                ];
+            }
+          }
+          const I = ae(x);
+          return I ? [
+            ...c,
+            {
+              name: P,
+              value: I
+            }
+          ] : c;
+        } catch (v) {
+          return console.warn("[styles/colors] Error processing color node:", v), c;
+        }
+      }, []);
+      if (console.log(`[styles/colors] Generated ${u.length} color tokens`), u.length === 0) {
+        console.warn("[styles/colors] No color tokens generated. Check your Figma styles configuration.");
+        return;
+      }
+      console.log(`[styles/colors] Writing files to ${e} and ${r}...`), await B({
+        colorTokens: u,
+        jsonDir: e,
+        stylesDir: r,
+        jsonFileName: t,
+        cssFileName: s
+      }), console.log("[styles/colors] ✅ Successfully generated color files");
+    } catch (a) {
+      const l = a instanceof Error ? a.message : String(a);
+      throw console.error("[styles/colors] ❌ Failed to generate colors from styles:", l), a instanceof Error && a.stack && console.error("[styles/colors] Stack trace:", a.stack), a;
+    }
+  }
+}), Ee = ({
+  input: { variablePaths: o },
+  output: { jsonDir: e, stylesDir: r, jsonFileName: t = "colors.json", cssFileName: s = "colors.css" }
+}) => ({
+  name: "variables/colors",
+  executor: async () => {
+    try {
+      if (!o.length)
+        throw new Error("At least one variable file path is required");
+      console.log(`[variables/colors] Reading ${o.length} variable files...`);
+      const n = await Promise.all(
+        o.map(async (i) => {
+          try {
+            return console.log(`[variables/colors] Reading file: ${i}`), await m.readJson(i);
+          } catch (g) {
+            throw console.error(`[variables/colors] Failed to read variable file: ${i}`, g), new Error(`Failed to read variable file "${i}": ${g.message}`);
+          }
+        })
+      );
+      console.log(`[variables/colors] Processing ${n.length} variable files...`);
+      const a = /* @__PURE__ */ new Map();
+      n.forEach((i, g) => {
+        try {
+          if (!i.$extensions || !i.$extensions["com.figma.modeName"]) {
+            console.warn(
+              `[variables/colors] File ${o[g]} is missing modeName in extensions`
+            );
+            return;
+          }
+          const h = i.$extensions["com.figma.modeName"];
+          Object.entries(i).forEach(([f, $]) => {
+            if (f !== "$extensions")
+              try {
+                const u = $;
+                if (!u || u.$type !== "color") return;
+                if (!u.$value || !u.$value.components) {
+                  console.warn(
+                    `[variables/colors] Variable "${f}" in mode "${h}" has invalid structure`
+                  );
+                  return;
+                }
+                const { components: c, alpha: y } = u.$value, w = S({
+                  opacity: y ?? 1,
+                  r: c[0],
+                  g: c[1],
+                  b: c[2]
+                });
+                a.has(f) || a.set(f, {}), a.get(f)[h] = w;
+              } catch (u) {
+                console.warn(
+                  `[variables/colors] Error processing variable "${f}" in mode "${h}":`,
+                  u
+                );
+              }
+          });
+        } catch (h) {
+          console.error(`[variables/colors] Error processing file ${o[g]}:`, h);
+        }
+      });
+      const l = Array.from(a.entries()).map(([i, g]) => ({
+        name: i,
+        value: Object.keys(g).length > 1 ? g : Object.values(g)[0]
+      }));
+      if (console.log(`[variables/colors] Generated ${l.length} color tokens`), l.length === 0) {
+        console.warn(
+          "[variables/colors] No color tokens generated. Check your variable files structure."
+        );
+        return;
+      }
+      console.log(`[variables/colors] Writing files to ${e} and ${r}...`), await B({
+        colorTokens: l,
+        jsonDir: e,
+        stylesDir: r,
+        jsonFileName: t,
+        cssFileName: s
+      }), console.log("[variables/colors] ✅ Successfully generated color files");
+    } catch (n) {
+      const a = n instanceof Error ? n.message : String(n);
+      throw console.error("[variables/colors] ❌ Failed to generate colors from variables:", a), n instanceof Error && n.stack && console.error("[variables/colors] Stack trace:", n.stack), n;
+    }
+  }
+});
 export {
-  J as generate,
-  A as init
+  ve as colorsFromStyles,
+  Ee as colorsFromVariables,
+  be as generate,
+  pe as init
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@greensight/gts",
-  "version": "1.0.0-alpha.4",
+  "version": "1.0.0-alpha.5",
   "description": "Generate design tokens from Figma",
   "keywords": [
     "figma",