@merittdev/horus-lens 0.0.2 → 0.0.3

package/README.md

@@ -30,20 +30,19 @@ Or with a script tag (any website — no build step):
 ### React
 
 ```tsx
-import { LensProvider } from '@merittdev/horus-lens/react';
+import { Lens } from '@merittdev/horus-lens/react';
 
-<LensProvider
+// anywhere in your root layout — renders nothing, mounts the overlay
+<Lens
   accessId="lai_your_access_id"
-  endpoint="https://api-lens.meritt.app"
   app={{ release: APP_VERSION, gitSha: COMMIT_SHA, user: { id: user.id } }}
->
-  <App />
-</LensProvider>
+/>
 ```
 
 The React entry additionally captures the React component tree of whatever element
 the reporter picks. Use `enabled={isPreviewEnv}` to force the overlay on (e.g. every
-preview deployment), and `useLens()` for programmatic control.
+preview deployment). Wrap children with `<Lens>` only when a descendant needs the
+`useLens()` hook for programmatic control.
 
 ### Script tag
 
@@ -55,26 +54,51 @@ Lens('app', { release: 'v2.14.3', featureFlags: { newCheckout: true } });
 Lens('open'); // open the report panel programmatically
 ```
 
-### Dashboard components (your own admin, no hosted dashboard)
+### Dashboard (your own admin, no hosted dashboard)
+
+One component, one config. On an access-controlled page (your admin auth is the
+gate), read the credentials server-side and hand them to the component:
 
 ```tsx
-import {
-  createLensApi, LensDashboardProvider,
-  ReportsTable, ReportDetail, IntegrationSettings, OnboardingWizard,
-} from '@merittdev/horus-lens/dashboard';
+// page.tsx — server component, env stays on the server
+import LensPageClient from './LensPageClient';
+
+export default function Page() {
+  return <LensPageClient config={{ projects: JSON.parse(process.env.LENS_PROJECTS ?? '[]') }} />;
+}
+
+// LensPageClient.tsx — client component
+'use client'
+import { LensProvider, LensAdmin, type LensAdminConfig } from '@merittdev/horus-lens/dashboard';
 import '@merittdev/horus-lens/dist/dashboard.css';
 
-const api = createLensApi({
-  baseUrl: '/api/lens',        // your server-side proxy
-  getToken: () => '',          // credentials attach server-side — never in the browser
-});
+export default function LensPageClient({ config }: { config: LensAdminConfig }) {
+  return (
+    <LensProvider config={config}>
+      <LensAdmin />
+    </LensProvider>
+  );
+}
 ```
 
-Ships a reports table (search + pagination), tabbed report detail with a replay
-player, integration management (OAuth to Linear/GitHub/Jira, single active
-destination), and a self-serve onboarding wizard. Light-first monochrome design that
-drops into any admin; dark mode via `.dark`, `[data-theme="dark"]`, or
-`<LensDashboardProvider theme="dark">`.
+```bash
+LENS_PROJECTS=[{"name":"front","accessId":"lai_…","secretKey":"las_…"}]
+```
+
+No projects yet? Pass `config={{ projects: [], adminToken: process.env.LENS_ADMIN_TOKEN }}`
+and the built-in wizard mints the first project and hands you that env line.
+
+You get the full surface: reports (search + pagination + shareable
+`?report=` deep links), replay player, integrations (OAuth to
+Linear/GitHub/Jira with provider-fed dropdowns), project switcher, onboarding.
+Light-first monochrome; dark mode via `theme="dark"`, `.dark`, or
+`[data-theme="dark"]`.
+
+Prefer keys to never reach the browser at all (shared machines, stricter
+compliance)? Use proxy mode instead: mount the package's server handlers and
+drop the `config` prop — see `@merittdev/horus-lens/server`
+(`createLensProxy` + `createLensProjectsRoute`). Piecemeal components
+(`ReportsTable`, `ReportDetail`, …) remain exported for custom layouts.
 
 ## When does the overlay appear?
 
@@ -87,7 +111,12 @@ import on the same check.
 
 - `lai_…` **access id** — public by design (like a GA measurement id). Enforced by a
   per-project origin allowlist and rate limits on the API.
-- `las_…` **secret key** — server-side only: management API, dashboard proxy, CI.
+- `las_…` **secret key** — full project access. Read it server-side and hand it only
+  to access-controlled surfaces (your admin page via `<LensProvider config>`), CI, or
+  the management API — never a public page.
+
+The SDK talks to the hosted Lens API out of the box — no endpoint configuration.
+Self-hosting? Pass `endpoint` (React/script `init` config) to point anywhere else.
 
 ## Self-hosting
 

package/dist/browser.cjs

@@ -29086,7 +29086,7 @@ var ConnectIntegrationResponseSchema = external_exports.object({
 // ../core/dist/index.js
 var SDK_NAME = "@merittdev/horus-lens";
 var SDK_VERSION = "0.0.1";
-var DEFAULT_ENDPOINT = "http://localhost:5625";
+var DEFAULT_ENDPOINT = "https://api-lens.meritt.app";
 var DEFAULT_REPLAY_WINDOW_MS = 15e3;
 var DEFAULT_MAX_CONSOLE_ENTRIES = 200;
 var DEFAULT_MAX_NETWORK_ENTRIES = 100;