@skyhook-io/radar-app 0.1.1

package/README.md

@@ -0,0 +1,67 @@
+# @skyhook-io/radar-app
+
+Radar's full web UI as a reusable React component. Used by Radar's own binary and by external host apps (e.g. Radar Hub) that want to embed the Radar UI inside their own frontend.
+
+This package is source-only — it ships TypeScript + TSX files under `src/`. Consumers need a bundler that transpiles TSX (Vite, Next.js, esbuild, etc.).
+
+## Install
+
+```sh
+npm install @skyhook-io/radar-app
+```
+
+Peer deps: `react >=19`, `react-dom >=19`, `react-router-dom >=7`, `@tanstack/react-query >=5`, `@skyhook-io/k8s-ui >=1.5.0`, plus `clsx`, `tailwind-merge`, `lucide-react`, `@xyflow/react`, `elkjs`.
+
+## Use
+
+```tsx
+import { RadarApp, setApiBase, setAuthHeadersProvider } from '@skyhook-io/radar-app';
+import '@skyhook-io/radar-app/style.css';
+
+setAuthHeadersProvider(() => ({ Authorization: `Bearer ${myToken()}` }));
+
+export function ClusterPage({ clusterId }: { clusterId: string }) {
+  return (
+    <RadarApp
+      apiBase={`/c/${clusterId}/api`}
+      basename={`/c/${clusterId}`}
+      navSlots={{
+        embedded: true,
+        brandSlot: <MyBrand />,
+        contextSlot: <MyClusterSwitcher />,
+        rightExtras: <MyUserMenu />,
+      }}
+    />
+  );
+}
+```
+
+See `RadarAppProps` + `NavCustomization` in the type declarations for the full surface.
+
+## Tailwind
+
+Radar uses Tailwind v4 classes throughout. Your app's Tailwind config must scan Radar's source:
+
+```js
+// tailwind.config.js or equivalent
+content: [
+  './src/**/*.{ts,tsx}',
+  './node_modules/@skyhook-io/radar-app/src/**/*.{ts,tsx}',
+  './node_modules/@skyhook-io/k8s-ui/src/**/*.{ts,tsx}',
+],
+```
+
+## Runtime config
+
+Host apps can override Radar's runtime behavior without passing props:
+
+- `setApiBase(url)` — base URL for REST/SSE/WS requests. Default `/api`.
+- `setBasename(value)` — React Router basename. Default `''`.
+- `setAuthHeadersProvider(fn)` — returns headers (e.g. `Authorization`) to attach to every request.
+- `setCredentialsMode(mode)` — fetch credentials mode (`same-origin` | `include` | `omit`).
+
+Call these before mounting `<RadarApp>`.
+
+## Backwards compatibility
+
+The `RadarApp` props (`apiBase`, `basename`, `router`, `navSlots`, `queryClient`) and the runtime-config setters are the stable surface. Adding to them is fine; removing or renaming is a breaking change.

package/package.json

@@ -0,0 +1,80 @@
+{
+  "name": "@skyhook-io/radar-app",
+  "version": "0.1.1",
+  "description": "Radar's full web UI as a reusable React component. Used by Radar's own binary and by external consumers like Radar Hub.",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/skyhook-io/radar",
+    "directory": "web"
+  },
+  "license": "Apache-2.0",
+  "type": "module",
+  "main": "./src/index.ts",
+  "types": "./src/index.ts",
+  "exports": {
+    ".": "./src/index.ts",
+    "./style.css": "./src/index.css"
+  },
+  "files": [
+    "src"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "tsc": "tsc --noEmit",
+    "format": "prettier --write \"src/**/*.{ts,tsx}\"",
+    "lint": "eslint src --ext ts,tsx"
+  },
+  "dependencies": {
+    "@fontsource-variable/dm-sans": "^5.2.8",
+    "@fontsource/dm-mono": "^5.2.7",
+    "@monaco-editor/react": "^4.7.0",
+    "diff": "^9.0.0",
+    "react-markdown": "^10.1.0",
+    "react-virtuoso": "^4.18.5",
+    "remark-gfm": "^4.0.1",
+    "shiki": "^4.0.1",
+    "yaml": "^2.8.3"
+  },
+  "peerDependencies": {
+    "@skyhook-io/k8s-ui": ">=1.5.0",
+    "@tanstack/react-query": ">=5",
+    "@xyflow/react": ">=12.0.0",
+    "clsx": ">=2",
+    "elkjs": ">=0.9.0",
+    "lucide-react": ">=0.400.0",
+    "react": ">=19",
+    "react-dom": ">=19",
+    "react-router-dom": ">=7",
+    "tailwind-merge": ">=2"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.59.1",
+    "@skyhook-io/k8s-ui": "*",
+    "@tailwindcss/typography": "^0.5.19",
+    "@tailwindcss/vite": "^4.2.1",
+    "@tanstack/react-query": "^5.99.0",
+    "@types/diff": "^8.0.0",
+    "@types/node": "^25.5.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.1",
+    "@xyflow/react": "^12.10.2",
+    "clsx": "^2.1.1",
+    "elkjs": "^0.11.1",
+    "lucide-react": "^1.8.0",
+    "postcss": "^8.5.8",
+    "prettier": "^3.8.1",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
+    "react-router-dom": "^7.13.1",
+    "tailwind-merge": "^3.5.0",
+    "tailwindcss": "^4.2.2",
+    "typescript": "^6.0.2",
+    "vite": "^8.0.5"
+  },
+  "sideEffects": [
+    "*.css"
+  ]
+}