@merittdev/horus-lens 0.0.2 → 0.0.3

package/dist/dashboard.css

@@ -1426,6 +1426,47 @@
   cursor: default;
 }
 
+/* Dropdown variant of the config editor — matches the input, with a monochrome
+   chevron (inline data-uri so it stays self-contained). */
+.lens-db__intconfig-select {
+  appearance: none;
+  height: 28px;
+  width: 100%;
+  max-width: 260px;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  font-size: 12.5px;
+  color: var(--lens-fg);
+  background-color: var(--lens-bg);
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a8a8a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 9px center;
+  background-size: 12px;
+  border: 1px solid var(--lens-border);
+  border-radius: var(--lens-radius);
+  padding: 0 28px 0 9px;
+  transition: border-color 150ms ease, box-shadow 150ms ease;
+}
+
+.lens-db__intconfig-select:focus {
+  outline: none;
+  border-color: var(--lens-accent);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lens-accent) 20%, transparent);
+}
+
+.lens-db__intconfig-select:disabled {
+  background-color: var(--lens-well);
+  color: var(--lens-muted);
+  cursor: default;
+}
+
+/* Subtle nudge shown when live options couldn't be loaded and we fell back to
+   the free-text input. */
+.lens-db__intconfig-note {
+  flex-basis: 100%;
+  font-size: 11.5px;
+  color: var(--lens-muted);
+}
+
 /* Busy/saved affordances occupy the Save button's slot so the row doesn't shift. */
 .lens-db__intconfig-busy,
 .lens-db__intconfig-done {
@@ -1484,7 +1525,8 @@
     flex-basis: 100%;
   }
 
-  .lens-db__intconfig-input {
+  .lens-db__intconfig-input,
+  .lens-db__intconfig-select {
     max-width: none;
   }
 }
@@ -2231,3 +2273,184 @@
   color: var(--lens-muted);
   border: 1px solid var(--lens-border);
 }
+
+/* ===========================================================================
+ * <LensDashboard> shell — the batteries-included admin surface.
+ * A full-width segmented tab bar (Issue Reports / Integrations / Setup), an
+ * optional project switcher on the same row, first-run provisioning, and the
+ * minted-secret env block. All monochrome + existing --lens-* variables.
+ * ======================================================================== */
+
+.lens-db__shell {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  width: 100%;
+}
+
+/* Row: [ 3-up segmented tabs .................. ] [ project switcher ] */
+.lens-db__shell-bar {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.lens-db__shell-tabs {
+  flex: 1 1 auto;
+  min-width: 0;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 4px;
+  padding: 3px;
+  background: var(--lens-well);
+  border: 1px solid var(--lens-border);
+  border-radius: var(--lens-radius);
+}
+
+.lens-db__shell-tab {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 7px;
+  height: 34px;
+  min-width: 0;
+  border: none;
+  background: none;
+  color: var(--lens-muted);
+  font: inherit;
+  font-size: 13px;
+  font-weight: 500;
+  border-radius: 6px;
+  cursor: pointer;
+  white-space: nowrap;
+  transition: background 150ms ease, color 150ms ease;
+}
+
+.lens-db__shell-tab svg {
+  flex: none;
+}
+
+.lens-db__shell-tab-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.lens-db__shell-tab:hover:not(.lens-db__shell-tab--active) {
+  color: var(--lens-fg);
+  background: var(--lens-subtle);
+}
+
+.lens-db__shell-tab--active {
+  background: var(--lens-accent);
+  color: var(--lens-accent-fg);
+}
+
+.lens-db__shell-tab:focus-visible {
+  outline: 2px solid var(--lens-accent);
+  outline-offset: 2px;
+}
+
+/* Project switcher — the intconfig-select look, sized up to 32px. */
+.lens-db__shell-switcher {
+  flex: none;
+  display: inline-flex;
+  align-items: center;
+}
+
+.lens-db__shell-select {
+  appearance: none;
+  height: 32px;
+  max-width: 220px;
+  font: inherit;
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--lens-fg);
+  background-color: var(--lens-bg);
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a8a8a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 9px center;
+  background-size: 12px;
+  border: 1px solid var(--lens-border);
+  border-radius: var(--lens-radius);
+  padding: 0 30px 0 10px;
+  cursor: pointer;
+  transition: border-color 150ms ease, box-shadow 150ms ease;
+}
+
+.lens-db__shell-select:focus {
+  outline: none;
+  border-color: var(--lens-accent);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lens-accent) 20%, transparent);
+}
+
+.lens-db__shell-content {
+  min-width: 0;
+}
+
+/* Loading placeholder while the project list resolves. */
+.lens-db__shell-loading {
+  padding: 40px 16px;
+  text-align: center;
+  color: var(--lens-muted);
+}
+
+/* ---------- First-run provisioning ---------- */
+
+.lens-db__shell-provision {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.lens-db__shell-notice {
+  padding: 16px 18px;
+  border: 1px solid var(--lens-border);
+  border-radius: var(--lens-radius-card);
+  background: var(--lens-well);
+  box-shadow: var(--lens-shadow);
+}
+
+.lens-db__shell-notice-title {
+  margin: 0 0 4px;
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--lens-fg);
+}
+
+.lens-db__shell-notice p:last-child {
+  margin: 0;
+}
+
+.lens-db__shell-env {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+/* Under 560px: tabs stay 3-up with tighter padding; switcher drops to its own
+   full-width row above them. */
+@media (max-width: 560px) {
+  .lens-db__shell-bar {
+    flex-wrap: wrap;
+  }
+
+  .lens-db__shell-switcher {
+    order: -1;
+    width: 100%;
+  }
+
+  .lens-db__shell-select {
+    max-width: none;
+    width: 100%;
+  }
+
+  .lens-db__shell-tabs {
+    flex-basis: 100%;
+  }
+
+  .lens-db__shell-tab {
+    gap: 5px;
+    padding: 0 6px;
+    font-size: 12.5px;
+  }
+}

package/dist/dashboard.d.cts

@@ -1,4 +1,5 @@
 import { z } from 'zod';
+import { ReactNode } from 'react';
 
 /**
  * Heavy payloads are uploaded to S3 as individual assets via presigned URLs;
@@ -515,6 +516,19 @@ interface LensApi {
     disconnectIntegration(provider: IntegrationProvider): Promise<Integration[]>;
     /** Updates `provider`'s non-secret issue-routing config; returns the refreshed list. */
     updateIntegrationConfig(provider: IntegrationProvider, config: IntegrationConfig): Promise<Integration[]>;
+    /**
+     * Live dropdown choices for `provider`'s config line, fetched from the
+     * connected provider's API with the stored OAuth token. Rejects with code
+     * `not_connected` (409) when the provider isn't connected, or
+     * `options_fetch_failed` (502) on an upstream failure.
+     */
+    getIntegrationOptions(provider: IntegrationProvider): Promise<{
+        field: string;
+        options: {
+            value: string;
+            label: string;
+        }[];
+    }>;
     /** Bootstrap/admin auth. `accessSecret` is returned exactly once. */
     createProject(body: CreateProjectRequest): Promise<CreateProjectResponse>;
     /** Reads the current project (S3 config masked, secret never returned). */
@@ -592,6 +606,76 @@ declare function LensDashboardProvider(props: LensDashboardProviderProps): React
 /** Reads the {@link LensApi} from context, throwing a clear error if missing. */
 declare function useLensApi(): LensApi;
 
+/** A project the dashboard can switch between, as returned by `projectsUrl`. */
+interface ProjectRef {
+    name: string;
+    accessId: string;
+}
+/**
+ * Direct-mode configuration: full credentials passed straight to the
+ * component, which then talks to the Lens API without any host-side proxy.
+ * Only use this on pages that are themselves access-controlled (the secrets
+ * are visible to anyone who can render the page).
+ */
+interface LensAdminConfig {
+    projects: {
+        name: string;
+        accessId: string;
+        secretKey: string;
+    }[];
+    /** Enables project creation from the Setup wizard (admin-scoped). */
+    adminToken?: string;
+    /** Lens API base. Default: the hosted API. */
+    apiUrl?: string;
+}
+type TabId = 'reports' | 'integrations' | 'setup';
+/**
+ * Loads the keys for <LensAdmin>:
+ *
+ *   <LensProvider config={config}>
+ *     <LensAdmin />
+ *   </LensProvider>
+ *
+ * `config` comes from your server code (page/server component reading env) —
+ * render this only on access-controlled pages.
+ */
+declare function LensProvider({ config, children, }: {
+    config: LensAdminConfig;
+    children: ReactNode;
+}): React.JSX.Element;
+interface LensAdminProps {
+    /**
+     * Direct mode: pass keys and skip server routes entirely (or supply them via
+     * the surrounding <LensProvider config={…}>). Wins over `baseUrl` /
+     * `projectsUrl` / `projects`.
+     */
+    config?: LensAdminConfig;
+    /** Proxy mode: server-side proxy base. Default '/api/lens'. */
+    baseUrl?: string;
+    /**
+     * Proxy mode: endpoint returning `{ projects: [{ name, accessId }] }`.
+     * Default '/api/lens-projects'. Ignored when `projects` is passed.
+     */
+    projectsUrl?: string;
+    /** Proxy mode: static project list — skips the projectsUrl fetch. */
+    projects?: ProjectRef[];
+    /** Initial tab. Default 'reports'. */
+    defaultTab?: TabId;
+    theme?: 'light' | 'dark';
+    className?: string;
+}
+/**
+ * Batteries-included admin surface for Lens. Renders the segmented tab bar
+ * (Issue Reports / Integrations / Setup), an optional project switcher, report
+ * deep-linking, and first-run provisioning — so a host writes a single import
+ * instead of assembling the pieces by hand. Pairs with a server-side proxy the
+ * host owns (`baseUrl`) that attaches project credentials.
+ */
+declare function LensAdmin(props: LensAdminProps): React.JSX.Element;
+declare const LensDashboard: typeof LensAdmin;
+type LensDashboardProps = LensAdminProps;
+type LensDashboardConfig = LensAdminConfig;
+
 interface ReportsTableProps {
     onSelect?: (id: string) => void;
     status?: ReportStatus;
@@ -704,4 +788,4 @@ interface AsyncState<T> {
  */
 declare function useAsync<T>(fn: () => Promise<T>, deps: unknown[]): AsyncState<T>;
 
-export { type AssetKind, type AssetRef, type AsyncState, type ConnectIntegrationResponse, type CreateProjectRequest, type CreateProjectResponse, type Integration, type IntegrationProvider, IntegrationSettings, type IntegrationSettingsProps, type IntegrationStatus, type LensApi, type LensApiConfig, LensApiError, LensDashboardProvider, type LensDashboardProviderProps, type ListIntegrationsResponse, type ListReportsQuery, type ListReportsResult, OnboardingWizard, type OnboardingWizardProps, type Project, ProjectSettings, type ProjectSettingsProps, ReplayPlayer, type ReplayPlayerProps, type Report, ReportDetail, type ReportDetailProps, type ReportMetadata, type ReportStatus, type ReportSummary, ReportsTable, type ReportsTableProps, type S3ConfigInput, type S3ConfigPublic, StatusBadge, type UpdateProjectRequest, createLensApi, useAsync, useLensApi };
+export { type AssetKind, type AssetRef, type AsyncState, type ConnectIntegrationResponse, type CreateProjectRequest, type CreateProjectResponse, type Integration, type IntegrationProvider, IntegrationSettings, type IntegrationSettingsProps, type IntegrationStatus, LensAdmin, type LensAdminConfig, type LensAdminProps, type LensApi, type LensApiConfig, LensApiError, LensDashboard, type LensDashboardConfig, type LensDashboardProps, LensDashboardProvider, type LensDashboardProviderProps, LensProvider, type ListIntegrationsResponse, type ListReportsQuery, type ListReportsResult, OnboardingWizard, type OnboardingWizardProps, type Project, ProjectSettings, type ProjectSettingsProps, ReplayPlayer, type ReplayPlayerProps, type Report, ReportDetail, type ReportDetailProps, type ReportMetadata, type ReportStatus, type ReportSummary, ReportsTable, type ReportsTableProps, type S3ConfigInput, type S3ConfigPublic, StatusBadge, type UpdateProjectRequest, createLensApi, useAsync, useLensApi };

package/dist/dashboard.d.ts

@@ -1,4 +1,5 @@
 import { z } from 'zod';
+import { ReactNode } from 'react';
 
 /**
  * Heavy payloads are uploaded to S3 as individual assets via presigned URLs;
@@ -515,6 +516,19 @@ interface LensApi {
     disconnectIntegration(provider: IntegrationProvider): Promise<Integration[]>;
     /** Updates `provider`'s non-secret issue-routing config; returns the refreshed list. */
     updateIntegrationConfig(provider: IntegrationProvider, config: IntegrationConfig): Promise<Integration[]>;
+    /**
+     * Live dropdown choices for `provider`'s config line, fetched from the
+     * connected provider's API with the stored OAuth token. Rejects with code
+     * `not_connected` (409) when the provider isn't connected, or
+     * `options_fetch_failed` (502) on an upstream failure.
+     */
+    getIntegrationOptions(provider: IntegrationProvider): Promise<{
+        field: string;
+        options: {
+            value: string;
+            label: string;
+        }[];
+    }>;
     /** Bootstrap/admin auth. `accessSecret` is returned exactly once. */
     createProject(body: CreateProjectRequest): Promise<CreateProjectResponse>;
     /** Reads the current project (S3 config masked, secret never returned). */
@@ -592,6 +606,76 @@ declare function LensDashboardProvider(props: LensDashboardProviderProps): React
 /** Reads the {@link LensApi} from context, throwing a clear error if missing. */
 declare function useLensApi(): LensApi;
 
+/** A project the dashboard can switch between, as returned by `projectsUrl`. */
+interface ProjectRef {
+    name: string;
+    accessId: string;
+}
+/**
+ * Direct-mode configuration: full credentials passed straight to the
+ * component, which then talks to the Lens API without any host-side proxy.
+ * Only use this on pages that are themselves access-controlled (the secrets
+ * are visible to anyone who can render the page).
+ */
+interface LensAdminConfig {
+    projects: {
+        name: string;
+        accessId: string;
+        secretKey: string;
+    }[];
+    /** Enables project creation from the Setup wizard (admin-scoped). */
+    adminToken?: string;
+    /** Lens API base. Default: the hosted API. */
+    apiUrl?: string;
+}
+type TabId = 'reports' | 'integrations' | 'setup';
+/**
+ * Loads the keys for <LensAdmin>:
+ *
+ *   <LensProvider config={config}>
+ *     <LensAdmin />
+ *   </LensProvider>
+ *
+ * `config` comes from your server code (page/server component reading env) —
+ * render this only on access-controlled pages.
+ */
+declare function LensProvider({ config, children, }: {
+    config: LensAdminConfig;
+    children: ReactNode;
+}): React.JSX.Element;
+interface LensAdminProps {
+    /**
+     * Direct mode: pass keys and skip server routes entirely (or supply them via
+     * the surrounding <LensProvider config={…}>). Wins over `baseUrl` /
+     * `projectsUrl` / `projects`.
+     */
+    config?: LensAdminConfig;
+    /** Proxy mode: server-side proxy base. Default '/api/lens'. */
+    baseUrl?: string;
+    /**
+     * Proxy mode: endpoint returning `{ projects: [{ name, accessId }] }`.
+     * Default '/api/lens-projects'. Ignored when `projects` is passed.
+     */
+    projectsUrl?: string;
+    /** Proxy mode: static project list — skips the projectsUrl fetch. */
+    projects?: ProjectRef[];
+    /** Initial tab. Default 'reports'. */
+    defaultTab?: TabId;
+    theme?: 'light' | 'dark';
+    className?: string;
+}
+/**
+ * Batteries-included admin surface for Lens. Renders the segmented tab bar
+ * (Issue Reports / Integrations / Setup), an optional project switcher, report
+ * deep-linking, and first-run provisioning — so a host writes a single import
+ * instead of assembling the pieces by hand. Pairs with a server-side proxy the
+ * host owns (`baseUrl`) that attaches project credentials.
+ */
+declare function LensAdmin(props: LensAdminProps): React.JSX.Element;
+declare const LensDashboard: typeof LensAdmin;
+type LensDashboardProps = LensAdminProps;
+type LensDashboardConfig = LensAdminConfig;
+
 interface ReportsTableProps {
     onSelect?: (id: string) => void;
     status?: ReportStatus;
@@ -704,4 +788,4 @@ interface AsyncState<T> {
  */
 declare function useAsync<T>(fn: () => Promise<T>, deps: unknown[]): AsyncState<T>;
 
-export { type AssetKind, type AssetRef, type AsyncState, type ConnectIntegrationResponse, type CreateProjectRequest, type CreateProjectResponse, type Integration, type IntegrationProvider, IntegrationSettings, type IntegrationSettingsProps, type IntegrationStatus, type LensApi, type LensApiConfig, LensApiError, LensDashboardProvider, type LensDashboardProviderProps, type ListIntegrationsResponse, type ListReportsQuery, type ListReportsResult, OnboardingWizard, type OnboardingWizardProps, type Project, ProjectSettings, type ProjectSettingsProps, ReplayPlayer, type ReplayPlayerProps, type Report, ReportDetail, type ReportDetailProps, type ReportMetadata, type ReportStatus, type ReportSummary, ReportsTable, type ReportsTableProps, type S3ConfigInput, type S3ConfigPublic, StatusBadge, type UpdateProjectRequest, createLensApi, useAsync, useLensApi };
+export { type AssetKind, type AssetRef, type AsyncState, type ConnectIntegrationResponse, type CreateProjectRequest, type CreateProjectResponse, type Integration, type IntegrationProvider, IntegrationSettings, type IntegrationSettingsProps, type IntegrationStatus, LensAdmin, type LensAdminConfig, type LensAdminProps, type LensApi, type LensApiConfig, LensApiError, LensDashboard, type LensDashboardConfig, type LensDashboardProps, LensDashboardProvider, type LensDashboardProviderProps, LensProvider, type ListIntegrationsResponse, type ListReportsQuery, type ListReportsResult, OnboardingWizard, type OnboardingWizardProps, type Project, ProjectSettings, type ProjectSettingsProps, ReplayPlayer, type ReplayPlayerProps, type Report, ReportDetail, type ReportDetailProps, type ReportMetadata, type ReportStatus, type ReportSummary, ReportsTable, type ReportsTableProps, type S3ConfigInput, type S3ConfigPublic, StatusBadge, type UpdateProjectRequest, createLensApi, useAsync, useLensApi };