Tailwind, Prettier, ESLint, Typescript runner!

.eslintignore

@@ -0,0 +1,5 @@
+node_modules/
+dist/
+.prettierrc.cjs
+.eslintrc.cjs
+env.d.ts

.eslintrc.cjs

@@ -0,0 +1,24 @@
+module.exports = {
+    extends: [
+        'eslint:recommended',
+        'plugin:react/recommended',
+        'plugin:import/recommended',
+        'plugin:jsx-a11y/recommended',
+        'plugin:@typescript-eslint/recommended',
+        'eslint-config-prettier',
+    ],
+    settings: {
+        react: {
+            version: 'detect',
+        },
+        'import/resolver': {
+            node: {
+                paths: ['src'],
+                extensions: ['.js', '.jsx', '.ts', '.tsx'],
+            },
+        },
+    },
+    rules: {
+        "react/react-in-jsx-scope": "off",
+    },
+};

.prettierignore

@@ -0,0 +1,3 @@
+node_modules/
+dist/
+.prettierrc.cjs

.prettierrc.cjs

@@ -0,0 +1,8 @@
+module.exports = {
+    "trailingComma": "all",
+    "tabWidth": 2,
+    "semi": true,
+    "singleQuote": true,
+    "printWidth": 100,
+    "bracketSpacing": true
+}

package.json

@@ -7,24 +7,37 @@
     "dev": "vite",
     "build": "tsc && vite build",
     "preview": "vite preview",
-    "tauri": "tauri"
+    "tauri": "tauri",
+    "lint": "eslint . --ext .ts,.tsx"
   },
   "dependencies": {
     "@codemirror/lang-html": "^6.4.2",
     "@codemirror/lang-javascript": "^6.1.4",
     "@codemirror/lang-json": "^6.0.1",
     "@tauri-apps/api": "^1.2.0",
+    "@typescript-eslint/eslint-plugin": "^5.52.0",
+    "@typescript-eslint/parser": "^5.52.0",
+    "classnames": "^2.3.2",
     "codemirror": "^6.0.1",
+    "eslint": "^8.34.0",
+    "eslint-config-prettier": "^8.6.0",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-react": "^7.32.2",
+    "prettier": "^2.8.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
+    "@tauri-apps/cli": "^1.2.2",
     "@types/node": "^18.7.10",
     "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
     "@vitejs/plugin-react": "^3.0.0",
+    "autoprefixer": "^10.4.13",
+    "postcss": "^8.4.21",
+    "tailwindcss": "^3.2.7",
     "typescript": "^4.6.4",
-    "vite": "^4.0.0",
+    "vite": "^4.0.0"
-    "@tauri-apps/cli": "^1.2.2"
   }
 }

plugins/plugin.ts

@@ -0,0 +1,3 @@
+Deno.core.print('---------------------------\n');
+Deno.core.print('- 👋 Hello from plugin.ts -\n');
+Deno.core.print('---------------------------\n');

postcss.config.cjs

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

src-tauri/Cargo.lock

@@ -2,6 +2,16 @@
 # It is not intended for manual editing.
 version = 3
 
+[[package]]
+name = "Inflector"
+version = "0.11.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "fe438c63458706e03479442743baae6c88256498e6431708f6dfc520a26515d3"
+dependencies = [
+ "lazy_static",
+ "regex",
+]
+
 [[package]]
 name = "adler"
 version = "1.0.2"
@@ -14,6 +24,17 @@ version = "1.2.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "aae1277d39aeec15cb388266ecc24b11c80469deae6067e17a1a7aa9e5c1f234"
 
+[[package]]
+name = "ahash"
+version = "0.7.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "fcb51a0695d8f838b1ee009b3fbf66bda078cd64590202a864a8f3e8c4315c47"
+dependencies = [
+ "getrandom 0.2.8",
+ "once_cell",
+ "version_check",
+]
+
 [[package]]
 name = "aho-corasick"
 version = "0.7.20"
@@ -44,6 +65,20 @@ version = "1.0.69"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "224afbd727c3d6e4b90103ece64b8d1b67fbb1973b1046c2281eed3f3803f800"
 
+[[package]]
+name = "ast_node"
+version = "0.8.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "cf94863c5fdfee166d0907c44e5fee970123b2b7307046d35d1e671aa93afbba"
+dependencies = [
+ "darling",
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "swc_macros_common",
+ "syn",
+]
+
 [[package]]
 name = "atk"
 version = "0.15.1"
@@ -86,6 +121,15 @@ version = "0.21.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "a4a4ddaa51a5bc52a6948f74c06d20aaaddb71924eab79b8c97a8c556e942d6a"
 
+[[package]]
+name = "better_scoped_tls"
+version = "0.1.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b73e8ecdec39e98aa3b19e8cd0b8ed8f77ccb86a6b0b2dc7cd86d105438a2123"
+dependencies = [
+ "scoped-tls",
+]
+
 [[package]]
 name = "bitflags"
 version = "1.3.2"
@@ -461,6 +505,25 @@ dependencies = [
  "syn",
 ]
 
+[[package]]
+name = "dashmap"
+version = "5.4.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "907076dfda823b0b36d2a1bb5f90c96660a5bbcd7729e10727f07858f22c4edc"
+dependencies = [
+ "cfg-if",
+ "hashbrown",
+ "lock_api",
+ "once_cell",
+ "parking_lot_core",
+]
+
+[[package]]
+name = "data-url"
+version = "0.2.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "8d7439c3735f405729d52c3fbbe4de140eaf938a1fe47d227c27f8254d4302a5"
+
 [[package]]
 name = "deflate"
 version = "0.7.20"
@@ -471,6 +534,36 @@ dependencies = [
  "byteorder",
 ]
 
+[[package]]
+name = "deno_ast"
+version = "0.24.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "76e007f9f03be5484596ea6bed86ffdc6357ba9660cb8da20845baf2ce079722"
+dependencies = [
+ "anyhow",
+ "base64 0.13.1",
+ "data-url",
+ "dprint-swc-ext",
+ "serde",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_ecma_codegen",
+ "swc_ecma_codegen_macros",
+ "swc_ecma_loader",
+ "swc_ecma_parser",
+ "swc_ecma_transforms_base",
+ "swc_ecma_transforms_classes",
+ "swc_ecma_transforms_macros",
+ "swc_ecma_transforms_proposal",
+ "swc_ecma_transforms_react",
+ "swc_ecma_transforms_typescript",
+ "swc_ecma_utils",
+ "swc_ecma_visit",
+ "text_lines",
+ "url",
+]
+
 [[package]]
 name = "deno_core"
 version = "0.171.0"
@@ -561,6 +654,22 @@ version = "0.2.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "bd0c93bb4b0c6d9b77f4435b0ae98c24d17f1c45b2ff844c6151a07256ca923b"
 
+[[package]]
+name = "dprint-swc-ext"
+version = "0.7.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0e2dc99247101e0132a17680c5afbba9a7334477b47738dd3431c13f5e2c9a84"
+dependencies = [
+ "bumpalo",
+ "num-bigint",
+ "rustc-hash",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_ecma_parser",
+ "text_lines",
+]
+
 [[package]]
 name = "dtoa"
 version = "0.4.8"
@@ -603,6 +712,18 @@ dependencies = [
  "cfg-if",
 ]
 
+[[package]]
+name = "enum_kind"
+version = "0.2.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "78b940da354ae81ef0926c5eaa428207b8f4f091d3956c891dfbd124162bed99"
+dependencies = [
+ "pmutil",
+ "proc-macro2",
+ "swc_macros_common",
+ "syn",
+]
+
 [[package]]
 name = "fastrand"
 version = "1.9.0"
@@ -674,6 +795,18 @@ dependencies = [
  "percent-encoding",
 ]
 
+[[package]]
+name = "from_variant"
+version = "0.1.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f0981e470d2ab9f643df3921d54f1952ea100c39fdb6a3fdc820e20d2291df6c"
+dependencies = [
+ "pmutil",
+ "proc-macro2",
+ "swc_macros_common",
+ "syn",
+]
+
 [[package]]
 name = "fslock"
 version = "0.1.8"
@@ -1315,6 +1448,19 @@ version = "2.7.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "30e22bd8629359895450b59ea7a776c850561b96a3b1d31321c1949d9e6c9146"
 
+[[package]]
+name = "is-macro"
+version = "0.2.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "1c068d4c6b922cd6284c609cfa6dec0e41615c9c5a1a4ba729a970d8daba05fb"
+dependencies = [
+ "Inflector",
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "syn",
+]
+
 [[package]]
 name = "itoa"
 version = "0.4.8"
@@ -1408,6 +1554,79 @@ version = "1.4.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e2abad23fbc42b3700f2f279844dc832adb2b2eb069b2df918f455c4e18cc646"
 
+[[package]]
+name = "lexical"
+version = "6.1.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "c7aefb36fd43fef7003334742cbf77b243fcd36418a1d1bdd480d613a67968f6"
+dependencies = [
+ "lexical-core",
+]
+
+[[package]]
+name = "lexical-core"
+version = "0.8.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "2cde5de06e8d4c2faabc400238f9ae1c74d5412d03a7bd067645ccbc47070e46"
+dependencies = [
+ "lexical-parse-float",
+ "lexical-parse-integer",
+ "lexical-util",
+ "lexical-write-float",
+ "lexical-write-integer",
+]
+
+[[package]]
+name = "lexical-parse-float"
+version = "0.8.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "683b3a5ebd0130b8fb52ba0bdc718cc56815b6a097e28ae5a6997d0ad17dc05f"
+dependencies = [
+ "lexical-parse-integer",
+ "lexical-util",
+ "static_assertions",
+]
+
+[[package]]
+name = "lexical-parse-integer"
+version = "0.8.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6d0994485ed0c312f6d965766754ea177d07f9c00c9b82a5ee62ed5b47945ee9"
+dependencies = [
+ "lexical-util",
+ "static_assertions",
+]
+
+[[package]]
+name = "lexical-util"
+version = "0.8.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5255b9ff16ff898710eb9eb63cb39248ea8a5bb036bea8085b1a767ff6c4e3fc"
+dependencies = [
+ "static_assertions",
+]
+
+[[package]]
+name = "lexical-write-float"
+version = "0.8.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "accabaa1c4581f05a3923d1b4cfd124c329352288b7b9da09e766b0668116862"
+dependencies = [
+ "lexical-util",
+ "lexical-write-integer",
+ "static_assertions",
+]
+
+[[package]]
+name = "lexical-write-integer"
+version = "0.8.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e1b6f3d1f4422866b68192d62f77bc5c700bee84f3069f2469d7bc8c77852446"
+dependencies = [
+ "lexical-util",
+ "static_assertions",
+]
+
 [[package]]
 name = "libc"
 version = "0.2.139"
@@ -1620,6 +1839,18 @@ dependencies = [
  "winapi",
 ]
 
+[[package]]
+name = "num-bigint"
+version = "0.4.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f93ab6289c7b344a8a9f60f88d80aa20032336fe78da341afc91c8a2341fc75f"
+dependencies = [
+ "autocfg",
+ "num-integer",
+ "num-traits",
+ "serde",
+]
+
 [[package]]
 name = "num-integer"
 version = "0.1.45"
@@ -2309,6 +2540,12 @@ dependencies = [
  "winreg",
 ]
 
+[[package]]
+name = "rustc-hash"
+version = "1.1.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "08d43f7aa6b08d49f382cde6a7982047c3426db949b1424bc4b7ec9ae12c6ce2"
+
 [[package]]
 name = "rustc_version"
 version = "0.2.3"
@@ -2601,6 +2838,17 @@ dependencies = [
  "stable_deref_trait",
 ]
 
+[[package]]
+name = "sha-1"
+version = "0.10.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "028f48d513f9678cda28f6e4064755b3fbb2af6acd672f2c209b62323f7aea0f"
+dependencies = [
+ "cfg-if",
+ "cpufeatures",
+ "digest",
+]
+
 [[package]]
 name = "sha2"
 version = "0.10.6"
@@ -2719,6 +2967,12 @@ dependencies = [
  "loom",
 ]
 
+[[package]]
+name = "static_assertions"
+version = "1.1.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a2eb9349b6444b326872e140eb1cf5e7c522154d69e7a0ffb0fb81c06b37543f"
+
 [[package]]
 name = "string_cache"
 version = "0.8.4"
@@ -2745,12 +2999,364 @@ dependencies = [
  "quote",
 ]
 
+[[package]]
+name = "string_enum"
+version = "0.3.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "994453cd270ad0265796eb24abf5540091ed03e681c5f3c12bc33e4db33253e1"
+dependencies = [
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "swc_macros_common",
+ "syn",
+]
+
 [[package]]
 name = "strsim"
 version = "0.10.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "73473c0e59e6d5812c5dfe2a064a6444949f089e20eec9a2e5506596494e4623"
 
+[[package]]
+name = "swc_atoms"
+version = "0.4.34"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "731cf66bd8e11030f056f91f9d8af77f83ec4377ff04d1670778a57d1607402a"
+dependencies = [
+ "once_cell",
+ "rustc-hash",
+ "serde",
+ "string_cache",
+ "string_cache_codegen",
+ "triomphe",
+]
+
+[[package]]
+name = "swc_common"
+version = "0.29.29"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a97e491d31418cd33fea58e9f893316fc04b30e2b5d0e750c066e2ba4907ae54"
+dependencies = [
+ "ahash",
+ "ast_node",
+ "better_scoped_tls",
+ "cfg-if",
+ "either",
+ "from_variant",
+ "new_debug_unreachable",
+ "num-bigint",
+ "once_cell",
+ "rustc-hash",
+ "serde",
+ "siphasher",
+ "sourcemap",
+ "string_cache",
+ "swc_atoms",
+ "swc_eq_ignore_macros",
+ "swc_visit",
+ "tracing",
+ "unicode-width",
+ "url",
+]
+
+[[package]]
+name = "swc_config"
+version = "0.1.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b4de36224eb9498fccd4e68971f0b83326ccf8592c2d424f257f3a1c76b2b211"
+dependencies = [
+ "indexmap",
+ "serde",
+ "serde_json",
+ "swc_config_macro",
+]
+
+[[package]]
+name = "swc_config_macro"
+version = "0.1.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "fb64bc03d90fd5c90d6ab917bb2b1d7fbd31957df39e31ea24a3f554b4372251"
+dependencies = [
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "swc_macros_common",
+ "syn",
+]
+
+[[package]]
+name = "swc_ecma_ast"
+version = "0.96.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a887102d5595b557261aa4bde35f3d71906fba674d4b79cd5c59b4155b12ee2d"
+dependencies = [
+ "bitflags",
+ "is-macro",
+ "num-bigint",
+ "scoped-tls",
+ "serde",
+ "string_enum",
+ "swc_atoms",
+ "swc_common",
+ "unicode-id",
+]
+
+[[package]]
+name = "swc_ecma_codegen"
+version = "0.129.8"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "45f8f20522626a737753381bdf64ee53d568730f9f7e720d35960de97e5ff965"
+dependencies = [
+ "memchr",
+ "num-bigint",
+ "once_cell",
+ "rustc-hash",
+ "serde",
+ "sourcemap",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_ecma_codegen_macros",
+ "tracing",
+]
+
+[[package]]
+name = "swc_ecma_codegen_macros"
+version = "0.7.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0159c99f81f52e48fe692ef7af1b0990b45d3006b14c6629be0b1ffee1b23aea"
+dependencies = [
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "swc_macros_common",
+ "syn",
+]
+
+[[package]]
+name = "swc_ecma_loader"
+version = "0.41.31"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "c996baa947150d496c79fbd153d3df834e38d05c779abc4af987aded90e168a2"
+dependencies = [
+ "ahash",
+ "anyhow",
+ "pathdiff",
+ "serde",
+ "swc_common",
+ "tracing",
+]
+
+[[package]]
+name = "swc_ecma_parser"
+version = "0.124.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "9e75888eabf1ad8a8968e3befc7cd20c10e4721254d3344285bd5c3a42f58dc1"
+dependencies = [
+ "either",
+ "enum_kind",
+ "lexical",
+ "num-bigint",
+ "serde",
+ "smallvec",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "tracing",
+ "typed-arena",
+]
+
+[[package]]
+name = "swc_ecma_transforms_base"
+version = "0.116.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5f5a212abba41897332f9ab3af8fe5d1a59f83d69e25eea119c27d9b53876688"
+dependencies = [
+ "better_scoped_tls",
+ "bitflags",
+ "once_cell",
+ "phf 0.10.1",
+ "rustc-hash",
+ "serde",
+ "smallvec",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_ecma_parser",
+ "swc_ecma_utils",
+ "swc_ecma_visit",
+ "tracing",
+]
+
+[[package]]
+name = "swc_ecma_transforms_classes"
+version = "0.105.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a2fd5a8eff1a7f16ec1b3ae50186debf3d3983effed6ed05d4e6db0ed7aadcac"
+dependencies = [
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_ecma_transforms_base",
+ "swc_ecma_utils",
+ "swc_ecma_visit",
+]
+
+[[package]]
+name = "swc_ecma_transforms_macros"
+version = "0.5.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "ebf907935ec5492256b523ae7935a824d9fdc0368dcadc41375bad0dca91cd8b"
+dependencies = [
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "swc_macros_common",
+ "syn",
+]
+
+[[package]]
+name = "swc_ecma_transforms_proposal"
+version = "0.149.8"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a6fe11a20c7ced3c6b6149da330b8b4d8912fe02af6923aaac4d4479aa3dd3b6"
+dependencies = [
+ "either",
+ "serde",
+ "smallvec",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_ecma_transforms_base",
+ "swc_ecma_transforms_classes",
+ "swc_ecma_transforms_macros",
+ "swc_ecma_utils",
+ "swc_ecma_visit",
+]
+
+[[package]]
+name = "swc_ecma_transforms_react"
+version = "0.160.9"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b94e3884668e2e12684e4adf812dbd22d34b17da2d7637b1c9cffe393acad6c2"
+dependencies = [
+ "ahash",
+ "base64 0.13.1",
+ "dashmap",
+ "indexmap",
+ "once_cell",
+ "regex",
+ "serde",
+ "sha-1",
+ "string_enum",
+ "swc_atoms",
+ "swc_common",
+ "swc_config",
+ "swc_ecma_ast",
+ "swc_ecma_parser",
+ "swc_ecma_transforms_base",
+ "swc_ecma_transforms_macros",
+ "swc_ecma_utils",
+ "swc_ecma_visit",
+]
+
+[[package]]
+name = "swc_ecma_transforms_typescript"
+version = "0.164.10"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "9a885199b43798b46d8b26b4a986f899436f9f2cb37477eb12a183388a5c213f"
+dependencies = [
+ "serde",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_ecma_transforms_base",
+ "swc_ecma_transforms_react",
+ "swc_ecma_utils",
+ "swc_ecma_visit",
+]
+
+[[package]]
+name = "swc_ecma_utils"
+version = "0.107.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "d773cf626c8d3be468a883879cda3727a2f1ea6169ccd0b5b8eb2d7afb5f367b"
+dependencies = [
+ "indexmap",
+ "num_cpus",
+ "once_cell",
+ "rustc-hash",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_ecma_visit",
+ "tracing",
+ "unicode-id",
+]
+
+[[package]]
+name = "swc_ecma_visit"
+version = "0.82.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6b2ee0f4b61d6c426189d0d9da1333705ff3bc4513fb63633ca254595a700f75"
+dependencies = [
+ "num-bigint",
+ "swc_atoms",
+ "swc_common",
+ "swc_ecma_ast",
+ "swc_visit",
+ "tracing",
+]
+
+[[package]]
+name = "swc_eq_ignore_macros"
+version = "0.1.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0c20468634668c2bbab581947bb8c75c97158d5a6959f4ba33df20983b20b4f6"
+dependencies = [
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "syn",
+]
+
+[[package]]
+name = "swc_macros_common"
+version = "0.3.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "a4be988307882648d9bc7c71a6a73322b7520ef0211e920489a98f8391d8caa2"
+dependencies = [
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "syn",
+]
+
+[[package]]
+name = "swc_visit"
+version = "0.5.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "470a1963cf182fdcbbac46e3a7fd2caf7329da0e568d3668202da9501c880e16"
+dependencies = [
+ "either",
+ "swc_visit_macros",
+]
+
+[[package]]
+name = "swc_visit_macros"
+version = "0.5.5"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6098b717cfd4c85f5cddec734af191dbce461c39975ed567c32ac6d0c6d61a6d"
+dependencies = [
+ "Inflector",
+ "pmutil",
+ "proc-macro2",
+ "quote",
+ "swc_macros_common",
+ "syn",
+]
+
 [[package]]
 name = "syn"
 version = "1.0.107"
@@ -2896,6 +3502,7 @@ dependencies = [
 name = "tauri-app"
 version = "0.0.0"
 dependencies = [
+ "deno_ast",
  "deno_core",
  "futures",
  "http",
@@ -3056,6 +3663,15 @@ dependencies = [
  "utf-8",
 ]
 
+[[package]]
+name = "text_lines"
+version = "0.6.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "7fd5828de7deaa782e1dd713006ae96b3bee32d3279b79eb67ecf8072c059bcf"
+dependencies = [
+ "serde",
+]
+
 [[package]]
 name = "thin-slice"
 version = "0.1.1"
@@ -3292,12 +3908,28 @@ dependencies = [
  "serde_json",
 ]
 
+[[package]]
+name = "triomphe"
+version = "0.1.8"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f1ee9bd9239c339d714d657fac840c6d2a4f9c45f4f9ec7b0975113458be78db"
+dependencies = [
+ "serde",
+ "stable_deref_trait",
+]
+
 [[package]]
 name = "try-lock"
 version = "0.2.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "3528ecfd12c466c6f163363caf2d02a71161dd5e1cc6ae7b34207ea2d42d81ed"
 
+[[package]]
+name = "typed-arena"
+version = "2.0.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6af6ae20167a9ece4bcb41af5b80f8a1f1df981f6391189ce00fd257af04126a"
+
 [[package]]
 name = "typenum"
 version = "1.16.0"
@@ -3343,6 +3975,12 @@ version = "1.10.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "1dd624098567895118886609431a7c3b8f516e41d30e0643f03d94592a147e36"
 
+[[package]]
+name = "unicode-width"
+version = "0.1.10"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "c0edd1e5b14653f783770bce4a4dabb4a5108a5370a5f5d8cfe8710c361f6c8b"
+
 [[package]]
 name = "url"
 version = "2.3.1"

src-tauri/Cargo.toml

@@ -15,12 +15,13 @@ tauri-build = { version = "1.2", features = [] }
 [dependencies]
 serde_json = { version = "1.0" }
 serde = { version = "1.0", features = ["derive"] }
-tauri = { version = "1.2", features = ["devtools", "shell-open"] }
+tauri = { version = "1.2", features = ["devtools", "shell-open", "window-start-dragging"] }
 http = { version = "0.2.8" }
 reqwest = { version = "0.11.14", features = ["json"] }
 tokio = { version = "1.25.0", features = ["full"] }
 futures = { version = "0.3.26" }
 deno_core = { version = "0.171.0" }
+deno_ast = { version = "0.24.0", features = ["transpiling"] }
 
 [features]
 # by default Tauri runs in production mode

src-tauri/src/main.rs

@@ -3,8 +3,18 @@
     windows_subsystem = "windows"
 )]
 
-use deno_core::JsRuntime;
+use std::rc::Rc;
+
+use deno_ast::MediaType;
+use deno_ast::ParseParams;
+use deno_ast::SourceTextInfo;
+use deno_core::error::AnyError;
+use deno_core::futures::FutureExt;
+use deno_core::ModuleSource;
+use deno_core::ModuleType;
 use deno_core::RuntimeOptions;
+use deno_core::{Extension, JsRuntime};
+use futures::executor;
 
 // Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
 #[tauri::command]
@@ -21,20 +31,25 @@ struct CustomResponse {
     url: String,
 }
 
-fn run_plugin() {
+async fn run_plugin(file_path: &str) -> Result<(), AnyError> {
+    let extension = Extension::builder("runjs").ops(vec![]).build();
+
     // Initialize a runtime instance
     let mut runtime = JsRuntime::new(RuntimeOptions {
+        module_loader: Some(Rc::new(TsModuleLoader)),
+        extensions: vec![extension],
         ..Default::default()
     });
 
-    runtime
+    let main_module = deno_core::resolve_path(file_path)?;
-        .execute_script("deno", "Deno.core.print('Hello from Deno!\\n')")
+    let mod_id = runtime.load_main_module(&main_module, None).await?;
-        .unwrap();
+    let result = runtime.mod_evaluate(mod_id);
+    runtime.run_event_loop(false).await?;
+    result.await?
 }
 
 #[tauri::command]
 async fn send_request(url: &str) -> Result<CustomResponse, String> {
-    run_plugin();
     let start = std::time::Instant::now();
 
     let mut abs_url = url.to_string();
@@ -45,6 +60,13 @@ async fn send_request(url: &str) -> Result<CustomResponse, String> {
     let resp = reqwest::get(abs_url.to_string()).await;
     let elapsed = start.elapsed().as_millis();
 
+    let result = executor::block_on(run_plugin(
+        "/Users/gschier/Workspace/tauri-app/plugins/plugin.ts",
+    ));
+    if let Err(e) = result {
+        eprintln!("Error running plugin: {}", e);
+    }
+
     match resp {
         Ok(v) => {
             let url2 = v.url().to_string();
@@ -63,6 +85,76 @@ async fn send_request(url: &str) -> Result<CustomResponse, String> {
     }
 }
 
+struct TsModuleLoader;
+
+impl deno_core::ModuleLoader for TsModuleLoader {
+    fn resolve(
+        &self,
+        specifier: &str,
+        referrer: &str,
+        _kind: deno_core::ResolutionKind,
+    ) -> Result<deno_core::ModuleSpecifier, AnyError> {
+        deno_core::resolve_import(specifier, referrer).map_err(|e| e.into())
+    }
+
+    fn load(
+        &self,
+        module_specifier: &deno_core::ModuleSpecifier,
+        _maybe_referrer: Option<deno_core::ModuleSpecifier>,
+        _is_dyn_import: bool,
+    ) -> std::pin::Pin<Box<deno_core::ModuleSourceFuture>> {
+        let module_specifier = module_specifier.clone();
+        async move {
+            let path = module_specifier.to_file_path().unwrap();
+
+            // Determine what the MediaType is (this is done based on the file
+            // extension) and whether transpiling is required.
+            let media_type = MediaType::from(&path);
+            let (module_type, should_transpile) = match MediaType::from(&path) {
+                MediaType::JavaScript | MediaType::Mjs | MediaType::Cjs => {
+                    (ModuleType::JavaScript, false)
+                }
+                MediaType::Jsx => (ModuleType::JavaScript, true),
+                MediaType::TypeScript
+                | MediaType::Mts
+                | MediaType::Cts
+                | MediaType::Dts
+                | MediaType::Dmts
+                | MediaType::Dcts
+                | MediaType::Tsx => (ModuleType::JavaScript, true),
+                MediaType::Json => (ModuleType::Json, false),
+                _ => panic!("Unknown extension {:?}", path.extension()),
+            };
+
+            // Read the file, transpile if necessary.
+            let code = std::fs::read_to_string(&path)?;
+            let code = if should_transpile {
+                let parsed = deno_ast::parse_module(ParseParams {
+                    specifier: module_specifier.to_string(),
+                    text_info: SourceTextInfo::from_string(code),
+                    media_type,
+                    capture_tokens: false,
+                    scope_analysis: false,
+                    maybe_syntax: None,
+                })?;
+                parsed.transpile(&Default::default())?.text
+            } else {
+                code
+            };
+
+            // Load and return module.
+            let module = ModuleSource {
+                code: code.into_bytes().into_boxed_slice(),
+                module_type,
+                module_url_specified: module_specifier.to_string(),
+                module_url_found: module_specifier.to_string(),
+            };
+            Ok(module)
+        }
+        .boxed_local()
+    }
+}
+
 fn main() {
     tauri::Builder::default()
         .invoke_handler(tauri::generate_handler![send_request, greet])

src-tauri/tauri.conf.json

@@ -16,6 +16,9 @@
       "shell": {
         "all": false,
         "open": true
+      },
+      "window": {
+        "startDragging": true
       }
     },
     "bundle": {

src/App.css

@@ -1,7 +0,0 @@
-.logo.vite:hover {
-  filter: drop-shadow(0 0 2em #747bff);
-}
-
-.logo.react:hover {
-  filter: drop-shadow(0 0 2em #61dafb);
-}

src/App.tsx

@@ -1,67 +1,76 @@
-import {useState} from "react";
+import { FormEvent, useState } from 'react';
-import {invoke} from "@tauri-apps/api/tauri";
+import { invoke } from '@tauri-apps/api/tauri';
-import "./App.css";
+import Editor from './components/Editor/Editor';
-import Editor from "./Editor";
+import { Input } from './components/Input';
+import { Stacks } from './components/Stacks';
+import { Button } from './components/Button';
+import { Grid } from './components/Grid';
 
 interface Response {
-    url: string;
+  url: string;
-    body: string;
+  body: string;
-    status: string;
+  status: string;
-    elapsed: number;
+  elapsed: number;
-    elapsed2: number;
+  elapsed2: number;
 }
 
 function App() {
-    const [responseBody, setResponseBody] = useState<Response | null>(null);
+  const [responseBody, setResponseBody] = useState<Response | null>(null);
-    const [url, setUrl] = useState("https://arthorsepod.com");
+  const [url, setUrl] = useState('schier.co');
-    const [loading, setLoading] = useState(false);
+  const [loading, setLoading] = useState(false);
 
-    async function sendRequest() {
+  async function sendRequest(e: FormEvent<HTMLFormElement>) {
-        setLoading(true);
+    e.preventDefault();
-        const resp = await invoke("send_request", {url: url}) as Response;
+    setLoading(true);
-        if (resp.body.includes("<head>")) {
+    const resp = (await invoke('send_request', { url: url })) as Response;
-            resp.body = resp.body.replace(/<head>/ig, `<head><base href="${resp.url}"/>`);
+    if (resp.body.includes('<head>')) {
-        }
+      resp.body = resp.body.replace(/<head>/gi, `<head><base href="${resp.url}"/>`);
-        setLoading(false);
-        setResponseBody(resp);
     }
+    setLoading(false);
+    setResponseBody(resp);
+  }
 
-    return (
+  return (
-        <div className="container">
+    <div className="absolute top-0 left-0 right-0 bottom-0 overflow-hidden">
-            <h1>Welcome, Friend!</h1>
+      <div className="w-full h-7 bg-gray-800" data-tauri-drag-region></div>
-            <form
+      <div className="p-12 bg-gray-900 h-full w-full overflow-auto">
-                onSubmit={(e) => {
+        <h1 className="text-4xl font-semibold">Welcome, Friend!</h1>
-                    e.preventDefault();
+        <Stacks as="form" className="mt-5 items-end" onSubmit={sendRequest}>
-                    sendRequest();
+          <Input
-                }}
+            name="url"
-            >
+            label="Enter URL"
-                <input
+            className="mr-1"
-                    id="greet-input"
+            onChange={(e) => setUrl(e.currentTarget.value)}
-                    onChange={(e) => setUrl(e.currentTarget.value)}
+            value={url}
-                    value={url}
+            placeholder="Enter a URL..."
-                    placeholder="Enter a URL..."
+          />
+          <Button type="submit" disabled={loading}>
+            {loading ? 'Sending...' : 'Send'}
+          </Button>
+        </Stacks>
+        {responseBody !== null && (
+          <>
+            <div className="pt-6">
+              {responseBody?.status}
+              &nbsp;&bull;&nbsp;
+              {responseBody?.elapsed}ms &nbsp;&bull;&nbsp;
+              {responseBody?.elapsed2}ms
+            </div>
+            <Grid cols={2} rows={2} gap={1}>
+              <Editor value={responseBody?.body} />
+              <div className="iframe-wrapper">
+                <iframe
+                  srcDoc={responseBody.body}
+                  sandbox="allow-scripts allow-same-origin"
+                  className="h-full w-full rounded-lg"
                 />
-                <button type="submit" disabled={loading}>{loading ? 'Sending...' : 'Send'}</button>
+              </div>
-            </form>
+            </Grid>
-            {responseBody !== null && (
+          </>
-                <>
+        )}
-                    <div style={{paddingTop: "2rem"}}>
+      </div>
-                        {responseBody?.status}
+    </div>
-                        &nbsp;&bull;&nbsp;
+  );
-                        {responseBody?.elapsed}ms
-                        &nbsp;&bull;&nbsp;
-                        {responseBody?.elapsed2}ms
-                    </div>
-                    <div className="row">
-                        <Editor value={responseBody?.body}/>
-                        <div className="iframe-wrapper">
-                            <iframe srcDoc={responseBody.body} sandbox="allow-scripts allow-same-origin"/>
-                        </div>
-                    </div>
-                </>
-            )}
-        </div>
-    );
 }
 
 export default App;

src/Editor.tsx

@@ -1,13 +0,0 @@
-import useCodeMirror from "./hooks/useCodemirror";
-import "./Editor.css";
-
-interface Props {
-    value: string;
-}
-
-export default function Editor(props: Props) {
-    const {ref} = useCodeMirror({value: props.value});
-    return (
-        <div ref={ref} id="editor-yo" />
-    )
-}

src/components/Button.tsx

@@ -0,0 +1,8 @@
+import classnames from 'classnames';
+import { ButtonHTMLAttributes } from 'react';
+
+export function Button({ className, ...props }: ButtonHTMLAttributes<HTMLButtonElement>) {
+  return (
+    <button className={classnames(className, 'bg-blue-600 h-10 px-5 rounded-lg')} {...props} />
+  );
+}

src/components/Editor/Editor.css

@@ -1,26 +1,10 @@
-.cm-editor {
+.iframe-wrapper, .cm-editor {
-    background-color: #000;
-    margin-top: 0.5rem;
-    margin-bottom: 0.5rem;
-    text-align: left;
-    font-size: 0.8rem;
-}
-
-.cm-editor, .iframe-wrapper {
-    padding: 0.3rem 0.5rem;
     width: 100%;
     height: 30rem;
     border-radius: 0.5rem;
     overflow: hidden;
 }
 
-iframe {
-    width: 100%;
-    height: 100%;
-    border: 0;
-    border-radius: 0.5rem;
-}
-
 .cm-editor.cm-focused {
     outline: 0;
     box-shadow: 0 0 0 2pt rgba(180, 180, 180, 0.1);

src/components/Editor/Editor.tsx

@@ -0,0 +1,11 @@
+import useCodeMirror from '../../hooks/useCodemirror';
+import './Editor.css';
+
+interface Props {
+  value: string;
+}
+
+export default function Editor(props: Props) {
+  const { ref } = useCodeMirror({ value: props.value });
+  return <div ref={ref} className="m-0 text-sm rounded-lg bg-gray-800 overflow-hidden" />;
+}

src/components/Grid.tsx

@@ -0,0 +1,35 @@
+import classnames from 'classnames';
+import { ButtonHTMLAttributes, HTMLAttributes } from 'react';
+
+const colsClasses = {
+  none: 'grid-cols-none',
+  1: 'grid-cols-1',
+  2: 'grid-cols-2',
+};
+
+const rowsClasses = {
+  none: 'grid-rows-none',
+  1: 'grid-rows-1',
+  2: 'grid-rows-2',
+};
+
+const gapClasses = {
+  0: 'gap-0',
+  1: 'gap-1',
+  2: 'gap-2',
+};
+
+type Props = HTMLAttributes<HTMLElement> & {
+  rows?: keyof typeof rowsClasses;
+  cols?: keyof typeof colsClasses;
+  gap?: keyof typeof gapClasses;
+};
+
+export function Grid({ className, cols, gap, ...props }: Props) {
+  return (
+    <div
+      className={classnames(className, 'grid', cols && colsClasses[cols], gap && gapClasses[gap])}
+      {...props}
+    />
+  );
+}

src/components/Input.tsx

@@ -0,0 +1,34 @@
+import { InputHTMLAttributes } from 'react';
+import classnames from 'classnames';
+import { VStack } from './Stacks';
+
+interface Props extends InputHTMLAttributes<HTMLInputElement> {
+  name: string;
+  label: string;
+  labelClassName?: string;
+}
+
+export function Input({ label, labelClassName, className, name, ...props }: Props) {
+  const id = `input-${name}`;
+  return (
+    <VStack>
+      <label
+        htmlFor={name}
+        className={classnames(
+          labelClassName,
+          'font-semibold text-sm uppercase text-gray-700 dark:text-gray-300',
+        )}
+      >
+        {label}
+      </label>
+      <input
+        id={id}
+        className={classnames(
+          className,
+          'border-2 border-gray-700 bg-gray-100 dark:bg-gray-800 h-10 px-5 rounded-lg text-sm focus:outline-none',
+        )}
+        {...props}
+      />
+    </VStack>
+  );
+}

src/components/Stacks.tsx

@@ -0,0 +1,72 @@
+import React, { Children, Fragment, HTMLAttributes, ReactNode } from 'react';
+import classnames from 'classnames';
+
+const spaceClasses = {
+  '0': 'pt-0',
+  '1': 'pt-1',
+};
+
+type Space = keyof typeof spaceClasses;
+
+interface HStackProps extends BoxProps {
+  space?: Space;
+  children: ReactNode;
+}
+
+export function Stacks({ className, space, children, ...props }: HStackProps) {
+  return (
+    <BaseStack className={classnames(className, 'flex-row')} {...props}>
+      {space
+        ? Children.toArray(children)
+            .filter(Boolean) // Remove null/false/undefined children
+            .map((c, i) => (
+              <Fragment key={i}>
+                {i > 0 ? (
+                  <div
+                    className={classnames(className, spaceClasses[space], 'pointer-events-none')}
+                    aria-hidden
+                  />
+                ) : null}
+                {c}
+              </Fragment>
+            ))
+        : children}
+    </BaseStack>
+  );
+}
+
+export interface VStackProps extends BoxProps {
+  space?: Space;
+  children: ReactNode;
+}
+
+export function VStack({ className, space, children, ...props }: VStackProps) {
+  return (
+    <BaseStack className={classnames(className, 'flex-col')} {...props}>
+      {space
+        ? Children.toArray(children)
+            .filter(Boolean) // Remove null/false/undefined children
+            .map((c, i) => (
+              <Fragment key={i}>
+                {i > 0 ? (
+                  <div
+                    className={classnames(spaceClasses[space], 'pointer-events-none')}
+                    aria-hidden
+                  />
+                ) : null}
+                {c}
+              </Fragment>
+            ))
+        : children}
+    </BaseStack>
+  );
+}
+
+interface BoxProps extends HTMLAttributes<HTMLElement> {
+  as?: React.ElementType;
+}
+
+function BaseStack({ className, as = 'div', ...props }: BoxProps) {
+  const Component = as;
+  return <Component className={classnames(className, 'flex flex-grow-0')} {...props} />;
+}

src/hooks/useCodemirror.ts

@@ -1,61 +1,55 @@
-import {useEffect, useRef, useState} from "react";
+import { useEffect, useRef, useState } from 'react';
-import {EditorView, minimalSetup} from "codemirror";
+import { EditorView, minimalSetup } from 'codemirror';
-import {javascript} from "@codemirror/lang-javascript";
+import { javascript } from '@codemirror/lang-javascript';
-import {json} from "@codemirror/lang-json";
+import { json } from '@codemirror/lang-json';
-import {html} from "@codemirror/lang-html";
+import { html } from '@codemirror/lang-html';
-import {EditorState} from "@codemirror/state";
+import { EditorState } from '@codemirror/state';
-import {tags} from "@lezer/highlight"
+import { tags } from '@lezer/highlight';
-import {HighlightStyle, syntaxHighlighting} from "@codemirror/language"
+import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
 
 const myHighlightStyle = HighlightStyle.define([
-    {
+  {
-        tag: [
+    tag: [tags.documentMeta, tags.blockComment, tags.lineComment, tags.docComment, tags.comment],
-            tags.documentMeta,
+    color: '#757b93',
-            tags.blockComment,
+  },
-            tags.lineComment,
+  { tag: tags.name, color: '#4b92ff' },
-            tags.docComment,
+  { tag: tags.variableName, color: '#4bff4e' },
-            tags.comment,
+  { tag: tags.attributeName, color: '#b06fff' },
-        ],
+  { tag: tags.attributeValue, color: '#ff964b' },
-        color: "#757b93"
+  { tag: tags.keyword, color: '#fc6' },
-    },
+  { tag: tags.comment, color: '#f5d', fontStyle: 'italic' },
-    {tag: tags.name, color: "#4b92ff"},
-    {tag: tags.variableName, color: "#4bff4e"},
-    {tag: tags.attributeName, color: "#b06fff"},
-    {tag: tags.attributeValue, color: "#ff964b"},
-    {tag: tags.keyword, color: "#fc6"},
-    {tag: tags.comment, color: "#f5d", fontStyle: "italic"}
 ]);
 
 const extensions = [
-    minimalSetup,
+  minimalSetup,
-    syntaxHighlighting(myHighlightStyle),
+  syntaxHighlighting(myHighlightStyle),
-    html(),
+  html(),
-    javascript(),
+  javascript(),
-    json(),
+  json(),
 ];
 
-export default function useCodeMirror({value}: { value: string }) {
+export default function useCodeMirror({ value }: { value: string }) {
-    const [cm, setCm] = useState<EditorView | null>(null);
+  const [cm, setCm] = useState<EditorView | null>(null);
-    const ref = useRef(null);
+  const ref = useRef(null);
-    useEffect(() => {
+  useEffect(() => {
-        if (ref.current === null) return;
+    if (ref.current === null) return;
 
-        const view = new EditorView({
+    const view = new EditorView({
-            extensions,
+      extensions,
-            parent: ref.current
+      parent: ref.current,
-        });
+    });
 
-        setCm(view);
+    setCm(view);
 
-        return () => view?.destroy();
+    return () => view?.destroy();
-    }, [ref.current]);
+  }, [ref.current]);
 
-    useEffect(() => {
+  useEffect(() => {
-        if (cm === null) return;
+    if (cm === null) return;
 
-        const newState = EditorState.create({doc: value, extensions});
+    const newState = EditorState.create({ doc: value, extensions });
-        cm.setState(newState);
+    cm.setState(newState);
-    }, [cm, value]);
+  }, [cm, value]);
 
-    return {ref, cm};
+  return { ref, cm };
 }

src/main.css

@@ -0,0 +1,15 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  color-scheme: light dark;
+}
+
+:not(input):not(textarea),
+:not(input):not(textarea)::after,
+:not(input):not(textarea)::before {
+  -webkit-user-select: none;
+  user-select: none;
+  cursor: default;
+}

src/main.tsx

@@ -1,10 +1,10 @@
-import React from "react";
+import React from 'react';
-import ReactDOM from "react-dom/client";
+import ReactDOM from 'react-dom/client';
-import App from "./App";
+import App from './App';
-import "./style.css";
+import './main.css';
 
-ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
+ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
   <React.StrictMode>
     <App />
-  </React.StrictMode>
+  </React.StrictMode>,
 );

src/style.css

@@ -1,130 +0,0 @@
-:root {
-  font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
-  font-size: 16px;
-  line-height: 24px;
-  font-weight: 400;
-
-  /* Allow rendering scrollbars/etc in dark OR light */
-  color-scheme: light dark;
-
-  font-synthesis: none;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-text-size-adjust: 100%;
-}
-
-
-:not(input):not(textarea),
-:not(input):not(textarea)::after,
-:not(input):not(textarea)::before {
-  -webkit-user-select: none;
-  user-select: none;
-  cursor: default;
-}
-
-div, form, p {
-  width: 100%;
-}
-
-.container {
-  margin: 0 auto;
-  padding-top: 2rem;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  text-align: center;
-  width: 80vw;
-  max-width: 800px;
-}
-
-.logo {
-  height: 6em;
-  padding: 1.5em;
-  will-change: filter;
-  transition: 0.75s;
-}
-
-.logo.tauri:hover {
-  filter: drop-shadow(0 0 2em #24c8db);
-}
-
-.row {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
-  justify-content: center;
-  width: 100%;
-}
-
-a {
-  font-weight: 500;
-  color: #646cff;
-  text-decoration: inherit;
-}
-
-a:hover {
-  color: #535bf2;
-}
-
-h1 {
-  text-align: center;
-}
-
-input,
-button {
-  border-radius: 8px;
-  border: 1px solid transparent;
-  padding: 0.6em 1.2em;
-  font-size: 1em;
-  font-weight: 500;
-  font-family: inherit;
-  color: #0f0f0f;
-  background-color: #ffffff;
-  transition: border-color 0.25s;
-  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
-}
-
-button {
-  cursor: pointer;
-  width: 7rem;
-  padding-left: 0;
-  padding-right: 0;
-}
-
-button:disabled {
-  opacity: 0.7;
-}
-
-button:hover {
-  border-color: #396cd8;
-}
-
-input,
-button {
-  outline: none;
-}
-
-#greet-input {
-  margin-right: 5px;
-}
-
-@media (prefers-color-scheme: dark) {
-  :root {
-    color: #f6f6f6;
-    background-color: #181818;
-  }
-
-  a:hover {
-    color: #24c8db;
-  }
-
-  input {
-    color: #ffffff;
-    background-color: #0f0f0f98;
-  }
-
-  button {
-    color: #ffffff;
-    background-color: rgba(137, 98, 255, 0.6);
-  }
-}

src/vite-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />

tailwind.config.cjs

@@ -0,0 +1,11 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    "./index.html",
+    "./src/**/*.{js,ts,jsx,tsx}",
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}