@streamoid/ui 0.6.16 → 0.6.18

package/dist/docs/ScWorkspaceSwitchMobile.md

@@ -0,0 +1,241 @@
+---
+component: ScWorkspaceSwitchMobile
+package: "@streamoid/ui"
+category: mobile
+status: legacy
+renders: div
+tags: [mobile, workspace, switcher, switch, card, role, owner, legacy, v1]
+related: [ScWorkspaceSwitchMobileV2, ScWorkspaceSettingsMobile, ScWorkspaceSwitchCard, ScDp]
+do_not_confuse_with: [ScWorkspaceSwitchMobileV2, ScWorkspaceSettingsMobile, ScWorkspaceCard, ScWorkspaceSwitchCard, StreamoidWorkspaceSwitcher]
+---
+
+# ScWorkspaceSwitchMobile
+
+**The V1 mobile workspace-switch card — superseded by `ScWorkspaceSwitchMobileV2`.**
+A fixed 326px rounded card: a 48px initials tile beside the workspace name with an
+always-blue role badge on the right, a divider, then an owner row with an icon slot.
+Still exported, but every CXO mobile surface uses V2 instead.
+
+## TL;DR for agents
+
+- **Reach for it when:** you specifically need the V1 look — a two-block card with a
+  divider and an owner row that carries your own icon. In new code, don't.
+- **Don't reach for it when:** you are building anything new on mobile
+  (→ `ScWorkspaceSwitchMobileV2`, which is fluid, composes `ScDp`, and has a
+  three-way `type`), or you need the workspace **settings** card with a team-count row
+  (→ `ScWorkspaceSettingsMobile`).
+- **Four things that will bite you:**
+  1. **It is `width: 326px`, fixed.** Not `100%`.
+  2. **The role badge is always info-blue**, whatever `role` says — a "Member" looks
+     like an admin.
+  3. **`ownerIcon` has no default.** Omit it and the 48px icon gutter still reserves
+     space, so the owner email sits oddly indented next to nothing.
+  4. **There is no initials fallback and no image support at all** — no `imageUrl`
+     prop; the tile is text only.
+
+---
+
+## 1. How to use it
+
+### Import
+
+```tsx
+import { ScWorkspaceSwitchMobile } from "@streamoid/ui";
+import "@streamoid/ui/dist/index.css"; // once, at your app root
+```
+
+### Minimal usage
+
+```tsx
+<ScWorkspaceSwitchMobile
+  storeName={ws.name}
+  initials={ws.initials}
+  role={ws.role === "admin" ? "Admin" : "Member"}
+  ownerId={ws.ownerEmail}
+  ownerIcon={<SiconUser size={20} />}
+  currentWs={ws._id === currentId}
+/>
+```
+
+### Props
+
+| Prop | Type | Default | Notes |
+|---|---|---|---|
+| `storeName` | `string` | `"Stores"` | ⚠️ Demo default. The workspace name — note the prop is `storeName`, not `wsName` (V2 renamed it). Clips but does **not** ellipsise: `.storeName` omits `white-space: nowrap` — see Gotcha 9. |
+| `initials` | `string` | `"WS"` | ⚠️ Demo default. Rendered into a hand-rolled 48px `--radius-xl` tile. No name-derived fallback. |
+| `role` | `string` | `"Admin"` | ⚠️ Demo default. Free text in a **fixed 80px always-blue** badge. Colour never varies. |
+| `ownerId` | `string` | `"rohan@streamoid.com"` | ⚠️ Demo default — a real-looking Streamoid address. Bottom row, tertiary grey, truncates. |
+| `currentWs` | `boolean` | `true` | ⚠️ Defaults to **true**. Picks the `current` vs `other` skin. See the table below. |
+| `ownerIcon` | `JSX.Element` | – | **Slot** for the icon before `ownerId`. No default; the 48px gutter renders regardless. |
+| `className` | `string` | – | Appended after internal classes. Unguarded concat — see Gotcha 5. |
+| `onClick` | `(e: React.MouseEvent) => void` | – | Attached to the root. No `role`/`tabIndex`/`cursor` come with it. |
+| `...props` | `React.HTMLAttributes<HTMLDivElement>` | – | Spread onto the root `div`. |
+
+### What each `currentWs` value renders
+
+| `currentWs` | Class | Background | Border |
+|---|---|---|---|
+| `true` | `variant-current` | `--alias-surface-canvas` | **none** |
+| `false` | `variant-other` | `--alias-surface-subtle` | 1px `--alias-border-subtle` |
+
+Note the asymmetry: the *current* card has no border at all, so on a canvas-coloured
+page it reads as a recessed well rather than a card.
+
+### Recipes
+
+```tsx
+// Make it fluid (the card is 326px by default)
+<ScWorkspaceSwitchMobile storeName={ws.name} initials={ws.initials} className="w-full" />
+
+// Always pass ownerIcon — the gutter is reserved whether or not you do
+import { SiconUser } from "@streamoid/icons";
+<ScWorkspaceSwitchMobile
+  storeName={ws.name}
+  initials={ws.initials}
+  ownerId={ws.ownerEmail}
+  ownerIcon={<SiconUser size={24} />}   // the wrapper is 24×24
+  currentWs={false}
+/>
+
+// Migrating to V2 (recommended)
+// BEFORE
+// <ScWorkspaceSwitchMobile storeName={n} initials={i} role={r} ownerId={o} currentWs={isCurrent} />
+// AFTER
+<ScWorkspaceSwitchMobileV2
+  wsName={n}
+  initials={i}
+  imageUrl={ws.imageUrl}          // V2 supports images
+  role={r}                        // exact "Member" turns blue in V2
+  plan={ws.plan}                  // V2 adds a plan segment
+  ownerId={o}
+  type={isCurrent ? "currentWS" : "otherWS"}
+/>
+```
+
+---
+
+## 2. Where to use it
+
+Its intended home was the mobile workspace-switcher sheet, one card per workspace. That
+surface now renders `ScWorkspaceSwitchMobileV2`
+(`cxo-dashboard/src/app/components/mobile-workspace-switcher.tsx:169` and `:246`), so
+this component has no live placement.
+
+It composes nothing from the DS — the initials tile and the role badge are hand-rolled
+markup, and the owner icon is a slot you fill.
+
+---
+
+## 3. When to use it
+
+### Use it when
+
+- You are maintaining an existing V1 call site and don't want a visual change.
+- You genuinely need an owner row with a caller-supplied icon — V2 has no icon slot.
+
+Otherwise: don't. This is `status: legacy`.
+
+### Don't use it — reach for this instead
+
+| Situation | Use instead |
+|---|---|
+| Any new mobile workspace row | `ScWorkspaceSwitchMobileV2` — fluid, `ScDp` avatar, `type` triad, `plan` segment |
+| Mobile workspace **settings** card (owner **and** team-count rows) | `ScWorkspaceSettingsMobile` |
+| Desktop sidebar workspace switcher | `StreamoidWorkspaceSwitcher` or `ScWorkspaceSwitchCard` |
+| A workspace summary card on desktop | `ScWorkspaceCard` |
+| A workspace avatar on its own, image or initials | `ScDp` (`variant="workspace"`) |
+| A **person's** identity row on mobile | `ScProfileV2Mobile` / `ScTableListMobile` |
+| A role chip you can control | `ScRoleMobile` (two fixed skins) or `ScBadges` (any colour) |
+
+### Don't confuse with
+
+| You may actually want | Not this |
+|---|---|
+| `ScWorkspaceSwitchMobileV2` — the current component. `wsName` not `storeName`, `type` triad not `currentWs` boolean, adds `imageUrl` + `plan`, fluid width, composes `ScDp` | Nothing in the name tells you V1 is superseded — check the suffix |
+| `ScWorkspaceSettingsMobile` — **almost the same component**: identical props plus `teamCount` and `teamIcon`, and a slightly different skin pair (`surface-canvas` / `surface-base`, always bordered) | The only structural difference is that extra info row |
+| `ScWorkspaceSwitchCard` — the desktop switcher card | Desktop metrics |
+| `ScWorkspaceCard` — a workspace summary tile | Not a switcher row |
+| `StreamoidWorkspaceSwitcher` / `NscWorkspaceSwitch` | Config-driven / other namesakes; check what you imported |
+
+`ScWorkspaceSwitchMobile` and `ScWorkspaceSettingsMobile` are the closest pair of
+near-duplicates in the whole library. Decide by the **screen**: switching → this one
+(really, V2); settings → `ScWorkspaceSettingsMobile`.
+
+---
+
+## 4. Why to use it
+
+Honestly: mostly you shouldn't. What it does give you:
+
+- **A caller-supplied owner icon slot**, which V2 dropped — the only capability V1 has
+  that V2 does not.
+- **Truncation is handled** on `ownerId` (`flex: 1 0 0; min-width: 0` +
+  `white-space: nowrap` + ellipsis). `storeName` gets the flex treatment but not
+  `nowrap`, so it wraps instead (Gotcha 9) — V2's `wsName` fixes this.
+- **Two skins for current-vs-other** in one boolean.
+
+What V2 gives you that this does not: fluid width, workspace images via `ScDp`, a `plan`
+segment, a chrome-less `display` mode, and an actual live call site to copy.
+
+---
+
+## Gotchas
+
+**1. Fixed `width: 326px`.** The root is not fluid; it will not fill a mobile sheet and
+overflows a 360px phone with 20px side padding.
+
+**2. The role badge is always info-blue.** `.roleBadge` hardcodes
+`--alias-fill-info-soft` + `--alias-border-info` + info text, and is a fixed 80px wide.
+
+```tsx
+// MISLEADING — "Member" renders in the same blue as "Admin"
+<ScWorkspaceSwitchMobile role="Member" />
+```
+
+**3. `currentWs` defaults to `true`.** In a list, forgetting it makes every card look
+like the active workspace.
+
+**4. `ownerIcon` has no default, but its gutter does.** `.ownerIconContainer` is
+`width: 48px; flex-shrink: 0` unconditionally, so with no icon you get 48px of empty
+space before the email. Always pass an icon (the inner wrapper is 24×24, so `size={20}`
+or `24`).
+
+**5. `className` is concatenated unguarded.** Omit it and the root carries a literal
+`undefined` class.
+
+**6. `.initialsText` has a wrong fallback.** It uses
+`var(--font-size-font-size-md, 14px)`, but `md` is 16px everywhere else — so the
+initials shift size depending on whether the tokens stylesheet is loaded.
+
+**7. `onClick` brings no semantics.** Plain `div`, no `cursor: pointer` in the CSS. Add
+`role="button"`, `tabIndex={0}`, `onKeyDown` and a pointer cursor yourself.
+
+**8. No image support.** There is no `imageUrl` prop; workspaces with a logo cannot show
+it. That alone is a reason to move to V2.
+
+**9. `storeName` wraps, it does not ellipsise.** `.storeName` sets `overflow: hidden`
+and `text-overflow: ellipsis` but omits `white-space: nowrap`, so a long workspace name
+breaks to a second line and is then clipped. `.ownerText` does set `nowrap` and
+truncates properly. (`ScWorkspaceSettingsMobile` has the identical bug; V2's `wsName`
+does not.)
+
+---
+
+## In the wild
+
+_No host render site found — used by the agent runtime / composed internally._
+
+To be precise: it is exported from `@streamoid/ui` but no host app renders it, and it is
+not agent-runtime — it has been superseded. The surface it was built for now uses V2:
+`cxo-dashboard/src/app/components/mobile-workspace-switcher.tsx:169` renders
+`ScWorkspaceSwitchMobileV2` with `type="currentWS"`, and `:246` the `otherWS` list.
+
+---
+
+## Related
+
+- `ScWorkspaceSwitchMobileV2` — **the replacement**; use it for anything new.
+- `ScWorkspaceSettingsMobile` — this card plus a team-count row, for the settings screen.
+- `ScWorkspaceSwitchCard` / `StreamoidWorkspaceSwitcher` — the desktop switchers.
+- `ScDp` — what V2 uses for the avatar; this card hand-rolls a 48px initials tile.
+- `ScRoleMobile` / `ScBadges` — if you need a role chip whose colour actually varies.

package/dist/docs/ScWorkspaceSwitchMobileV2.md

@@ -0,0 +1,278 @@
+---
+component: ScWorkspaceSwitchMobileV2
+package: "@streamoid/ui"
+category: mobile
+status: stable
+renders: div
+tags: [mobile, workspace, switcher, switch, current, other, card, role, plan, cxo]
+related: [ScWorkspaceSwitchMobile, ScWorkspaceSettingsMobile, ScWorkspaceSwitchCard, StreamoidWorkspaceSwitcher, ScDp]
+do_not_confuse_with: [ScWorkspaceSwitchMobile, ScWorkspaceSettingsMobile, ScWorkspaceCard, ScWorkspaceSwitchCard, StreamoidWorkspaceSwitcher]
+used_by: [cxo]
+---
+
+# ScWorkspaceSwitchMobileV2
+
+**The mobile workspace row that CXO actually ships.** A full-width rounded row: a 60px
+`ScDp` workspace avatar on the left, then the workspace name over a single meta line
+reading `role · plan · owner-email`. Three `type`s change the chrome — the current
+workspace, a switchable other workspace, and a chrome-less "display" mode for embedding
+in a popup header.
+
+## TL;DR for agents
+
+- **Reach for it when:** you need a workspace identity row on mobile — in the workspace
+  switcher sheet, in mobile settings, or as the header of a workspace popup.
+- **Don't reach for it when:** you're on desktop (→ `ScWorkspaceSwitchCard` /
+  `StreamoidWorkspaceSwitcher`), or you need the older mobile card with an owner row and
+  a separate role badge (→ `ScWorkspaceSwitchMobile`, which this component supersedes).
+- **Four things that will bite you:**
+  1. **`role` is colour-matched by exact string.** `"Member"` renders blue; **everything
+     else** — including `"member"` lowercase — renders amber. Pass the capitalised words.
+  2. **`onClick` brings no semantics.** Plain `div`: no `role`, no `tabIndex`, no
+     `cursor: pointer`. CXO adds `className="w-full cursor-pointer"` at every call site.
+  3. **The `role · plan · owner` dots always render**, even when `plan` or `ownerId` is
+     an empty string, leaving a trailing `·`.
+  4. Every text prop has a demo default, including
+     `wsName = "Workspace name is kepler"`.
+
+---
+
+## 1. How to use it
+
+### Import
+
+```tsx
+import { ScWorkspaceSwitchMobileV2 } from "@streamoid/ui";
+import "@streamoid/ui/dist/index.css"; // once, at your app root
+```
+
+### Minimal usage
+
+```tsx
+<ScWorkspaceSwitchMobileV2
+  wsName={ws.name}
+  initials={ws.initials}
+  imageUrl={ws.imageUrl}
+  role={ws.role === "admin" ? "Admin" : "Member"}
+  plan={ws.plan}
+  ownerId={ws.ownerEmail}
+  type="currentWS"
+/>
+```
+
+### Props
+
+| Prop | Type | Default | Notes |
+|---|---|---|---|
+| `wsName` | `string` | `"Workspace name is kepler"` | ⚠️ Demo default. 16px/500 primary, truncates with ellipsis. |
+| `initials` | `string` | `"WS"` | ⚠️ Demo default. Passed to `ScDp` as `initial`. Used only when `imageUrl` is unset. |
+| `imageUrl` | `string` | – | When set, `ScDp` switches to `type="image"`. |
+| `role` | `string` | `"Admin"` | ⚠️ Demo default. Free text, but **only the exact string `"Member"` turns it blue** — see Gotcha 1. |
+| `plan` | `string` | `"Free"` | ⚠️ Demo default. Second meta segment, tertiary grey. |
+| `ownerId` | `string` | `"rohan@streamoid.com"` | ⚠️ Demo default — a real-looking Streamoid address. Third meta segment; `flex: 1 0 0` so it truncates. |
+| `type` | `"currentWS"` \| `"otherWS"` \| `"display"` | `"currentWS"` | The chrome. See the table below. |
+| `onClick` | `(e: React.MouseEvent) => void` | – | Attached to the root. Bare — see Gotcha 2. |
+| `className` | `string` | – | Appended after internal classes. Unguarded concat — see Gotcha 6. |
+| `...props` | `React.HTMLAttributes<HTMLDivElement>` | – | Spread onto the root `div`. |
+
+### What each `type` renders
+
+| `type` | Background | Border | Padding | Avatar background | Use for |
+|---|---|---|---|---|---|
+| `"currentWS"` | `--alias-surface-raised` | 0.5px `--alias-border-default` | `4px 12px 4px 4px` | forced `--alias-fill-neutral-neutralactive` when there is no `imageUrl` | the workspace you're in |
+| `"otherWS"` | `--alias-surface-base` | 0.5px `--alias-border-subtle` | `4px 12px 4px 4px` | `ScDp` default | workspaces you can switch to |
+| `"display"` | `--alias-surface-base` | **none** | **0** | `ScDp` default | embedding inside another surface (a popup header) — no card chrome at all |
+
+### Role colours
+
+| `role` value | Colour |
+|---|---|
+| `"Member"` | `--alias-text-and-icons-info` (blue) |
+| `"Admin"`, `"admin"`, `"member"`, `"Owner"`, anything else | `--alias-text-and-icons-warning` (amber) |
+
+### Recipes
+
+```tsx
+// Current + other workspaces in a switcher sheet (the CXO shape)
+<ScWorkspaceSwitchMobileV2
+  wsName={current.name}
+  initials={current.initials}
+  imageUrl={current.imageUrl}
+  role={current.role === "admin" ? "Admin" : "Member"}   // exact capitalisation matters
+  plan={current.plan}
+  ownerId={current.ownerEmail}
+  type="currentWS"
+/>
+
+{others.map((ws) => (
+  <ScWorkspaceSwitchMobileV2
+    key={ws._id}
+    wsName={ws.name}
+    initials={ws.initials}
+    imageUrl={ws.imageUrl}
+    role={ws.role === "admin" ? "Admin" : "Member"}
+    plan={ws.plan}
+    ownerId={ws.ownerEmail}
+    type="otherWS"
+    onClick={() => switchTo(ws)}
+    className="w-full cursor-pointer"   // the component supplies no pointer/keyboard affordance
+  />
+))}
+
+// As the identity header of a workspace-options popup — no card chrome
+<ScWorkspaceSwitchMobileV2 {...wsProps} type="display" />
+
+// Derive initials yourself; there is no name→initials fallback
+initials={
+  ws.initials ||
+  ws.name.split(/\s+/).slice(0, 2).map((w) => w[0]?.toUpperCase() ?? "").join("") ||
+  "WS"
+}
+```
+
+---
+
+## 2. Where to use it
+
+All three of CXO's mobile workspace surfaces:
+
+- **`mobile-workspace-switcher.tsx`** — "Current Workspace" then a list of "Other
+  Workspaces" (`type="currentWS"` / `"otherWS"`).
+- **`mobile-settings-content.tsx`** — the same two groups inside the settings screen,
+  each row tappable to open the manage sheet.
+- **`mobile-settings-workspace-options-popup.tsx`** — as the popup's header
+  (`type="display"`), between two hand-drawn dividers.
+
+It composes `ScDp` (`variant="workspace"`, `size={60}`) internally. Don't nest your own
+avatar.
+
+---
+
+## 3. When to use it
+
+### Use it when
+
+- The surface is mobile and the row must be full width.
+- You need the four workspace facts (name, role, plan, owner) in one line of meta.
+- You want the same component to serve "current", "switchable" and "embedded header".
+
+### Don't use it — reach for this instead
+
+| Situation | Use instead |
+|---|---|
+| Desktop sidebar workspace switcher | `StreamoidWorkspaceSwitcher` (config-driven) or `ScWorkspaceSwitchCard` |
+| A workspace summary card on desktop | `ScWorkspaceCard` |
+| Mobile workspace **settings** card with an owner row **and** a team-count row | `ScWorkspaceSettingsMobile` |
+| The older mobile switch card (48px initials box, separate role badge, owner row with icon slot) | `ScWorkspaceSwitchMobile` — but it is superseded by this component; prefer this |
+| A **person's** identity row | `ScProfileV2Mobile` / `ScTableListMobile` |
+| Just the workspace avatar | `ScDp` (`variant="workspace"`) |
+
+### Don't confuse with
+
+| You may actually want | Not this |
+|---|---|
+| `ScWorkspaceSwitchMobile` — the V1 mobile card: `storeName` not `wsName`, `currentWs` boolean not `type`, fixed 326px width, its own 80px always-blue role badge, a separate owner row with an `ownerIcon` slot | This V2 is fluid, has a `type` triad, one meta line, and uses `ScDp` |
+| `ScWorkspaceSettingsMobile` — V1 shape **plus** a `teamCount` row and a `teamIcon` slot | Different screen (workspace settings, not switching) |
+| `ScWorkspaceSwitchCard` — the **desktop** switcher card | Desktop metrics; note also `NscWorkspaceSwitch`, a `@deprecated` alias of `ScWorkspaceSwitchCard` exported from the same file |
+| `ScWorkspaceCard` — a workspace summary tile | Not a switcher row |
+| `StreamoidWorkspaceSwitcher` — the config-driven desktop switcher that owns its own list and open/close state | This component is one row and owns nothing |
+| `NscWorkspaceSwitch` — also exported from `@streamoid/ui` | Yet another namesake; check what you imported |
+
+There is no `ScWorkspaceSwitchMobileV1`. "V1" is `ScWorkspaceSwitchMobile`.
+
+---
+
+## 4. Why to use it
+
+- **One component covers three placements.** The `display` type strips border and
+  padding entirely, so the same row can be a card in a list and a header inside a
+  popup — no duplicate markup, guaranteed identical typography.
+- **It composes `ScDp`**, so the workspace avatar handles image-vs-initials, the
+  rounded-rect `workspace` shape, and sizing consistently with every other avatar in
+  the product. The V1 mobile cards hand-roll a 48px initials box instead.
+- **Fluid by default** (`width: 100%`) — unlike the rest of the `*Mobile` family, which
+  is full of fixed pixel widths (`ScWorkspaceSwitchMobile` is 326px,
+  `ScReferralCardMobile` is 349px, `ScProfileV2Mobile` is 288px).
+- **The meta line's truncation is solved**: `wsName` and `ownerId` both ellipsise inside
+  `min-width: 0` flex children, so long workspace names and long emails never break the
+  row.
+- **Role/plan/owner in one line** keeps the row two lines tall, which is what makes a
+  10-workspace list scannable on a phone.
+
+---
+
+## Gotchas
+
+**1. Role colour is an exact string match on `"Member"`.**
+
+```tsx
+// WRONG — lowercase "member" falls through to the amber (admin) colour
+<ScWorkspaceSwitchMobileV2 role={ws.role} />        // ws.role === "member"
+
+// RIGHT — map to the exact capitalised words
+<ScWorkspaceSwitchMobileV2 role={ws.role === "admin" ? "Admin" : "Member"} />
+```
+
+**2. `onClick` gives you no affordance and no keyboard access.** The root is a plain
+`div`, and the CSS sets no `cursor`. Every CXO call site that passes `onClick` also
+passes `className="w-full cursor-pointer"`. For real accessibility add
+`role="button"`, `tabIndex={0}` and an `onKeyDown`.
+
+**3. The meta separators are unconditional.** The two 16px dot divs always render.
+`plan=""` gives you `Admin · · owner@x.com`; `ownerId=""` gives a trailing `·`. Pass
+`"—"` rather than an empty string.
+
+**4. Demo defaults on all five text props** (`wsName`, `initials`, `role`, `plan`,
+`ownerId`), including a real-looking address
+(`rohan@streamoid.com`) and `"Workspace name is kepler"`. Rendering the row bare in a
+placeholder ships a fake workspace.
+
+**5. `initials` has no name-derived fallback.** Unlike `ScProfileV2Mobile` and
+`ScReferralCardMobile`, this component does not compute initials from the name — omit
+`initials` and you get the literal `"WS"`. Compute them at the call site.
+
+**6. `className` is concatenated unguarded.** Omit it and the root carries a literal
+`undefined` class.
+
+**7. The avatar is a fixed 60px.** `size={60}` is hardcoded in the call to `ScDp`
+(which also defaults to 60), so the row height is fixed regardless of your text sizes.
+`ScDp` accepts no `onClick` and no props spread, so the whole click target is the root.
+
+**8. `type="currentWS"` overrides the avatar background.** When there is no `imageUrl`
+the initials tile is forced to `--alias-fill-neutral-neutralactive` via an inline
+`style`, so it looks different from an `otherWS` row with the same initials. That is
+deliberate; you cannot turn it off.
+
+---
+
+## In the wild
+
+```tsx
+// cxo-dashboard  src/app/components/mobile-settings-content.tsx:313
+<ScWorkspaceSwitchMobileV2
+  wsName={currentWs.name}
+  initials={currentWs.initials}
+  imageUrl={currentWs.imageUrl}
+  role={currentWs.role === "admin" ? "Admin" : "Member"}
+  plan={currentWs.plan}
+  ownerId={currentWs.ownerEmail}
+  type="currentWS"
+  onClick={() => handleWsCardClick(currentWs)}
+  className="w-full cursor-pointer"
+/>
+```
+
+Also rendered at `src/app/components/mobile-workspace-switcher.tsx:169` (current) and
+`:246` (others), and as a chrome-less header at
+`src/app/components/mobile-settings-workspace-options-popup.tsx:95` (`type="display"`).
+
+---
+
+## Related
+
+- `ScWorkspaceSwitchMobile` — the superseded V1 mobile card (fixed width, `currentWs`
+  boolean, separate role badge).
+- `ScWorkspaceSettingsMobile` — V1 shape plus a team-count row, for the settings screen.
+- `ScWorkspaceSwitchCard` / `StreamoidWorkspaceSwitcher` — the desktop switchers.
+- `ScWorkspaceCard` — a workspace summary tile.
+- `ScDp` — the avatar it composes; `variant="workspace"`, `size={60}`.