feat: add ui package to keep sharable components and utils

web/shared_ui/.gitignore

@@ -0,0 +1,3 @@
+node_modules/
+dist
+tsconfig.tsbuildinfo

web/shared_ui/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "sqlmesh-shared-ui",
+  "version": "0.0.1",
+  "private": false,
+  "type": "module",
+  "files": [
+    "/dist"
+  ],
+  "main": "dist/sqlmesh-shared-ui.umd.js",
+  "module": "dist/sqlmesh-shared-ui.es.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/sqlmesh-shared-ui.es.js",
+      "require": "./dist/sqlmesh-shared-ui.umd.js"
+    }
+  },
+  "scripts": {
+    "build": "tsc -b && vite build --base './'",
+    "build:storybook": "storybook build",
+    "dev": "storybook dev -p 6006",
+    "lint": "eslint --max-warnings 0 --fix .",
+    "pretty": "prettier --write .",
+    "format": "pnpm run pretty && pnpm run lint",
+    "test": "vitest",
+    "test:watch": "vitest watch",
+    "test:ui": "vitest --ui"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.23",
+    "@types/react-dom": "^18.3.7",
+    "@vitejs/plugin-react": "^4.7.0",
+    "typescript": "^5.8.3",
+    "vite": "^6.3.5",
+    "vite-plugin-dts": "^4.5.4"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  }
+}

web/shared_ui/src/index.ts

@@ -0,0 +1,2 @@
+export * from '@/utils'
+export * from '@/types'

web/shared_ui/src/types/index.ts

@@ -0,0 +1,3 @@
+export type Nil = undefined | null
+export type Optional<T> = T | undefined
+export type Maybe<T> = T | Nil

web/shared_ui/src/utils/index.ts

@@ -0,0 +1,8 @@
+import type { Nil } from '@/types'
+
+export function isNil(value: unknown): value is Nil {
+  return value == null
+}
+export function notNil(value: unknown): value is NonNullable<unknown> {
+  return value != null
+}

web/shared_ui/tsconfig.json

@@ -0,0 +1,35 @@
+{
+  "include": ["**/*.ts", "**/*.tsx", "vitest.config.js"],
+  "compilerOptions": {
+    "target": "ES2022",
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "types": ["vite/client"],
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "noEmit": true,
+
+    /* Linting */
+    "skipLibCheck": true,
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true,
+
+    /* Declaration */
+    "declaration": true,
+    "declarationDir": "./dist",
+    "emitDeclarationOnly": false,
+
+    /* Paths */
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}

web/shared_ui/vite.config.js

@@ -0,0 +1,36 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+import path from 'path'
+import dts from 'vite-plugin-dts'
+
+export default defineConfig({
+  plugins: [
+    react(),
+    dts({
+      insertTypesEntry: true,
+    }),
+  ],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+    },
+  },
+  build: {
+    lib: {
+      entry: path.resolve(__dirname, 'src/index.ts'),
+      name: 'sqlmesh-shared-ui',
+      fileName: format => `sqlmesh-shared-ui.${format}.js`,
+    },
+    rollupOptions: {
+      external: ['react', 'react-dom'],
+      output: {
+        globals: {
+          react: 'React',
+          'react-dom': 'ReactDOM',
+        },
+      },
+    },
+    sourcemap: true,
+    outDir: 'dist',
+  },
+})