@cosmoops/connect-sdk 0.19.0 → 0.21.0

package/CHANGELOG.md

@@ -3,6 +3,164 @@
 `@cosmoops/connect-sdk` follows semver, with the 0.x convention that **minor
 versions may carry breaking changes** and patch versions never do.
 
+## 0.21.0
+
+### Added
+
+- **`<ConnectOneTap />`** - a signed-out visitor who is already signed into
+  Connect is offered their account, and one tap signs them in **without leaving
+  the page**.
+
+  ```tsx
+  <ConnectProvider>
+    <App />
+    <ConnectOneTap />
+  </ConnectProvider>
+  ```
+
+  That is the whole integration. It needs no `clientId` in the browser and no
+  configuration: the bridge already knows the client, and now tells the page
+  where to ask on the `/session` read it was making anyway, so discovering One
+  Tap costs no extra request.
+
+  **What it replaces.** `silentSignIn` answers the same question - *is this
+  visitor already signed into Connect?* - by bouncing the browser to Connect
+  and back with `prompt=none`. That costs a visible full-page navigation on the
+  first load of **every** signed-out visit, shows the visitor nothing while it
+  happens, and gives them no way to decline. One Tap asks with a single
+  `fetch`, names the account before anything is signed, and completes with no
+  navigation at all. `silentSignIn` still works and is unchanged; prefer this.
+
+  **It only appears when it can help.** A visitor Connect does not recognise
+  sees nothing, ever - no prompt, no flicker, no redirect - so this is safe to
+  mount unconditionally, which `silentSignIn` never was.
+
+  **Requires your application to be same-site with Connect** - a
+  `cosmoops.com` subdomain. `SameSite` is judged on the registrable domain, so
+  the visitor's Connect cookie rides along from `crm.cosmoops.com` and from
+  nowhere else. Deployed off-site, the prompt simply never appears and
+  `ConnectLoginButton` behaves exactly as before. No third-party cookie is
+  involved at any point, so this works in every browser rather than only in
+  Chromium.
+
+  **Two prompts, because consent is not assumed.** A visitor who has authorised
+  your application before gets their name, email, workspace and photo. One who
+  has not gets an impersonal prompt whose tap leads to the real consent
+  screen - Connect releases no identifying detail at all until that has
+  happened once.
+
+  **Dismissal is remembered.** Closing the prompt buys 2 hours of quiet, then a
+  day, then a week; signing out buys a day. All in your own origin's
+  `localStorage`, and none of it leaves the browser.
+
+- **`readOneTapHint()` and `oneTapSignIn()` on `useConnect()`** - the two calls
+  `<ConnectOneTap />` is built from, for applications that want to draw the
+  prompt themselves. Both report expected outcomes as values rather than
+  throwing: `consent_required` and `interaction_required` mean "hand off to the
+  interactive screen", which is a hand-off, not an error to show anybody.
+
+- **`ConnectSession.oneTap`** - where the browser may ask Connect about the
+  visitor, or `null` when this deployment cannot run One Tap (no `clientId`, or
+  a session store with no `write`). Present on the signed-in and signed-out
+  branches alike, so no consumer has to test for key presence.
+
+### Security
+
+- The One Tap exchange is **PKCE-bound, and the verifier never reaches the
+  page**. Connect hands the authorization code to the browser, so unlike the
+  redirect flow the code alone must not be redeemable: `/one-tap/start` mints
+  the pair and keeps the verifier in an `HttpOnly`, `SameSite=Lax` cookie on
+  your own origin, and `/one-tap/complete` is the only thing that can spend it.
+  A code lifted out of the browser, or replayed cross-site, is worthless.
+
+## 0.20.0
+
+### Added
+
+- **`connect.channels` and `connect.calls`** - the phone numbers Connect has
+  assigned to your application, and the calls that arrived on them. Seven
+  endpoints that have been live on the API and reachable only by hand until
+  now.
+
+  ```ts
+  const { id } = await connect.channels.claim({ workspaceId });
+  await connect.channels.setRouting(id, { agent: "sales", afterHours: "voicemail" });
+
+  const { items } = await connect.calls.list({ channelId: id });
+  const { call, turns } = await connect.calls.get(items[0].id);
+  ```
+
+  **You never pick the number.** Inventory is a regulated asset bought under
+  Connect's carrier account, so `claim` takes a workspace and a kind and
+  Connect picks from a pool you cannot see - which is also why nothing here
+  exposes a carrier, a provider reference or a monthly rate. A workspace holds
+  exactly one number across every application it uses, and it is fixed for the
+  life of the engagement; only a Connect operator can unassign one. A `409`
+  means either "this workspace already has one" (fix the call) or "the pool is
+  empty right now" (retry - Connect is notified).
+
+  `setRouting`'s `destination` is an arbitrary JSON object Connect stores
+  verbatim and **never reads into**: which agent answers, business hours,
+  overflow and fallback are all your application's model. It replaces rather
+  than merges, and `clearRouting` is the only way to say "stop answering" -
+  overwriting a destination can only point the number somewhere else. Clearing
+  is idempotent and, unlike `setRouting`, is allowed on a suspended channel:
+  making a live number stop answering must never be the operation that is
+  unavailable.
+
+  `calls.list` filters on `channelId` and nothing else - each further filter
+  costs a Firestore composite index - and pages by cursor: **page until
+  `hasMore` is `false` rather than stopping on an empty `items`.**
+  `calls.get` adds the transcript, ordered by `sequence`, which is the sort to
+  trust since two turns can share a millisecond. `recordingFileId` and
+  `transcriptFileId` are Drive file ids readable with a `drive:read` key, and
+  are `null` until the carrier posts the audio - branch on `recordingStatus`
+  rather than reading `null` as a failure.
+
+  Scopes: `channels:read`, `channels:claim`, `channels:manage`, `calls:read`.
+  A channel or call belonging to another application answers `not_found`, not
+  `forbidden` - confirming it exists would make these reads an oracle for
+  enumerating another partner's ids.
+
+### Changed
+
+- **The app launcher shows the whole catalogue, in two groups.**
+  `<ConnectAppsGrid>` now renders **Your apps** - what this workspace holds a
+  live subscription to - and **Explore**, the rest of the platform's active
+  applications. A tile in the first opens the application's own site; a tile in
+  the second opens that application's page on Connect, where a plan is chosen.
+  Your integration builds neither URL.
+
+  Tiles draw the application's registered icon (its uploaded brand image, or
+  its `lucide-react` icon from Connect's curated set) instead of a generic grid
+  glyph, the grid animates in, and a filter field appears once there are more
+  than eight tiles. The **"Browse all applications"** footer link is **gone**:
+  it pointed at `/applications` on Connect, a route that has never existed, so
+  the one discovery path the launcher offered was a 404. Discovery belongs in
+  the grid.
+
+- **`GET /apps` answers with every active application**, not only the
+  subscribed ones. `WorkspaceApp` gains two fields:
+
+  ```ts
+  interface WorkspaceApp {
+    subscribed: boolean;   // launchable now, vs. an invitation to subscribe
+    category: WorkspaceAppCategory;
+    // …unchanged
+  }
+  ```
+
+  `needsAttention` is always `false` when `subscribed` is `false`, and an
+  application whose subscription was **cancelled** now appears in the explore
+  half rather than disappearing. Applications this workspace's `type` is
+  outside the audience of are omitted entirely unless it already holds a
+  subscription to one - showing a tile whose only outcome is a refusal at
+  checkout is the dead end this change set out to remove.
+
+  **If you render your own grid from `connect.apps.list()`, filter on
+  `subscribed` to get the previous set back.** That is the only migration;
+  nothing was removed from the row.
+
 ## 0.19.0
 
 ### Added

package/README.md

@@ -2,7 +2,7 @@
 
 Official client for the **CosmoOps Connect application-partner API** (`/api/v1/application/*`).
 
-**Current version: `0.8.0`** · [Release notes](#release-notes) · [Full changelog](./CHANGELOG.md)
+**Current version: `0.20.0`** · [Release notes](#release-notes) · [Full changelog](./CHANGELOG.md)
 — follows semver with the 0.x convention that a **minor** version may carry a
 breaking change (a patch never does). Read the release notes for your target
 version before upgrading past a minor bump.
@@ -343,6 +343,8 @@ try {
 | `billing` | `listPlans` · `getAddonUsage` · `consumeAddon` |
 | `drive` | `upload` · `getFileUrl` · `getPreviewUrl` |
 | `contacts` | `lookupByPhone` · `get` |
+| `channels` | `list` · `get` · `claim` · `setRouting` · `clearRouting` |
+| `calls` | `list` · `get` |
 | `scheduling` | `listEventTypes` · `findSlots` · `listBookings` · `createBooking` · `rescheduleBooking` · `cancelBooking` |
 | `ai` | `chat` · `extract` |
 | `otp` | `send` · `verify` |
@@ -597,7 +599,7 @@ import {
 | `ConnectUserButton` | The account row at the foot of the rail — circular avatar, name over email — opening a modal with identity, sessions and the Connect destinations. Profile, Manage subscription and Open Connect each open Connect in a new tab; Sign out acts in place. Renders nothing when signed out. (Was `ConnectUserMenu`.) |
 | `ConnectProfileModal` | The same modal with no trigger, driven by `isOpen`/`onOpenChange` — for an app keeping its own account control. |
 | `ConnectWorkspaceSwitcher` | Sits in the rail's header. Hides itself for an account with one workspace; shows unusable ones disabled, with the reason. |
-| `ConnectAppsGrid` | Google-style launcher — grid icon opening a modal of every app this workspace can open. |
+| `ConnectAppsGrid` | Google-style launcher — grid icon opening a modal in two groups: **Your apps** (a live subscription, opened at the application's own site) and **Explore** (the rest of the catalogue, opened on Connect). Registered icons, filter field past eight tiles. |
 | `ConnectPlans` | Monthly/annual toggle, features, add-ons, live discount, coupon field, and the subscribe / upgrade / downgrade / cancel flow. |
 | `ConnectPlansPage` | A whole `/plans` page — readiness banner, current subscription, and the grid. What `connect-sdk init` scaffolds. |
 | `ConnectSubscribeDialog` | The review step `ConnectPlans` opens — plan, GST, what happens to the current cycle. Exported so you can drive the flow from your own pricing page. |
@@ -899,6 +901,18 @@ So the hand-off is a URL, and Connect renders it as a modal over the relevant pa
 
 Full history: [CHANGELOG.md](./CHANGELOG.md). Latest first:
 
+### 0.20.0
+
+**The app launcher shows the whole catalogue.** `<ConnectAppsGrid>` renders two
+groups — **Your apps** (a live subscription, opened at the application's own
+site) and **Explore** (the rest of the platform's active applications, opened
+on Connect). `GET /apps` answers accordingly, and `WorkspaceApp` gains
+`subscribed` and `category`.
+
+The "Browse all applications" footer link is gone: it pointed at a Connect
+route that has never existed. **If you render your own grid from
+`connect.apps.list()`, filter on `subscribed` to get the previous set back.**
+
 ### 0.12.0 — breaking
 
 The application shell is one column. **The top bar is gone**; the rail holds

package/dist/cjs/client/components/apps-grid.js

@@ -5,44 +5,133 @@ exports.ConnectAppsGrid = ConnectAppsGrid;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("@heroui/react");
 const lucide_react_1 = require("lucide-react");
+const react_2 = require("react");
 const provider_js_1 = require("../provider.js");
 const motion_js_1 = require("./motion.js");
 const shell_context_js_1 = require("./shell-context.js");
-function AppTile({ app }) {
-    const disabled = app.launchUrl === null;
-    const body = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { className: "relative flex size-12 items-center justify-center overflow-hidden rounded-xl bg-surface-secondary", children: [app.iconUrl ? (
-                    // Deliberately a plain `<img>`: this package ships into any React app
-                    // and cannot assume `next/image` or any other framework loader.
-                    // eslint-disable-next-line @next/next/no-img-element
-                    (0, jsx_runtime_1.jsx)("img", { src: app.iconUrl, alt: "", className: "size-full object-cover" })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.LayoutGrid, { className: "size-6 text-muted", "aria-hidden": "true" })), app.needsAttention && ((0, jsx_runtime_1.jsx)("span", { className: "absolute -right-0.5 -top-0.5 flex size-4 items-center justify-center rounded-full bg-warning text-warning-foreground", children: (0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "size-3", "aria-hidden": "true" }) }))] }), (0, jsx_runtime_1.jsx)("span", { className: "line-clamp-2 text-center text-xs font-medium text-foreground", children: app.name }), app.isCurrent && (0, jsx_runtime_1.jsx)("span", { className: "text-[0.625rem] uppercase tracking-wide text-accent", children: "Current" })] }));
-    const shared = "flex flex-col items-center gap-2 rounded-xl p-3 transition-colors focus-visible:outline-2 focus-visible:outline-focus";
+/**
+ * Connect's curated `Application.icon` set, as components.
+ *
+ * A closed map rather than a dynamic lookup on `lucide-react`: the icon name
+ * arrives over the wire, and resolving an arbitrary string against a module's
+ * exports is how a catalog typo becomes a render crash. Anything unrecognised
+ * - including the older, lowercased names some applications were registered
+ * with - falls through to the neutral tile glyph.
+ */
+const APP_ICONS = {
+    Mail: lucide_react_1.Mail,
+    MessageSquare: lucide_react_1.MessageSquare,
+    Database: lucide_react_1.Database,
+    HardDrive: lucide_react_1.HardDrive,
+    BarChart3: lucide_react_1.BarChart3,
+    LineChart: lucide_react_1.LineChart,
+    ShieldCheck: lucide_react_1.ShieldCheck,
+    Lock: lucide_react_1.Lock,
+    CreditCard: lucide_react_1.CreditCard,
+    Receipt: lucide_react_1.Receipt,
+    ListChecks: lucide_react_1.ListChecks,
+    Calendar: lucide_react_1.Calendar,
+    Server: lucide_react_1.Server,
+    Cloud: lucide_react_1.Cloud,
+    Cpu: lucide_react_1.Cpu,
+    Package: lucide_react_1.Package,
+};
+/** Below this many tiles a filter field is one more thing to look past. */
+const SEARCH_THRESHOLD = 8;
+/**
+ * The tile's own glyph: the uploaded brand icon when there is one, the
+ * curated lucide icon when there is not, and the neutral grid mark when the
+ * name is one this version of the SDK does not know.
+ */
+function AppGlyph({ app }) {
+    if (app.iconUrl) {
+        // Deliberately a plain `<img>`: this package ships into any React app
+        // and cannot assume `next/image` or any other framework loader.
+        // eslint-disable-next-line @next/next/no-img-element
+        return (0, jsx_runtime_1.jsx)("img", { src: app.iconUrl, alt: "", className: "size-full object-cover" });
+    }
+    const Icon = APP_ICONS[app.icon] ?? lucide_react_1.LayoutGrid;
+    return (0, jsx_runtime_1.jsx)(Icon, { className: "size-6", "aria-hidden": "true" });
+}
+function AppTile({ app, onOpen }) {
+    // A subscribed app with no registered site is the one genuinely dead tile:
+    // there is nothing to open and nothing to buy.
+    const disabled = app.subscribed && app.launchUrl === null;
+    const shared = "group/tile flex w-full flex-col items-center gap-2 rounded-2xl p-3 text-center outline-offset-2 transition-colors duration-200 focus-visible:outline-2 focus-visible:outline-focus";
+    const body = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { className: "relative flex size-14 items-center justify-center overflow-hidden rounded-[0.8125rem] bg-surface-secondary text-muted transition-colors duration-200 group-hover/tile:bg-default group-hover/tile:text-foreground", children: [(0, jsx_runtime_1.jsx)(AppGlyph, { app: app }), app.needsAttention && ((0, jsx_runtime_1.jsx)("span", { className: "absolute -right-0.5 -top-0.5 flex size-4 items-center justify-center rounded-full bg-warning text-warning-foreground", children: (0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "size-3", "aria-hidden": "true" }) })), !app.subscribed && ((0, jsx_runtime_1.jsx)("span", { className: "absolute -right-0.5 -top-0.5 flex size-4 items-center justify-center rounded-full bg-default text-muted opacity-0 transition-opacity duration-200 group-hover/tile:opacity-100", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Plus, { className: "size-3", "aria-hidden": "true" }) }))] }), (0, jsx_runtime_1.jsx)("span", { className: "line-clamp-2 text-xs font-medium leading-tight text-foreground", children: app.name }), app.isCurrent ? ((0, jsx_runtime_1.jsx)("span", { className: "text-[0.625rem] uppercase tracking-wide text-accent", children: "Current" })) : (!app.subscribed && ((0, jsx_runtime_1.jsxs)("span", { className: "flex items-center gap-0.5 text-[0.625rem] uppercase tracking-wide text-muted opacity-0 transition-opacity duration-200 group-hover/tile:opacity-100", children: ["Subscribe", (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowUpRight, { className: "size-2.5", "aria-hidden": "true" })] })))] }));
     if (disabled) {
         return ((0, jsx_runtime_1.jsx)("div", { className: `${shared} cursor-default opacity-60`, title: `${app.name} has no launch URL configured`, children: body }));
     }
-    return ((0, jsx_runtime_1.jsx)("a", { href: app.launchUrl, target: "_blank", rel: "noopener noreferrer", className: `${shared} hover:bg-surface-secondary`, title: app.description || app.name, children: body }));
+    return (
+    // A `<button>` rather than an `<a>`: where the tile goes depends on
+    // `subscribed` *and* on Connect's own origin, which only the provider
+    // knows, so one handler resolves it rather than every caller rebuilding
+    // the URL. Both destinations still open in a new tab - a launcher must
+    // not throw away the page you launched it from.
+    (0, jsx_runtime_1.jsx)(motion_js_1.m.button, { type: "button", onClick: () => onOpen(app), className: `${shared} hover:bg-surface-secondary`, title: app.description || app.name, whileHover: { y: -2 }, whileTap: { scale: 0.94 }, transition: { type: "spring", stiffness: 420, damping: 28 }, children: body }));
+}
+function AppsSection({ title, hint, apps, offset, onOpen, }) {
+    if (apps.length === 0)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)("section", { className: "space-y-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-baseline justify-between gap-2 px-1", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-[0.6875rem] font-semibold uppercase tracking-[0.06em] text-muted", children: title }), (0, jsx_runtime_1.jsx)("p", { className: "text-[0.6875rem] text-muted", children: hint })] }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-3 gap-1 sm:grid-cols-4", children: apps.map((app, index) => ((0, jsx_runtime_1.jsx)(motion_js_1.m.div, { initial: { opacity: 0, scale: 0.9, y: 8 }, animate: { opacity: 1, scale: 1, y: 0 }, transition: {
+                        type: "spring",
+                        stiffness: 420,
+                        damping: 30,
+                        // Capped so a large catalog does not make the last tile wait.
+                        delay: Math.min(offset + index, 14) * 0.018,
+                    }, children: (0, jsx_runtime_1.jsx)(AppTile, { app: app, onOpen: onOpen }) }, app.applicationId))) })] }));
+}
+function GridSkeleton() {
+    return ((0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-3 gap-1 sm:grid-cols-4", "aria-hidden": "true", children: Array.from({ length: 8 }, (_, index) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center gap-2 p-3", children: [(0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "size-14 rounded-[0.8125rem]" }), (0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "h-3 w-14" })] }, index))) }));
 }
 /**
- * The Google-style app launcher: a grid icon in your top bar that opens a
- * modal of every Connect application this workspace can actually open.
+ * The Google-style app launcher: a grid icon that opens every Connect
+ * application this workspace has, and every one it could have.
+ *
+ * Two sections, because they are two different actions. **Your apps** is what
+ * the workspace can open right now - the current application pinned first and
+ * marked, so the grid never has a hole where "you are here" should be, and a
+ * paused subscription still listed but badged, because a dunning cycle should
+ * not make a product look deleted. **Explore** is the rest of the active
+ * catalog, minus anything this workspace's type could never subscribe to, and
+ * a tile there opens that application's page on Connect.
  *
- * Only launchable apps appear, so no tile is a dead end - a paused
- * subscription still shows, badged, because a dunning cycle should not make a
- * product look deleted. The current app is pinned first and marked, rather
- * than filtered out, so the grid never has a hole where "you are here" should
- * be.
+ * It used to show subscriptions only, with a "Browse all applications" link
+ * under the grid pointing at a Connect route that does not exist - so a
+ * workspace with one subscription saw one tile and had no working way to find
+ * anything else. Discovery belongs in the grid.
  *
  * Renders nothing when signed out: a launcher with nothing to launch is just a
  * button that opens an empty box.
  */
 function ConnectAppsGrid({ className, label = "Switch app", variant = "row" }) {
-    const { session, isLoading: sessionLoading } = (0, provider_js_1.useConnect)();
+    const { session, isLoading: sessionLoading, appUrl } = (0, provider_js_1.useConnect)();
     const { data, isLoading, error } = (0, provider_js_1.useConnectApps)();
+    const [query, setQuery] = (0, react_2.useState)("");
+    const apps = (0, react_2.useMemo)(() => data?.apps ?? [], [data]);
+    const { mine, explore } = (0, react_2.useMemo)(() => {
+        const needle = query.trim().toLowerCase();
+        const matches = needle
+            ? apps.filter((app) => app.name.toLowerCase().includes(needle) || app.description.toLowerCase().includes(needle))
+            : apps;
+        return {
+            mine: matches.filter((app) => app.subscribed),
+            explore: matches.filter((app) => !app.subscribed),
+        };
+    }, [apps, query]);
     if (sessionLoading || !session?.user)
         return null;
-    const apps = data?.apps ?? [];
-    return ((0, jsx_runtime_1.jsx)(motion_js_1.MotionProvider, { children: (0, jsx_runtime_1.jsxs)(react_1.Modal, { children: [variant === "row" ? ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "tertiary", "aria-label": label, className: (0, shell_context_js_1.sidebarRowClass)({ className }), children: [(0, jsx_runtime_1.jsx)("span", { className: "flex size-5 shrink-0 items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.LayoutGrid, { className: "size-5" }) }), (0, jsx_runtime_1.jsx)(shell_context_js_1.SidebarLabel, { children: label })] })) : ((0, jsx_runtime_1.jsx)(react_1.Button, { isIconOnly: true, variant: "primary", "aria-label": label, className: className, children: (0, jsx_runtime_1.jsx)(lucide_react_1.LayoutGrid, { className: "size-5" }) })), (0, jsx_runtime_1.jsx)(react_1.Modal.Backdrop, { children: (0, jsx_runtime_1.jsx)(react_1.Modal.Container, { children: (0, jsx_runtime_1.jsxs)(react_1.Modal.Dialog, { className: "sm:max-w-md", children: [(0, jsx_runtime_1.jsx)(react_1.Modal.CloseTrigger, {}), (0, jsx_runtime_1.jsx)(react_1.Modal.Header, { children: (0, jsx_runtime_1.jsx)(react_1.Modal.Heading, { children: "Your apps" }) }), (0, jsx_runtime_1.jsxs)(react_1.Modal.Body, { children: [isLoading && ((0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-3 gap-2", children: Array.from({ length: 6 }, (_, index) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center gap-2 p-3", children: [(0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "size-12 rounded-xl" }), (0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "h-3 w-14" })] }, index))) })), !isLoading && error && ((0, jsx_runtime_1.jsx)("p", { className: "py-6 text-center text-sm text-danger", children: "Could not load your apps." })), !isLoading && !error && apps.length === 0 && ((0, jsx_runtime_1.jsx)("p", { className: "py-6 text-center text-sm text-muted", children: "No other apps yet. Anything this workspace subscribes to shows up here." })), !isLoading && !error && apps.length > 0 && ((0, jsx_runtime_1.jsx)(motion_js_1.m.div, { className: "grid grid-cols-3 gap-2", variants: { show: { transition: { staggerChildren: 0.04 } } }, initial: "hidden", animate: "show", children: apps.map((app) => ((0, jsx_runtime_1.jsx)(motion_js_1.m.div, { variants: { hidden: { opacity: 0, y: 8 }, show: { opacity: 1, y: 0, transition: motion_js_1.ENTER } }, children: (0, jsx_runtime_1.jsx)(AppTile, { app: app }) }, app.applicationId))) }))] }), (0, jsx_runtime_1.jsx)(react_1.Modal.Footer, { children: (0, jsx_runtime_1.jsx)(ConnectBrowseAllLink, {}) })] }) }) })] }) }));
-}
-function ConnectBrowseAllLink() {
-    const { appUrl } = (0, provider_js_1.useConnect)();
-    return ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "tertiary", className: "w-full", onPress: () => window.open(`${appUrl}/applications`, "_blank", "noopener,noreferrer"), children: ["Browse all applications", (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { className: "size-3.5 text-muted" })] }));
+    const openApp = (app) => {
+        // Subscribed goes to the partner's own site; everything else goes to that
+        // application's page on Connect, which is where a plan is actually
+        // chosen. The SDK owns this mapping so no integration has to know either
+        // URL shape.
+        const target = app.subscribed && app.launchUrl ? app.launchUrl : `${appUrl}/apps/${app.applicationId}`;
+        window.open(target, "_blank", "noopener,noreferrer");
+    };
+    const showSearch = apps.length > SEARCH_THRESHOLD;
+    const isEmpty = !isLoading && !error && mine.length === 0 && explore.length === 0;
+    return ((0, jsx_runtime_1.jsx)(motion_js_1.MotionProvider, { children: (0, jsx_runtime_1.jsxs)(react_1.Modal, { children: [variant === "row" ? ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "tertiary", "aria-label": label, className: (0, shell_context_js_1.sidebarRowClass)({ className }), children: [(0, jsx_runtime_1.jsx)("span", { className: "flex size-5 shrink-0 items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.LayoutGrid, { className: "size-5" }) }), (0, jsx_runtime_1.jsx)(shell_context_js_1.SidebarLabel, { children: label })] })) : ((0, jsx_runtime_1.jsx)(react_1.Button, { isIconOnly: true, variant: "primary", "aria-label": label, className: className, children: (0, jsx_runtime_1.jsx)(lucide_react_1.LayoutGrid, { className: "size-5" }) })), (0, jsx_runtime_1.jsx)(react_1.Modal.Backdrop, { children: (0, jsx_runtime_1.jsx)(react_1.Modal.Container, { children: (0, jsx_runtime_1.jsxs)(react_1.Modal.Dialog, { className: "sm:max-w-lg", children: [(0, jsx_runtime_1.jsx)(react_1.Modal.CloseTrigger, {}), (0, jsx_runtime_1.jsx)(react_1.Modal.Header, { children: (0, jsx_runtime_1.jsx)(react_1.Modal.Heading, { children: "Your apps" }) }), (0, jsx_runtime_1.jsxs)(react_1.Modal.Body, { className: "space-y-4", children: [showSearch && ((0, jsx_runtime_1.jsxs)(react_1.TextField, { className: "relative", variant: "secondary", value: query, onChange: setQuery, children: [(0, jsx_runtime_1.jsx)(react_1.Label, { className: "sr-only", children: "Filter apps" }), (0, jsx_runtime_1.jsx)(react_1.Input, { className: "pr-9", placeholder: "Filter apps" }), (0, jsx_runtime_1.jsx)(lucide_react_1.Search, { className: "pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-muted", "aria-hidden": "true" })] })), isLoading && (0, jsx_runtime_1.jsx)(GridSkeleton, {}), !isLoading && error && ((0, jsx_runtime_1.jsx)("p", { className: "py-6 text-center text-sm text-danger", children: "Could not load your apps." })), isEmpty && ((0, jsx_runtime_1.jsx)("p", { className: "py-6 text-center text-sm text-muted", children: query
+                                                ? `Nothing matches “${query}”.`
+                                                : "No apps yet. Anything this workspace can open shows up here." })), !isLoading && !error && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(AppsSection, { title: "Your apps", hint: "Open", apps: mine, offset: 0, onOpen: openApp }), (0, jsx_runtime_1.jsx)(AppsSection, { title: "Explore", hint: "Subscribe on Connect", apps: explore, offset: mine.length, onOpen: openApp })] }))] })] }) }) })] }) }));
 }

package/dist/cjs/client/components/identity.js

@@ -0,0 +1,24 @@
+"use strict";
+/**
+ * How a person is rendered when there is no photo to render.
+ *
+ * Shared rather than copied because two surfaces showing *different* initials
+ * for the same account reads as a bug in the account, not in the component -
+ * and the One Tap prompt and the user menu are frequently on screen within
+ * seconds of each other.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initials = initials;
+/**
+ * Up to two letters standing for a person.
+ *
+ * Splits on the punctuation an email address uses as well as whitespace, so
+ * `priya.nair@acme.test` yields `PN` rather than `PR` - an account with no
+ * display name is exactly the case the fallback exists for, and taking the
+ * first two characters of a local part would make it useless there.
+ */
+function initials(name, email = null) {
+    const source = name?.trim() || email?.trim() || "";
+    const parts = source.split(/[\s@._-]+/).filter(Boolean);
+    return (parts.slice(0, 2).map((part) => part[0]).join("") || "?").toUpperCase();
+}

package/dist/cjs/client/components/one-tap-state.js

@@ -0,0 +1,96 @@
+"use strict";
+/**
+ * How long One Tap stays quiet, and why.
+ *
+ * A prompt that reappears on every page load after being closed is not a
+ * convenience, it is an interstitial. Two things silence it, both stored in the
+ * application's own `localStorage` - nothing here leaves the browser, and
+ * nothing here is a security control:
+ *
+ * - **Dismissal, escalating.** Closing it once is "not now"; closing it three
+ *   times is "stop asking". The backoff says that back.
+ * - **Signing out.** Someone who has just signed out of this application does
+ *   not want to be offered the same account back on the next render. That is a
+ *   different fact from a dismissal, so it does not consume a dismissal, but it
+ *   buys a day of quiet.
+ *
+ * Every access is wrapped: `localStorage` throws outright in some embedded and
+ * privacy-restricted contexts, and a prompt is never worth breaking a page for.
+ * A read that fails reads as "not suppressed", which is the same state a fresh
+ * browser is in.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.oneTapSuppressed = oneTapSuppressed;
+exports.dismissOneTap = dismissOneTap;
+exports.suppressOneTapAfterSignOut = suppressOneTapAfterSignOut;
+exports.clearOneTapSuppression = clearOneTapSuppression;
+const STORAGE_KEY = "connect_one_tap";
+/** Escalating quiet after 1, 2, and 3-or-more dismissals. */
+const DISMISS_BACKOFF_MS = [2 * 60 * 60 * 1000, 24 * 60 * 60 * 1000, 7 * 24 * 60 * 60 * 1000];
+const SIGN_OUT_QUIET_MS = 24 * 60 * 60 * 1000;
+function read() {
+    const empty = { dismissals: 0, until: 0 };
+    if (typeof window === "undefined")
+        return empty;
+    try {
+        const raw = window.localStorage.getItem(STORAGE_KEY);
+        if (!raw)
+            return empty;
+        const parsed = JSON.parse(raw);
+        return {
+            dismissals: typeof parsed.dismissals === "number" ? parsed.dismissals : 0,
+            until: typeof parsed.until === "number" ? parsed.until : 0,
+        };
+    }
+    catch {
+        return empty;
+    }
+}
+function write(state) {
+    if (typeof window === "undefined")
+        return;
+    try {
+        window.localStorage.setItem(STORAGE_KEY, JSON.stringify(state));
+    }
+    catch {
+        // Storage is full, blocked, or unavailable. The prompt simply keeps its
+        // default behaviour rather than the page failing.
+    }
+}
+/**
+ * Whether the prompt may be shown at all.
+ *
+ * Read once when the component mounts, never during render: `localStorage` is
+ * external mutable state, and reading it in a render body is impure - with the
+ * React Compiler on, exactly the kind of thing that can be hoisted into the
+ * wrong answer. Same reasoning as `ConnectProvider`'s `silentAttemptSpent`.
+ */
+function oneTapSuppressed() {
+    return Date.now() < read().until;
+}
+/** Records a close, and escalates how long the next quiet period lasts. */
+function dismissOneTap() {
+    const { dismissals } = read();
+    const next = dismissals + 1;
+    const backoff = DISMISS_BACKOFF_MS[Math.min(next, DISMISS_BACKOFF_MS.length) - 1];
+    write({ dismissals: next, until: Date.now() + backoff });
+}
+/**
+ * Silences the prompt after an explicit sign-out, without spending a dismissal.
+ * Signing out is not a complaint about the prompt, so it must not push someone
+ * closer to the seven-day backoff.
+ */
+function suppressOneTapAfterSignOut() {
+    write({ dismissals: read().dismissals, until: Date.now() + SIGN_OUT_QUIET_MS });
+}
+/** Clears the record once a sign-in actually happens - the prompt did its job. */
+function clearOneTapSuppression() {
+    if (typeof window === "undefined")
+        return;
+    try {
+        window.localStorage.removeItem(STORAGE_KEY);
+    }
+    catch {
+        // See `write`.
+    }
+}

package/dist/cjs/client/components/one-tap.js

@@ -0,0 +1,106 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConnectOneTap = ConnectOneTap;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const lucide_react_1 = require("lucide-react");
+const react_2 = require("@heroui/react");
+const provider_js_1 = require("../provider.js");
+const mark_js_1 = require("../mark.js");
+const identity_js_1 = require("./identity.js");
+const motion_js_1 = require("./motion.js");
+const one_tap_state_js_1 = require("./one-tap-state.js");
+function ConnectOneTap({ onInteractiveSignIn, className = "" }) {
+    const { session, isLoading, signIn, readOneTapHint, oneTapSignIn } = (0, provider_js_1.useConnect)();
+    const [hint, setHint] = (0, react_1.useState)(null);
+    const [phase, setPhase] = (0, react_1.useState)("hidden");
+    /**
+     * Sampled once at mount rather than read during render, for the same reason
+     * `ConnectProvider` samples its silent-attempt marker that way: `localStorage`
+     * is external mutable state and reading it in a render body is impure.
+     * `false` on the server, which is correct - nothing renders until the hint
+     * has resolved on the client anyway.
+     */
+    const [suppressed] = (0, react_1.useState)(() => typeof window !== "undefined" && (0, one_tap_state_js_1.oneTapSuppressed)());
+    const signedOut = !isLoading && !session?.user;
+    const askable = signedOut && !suppressed && Boolean(session?.oneTap);
+    (0, react_1.useEffect)(() => {
+        if (!askable)
+            return;
+        // Nothing here is a synchronous `setState` in an effect: every write
+        // happens after awaiting the network. The flag is what stops a late answer
+        // landing on a component that has already unmounted.
+        let cancelled = false;
+        void readOneTapHint().then((answer) => {
+            if (cancelled)
+                return;
+            // A visitor Connect does not recognise is the common case and gets
+            // nothing - no prompt, no flicker, no trace that a question was asked.
+            if (!answer || answer.status !== "signed_in")
+                return;
+            setHint(answer);
+            setPhase("offered");
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [askable, readOneTapHint]);
+    const handoff = (0, react_1.useCallback)(() => {
+        setPhase("hidden");
+        if (onInteractiveSignIn)
+            onInteractiveSignIn();
+        else
+            signIn();
+    }, [onInteractiveSignIn, signIn]);
+    const accept = (0, react_1.useCallback)(async () => {
+        // A visitor who has never authorised this application cannot be signed in
+        // silently and Connect would refuse anyway, so the tap goes straight to the
+        // screen that can ask them properly.
+        if (!hint?.consented) {
+            handoff();
+            return;
+        }
+        setPhase("working");
+        const result = await oneTapSignIn();
+        if (result.ok) {
+            // The provider has already refreshed the session; this component
+            // disappears because `signedOut` is now false.
+            setPhase("hidden");
+            return;
+        }
+        // `consent_required` and `interaction_required` both mean a screen is
+        // genuinely needed. `login_required` means the Connect session went away
+        // between the hint and the tap. All three are handed to the interactive
+        // flow, which can explain itself; a rate limit or a transport failure just
+        // closes the prompt rather than blaming the visitor for tapping.
+        if (result.reason === "consent_required" ||
+            result.reason === "interaction_required" ||
+            result.reason === "login_required") {
+            handoff();
+            return;
+        }
+        setPhase("hidden");
+    }, [handoff, hint, oneTapSignIn]);
+    const dismiss = (0, react_1.useCallback)(() => {
+        (0, one_tap_state_js_1.dismissOneTap)();
+        setPhase("hidden");
+    }, []);
+    if (phase === "hidden" || !hint)
+        return null;
+    const displayName = hint.user?.displayName ?? hint.user?.email ?? null;
+    const applicationName = hint.application?.name;
+    const busy = phase === "working";
+    return ((0, jsx_runtime_1.jsx)(motion_js_1.MotionProvider, { children: (0, jsx_runtime_1.jsx)(motion_js_1.m.div, { initial: { opacity: 0, y: 12 }, animate: { opacity: 1, y: 0 }, transition: motion_js_1.ENTER, role: "dialog", "aria-label": applicationName ? `Continue to ${applicationName} with CosmoOps` : "Continue with CosmoOps", 
+            // Fixed, above ordinary content but below a modal: this is an offer,
+            // and it must never sit on top of something the visitor opened
+            // themselves.
+            className: `fixed inset-x-3 bottom-3 z-40 sm:inset-x-auto sm:right-4 sm:bottom-4 sm:w-80 ${className}`, onKeyDown: (event) => {
+                if (event.key === "Escape")
+                    dismiss();
+            }, children: (0, jsx_runtime_1.jsxs)(react_2.Card, { className: "p-4 shadow-lg", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-3", children: [hint.consented ? ((0, jsx_runtime_1.jsxs)(react_2.Avatar, { size: "md", color: "accent", variant: "soft", className: "shrink-0 rounded-full", children: [hint.user?.photoUrl && ((0, jsx_runtime_1.jsx)(react_2.Avatar.Image, { alt: displayName ?? "Your account", src: hint.user.photoUrl })), (0, jsx_runtime_1.jsx)(react_2.Avatar.Fallback, { children: (0, identity_js_1.initials)(hint.user?.displayName ?? null, hint.user?.email ?? null) })] })) : ((0, jsx_runtime_1.jsx)(mark_js_1.ConnectMark, { className: "mt-0.5 size-8 shrink-0" })), (0, jsx_runtime_1.jsxs)("div", { className: "min-w-0 flex-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "truncate text-sm font-medium text-foreground", children: hint.consented ? `Continue as ${displayName ?? "your account"}` : "You're signed in to CosmoOps" }), (0, jsx_runtime_1.jsx)("p", { className: "truncate text-xs text-muted", children: hint.consented
+                                            ? [hint.user?.email, hint.workspace?.name].filter(Boolean).join(" · ")
+                                            : applicationName
+                                                ? `Continue to ${applicationName}`
+                                                : "Continue with your account" })] }), (0, jsx_runtime_1.jsx)(react_2.Button, { variant: "tertiary", size: "sm", isIconOnly: true, "aria-label": "Not now", onPress: dismiss, isDisabled: busy, children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "size-4" }) })] }), (0, jsx_runtime_1.jsxs)(react_2.Button, { variant: "secondary", className: "mt-3 w-full", onPress: () => void accept(), isPending: busy, children: [(0, jsx_runtime_1.jsx)(mark_js_1.ConnectMark, { className: "size-4" }), busy ? "Signing you in…" : "Continue"] })] }) }) }));
+}

package/dist/cjs/client/components/plan-pricing.js

@@ -18,6 +18,7 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ACTION_LABEL = void 0;
+exports.isFreePlan = isFreePlan;
 exports.formatPrice = formatPrice;
 exports.monthlyOf = monthlyOf;
 exports.intervalLabel = intervalLabel;
@@ -27,6 +28,21 @@ exports.resolvePlanGroup = resolvePlanGroup;
 exports.groupPlansByTier = groupPlansByTier;
 exports.annualSaving = annualSaving;
 exports.resolveAction = resolveAction;
+/**
+ * Whether a plan costs nothing - the SDK's copy of Connect's `isFreeSelection`
+ * (`packages/data/src/payments/free-plan.ts`), which is what the server
+ * actually decides the free-activation path with.
+ *
+ * A copy rather than an import for the reason `types.ts` gives: the published
+ * package carries none of Connect's internals. The rule is one line and does
+ * not drift, and `conformance.test.ts` pins the shape either side of it.
+ *
+ * @param addonsTotal Paise of the add-ons *selected*, not of the plan's whole
+ * catalog. A free plan with a paid add-on ticked is not free.
+ */
+function isFreePlan(price, addonsTotal = 0) {
+    return price === 0 && addonsTotal === 0;
+}
 /** Paise are the wire unit everywhere in Connect; rupees are the display unit. */
 function formatPrice(paise) {
     return new Intl.NumberFormat("en-IN", {