Add prettier, husky, lint-staged

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged

.prettierrc

@@ -0,0 +1,9 @@
+{
+  "printWidth": 80,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": true,
+  "singleQuote": true,
+  "trailingComma": "none",
+  "bracketSpacing": true
+}

babel.config.js

@@ -1,7 +1,7 @@
 module.exports = {
   presets: [
-    ["@babel/preset-env", { targets: { node: "12" } }],
-    "@babel/preset-typescript",
-    "@babel/preset-react",
-  ],
+    ['@babel/preset-env', { targets: { node: '12' } }],
+    '@babel/preset-typescript',
+    '@babel/preset-react'
+  ]
 };

example-site/next.config.js

@@ -1,5 +1,5 @@
 module.exports = {
   typescript: {
-    ignoreBuildErrors: true,
-  },
+    ignoreBuildErrors: true
+  }
 };

example-site/postcss.config.js

@@ -2,6 +2,6 @@
 module.exports = {
   plugins: {
     tailwindcss: {},
-    autoprefixer: {},
-  },
+    autoprefixer: {}
+  }
 };

example-site/src/pages/_app.tsx

@@ -1,6 +1,6 @@
-import type { AppProps } from "next/app";
-import "../index.css";
-import Head from "next/head";
+import type { AppProps } from 'next/app';
+import '../index.css';
+import Head from 'next/head';
 
 function MyApp({ Component, pageProps }: AppProps) {
   return (

example-site/src/pages/index.tsx

@@ -1,15 +1,15 @@
-import React, { useMemo, useState } from "react";
-import { parseMachinesFromFile } from "xstate-parser-demo";
+import React, { useMemo, useState } from 'react';
+import { parseMachinesFromFile } from 'xstate-parser-demo';
 
 function App() {
   const [text, setText] = useState(`createMachine({ initial: 'wow' })`);
   const result = useMemo(() => {
     try {
       return parseMachinesFromFile(text).machines.map((machine) => {
-        return machine.toConfig() || "could not compile";
+        return machine.toConfig() || 'could not compile';
       });
     } catch (e) {
-      return "Could not parse";
+      return 'Could not parse';
     }
   }, [text]);
 

example-site/tailwind.config.js

@@ -1,12 +1,12 @@
 // tailwind.config.js
 module.exports = {
-  purge: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
+  purge: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
   darkMode: false, // or 'media' or 'class'
   theme: {
-    extend: {},
+    extend: {}
   },
   variants: {
-    extend: {},
+    extend: {}
   },
-  plugins: [],
+  plugins: []
 };

example-site/tsconfig.json

@@ -2,11 +2,7 @@
   "compilerOptions": {
     "target": "ESNext",
     "useDefineForClassFields": true,
-    "lib": [
-      "DOM",
-      "DOM.Iterable",
-      "ESNext"
-    ],
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
     "allowJs": false,
     "skipLibCheck": true,
     "esModuleInterop": true,
@@ -20,10 +16,6 @@
     "noEmit": true,
     "jsx": "preserve"
   },
-  "include": [
-    "./src"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
-}
+  "include": ["./src"],
+  "exclude": ["node_modules"]
+}

examples/actions.ts

@@ -1,4 +1,4 @@
-import { createMachine, actions } from "xstate";
+import { createMachine, actions } from 'xstate';
 
 const {
   after,
@@ -16,27 +16,27 @@ const {
   sendParent,
   sendUpdate,
   start,
-  stop,
+  stop
 } = actions;
 
 export const machine = createMachine({
   entry: [
     after(400),
     assign({}),
-    cancel(""),
-    done(""),
-    escalate(""),
-    forwardTo(""),
+    cancel(''),
+    done(''),
+    escalate(''),
+    forwardTo(''),
     log(),
     pure(() => {
       return [];
     }),
-    raise(""),
-    respond(""),
-    send(""),
-    sendParent(""),
+    raise(''),
+    respond(''),
+    send(''),
+    sendParent(''),
     sendUpdate(),
-    start(""),
-    stop(""),
-  ],
+    start(''),
+    stop('')
+  ]
 });

examples/always.ts

@@ -9,16 +9,16 @@
 // - actions
 // - XState (all XState exports)
 
-import { assign, Machine } from "xstate";
+import { assign, Machine } from 'xstate';
 
 export const always = Machine({
-  initial: "checking",
+  initial: 'checking',
   states: {
     checking: {
       always: {
-        target: "next",
-      },
+        target: 'next'
+      }
     },
-    next: {},
-  },
+    next: {}
+  }
 });

examples/arraysAsTargets.ts

@@ -1,33 +1,33 @@
-import { createMachine } from "xstate";
+import { createMachine } from 'xstate';
 
 export const arraysAsTargets = createMachine({
-  type: "parallel",
+  type: 'parallel',
   on: {
-    "*": [
+    '*': [
       {
-        target: ["first.a", "second.b"],
+        target: ['first.a', 'second.b']
       },
       {
-        target: ["first.c", "second.a"],
-      },
-    ],
+        target: ['first.c', 'second.a']
+      }
+    ]
   },
   states: {
     first: {
-      initial: "a",
+      initial: 'a',
       states: {
         a: {},
         b: {},
-        c: {},
-      },
+        c: {}
+      }
     },
     second: {
-      initial: "a",
+      initial: 'a',
       states: {
         a: {},
         b: {},
-        c: {},
-      },
-    },
-  },
+        c: {}
+      }
+    }
+  }
 });