chore: extract typescript config

configs/typescript/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "@zodiac/typescript-config",
+  "private": true,
+  "type": "module",
+  "license": "UNLICENSED",
+  "sideEffects": false,
+  "packageManager": "[email protected]",
+  "exports": {
+    ".": {
+      "default": "./tsconfig.json"
+    }
+  },
+  "peerDependencies": {
+    "typescript": "5.7.3"
+  }
+}

configs/typescript/tsconfig.json

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "allowJs": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "verbatimModuleSyntax": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+    "downlevelIteration": true
+  }
+}

deployables/app/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "connect",
+  "name": "@zodiac/pilot-app",
   "private": true,
   "type": "module",
   "scripts": {
@@ -34,6 +34,7 @@
     "@vitest/coverage-v8": "2.1.8",
     "@zodiac/tailwind-config": "workspace:*",
     "@zodiac/test-utils": "workspace:*",
+    "@zodiac/typescript-config": "workspace:*",
     "autoprefixer": "^10.4.20",
     "eslint": "^9.7.0",
     "postcss": "^8.4.49",

deployables/app/tsconfig.json

@@ -1,15 +1,11 @@
 {
+  "extends": "@zodiac/typescript-config",
   "files": [],
   "references": [
     { "path": "./tsconfig.node.json" },
     { "path": "./tsconfig.cloudflare.json" }
   ],
   "compilerOptions": {
-    "checkJs": true,
-    "verbatimModuleSyntax": true,
-    "skipLibCheck": true,
-    "strict": true,
-    "noEmit": true,
     "paths": {
       "@/test-utils": ["./test-utils/index.ts"]
     }

deployables/example-app/app/Connect.tsx

@@ -1,6 +1,6 @@
 import { Button, Input, Section } from '@/components'
 import { ConnectKitButton } from 'connectkit'
-import { PropsWithChildren } from 'react'
+import type { PropsWithChildren } from 'react'
 import { ClientOnly } from 'remix-utils/client-only'
 import { useAccount, useDisconnect } from 'wagmi'
 

deployables/example-app/app/clients/PublicClient.tsx

@@ -1,9 +1,9 @@
 import { Section } from '@/components'
 import { ProvideConfig } from '@/config'
-import { PropsWithChildren } from 'react'
+import type { PropsWithChildren } from 'react'
 import { createPublicClient, http } from 'viem'
 import { Connected } from '../Connect'
-import { ClientProps } from './ClientProps'
+import type { ClientProps } from './ClientProps'
 
 export const PublicClient = ({
   children,

deployables/example-app/app/clients/WalletClient.tsx

@@ -1,9 +1,9 @@
 import { Section } from '@/components'
 import { ProvideConfig } from '@/config'
-import { PropsWithChildren } from 'react'
+import type { PropsWithChildren } from 'react'
 import { createWalletClient, http } from 'viem'
 import { Connected } from '../Connect'
-import { ClientProps } from './ClientProps'
+import type { ClientProps } from './ClientProps'
 
 export const WalletClient = ({
   children,

deployables/example-app/app/clients/WebsocketClient.tsx

@@ -1,6 +1,6 @@
 import { Section } from '@/components'
 import { ProvideConfig } from '@/config'
-import { PropsWithChildren } from 'react'
+import type { PropsWithChildren } from 'react'
 import { createPublicClient, webSocket } from 'viem'
 import { Connected } from '../Connect'
 

deployables/example-app/app/components/Button.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames'
-import { ComponentPropsWithRef } from 'react'
+import type { ComponentPropsWithRef } from 'react'
 
 type ButtonProps = Omit<
   ComponentPropsWithRef<'button'>,

deployables/example-app/app/components/Checkbox.tsx

@@ -1,4 +1,8 @@
-import { ComponentPropsWithoutRef, PropsWithChildren, useId } from 'react'
+import {
+  type ComponentPropsWithoutRef,
+  type PropsWithChildren,
+  useId,
+} from 'react'
 
 type CheckboxProps = PropsWithChildren<
   Omit<ComponentPropsWithoutRef<'input'>, 'type' | 'id'>

deployables/example-app/app/components/Input.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames'
-import { ComponentPropsWithoutRef, useId } from 'react'
+import { type ComponentPropsWithoutRef, useId } from 'react'
 
 type InputProps = Omit<ComponentPropsWithoutRef<'input'>, 'id'> & {
   label: string

deployables/example-app/app/components/Radio.tsx

@@ -1,7 +1,7 @@
 import {
-  ComponentPropsWithoutRef,
+  type ComponentPropsWithoutRef,
   createContext,
-  PropsWithChildren,
+  type PropsWithChildren,
   useContext,
   useId,
 } from 'react'

deployables/example-app/app/components/Section.tsx

@@ -1,4 +1,4 @@
-import { PropsWithChildren, useId } from 'react'
+import { type PropsWithChildren, useId } from 'react'
 
 type SectionProps = PropsWithChildren<{
   title?: string

deployables/example-app/app/components/Value.tsx

@@ -1,4 +1,4 @@
-import { PropsWithChildren } from 'react'
+import { type PropsWithChildren } from 'react'
 
 type ValueProps = PropsWithChildren<{ label: string }>
 

deployables/example-app/app/config/ConfigProvider.tsx

@@ -1,7 +1,7 @@
 import { invariant } from '@epic-web/invariant'
-import { createContext, PropsWithChildren, useContext } from 'react'
-import { Chain, PublicClient, WalletClient } from 'viem'
-import { Config, useConfig } from 'wagmi'
+import { createContext, type PropsWithChildren, useContext } from 'react'
+import type { Chain, PublicClient, WalletClient } from 'viem'
+import { type Config, useConfig } from 'wagmi'
 
 type ClientFnOptions = { chain: Chain }
 type ClientFn = (options: ClientFnOptions) => PublicClient | WalletClient

deployables/example-app/app/transfer/balance/Balance.tsx

@@ -1,5 +1,5 @@
 import { Value } from '@/components'
-import { Address } from 'viem'
+import type { Address } from 'viem'
 import { ER20Balance } from './ERC20Balance'
 
 type BalanceProps = {

deployables/example-app/app/transfer/balance/ERC20Balance.tsx

@@ -1,7 +1,7 @@
 import { useWagmiConfig } from '@/config'
-import { Address, formatUnits } from 'viem'
+import { type Address, formatUnits } from 'viem'
 import { useBalance } from 'wagmi'
-import { BalanceValue } from './BalanceValue'
+import type { BalanceValue } from './BalanceValue'
 import { Symbol } from './Symbol'
 
 type ER20BalanceProps = {

deployables/example-app/app/transfer/balance/Symbol.tsx

@@ -1,4 +1,4 @@
-import { PropsWithChildren } from 'react'
+import type { PropsWithChildren } from 'react'
 
 export const Symbol = ({ children }: PropsWithChildren) => (
   <span className="rounded bg-blue-100 px-1 text-xs font-semibold uppercase tabular-nums text-blue-500">

deployables/example-app/package.json

@@ -32,6 +32,7 @@
     "@types/react": "^19.0.0",
     "@zodiac/eslint-config": "workspace:*",
     "@zodiac/tailwind-config": "workspace:*",
+    "@zodiac/typescript-config": "workspace:*",
     "autoprefixer": "^10.4.20",
     "eslint": "^9.7.0",
     "globals": "^15.8.0",

deployables/example-app/tsconfig.json

@@ -1,10 +1,6 @@
 {
+  "extends": "@zodiac/typescript-config",
   "compilerOptions": {
-    "strict": true,
-    "module": "ES2022",
-    "moduleResolution": "Bundler",
-    "skipLibCheck": true,
-    "jsx": "react-jsx",
     "paths": {
       "@/transfer": ["./app/transfer"],
       "@/components": ["./app/components"],

deployables/extension/package.json

@@ -54,6 +54,7 @@
     "@zodiac/eslint-config": "workspace:*",
     "@zodiac/tailwind-config": "workspace:*",
     "@zodiac/test-utils": "workspace:*",
+    "@zodiac/typescript-config": "workspace:*",
     "autoprefixer": "^10.4.20",
     "classnames": "^2.3.1",
     "copy-to-clipboard": "^3.3.1",
@@ -80,7 +81,6 @@
     "ser-kit": "1.0.7",
     "tailwindcss": "^3.4.14",
     "typescript": "^5.5.4",
-    "typescript-plugin-css-modules": "^5.1.0",
     "vitest": "2.1.8",
     "vitest-chrome": "0.1.0",
     "zodiac-roles-deployments": "^2.2.2"

deployables/extension/tsconfig.json

@@ -1,23 +1,7 @@
 {
+  "extends": "@zodiac/typescript-config",
   "compilerOptions": {
-    "target": "ES2023",
     "lib": ["dom", "dom.iterable", "esnext"],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "strict": true,
-    "forceConsistentCasingInFileNames": true,
-    "noFallthroughCasesInSwitch": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "verbatimModuleSyntax": true,
-    "noEmit": true,
-    "jsx": "react-jsx",
-    "downlevelIteration": true,
-    "plugins": [{ "name": "typescript-plugin-css-modules" }],
     "paths": {
       "@/utils": ["./src/utils/index.ts"],
       "@/types": ["./src/types.ts"],

deployables/fork-api/package.json

@@ -1,8 +1,9 @@
 {
-  "name": "zodiac-pilot-fork-api",
+  "name": "@zodiac/fork-api",
   "version": "1.0.0",
   "devDependencies": {
     "@cloudflare/workers-types": "^4.0.0",
+    "@zodiac/typescript-config": "workspace:*",
     "env-cmd": "^10.1.0",
     "typescript": "^5.0.0",
     "wrangler": "3.100.0"

deployables/fork-api/src/index.ts

@@ -1,4 +1,4 @@
-import { Env } from './types'
+import type { Env } from './types'
 
 export default {
   async fetch(

deployables/fork-api/tsconfig.json

@@ -1,105 +1,7 @@
 {
+  "extends": "@zodiac/typescript-config",
   "compilerOptions": {
-    /* Visit https://aka.ms/tsconfig.json to read more about this file */
-
-    /* Projects */
-    // "incremental": true,                              /* Enable incremental compilation */
-    // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with project references. */
-    // "tsBuildInfoFile": "./",                          /* Specify the folder for .tsbuildinfo incremental compilation files. */
-    // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when referencing composite projects */
-    // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
-    // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
-
-    /* Language and Environment */
-    "target": "es2021" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
-    "lib": [
-      "es2021"
-    ] /* Specify a set of bundled library declaration files that describe the target runtime environment. */,
-    "jsx": "react" /* Specify what JSX code is generated. */,
-    // "experimentalDecorators": true,                   /* Enable experimental support for TC39 stage 2 draft decorators. */
-    // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
-    // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h' */
-    // "jsxFragmentFactory": "",                         /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
-    // "jsxImportSource": "",                            /* Specify module specifier used to import the JSX factory functions when using `jsx: react-jsx*`.` */
-    // "reactNamespace": "",                             /* Specify the object invoked for `createElement`. This only applies when targeting `react` JSX emit. */
-    // "noLib": true,                                    /* Disable including any library files, including the default lib.d.ts. */
-    // "useDefineForClassFields": true,                  /* Emit ECMAScript-standard-compliant class fields. */
-
-    /* Modules */
-    "module": "es2022" /* Specify what module code is generated. */,
-    // "rootDir": "./",                                  /* Specify the root folder within your source files. */
-    "moduleResolution": "node" /* Specify how TypeScript looks up a file from a given module specifier. */,
-    // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
-    // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
-    // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
-    // "typeRoots": [],                                  /* Specify multiple folders that act like `./node_modules/@types`. */
-    "types": [
-      "@cloudflare/workers-types"
-    ] /* Specify type package names to be included without being referenced in a source file. */,
-    // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
-    "resolveJsonModule": true /* Enable importing .json files */,
-    // "noResolve": true,                                /* Disallow `import`s, `require`s or `<reference>`s from expanding the number of files TypeScript should add to a project. */
-
-    /* JavaScript Support */
-    "allowJs": true /* Allow JavaScript files to be a part of your program. Use the `checkJS` option to get errors from these files. */,
-    "checkJs": false /* Enable error reporting in type-checked JavaScript files. */,
-    // "maxNodeModuleJsDepth": 1,                        /* Specify the maximum folder depth used for checking JavaScript files from `node_modules`. Only applicable with `allowJs`. */
-
-    /* Emit */
-    // "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
-    // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
-    // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
-    // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
-    // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If `declaration` is true, also designates a file that bundles all .d.ts output. */
-    // "outDir": "./",                                   /* Specify an output folder for all emitted files. */
-    // "removeComments": true,                           /* Disable emitting comments. */
-    "noEmit": true /* Disable emitting files from a compilation. */,
-    // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
-    // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types */
-    // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
-    // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
-    // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
-    // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
-    // "inlineSources": true,                            /* Include source code in the sourcemaps inside the emitted JavaScript. */
-    // "emitBOM": true,                                  /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
-    // "newLine": "crlf",                                /* Set the newline character for emitting files. */
-    // "stripInternal": true,                            /* Disable emitting declarations that have `@internal` in their JSDoc comments. */
-    // "noEmitHelpers": true,                            /* Disable generating custom helper functions like `__extends` in compiled output. */
-    // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
-    // "preserveConstEnums": true,                       /* Disable erasing `const enum` declarations in generated code. */
-    // "declarationDir": "./",                           /* Specify the output directory for generated declaration files. */
-    // "preserveValueImports": true,                     /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
-
-    /* Interop Constraints */
-    "isolatedModules": true /* Ensure that each file can be safely transpiled without relying on other imports. */,
-    "allowSyntheticDefaultImports": true /* Allow 'import x from y' when a module doesn't have a default export. */,
-    // "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables `allowSyntheticDefaultImports` for type compatibility. */,
-    // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
-    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
-
-    /* Type Checking */
-    "strict": true /* Enable all strict type-checking options. */,
-    // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied `any` type.. */
-    // "strictNullChecks": true,                         /* When type checking, take into account `null` and `undefined`. */
-    // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
-    // "strictBindCallApply": true,                      /* Check that the arguments for `bind`, `call`, and `apply` methods match the original function. */
-    // "strictPropertyInitialization": true,             /* Check for class properties that are declared but not set in the constructor. */
-    // "noImplicitThis": true,                           /* Enable error reporting when `this` is given the type `any`. */
-    // "useUnknownInCatchVariables": true,               /* Type catch clause variables as 'unknown' instead of 'any'. */
-    // "alwaysStrict": true,                             /* Ensure 'use strict' is always emitted. */
-    // "noUnusedLocals": true,                           /* Enable error reporting when a local variables aren't read. */
-    // "noUnusedParameters": true,                       /* Raise an error when a function parameter isn't read */
-    // "exactOptionalPropertyTypes": true,               /* Interpret optional property types as written, rather than adding 'undefined'. */
-    // "noImplicitReturns": true,                        /* Enable error reporting for codepaths that do not explicitly return in a function. */
-    // "noFallthroughCasesInSwitch": true,               /* Enable error reporting for fallthrough cases in switch statements. */
-    // "noUncheckedIndexedAccess": true,                 /* Include 'undefined' in index signature results */
-    // "noImplicitOverride": true,                       /* Ensure overriding members in derived classes are marked with an override modifier. */
-    // "noPropertyAccessFromIndexSignature": true,       /* Enforces using indexed accessors for keys declared using an indexed type */
-    // "allowUnusedLabels": true,                        /* Disable error reporting for unused labels. */
-    // "allowUnreachableCode": true,                     /* Disable error reporting for unreachable code. */
-
-    /* Completeness */
-    // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
-    "skipLibCheck": true /* Skip type checking all .d.ts files. */
+    "lib": ["es2021"],
+    "types": ["@cloudflare/workers-types"]
   }
 }

deployables/landing-page/package.json

@@ -16,6 +16,7 @@
     "@vitejs/plugin-react": "^4.3.4",
     "@zodiac/eslint-config": "workspace:*",
     "@zodiac/tailwind-config": "workspace:*",
+    "@zodiac/typescript-config": "workspace:*",
     "autoprefixer": "^10.4.20",
     "eslint": "^9.7.0",
     "postcss": "^8.4.47",

deployables/landing-page/src/logos/PilotType.tsx

@@ -1,4 +1,4 @@
-import { ComponentPropsWithoutRef } from 'react'
+import type { ComponentPropsWithoutRef } from 'react'
 
 export const PilotType = (props: ComponentPropsWithoutRef<'svg'>) => (
   <svg

deployables/landing-page/src/logos/ZodiacOsPlain.tsx

@@ -1,4 +1,4 @@
-import { ComponentPropsWithoutRef } from 'react'
+import type { ComponentPropsWithoutRef } from 'react'
 
 export const ZodiacOsPlain = (props: ComponentPropsWithoutRef<'svg'>) => (
   <svg