@oicl/openbridge-webcomponents 0.0.8 → 0.0.10

package/script/svg-instruments/figmaImport.ts

@@ -1,79 +0,0 @@
-import fetch from 'node-fetch';
-import dotenv from 'dotenv';
-import * as fs from 'fs';
-import * as path from 'path';
-import {createHmac} from 'crypto';
-
-dotenv.config();
-
-const baseUrl = 'https://api.figma.com';
-const figmaToken = process.env.FIGMA_TOKEN;
-if (figmaToken === undefined) throw 'Missing figma token in environment';
-const header = {headers: {'X-Figma-Token': figmaToken}};
-
-async function getUrl<T>(url: string): Promise<T> {
-  const res = await fetch(url, header);
-  if (res.status !== 200) {
-    const responseText = await res.text();
-    throw Error(`Something failed when downloading: ${url}\n${responseText}`);
-  }
-  return await res.json();
-}
-
-async function getUrlOrCache<T>(url: string): Promise<T> {
-  let metaUrl = url;
-  if (metaUrl.includes('?')) {
-    metaUrl += '&depth=1';
-  } else {
-    metaUrl += '?depth=1';
-  }
-  const metaData = (await getUrl(metaUrl)) as any;
-  const hash = await sha256(url);
-  const cachedir = '.figmacache';
-  if (!fs.existsSync(cachedir)) {
-    fs.mkdirSync(cachedir);
-  }
-  const filepath = path.join(cachedir, `${hash}.json`);
-  if (fs.existsSync(filepath)) {
-    const cache = JSON.parse(fs.readFileSync(filepath).toString());
-    if (cache.lastModified == metaData.lastModified) {
-      return cache;
-    }
-  }
-  const res = await getUrl<T>(url);
-  fs.writeFileSync(filepath, JSON.stringify(res));
-  return res;
-}
-
-export async function getFigmaFile(fileId: string): Promise<any> {
-  return await getUrlOrCache<any>(`${baseUrl}/v1/files/${fileId}`);
-}
-
-export async function getFigmaNode(
-  fileId: string,
-  nodeIds: string[]
-): Promise<unknown> {
-  return await getUrlOrCache<any>(
-    `${baseUrl}/v1/files/${fileId}/nodes?ids=${nodeIds.join(',')}`
-  );
-}
-
-export async function getFigmaSvg(
-  fileId: string,
-  elementIds: string
-): Promise<{[id: string]: string}> {
-  const imageUrlData = await fetch(
-    `${baseUrl}/v1/images/${fileId}?ids=${elementIds}&format=svg&svg_include_id=true`,
-    header
-  );
-  if (imageUrlData.status !== 200) {
-    const responseText = await imageUrlData.text();
-    throw Error(`Something failed when downloading SVG: ${responseText}`);
-  }
-  const imageUrls = await imageUrlData.json();
-  return imageUrls.images;
-}
-
-async function sha256(message: string): Promise<string> {
-  return createHmac('sha256', message).digest('hex');
-}

package/script/svg-instruments/main.ts

@@ -1,109 +0,0 @@
-import * as fs from 'fs';
-import {convertSvg} from './convert-svg';
-import {getFigmaFile, getFigmaNode, getFigmaSvg} from './figmaImport';
-import {FrameNode} from './figma-types';
-import fetch from 'node-fetch';
-
-import {exportComponents, ExportDef} from './exports';
-import * as dotenv from 'dotenv';
-
-dotenv.config();
-
-interface FigmaNode {
-  name: string;
-  children: FigmaNode[];
-  id: string;
-}
-
-function getElement(root: FigmaNode, path: string[]): FigmaNode | null {
-  path = [...path];
-  const name = path.shift();
-  if (name === undefined) {
-    return root;
-  }
-  const ele = root.children.find((value) => value.name === name);
-  if (ele === undefined) {
-    console.error(
-      `Did not find ${name}, available names are:`,
-      root.children.map((v) => v.name)
-    );
-    return null;
-  }
-  return getElement(ele, path);
-}
-
-async function main(option: {outFolder: string; removeAttributes: boolean}) {
-  const mainFigmaFile = '97IQwfn2ybi9Cas78ei8BE';
-
-  const document: any = await getFigmaNode(mainFigmaFile, ['4536%3A113209']);
-  const genFolder = option.outFolder;
-
-  if (!fs.existsSync(genFolder)) {
-    fs.mkdirSync(genFolder);
-  }
-  let styles = document.styles;
-
-  for (const node of Object.values(document.nodes) as any[]) {
-    styles = {...styles, ...node.styles};
-  }
-
-  const elements = exportComponents
-    .map((component) => {
-      const element = getElement(
-        {
-          children: Object.values(document.nodes).map((n: any) => n.document),
-        } as FigmaNode,
-        component.path
-      );
-      if (element === null) {
-        console.error(`In ${component.name}, ${component.path}`);
-      }
-      return {component: component, element: element};
-    })
-    .filter((value) => value.element !== null) as {
-    component: ExportDef;
-    element: FigmaNode;
-  }[];
-
-  const figmaIds = elements.map((v) => v.element.id);
-  const urlSvgs = await getFigmaSvg(mainFigmaFile, figmaIds.join(','));
-  const promises = [];
-  for (const ele of elements) {
-    promises.push(async () => {
-      const element = ele.element;
-      const component = ele.component;
-      console.log(`Exporting ${component.name}`);
-      let imageData;
-      try {
-        imageData = await fetch(urlSvgs[element.id]);
-      } catch (e) {
-        console.error(`Could not download SVG for ${component.name}`, e);
-        throw e;
-      }
-      const svg = await imageData.text();
-      const out = convertSvg(
-        element as unknown as FrameNode,
-        svg,
-        styles,
-        option.removeAttributes
-      );
-
-      const outputFolder = component.outputFolder
-        ? `${genFolder}/${component.outputFolder}`
-        : genFolder;
-
-      if (!fs.existsSync(outputFolder)) {
-        fs.mkdirSync(outputFolder);
-      }
-      fs.writeFileSync(`${outputFolder}/${component.name}.svg`, out);
-    });
-  }
-  await Promise.all(promises.map((f) => f())).then(() => console.log('Done'));
-}
-
-Promise.all([
-  main({outFolder: 'src/generated-with-style', removeAttributes: false}),
-  main({outFolder: 'src/generated-without-style', removeAttributes: true}),
-])
-  .then(() => console.log('Completed autogenerate'))
-  .catch((e) => console.error('Failed autogenerate \nError:\n', e));

package/test.svg

@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" fill="none" viewBox="0 0 512 512">
-  <path fill="#fff" stroke="#D9D9D9" stroke-width="5" d="M453.5 256c0 109.076-88.424 197.5-197.5 197.5S58.5 365.076 58.5 256 146.924 58.5 256 58.5 453.5 146.924 453.5 256ZM256 434.5c98.583 0 178.5-79.917 178.5-178.5S354.583 77.5 256 77.5 77.5 157.417 77.5 256 157.417 434.5 256 434.5Z" vector-effect="non-scaling-stroke"/>
-</svg>