steveruizok

async function getComponents(fileKey, token) {
  // Get file
  const file = await fetch(`https://api.figma.com/v1/files/${fileKey}`, {
    headers: { "X-Figma-Token": token }
  }).then((r) => r.json())

  if (file.err === undefined) {
    // Get style ids
    const styleIds = Object.keys(file.styles)

steveruizok

interface Box {
  x: number
  y: number
  w: number
  h: number
  maxX: number
  maxY: number
}

interface BoxWithId extends Box {

steveruizok

// This is a very fast implementation.
const det = (
  a: number,
  b: number,
  c: number,
  d: number,
  e: number,
  f: number,
  g: number,
  h: number,

steveruizok

{
  "document": {
    "id": "0:0",
    "name": "Document",
    "type": "DOCUMENT",
    "children": [
      {
        "id": "0:1",
        "name": "Page 1",
        "type": "CANVAS",

steveruizok

import * as React from "react"
import { getRef } from "./getRef"

export default function App() {
  const rCanvas = React.useRef<HTMLCanvasElement>(null)

  React.useEffect(() => {
    const canvas = getRef(rCanvas)
    canvas.width = window.innerWidth
    canvas.width = window.innerHeight

steveruizok

NEXT_PUBLIC_FIREBASE_PUBLIC_API_KEY=your_firebase_email
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_firebase_auth_domain
NEXT_PUBLIC_FIREBASE_DATABASE_URL=your_firebase_database_url
NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_project_id
NEXT_PUBLIC_BASE_API_URL=http://localhost:3000
NEXT_PUBLIC_SERVICE_ACCOUNT=your_config_json_converted_to_base64

NEXT_PUBLIC_COOKIE_NAME=auth

steveruizok

// refresh reset
import router from "next/router"
import { createState } from "@state-designer/core"
import firebase from "firebase/app"
import "firebase/auth"
import * as Types from "types"

const config = {
  apiKey: process.env.NEXT_PUBLIC_FIREBASE_PUBLIC_API_KEY,
  authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,

steveruizok

import * as React from "react"
import { S } from "@state-designer/core"
import { useStateDesigner } from "./useStateDesigner"

const EventList: React.FC<{
  state: S.State<any, any>
}> = ({ state }) => {
  function getEvents(state: S.State<any, any>): string[] {
    const localEvents: string[] = []

steveruizok

import log from "ololog"

class Grid {
	rows = []
	width = 0
	height = 0

	chars = {
		active: ["┌", "─", "┒", "┃", "┛", "━", "┕", "│"],
		inactive: ["┌", "─", "┐", "│", "┘", "─", "└", "│"],

steveruizok

function distributeEvenly<
	T extends { x: number; y: number; height: number; width: number }
>(axis: "x" | "y", boxes: T[]) {
	const mboxes = [...boxes]
	const extent = axis === "x" ? "width" : "height"
	mboxes.sort((a, b) => a[axis] - b[axis])

	// Overall boxes span
	const last = mboxes[mboxes.length - 1]
	const dist = last[axis] + last[extent] - mboxes[0][axis]